ztxkui 3.1.4 → 3.1.7

package/dist/TableDemo/EditableTable.js

@@ -0,0 +1,336 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+/**
+ * @author 陈亚雄
+ * @description 可编辑表格
+ */
+import React, { useState, useCallback, useRef, useEffect } from 'react';
+// redux
+// ztxkui公共组件
+import { Table, EnhanceSelect, Button, message } from '../index';
+// 路由配置
+// store
+// 自定义组件
+// 其他文件
+import update from 'immutability-helper';
+import { dataSource, list1 } from './data';
+var EditableTable = function () {
+    var _a = useState(dataSource), records = _a[0], setRecords = _a[1];
+    var recordsRef = useRef([]);
+    // 初始化渲染，针对配置了editable、editableConfig的列配置
+    var _b = useState(false), firstRender = _b[0], setFirstRender = _b[1];
+    // 新增删除行改变
+    var _c = useState(false), lengthChange = _c[0], setLengthChange = _c[1];
+    // 表格行拖拽改变
+    var _d = useState(false), moveChange = _d[0], setMoveChange = _d[1];
+    // 表格
+    var tableHandleRef = useRef({});
+    // 表格配置
+    var _e = useState({
+        test1: { isChangeable: 1, isDisplay: 1, isRequired: 1 },
+        test2: { isChangeable: 1, isDisplay: 1, isRequired: 1 },
+    }), tableConfig = _e[0], setTableConfig = _e[1];
+    useEffect(function () {
+        setTimeout(function () {
+            setTableConfig({
+                test1: { isChangeable: 1, isDisplay: 1, isRequired: 0 },
+                test2: { isChangeable: 1, isDisplay: 1, isRequired: 0 },
+            });
+        }, 5000);
+    }, []);
+    var columns = [
+        {
+            title: '序号',
+            width: 62,
+            fixed: 'left',
+            key: 'index',
+            render: function (_text, _record, index) { return "" + (index + 1); },
+        },
+        {
+            title: '测试1',
+            width: 100,
+            dataIndex: 'test1',
+            key: 'test1',
+            editable: true,
+            validate: {},
+            shouldCellUpdate: function (record, preRecord) {
+                if (firstRender) {
+                    setFirstRender(false);
+                    return true;
+                }
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                if (moveChange) {
+                    setMoveChange(false);
+                    return true;
+                }
+                return record.test1 !== preRecord.test1;
+            },
+        },
+        {
+            title: '测试2',
+            width: 100,
+            dataIndex: 'test2',
+            key: 'test2',
+            editable: true,
+            editableConfig: {
+                type: 'inputNumber',
+            },
+            validate: {
+                validate: function (value, record, index, title) {
+                    if (value === 102) {
+                        return Promise.reject({
+                            errorFields: [
+                                {
+                                    errors: "\u91C7\u8D2D\u57FA\u672C\u6570\u636E-\u660E\u7EC6\u8868 \u7B2C" + index + "\u884C \u91C7\u8D2D\u4ED8\u6B3E\u6761\u4EF62 \u5FC5\u586B\uFF01",
+                                },
+                            ],
+                        });
+                    }
+                    return Promise.resolve();
+                },
+            },
+            shouldCellUpdate: function (record, preRecord) {
+                if (firstRender) {
+                    setFirstRender(false);
+                    return true;
+                }
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                if (moveChange) {
+                    setMoveChange(false);
+                    return true;
+                }
+                return record.test2 !== preRecord.test2;
+            },
+        },
+        {
+            title: '测试3',
+            width: 100,
+            dataIndex: 'test3',
+            key: 'test3',
+            shouldCellUpdate: function (record, preRecord) {
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                if (moveChange) {
+                    setMoveChange(false);
+                    return true;
+                }
+                return record.test3 !== preRecord.test3;
+            },
+            validate: {},
+            render: function (text, record, index) {
+                return (React.createElement(EnhanceSelect, { value: text, list: list1, dataKey: "id", titleKey: "name", dropdownMatchSelectWidth: 130, onChange: function (value, option, fullData) {
+                        tableHandleRef.current.clearErrorClass(index);
+                        var newRecord = {
+                            test3: value,
+                            test3Name: fullData === null || fullData === void 0 ? void 0 : fullData.name,
+                        };
+                        onEditableSaveHandle(newRecord, index);
+                    } }));
+            },
+        },
+        {
+            title: '测试4',
+            width: 100,
+            dataIndex: 'test4',
+            key: 'test4',
+        },
+        {
+            title: '测试5',
+            width: 100,
+            dataIndex: 'test5',
+            key: 'test5',
+        },
+        {
+            title: '测试6',
+            width: 100,
+            dataIndex: 'test6',
+            key: 'test6',
+        },
+        {
+            title: '测试7',
+            width: 100,
+            dataIndex: 'test7',
+            key: 'test7',
+        },
+        {
+            title: '测试8',
+            width: 100,
+            dataIndex: 'test8',
+            key: 'test8',
+        },
+        {
+            title: '测试9',
+            width: 100,
+            dataIndex: 'test9',
+            key: 'test9',
+        },
+        {
+            title: '测试10',
+            width: 100,
+            dataIndex: 'test10',
+            key: 'test10',
+        },
+    ];
+    // 初始化渲染，针对配置了editable、editableConfig的列配置
+    useEffect(function () {
+        setFirstRender(true);
+    }, []);
+    // 将表格最新数据赋值给ref引用
+    useEffect(function () {
+        recordsRef.current = records;
+    }, [records]);
+    // 表格数据改变相关
+    var onEditableSaveHandle = useCallback(function (record, index, _dataIndex) {
+        var _a;
+        if (_dataIndex === void 0) { _dataIndex = ''; }
+        if (typeof index === 'number') {
+            var newRecords = recordsRef.current.slice();
+            var item = newRecords[index];
+            newRecords.splice(index, 1, _dataIndex
+                ? __assign(__assign(__assign({}, record), item), (_a = {}, _a[_dataIndex] = record[_dataIndex], _a)) : __assign(__assign({}, item), record));
+            setRecords(newRecords);
+        }
+    }, [setRecords]);
+    // 新增删除行
+    var onAddAndDelHandle = useCallback(function (type, index) {
+        var newRecords = recordsRef.current.slice();
+        if (type === 'add') {
+            var newItem = __assign(__assign({}, newRecords[index]), { _isNewData: true, id: Date.now() + "-" + index });
+            newRecords.splice(index + 1, 0, newItem);
+            setRecords(newRecords);
+            setLengthChange(true);
+        }
+        else if (type === 'del') {
+            if (newRecords.length === 1) {
+                newRecords.splice(index, 1, {
+                    _isNewData: true,
+                    id: Date.now() + "-" + index,
+                });
+            }
+            else {
+                newRecords.splice(index, 1);
+            }
+            setRecords(newRecords);
+            setLengthChange(true);
+        }
+    }, [setRecords]);
+    // 表格拖拽排序功能函数
+    var onMoveRowHandle = useCallback(function (dragIndex, hoverIndex) {
+        var newRecords = recordsRef.current.slice();
+        var dragRow = newRecords[dragIndex];
+        var newDataSource = update(newRecords, {
+            $splice: [
+                [dragIndex, 1],
+                [hoverIndex, 0, dragRow],
+            ],
+        });
+        setRecords(newDataSource);
+        setMoveChange(true);
+    }, [setRecords]);
+    return (React.createElement("div", null,
+        React.createElement("div", null,
+            "\u53EF\u7F16\u8F91\u8868\u683C\uFF1B\u5982\u679C\u662F\u8F93\u5165\u6846\uFF0C\u53EF\u4F7F\u7528\u8868\u683C\u9ED8\u8BA4\u63D0\u4F9B\u7684\u7F16\u8F91\u6846\uFF1B \u914D\u7F6Eeditable\u4E3Atrue\u5373\u53EF\uFF0C\u8FD8\u53EF\u914D\u7F6EeditableConfig\u914D\u7F6E\u6267\u884C\u7C7B\u578B\u7B49\uFF1B\u5177\u4F53editableConfig\u53EF\u67E5\u770B\u8BE6\u7EC6\u7B7E\u540D",
+            React.createElement("br", null),
+            React.createElement("b", null, "\u5BF9\u4E8E\u914D\u7F6E\u4E86\u7F16\u8F91\u7684\u8868\u683C\uFF0C\u4E00\u5B9A\u8981\u4F7F\u7528SCU\u6765\u4F18\u5316\u8868\u683C\u6E32\u67D3\uFF0C\u6B64\u4E3E\u53EF\u4EE5\u4F18\u5316\u8868\u683C\u6E32\u67D3"),
+            React.createElement("br", null),
+            React.createElement("b", null, "\u5982\u679C\u914D\u7F6E\u4E86editable\uFF0C\u5E76\u4E14\u914D\u7F6E\u4E86SCU\u6765\u4F18\u5316\u6E32\u67D3\uFF0C\u90A3\u4E48\u521D\u59CB\u5316\u7684\u65F6\u5019\u9700\u8981\u7528\u4E00\u4E2A\u53D8\u91CF\u6807\u8BC6\u9996\u6B21\u9700\u8981\u6E32\u67D3"),
+            React.createElement("br", null),
+            React.createElement("b", null, "\u65B0\u589E\u5220\u9664\u884C\uFF0C\u8868\u683C\u62D6\u62FD\u6392\u5E8F\uFF1B"),
+            "\u5BF9\u4E8E\u914D\u7F6E\u4E86SCU\u7684\u5217\uFF0C\u9700\u8981\u5728\u65B0\u589E\u5220\u9664\u7684\u65F6\u5019\u91CD\u65B0\u6E32\u67D3\uFF0C\u901A\u8FC7\u8BBE\u7F6Estate\u6807\u8BC6",
+            React.createElement("br", null),
+            React.createElement("b", null, "\u8868\u683C\u81EA\u5B9A\u4E49\u9A8C\u8BC1\uFF0C\u4F20\u5165tableHandleRef\u4E00\u4E2ARef\u5BF9\u8C61\uFF0C\u53EF\u83B7\u53D6\u8868\u683C\u63D0\u4F9B\u76F8\u5173\u65B9\u6CD5"),
+            React.createElement("p", null, "1.\u7F16\u5199\u9A8C\u8BC1\u89C4\u5219\uFF0C\u5728\u5217\u91CC\u9762\u7F16\u5199\uFF0C\u901A\u8FC7\u4F20\u5165validate\u5C5E\u6027\u914D\u7F6E,\u5177\u4F53\u53EF\u67E5\u770B\u7B7E\u540D \u5982\u679C\u53EA\u662F\u7B80\u5355\u7684\u975E\u7A7A\u9A8C\u8BC1\uFF0C\u90A3\u4E48\u53EF\u4F20\u5165\u4E00\u4E2A\u7A7A\u5BF9\u8C61\u5373\u53EF \u5982\u679C\u662F\u590D\u6742\u9A8C\u8BC1\u53EF\u901A\u8FC7validate\u4F20\u5165\u66F4\u591A\u914D\u7F6E"),
+            React.createElement("p", null, "2.\u5982\u679C\u4F20\u5165\u4E86\u81EA\u5B9A\u4E49render\u51FD\u6570\uFF0C\u7EC4\u4EF6\u65E0\u6CD5\u638C\u63E1\u5728\u4F55\u65F6\u6E05\u7A7A\u9519\u8BEF\u4FE1\u606F\uFF0C\u6240\u4EE5\u9700\u8981\u8C03\u7528\u65B9\u4E3B\u52A8\u6E05\u7A7A\u9519\u8BEF\u4FE1\u606F")),
+        React.createElement(Button, { onClick: function () {
+                (function () {
+                    var _a;
+                    return __awaiter(this, void 0, void 0, function () {
+                        var err_1, errorFields;
+                        return __generator(this, function (_b) {
+                            switch (_b.label) {
+                                case 0:
+                                    _b.trys.push([0, 2, , 3]);
+                                    return [4 /*yield*/, ((_a = tableHandleRef.current) === null || _a === void 0 ? void 0 : _a.validate())];
+                                case 1:
+                                    _b.sent();
+                                    return [3 /*break*/, 3];
+                                case 2:
+                                    err_1 = _b.sent();
+                                    console.log(err_1);
+                                    errorFields = err_1.errorFields;
+                                    if (errorFields) {
+                                        message.warning(errorFields[0].errors + '');
+                                    }
+                                    return [3 /*break*/, 3];
+                                case 3: return [2 /*return*/];
+                            }
+                        });
+                    });
+                })();
+            } }, "\u9A8C\u8BC1"),
+        React.createElement(Table, { dataSource: records, columns: columns, rowKey: "id", 
+            // 表格项可输入
+            onEditableSave: onEditableSaveHandle, 
+            // 新增删除行
+            onAddAndDelHandle: onAddAndDelHandle, 
+            // 表格行拖拽
+            onMoveRow: onMoveRowHandle, 
+            // tableValidate
+            tableHandleRef: tableHandleRef, tableName: "\u6211\u662F\u4E00\u4E2A\u8868\u683C", 
+            // 显隐配置
+            configInfo: tableConfig })));
+};
+export default EditableTable;

