plain-design 1.0.0-beta.98 → 3.0.0

package/src/packages/components/AutoTable/setting/useTableOption.setting.config.tsx

@@ -1,8 +1,8 @@
-import {reactive} from "plain-design-composition";
+import {reactive} from "@peryl/react-compose";
 import {tPlc} from "../../Table/plc/utils/plc.utils";
 import {getPlcKey} from "../../Table/plc/use/usePlcPropsState";
 import {iTableOptionApplyCacheParam} from "../use/useTableOption.cache.utils";
-import {delay} from "plain-utils/utils/delay";
+import {delay} from "@peryl/utils/delay";
 import {eTableOptionSettingView} from "./useTableOption.setting.utils";
 import {Button} from "../../Button";
 import {Table} from "../../Table";
@@ -17,6 +17,8 @@ import {SelectOption} from "../../SelectOption";
 import '../utils/TableOption.space';
 import i18n from "../../i18n";
 import {AutoModule} from "../utils/AutoModule";
+import {insertSort} from "@peryl/utils/insertSort";
+import {iPlcConfigData, iPlcCustomData} from "../utils/AutoTable.utils";
 
 declare module '../utils/TableOption.space' {
   namespace TableOptionSpace {
@@ -47,6 +49,7 @@ export const useTableOptionSettingConfig = AutoModule.createRegistration((
       const sourceFlatPlcList = (await methods.getSourceFlatPlcList()).filter(i => !!i.props.field);
       state.getSourceFlatPlcList = () => sourceFlatPlcList;
       state.data = sourceFlatPlcList.map((plc, index): iPlcConfigData => ({
+        field: plc.props.field || "",
         title: plc.props.title,
         order: index,
         align: plc.props.align || 'left',
@@ -114,8 +117,59 @@ export const useTableOptionSettingConfig = AutoModule.createRegistration((
 
   const handler = {
     apply: () => {
-      const hasOrderChange = state.data.some((i, idx) => i.order !== idx);
-      state.data.forEach((item, index) => {
+      handler.updateItemPlc({ plcConfigData: state.data });
+    },
+    updateItemPlc: async (data: {
+      /*自定义的配置数据，可以仅配置部分字段*/
+      customData?: iPlcCustomData[],
+      /*如果配置的数据有调整字段的顺序，那么会按照customData来对字段进行排序*/
+      customSort?: boolean,
+
+      /*按照个性配置面板中的数据对字段进行配置*/
+      plcConfigData?: iPlcConfigData[],
+    }) => {
+      if (!state.data.length) {
+        await utils.resetData();
+      }
+      /*
+      * 如果传递了plcConfigData，则使用这个数据来更新配置；
+      * 否则如果传递了自定义数据customData，则用customData来生成plcConfigData
+      */
+      const plcConfigData: iPlcConfigData[] = data.plcConfigData || (() => {
+        if (!data.customData) {return [];}
+        const field2custom = data.customData.reduce((prev, item) => {
+          prev[item.field] = item;
+          return prev;
+        }, {} as Record<string, undefined | iPlcCustomData>);
+        return state.data.map((stateDataItem): iPlcConfigData => {
+          const customItemData: iPlcCustomData | undefined = !stateDataItem.field ? undefined : field2custom[stateDataItem.field];
+          if (!customItemData) {
+            return stateDataItem;
+          } else {
+            return {
+              ...stateDataItem,
+              ...customItemData,
+            };
+          }
+        });
+      })();
+
+      console.log({ customData: data.customData, plcConfigData });
+
+      if (!!data.customSort && !!data.customData) {
+        const field2customIndex = data.customData.reduce((prev, item, index) => {
+          prev[item.field] = index;
+          return prev;
+        }, {} as Record<string, undefined | number>);
+        insertSort(plcConfigData, (a, b) => {
+          const aIndex = field2customIndex[a.field] || 0;
+          const bIndex = field2customIndex[b.field] || 0;
+          return aIndex > bIndex;
+        });
+      }
+
+      const hasOrderChange = plcConfigData.some((i, idx) => i.order !== idx);
+      plcConfigData.forEach((item, index) => {
         const plcState = item.plcRef().getState();
         const plcProps = item.plcRef().props;
         if (hasOrderChange) {plcState.order = index;}
@@ -197,22 +251,10 @@ export const useTableOptionSettingConfig = AutoModule.createRegistration((
     )
   });
 
-  return {};
+  return { methods: handler };
 });
 
 
-interface iPlcConfigData {
-  title?: string,
-  order: number,
-  align: string,
-  width: number,
-  fixed: string,
-  hide?: boolean,
-
-  plcRef: () => tPlc,
-  key: string,
-}
-
 interface iPlcConfigCacheData {
   [k: string]: Partial<Omit<iPlcConfigData, 'plcRef'>>;
 }

package/src/packages/components/AutoTable/setting/useTableOption.setting.export.tsx

@@ -1,9 +1,9 @@
-import {reactive, useRefs} from "plain-design-composition";
+import {reactive, useRefs} from "@peryl/react-compose";
 import {PlcCheck} from "../../Table/standard/PlcCheck/PlcCheck";
-import {deepcopy} from "plain-utils/object/deepcopy";
+import {deepcopy} from "@peryl/utils/deepcopy";
 import {$configuration} from "../../$configuration";
 import {plainDate} from "../../../utils/plainDate";
-import {delay} from "plain-utils/utils/delay";
+import {delay} from "@peryl/utils/delay";
 import {$message} from "../../$message";
 import {eTableOptionSettingView} from "./useTableOption.setting.utils";
 import {ArrowStepGroup} from "../../ArrowStepGroup";
@@ -21,6 +21,7 @@ import {getPlcDisplayValue} from "../../Table/plc/utils/plc.utils";
 import '../utils/TableOption.space';
 import i18n from "../../i18n";
 import {AutoModule} from "../utils/AutoModule";
+import $file from "../../$file";
 
 declare module '../utils/TableOption.space' {
   namespace TableOptionSpace {
@@ -102,33 +103,7 @@ export const useTableOptionSettingExport = AutoModule.createRegistration((
         }));
       }
 
-      // 导出excel
-      const [ExcelJs, FileSaver] = await Promise.all([
-        $configuration.get('getExcelJS')?.(),
-        $configuration.get('getFileSaver')?.()
-      ]);
-      if (!ExcelJs) {
-        throw new Error('请在$configuration中提供exceljs依赖');
-      }
-      if (!FileSaver) {
-        throw new Error('请在$configuration中提供filesaver依赖');
-      }
-      const workbook = new ExcelJs.Workbook();
-      const worksheet = workbook.addWorksheet('sheet');
-      worksheet.columns = [
-        { header: 'Id', key: 'id', width: 10 },
-        { header: 'Name', key: 'name', width: 32 },
-        { header: 'D.O.B.', key: 'DOB', width: 10, outlineLevel: 1 }
-      ];
-      worksheet.columns = exportPlcData.map(({ title, field }) => ({ header: title, key: field }));
-      exportData.forEach(data => {
-        worksheet.addRow(data);
-      });
-      const buffer = await workbook.xlsx.writeBuffer();
-      FileSaver.saveAs(
-        new Blob([buffer], { type: 'application/vnd.ms-excel' }),
-        `${plainDate.today('', 'YYYY-MM-DD').getValue()}.xlsx`
-      );
+      await $file.export2file({ exportData, columns: exportPlcData.map(({ title, field }) => ({ header: title, key: field })) });
     };
 
     const exportPage: ExportOption = {

package/src/packages/components/AutoTable/setting/useTableOption.setting.import.tsx

@@ -1,10 +1,10 @@
-import {reactive} from "plain-design-composition";
+import {reactive} from "@peryl/react-compose";
 import {Upload, UploadFile} from "../../Upload";
 import {eTableOptionSettingView} from "./useTableOption.setting.utils";
-import {delay} from "plain-utils/utils/delay";
+import {delay} from "@peryl/utils/delay";
 import {tPlc} from "../../Table/plc/utils/plc.utils";
 import {$configuration} from "../../$configuration";
-import {defer} from "plain-utils/utils/defer";
+import {defer} from "@peryl/utils/defer";
 import '../utils/TableOption.space';
 import i18n from "../../i18n";
 import {AutoModule} from "../utils/AutoModule";