feat: 表格异步初始化column

frontend/src/components/pure/ms-table/useTable.ts

@@ -39,7 +39,7 @@ export default function useTableProps<T>(
     data: [], // 表格数据
     /**
      * 表格列配置
-     * 当showSetting为true时，此配置无效,通过TableStore.initColumn(tableKey: string, column: MsTableColumn)初始化。
+     * 当showSetting为true时，此配置无效,通过 await tableStore.initColumn(tableKey: string, column: MsTableColumn)初始化。
      * 当showSetting为false时，此配置生效
      */
     columns: [] as MsTableColumn,

frontend/src/layout/page-layout.vue

@@ -3,7 +3,9 @@
     <transition name="fade" mode="out-in" appear>
       <!-- transition内必须有且只有一个根元素，不然会导致二级路由的组件无法渲染 -->
       <div v-show="true" class="page-content">
-        <component :is="Component" v-if="!route.meta.isCache" :key="route.fullPath" />
+        <Suspense v-if="!route.meta.isCache">
+          <component :is="Component" :key="route.fullPath" />
+        </Suspense>
         <keep-alive v-else>
           <component :is="Component" :key="route.fullPath" />
         </keep-alive>

frontend/src/views/api-test/index.vue

@@ -157,7 +157,7 @@
 
   const tableStore = useTableStore();
 
-  tableStore.initColumn(TableKeyEnum.API_TEST, columns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.API_TEST, columns, 'drawer');
 
   const { propsRes, propsEvent, loadList } = useTable(getTableList, {
     columns,

frontend/src/views/project-management/projectAndPermission/member/index.vue

@@ -168,7 +168,7 @@
       showInTable: true,
     },
   ];
-  tableStore.initColumn(TableKeyEnum.PROJECT_MEMBER, columns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.PROJECT_MEMBER, columns, 'drawer');
 
   const tableBatchActions = {
     baseAction: [

frontend/src/views/setting/organization/member/index.vue

@@ -204,7 +204,7 @@
       showDrag: false,
     },
   ];
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_MEMBER, columns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_MEMBER, columns, 'drawer');
 
   const tableBatchActions = {
     baseAction: [

frontend/src/views/setting/organization/project/orgProject.vue

@@ -171,7 +171,7 @@
     }
   };
 
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_PROJECT, organizationColumns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_PROJECT, organizationColumns, 'drawer');
 
   const { propsRes, propsEvent, loadList, setKeyword, setLoadListParams } = useTable(
     postProjectTableByOrg,

frontend/src/views/setting/organization/template/components/fieldSetting.vue

@@ -129,7 +129,7 @@
       showDrag: false,
     },
   ];
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_FIELD_SETTING, fieldColumns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_FIELD_SETTING, fieldColumns, 'drawer');
 
   const { propsRes, propsEvent, loadList, setLoadListParams, setProps } = useTable(getFieldList, {
     tableKey: TableKeyEnum.ORGANIZATION_TEMPLATE_FIELD_SETTING,

frontend/src/views/setting/organization/template/components/templateManagement.vue

@@ -107,7 +107,7 @@
     },
   ];
 
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT, fieldColumns, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT, fieldColumns, 'drawer');
   const { propsRes, propsEvent, loadList, setLoadListParams, setProps } = useTable(getOrganizeTemplateList, {
     tableKey: TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT,
     scroll: { x: '1000px' },

frontend/src/views/setting/organization/template/components/templateManagementTable.vue

@@ -139,7 +139,7 @@
     };
   }
 
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_FIELD, columns.value, 'drawer');
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_FIELD, columns.value, 'drawer');
   const { propsRes, propsEvent, setProps } = useTable(undefined, {
     tableKey: TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_FIELD,
     scroll: { x: '1800px' },

frontend/src/views/setting/organization/template/components/viewTemplate.vue

@@ -156,7 +156,6 @@
     },
   ];
 
-  tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_STEP, templateFieldColumns, 'drawer');
   const { propsRes, propsEvent, setProps } = useTable(undefined, {
     tableKey: TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_STEP,
     scroll: { x: '800px' },
@@ -235,15 +234,15 @@
       formRules.value = result;
     }
   };
+  defineExpose({
+    getFormRules,
+  });
 
   onMounted(() => {
     setProps({ data: [{ id: 1, showStep: false, showExpected: false }] });
     getFormRules();
   });
-
+  await tableStore.initColumn(TableKeyEnum.ORGANIZATION_TEMPLATE_MANAGEMENT_STEP, templateFieldColumns, 'drawer');
-  defineExpose({
-    getFormRules,
-  });
 </script>
 
 <style scoped lang="less">

frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue

@@ -158,8 +158,6 @@
     }
   };
 
-  tableStore.initColumn(TableKeyEnum.SYSTEM_ORGANIZATION, organizationColumns, 'drawer');
-
   const { propsRes, propsEvent, loadList, setKeyword, setLoading } = useTable(
     postOrgTable,
     {
@@ -306,9 +304,15 @@
       setLoading(false);
     }
   };
+
   defineExpose({
     fetchData,
   });
+
+  onMounted(() => {
+    fetchData();
+  });
+  await tableStore.initColumn(TableKeyEnum.SYSTEM_ORGANIZATION, organizationColumns, 'drawer');
 </script>
 
 <style lang="scss" scoped>

frontend/src/views/setting/system/organizationAndProject/components/systemProject.vue

@@ -156,8 +156,6 @@
     }
   };
 
-  tableStore.initColumn(TableKeyEnum.SYSTEM_PROJECT, organizationColumns, 'drawer');
-
   const { propsRes, propsEvent, loadList, setKeyword } = useTable(
     postProjectTable,
     {
@@ -304,6 +302,8 @@
   defineExpose({
     fetchData,
   });
+
+  await tableStore.initColumn(TableKeyEnum.SYSTEM_PROJECT, organizationColumns, 'drawer');
 </script>
 
 <style lang="scss" scoped>