<template>
  <div>
    <BasicTable @register="registerTable">
      <template #toolbar>
        <PermissionBtn @btn-event="onBtnClicked" />
      </template>
      <template #bodyCell="{ column, record, text }">
        <template v-if="['currentStatusName'].includes(column.key)">
          <a @click="showStatusList(record, column.key)">{{ text }}</a>
        </template>
      </template>
    </BasicTable>
    <a-modal
      :footer="null"
      v-model:open="showStatusModal"
      title="处理流程"
      :destroyOnClose="true"
    >
      <ShowStatusList :statusData="statusData" :statusItems="statusItems"/>
    </a-modal>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue"
import { PermissionBtn } from '@/components/PermissionBtn/index';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { columns, searchFormSchema } from './utils'
import { GetReportStatistics } from '@/api/illegalconstruction/statistical'
import ShowStatusList from './ShowStatusList/index.vue'
import { getAppEnvConfig } from '@/utils/env';
import axios from "axios";
const { VITE_GLOB_API_URL } = getAppEnvConfig();

const showStatusModal = ref(false)
const statusData = ref(0)
const statusItems = ref([])

const [registerTable, { setTableData, reload, clearSelectedRowKeys, setPagination, setLoading }] =useTable({
  title: '违法处置台账',
  api: GetReportStatistics,
  columns,
  formConfig: {
    labelWidth: 120,
    schemas: searchFormSchema,
  },
  rowKey: 'id',
  useSearchForm: true,
  showTableSetting: true,
  bordered: true,
  // 搜索
  handleSearchInfoFn(info) {
    return info;
  },
  // actionColumn: {
  //   width: 80,
  //   title: '操作',
  //   dataIndex: 'action',
  //   fixed: 'right',
  // },
});
const onBtnClicked = (domId) => {
  switch (domId) {
    case 'btnExport':
      axios({
        method: 'get',
        url: VITE_GLOB_API_URL + '/api/MiViolationReport/ExportViolationReportDetails',
        headers: {
          'X-Token': localStorage.getItem('X-Token'),
        },
        responseType: 'blob',
      }).then((res) => {
        const elink = document.createElement('a');
        elink.download = '违法处置台账' + new Date().getTime() + '.xls';
        elink.style.display = 'none';
        elink.href = URL.createObjectURL(res.data);
        document.body.appendChild(elink);
        elink.click();
        URL.revokeObjectURL(elink.href);
        document.body.removeChild(elink);
      });
      break;
    default:
      break;
  }
}
const showStatusList = (record, key) => {
  console.log(record, key)
  statusData.value = record.status
  const base = [
    { title: "待处理" },
  ]
  if (statusData.value === 2) {
    base.push({ title: "初审审核拒绝" })
  } else {
    base.push({ title: "初审审核通过" })
  }
  if (statusData.value === 2) {
    return base
  }

  if (statusData.value === 4) {
    base.push({ title: "复审审核拒绝" })
    return base
  } else {
    base.push({ title: "复审审核通过" })
  }
  base.push(
    { title: "已开单提车" },
    { title: "已审核" },
    { title: "已提车" }
  )
  statusItems.value = base
  showStatusModal.value = true
}
</script>

<style lang="scss" scoped></style>