package/dist/TableDemo/data.d.ts

@@ -0,0 +1,17 @@
+export declare const dataSource: {
+    id: string;
+    test1: string;
+    test2: number;
+    test3: string;
+    test4: string;
+    test5: string;
+    test6: string;
+    test7: string;
+    test8: string;
+    test9: string;
+    test10: string;
+}[];
+export declare const list1: {
+    name: string;
+    id: string;
+}[];

package/dist/TableDemo/data.js

@@ -0,0 +1,57 @@
+export var dataSource = new Array(10).fill(1).map(function (item, index) {
+    return {
+        id: "test-" + index,
+        test1: "test1-" + index,
+        test2: index + 100,
+        test3: "test3-" + index,
+        test4: "test4-" + index,
+        test5: "test5-" + index,
+        test6: "test6-" + index,
+        test7: "test7-" + index,
+        test8: "test8-" + index,
+        test9: "test9-" + index,
+        test10: "test10-" + index,
+    };
+});
+export var list1 = [
+    {
+        name: '张三',
+        id: 'test3-0',
+    },
+    {
+        name: '李四',
+        id: 'test3-1',
+    },
+    {
+        name: '王五',
+        id: 'test3-2',
+    },
+    {
+        name: '赵六',
+        id: 'test3-3',
+    },
+    {
+        name: '张飞',
+        id: 'test3-4',
+    },
+    {
+        name: '赵云',
+        id: 'test3-5',
+    },
+    {
+        name: '刘备',
+        id: 'test3-6',
+    },
+    {
+        name: '关羽',
+        id: 'test3-7',
+    },
+    {
+        name: '曹操',
+        id: 'test3-8',
+    },
+    {
+        name: '诸葛亮',
+        id: 'test3-9',
+    },
+];

