plain-design 1.0.0-beta.73 → 1.0.0-beta.75

package/src/packages/components/AutoTable/setting/useTableOption.setting.senior.sort.tsx

@@ -1,116 +1,116 @@
-import {eTableOptionSettingView} from "./useTableOption.setting.utils";
-import {eTableOptionSortMode, iTableOptionSortMeta} from "../use/useTableOption.sort";
-import {computed, reactive} from "plain-design-composition";
-import {Table} from "../../Table";
-import {PlcDraggier} from "../../Table/standard/PlcDraggier/PlcDraggier";
-import {Plc} from "../../Plc";
-import {PlcOperation} from "../../Table/standard/PlcOperation/PlcOperation";
-import {iTableInnerOperationConfig} from "../../Table/standard/PlcOperation/PlcOperation.utils";
-import {PlcCheckbox} from "../../Table/editor/PlcCheckbox";
-import {Button} from "../../Button";
-import {tPlc} from "../../Table/plc/utils/plc.utils";
-import {Dropdown} from "../../Dropdown";
-import {DropdownOption} from "../../DropdownOption";
-import {TableOptionSpace} from "../utils/TableOption.space";
-import '../utils/TableOption.space';
-import i18n from "../../i18n";
-import {AutoModule} from "../utils/AutoModule";
-
-declare module '../utils/TableOption.space' {
-  namespace TableOptionSpace {
-    interface iTableOption {
-      settingSeniorSort: ReturnType<typeof useTableOptionSettingSeniorSort>;
-    }
-  }
-}
-
-export const useTableOptionSettingSeniorSort = AutoModule.createRegistration((
-  {
-    setting,
-    sortState,
-    methods,
-  }
-) => {
-
-  const state = reactive({
-    data: [] as iTableOptionSortMeta[],
-    getSourceFlatPlcList: () => [] as tPlc[],
-  });
-
-  const availablePlcOptions = computed(() => {
-    return state.getSourceFlatPlcList()
-      .filter(({ props: { field, noSort } }) => !noSort && !state.data.find(i => i.field === field))
-      .map(({ props: { title, field } }): { title: string, field: string } => {
-        return { title: title!, field: field! };
-      });
-  });
-
-  const innerOperations: iTableInnerOperationConfig[] = [
-    {
-      label: i18n.$it('base.edit.remove').d('删除'),
-      position: 'inner',
-      type: 'delete',
-      handler: ({ node }) => {handler.remove(node.state.index);},
-    }
-  ];
-
-  const handler = {
-    add: (val: { field: string, title: string }) => {state.data.push({ ...val, desc: true });},
-    remove: (index: number) => {state.data.splice(index, 1);},
-    apply: () => {
-      sortState.useSenior([...state.data]);
-    },
-    clear: () => {
-      state.data = [];
-      handler.apply();
-    },
-  };
-
-  setting.useTableOptionSettingInner({
-    key: eTableOptionSettingView.sort,
-    title: i18n.$it('table.seniorSort').d('高级排序'),
-    seq: 2,
-    beforeOpen: async () => {
-      const sourceFlatPlcList = await methods.getSourceFlatPlcList();
-      state.getSourceFlatPlcList = () => sourceFlatPlcList;
-      const { sortMode, singleParam, seniorParam } = sortState.state.data;
-      state.data = ((sortMode === eTableOptionSortMode.single ? [singleParam] : (seniorParam || [])).filter(Boolean) as TableOptionSpace.iTableOptionSortParam[])
-        .map(({ field, desc }): iTableOptionSortMeta => {
-          return {
-            title: sourceFlatPlcList.find(i => i.props.field === field)?.props.title || '',
-            desc: desc,
-            field,
-          };
-        });
-    },
-    render: () => {
-      return (
-        <div className="auto-table-setting-senior-sort" key="senior-sort">
-          <div className="auto-table-setting-senior-sort-header">
-            <div>
-              <Button label={i18n.$it('base.edit.apply').d("应用")} mode="fill" icon="pi-find-replace" onClick={handler.apply}/>
-              {!!availablePlcOptions.value.length && (
-                <Dropdown
-                  v-slots={{
-                    reference: () => <Button label={i18n.$it('base.edit.add').d('添加')} icon="pi-plus"/>,
-                    popper: () => availablePlcOptions.value.map((i) => (
-                      <DropdownOption key={i.field} label={i.title} onClick={() => handler.add(i)}/>
-                    ))
-                  }}
-                />
-              )}
-            </div>
-            <Button label={i18n.$it('base.clear').d("清空")} icon="pi-delete" status="error" onClick={handler.clear}/>
-          </div>
-          <Table data={state.data} defaultEditable editSourceData>
-            <PlcDraggier v-model={state.data}/>
-            <Plc field="title" title={i18n.$it('table.title').d('标题')}/>
-            <PlcCheckbox field="desc" title={i18n.$it('table.ascOrDesc').d('升序还是降序')} trueValue={true} falseValue={false}/>
-            <PlcOperation operations={innerOperations}/>
-          </Table>
-        </div>
-      );
-    },
-  });
-
-});
+import {eTableOptionSettingView} from "./useTableOption.setting.utils";
+import {eTableOptionSortMode, iTableOptionSortMeta} from "../use/useTableOption.sort";
+import {computed, reactive} from "plain-design-composition";
+import {Table} from "../../Table";
+import {PlcDraggier} from "../../Table/standard/PlcDraggier/PlcDraggier";
+import {Plc} from "../../Plc";
+import {PlcOperation} from "../../Table/standard/PlcOperation/PlcOperation";
+import {iTableInnerOperationConfig} from "../../Table/standard/PlcOperation/PlcOperation.utils";
+import {PlcCheckbox} from "../../Table/editor/PlcCheckbox";
+import {Button} from "../../Button";
+import {tPlc} from "../../Table/plc/utils/plc.utils";
+import {Dropdown} from "../../Dropdown";
+import {DropdownOption} from "../../DropdownOption";
+import {TableOptionSpace} from "../utils/TableOption.space";
+import '../utils/TableOption.space';
+import i18n from "../../i18n";
+import {AutoModule} from "../utils/AutoModule";
+
+declare module '../utils/TableOption.space' {
+  namespace TableOptionSpace {
+    interface iTableOption {
+      settingSeniorSort: ReturnType<typeof useTableOptionSettingSeniorSort>;
+    }
+  }
+}
+
+export const useTableOptionSettingSeniorSort = AutoModule.createRegistration((
+  {
+    setting,
+    sortState,
+    methods,
+  }
+) => {
+
+  const state = reactive({
+    data: [] as iTableOptionSortMeta[],
+    getSourceFlatPlcList: () => [] as tPlc[],
+  });
+
+  const availablePlcOptions = computed(() => {
+    return state.getSourceFlatPlcList()
+      .filter(({ props: { field, noSort } }) => !noSort && !state.data.find(i => i.field === field))
+      .map(({ props: { title, field } }): { title: string, field: string } => {
+        return { title: title!, field: field! };
+      });
+  });
+
+  const innerOperations: iTableInnerOperationConfig[] = [
+    {
+      label: i18n.$it('base.edit.remove').d('删除'),
+      position: 'inner',
+      type: 'delete',
+      handler: ({ node }) => {handler.remove(node.state.index);},
+    }
+  ];
+
+  const handler = {
+    add: (val: { field: string, title: string }) => {state.data.push({ ...val, desc: true });},
+    remove: (index: number) => {state.data.splice(index, 1);},
+    apply: () => {
+      sortState.useSenior([...state.data]);
+    },
+    clear: () => {
+      state.data = [];
+      handler.apply();
+    },
+  };
+
+  setting.useTableOptionSettingInner({
+    key: eTableOptionSettingView.sort,
+    title: i18n.$it('table.seniorSort').d('高级排序'),
+    seq: 2,
+    beforeOpen: async () => {
+      const sourceFlatPlcList = await methods.getSourceFlatPlcList();
+      state.getSourceFlatPlcList = () => sourceFlatPlcList;
+      const { sortMode, singleParam, seniorParam } = sortState.state.data;
+      state.data = ((sortMode === eTableOptionSortMode.single ? [singleParam] : (seniorParam || [])).filter(Boolean) as TableOptionSpace.iTableOptionSortParam[])
+        .map(({ field, desc }): iTableOptionSortMeta => {
+          return {
+            title: sourceFlatPlcList.find(i => i.props.field === field)?.props.title || '',
+            desc: desc,
+            field,
+          };
+        });
+    },
+    render: () => {
+      return (
+        <div className="auto-table-setting-senior-sort" key="senior-sort">
+          <div className="auto-table-setting-senior-sort-header">
+            <div>
+              <Button label={i18n.$it('base.edit.apply').d("应用")} mode="fill" icon="pi-find-replace" onClick={handler.apply}/>
+              {!!availablePlcOptions.value.length && (
+                <Dropdown
+                  v-slots={{
+                    reference: () => <Button label={i18n.$it('base.edit.add').d('添加')} icon="pi-plus"/>,
+                    popper: () => availablePlcOptions.value.map((i) => (
+                      <DropdownOption key={i.field} label={i.title} onClick={() => handler.add(i)}/>
+                    ))
+                  }}
+                />
+              )}
+            </div>
+            <Button label={i18n.$it('base.clear').d("清空")} icon="pi-delete" status="error" onClick={handler.clear}/>
+          </div>
+          <Table data={state.data} defaultEditable editSourceData>
+            <PlcDraggier v-model={state.data}/>
+            <Plc field="title" title={i18n.$it('table.title').d('标题')}/>
+            <PlcCheckbox field="desc" title={i18n.$it('table.ascOrDesc').d('升序还是降序')} trueValue={true} falseValue={false}/>
+            <PlcOperation operations={innerOperations}/>
+          </Table>
+        </div>
+      );
+    },
+  });
+
+});

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

