perf(smart-table): 完善表格尺寸配置

src/components/SmartTable/src/SmartTable.tsx

@@ -1,4 +1,9 @@
-import type { SmartTableProps, TableActionType } from './types/SmartTableType';
+import type {
+  SmartTableInnerActionType,
+  SmartTableInnerRegisterActionType,
+  SmartTableProps,
+  TableActionType,
+} from './types/SmartTableType';
 import type { VxeGridInstance } from 'vxe-table';
 
 import { computed, defineComponent, provide, Ref, ref, unref } from 'vue';
@@ -60,6 +65,12 @@ export default defineComponent({
       innerPropsRef.value = { ...unref(innerPropsRef), ...props };
     };
 
+    const tableInnerAction: SmartTableInnerRegisterActionType = {
+      registerInnerAction: (action: SmartTableInnerActionType) => {
+        Object.assign(tableInnerAction, action);
+      },
+    };
+
     // -------------- 分页 ---------------------------
     const {
       getPaginationInfo,
@@ -163,6 +174,11 @@ export default defineComponent({
      */
     const { setColumnSortConfig, computedColumnSort } = useSmartTableColumnConfig(getTableInstance);
 
+    // const { computedTableSize } = useSmartTableSizeSetting(
+    //   getTableInstance,
+    //   tableInnerAction,
+    //   props.size,
+    // );
     // ------------- toolbar配置 ----------------------
 
     const { getToolbarConfigInfo } = useTableToolbarConfig(getTableProps, t, {
@@ -230,6 +246,7 @@ export default defineComponent({
         ...unref(getTableEvents),
         ...unref(computedTableClassStyle),
         onPageChange: handlePageChange,
+        // size: unref(computedTableSize),
       };
     });
 
@@ -297,7 +314,12 @@ export default defineComponent({
       });
     });
 
-    createTableContext({ ...tableAction, wrapRef, getBindValues: getTableBindValues });
+    createTableContext({
+      ...tableAction,
+      wrapRef,
+      getBindValues: getTableBindValues,
+      tableInnerAction,
+    });
 
     emit('register', tableAction, searchFormAction, getAddEditForm);
 

src/components/SmartTable/src/components/SmartTableSizeSetting.tsx

@@ -1,7 +1,7 @@
 import type { SmartTableToolbarSizeSetting } from '@/components/SmartTable';
-import type { VxeButtonProps } from 'vxe-table';
+import type { SizeType, VxeButtonProps } from 'vxe-table';
 
-import { defineComponent, h } from 'vue';
+import { defineComponent, h, onMounted } from 'vue';
 
 import { Menu, Dropdown } from 'ant-design-vue';
 import { ColumnHeightOutlined } from '@ant-design/icons-vue';
@@ -9,6 +9,12 @@ import { t as vxeI18n } from 'vxe-table';
 
 import { useTableContext } from '../hooks/useSmartTableContext';
 
+const SMART_TABLE_SIZE_SETTING = 'SMART_TABLE_SIZE_SETTING';
+
+const getTableSize = (tableId: string) => {
+  return JSON.parse(localStorage.getItem(SMART_TABLE_SIZE_SETTING) || '{}')[tableId];
+};
+
 export default defineComponent({
   name: 'SmartTableSizeSetting',
   props: {
@@ -23,7 +29,33 @@ export default defineComponent({
       tableContext.setProps({
         size: e.key,
       });
+      setTableSize(e.key);
     };
+    const setTableSize = (size: SizeType) => {
+      const tableId = tableContext.getTableInstance()?.id;
+      if (!tableId) {
+        return;
+      }
+      const allConfig = JSON.parse(localStorage.getItem(SMART_TABLE_SIZE_SETTING) || '{}') || {};
+      allConfig[tableId] = size;
+      localStorage.setItem(SMART_TABLE_SIZE_SETTING, JSON.stringify(allConfig));
+    };
+
+    onMounted(() => {
+      const tableId = tableContext.getTableInstance()?.id;
+      if (!tableId) {
+        return;
+      }
+      if (tableContext.getTableInstance()?.customConfig?.storage !== true) {
+        return;
+      }
+      const size = getTableSize(tableId);
+      if (size) {
+        tableContext.setProps({
+          size,
+        });
+      }
+    });
     return {
       handleChangeSize,
     };

src/components/SmartTable/src/hooks/useSmartTableColumnConfig.ts

@@ -20,6 +20,7 @@ export const useSmartTableColumnConfig = (getTableInstance: () => VxeGridInstanc
         return field;
       })
       .filter((item) => item !== undefined && item !== null);
+    // TODO:使用统一缓存
     const allConfig =
       JSON.parse(localStorage.getItem(SMART_TABLE_CUSTOM_COLUMN_SORT) || '{}') || {};
     allConfig[tableId] = columns;

src/components/SmartTable/src/hooks/useSmartTableContext.ts

@@ -1,4 +1,8 @@
-import type { SmartTableProps, TableActionType } from '../types/SmartTableType';
+import type {
+  SmartTableInnerActionType,
+  SmartTableProps,
+  TableActionType,
+} from '../types/SmartTableType';
 import type { ComputedRef, Ref } from 'vue';
 import { inject, provide } from 'vue';
 
@@ -7,6 +11,7 @@ const key = Symbol('smart-table');
 type Instance = TableActionType & {
   wrapRef: Ref<Nullable<HTMLElement>>;
   getBindValues: ComputedRef<Recordable>;
+  tableInnerAction: SmartTableInnerActionType;
 };
 
 type RetInstance = Omit<Instance, 'getBindValues'> & {

src/components/SmartTable/src/types/SmartTableType.ts

@@ -162,3 +162,14 @@ export interface TableActionType {
   useYnByCheckbox: (useYn: boolean) => Promise<boolean | undefined>;
   useYnByRow: (row: any | any[], useYn: boolean) => Promise<boolean | undefined>;
 }
+
+/**
+ * 表格内部函数
+ */
+export interface SmartTableInnerActionType {
+  // nothing
+}
+
+export interface SmartTableInnerRegisterActionType extends SmartTableInnerActionType {
+  registerInnerAction: (action: SmartTableInnerActionType) => void;
+}

src/modules/smart-system/views/parameter/SysParameterListView.vue

@@ -51,6 +51,7 @@
   };
 
   const [registerTable, { editByRowModal, deleteByRow }] = useSmartTable({
+    id: 'smart-system-sysParameter',
     columns: getTableColumns(),
     height: 'auto',
     pagerConfig: true,
@@ -60,6 +61,7 @@
     columnConfig: {
       resizable: true,
     },
+    customConfig: { storage: true },
     rowConfig: {
       keyField: 'id',
       isHover: true,