Sanakey
3 天以前 b5c1614fe473330ceca8b7cff0f1802e19bd5039
src/views/clues/components/Table.vue
@@ -1,6 +1,6 @@
<template>
  <div class="p-4 flex flex-col">
    <Drawer @register="registerDrawer" @success="handleSuccess"/>
    <Drawer :destroyOnClose="true" @register="registerDrawer" @success="handleSuccess"/>
    <!--    <div class="mb-4">-->
    <!--      <a-button class="mr-2" @click="reloadTable"> 还原 </a-button>-->
    <!--      <a-button class="mr-2" @click="changeLoading"> 开启loading </a-button>-->
@@ -23,6 +23,7 @@
      @edit-end="handleEditEnd"
      @edit-cancel="handleEditCancel"
      :beforeEditSubmit="beforeEditSubmit"
      :searchInfo="searchInfo"
    >
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'tags'">
@@ -86,17 +87,17 @@
  </div>
</template>
<script lang="ts" setup>
import {ref,} from 'vue';
import {reactive, ref,} from 'vue';
import {
  BasicTable,
  ColumnChangeParam,
  TableAction,
  useTable
} from '@/components/Table';
import {getEditCellColumns, getFormConfig} from './tableData';
import {getEditCellColumns} from './tableData';
import {useMessage} from '@/hooks/web/useMessage';
import {Tag} from 'ant-design-vue';
import {cluesListApi} from "@/api/clues/table";
import {cluesListApi} from "@/api/clues/list";
// import {useModal} from "@/components/Modal";
import Drawer from "./Drawer.vue";
import {useDrawer} from "@/components/Drawer";
@@ -105,6 +106,9 @@
// import {Dropdown, type DropMenu} from "@/components/Dropdown";
// const [register, { openModal: openModal }] = useModal();
// const [registerPersonnelModal, { openModal: openPersonnelModal }] = useModal();
import {useCluesRowStore} from "@/store/modules/cluesRowData";
const [registerDrawer, {openDrawer}] = useDrawer();
const {createMessage} = useMessage();
@@ -169,7 +173,7 @@
//
//   return dropMenuList;
// });
const searchInfo = reactive<Recordable>({});
function onChange() {
  console.log('onChange', arguments);
@@ -196,11 +200,31 @@
  // title: 'useTable示例',
  // titleHelpMessage: '使用useTable调用表格内方法',
  api: cluesListApi,
  // beforeFetch: (params) => {
  //   console.log('beforeFetch', params);
  beforeFetch: (params) => {
    Logger.log('beforeFetch', params);
  //   params.pageNo = params.page;
  //   // return Promise.resolve(params);
  // },
    params.type = 'all';
    // params.searchTxt = {
    //   cluesName: '',
    //   isRead: 1,
    // }
    // delete params.page;
    // return Promise.resolve(params);
  },
  fetchSetting: {
    pageField: 'pageNo',
  },
  afterFetch: () => {
    const result = getRawDataSource();
    Logger.log('afterFetch', result);
    // setTimeout(() => {
    //   setPagination({
    //     total: 100,
    //   });
    // }, 1000);
    return result.data.data;
  },
  columns: getEditCellColumns(),
  // defSort: {
  //   pageNo: 1,
@@ -213,7 +237,36 @@
  showIndexColumn: false, // 是否显示序号列
  useSearchForm: true, // 使用搜索表单
  clickToRowSelect: false,
  formConfig: getFormConfig(), // 搜索表单配置
  formConfig: {
    labelWidth: 100,
    layout: 'horizontal',
    rowProps: {
      justify: 'end',
    },
    showResetButton: false,
    showSubmitButton: false,
    autoSubmitOnEnter: true,
    schemas: [
      {
        field: `searchTxt.cluesName`,
        label: `搜索`,
        component: 'Input',
        colProps: {
          xl: 12,
          xxl: 8,
        },
        // componentProps: {
        //   onSearch: (value) => {
        //     console.log(value);
        //   },
        // },
      },
    ],
  }, // 搜索表单配置
  handleSearchInfoFn(info) {
    console.log('handleSearchInfoFn', info);
    return info;
  },
  tableSetting: {
    // 是否显示刷新按钮
    redo: true,
@@ -225,6 +278,7 @@
    fullScreen: true
  },
  pagination: {
    total: 0,
    // pageSize: 20,
    pageSizeOptions: ['10', '20', '50', '100'],
    defaultPageSize: 20,
@@ -345,9 +399,11 @@
function handleRowClick(data) {
  Logger.log('handleRowClick', data);
  openDrawer(true, {
    isUpdate: false,
    isUpdate: true,
    clue: data
  });
  const cluesRowStore= useCluesRowStore();
  cluesRowStore.setRowData(data);
}
function handleCellClick() {