<template>
  <div class="water-analysis-page">
    <el-table :key="isFlag" :data="tableData" stripe max-height="500" v-loading="tableLoading">
      <el-table-column type="index" width="55" label="序号" align="center" />
      <el-table-column :label="i.value" align="center" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" align="center" width="200">
        </el-table-column>
        <template #default="{ row }" v-if="i.key == 'standardFlag'">
          <span
            :style="{ 'color': isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ)  ? 'success' : 'error'">{{isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标' }}</el-tag>
          </span>
        </template>
        <template #default="{ row }" v-if="i.key == 'attachFileList'">
          <span style="color: #108ee9;" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }}
          </span>
        </template>
        <template #default="{ row }" v-if="i.key == 'year'">
          {{ row.year }}
        </template>
        <template #default="{ row }" v-if="i.key == 'updateBy'">
          {{ row.updateBy }}
        </template>
        <template #default="{ row }" v-if="i.key == 'updateTime'">
          {{ row.updateTime }}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="250" align="center">
        <template #default="{ row }">
          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

  </div>
  <pagination v-show="FormList.totals > 0" :total="FormList.totals" v-model:page="FormList.pageNum"
    v-model:limit="FormList.pageSize" @pagination="dynamic_page_data_typeM(FormList)" />
  <el-dialog v-model="visible" :title="'内涝防治标准' + FormList.title" :modal-append-to-body="false"
    :close-on-click-modal="false" width="51%">
    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag">
    </tableDalgo>
    <template #footer>
      <div class="dialog-footer">
        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
        <el-button @click="visible = false">关闭</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { defineExpose } from "vue";
import {
  getInfo,
  projectInfoDelete,
  projectInfoGet,
  dynamic_page_data_type
} from "@/api/prevention";
import { FileSystemList } from "@/api/project/tenderReview";
import tableDalgo from "./tableDalgo.vue";
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { fund_source, unit_list } = proxy.useDict("fund_source", 'unit_list');
import { reactive } from "vue";
let visible = ref(false);
let isFlag = ref(1);
const cloums = ref([])
const standardFlag = ref('')
const tableDalgoRef = ref();
const { params } = defineProps(['params']);
const FormList = ref({
  pageNum: 1,
  pageSize: 10,
  title: "",
});
//动态组件
let dataForm = reactive({
  tableData: "",
  tableDateTwo: "",
  tableLoading: true,
});
let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
//获取列表数据
//搜索
const search = (p) => {
  dynamic_page_data_typeM(p);
  isFlag.value++;
};
defineExpose({ search });
// 查看上报数据
let typeList = ref({});
const onCheck = (row, ty, t) => {
  FormList.value.title = t;
  if (ty == 1 || ty == 2) {
    typeList.value = { ...params, data: row, type: ty, monitorDynamicTableTitleList: cloums.value, iSstandardFlag: 
      
      isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ)};
    FileSystemList({
      refId: row.performanceEvaluateId,
      refType: "proProjectBudget",
    }).then(({ data }) => {
      typeList.value.fileList1 = data;
      visible.value = true;
    });
    // 获取文件列表
  } else if (ty == 3) {
    proxy.$modal
      .confirm(`是否确认删除?`)
      .then(async () => {
        projectInfoDeleteM(row.performanceEvaluateId)
        getTableData();
      })
      .catch(() => { });
  }
};
//删除
const projectInfoDeleteM = async (id) => {
  let { code } = await projectInfoDelete(id);
  search(p);
};
const dynamic_page_data_typeM = async (id) => {
  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
  tableData.value = data;
  FormList.value.totals = total;
  cloums.value = monitorDynamicTableTitleList
  tableLoading.value = false
};
function onModalClose() {
  visible.value = false;
  // dynamic_page_data_typeM();
  dynamic_page_data_typeM(params);
}

function open2() {
  tableDalgoRef.value.submit();
}
function handlePreview(file) {
  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
    () => window.open(file.url),
    () => false
  );
}
function isDb(v, m, n, f) {
  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0
}
onMounted(() => {
  dynamic_page_data_typeM(params)
});
</script>
<style lang="scss" scoped>
:deep(.el-dialog__body) {

  height: 520px;
  overflow: auto;
}
</style>