@@ -1,109 +1,109 @@
-import {classnames, computed, getComponentCls, reactive, SimpleFunction} from "plain-design-composition";
-import {iTableOptionSettingConfig, iTableOptionSettingInnerUser} from "./useTableOption.setting.utils";
-import {$dialog} from "../../$dialog";
-import {Scroll} from "../../Scroll";
-import '../utils/TableOption.space';
-import i18n from "../../i18n";
-import {AutoModule} from "../utils/AutoModule";
-
-declare module '../utils/TableOption.space' {
-  namespace TableOptionSpace {
-    interface iTableOption {
-      setting: ReturnType<typeof useTableOptionSetting>;
-    }
-  }
-}
-
-export const useTableOptionSetting = AutoModule.createRegistration((
-  {
-    config,
-  }
-) => {
-
-  const state = reactive({
-    settingConfigs: [] as iTableOptionSettingConfig[],
-    activeKey: null as null | string,
-    closeSetting: null as null | SimpleFunction,
-  });
-
-  const isOpen = computed(() => !!state.closeSetting);
-
-  const useTableOptionSettingInner: iTableOptionSettingInnerUser = (config) => {
-    state.settingConfigs.push(config);
-    return { isOpen: () => isOpen.value && state.activeKey === config.key };
-  };
-
-  const openSetting = async (key: string) => {
-
-    const settingConfigs = state.settingConfigs.sort((a, b) => a.seq - b.seq);
-    const showConfig = state.settingConfigs.find(i => i.key === key);
-    !!showConfig && showConfig.beforeOpen && (await showConfig.beforeOpen());
-    state.activeKey = key;
-
-    /*已经打开就不用在打开一个dialog了，直接切换activeKey*/
-    if (isOpen.value) {return state.closeSetting;}
-
-    state.closeSetting = $dialog({
-      status: null,
-      size: config.size,
-      position: 'right',
-      width: null as any,
-      destroyOnClose: false,
-      footAlign: 'left',
-      noContentPadding: true,
-      externalClass: getComponentCls('auto-table-setting-dialog'),
-      title: i18n.$it('base.setting').d('设置'),
-      cancelButton: true,
-      cancelButtonText: i18n.$it('base.close').d('关闭'),
-      onHide: () => {state.closeSetting = null;},
-      render: () => {
-        return (
-          <div className={'auto-table-setting-wrapper'}>
-            <div className="auto-table-setting-nav">
-              {[null, ...settingConfigs, null].map((item, index) => (
-                <div key={index} className={classnames([
-                  'auto-table-setting-nav-item',
-                  {
-                    'auto-table-setting-nav-item-active': !!item && item.key === state.activeKey,
-                    'auto-table-setting-nav-item-prev': !!settingConfigs[index] && settingConfigs[index].key === state.activeKey,
-                    'auto-table-setting-nav-item-next': !!settingConfigs[index - 2] && settingConfigs[index - 2].key === state.activeKey,
-                  }
-                ])} onClick={async () => {
-                  if (!item) {return;}
-                  !!item.beforeOpen && (await item.beforeOpen());
-                  state.activeKey = item.key;
-                }}>
-                  <div className="auto-table-setting-nav-item-inner">
-                    {item?.title}
-                  </div>
-                </div>
-              ))}
-            </div>
-            <div className="auto-table-setting-body">
-              <Scroll>
-                <div className="auto-table-setting-body-inner">
-                  {(() => {
-                    const r = settingConfigs.find(i => i.key === state.activeKey);
-                    if (!r) {return null;}
-                    const content = !!r.render && r.render();
-                    return (
-                      <div className={classnames(['auto-table-setting-content', { 'auto-table-setting-content-pending': !!r && r.contentPending !== false }])}>
-                        {content}
-                      </div>
-                    );
-                  })()}
-                </div>
-              </Scroll>
-            </div>
-          </div>
-        );
-      },
-    });
-
-    return closeSetting;
-  };
-
-  const closeSetting = () => state.closeSetting?.();
-
-  return { openSetting, closeSetting, useTableOptionSettingInner };
-});
+import {classnames, computed, getComponentCls, reactive, SimpleFunction} from "plain-design-composition";
+import {iTableOptionSettingConfig, iTableOptionSettingInnerUser} from "./useTableOption.setting.utils";
+import {$dialog} from "../../$dialog";
+import {Scroll} from "../../Scroll";
+import '../utils/TableOption.space';
+import i18n from "../../i18n";
+import {AutoModule} from "../utils/AutoModule";
+
+declare module '../utils/TableOption.space' {
+  namespace TableOptionSpace {
+    interface iTableOption {
+      setting: ReturnType<typeof useTableOptionSetting>;
+    }
+  }
+}
+
+export const useTableOptionSetting = AutoModule.createRegistration((
+  {
+    config,
+  }
+) => {
+
+  const state = reactive({
+    settingConfigs: [] as iTableOptionSettingConfig[],
+    activeKey: null as null | string,
+    closeSetting: null as null | SimpleFunction,
+  });
+
+  const isOpen = computed(() => !!state.closeSetting);
+
+  const useTableOptionSettingInner: iTableOptionSettingInnerUser = (config) => {
+    state.settingConfigs.push(config);
+    return { isOpen: () => isOpen.value && state.activeKey === config.key };
+  };
+
+  const openSetting = async (key: string) => {
+
+    const settingConfigs = state.settingConfigs.sort((a, b) => a.seq - b.seq);
+    const showConfig = state.settingConfigs.find(i => i.key === key);
+    !!showConfig && showConfig.beforeOpen && (await showConfig.beforeOpen());
+    state.activeKey = key;
+
+    /*已经打开就不用在打开一个dialog了，直接切换activeKey*/
+    if (isOpen.value) {return state.closeSetting;}
+
+    state.closeSetting = $dialog({
+      status: null,
+      size: config.size,
+      position: 'right',
+      width: null as any,
+      destroyOnClose: false,
+      footAlign: 'left',
+      noContentPadding: true,
+      externalClass: getComponentCls('auto-table-setting-dialog'),
+      title: i18n.$it('base.setting').d('设置'),
+      cancelButton: true,
+      cancelButtonText: i18n.$it('base.close').d('关闭'),
+      onHide: () => {state.closeSetting = null;},
+      render: () => {
+        return (
+          <div className={'auto-table-setting-wrapper'}>
+            <div className="auto-table-setting-nav">
+              {[null, ...settingConfigs, null].map((item, index) => (
+                <div key={index} className={classnames([
+                  'auto-table-setting-nav-item',
+                  {
+                    'auto-table-setting-nav-item-active': !!item && item.key === state.activeKey,
+                    'auto-table-setting-nav-item-prev': !!settingConfigs[index] && settingConfigs[index].key === state.activeKey,
+                    'auto-table-setting-nav-item-next': !!settingConfigs[index - 2] && settingConfigs[index - 2].key === state.activeKey,
+                  }
+                ])} onClick={async () => {
+                  if (!item) {return;}
+                  !!item.beforeOpen && (await item.beforeOpen());
+                  state.activeKey = item.key;
+                }}>
+                  <div className="auto-table-setting-nav-item-inner">
+                    {item?.title}
+                  </div>
+                </div>
+              ))}
+            </div>
+            <div className="auto-table-setting-body">
+              <Scroll>
+                <div className="auto-table-setting-body-inner">
+                  {(() => {
+                    const r = settingConfigs.find(i => i.key === state.activeKey);
+                    if (!r) {return null;}
+                    const content = !!r.render && r.render();
+                    return (
+                      <div className={classnames(['auto-table-setting-content', { 'auto-table-setting-content-pending': !!r && r.contentPending !== false }])}>
+                        {content}
+                      </div>
+                    );
+                  })()}
+                </div>
+              </Scroll>
+            </div>
+          </div>
+        );
+      },
+    });
+
+    return closeSetting;
+  };
+
+  const closeSetting = () => state.closeSetting?.();
+
+  return { openSetting, closeSetting, useTableOptionSettingInner };
+});

