gas-injection/src/views/vent/monitorManager/windrectMonitor/components/resultTable.vue

<template>
  <!-- <BasicTable @register="registerTable" @edit-change="handleEditChange">
    <template #action="{ record, column }">
      <TableAction :actions="createActions(record, column)" />
    </template>
  </BasicTable> -->
  <a-table :columns="resultColumns" :data-source="dataSource" rowKey="id" class="components-table-demo-nested" :loading="loading" size="small">
    <template #bodyCell="{ record, column }">
      <template v-if="column.dataIndex === 'action'">
        <a class="table-action-link" @click="upload(record)">导出</a>
        <!-- <TableAction :actions="createActions(record, column)" /> -->
        <!-- <a href="javascript:void(0)" ><Icon icon="ant-design:delete-outlined"></Icon></a> -->
      </template>
    </template>
    <template #expandedRowRender="{ record }">
      <a-empty v-if="record.testDetail && record.testDetail.length < 1" />
      <a-table v-else :columns="innerResultColumns" :data-source="record.testDetail" rowKey="id" size="small" :pagination="false">
        <template #bodyCell="{ record, column }">
          <template v-if="record[column.dataIndex] === null">
            <span>-</span>
          </template>
        </template>
      </a-table>
    </template>
    <!-- <template></template> -->
  </a-table>
</template>
<script lang="ts">
  import { resultList } from '/@/views/vent/monitorManager/windrectMonitor/windrect.api';
  import { ref, onMounted } from 'vue';
  import { resultColumns, innerResultColumns } from '../windrect.data';
  import { BasicTable, TableAction, BasicColumn, ActionItem, EditRecordRow } from '/@/components/Table';
  import { getExportUrl } from '../windrect.api';
  import { useMethods } from '/@/hooks/system/useMethods';

  export default {
    name: 'ResultTable',
    components: { TableAction },
    props: {
      deviceType: {
        type: String,
        required: true,
      },
    },
    setup() {
      const loading = ref(false);
      const dataSource = ref([]);
      const { handleExportXls } = useMethods();

      const getMonitor = () => {
        resultList({}).then((res) => {
          loading.value = false;
          dataSource.value = res.records;
        });
      };

      function createActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
        return [
          {
            label: '导出',
            onClick: handleExportXls.bind(null, '测风报表-' + new Date().toLocaleString(), getExportUrl, { testid: record.id }),
          },
        ];
      };

      function upload(record: EditRecordRow) {
        let d = new Date();
        let customFormattedDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
        handleExportXls('测风报表-' + customFormattedDate, getExportUrl, { testid: record.id });
      };

      onMounted(() => {
        loading.value = true;
        getMonitor();
      });

      return {
        dataSource,
        resultColumns,
        innerResultColumns,
        loading,
        createActions,
        upload
      };
    },
  };
</script>