@arim-aisdc/public-components 2.3.17 → 2.3.18

package/dist/components/TableMax/hooks/useColumnWidth.js

@@ -10,24 +10,44 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { produce } from 'immer';
+import { debounce } from 'lodash-es';
 import { getSizeInfo } from "../utils";
-import { debounce } from 'lodash';
-var CACHE_MAX_AGE = 1 * 60 * 60 * 1000; // 1小时
-var defaultMinSize = 120;
-var defaultMaxSize = 240;
+
+// 可配置的常量
+var DEFAULT_MIN_SIZE = 120;
+var DEFAULT_MAX_SIZE = 240;
+var DEFAULT_RESIZE_DEBOUNCE = 200;
+var DEFAULT_TABLE_PADDING = 10;
+/**
+ * 获取表格容器的有效宽度（减去边框）
+ */
+var useTableWidth = function useTableWidth(tableContentRef) {
+  return useCallback(function () {
+    if (!tableContentRef.current) return 0;
+    var width = tableContentRef.current.getBoundingClientRect().width;
+    var style = window.getComputedStyle(tableContentRef.current);
+    var horizontalBorderWidth = parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
+    return Math.floor(width - horizontalBorderWidth);
+  }, [tableContentRef]);
+};
+
+/**
+ * 自定义Hook：表格列宽计算和管理
+ */
 export var useColumnWidth = function useColumnWidth(_ref) {
   var tableContentRef = _ref.tableContentRef,
     tableId = _ref.tableId,
     tableKeyPrefixCls = _ref.tableKeyPrefixCls,
     _ref$columnVisibleCon = _ref.columnVisibleConfig,
     columnVisibleConfig = _ref$columnVisibleCon === void 0 ? {} : _ref$columnVisibleCon,
-    tableKey = _ref.tableKey;
+    tableKey = _ref.tableKey,
+    _ref$cacheMaxAge = _ref.cacheMaxAge,
+    cacheMaxAge = _ref$cacheMaxAge === void 0 ? 1 * 60 * 60 * 1000 : _ref$cacheMaxAge;
   var _useState = useState({
       columnSizing: {},
-      //显示列的列宽
       allColumnSizing: {},
-      //所有列的列宽
       allColumnCount: 0,
       tableContainerWidth: undefined,
       initColumnsSizeMap: {}
@@ -35,329 +55,244 @@ export var useColumnWidth = function useColumnWidth(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     state = _useState2[0],
     setState = _useState2[1];
-  var getTableWidth = useCallback(function () {
-    var _tableContentRef$curr;
-    var width = (_tableContentRef$curr = tableContentRef.current) === null || _tableContentRef$curr === void 0 ? void 0 : _tableContentRef$curr.getBoundingClientRect().width;
-    var style = window.getComputedStyle(tableContentRef.current);
-    var horizontalBorderWidth = parseFloat(style.getPropertyValue('border-left-width')) + parseFloat(style.getPropertyValue('border-right-width'));
-    return Math.floor(width - horizontalBorderWidth);
-  }, [tableContentRef]);
+  var getTableWidth = useTableWidth(tableContentRef);
+  var debouncedHandleResizeRef = useRef(debounce(function (newWidth) {
+    return handleResize(newWidth);
+  }, DEFAULT_RESIZE_DEBOUNCE));
 
   /**
-  * 处理容器宽度变化的逻辑
-  * 1.容器变小:
-  * 找到原始columns设置列宽度的第一列
-  * 如果当前列的宽度大于初始宽度，则按照容器变化的总宽度，除选择列和展开列外，其他列平分容器减小的宽度
-  * 如果当前列的宽度小于等于初始宽度，则列宽均不变
-  * 2.容器变大：
-  * 列宽之和大于容器宽度，不重新计算
-  * 列宽之和小于容器宽度，除选择列和展开列外，其他列平分 列宽之和与容器宽度的差值
-  */
-  var handleResize = useCallback(function () {
-    if (!tableContentRef.current) return;
-    var newWidth = getTableWidth();
+   * 计算可调整的列（排除展开列和选择列）
+   */
+  var getAdjustableColumns = useCallback(function (columns) {
+    return Object.keys(columns).filter(function (key) {
+      return !['expander', 'selection-column'].includes(key);
+    });
+  }, []);
+
+  /**
+   * 计算可见列
+   */
+  var getVisibleColumns = useCallback(function (columns) {
+    return Object.keys(columns).filter(function (key) {
+      return columnVisibleConfig[key] !== false;
+    });
+  }, [columnVisibleConfig]);
+
+  /**
+   * 处理容器宽度变化的逻辑
+   */
+  var handleResize = useCallback(function (newWidth) {
     if (!newWidth) return;
     setState(function (prevState) {
-      // 计算可见列，排除特定列
-      var visibleColumns = Object.keys(prevState.columnSizing).filter(function (key) {
-        return columnVisibleConfig[key] !== false && key !== 'expander' && key !== 'selection-column';
-      });
-      var totalVisibleWidth = Object.keys(prevState.columnSizing).filter(function (key) {
-        return columnVisibleConfig[key] !== false;
-      }).reduce(function (sum, key) {
-        return sum + (prevState.columnSizing[key] || 120);
-      }, 0);
-
-      // 容器变大时的逻辑
-      if (prevState.tableContainerWidth > 0 && newWidth > prevState.tableContainerWidth) {
-        if (totalVisibleWidth < newWidth) {
-          // 计算剩余宽度
-          var remainWidth = newWidth - totalVisibleWidth - 10;
-          var unselectedCount = visibleColumns.length;
+      return produce(prevState, function (draft) {
+        var visibleColumns = getVisibleColumns(draft.columnSizing);
+        var adjustableColumns = getAdjustableColumns(draft.columnSizing);
+        var totalVisibleWidth = visibleColumns.reduce(function (sum, key) {
+          return sum + (draft.columnSizing[key] || DEFAULT_MIN_SIZE);
+        }, 0);
 
-          // 如果有未排除的列，均匀分配剩余宽度
-          if (unselectedCount > 0) {
-            var averageWidth = remainWidth / unselectedCount;
-            var newVisibleColumnsSizing = _objectSpread({}, prevState.columnSizing);
-            visibleColumns.forEach(function (key) {
-              newVisibleColumnsSizing[key] = (newVisibleColumnsSizing[key] || 0) + averageWidth;
-            });
-            return _objectSpread(_objectSpread({}, prevState), {}, {
-              columnSizing: newVisibleColumnsSizing,
-              allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing || {}), newVisibleColumnsSizing),
-              tableContainerWidth: newWidth
-            });
+        // 容器变大时的逻辑
+        if (draft.tableContainerWidth && newWidth > draft.tableContainerWidth) {
+          if (totalVisibleWidth < newWidth - DEFAULT_TABLE_PADDING) {
+            var remainWidth = newWidth - totalVisibleWidth - DEFAULT_TABLE_PADDING;
+            if (adjustableColumns.length > 0) {
+              var averageWidth = remainWidth / adjustableColumns.length;
+              adjustableColumns.forEach(function (key) {
+                draft.columnSizing[key] = Math.min((draft.columnSizing[key] || 0) + averageWidth, DEFAULT_MAX_SIZE);
+              });
+            }
           }
         }
-      } else if (prevState.tableContainerWidth > 0 && newWidth < prevState.tableContainerWidth && JSON.stringify(prevState.initColumnsSizeMap) !== '{}') {
-        // 容器变小时，重新计算
-        var reducedWidth = newWidth - totalVisibleWidth - 10;
-        var _unselectedCount = visibleColumns.length;
-        if (_unselectedCount > 0) {
-          var _averageWidth = reducedWidth / _unselectedCount;
-          var _newVisibleColumnsSizing = _objectSpread({}, prevState.columnSizing);
-          visibleColumns.forEach(function (key) {
-            _newVisibleColumnsSizing[key] = Math.max((_newVisibleColumnsSizing[key] || 0) + _averageWidth, Math.max(state.initColumnsSizeMap[visibleColumns[0]], defaultMinSize));
-          });
-          return _objectSpread(_objectSpread({}, prevState), {}, {
-            columnSizing: _newVisibleColumnsSizing,
-            allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing || {}), _newVisibleColumnsSizing),
-            tableContainerWidth: newWidth
-          });
+        // 容器变小时的逻辑
+        else if (draft.tableContainerWidth && newWidth < draft.tableContainerWidth) {
+          var reducedWidth = newWidth - totalVisibleWidth - DEFAULT_TABLE_PADDING;
+          if (adjustableColumns.length > 0) {
+            var _averageWidth = reducedWidth / adjustableColumns.length;
+            adjustableColumns.forEach(function (key) {
+              var _draft$initColumnsSiz;
+              draft.columnSizing[key] = Math.max((draft.columnSizing[key] || 0) + _averageWidth, Math.max(((_draft$initColumnsSiz = draft.initColumnsSizeMap) === null || _draft$initColumnsSiz === void 0 ? void 0 : _draft$initColumnsSiz[key]) || 0, DEFAULT_MIN_SIZE));
+            });
+          }
         }
-      }
-      return _objectSpread(_objectSpread({}, prevState), {}, {
-        tableContainerWidth: newWidth
+        draft.tableContainerWidth = newWidth;
       });
     });
-  }, [tableContentRef.current]);
-
-  // 使用防抖处理容器宽度变化
-  var debouncedHandleResize = useMemo(function () {
-    return debounce(handleResize, 200);
-  }, [handleResize]);
-  useEffect(function () {
-    if (!tableContentRef.current) return;
-    var resizeObserver = new ResizeObserver(debouncedHandleResize);
-    resizeObserver.observe(tableContentRef.current);
-    return function () {
-      resizeObserver.disconnect();
-      debouncedHandleResize.cancel(); // 清理防抖
-    };
-  }, [tableContentRef.current, debouncedHandleResize]);
+  }, [getAdjustableColumns, getVisibleColumns]);
 
   /**
-  * 列显示隐藏后调整列宽
-  * @param key 
-  * @param value 
-  * 增加列，其余列宽度不变
-  * 减少列，列宽之和大于容器宽度，其余列宽不变
-  * 列宽之和小于容器宽度，除展开列和勾选列外，其余列平分列宽之和与容器宽度的差值
-  */
-
-  var handleVisibleConfigChange = function handleVisibleConfigChange(key, value) {
+   * 列显示隐藏后调整列宽
+   */
+  var handleVisibleConfigChange = useCallback(function (key, value) {
     setState(function (prevState) {
-      //列宽增加
-      if (value) {
-        // console.log(prevState.allColumnSizing[key], prevState.allColumnSizing, 'prevState.allColumnSizing[key]')
-        return _objectSpread(_objectSpread({}, prevState), {}, {
-          columnSizing: _objectSpread(_objectSpread({}, prevState.columnSizing), {}, {
-            key: prevState.allColumnSizing[key]
-          }),
-          allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing), {}, {
-            key: prevState.allColumnSizing[key] || 120
-          })
-        });
-      } else {
-        //列宽减少
-        var newVisibleColumnsSizing = prevState.columnSizing;
-        delete newVisibleColumnsSizing[key];
-        var containerWidth = getTableWidth() - 10 || 0;
-        // 计算当前总宽度
-        var totalWidth = Object.values(newVisibleColumnsSizing).reduce(function (sum, width) {
-          return Number(sum || 0) + Number(width || 0);
-        }, 0);
-        if (containerWidth < totalWidth) {
-          // 容器宽度小于增加列后的列总和，其他列宽度不变
-          return _objectSpread(_objectSpread({}, prevState), {}, {
-            columnSizing: newVisibleColumnsSizing
-          });
+      return produce(prevState, function (draft) {
+        if (value) {
+          // 显示列
+          draft.columnSizing[key] = draft.allColumnSizing[key] || DEFAULT_MIN_SIZE;
         } else {
-          // 容器宽度大于增加列后的列总和，其他列宽度平分差值
-          var widthDifference = containerWidth - totalWidth; // 计算差值
-          var joinCalculateColumns = Object.keys(prevState.columnSizing).filter(function (key) {
-            return key !== 'expander' && key !== 'selection-column';
-          });
-          var averageWidthIncrease = widthDifference / (joinCalculateColumns === null || joinCalculateColumns === void 0 ? void 0 : joinCalculateColumns.length);
-          joinCalculateColumns === null || joinCalculateColumns === void 0 || joinCalculateColumns.forEach(function (key) {
-            newVisibleColumnsSizing[key] = (newVisibleColumnsSizing[key] || 0) + averageWidthIncrease;
-          });
-          return _objectSpread(_objectSpread({}, prevState), {}, {
-            columnSizing: newVisibleColumnsSizing,
-            allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing), newVisibleColumnsSizing)
-          });
+          // 隐藏列
+          delete draft.columnSizing[key];
+          var containerWidth = getTableWidth() - DEFAULT_TABLE_PADDING || 0;
+          var totalWidth = Object.values(draft.columnSizing).reduce(function (sum, width) {
+            return sum + Number(width || 0);
+          }, 0);
+          if (containerWidth > totalWidth) {
+            var widthDifference = containerWidth - totalWidth;
+            var adjustableColumns = getAdjustableColumns(draft.columnSizing);
+            if (adjustableColumns.length > 0) {
+              var averageWidthIncrease = widthDifference / adjustableColumns.length;
+              adjustableColumns.forEach(function (colKey) {
+                draft.columnSizing[colKey] = Math.min((draft.columnSizing[colKey] || 0) + averageWidthIncrease, DEFAULT_MAX_SIZE);
+              });
+            }
+          }
         }
-      }
+      });
     });
-  };
+  }, [getAdjustableColumns, getTableWidth]);
 
   /**
-   * 初始化时计算列宽
-   * 未设置宽度的列，容器剩余宽度存在，平分剩余宽度，最大不超过240；容器剩余宽度不存在，默认120
-   * 平分后还存在剩余宽度，除展开列和勾选列外的其他列平分剩余宽度
-   * */
+   * 初始化列宽计算
+   */
   var calculateColumnSizing = useCallback(function (columnsSizeMap, allColumnCount, containerWidth) {
-    var _Object$keys$filter;
-    if (!tableContentRef.current || !columnsSizeMap) return {};
     var currentWidth = containerWidth || state.tableContainerWidth || getTableWidth();
-    var hasColumnCount = ((_Object$keys$filter = Object.keys(columnsSizeMap).filter(function (item) {
-      return !!columnsSizeMap[item];
-    })) === null || _Object$keys$filter === void 0 ? void 0 : _Object$keys$filter.length) || 0;
-    var remainColumnCount = allColumnCount - hasColumnCount;
-    var allColumnWidth = Object.values(columnsSizeMap).reduce(function (sum, width) {
-      return sum + Number(width || 0);
-    }, 0);
-    var remainTableContainerWidth = currentWidth - allColumnWidth - 10;
-    var newColumnSizeMap = _objectSpread({}, columnsSizeMap);
+    if (!currentWidth) return columnsSizeMap;
+    var result = _objectSpread({}, columnsSizeMap);
+    var adjustableColumns = getAdjustableColumns(result);
 
-    // 处理未设置宽度的列
-    if (remainColumnCount > 0) {
-      var averageSize = Math.max(Math.min(remainTableContainerWidth / remainColumnCount, defaultMaxSize), defaultMinSize);
-      Object.keys(columnsSizeMap).forEach(function (key) {
-        if (!newColumnSizeMap[key]) {
-          newColumnSizeMap[key] = averageSize;
-        }
-      });
-      allColumnWidth = Object.values(newColumnSizeMap).reduce(function (sum, width) {
-        return sum + Number(width || 0);
+    // 计算已设置宽度的列
+    var hasWidthColumns = Object.keys(result).filter(function (key) {
+      return result[key];
+    });
+    var noWidthColumns = Object.keys(result).filter(function (key) {
+      return !result[key];
+    });
+
+    // 为未设置宽度的列分配初始宽度
+    if (noWidthColumns.length > 0) {
+      var availableWidth = currentWidth - DEFAULT_TABLE_PADDING - hasWidthColumns.reduce(function (sum, key) {
+        return sum + (result[key] || 0);
       }, 0);
-      remainTableContainerWidth = currentWidth - allColumnWidth - 10;
+      var averageSize = Math.min(Math.max(availableWidth / noWidthColumns.length, DEFAULT_MIN_SIZE), DEFAULT_MAX_SIZE);
+      noWidthColumns.forEach(function (key) {
+        result[key] = averageSize;
+      });
     }
 
     // 分配剩余宽度
-    if (remainTableContainerWidth > 0) {
-      var excludeColumns = ['expander', 'selection-column'].filter(Boolean);
-      var adjustableColumns = Object.keys(newColumnSizeMap).filter(function (key) {
-        return !excludeColumns.includes(key);
+    var totalWidth = Object.values(result).reduce(function (sum, width) {
+      return sum + width;
+    }, 0);
+    var remainWidth = currentWidth - DEFAULT_TABLE_PADDING - totalWidth;
+    if (remainWidth > 0 && adjustableColumns.length > 0) {
+      var averageExtra = remainWidth / adjustableColumns.length;
+      adjustableColumns.forEach(function (key) {
+        result[key] = Math.min(result[key] + averageExtra, DEFAULT_MAX_SIZE);
       });
-      if (adjustableColumns.length > 0) {
-        var averageExtra = remainTableContainerWidth / adjustableColumns.length;
-        adjustableColumns.forEach(function (key) {
-          newColumnSizeMap[key] += averageExtra;
-        });
-      }
     }
-    return newColumnSizeMap;
-  }, [state.allColumnCount, state.tableContainerWidth]);
+    return result;
+  }, [getAdjustableColumns, getTableWidth, state.tableContainerWidth]);
 
-  // 初始化列宽信息
+  /**
+   * 初始化列宽信息
+   */
   var initializeColumnSizing = useCallback(function (columns) {
     var _localStorage$getItem;
-    if (!Array.isArray(columns) || columns.length === 0) {
-      return;
-    }
-    var cache = JSON.parse((_localStorage$getItem = localStorage.getItem("".concat(tableKey))) !== null && _localStorage$getItem !== void 0 ? _localStorage$getItem : '{}');
+    if (!Array.isArray(columns) || columns.length === 0) return;
     var _getSizeInfo = getSizeInfo(columns),
       allCount = _getSizeInfo.allCount,
       columnSizeMap = _getSizeInfo.columnSizeMap;
-    if (cache && cache !== null && cache !== void 0 && cache.editTime && +new Date() - cache.editTime > CACHE_MAX_AGE) {
-      var _initColumnsSizeMap = _objectSpread({}, columnSizeMap);
-      var _visibleColumnsSizeMap = {};
-      var _notVisibleColumns = Object.keys(columnVisibleConfig).filter(function (key) {
-        return !columnVisibleConfig[key];
-      });
-      var _newAllColumnCount = allCount - _notVisibleColumns.length;
-      Object.keys(_initColumnsSizeMap).forEach(function (key) {
-        if (!_notVisibleColumns.includes(key)) {
-          _visibleColumnsSizeMap[key] = _initColumnsSizeMap[key];
-        }
-      });
-      setState(function (prevState) {
-        var columnSizing = calculateColumnSizing(_visibleColumnsSizeMap, _newAllColumnCount, prevState.tableContainerWidth);
-        return {
-          columnSizing: columnSizing,
-          allColumnCount: _newAllColumnCount,
-          allColumnSizing: _objectSpread(_objectSpread({}, _initColumnsSizeMap), columnSizing),
-          tableContainerWidth: prevState.tableContainerWidth,
-          initColumnsSizeMap: columnSizeMap
-        };
-      });
-      return;
-    }
-    var cacheColumnSizing = cache.columnSizing,
-      cacheColumnVisibility = cache.columnVisibility;
-    var initColumnsSizeMap = _objectSpread(_objectSpread({}, columnSizeMap), cacheColumnSizing);
-    var initColumnsVisibility = _objectSpread(_objectSpread({}, columnVisibleConfig), cacheColumnVisibility);
-    var visibleColumnsSizeMap = {};
-    var notVisibleColumns = Object.keys(initColumnsVisibility).filter(function (key) {
-      return !initColumnsVisibility[key];
-    });
-    var newAllColumnCount = allCount - notVisibleColumns.length;
-    Object.keys(initColumnsSizeMap).forEach(function (key) {
-      if (!notVisibleColumns.includes(key)) {
-        visibleColumnsSizeMap[key] = initColumnsSizeMap[key];
+    var cache = JSON.parse((_localStorage$getItem = localStorage.getItem(tableKey)) !== null && _localStorage$getItem !== void 0 ? _localStorage$getItem : '{}');
+    var now = Date.now();
+    setState(produce(function (prevState) {
+      // 初始化列宽映射
+      var initColumnsSizeMap = _objectSpread({}, columnSizeMap);
+      var visibleColumnsSizeMap = {};
+
+      // 处理缓存过期或无效的情况
+      if (!(cache !== null && cache !== void 0 && cache.editTime) || now - cache.editTime > cacheMaxAge) {
+        Object.keys(initColumnsSizeMap).forEach(function (key) {
+          if (columnVisibleConfig[key] !== false) {
+            visibleColumnsSizeMap[key] = initColumnsSizeMap[key];
+          }
+        });
+      } else {
+        // 使用缓存数据
+        Object.assign(initColumnsSizeMap, cache.columnSizing);
+        Object.assign(columnVisibleConfig, cache.columnVisibility);
+        Object.keys(initColumnsSizeMap).forEach(function (key) {
+          if (columnVisibleConfig[key] !== false) {
+            visibleColumnsSizeMap[key] = initColumnsSizeMap[key];
+          }
+        });
       }
-    });
-    setState(function (prevState) {
-      var columnSizing = calculateColumnSizing(visibleColumnsSizeMap, newAllColumnCount, prevState.tableContainerWidth);
-      return {
-        columnSizing: columnSizing,
-        allColumnSizing: _objectSpread(_objectSpread({}, initColumnsSizeMap), columnSizing),
-        allColumnCount: newAllColumnCount,
-        tableContainerWidth: prevState.tableContainerWidth,
-        initColumnsSizeMap: columnSizeMap
-      };
-    });
-  }, [columnVisibleConfig, tableId, tableKey, tableKeyPrefixCls, calculateColumnSizing]);
+
+      // 计算可见列数
+      var visibleCount = allCount - Object.keys(columnVisibleConfig).filter(function (key) {
+        return !columnVisibleConfig[key];
+      }).length;
+
+      // 计算最终列宽
+      prevState.columnSizing = calculateColumnSizing(visibleColumnsSizeMap, visibleCount, prevState.tableContainerWidth);
+      prevState.allColumnSizing = _objectSpread(_objectSpread({}, initColumnsSizeMap), prevState.columnSizing);
+      prevState.allColumnCount = visibleCount;
+      prevState.initColumnsSizeMap = columnSizeMap;
+    }));
+  }, [calculateColumnSizing, columnVisibleConfig, tableKey, cacheMaxAge]);
 
   /**
-   * 列宽变化
-   * 1。列宽增加，不重新计算其他列
-   * 2.列宽减小：
-   * 列宽之和大于容器宽度，不重新计算
-   * 列宽之和小于容器宽度，当前列的下一列/上一列，增加列宽之与大于容器宽度差值
+   * 列宽变化处理
    */
-  var handleColumnSizingChange = useCallback(function (data) {
-    if (!data) return;
-    var changedColumn = data();
+  var handleColumnSizingChange = useCallback(function (updater) {
+    var changedColumn = updater();
     if (!changedColumn) return;
-    setState(function (prevState) {
-      var changedColumnKey = Object.keys(changedColumn)[0];
-      if (!changedColumnKey) return prevState;
-      var oldWidth = prevState.columnSizing[changedColumnKey] || 0;
-      var newWidth = changedColumn[changedColumnKey] || 0;
-      var widthDiff = newWidth - oldWidth; // 计算宽度变化
+    setState(produce(function (prevState) {
+      var _ref2 = Object.entries(changedColumn)[0],
+        _ref3 = _slicedToArray(_ref2, 2),
+        changedKey = _ref3[0],
+        newWidth = _ref3[1];
+      if (!changedKey) return;
+      var oldWidth = prevState.columnSizing[changedKey] || 0;
+      var widthDiff = newWidth - oldWidth;
 
-      // 创建新的列宽映射
-      var newVisibleColumnsSizing = _objectSpread(_objectSpread({}, prevState.columnSizing), changedColumn);
-
-      // 计算当前总宽度
-      var totalWidth = Object.values(newVisibleColumnsSizing).reduce(function (sum, width) {
-        return Number(sum || 0) + Number(width || 0);
-      }, 0);
-      var containerWidth = getTableWidth() - 10 || 0;
-
-      // 处理列宽变大
-      if (widthDiff > 0) {
-        // 只更新变大的列的宽度
-        return _objectSpread(_objectSpread({}, prevState), {}, {
-          allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing || {}), newVisibleColumnsSizing),
-          columnSizing: newVisibleColumnsSizing
-        });
-      }
+      // 更新列宽
+      prevState.columnSizing[changedKey] = newWidth;
+      prevState.allColumnSizing[changedKey] = newWidth;
 
-      // 处理列宽缩小
+      // 只处理列宽缩小的情况
       if (widthDiff < 0) {
-        // 如果缩小后总列宽小于容器宽度
+        var totalWidth = Object.values(prevState.columnSizing).reduce(function (sum, width) {
+          return sum + width;
+        }, 0);
+        var containerWidth = getTableWidth() - DEFAULT_TABLE_PADDING || 0;
         if (totalWidth < containerWidth) {
-          var widthDifference = containerWidth - totalWidth; // 计算差值
-
-          // 找到当前列的索引
           var columns = Object.keys(prevState.columnSizing);
-          var currentIndex = columns.indexOf(changedColumnKey);
-          var targetColumnKey;
-
-          // 如果当前列是最后一列，处理前一列
-          if (currentIndex === columns.length - 1) {
-            targetColumnKey = columns[currentIndex - 1]; // 前一列
-          } else {
-            targetColumnKey = columns[currentIndex + 1]; // 下一列
-          }
-          // 增加目标列的宽度
-          if (targetColumnKey) {
-            newVisibleColumnsSizing[targetColumnKey] = (newVisibleColumnsSizing[targetColumnKey] || 0) + widthDifference;
+          var currentIndex = columns.indexOf(changedKey);
+          var targetKey = currentIndex < columns.length - 1 ? columns[currentIndex + 1] : columns[currentIndex - 1];
+          if (targetKey) {
+            var widthDifference = containerWidth - totalWidth;
+            prevState.columnSizing[targetKey] += widthDifference;
+            prevState.allColumnSizing[targetKey] += widthDifference;
           }
         }
+      }
+    }));
+  }, [getTableWidth]);
 
-        // 更新当前列的宽度
-        return _objectSpread(_objectSpread({}, prevState), {}, {
-          allColumnSizing: _objectSpread(_objectSpread({}, prevState.allColumnSizing || {}), newVisibleColumnsSizing),
-          columnSizing: newVisibleColumnsSizing
-        });
+  // 监听容器大小变化
+  useEffect(function () {
+    if (!tableContentRef.current) return;
+    var observer = new ResizeObserver(function (entries) {
+      var _entries$;
+      var newWidth = (_entries$ = entries[0]) === null || _entries$ === void 0 ? void 0 : _entries$.contentRect.width;
+      if (newWidth) {
+        debouncedHandleResizeRef.current(newWidth);
       }
-      return prevState; // 如果没有变化，返回原状态
     });
-  }, [tableId, tableKeyPrefixCls]);
+    observer.observe(tableContentRef.current);
+    return function () {
+      return observer.disconnect();
+    };
+  }, [tableContentRef]);
   return {
     columnSizing: state.columnSizing,
     allColumnCount: state.allColumnCount,

package/dist/components/TableMax/type.d.ts

@@ -312,7 +312,9 @@ export type TableMaxProps = {
     request?: (...params: any[]) => Promise<Blob>;
     /**编辑时修改组件值时触发的事件 */
     onEditValueChange?: (field: string, value: any, extra?: any) => void;
+    /**是否有总计行 */
     hasTotalRow?: boolean;
+    /**总计行数据 { '列id': '数据' }*/
     totalDatas?: any[];
 };
 export interface TableMaxColumnType {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arim-aisdc/public-components",
-  "version": "2.3.17",
+  "version": "2.3.18",
   "description": "前端组件库",
   "license": "MIT",
   "main": "dist/index.js",
@@ -59,6 +59,7 @@
     "immer": "^10.0.3",
     "jsep": "^1.3.8",
     "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
     "lottie-web": "^5.12.2",
     "path": "^0.12.7",
     "react-activation": "^0.12.4",
@@ -66,6 +67,8 @@
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
     "react-draggable": "^4.4.6",
+    "react-resizable": "^3.0.5",
+    "react-rnd": "^10.5.2",
     "react-router-dom": "^6.22.3",
     "react-split-pane": "^0.1.92"
   },