package/src/packages/components/AutoTable/setting/useTableOption.setting.utils.ts

@@ -1,40 +1,40 @@
-import {RenderNode} from "plain-design-composition";
-import {createEnum} from "plain-utils/utils/createEnum";
-
-/**
- * 在自定义面板中注册一个面板的参数类型
- * @author  韦胜健
- * @date    2023.1.3 21:31
- */
-export interface iTableOptionSettingConfig {
-  key: typeof eTableOptionSettingView.TYPE,
-  title: string,
-  seq: number,
-  render: () => RenderNode,
-  beforeOpen?: () => void | Promise<void>,
-  contentPending?: boolean,
-}
-
-/**
- * 注册面板函数类型
- * @author  韦胜健
- * @date    2023.1.3 21:31
- */
-export interface iTableOptionSettingInnerUser {
-  (config: iTableOptionSettingConfig): { isOpen: () => boolean };
-}
-
-/**
- * 面板的类型
- * @author  韦胜健
- * @date    2023.1.3 21:31
- */
-export const eTableOptionSettingView = createEnum([
-  'seniorFilter',
-  'allFilter',
-  'sort',
-  'config',
-  'cache',
-  'import',
-  'export',
-] as const);
+import {RenderNode} from "plain-design-composition";
+import {createEnum} from "plain-utils/utils/createEnum";
+
+/**
+ * 在自定义面板中注册一个面板的参数类型
+ * @author  韦胜健
+ * @date    2023.1.3 21:31
+ */
+export interface iTableOptionSettingConfig {
+  key: typeof eTableOptionSettingView.TYPE,
+  title: string,
+  seq: number,
+  render: () => RenderNode,
+  beforeOpen?: () => void | Promise<void>,
+  contentPending?: boolean,
+}
+
+/**
+ * 注册面板函数类型
+ * @author  韦胜健
+ * @date    2023.1.3 21:31
+ */
+export interface iTableOptionSettingInnerUser {
+  (config: iTableOptionSettingConfig): { isOpen: () => boolean };
+}
+
+/**
+ * 面板的类型
+ * @author  韦胜健
+ * @date    2023.1.3 21:31
+ */
+export const eTableOptionSettingView = createEnum([
+  'seniorFilter',
+  'allFilter',
+  'sort',
+  'config',
+  'cache',
+  'import',
+  'export',
+] as const);