<template>
  <!-- 初步调查的 -->
  <div class="w-full flex justify-end" v-if="type == 'edit'">
    <a-space>
      <a-button type="primary" @click.stop="handleExportXls('初步调查污染物信息模板', wrwmb)">模板下载</a-button>
      <a-upload name="file" :showUploadList="false" accept=".xls,.xlsx" :customRequest="(d) => onImportXls(d)" @click.stop class="ml-2">
        <a-button type="primary">导入</a-button>
      </a-upload>
      <a-button type="primary" @click="del">删除</a-button>
    </a-space>
  </div>
  <a-table :dataSource="dataSource" :columns="columns" :pageSizeOptions="['10']" :scroll="{ y: 500 }">
    <template #bodyCell="{ column, index }">
      <template v-if="column.key == 'index'">
        {{ index + 1 }}
      </template>
    </template>
  </a-table>
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useMethods } from '/@/hooks/system/useMethods';
  import { getWrwList, addWrw, deleteWrw, wrwmb } from '@/api/common/api';

  import { Modal } from 'ant-design-vue';

  const { createMessage } = useMessage();
  const props = defineProps({
    type: {
      type: String,
      default: 'edit',
    },
    wrdkid: {
      type: String,
      default: '',
    },
  });
  const { handleImportXls, handleExportXls } = useMethods();
  const dataSource = ref();
  const columns = ref<any>([
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
    },
    {
      title: '检测项编号',
      dataIndex: 'elementNo',
      key: 'elementNo',
    },
    {
      title: '检测项名称',
      dataIndex: 'elementName',
      key: 'elementName',
    },
    {
      title: '检测项类型',
      dataIndex: 'elementType',
      key: 'elementType',
    },
    {
      title: 'CAS码',
      dataIndex: 'cas',
      key: 'cas',
    },
    {
      title: '检测项类别',
      dataIndex: 'elementLb',
      key: 'elementLb',
    },
    {
      title: '检测项分类',
      dataIndex: 'elementFl',
      key: 'elementFl',
    },
  ]);

  // 获取地块污染信息列表
  async function init() {
    const res = await getWrwList({ wrdkid: props.wrdkid });
    dataSource.value = res.records;
  }
  init();

  function onImportXls(d) {
    d.data = { wrdkid: props.wrdkid };

    const file = d.file;
    if (file.type != 'application/vnd.ms-excel' && file.type != 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
      createMessage.error('只能上传xls格式');
      return;
    }

    handleImportXls(d, addWrw, (res) => {
      if (res.code === 200) {
        init();
      }
    });
  }
  // 点击删除
  async function del() {
    Modal.confirm({
      title: '确认删除',
      content: '是否删除所有数据',
      centered: true,
      okText: '确认',
      cancelText: '取消',
      onOk: async () => {
        await deleteWrw({ wrdkid: props.wrdkid });
        init();
      },
    });
  }
</script>
