<template>
  <div class="water-analysis-page">
    <el-table :key="isFlag" :data="tableData" v-loading="tableLoading" max-height="500">
      <el-table-column type="index" width="55" label="序号" />
      <el-table-column :label="i.label" :prop="i.props" show-overflow-tooltip v-for="i in dwwhCloum">
        <template #default="{ row }" v-if="i.props == 'unitType'">
          <dict-tag :options="unit_type" :value="row.unitType" />
        </template>
        <template #default="{ row }" v-if="i.props == 'unitProperty'">
          <dict-tag :options="unit_property" :value="row.unitProperty" />
        </template>
        <template #default="{ row }" v-if="i.props == 'unitPhone'">
          <span :title="row.unitPhone">{{ row.unitPhone.replace(/^(.{3})(?:\d+)(.{4})$/, '$1****$2') }}</span>
        </template>
        <template #default="{ row }" v-if="i.props == 'primaryConcatPersonInformation'">
          <span :title="row.primaryConcatPersonInformation">{{
            row.primaryConcatPersonInformation.replace(/^(.{3})(?:\d+)(.{4})$/, '$1****$2')
          }}</span>
        </template>
        <template #default="{ row }" v-if="i.props == 'creditLine'">
          <dict-tag :options="credit_line" :value="row.creditLine" />
        </template>
        <template #default="{ row }" v-if="i.props == 'registryDate'">
          {{ row.registryDate.substring(0, 10) }}
        </template>
      </el-table-column>
      <el-table-column label="操作" width="210">
        <template #default="{ row }">
          <el-button icon="View" link type="primary" @click="onCheck(row, 1, '详情')">详情</el-button>
          <el-button icon="Edit" link type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
          <el-button icon="Delete" link type="danger" @click="onCheck(row, 3)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      :total="FormList.totals || 0"
      v-model:page="FormList.pageNum"
      v-model:limit="FormList.pageSize"
      @pagination="getInfoList(FormList)"
    />
  </div>

  <!-- <projectTable v-else @returnClick="returnClick" :category='category'></projectTable> -->
  <!-- 查看详情弹框 -->
  <el-dialog
    v-model="visible"
    :title="'单位维护' + title"
    :modal-append-to-body="false"
    :close-on-click-modal="false"
    width="65%"
    style="height: auto; overflow: hidden"
  >
    <tableDalgo ref="tableDalgoRef" :key="isFlag" @onModalClose="onModalClose" :typeList="typeList"></tableDalgo>
    <template #footer>
      <div class="dialog-footer">
        <el-button v-show="typeList.type != 1" type="primary" @click="submit">确定</el-button>
        <el-button @click="visible = false">取消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { getInfo, projectInfoDelete, projectCompanyGet } from '@/api/project/dwwh';
import tableDalgo from './tableDalgo.vue';
import { formatMonths } from '@/utils';
import emgBox from '@/utils/ElMessageBox';
import { FileSystemList } from '@/api/project/tenderReview';
import { dwwhCloum } from '@/utils/cloums';

const { proxy } = getCurrentInstance();
const { unit_type, unit_property, credit_line } = proxy.useDict('unit_type', 'unit_property', 'credit_line');
const props = defineProps({
  tableData: {
    type: Object,
  },
});
const FormList = ref({
  pageNum: 1,
  pageSize: 10,
});
let visible = ref(false);
let isFlag = ref(1);
let title = ref();
const tableDalgoRef = ref();

//动态组件
let dataForm = reactive({
  date: formatMonths(new Date()),
  tableData: '',
  tableDateTwo: '',
  tableLoading: true,
});
let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
//获取列表数据
const getInfoList = async prams => {
  tableLoading.value = true;
  let { data, total } = await getInfo(prams);
  tableData.value = data;
  FormList.value.totals = total;

  setTimeout(() => {
    tableLoading.value = false;
  }, 1000);
};
//搜索
const search = p => {
  FormList.value = { ...FormList.value, ...p };
  getInfoList(p);
  isFlag.value++;
  // getTableData(Date.parse(date.value));
};
const resetFormList = () => {
  FormList.value = { pageNum: 1, pageSize: 10 };
};
defineExpose({ search, resetFormList });
// 查看上报数据
let typeList = ref({});
const onCheck = (row, ty, t) => {
  title.value = t;
  if (ty == 1 || ty == 2) {
    projectCompanyGet(row.id).then(({ code, data }) => {
      if (code == 200) {
        typeList.value = data;
        typeList.value.type = ty;
        FileSystemList({
          refId: row.id,
          refType: 'proProjectCompany',
        }).then(({ data }) => {
          typeList.value.fileList1 = data;
          visible.value = true;
          isFlag.value++;
        });
      }
    });
  } else if (ty == 3) {
    emgBox(row.id, projectInfoDeleteM, '您确定删除吗？');
  }
};
//删除
const projectInfoDeleteM = async id => {
  let { code } = await projectInfoDelete(id);
  getInfoList(FormList.value);
};
function onModalClose() {
  visible.value = false;
  getInfoList(FormList.value);
}
function submit() {
  tableDalgoRef.value.submit();
}
onMounted(() => {
  FormList.value = props.tableData;
  getInfoList(FormList.value);
});
</script>
<style lang="scss" scoped>
.water-analysis-page {
  height: 90vh;
  .top {
    // margin-bottom: 15px;
  }

  .el-input__inner {
    // color: #fff;//
  }

  :deep .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
    font-size: 18px;
    color: rgb(255, 255, 255);
    background-color: rgb(22, 132, 252);
    border-left: 1px solid rgb(22, 132, 252);
  }
}

:deep(.el-dialog__body) {
  background-color: #eef1fb;
  height: 750px;
  overflow: auto;
}
</style>