vent-template/src/views/vent/monitorManager/windrectMonitor/components/modalTable.vue

<template>
  <BasicTable @register="registerTable" :rowSelection="rowSelection" :scroll="{ y: 450 }" />
</template>
<script lang="ts">
  import { defineComponent, onMounted, ref, watch } from 'vue';
  import { BasicTable } from '/@/components/Table';
  import { useListPage } from '/@/hooks/system/useListPage';
  import { list } from '/@/views/vent/monitorManager/windrectMonitor/windrect.api';
  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';

  export default {
    name: 'ModalTable',
    components: { BasicTable },
    props: {
      deviceType: {
        type: String,
        required: true,
      },
    },

    setup(props) {
      const columns = getTableHeaderColumns(props.deviceType);
      const dataTableSource = ref<any[]>([]);
      // 列表页面公共参数、方法
      const { tableContext, onExportXls } = useListPage({
        designScope: 'windrect_list',
        tableProps: {
          title: '',
          dataSource: dataTableSource,
          rowKey: 'deviceID',
          columns: columns,
          size: 'small',
          actionColumn: {
            width: 180,
          },
          pagination: false,
          showActionColumn: false,
          showTableSetting: false,
          showIndexColumn: true,
          bordered: false,
          useSearchForm: false,
          autoCreateKey: true,
          beforeFetch: (params) => {
            return Object.assign({ column: 'createTime', order: 'desc' }, params);
          },
        },
      });
      //注册table数据
      const [registerTable, { clearSelectedRowKeys, setSelectedRowKeys }, { rowSelection, selectedRowKeys }] = tableContext;
      onMounted(() => {
        list({ devicetype: 'windrect', pagetype: 'normal', pageSize: 1000 }).then((res) => {
          if (res && res.msgTxt[0]) {
            const dataList: any[] = [];
            if (res.msgTxt[0].datalist && res.msgTxt[0].datalist.length > 0) {
              res.msgTxt[0].datalist.forEach((data: any) => {
                const readData = data.readData;
                data = Object.assign(data, readData);
                dataList.push(data);
              });
              dataTableSource.value = dataList;
            }
          }
        });
      });
      return {
        registerTable,
        onExportXls,
        clearSelectedRowKeys,
        setSelectedRowKeys,
        selectedRowKeys,
        rowSelection,
      };
    },
  };
</script>