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

package/src/packages/components/AutoTable/filter/useTableOption.filter.state.ts

@@ -1,194 +1,194 @@
-import {iTableOptionApplyCacheParam, iTableOptionGetCacheParam} from "../use/useTableOption.cache.utils";
-import {computed, reactive, RenderNode} from "plain-design-composition";
-import {tPlc} from "../../Table/plc/utils/plc.utils";
-import {createFilterOptions, iFilterOption} from "../../FilterService/utils/filter.service.utils";
-import {createEnum} from "plain-utils/utils/createEnum";
-import '../utils/TableOption.space';
-import {AutoModule} from "../utils/AutoModule";
-
-declare module '../utils/TableOption.space' {
-  namespace TableOptionSpace {
-    interface iTableOption {
-      filterState: ReturnType<typeof useTableOptionFilterState>;
-    }
-  }
-}
-
-/**
- * 全局管理所有的筛选功能的内部状态
- * @author  韦胜健
- * @date    2023.1.3 21:28
- */
-export const useTableOptionFilterState = AutoModule.createRegistration(({ hooks, methods, cache }) => {
-
-  const state = reactive({
-    getSourceFlatPlcList: null as null | (() => tPlc[]),
-    filters: [] as iFilterStateInitialization<any>[],                           // 已经注册的筛选类型
-    activeCount: 0,                                                             // 已经应用了查询的有效的筛选条件个数
-  });
-
-  /**
-   * 注册表明当前filter state模块需要缓存
-   * @author  韦胜健
-   * @date    2023.1.3 21:28
-   */
-  cache.registry<Record<string, any>>({
-    cacheKey: 'filter-state',
-    applyCache: ({ sourceList, plcList, cacheData }) => {
-      cacheData = cacheData || {};
-      state.filters.forEach(filter => {
-        filter.applyCache({
-          plcList,
-          sourceList,
-          cacheData: !cacheData ? undefined : cacheData[filter.key],
-        });
-      });
-    },
-    getCache: (param) => {
-      return state.filters.reduce((prev, item) => {
-        prev[item.key] = item.getCache(param);
-        return prev;
-      }, {} as Record<string, any>);
-    },
-  });
-
-  /**
-   * 每次查询的时候，统计有效的筛选数量
-   * @author  韦胜健
-   * @date    2023.1.3 21:28
-   */
-  hooks.onBeforeLoad.use(() => {
-    state.activeCount = state.filters.reduce((prev, i) => prev + i.getActiveFilterCount(), 0);
-  });
-
-  /**
-   * 收集列信息
-   * @author  韦胜健
-   * @date    2023.1.6 22:51
-   */
-  hooks.onCollectPlcData.use((plcData) => {state.getSourceFlatPlcList = () => plcData.sourceFlatPlcList;});
-
-  /**
-   * 注册一个筛选类型，并且返回初始筛选状态
-   * @author  韦胜健
-   * @date    2023.1.3 21:29
-   */
-  function useState<CacheData = any>(initialization: iFilterStateInitialization<CacheData>): void {
-    const data = reactive(initialization);
-    state.filters = [data, ...state.filters].sort((a, b) => a.seq - b.seq);
-    return data as any;
-  }
-
-  /**
-   * 清空所有筛选
-   * @author  韦胜健
-   * @date    2023.1.3 21:29
-   */
-  const clearAll = (reload?: boolean) => {
-    state.filters.forEach(i => i.clear());
-    reload !== false && methods.pageMethods.reload();
-  };
-
-  /**
-   * 清空某个筛选类型的筛选条件
-   * @author  韦胜健
-   * @date    2023.1.3 21:30
-   */
-  const clearFilter = (filter: iFilterStateInitialization<any>) => {
-    filter.clear();
-    methods.pageMethods.reload();
-  };
-
-  const sourceFlatPlcList = computed(() => state.getSourceFlatPlcList?.().filter(i => (!!i.props.searchField || !!i.props.field) && !i.props.noFilter));
-
-  const createComputedFilterOptions = (filterMode: typeof eAutoTableFilterMode.TYPE) => {
-    return computed(() => sourceFlatPlcList.value?.map((
-      {
-        props: {
-          title,
-          field,
-          searchField,
-          filterType,
-          filterHandler,
-          filterConfig,
-          defaultSearch,
-          defaultSearchValue,
-          createSearchFilterOption,
-          createFormFilterOption,
-          createColumnFilterOption,
-          createDistinctFilterOption,
-          createSeniorFilterOption,
-        }
-      }
-    ) => {
-      let option: iFilterOption = createFilterOptions({
-        label: title || '',
-        field: searchField || field!,
-        filterType,
-        filterHandler,
-        filterConfig,
-        defaultSearch,
-        defaultValue: defaultSearchValue,
-      });
-      if (!!createSearchFilterOption && filterMode === eAutoTableFilterMode.filterSearch) {
-        option = {
-          ...option,
-          ...createSearchFilterOption(),
-        };
-      }
-      if (!!createFormFilterOption && filterMode === eAutoTableFilterMode.filterForm) {
-        option = {
-          ...option,
-          ...createFormFilterOption(),
-        };
-      }
-      if (!!createColumnFilterOption && filterMode === eAutoTableFilterMode.filterColumn) {
-        option = {
-          ...option,
-          ...createColumnFilterOption(),
-        };
-      }
-      if (!!createDistinctFilterOption && filterMode === eAutoTableFilterMode.filterDistinct) {
-        option = {
-          ...option,
-          ...createDistinctFilterOption(),
-        };
-      }
-      if (!!createSeniorFilterOption && filterMode === eAutoTableFilterMode.filterSenior) {
-        option = {
-          ...option,
-          ...createSeniorFilterOption(),
-        };
-      }
-      return option;
-    }));
-  };
-
-  return { useState, state, clearAll, clearFilter, createComputedFilterOptions };
-});
-
-export type iTableOptionFilterState = ReturnType<typeof useTableOptionFilterState>
-
-export interface iFilterStateInitialization<CacheData> {
-  seq: number,                                                                    // 在filter all中的显示顺序
-  key: string,                                                                    // 每个筛选类型自己的唯一标识
-  title: string,                                                                  // 在filter all中的显示标题
-  applyCache: (param: iTableOptionApplyCacheParam<CacheData>) => void,            // 应用缓存
-  getCache: (param: iTableOptionGetCacheParam) => any,                            // 获取缓存
-  getActiveFilterCount: () => number,                                             // 显示当前有多少激活的筛选条件
-  getDisplay: () => (() => RenderNode),                                            // 在【所有筛选】面板中展示
-  clear: () => void,                                                              // 清空筛选条件
-}
-
-/**
- * 筛选的功能类型
- * @author  韦胜健
- * @date    2023.1.11 21:27
- */
-export const eAutoTableFilterMode = createEnum([
-  'filterSearch',   // 搜索栏
-  'filterForm',     // 表单搜索
-  'filterColumn',   // 列搜索
-  'filterDistinct', // 列去重查询
-  'filterSenior'    // 高级查询
-] as const);
+import {iTableOptionApplyCacheParam, iTableOptionGetCacheParam} from "../use/useTableOption.cache.utils";
+import {computed, reactive, RenderNode} from "plain-design-composition";
+import {tPlc} from "../../Table/plc/utils/plc.utils";
+import {createFilterOptions, iFilterOption} from "../../FilterService/utils/filter.service.utils";
+import {createEnum} from "plain-utils/utils/createEnum";
+import '../utils/TableOption.space';
+import {AutoModule} from "../utils/AutoModule";
+
+declare module '../utils/TableOption.space' {
+  namespace TableOptionSpace {
+    interface iTableOption {
+      filterState: ReturnType<typeof useTableOptionFilterState>;
+    }
+  }
+}
+
+/**
+ * 全局管理所有的筛选功能的内部状态
+ * @author  韦胜健
+ * @date    2023.1.3 21:28
+ */
+export const useTableOptionFilterState = AutoModule.createRegistration(({ hooks, methods, cache }) => {
+
+  const state = reactive({
+    getSourceFlatPlcList: null as null | (() => tPlc[]),
+    filters: [] as iFilterStateInitialization<any>[],                           // 已经注册的筛选类型
+    activeCount: 0,                                                             // 已经应用了查询的有效的筛选条件个数
+  });
+
+  /**
+   * 注册表明当前filter state模块需要缓存
+   * @author  韦胜健
+   * @date    2023.1.3 21:28
+   */
+  cache.registry<Record<string, any>>({
+    cacheKey: 'filter-state',
+    applyCache: ({ sourceList, plcList, cacheData }) => {
+      cacheData = cacheData || {};
+      state.filters.forEach(filter => {
+        filter.applyCache({
+          plcList,
+          sourceList,
+          cacheData: !cacheData ? undefined : cacheData[filter.key],
+        });
+      });
+    },
+    getCache: (param) => {
+      return state.filters.reduce((prev, item) => {
+        prev[item.key] = item.getCache(param);
+        return prev;
+      }, {} as Record<string, any>);
+    },
+  });
+
+  /**
+   * 每次查询的时候，统计有效的筛选数量
+   * @author  韦胜健
+   * @date    2023.1.3 21:28
+   */
+  hooks.onBeforeLoad.use(() => {
+    state.activeCount = state.filters.reduce((prev, i) => prev + i.getActiveFilterCount(), 0);
+  });
+
+  /**
+   * 收集列信息
+   * @author  韦胜健
+   * @date    2023.1.6 22:51
+   */
+  hooks.onCollectPlcData.use((plcData) => {state.getSourceFlatPlcList = () => plcData.sourceFlatPlcList;});
+
+  /**
+   * 注册一个筛选类型，并且返回初始筛选状态
+   * @author  韦胜健
+   * @date    2023.1.3 21:29
+   */
+  function useState<CacheData = any>(initialization: iFilterStateInitialization<CacheData>): void {
+    const data = reactive(initialization);
+    state.filters = [data, ...state.filters].sort((a, b) => a.seq - b.seq);
+    return data as any;
+  }
+
+  /**
+   * 清空所有筛选
+   * @author  韦胜健
+   * @date    2023.1.3 21:29
+   */
+  const clearAll = (reload?: boolean) => {
+    state.filters.forEach(i => i.clear());
+    reload !== false && methods.pageMethods.reload();
+  };
+
+  /**
+   * 清空某个筛选类型的筛选条件
+   * @author  韦胜健
+   * @date    2023.1.3 21:30
+   */
+  const clearFilter = (filter: iFilterStateInitialization<any>) => {
+    filter.clear();
+    methods.pageMethods.reload();
+  };
+
+  const sourceFlatPlcList = computed(() => state.getSourceFlatPlcList?.().filter(i => (!!i.props.searchField || !!i.props.field) && !i.props.noFilter));
+
+  const createComputedFilterOptions = (filterMode: typeof eAutoTableFilterMode.TYPE) => {
+    return computed(() => sourceFlatPlcList.value?.map((
+      {
+        props: {
+          title,
+          field,
+          searchField,
+          filterType,
+          filterHandler,
+          filterConfig,
+          defaultSearch,
+          defaultSearchValue,
+          createSearchFilterOption,
+          createFormFilterOption,
+          createColumnFilterOption,
+          createDistinctFilterOption,
+          createSeniorFilterOption,
+        }
+      }
+    ) => {
+      let option: iFilterOption = createFilterOptions({
+        label: title || '',
+        field: searchField || field!,
+        filterType,
+        filterHandler,
+        filterConfig,
+        defaultSearch,
+        defaultValue: defaultSearchValue,
+      });
+      if (!!createSearchFilterOption && filterMode === eAutoTableFilterMode.filterSearch) {
+        option = {
+          ...option,
+          ...createSearchFilterOption(),
+        };
+      }
+      if (!!createFormFilterOption && filterMode === eAutoTableFilterMode.filterForm) {
+        option = {
+          ...option,
+          ...createFormFilterOption(),
+        };
+      }
+      if (!!createColumnFilterOption && filterMode === eAutoTableFilterMode.filterColumn) {
+        option = {
+          ...option,
+          ...createColumnFilterOption(),
+        };
+      }
+      if (!!createDistinctFilterOption && filterMode === eAutoTableFilterMode.filterDistinct) {
+        option = {
+          ...option,
+          ...createDistinctFilterOption(),
+        };
+      }
+      if (!!createSeniorFilterOption && filterMode === eAutoTableFilterMode.filterSenior) {
+        option = {
+          ...option,
+          ...createSeniorFilterOption(),
+        };
+      }
+      return option;
+    }));
+  };
+
+  return { useState, state, clearAll, clearFilter, createComputedFilterOptions };
+});
+
+export type iTableOptionFilterState = ReturnType<typeof useTableOptionFilterState>
+
+export interface iFilterStateInitialization<CacheData> {
+  seq: number,                                                                    // 在filter all中的显示顺序
+  key: string,                                                                    // 每个筛选类型自己的唯一标识
+  title: string,                                                                  // 在filter all中的显示标题
+  applyCache: (param: iTableOptionApplyCacheParam<CacheData>) => void,            // 应用缓存
+  getCache: (param: iTableOptionGetCacheParam) => any,                            // 获取缓存
+  getActiveFilterCount: () => number,                                             // 显示当前有多少激活的筛选条件
+  getDisplay: () => (() => RenderNode),                                            // 在【所有筛选】面板中展示
+  clear: () => void,                                                              // 清空筛选条件
+}
+
+/**
+ * 筛选的功能类型
+ * @author  韦胜健
+ * @date    2023.1.11 21:27
+ */
+export const eAutoTableFilterMode = createEnum([
+  'filterSearch',   // 搜索栏
+  'filterForm',     // 表单搜索
+  'filterColumn',   // 列搜索
+  'filterDistinct', // 列去重查询
+  'filterSenior'    // 高级查询
+] as const);

