ztxkui 4.2.18-2 → 4.2.18-21

package/dist/components/Table/hooks/useColumns.js

@@ -14,64 +14,118 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from) {
         to[j] = from[i];
     return to;
 };
-import React, { useCallback, useEffect, useState, useRef } from 'react';
+import React, { useCallback, useState, useRef, useMemo } from 'react';
+import { unstable_batchedUpdates } from 'react-dom';
 import Button from '../../Button';
 import { Popconfirm } from '../../../index';
 import { PicRightOutlined, MinusSquareOutlined } from '@ant-design/icons';
 import TableAddDelColumn from '../table-adddel-column';
+import TableHeadTooltip from '../table-headTooltip';
 import { getInnerIndex } from './useInnerPagination';
+import TableSortTitle from '../table-sort';
+import FilterDropdown from '../components/FilterDropdown';
+import FillDown from '../components/FillDown';
+import { SearchOutlined } from '@ant-design/icons';
+import { filterHandle } from '../utils/filterHandle';
 // 获取表格columns完整数据
 export var getTableLayoutFullData = function (columns, tableLayout) {
+    // const columns = _columns.map((item) => {
+    //   return {
+    //     ...item,
+    //     key: item?.key || item?.title,
+    //     dataIndex: item?.dataIndex || item?.title,
+    //   };
+    // });
     if (Array.isArray(tableLayout) && tableLayout.length > 0) {
-        var preColumns_1 = [];
+        var newAddColumns_1 = columns.filter(function (item) { return (item === null || item === void 0 ? void 0 : item.key) || (item === null || item === void 0 ? void 0 : item.dataIndex); });
+        // 找到没有传key 但是传了 fixed属性的字段
+        // 这块将 !== 'right'逻辑 改成 === 'left'逻辑
+        // 避免命中 { title: 'xxxx', render: xxx } || { title: 'xx', children: [..] }
+        var preColumns_1 = columns.filter(function (item) {
+            return !(item === null || item === void 0 ? void 0 : item.key) &&
+                !(item === null || item === void 0 ? void 0 : item.dataIndex) &&
+                ((item === null || item === void 0 ? void 0 : item.fixed) === 'left' || (item === null || item === void 0 ? void 0 : item.fixed) === true);
+        });
         var middleColumns_1 = [];
-        var afterColumns_1 = [];
+        var afterColumns_1 = columns.filter(function (item) { return !(item === null || item === void 0 ? void 0 : item.key) && !(item === null || item === void 0 ? void 0 : item.dataIndex) && (item === null || item === void 0 ? void 0 : item.fixed) === 'right'; });
         // 这里存在，业务可能会修改原始columns数据，所以按照columns数据，将本地存储数据换新
         // 1. 如果本地存储中有，原始columns中没有，那么删除掉本地存储中的
         // 2. 将数据 按照 原始数据中的 是否固定 固定位置来分组。前 中 后三组
         // 3. 缓存的数据只用来合并中间的并且能在原始columns中找到的内容
         tableLayout.forEach(function (item) {
             if ((item === null || item === void 0 ? void 0 : item.key) || (item === null || item === void 0 ? void 0 : item.dataIndex)) {
-                var result = columns.find(function (column) {
-                    if (column.key) {
-                        return column.key === (item === null || item === void 0 ? void 0 : item.key);
+                var index = newAddColumns_1.findIndex(function (column) {
+                    if (column.key && item.key && column.key === (item === null || item === void 0 ? void 0 : item.key)) {
+                        return true;
+                    }
+                    if (column.dataIndex &&
+                        item.dataIndex &&
+                        column.dataIndex === (item === null || item === void 0 ? void 0 : item.dataIndex)) {
+                        return true;
                     }
-                    if (column.dataIndex) {
-                        return column.dataIndex === (item === null || item === void 0 ? void 0 : item.dataIndex);
+                    if (column.title && item.title && column.title === (item === null || item === void 0 ? void 0 : item.title)) {
+                        return true;
                     }
                     return false;
                 });
                 // 如果能再原始数据中找到对应的值
-                if (result && !result.fixed) {
-                    middleColumns_1.push(__assign(__assign({}, result), item));
+                if (index > -1) {
+                    var result = newAddColumns_1[index];
+                    var column = __assign(__assign({}, result), item);
+                    // 兼容存入localstorge里面的旧数据
+                    if (!item.key || !item.dataIndex) {
+                        column = result;
+                    }
+                    // 如果业务代码中设置了hideColumn，那么不做自定义显隐控制
+                    // if (result.hideColumn !== undefined) {
+                    //   column.hideColumn = result.hideColumn;
+                    //   column.isNoDynamicHide = true;
+                    // }
+                    if (!column.fixed) {
+                        middleColumns_1.push(column);
+                    }
+                    else if (column.fixed === 'left' || column.fixed === true) {
+                        preColumns_1.push(column);
+                    }
+                    else if (column.fixed === 'right') {
+                        afterColumns_1.push(column);
+                    }
+                    newAddColumns_1.splice(index, 1);
                 }
                 // 如果没有在原始数据中找到对应的值，那说明这个应该删除，不应该添加进去
             }
             else if (item.children && !item.fixed) {
-                middleColumns_1.push(__assign({}, item));
+                // 这里处理一下children里面的render方法。
+                // 这里没办法 因为可能children里面有render方法。
+                // 必须要用columns里面的来替换下 但是因为没有唯一键。所以只能通过title来做判断
+                var cColumn = columns.find(function (c) { return c.title === item.title; });
+                middleColumns_1.push(__assign(__assign({}, item), cColumn));
             }
             // 如果没有key 或者dataIndex 则说明该值不应该存在
             // return {
             //   ...item,
             // };
         });
-        // 在按照规则，将原始columns中可能新增的数据，做一下处理
-        // 1. 取出所有定位元素，将定位元素添加到对应的组内
-        // 2. 找到所有没有定位的元素，并且tableLayout中中间元素中不存在的元素
-        columns
-            .filter(function (column) { return column.fixed; })
-            .forEach(function (column) {
-            if (column.fixed === 'left') {
+        // 可能遍历到最后，newAddColumns里面可能还有值 并且他可能是固定列配置的项，所以需要再遍历一次 过滤调这些固定的选项
+        var filterNewAddColumns = newAddColumns_1.filter(function (column) {
+            if (column.fixed === 'left' || column.fixed === true) {
                 preColumns_1.push(__assign({}, column));
+                return false;
             }
             else if (column.fixed === 'right') {
                 afterColumns_1.push(__assign({}, column));
+                return false;
             }
+            return true;
         });
-        var newAddColumns = columns.filter(function (column) {
-            return !column.fixed && !middleColumns_1.find(function (item) { return item.key === column.key; });
-        });
-        return __spreadArray(__spreadArray(__spreadArray(__spreadArray([], preColumns_1), middleColumns_1), newAddColumns), afterColumns_1);
+        // 在按照规则，将原始columns中可能新增的数据，做一下处理
+        // 1. 取出所有定位元素，将定位元素添加到对应的组内
+        // 2. 找到所有没有定位的元素，并且tableLayout中中间元素中不存在的元素
+        // const newAddColumns = columns.filter(
+        //   (column) =>
+        //     !column.fixed && !middleColumns.find((item) => item.key === column.key)
+        // );
+        return __spreadArray(__spreadArray(__spreadArray(__spreadArray([], preColumns_1), middleColumns_1), filterNewAddColumns), afterColumns_1);
     }
     return columns;
 };
@@ -81,7 +135,7 @@ export var LOCALSTORAGE_KEY = 'ztui_dynamic_table_key';
 export var LOCALSTORAGE_LRU_KEY = 'ztui_dynamic_table_lru_key';
 // 搜索表单存储表单最大长度
 export var LOCALSTORAGE_LRU_MAX_SIZE = 500;
-function getStorage(key) {
+export function getStorage(key) {
     // 历史数据处理
     // 直接从localstorage中取key值，如果能取到，那么需要删除原先的值，重新设置到统一出处
     // 如果不能取到，那么什么都不做
@@ -152,134 +206,172 @@ export function setDynamicKey(dynamicStorageKey, value) {
     obj[dynamicStorageKey] = value;
     localStorage.setItem(LOCALSTORAGE_KEY, JSON.stringify(obj));
     localStorage.setItem(LOCALSTORAGE_LRU_KEY, JSON.stringify(lruKeys));
+    // // 2023-11-29
+    // // 设置表格动态列配置相关信息
+    // catchHandle(
+    //   {
+    //     customKey: LOCALSTORAGE_KEY,
+    //     customValue: JSON.stringify(obj),
+    //     mark: '表格动态列配置缓存数据',
+    //   },
+    //   'table_id'
+    // );
+    // catchHandle(
+    //   {
+    //     customKey: LOCALSTORAGE_LRU_KEY,
+    //     customValue: JSON.stringify(lruKeys),
+    //     mark: '表格动态列配置缓存LRUKey数据',
+    //   },
+    //   'table_lru_id'
+    // );
 }
-function useColumns(props) {
-    var columns = props.columns, showColumnDynamic = props.showColumnDynamic, showColumnDynamicKey = props.showColumnDynamicKey, onAddAndDelHandle = props.onAddAndDelHandle, hideAddIcon = props.hideAddIcon, showDelAllBtn = props.showDelAllBtn, delAllChange = props.delAllChange, addIconText = props.addIconText, hideDelIcon = props.hideDelIcon, delIconText = props.delIconText, showDynamicHandle = props.showDynamicHandle, onEditableSave = props.onEditableSave, configInfo = props.configInfo, copyByKey = props.copyByKey, onTableChange = props.onTableChange, currentPage = props.currentPage;
-    var tableLayout = getStorage(showColumnDynamicKey);
-    var newColumnsRef = useRef();
-    // 新的columns
-    var _a = useState(getTableLayoutFullData(columns, tableLayout)), newColumns = _a[0], setNewColumns = _a[1];
-    // 需要动态配置的列
-    var _b = useState(getTableLayoutFullData(columns, tableLayout)), dynamicColumns = _b[0], setDynamicColumns = _b[1];
-    // 动态列配置显隐
-    var ColumnDynamicCom = useCallback(function () { return (React.createElement(PicRightOutlined, { className: "zt-column--daynamic-icon", onClick: showDynamicHandle })); }, [showDynamicHandle]);
-    // 动态列配置显隐
-    var DelAllCom = useCallback(function () {
-        return showDelAllBtn ? (React.createElement(Popconfirm, { title: "\u662F\u5426\u5168\u90E8\u5220\u9664", onConfirm: function () { return delAllChange && delAllChange(); } },
-            React.createElement(MinusSquareOutlined, { className: "zt-column--daynamic-icon", style: { marginLeft: '4px' } }))) : null;
-    }, [delAllChange, showDelAllBtn]);
-    useEffect(function () {
-        var tableLayout = getStorage(showColumnDynamicKey);
-        var catchColumns = getTableLayoutFullData(columns, tableLayout);
-        if (!Array.isArray(catchColumns)) {
-            throw new Error('columns 必须为一个数组');
-        }
-        // 根据配置处理columns
-        // 主要处理是否隐藏
-        // 是否添加required配置
-        var _columns = [];
-        if (configInfo && Object.keys(configInfo).length > 0) {
-            catchColumns.forEach(function (col) {
-                var _a, _b, _c, _d;
-                var _column = __assign({}, col);
-                var dataIndex = _column.dataIndex;
-                if (!dataIndex) {
-                    _columns.push(__assign({}, _column));
-                }
-                else {
-                    // 如果没有配置，或者配置isRequired为存在
-                    if (((_a = configInfo[dataIndex]) === null || _a === void 0 ? void 0 : _a.isRequired) === 1 ||
-                        ((_b = configInfo[dataIndex]) === null || _b === void 0 ? void 0 : _b.isRequired) === '1') {
-                        _column.required = true;
-                    }
-                    else {
-                        _column.validate = undefined;
-                    }
-                    // 如果没有配置，或者配置isDisplay为存在
-                    if (!configInfo[dataIndex] ||
-                        ((_c = configInfo[dataIndex]) === null || _c === void 0 ? void 0 : _c.isDisplay) === 1 ||
-                        ((_d = configInfo[dataIndex]) === null || _d === void 0 ? void 0 : _d.isDisplay) === '1') {
-                        _columns.push(__assign({}, _column));
-                    }
-                }
-            });
-        }
-        else {
-            _columns = catchColumns;
-        }
-        var _newColumns = [];
-        var _dynamicColumns = [];
-        // 处理columns
-        _columns.forEach(function (col) {
+function getNewColumns(basicConfig, editableConfig, dynamicConfig, otherConfig) {
+    var columns = basicConfig.columns, newColumnsRef = basicConfig.newColumnsRef, showColumnDynamic = basicConfig.showColumnDynamic, showColumnDynamicKey = basicConfig.showColumnDynamicKey, configInfo = basicConfig.configInfo, currentDataSource = basicConfig.currentDataSource, preDataSource = basicConfig.preDataSource, rowKey = basicConfig.rowKey, dataSourceRef = basicConfig.dataSourceRef, expandableChildrenColumnName = basicConfig.expandableChildrenColumnName, upDateColumnsRef = basicConfig.upDateColumnsRef, setUpDateColumnsRef = basicConfig.setUpDateColumnsRef, isUpDateColumnsRef = basicConfig.isUpDateColumnsRef, setIsUpDateColumnsRef = basicConfig.setIsUpDateColumnsRef;
+    var onEditableSave = editableConfig.onEditableSave, onTableChange = editableConfig.onTableChange, currentPage = editableConfig.currentPage, onFillDownChangeRef = editableConfig.onFillDownChangeRef;
+    var ColumnDynamicCom = dynamicConfig.ColumnDynamicCom, DelAllCom = dynamicConfig.DelAllCom, onAddAndDelHandleMemo = dynamicConfig.onAddAndDelHandleMemo, onAddAndDelHandle = dynamicConfig.onAddAndDelHandle, hideAddIcon = dynamicConfig.hideAddIcon, addIconText = dynamicConfig.addIconText, hideDelIcon = dynamicConfig.hideDelIcon, delIconText = dynamicConfig.delIconText;
+    var copyByKey = otherConfig.copyByKey, myCatchColumns = otherConfig.myCatchColumns, customSortHandle = otherConfig.customSortHandle, customOrder = otherConfig.customOrder, setCustomOrder = otherConfig.setCustomOrder, isSort = otherConfig.isSort, handleSearch = otherConfig.handleSearch, handleReset = otherConfig.handleReset, searchInput = otherConfig.searchInput;
+    var tableLayout = showColumnDynamicKey
+        ? getStorage(showColumnDynamicKey)
+        : myCatchColumns;
+    var catchColumns = getTableLayoutFullData(columns, tableLayout);
+    if (!Array.isArray(catchColumns)) {
+        throw new Error('columns 必须为一个数组');
+    }
+    // 根据配置处理columns
+    // 主要处理是否隐藏
+    // 是否添加required配置
+    var _columns = [];
+    if (configInfo && Object.keys(configInfo).length > 0) {
+        catchColumns.forEach(function (col) {
+            var _a, _b, _c, _d;
             var _column = __assign({}, col);
-            // 添加超出隐藏
-            // !_column.render 兼容下拉框滚动行为，设置了ellipsis的话，会导致overflow:hidden，导致一些问题
-            if (_column.ellipsis !== false) {
-                _column.ellipsis = true;
+            var dataIndex = _column.dataIndex;
+            if (!dataIndex) {
+                _columns.push(__assign({}, _column));
             }
-            // 如果列需要编辑
-            if (_column.editable) {
-                var title_1 = _column.title, editable_1 = _column.editable, editableConfig_1 = _column.editableConfig, dataIndex_1 = _column.dataIndex;
-                _column = __assign(__assign({}, _column), { onCell: function (record, index) {
-                        return ({
-                            record: record,
-                            index: index,
-                            editable: editable_1,
-                            editableConfig: editableConfig_1,
-                            dataIndex: dataIndex_1,
-                            title: title_1,
-                            handleSave: onEditableSave,
-                            columns: function () { return newColumnsRef.current; },
-                            onTableChange: onTableChange,
-                            currentpage: currentPage,
-                        });
-                    } });
-                // 兼容下拉框滚动行为
-                if ((editableConfig_1 === null || editableConfig_1 === void 0 ? void 0 : editableConfig_1.type) === 'select') {
-                    _column.ellipsis = false;
+            else {
+                // 如果没有配置，或者配置isRequired为存在
+                if (((_a = configInfo[dataIndex]) === null || _a === void 0 ? void 0 : _a.isRequired) === 1 ||
+                    ((_b = configInfo[dataIndex]) === null || _b === void 0 ? void 0 : _b.isRequired) === '1') {
+                    _column.required = true;
                 }
-            }
-            // 如果列需要添加复制按钮
-            if (_column.showCopy) {
-                if (_column.validate) {
-                    _column.validate.title = _column.validate.title
-                        ? _column.validate.title
-                        : _column.title;
+                else {
+                    _column.validate = undefined;
+                }
+                // 如果没有配置，或者配置isDisplay为存在
+                if (!configInfo[dataIndex] ||
+                    ((_c = configInfo[dataIndex]) === null || _c === void 0 ? void 0 : _c.isDisplay) === 1 ||
+                    ((_d = configInfo[dataIndex]) === null || _d === void 0 ? void 0 : _d.isDisplay) === '1') {
+                    _columns.push(__assign({}, _column));
                 }
-                _column.title = (React.createElement(React.Fragment, null,
-                    _column.title,
-                    React.createElement(Button, { type: "link", onClick: function () {
-                            copyByKey(typeof _column.showCopy === 'string'
-                                ? _column.showCopy
-                                : _column.key || _column.dataIndex);
-                        }, style: {
-                            fontSize: '13px',
-                            marginLeft: '2px',
-                            display: 'block',
-                            width: '100%',
-                            textAlign: _column.align,
-                        } }, "\u590D\u5236\u6574\u5217")));
-            }
-            // 如果配置了固定列的 不做处理
-            if (!col.fixed) {
-                _dynamicColumns.push(__assign({}, col));
             }
-            // 添加必填标识
-            if (typeof _column.required === 'function') {
-                var res = _column.required();
-                var _res = typeof res === 'boolean' ? res : res === 1 || res === '1';
-                if (_res) {
-                    if (_column.validate) {
-                        _column.validate.title = _column.validate.title
-                            ? _column.validate.title
-                            : _column.title;
+        });
+    }
+    else {
+        _columns = catchColumns;
+    }
+    var _newColumns = [];
+    var _dynamicColumns = [];
+    // 处理columns
+    _columns.forEach(function (col, index) {
+        var _column = __assign({}, col);
+        var align = _column.align;
+        // 这里解决一个bug，对于dataSource.slice().reverse() 之后。scu配置的字段并不会更新 render中的index
+        if (_column.shouldCellUpdate) {
+            var fn_1 = _column.shouldCellUpdate;
+            _column.shouldCellUpdate = function (record, preRecord) {
+                try {
+                    var recordKey_1 = record[rowKey];
+                    if (Array.isArray(currentDataSource) &&
+                        Array.isArray(preDataSource)) {
+                        var currentIndex = currentDataSource.findIndex(function (item) { return item[rowKey] === recordKey_1; });
+                        var preIndex = preDataSource.findIndex(function (item) { return item[rowKey] === recordKey_1; });
+                        if (currentIndex !== preIndex) {
+                            return true;
+                        }
+                        if (typeof _column.dataIndex === 'string' &&
+                            record[_column.dataIndex] !== preRecord[_column.dataIndex]) {
+                            return true;
+                        }
+                        // 通过dynamic配置更新fixed的时候，触发更新
+                        if (upDateColumnsRef.current &&
+                            upDateColumnsRef.current[index] &&
+                            upDateColumnsRef.current[index].fixed !== _column.fixed) {
+                            setUpDateColumnsRef(_column, index);
+                            return true;
+                        }
+                        if (isUpDateColumnsRef.current) {
+                            setIsUpDateColumnsRef(false);
+                            return true;
+                        }
                     }
-                    _column.title = (React.createElement(React.Fragment, null,
-                        React.createElement("i", { className: "zt-column--required" }, "*"),
-                        _column.title));
                 }
+                catch (err) {
+                    console.log(err);
+                }
+                return fn_1(record, preRecord);
+            };
+        }
+        // 添加超出隐藏
+        // !_column.render 兼容下拉框滚动行为，设置了ellipsis的话，会导致overflow:hidden，导致一些问题
+        if (_column.ellipsis !== false) {
+            _column.ellipsis = true;
+        }
+        // 如果列需要编辑
+        if (_column.editable) {
+            var title_1 = _column.title, editable_1 = _column.editable, editableConfig_1 = _column.editableConfig, dataIndex_1 = _column.dataIndex;
+            _column = __assign(__assign({}, _column), { onCell: function (record, index) {
+                    return ({
+                        record: record,
+                        index: index,
+                        editable: editable_1,
+                        editableConfig: editableConfig_1,
+                        dataIndex: dataIndex_1,
+                        title: title_1,
+                        handleSave: onEditableSave,
+                        columns: function () { return newColumnsRef.current; },
+                        onTableChange: onTableChange,
+                        dataSource: function () { return dataSourceRef.current; },
+                        currentpage: currentPage,
+                        rowKey: rowKey,
+                        expandableChildrenColumnName: expandableChildrenColumnName,
+                    });
+                } });
+            // 兼容下拉框滚动行为
+            if ((editableConfig_1 === null || editableConfig_1 === void 0 ? void 0 : editableConfig_1.type) === 'select') {
+                _column.ellipsis = false;
             }
-            else if (_column.required) {
+        }
+        // 如果列需要添加复制按钮
+        if (_column.showCopy) {
+            if (_column.validate) {
+                _column.validate.title = _column.validate.title
+                    ? _column.validate.title
+                    : _column.title;
+            }
+            _column.title = (React.createElement(React.Fragment, null,
+                _column.title,
+                React.createElement(Button, { type: "link", onClick: function () {
+                        copyByKey(typeof _column.showCopy === 'string'
+                            ? _column.showCopy
+                            : _column.key || _column.dataIndex);
+                    }, style: {
+                        fontSize: '13px',
+                        marginLeft: '2px',
+                        display: 'block',
+                        width: '100%',
+                        textAlign: _column.align,
+                    } }, "\u590D\u5236\u6574\u5217")));
+        }
+        // 如果配置了固定列的 不做处理
+        // if (!col.fixed) {
+        _dynamicColumns.push(__assign({}, col));
+        // }
+        // 添加必填标识
+        if (typeof _column.required === 'function') {
+            var res = _column.required();
+            var _res = typeof res === 'boolean' ? res : res === 1 || res === '1';
+            if (_res) {
                 if (_column.validate) {
                     _column.validate.title = _column.validate.title
                         ? _column.validate.title
@@ -289,69 +381,279 @@ function useColumns(props) {
                     React.createElement("i", { className: "zt-column--required" }, "*"),
                     _column.title));
             }
-            // 去掉不显示表头的项
-            if (!_column.hideColumn) {
-                _newColumns.push(_column);
+        }
+        else if (_column.required) {
+            if (_column.validate) {
+                _column.validate.title = _column.validate.title
+                    ? _column.validate.title
+                    : _column.title;
             }
-            // 添加render字段
-            if (!_column.render) {
-                _column.render = function (text, record, index) {
-                    return text == null || text === '' ? '— —' : text;
+            _column.title = (React.createElement(React.Fragment, null,
+                React.createElement("i", { className: "zt-column--required" }, "*"),
+                _column.title));
+        }
+        // 去掉不显示表头的项
+        if (!_column.hideColumn) {
+            _newColumns.push(_column);
+        }
+        // 添加render字段
+        if (!_column.render) {
+            _column.render = function (text, record, index) {
+                return text == null || text === '' ? '— —' : text;
+            };
+        }
+        // 添加表头提示信息
+        if (_column.headTooltip) {
+            _column.title = (React.createElement(TableHeadTooltip, { headTooltip: _column.headTooltip }, _column.title));
+        }
+        // 往下复制
+        if (_column.isFillDown) {
+            var title_2 = _column.title;
+            _column.title = function () {
+                return (React.createElement(FillDown, { title: title_2, field: key, onClick: onFillDownChangeRef }));
+            };
+        }
+        // 添加过滤规则
+        var filterKey = _column.key || _column.dataIndex;
+        if (_column.isFilter === true &&
+            typeof filterKey === 'string' &&
+            !onEditableSave) {
+            _column.filterDropdown = function (_a) {
+                var setSelectedKeys = _a.setSelectedKeys, selectedKeys = _a.selectedKeys, confirm = _a.confirm, clearFilters = _a.clearFilters;
+                return (React.createElement(FilterDropdown, { searchInputRef: searchInput, setSelectedKeys: setSelectedKeys, selectedKeys: selectedKeys, confirm: confirm, clearFilters: clearFilters, dataIndex: filterKey, handleSearch: handleSearch, handleReset: handleReset, dataSourceRef: dataSourceRef }));
+            };
+            _column.filterIcon = function () { return React.createElement(SearchOutlined, null); };
+            _column.onFilter = function (value, record) {
+                var arg = [];
+                for (var _i = 2; _i < arguments.length; _i++) {
+                    arg[_i - 2] = arguments[_i];
+                }
+                return filterHandle(value, record, filterKey);
+            };
+            _column.onFilterDropdownVisibleChange = function (visible) {
+                if (visible) {
+                    setTimeout(function () { var _a; return (_a = searchInput.current) === null || _a === void 0 ? void 0 : _a.select(); }, 100);
+                }
+            };
+        }
+        // 2023-05-04 添加排序功能 如果是必填字段 不做处理
+        var key = col.dataIndex;
+        if (typeof key === 'string' && !onEditableSave && !_column.required) {
+            // 如果用户传入了排序字段，那么说明该列需要排序
+            if (_column.sorter === true) {
+                var title_3 = _column.title;
+                _column.title = function () {
+                    return (React.createElement(TableSortTitle, { title: title_3, field: key, customOrder: customOrder, setCustomOrder: setCustomOrder, onChange: customSortHandle, align: align }));
                 };
+                _column.sorter = false;
             }
-        });
-        if (showColumnDynamic) {
-            // 如果需要展示动态列
-            if (!onAddAndDelHandle) {
-                // 并且不需要展示删减功能，那么动态列，加到序号列，也就是第0项
-                _newColumns[0].title = function () { return React.createElement(ColumnDynamicCom, null); };
+            // 如果传入得排序函数
+            if (typeof _column.sorter === 'function') {
+                var title_4 = _column.title;
+                var sorterHandle_1 = _column.sorter;
+                _column.title = function () {
+                    return (React.createElement(TableSortTitle, { title: title_4, field: key, customOrder: customOrder, setCustomOrder: setCustomOrder, align: align, onChange: function (info) {
+                            customSortHandle(info, { sorterHandle: sorterHandle_1 });
+                        } }));
+                };
+                _column.sorter = false;
             }
-            else {
-                // 需要展示删减功能
-                var newColumn = {
-                    title: function () { return (React.createElement(React.Fragment, null,
-                        React.createElement(ColumnDynamicCom, null),
-                        React.createElement(DelAllCom, null))); },
-                    width: 52,
-                    fixed: 'left',
-                    align: 'center',
-                    render: function (text, render, index) { return (React.createElement(TableAddDelColumn, { onAddAndDelHandle: function (type) {
-                            var innerIndex = getInnerIndex(currentPage, index);
-                            onAddAndDelHandle(type, innerIndex);
-                        }, hideAddIcon: hideAddIcon, addIconText: addIconText, hideDelIcon: hideDelIcon, delIconText: delIconText })); },
+            // 纯粹的前端排序
+            if (_column.sorter == null && isSort) {
+                var title_5 = _column.title;
+                _column.title = function () {
+                    return (React.createElement(TableSortTitle, { title: title_5, field: key, customOrder: customOrder, setCustomOrder: setCustomOrder, onChange: customSortHandle, align: align }));
                 };
-                _newColumns.unshift(newColumn);
             }
         }
-        else if (onAddAndDelHandle) {
-            // 没有动态列配置
+    });
+    if (showColumnDynamic) {
+        // 如果需要展示动态列
+        if (!onAddAndDelHandle) {
+            // 并且不需要展示删减功能，那么动态列，加到序号列，也就是第0项
+            _newColumns[0].title = function () { return React.createElement(ColumnDynamicCom, null); };
+            _newColumns[0].filterDropdown = undefined;
+            _newColumns[0].filterIcon = undefined;
+            _newColumns[0].onFilter = undefined;
+            _newColumns[0].onFilterDropdownVisibleChange = undefined;
+        }
+        else {
+            // 需要展示删减功能
             var newColumn = {
                 title: function () { return (React.createElement(React.Fragment, null,
+                    React.createElement(ColumnDynamicCom, null),
                     React.createElement(DelAllCom, null))); },
                 width: 52,
                 fixed: 'left',
                 align: 'center',
-                render: function (text, render, index) { return (React.createElement(TableAddDelColumn, { onAddAndDelHandle: function (type) { return onAddAndDelHandle(type, index); }, hideAddIcon: hideAddIcon, addIconText: addIconText, hideDelIcon: hideDelIcon, delIconText: delIconText })); },
+                render: function (text, record, index) { return (React.createElement(TableAddDelColumn, { onAddAndDelHandle: onAddAndDelHandleMemo, index: index, hideAddIcon: hideAddIcon, addIconText: addIconText, hideDelIcon: hideDelIcon, record: record, delIconText: delIconText })); },
             };
             _newColumns.unshift(newColumn);
         }
-        setNewColumns(_newColumns);
-        setDynamicColumns(_dynamicColumns);
-        newColumnsRef.current = _newColumns;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }
+    else if (onAddAndDelHandle) {
+        // 没有动态列配置
+        var newColumn = {
+            title: function () { return (React.createElement(React.Fragment, null,
+                React.createElement(DelAllCom, null))); },
+            width: 52,
+            fixed: 'left',
+            align: 'center',
+            render: function (text, record, index) { return (React.createElement(TableAddDelColumn, { onAddAndDelHandle: onAddAndDelHandleMemo, index: index, hideAddIcon: hideAddIcon, addIconText: addIconText, hideDelIcon: hideDelIcon, record: record, delIconText: delIconText })); },
+        };
+        _newColumns.unshift(newColumn);
+    }
+    newColumnsRef.current = _newColumns;
+    return {
+        _newColumns: _newColumns,
+        _dynamicColumns: _dynamicColumns,
+    };
+}
+function useColumns(props) {
+    var columns = props.columns, hiddenColumnDynamicIcon = props.hiddenColumnDynamicIcon, showColumnDynamic = props.showColumnDynamic, showColumnDynamicKey = props.showColumnDynamicKey, onAddAndDelHandle = props.onAddAndDelHandle, hideAddIcon = props.hideAddIcon, showDelAllBtn = props.showDelAllBtn, delAllChange = props.delAllChange, addIconText = props.addIconText, hideDelIcon = props.hideDelIcon, delIconText = props.delIconText, showDynamicHandle = props.showDynamicHandle, onEditableSave = props.onEditableSave, configInfo = props.configInfo, copyByKey = props.copyByKey, onTableChange = props.onTableChange, currentPage = props.currentPage, currentDataSource = props.currentDataSource, preDataSource = props.preDataSource, rowKey = props.rowKey, dataSourceRef = props.dataSourceRef, expandableChildrenColumnName = props.expandableChildrenColumnName, customSortHandle = props.customSortHandle, customOrder = props.customOrder, setCustomOrder = props.setCustomOrder, isSort = props.isSort, onFillDownChangeRef = props.onFillDownChangeRef;
+    var newColumnsRef = useRef();
+    var _a = useAsyncSetValue(columns), upDateColumnsRef = _a[0], setUpDateColumnsRef = _a[1];
+    var _b = useAsyncSetValue(false), isUpDateColumnsRef = _b[0], setIsUpDateColumnsRef = _b[1];
+    var searchInput = useRef(null);
+    var handleSearch = function (selectedKeys, confirm, dataIndex) {
+        confirm();
+    };
+    var handleReset = function (clearFilters) {
+        clearFilters();
+    };
+    // 动态列配置显隐
+    var ColumnDynamicCom = useCallback(function () {
+        return hiddenColumnDynamicIcon ? null : (React.createElement(PicRightOutlined, { className: "zt-column--daynamic-icon", onClick: showDynamicHandle }));
+    }, [showDynamicHandle, hiddenColumnDynamicIcon]);
+    // 动态列配置显隐
+    var DelAllCom = useCallback(function () {
+        return showDelAllBtn ? (React.createElement(Popconfirm, { title: "\u662F\u5426\u5168\u90E8\u5220\u9664", onConfirm: function () { return delAllChange && delAllChange(); } },
+            React.createElement(MinusSquareOutlined, { className: "zt-column--daynamic-icon", style: { marginLeft: '4px' } }))) : null;
+    }, [delAllChange, showDelAllBtn]);
+    // 增减行回调
+    var onAddAndDelHandleMemo = useCallback(function (type, index) {
+        unstable_batchedUpdates(function () {
+            var innerIndex = getInnerIndex(currentPage, index);
+            onAddAndDelHandle && onAddAndDelHandle(type, innerIndex);
+        });
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [onAddAndDelHandle]);
+    // 设置方法
+    var getNewColumnsMemo = useCallback(function (columns, refresh, myCatchColumns) {
+        // console.log('计算', currentDataSource, preDataSource);
+        return getNewColumns({
+            columns: columns,
+            newColumnsRef: newColumnsRef,
+            showColumnDynamic: showColumnDynamic,
+            showColumnDynamicKey: showColumnDynamicKey,
+            configInfo: configInfo,
+            currentDataSource: currentDataSource,
+            preDataSource: preDataSource,
+            rowKey: rowKey,
+            dataSourceRef: dataSourceRef,
+            expandableChildrenColumnName: expandableChildrenColumnName,
+            upDateColumnsRef: upDateColumnsRef,
+            setUpDateColumnsRef: setUpDateColumnsRef,
+            isUpDateColumnsRef: isUpDateColumnsRef,
+            setIsUpDateColumnsRef: setIsUpDateColumnsRef,
+        }, {
+            onEditableSave: onEditableSave,
+            onTableChange: onTableChange,
+            onFillDownChangeRef: onFillDownChangeRef,
+            currentPage: currentPage,
+        }, {
+            ColumnDynamicCom: ColumnDynamicCom,
+            DelAllCom: DelAllCom,
+            onAddAndDelHandleMemo: onAddAndDelHandleMemo,
+            onAddAndDelHandle: onAddAndDelHandle,
+            hideAddIcon: hideAddIcon,
+            addIconText: addIconText,
+            hideDelIcon: hideDelIcon,
+            delIconText: delIconText,
+        }, {
+            copyByKey: copyByKey,
+            myCatchColumns: myCatchColumns,
+            customSortHandle: customSortHandle,
+            customOrder: customOrder,
+            setCustomOrder: setCustomOrder,
+            isSort: isSort,
+            handleSearch: handleSearch,
+            handleReset: handleReset,
+            searchInput: searchInput,
+        });
     }, [
-        columns,
         showColumnDynamic,
+        showColumnDynamicKey,
+        configInfo,
+        onEditableSave,
+        onTableChange,
+        currentPage,
+        ColumnDynamicCom,
+        DelAllCom,
+        onAddAndDelHandleMemo,
         onAddAndDelHandle,
         hideAddIcon,
         addIconText,
         hideDelIcon,
         delIconText,
-        ColumnDynamicCom,
-        onEditableSave,
-        configInfo,
-        showColumnDynamicKey,
+        copyByKey,
+        currentDataSource,
+        preDataSource,
+        rowKey,
+        dataSourceRef,
+        expandableChildrenColumnName,
+        customSortHandle,
+        customOrder,
+        setCustomOrder,
+        upDateColumnsRef,
+        setUpDateColumnsRef,
+        isUpDateColumnsRef,
+        setIsUpDateColumnsRef,
+        isSort,
+        onFillDownChangeRef,
     ]);
-    return { newColumns: newColumns, dynamicColumns: dynamicColumns, setNewColumns: setNewColumns };
+    var _c = useState(false), refreshColumns = _c[0], setRefreshColumns = _c[1];
+    var _d = useState([]), myCatchColumns = _d[0], setMyCatchColumns = _d[1];
+    var refreshColumnsHandle = useCallback(function (columns) {
+        unstable_batchedUpdates(function () {
+            setRefreshColumns(function (refresh) { return !refresh; });
+            setIsUpDateColumnsRef(true);
+            if (columns) {
+                setMyCatchColumns(columns);
+            }
+            else {
+                setMyCatchColumns([]);
+            }
+        });
+    }, [setIsUpDateColumnsRef]);
+    var calcColumns = useMemo(function () {
+        return getNewColumnsMemo(columns, refreshColumns, myCatchColumns);
+    }, [getNewColumnsMemo, columns, refreshColumns, myCatchColumns]);
+    return {
+        newColumns: calcColumns._newColumns,
+        dynamicColumns: calcColumns._dynamicColumns,
+        refreshColumnsHandle: refreshColumnsHandle,
+    };
+}
+// 异步修改值
+function useAsyncSetValue(initialValue) {
+    var timeoutRef = useRef();
+    var targetRef = useRef(initialValue);
+    var setValue = useCallback(function (value, index) {
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+            timeoutRef.current = null;
+        }
+        timeoutRef.current = setTimeout(function () {
+            if (Array.isArray(targetRef.current)) {
+                targetRef.current[index] = value;
+            }
+            else {
+                targetRef.current = value;
+            }
+        });
+    }, []);
+    return [targetRef, setValue];
 }
 export default useColumns;