package/dist/TableDemo/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @author 陈亚雄
+ * @description
+ */
+import React from 'react';
+declare const TableDemo: React.FC;
+export default TableDemo;

package/dist/TableDemo/index.js

@@ -0,0 +1,19 @@
+/**
+ * @author 陈亚雄
+ * @description
+ */
+import React from 'react';
+// redux
+// ztxkui公共组件
+// 路由配置
+// store
+// 自定义组件
+import BasicTable from './BasicTable';
+import EditableTable from './EditableTable';
+// 其他文件
+var TableDemo = function () {
+    return (React.createElement("div", null,
+        React.createElement(BasicTable, null),
+        React.createElement(EditableTable, null)));
+};
+export default TableDemo;

package/dist/components/Table/hooks/useColumns.d.ts

@@ -1,7 +1,16 @@
+import React from 'react';
 import { ColumnsType } from '../';
+export interface IConfigInfo {
+    [props: string]: {
+        isChangeable?: any;
+        isDisplay?: any;
+        isRequired?: any;
+    };
+}
 interface IProps<RecordType> {
     columns: ColumnsType<RecordType> | undefined;
     showColumnDynamic?: boolean;
+    showColumnDynamicKey?: string;
     /**新增行删除行方法 */
     onAddAndDelHandle?: (type: 'add' | 'del', index: number) => void;
     /**隐藏新增icon */
@@ -11,6 +20,13 @@ interface IProps<RecordType> {
     showDynamicHandle?: () => void;
     /**表格列编辑事件 */
     onEditableSave?: (record: RecordType, index: number | undefined, dataIndex: string) => void;
+    /** 表格列配置相关信息 */
+    configInfo?: IConfigInfo;
 }
-declare function useColumns<RecordType>(props: IProps<RecordType>): ColumnsType<RecordType>[];
+export declare const getTableLayoutFullData: (columns: any, tableLayout: any) => any;
+declare function useColumns<RecordType>(props: IProps<RecordType>): {
+    newColumns: any;
+    dynamicColumns: any;
+    setNewColumns: React.Dispatch<any>;
+};
 export default useColumns;

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

@@ -9,25 +9,98 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
 import React, { useCallback, useEffect, useState } from 'react';
 import { PicRightOutlined } from '@ant-design/icons';
 import TableAddDelColumn from '../table-adddel-column';
+// 获取表格columns完整数据
+export var getTableLayoutFullData = function (columns, tableLayout) {
+    if (Array.isArray(tableLayout) && tableLayout.length > 0) {
+        var newColumns = tableLayout.map(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);
+                    }
+                    if (column.dataIndex) {
+                        return column.dataIndex === (item === null || item === void 0 ? void 0 : item.dataIndex);
+                    }
+                    return false;
+                });
+                return __assign(__assign({}, result), item);
+            }
+            return __assign({}, item);
+        });
+        var newAddColumns = columns.filter(function (column) { return !tableLayout.find(function (item) { return item.key === column.key; }); });
+        return __spreadArray(__spreadArray([], newColumns), newAddColumns);
+    }
+    return columns;
+};
+function getStorage(key) {
+    try {
+        var result = localStorage.getItem(key) || '';
+        return JSON.parse(result);
+    }
+    catch (err) {
+        return null;
+    }
+}
 function useColumns(props) {
-    var columns = props.columns, showColumnDynamic = props.showColumnDynamic, onAddAndDelHandle = props.onAddAndDelHandle, hideAddIcon = props.hideAddIcon, hideDelIcon = props.hideDelIcon, showDynamicHandle = props.showDynamicHandle, onEditableSave = props.onEditableSave;
+    var columns = props.columns, showColumnDynamic = props.showColumnDynamic, showColumnDynamicKey = props.showColumnDynamicKey, onAddAndDelHandle = props.onAddAndDelHandle, hideAddIcon = props.hideAddIcon, hideDelIcon = props.hideDelIcon, showDynamicHandle = props.showDynamicHandle, onEditableSave = props.onEditableSave, configInfo = props.configInfo;
+    var tableLayout = getStorage(showColumnDynamicKey);
     // 新的columns
-    var _a = useState(columns), newColumns = _a[0], setNewColumns = _a[1];
+    var _a = useState(getTableLayoutFullData(columns, tableLayout)), newColumns = _a[0], setNewColumns = _a[1];
     // 需要动态配置的列
-    var _b = useState(columns), dynamicColumns = _b[0], setDynamicColumns = _b[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]);
     useEffect(function () {
-        if (!Array.isArray(columns)) {
+        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) {
+        _columns.forEach(function (col) {
             var _column = __assign({}, col);
             // 添加超出隐藏
             // !_column.render 兼容下拉框滚动行为，设置了ellipsis的话，会导致overflow:hidden，导致一些问题
@@ -58,7 +131,16 @@ function useColumns(props) {
                 _dynamicColumns.push(__assign({}, col));
             }
             // 添加必填标识
-            if (_column.required) {
+            if (typeof _column.required === 'function') {
+                var res = _column.required();
+                var _res = typeof res === 'boolean' ? res : res === 1 || res === '1';
+                if (_res) {
+                    _column.title = (React.createElement(React.Fragment, null,
+                        React.createElement("i", { className: "zt-column--required" }, "*"),
+                        _column.title));
+                }
+            }
+            else if (_column.required) {
                 _column.title = (React.createElement(React.Fragment, null,
                     React.createElement("i", { className: "zt-column--required" }, "*"),
                     _column.title));
@@ -112,7 +194,9 @@ function useColumns(props) {
         hideDelIcon,
         ColumnDynamicCom,
         onEditableSave,
+        configInfo,
+        showColumnDynamicKey,
     ]);
-    return [newColumns, dynamicColumns];
+    return { newColumns: newColumns, dynamicColumns: dynamicColumns, setNewColumns: setNewColumns };
 }
 export default useColumns;

package/dist/components/Table/index.d.ts

@@ -4,15 +4,36 @@ import { ColumnType } from 'antd/lib/table';
 import { TableRowSelection as AntTableRowSelection } from 'antd/lib/table/interface';
 import { ISummaryConfig as TableISummaryConfig } from './utils/getSummaryData';
 import { IEditableConfig } from './table-enhance-cell';
-export interface IColumnType<RecordType> extends ColumnType<RecordType> {
-    /**是否隐藏该列 */
-    hideColumn?: boolean;
-    /**是否增加必填title */
+export interface IValidate {
+    /** 需要验证得key, 如果不传，组件会取当前列配置的dataIndex */
+    dataIndex?: string;
+    /** 提示的列头，如果不传，组件会取当前列配置的title */
+    title?: string;
+    /**
+     * 验证方式
+     * required 如果只传入这个key 那么已这个为准
+     * validate 验证函数 返回一个promise对象
+     *          也可以传入一个对象，对象有两个key 一个pattern正则 一个message提示信息
+     */
     required?: boolean;
+    validate?: (value: any, record: any, index: any, title: any) => Promise<any> | {
+        pattern: any;
+        message: string;
+    };
+    /** 当前index位置 */
+    index?: number;
+}
+export interface IColumnType<RecordType> extends ColumnType<RecordType> {
+    /**是否隐藏该列 可以传入一个返回boolean值得函数 */
+    hideColumn?: boolean | (() => boolean);
+    /**是否增加必填title, 可以传入一个返回boolean值的函数 */
+    required?: boolean | (() => boolean);
     /**是否可以编辑 */
     editable?: boolean;
     /**可编辑列配置 */
     editableConfig?: IEditableConfig;
+    /** 表格单元格验证逻辑 */
+    validate?: IValidate;
 }
 export interface IColumnGroupType<RecordType> extends Omit<IColumnType<RecordType>, ''> {
     children: ColumnsType<RecordType>;
@@ -21,6 +42,8 @@ export declare type ISummaryConfig = TableISummaryConfig;
 export declare type ColumnsTypeProp<RecordType> = IColumnGroupType<RecordType> | IColumnType<RecordType>;
 export declare type ColumnsType<RecordType = unknown> = ColumnsTypeProp<RecordType>[];
 export declare type TableRowSelection<T> = AntTableRowSelection<T>;
+export declare const DIFF_CLASSNAME = "zt-table--diff-row";
+export declare const ERROR_TD_CLASSNAME = "zt-error-validate-td";
 export declare type ITableComponent = typeof Table & {
     SELECTION_ALL: typeof AntTable.SELECTION_ALL;
     SELECTION_INVERT: typeof AntTable.SELECTION_INVERT;
@@ -29,6 +52,7 @@ export declare type ITableComponent = typeof Table & {
     ColumnGroup: typeof AntTable.ColumnGroup;
     Summary: typeof AntTable.Summary;
     DiffClassName: string;
+    ErrorTdCallName: string;
 };
 declare const TransTable: ITableComponent;
 export default TransTable;

package/dist/components/Table/index.js

@@ -1,5 +1,7 @@
 import Table from './table';
 import { Table as AntTable } from 'antd';
+export var DIFF_CLASSNAME = 'zt-table--diff-row';
+export var ERROR_TD_CLASSNAME = 'zt-error-validate-td';
 var TransTable = Table;
 TransTable.SELECTION_ALL = AntTable.SELECTION_ALL;
 TransTable.SELECTION_INVERT = AntTable.SELECTION_INVERT;
@@ -7,5 +9,6 @@ TransTable.SELECTION_NONE = AntTable.SELECTION_NONE;
 TransTable.Column = AntTable.Column;
 TransTable.ColumnGroup = AntTable.ColumnGroup;
 TransTable.Summary = AntTable.Summary;
-TransTable.DiffClassName = 'zt-table--diff-row';
+TransTable.DiffClassName = DIFF_CLASSNAME;
+TransTable.ErrorTdCallName = ERROR_TD_CLASSNAME;
 export default TransTable;