package/src/packages/components/AutoTable/index.tsx

@@ -1,4 +1,4 @@
-import {AutoTable} from "./AutoTable";
-
-export default AutoTable;
-export {AutoTable};
+import {AutoTable} from "./AutoTable";
+
+export default AutoTable;
+export {AutoTable};

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

@@ -1,79 +1,79 @@
-import {iFilterStateInitialization} from "../filter/useTableOption.filter.state";
-import {reactive, RenderNode} from "plain-design-composition";
-import {eTableOptionSettingView} from "./useTableOption.setting.utils";
-import {Empty} from "../../Empty";
-import {Button} from "../../Button";
-import '../utils/TableOption.space';
-import i18n from "../../i18n";
-import {AutoModule} from "../utils/AutoModule";
-
-declare module '../utils/TableOption.space' {
-  namespace TableOptionSpace {
-    interface iTableOption {
-      settingAllFilter: ReturnType<typeof useTableOptionSettingAllFilter>;
-    }
-  }
-}
-
-export const useTableOptionSettingAllFilter = AutoModule.createRegistration((
-  {
-    setting,
-    filterState,
-  }
-) => {
-
-  const state = reactive({
-    renderFilters: [] as { filter: iFilterStateInitialization<any>, display: () => RenderNode }[],
-  });
-
-  const removeAll = () => {
-    state.renderFilters = [];
-    filterState.clearAll();
-  };
-
-  const removeFilter = (filter: iFilterStateInitialization<any>) => {
-    state.renderFilters.splice(state.renderFilters.findIndex(i => i.filter === filter), 1);
-    filterState.clearFilter(filter);
-  };
-
-  setting.useTableOptionSettingInner({
-    key: eTableOptionSettingView.allFilter,
-    title: i18n.$it('table.allFilter').d('所有筛选'),
-    seq: 0.9,
-    contentPending: false,
-    beforeOpen: () => {
-      state.renderFilters = filterState.state.filters.filter(i => i.getActiveFilterCount() > 0).map(filter => ({
-        filter,
-        display: filter.getDisplay(),
-      }));
-    },
-    render: () => (
-      <div className="auto-table-setting-all-filter">
-        {state.renderFilters.length === 0 && (
-          <div className="auto-table-setting-all-filter-empty">
-            <Empty label={i18n.$it('table.noFilter').d('暂无筛选')}/>
-          </div>
-        )}
-        {state.renderFilters.length > 0 && (
-          <div>
-            <Button label={i18n.$it('table.clearAll').d('全部清空')} icon="pi-delete" status="error" onClick={removeAll}/>
-          </div>
-        )}
-        {state.renderFilters.map(({ filter, display }, index) => {
-          return (
-            <div key={index} className="auto-table-setting-all-filter-item">
-              <div className="auto-table-setting-all-filter-item-head">
-                <span>{filter.title}</span>
-                <Button icon="pi-close-circle" label={i18n.$it('base.edit.remove').d('删除')} status="error" onClick={() => removeFilter(filter)} mode="text"/>
-              </div>
-              <div className="auto-table-setting-all-filter-item-body">
-                {display()}
-              </div>
-            </div>
-          );
-        })}
-      </div>
-    )
-  });
-
-});
+import {iFilterStateInitialization} from "../filter/useTableOption.filter.state";
+import {reactive, RenderNode} from "plain-design-composition";
+import {eTableOptionSettingView} from "./useTableOption.setting.utils";
+import {Empty} from "../../Empty";
+import {Button} from "../../Button";
+import '../utils/TableOption.space';
+import i18n from "../../i18n";
+import {AutoModule} from "../utils/AutoModule";
+
+declare module '../utils/TableOption.space' {
+  namespace TableOptionSpace {
+    interface iTableOption {
+      settingAllFilter: ReturnType<typeof useTableOptionSettingAllFilter>;
+    }
+  }
+}
+
+export const useTableOptionSettingAllFilter = AutoModule.createRegistration((
+  {
+    setting,
+    filterState,
+  }
+) => {
+
+  const state = reactive({
+    renderFilters: [] as { filter: iFilterStateInitialization<any>, display: () => RenderNode }[],
+  });
+
+  const removeAll = () => {
+    state.renderFilters = [];
+    filterState.clearAll();
+  };
+
+  const removeFilter = (filter: iFilterStateInitialization<any>) => {
+    state.renderFilters.splice(state.renderFilters.findIndex(i => i.filter === filter), 1);
+    filterState.clearFilter(filter);
+  };
+
+  setting.useTableOptionSettingInner({
+    key: eTableOptionSettingView.allFilter,
+    title: i18n.$it('table.allFilter').d('所有筛选'),
+    seq: 0.9,
+    contentPending: false,
+    beforeOpen: () => {
+      state.renderFilters = filterState.state.filters.filter(i => i.getActiveFilterCount() > 0).map(filter => ({
+        filter,
+        display: filter.getDisplay(),
+      }));
+    },
+    render: () => (
+      <div className="auto-table-setting-all-filter">
+        {state.renderFilters.length === 0 && (
+          <div className="auto-table-setting-all-filter-empty">
+            <Empty label={i18n.$it('table.noFilter').d('暂无筛选')}/>
+          </div>
+        )}
+        {state.renderFilters.length > 0 && (
+          <div>
+            <Button label={i18n.$it('table.clearAll').d('全部清空')} icon="pi-delete" status="error" onClick={removeAll}/>
+          </div>
+        )}
+        {state.renderFilters.map(({ filter, display }, index) => {
+          return (
+            <div key={index} className="auto-table-setting-all-filter-item">
+              <div className="auto-table-setting-all-filter-item-head">
+                <span>{filter.title}</span>
+                <Button icon="pi-close-circle" label={i18n.$it('base.edit.remove').d('删除')} status="error" onClick={() => removeFilter(filter)} mode="text"/>
+              </div>
+              <div className="auto-table-setting-all-filter-item-body">
+                {display()}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    )
+  });
+
+});