zmdms-webui 0.0.76 → 0.0.78

package/dist/es/table/useDynamicListByColumns.js

@@ -1,29 +1,61 @@
-import { useRef, useMemo, useState, useCallback } from 'react';
+import { useRef, useMemo, useState, useEffect, useCallback } from 'react';
 import { getCurrentDynamicItems } from '../dynamicsetting/useDynamic.js';
 import { TABLE_DYNAMIC_KEY } from './constant.js';
+import isEqual from 'lodash/isEqual';
 
+// 处理列信息
+function parseColumn(column, index) {
+    var _a = column, key = _a.key, dataIndex = _a.dataIndex, title = _a.title, dynamicTitle = _a.dynamicTitle, dynamicDisabled = _a.dynamicDisabled, width = _a.width, fixed = _a.fixed;
+    // 动态列配置 title必须为一个字符串
+    if (title && !dynamicTitle && typeof title !== "string") {
+        console.error("\u4F60\u4F20\u5165\u7684title\u4E0D\u662F\u4E00\u4E2A\u5B57\u7B26\u4E32,\u5E76\u4E14\u4F60\u6CA1\u6709\u4F20\u5165dynamicTitle\u7684\u914D\u7F6E\u3002\n    \u95EE\u9898\u53EF\u80FD\u51FA\u73B0\u518D:".concat(key || dataIndex, " \u5217\u3002\u8BF7\u4F20\u5165\u4E00\u4E2AdynamicTitle \u4F5C\u4E3A\u52A8\u6001\u5217\u914D\u7F6E\u7684title\u503C"));
+    }
+    // 固定列也进入到可排序的列表中，固定列必须传入key值
+    // if (!fixed) {
+    // dataIndex 可能是 ['key1', 'key2'] 这种格式
+    // 尽量避免使用这种模式 如果非得使用这种模式 那么请把key值传入
+    var _key = key ? key : dataIndex;
+    // 如果开发没有传入一个key值，那么组件自动生成一个。生成规则就是根据索引 和 标题生成
+    // 但是会发出警告
+    var myKey = _key ||
+        "".concat(index, "-").concat(typeof title === "string" ? title : dynamicTitle);
+    var item = {
+        key: myKey,
+        label: dynamicTitle ? dynamicTitle : title,
+        disabled: dynamicDisabled === true ? true : false,
+        checked: true,
+        width: width,
+        fixed: fixed,
+    };
+    column.key = myKey;
+    if (!_key) {
+        console.error("\u4F60\u8868\u683C\u6709\u5217\u6CA1\u6709\u4F20\u5165key\u503C\uFF0C\u8BF7\u4F20\u5165key\u503C\uFF0C\u7EC4\u4EF6\u4F1A\u7ED9\u4F60\u9ED8\u8BA4\u751F\u6210\u4E00\u4E2AKEY\u503C\uFF0C\u4F46\u662F\u6700\u597D\u8FD8\u662F\u7ED9\u5217\u914D\u7F6E\u4E00\u4E2Akey", item);
+    }
+    return item;
+    // }
+}
+// 将多级表头统一提取出来处理
+function recursionColumns(columns, result) {
+    if (Array.isArray(columns)) {
+        columns.forEach(function (column, index) {
+            var item = parseColumn(column, index);
+            if (column.children && Array.isArray(column.children)) {
+                var columnChildrenResult = [];
+                recursionColumns(column.children, columnChildrenResult);
+                item.children = columnChildrenResult;
+            }
+            result.push(item);
+        });
+    }
+}
 // 根据columns 生成动态列配置信息
 function getDynamicList(dynamicKey, columns) {
     var result = [];
-    if (dynamicKey && columns) {
-        columns.forEach(function (column) {
-            var _a = column, key = _a.key, dataIndex = _a.dataIndex, title = _a.title, dynamicTitle = _a.dynamicTitle, dynamicDisabled = _a.dynamicDisabled, fixed = _a.fixed;
-            // 动态列配置 title必须为一个字符串
-            if (title && !dynamicTitle && typeof title !== "string") {
-                console.error("\u4F60\u4F20\u5165\u7684title\u4E0D\u662F\u4E00\u4E2A\u5B57\u7B26\u4E32,\u5E76\u4E14\u4F60\u6CA1\u6709\u4F20\u5165dynamicTitle\u7684\u914D\u7F6E\u3002\n        \u95EE\u9898\u53EF\u80FD\u51FA\u73B0\u518D:".concat(key || dataIndex, " \u5217\u3002\u8BF7\u4F20\u5165\u4E00\u4E2AdynamicTitle \u4F5C\u4E3A\u52A8\u6001\u5217\u914D\u7F6E\u7684title\u503C"));
-            }
-            if (!fixed) {
-                // dataIndex 可能是 ['key1', 'key2'] 这种格式
-                // 尽量避免使用这种模式 如果非得使用这种模式 那么请把key值传入
-                var _key = key ? key : dataIndex;
-                result.push({
-                    key: _key,
-                    label: dynamicTitle ? dynamicTitle : title,
-                    disabled: dynamicDisabled === true ? true : false,
-                    checked: true,
-                });
-            }
-        });
+    // 就算没有传入 dynamicKey 也可以生成一个动态列配置的逻辑
+    // if (dynamicKey && columns) {
+    if (columns) {
+        // 将多级表头 递归生成列配置信息
+        recursionColumns(columns, result);
     }
     return result;
 }
@@ -38,6 +70,17 @@ function useDynamicListByColumns(columns, dynamicKey) {
     var _a = useState(function () {
         return getCurrentDynamicItems(dynamicKey, TABLE_DYNAMIC_KEY, defaultDynamicList);
     }), currentDynamicList = _a[0], setCurrentDynamicList = _a[1];
+    // columns发生变化时，更新数据默认配置
+    useEffect(function () {
+        var _a, _b;
+        var defaultDynamicList = getDynamicList(dynamicKey, columns);
+        (_b = (_a = dynamicSettingRef === null || dynamicSettingRef === void 0 ? void 0 : dynamicSettingRef.current) === null || _a === void 0 ? void 0 : _a.setList) === null || _b === void 0 ? void 0 : _b.call(_a, function (preList) {
+            if (isEqual(preList, defaultDynamicList)) {
+                return preList;
+            }
+            return defaultDynamicList;
+        });
+    }, [dynamicKey, columns]);
     var onCurrentListChange = useCallback(function (newDynamicList) {
         console.log(newDynamicList);
         setCurrentDynamicList(newDynamicList);

package/dist/es/table/utils.js

@@ -1,18 +1,13 @@
-import { __spreadArray } from '../_virtual/_tslib.js';
+import { __spreadArray, __assign } from '../_virtual/_tslib.js';
 import { message } from 'antd';
 
-// 根据动态列配置信息 以及当前的columns信息
-// 得到最新的columns信息
-function getTableColumns(columns, currentDynamicList) {
+// 递归处理columns
+function recursionColumns(columns, currentDynamicList, newColumns) {
     if (Array.isArray(currentDynamicList) &&
         currentDynamicList.length > 0 &&
         columns) {
-        var preColumns_1 = [];
-        var middleColumns_1 = [];
-        var afterColumns_1 = [];
-        // 先从动态列配置信息中 找出column并按配置信息进行排序
         currentDynamicList.forEach(function (item) {
-            var key = item.key, checked = item.checked;
+            var key = item.key, checked = item.checked, width = item.width, fixed = item.fixed, dynamicChildrenList = item.children;
             // 这里肯定是能找到的 因为之前就以columns过滤了一遍dynamicList了
             var result = columns.find(function (column) {
                 return ((column.key === key ||
@@ -20,21 +15,64 @@ function getTableColumns(columns, currentDynamicList) {
                     checked);
             });
             if (result) {
-                middleColumns_1.push(result);
+                var newColumn = __assign(__assign({}, result), { width: width ? width : result.width, fixed: fixed != null ? fixed : result.fixed });
+                // 如果有子元素
+                if (result.children) {
+                    newColumn.children = [];
+                    recursionColumns(result.children, dynamicChildrenList, newColumn.children);
+                }
+                newColumns.push(newColumn);
             }
         });
+    }
+}
+// 根据动态列配置信息 以及当前的columns信息
+// 得到最新的columns信息
+function getTableColumns(columns, currentDynamicList) {
+    if (Array.isArray(currentDynamicList) &&
+        currentDynamicList.length > 0 &&
+        columns) {
+        var preColumns = [];
+        var middleColumns = [];
+        var afterColumns = [];
+        // 先从动态列配置信息中 找出column并按配置信息进行排序
+        recursionColumns(columns, currentDynamicList, middleColumns);
+        // currentDynamicList.forEach((item) => {
+        //   const { key, checked, width, fixed } = item;
+        //   // 这里肯定是能找到的 因为之前就以columns过滤了一遍dynamicList了
+        //   const result = columns.find((column) => {
+        //     return (
+        //       (column.key === key ||
+        //         ((column as any)?.dataIndex as string) === key) &&
+        //       checked
+        //     );
+        //   });
+        //   if (result) {
+        //     middleColumns.push({
+        //       ...result,
+        //       width: width ? width : result.width,
+        //       fixed: fixed != null ? fixed : result.fixed,
+        //     });
+        //   }
+        // });
         // 将前固定列 和 后固定列找出
-        columns
-            .filter(function (column) { return column.fixed; })
-            .forEach(function (column) {
-            if (column.fixed === "left") {
-                preColumns_1.push(column);
-            }
-            else if (column.fixed === "right") {
-                afterColumns_1.push(column);
-            }
-        });
-        return __spreadArray(__spreadArray(__spreadArray([], preColumns_1, true), middleColumns_1, true), afterColumns_1, true);
+        // 固定列也将放入到 动态列配置中去，这里逻辑取消
+        // columns
+        //   .filter((column) => column.fixed)
+        //   .forEach((column) => {
+        //     if (column.fixed === "left") {
+        //       preColumns.push(column);
+        //     } else if (column.fixed === "right") {
+        //       afterColumns.push(column);
+        //     }
+        //   });
+        // 如果没有找到一条数据，可以认为这次做了全量更新，需要直接覆盖
+        if (preColumns.length === 0 &&
+            middleColumns.length === 0 &&
+            afterColumns.length === 0) {
+            return columns;
+        }
+        return __spreadArray(__spreadArray(__spreadArray([], preColumns, true), middleColumns, true), afterColumns, true);
     }
     return columns;
 }