ztxkui 4.2.18-4 → 4.2.18-41

package/README.md

@@ -1,57 +1,57 @@
-# 前端ui库
-
-## 关于 typescript 相关配置说明
-
-_[tsconfig.json](https://www.tslang.cn/docs/handbook/tsconfig-json.html) 如果一个目录下存在一个 tsconfig.json 文件，那么它意味着这个目录是 TypeScript 项目的根目录。tsconfig.json 文件中指定了用来编译这个项目的根文件和编译选现_
-
-- compilerOptions 可以忽略，如果忽略 会使用默认值
-  - outDir 指定的目录下的文件永远会被编译器排除，除非使用 files 包含
-  - typeRoots 默认所有可见的 @types 包会在编译过程中被包含进来，如果指定了这个配置 只有他下面的包才会被包含进来
-
-* files 指定一个包含相对或绝对文件路径的列表,优先级最高
-* include 需要编译的文件 优先级最低
-* exclude 不需要编译的文件 优先级中等
-* extends 继承配置 继承的文件会覆盖源文件
-
-_[eslint](https://eslint.bootcss.com/docs/user-guide/getting-started)ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误_
-
-- parser 解析器(eslint 默认使用 Espree 作为其解析器)
-- parserOptions 解析器配置选项
-- env 和 globals 环境和全局变量
-
-* rules 规则（off 或 0，关闭规则；warn 或 1，开启规则；error 或 2，开启规则，并会出错阻止代码运行）
-  - semi 是否使用分号（当前不使用 错误级别 1）
-  - no-trailing-spaces 禁止行尾空格
-  - array-bracket-spacing 强制数组括号内的空格一致
-  - operator-linebreak 强制操作符使用一致的换行符
-  - function-paren-newline 强制函数括号内使用一致的换行
-  * no-magic-numbers 禁止使用魔术数字
-    - ignoreArrayIndexes 数字可否作为数组的索引
-  - block-spacing 禁止或强制在代码块中开括号前和闭括号后有空格
-  - brace-style 大括号风格要求
-  - no-multiple-empty-lines 最大换行数
-  - object-curly-spacing 强制在花括号中使用一致的空格
-  * comma-spacing 强制在逗号周围使用空格
-    - before false 禁止逗号前使用空格
-    - after true 要求逗号后使用一个或多个空格
-  * keyword-spacing 强制关键字周围空格的一致性
-    - before true (默认) 要求在关键字之前至少有一个空格
-    - after true (默认) 要求在关键字之后至少有一个空格
-  * comma-style 逗号风格
-    - last (默认) 要求逗号放在数组元素、对象属性或变量声明之后，且在同一行
-  - no-multi-spaces 禁止出现多个空格
-
-- plugins 插件(插件可以提供处理器 配置在 processor 中 通过 pluginName/parserName)
-- overrides 为特定类型的文件指定处理器，请使用 overrides 和 processor 的组合
-- extends 拓展 一个配置文件可以被基础配置中的已启用的规则继承
-- settings 提供给每一个将被执行的规则
-- root 如果为 true 则项目中的 eslint 规则 在根目录中找
-
-## 本地调试
-
-```json
-"peerDependencies": {
-  "react": ">=16.9.0",
-  "react-dom": ">=16.9.0"
-}
-```
+# 前端ui库
+
+## 关于 typescript 相关配置说明
+
+_[tsconfig.json](https://www.tslang.cn/docs/handbook/tsconfig-json.html) 如果一个目录下存在一个 tsconfig.json 文件，那么它意味着这个目录是 TypeScript 项目的根目录。tsconfig.json 文件中指定了用来编译这个项目的根文件和编译选现_
+
+- compilerOptions 可以忽略，如果忽略 会使用默认值
+  - outDir 指定的目录下的文件永远会被编译器排除，除非使用 files 包含
+  - typeRoots 默认所有可见的 @types 包会在编译过程中被包含进来，如果指定了这个配置 只有他下面的包才会被包含进来
+
+* files 指定一个包含相对或绝对文件路径的列表,优先级最高
+* include 需要编译的文件 优先级最低
+* exclude 不需要编译的文件 优先级中等
+* extends 继承配置 继承的文件会覆盖源文件
+
+_[eslint](https://eslint.bootcss.com/docs/user-guide/getting-started)ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误_
+
+- parser 解析器(eslint 默认使用 Espree 作为其解析器)
+- parserOptions 解析器配置选项
+- env 和 globals 环境和全局变量
+
+* rules 规则（off 或 0，关闭规则；warn 或 1，开启规则；error 或 2，开启规则，并会出错阻止代码运行）
+  - semi 是否使用分号（当前不使用 错误级别 1）
+  - no-trailing-spaces 禁止行尾空格
+  - array-bracket-spacing 强制数组括号内的空格一致
+  - operator-linebreak 强制操作符使用一致的换行符
+  - function-paren-newline 强制函数括号内使用一致的换行
+  * no-magic-numbers 禁止使用魔术数字
+    - ignoreArrayIndexes 数字可否作为数组的索引
+  - block-spacing 禁止或强制在代码块中开括号前和闭括号后有空格
+  - brace-style 大括号风格要求
+  - no-multiple-empty-lines 最大换行数
+  - object-curly-spacing 强制在花括号中使用一致的空格
+  * comma-spacing 强制在逗号周围使用空格
+    - before false 禁止逗号前使用空格
+    - after true 要求逗号后使用一个或多个空格
+  * keyword-spacing 强制关键字周围空格的一致性
+    - before true (默认) 要求在关键字之前至少有一个空格
+    - after true (默认) 要求在关键字之后至少有一个空格
+  * comma-style 逗号风格
+    - last (默认) 要求逗号放在数组元素、对象属性或变量声明之后，且在同一行
+  - no-multi-spaces 禁止出现多个空格
+
+- plugins 插件(插件可以提供处理器 配置在 processor 中 通过 pluginName/parserName)
+- overrides 为特定类型的文件指定处理器，请使用 overrides 和 processor 的组合
+- extends 拓展 一个配置文件可以被基础配置中的已启用的规则继承
+- settings 提供给每一个将被执行的规则
+- root 如果为 true 则项目中的 eslint 规则 在根目录中找
+
+## 本地调试
+
+```json
+"peerDependencies": {
+  "react": ">=16.9.0",
+  "react-dom": ">=16.9.0"
+}
+```

package/dist/DemoCom/BasicDemo.js

@@ -136,7 +136,7 @@ function BasicDemo() {
                     console.log((_b = (_a = rangeValue === null || rangeValue === void 0 ? void 0 : rangeValue[0]) === null || _a === void 0 ? void 0 : _a.format) === null || _b === void 0 ? void 0 : _b.call(_a, 'YYYY-MM-DD'));
                     console.log((_d = (_c = rangeValue === null || rangeValue === void 0 ? void 0 : rangeValue[1]) === null || _c === void 0 ? void 0 : _c.format) === null || _d === void 0 ? void 0 : _d.call(_c, 'YYYY-MM-DD'));
                 } }, "\u83B7\u53D6\u6570\u636E")),
-        React.createElement(Input.TextArea, { className: "placeholder", autoSize: true }),
+        React.createElement(Input.TextArea, { className: "placeholder", autoSize: true, isModalInput: true }),
         React.createElement("div", { style: { border: '1px solid red' } },
             React.createElement(FormList, { gutter: 16 },
                 React.createElement(FormList.FormItem, { span: 24, title: "\u63D0\u5355\u53F7\u63D0\u5355\u53F7\u63D0\u5355\u53F7\u63D0\u5355\u53F7", isEllipsis: false }, test),

package/dist/DemoCom/SyhDemo.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const SyhDemo: () => JSX.Element;
+export default SyhDemo;

package/dist/DemoCom/SyhDemo.js

@@ -0,0 +1,257 @@
+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);
+};
+/**
+ * @description
+ */
+import React, { useState, useRef, useEffect, useCallback } from 'react';
+import SearchContainer from '../components/business/SearchContainer';
+import Form from '../components/Form';
+import Input from 'components/Input';
+import Table from 'components/Table';
+import DatePicker from 'components/DatePicker';
+import { Cascader } from 'antd';
+import dayjs from 'dayjs';
+import { timeTransfrom } from 'ztxkutils/dist/tools';
+var SearchItem = SearchContainer.SearchItem, SearchLeft = SearchContainer.SearchLeft, SearchRight = SearchContainer.SearchRight;
+var TextArea = Input.TextArea;
+var RangePicker = DatePicker.RangePicker;
+var aa = [
+    {
+        extra: '1',
+        hasChildren: true,
+        id: '1460583429813227521',
+        key: '1460583429813227521',
+        parentId: '1460582731688103938',
+        remark: null,
+        label: '合同工',
+        value: '1',
+        children: [
+            {
+                extra: '11',
+                id: '1460582731776184321',
+                key: '1460582731776184321',
+                parentId: '1460583429813227521',
+                remark: null,
+                label: '合同制',
+                value: '11',
+            },
+            {
+                extra: '16',
+                id: '1460582731797155842',
+                key: '1460582731797155842',
+                parentId: '1460583429813227521',
+                remark: null,
+                label: '退休返聘',
+                value: '16',
+            },
+        ],
+    },
+    {
+        extra: '2',
+        hasChildren: true,
+        id: '1460583501221253121',
+        key: '1460583501221253121',
+        parentId: '1460582731688103938',
+        remark: null,
+        label: '非合同工',
+        value: '2',
+        children: [
+            {
+                extra: '12',
+                id: '1460582731784572929',
+                key: '1460582731784572929',
+                parentId: '1460583501221253121',
+                remark: null,
+                label: '非全日制',
+                value: '12',
+            },
+            {
+                extra: '13',
+                id: '1460582731792961538',
+                key: '1460582731792961538',
+                parentId: '1460583501221253121',
+                remark: null,
+                label: '临时协议',
+                value: '13',
+            },
+            {
+                extra: '15',
+                id: '1460582731792961539',
+                key: '1460582731792961539',
+                parentId: '1460583501221253121',
+                remark: null,
+                label: '劳务派遣',
+                value: '15',
+            },
+            {
+                extra: '22',
+                id: '1460582731797155843',
+                key: '1460582731797155843',
+                parentId: '1460583501221253121',
+                remark: null,
+                label: '外包协议',
+                value: '22',
+            },
+        ],
+    },
+];
+var SyhDemo = function () {
+    var form = Form.useForm()[0];
+    var _a = useState([
+        { id: 1, test1: 1, test2: 1 },
+    ]), records = _a[0], setRecords = _a[1];
+    var recordsRef = useRef([]);
+    var _b = useState(false), firstRender = _b[0], setFirstRender = _b[1];
+    // 新增删除行改变
+    var _c = useState(false), lengthChange = _c[0], setLengthChange = _c[1];
+    useEffect(function () {
+        recordsRef.current = records;
+    }, [records]);
+    var columns = [
+        {
+            title: '序号',
+            width: 38,
+            fixed: 'left',
+            key: 'index',
+            render: function (text, _record, index) { return "" + (index + 1); },
+        },
+        {
+            title: '测试1',
+            width: 100,
+            dataIndex: 'test1',
+            key: 'test1',
+            render: function (text, record, index) { return (React.createElement(TextArea, { value: text, maxLength: 6, autoSize: { minRows: 1 }, onChange: function (e) {
+                    var newRecord = {
+                        test1: e.target.value,
+                    };
+                    onEditableSaveHandle(newRecord, index);
+                } })); },
+            shouldCellUpdate: function (record, preRecord) {
+                if (firstRender) {
+                    setFirstRender(false);
+                    return true;
+                }
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                return record.test1 !== preRecord.test1;
+            },
+        },
+        {
+            title: '测试2',
+            width: 100,
+            dataIndex: 'test2',
+            key: 'test2',
+            editable: true,
+            editableConfig: {
+                type: 'textArea',
+                maxLength: 6,
+            },
+        },
+        {
+            title: '测试3',
+            width: 100,
+            dataIndex: 'test3',
+            key: 'test3',
+            render: function (text, record, index) { return (React.createElement(DatePicker, { value: text ? dayjs(text) : null, onChange: function (value, dateString) {
+                    var newRecord = {
+                        test3: dateString,
+                    };
+                    onEditableSaveHandle(newRecord, index);
+                } })); },
+            shouldCellUpdate: function (record, preRecord) {
+                if (firstRender) {
+                    setFirstRender(false);
+                    return true;
+                }
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                return record.test3 !== preRecord.test3;
+            },
+        },
+        {
+            title: '测试4',
+            width: 100,
+            dataIndex: 'text4Start',
+            key: 'text4Start',
+            render: function (text, record, index) {
+                var newParams = (record === null || record === void 0 ? void 0 : record.text4Start) && (record === null || record === void 0 ? void 0 : record.test4End)
+                    ? timeTransfrom({
+                        params: {
+                            text4Start: record === null || record === void 0 ? void 0 : record.text4Start,
+                            test4End: record === null || record === void 0 ? void 0 : record.test4End,
+                        },
+                        fromKey: [['text4Start', 'test4End']],
+                        toKey: ['text4'],
+                        type: 'object',
+                    })
+                    : {};
+                return (React.createElement(RangePicker, { value: newParams === null || newParams === void 0 ? void 0 : newParams.text4, onChange: function (value) {
+                        var newRecord = timeTransfrom({
+                            params: { text4: value },
+                            fromKey: ['text4'],
+                            toKey: [['text4Start', 'test4End']],
+                        });
+                        onEditableSaveHandle(newRecord, index);
+                    } }));
+            },
+            shouldCellUpdate: function (record, preRecord) {
+                if (firstRender) {
+                    setFirstRender(false);
+                    return true;
+                }
+                if (lengthChange) {
+                    setLengthChange(false);
+                    return true;
+                }
+                return record.test4 !== preRecord.test4;
+            },
+        },
+    ];
+    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]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Form, { name: "syh-demo", form: form },
+            React.createElement(SearchContainer, null,
+                React.createElement(SearchLeft, null,
+                    React.createElement(SearchItem, { width: "half", name: "a", label: "\u7B2C\u4E00" },
+                        React.createElement(Input.TextArea, { autoSize: true, allowClear: true, onChange: function (e) {
+                                console.log(e.target.value);
+                            } })),
+                    React.createElement(SearchItem, { width: "half", name: "b", label: "\u7B2C\u4E8C" },
+                        React.createElement(Input, null)),
+                    React.createElement(SearchItem, { width: "half", name: "c", label: "\u7B2C\u4E09" },
+                        React.createElement(Input, null)),
+                    React.createElement(SearchItem, { width: "half", name: "d", label: "\u7B2C\u56DB" },
+                        React.createElement(Input, null)),
+                    React.createElement(SearchItem, { width: "half", name: "e", label: "\u7B2C\u4E94" },
+                        React.createElement(Input, null)),
+                    React.createElement(SearchItem, { name: "f", label: "\u7B2C\u516D" },
+                        React.createElement(Cascader, { options: aa })),
+                    React.createElement(SearchItem, { name: "g", label: "\u7B2C\u4E03" },
+                        React.createElement(TextArea, { maxLength: 6 }))),
+                React.createElement(SearchRight, { onResetHandle: function () { }, onSearchHandle: function () { } }))),
+        React.createElement(Table, { columns: columns, dataSource: records, rowKey: "id", onEditableSave: onEditableSaveHandle })));
+};
+export default SyhDemo;

package/dist/DemoCom/TableDemo.js

@@ -66,7 +66,7 @@ import FormDemo from './FormDemo';
 // 获取表格数据
 function useGetTableRecords() {
     // 表格数据
-    var _a = useState(Array.from({ length: 10 }).map(function (item, index) {
+    var _a = useState(Array.from({ length: 100 }).map(function (item, index) {
         var newItem = {
             id: "" + (index + 1),
             test1: index + 1 + "-test1",
@@ -547,6 +547,7 @@ var TableDemo = function () {
             width: 400,
             dataIndex: 'key1',
             key: 'key1',
+            hideColumn: true,
             shouldCellUpdate: function (record, preRecord) {
                 if (lengthChange) {
                     setLengthChange(false);
@@ -928,11 +929,12 @@ var TableDemo = function () {
             // 如果需要保留本地偏好，那么这里需要预处理一下columns数据
             // columns={getTableLayoutFullData(columns, tableLayout)}
             // initColumns={columns}
-            columns: columns, dataSource: records, rowKey: "id", tableHandleRef: tableHandleRef, 
+            columns: columns, dataSource: [], rowKey: "id", tableHandleRef: tableHandleRef, virtualTableKey: "test", 
             // 配置表格列
             // configInfo={tableConfig}
             // 添加动态列配置
-            showColumnDynamic: true, showColumnDynamicKey: "testkey", 
+            // showColumnDynamic
+            // showColumnDynamicKey="testkey"
             // onDynamicChange={onDynamicChange}
             // 表格项可输入
             onEditableSave: onEditableSaveHandle, 
@@ -941,7 +943,9 @@ var TableDemo = function () {
             // 表格行拖拽
             onMoveRow: onMoveRowHandle, 
             // 自动伸缩列
-            isResizableColumn: true, isFlex: true, scroll: { x: 1000 }, summaryFixed: true, summaryConfig: [
+            isResizableColumn: true, 
+            // isFlex
+            scroll: { x: 1000, y: 200 }, summaryFixed: true, summaryConfig: [
                 {
                     type: 'subtotal',
                     fields: [

package/dist/TableDemo/BasicTable.js

@@ -26,6 +26,7 @@ var BasicTable = function (_a) {
             width: 100,
             dataIndex: 'test1',
             key: 'test1',
+            fixed: true,
         },
         {
             title: '测试2',
@@ -91,6 +92,6 @@ var BasicTable = function (_a) {
             React.createElement("br", null),
             React.createElement("b", null, "\u5217\u4F38\u7F29\uFF1B"),
             "isResizableColumn\u5C5E\u6027\u9ED8\u8BA4\u4E3Atrue\uFF0C\u5982\u679C\u4E0D\u9700\u8981\u5217\u4F38\u7F29\u53EF\u4EE5\u4F20\u5165false"),
-        React.createElement(Table, { dataSource: dataSource, columns: columns, rowKey: "id", showColumnDynamic: true, showColumnDynamicKey: dynamicKey || 'symbol-id-1' })));
+        React.createElement(Table, { dataSource: dataSource, columns: columns, rowKey: "id", scroll: { x: 400, y: 300 }, isOpenVirtualScrollBar: true })));
 };
 export default BasicTable;

package/dist/TableDemo/EditableTable.js

@@ -157,11 +157,12 @@ var EditableTable = function () {
     var _d = useState(false), moveChange = _d[0], setMoveChange = _d[1];
     // 表格
     var tableHandleRef = useRef({});
+    var _e = useState([]), expandedRowKeys = _e[0], setExpandedRowKeys = _e[1];
     // 表格配置
-    var _e = useState({
+    var _f = useState({
         test1: { isChangeable: 1, isDisplay: 1, isRequired: 1 },
         test2: { isChangeable: 1, isDisplay: 1, isRequired: 1 },
-    }), tableConfig = _e[0], setTableConfig = _e[1];
+    }), tableConfig = _f[0], setTableConfig = _f[1];
     useEffect(function () {
         setTimeout(function () {
             setTableConfig({
@@ -182,10 +183,14 @@ var EditableTable = function () {
         },
         {
             title: '测试1',
-            width: 100,
+            width: 400,
             dataIndex: 'test1',
             key: 'test1',
             editable: true,
+            editableConfig: {
+                type: 'textArea',
+                maxLength: 100,
+            },
             showCopy: true,
             validate: {},
             shouldCellUpdate: function (record, preRecord) {
@@ -206,7 +211,7 @@ var EditableTable = function () {
         },
         {
             title: '测试111',
-            width: 100,
+            width: 400,
             dataIndex: 'test111',
             key: 'test111',
             editable: true,
@@ -337,62 +342,62 @@ var EditableTable = function () {
                     } }));
             },
         },
-        // {
-        //   title: '测试4',
-        //   width: 100,
-        //   dataIndex: 'test4',
-        //   key: 'test4',
-        // },
-        // {
-        //   title: '测试5',
-        //   // width: 100,
-        //   // dataIndex: 'test5',
-        //   // key: 'test5',
-        //   children: [
-        //     {
-        //       title: '测试5-001',
-        //       width: 100,
-        //       dataIndex: 'test5-001',
-        //       key: 'test5-001',
-        //     },
-        //     {
-        //       title: '测试5-002',
-        //       width: 100,
-        //       dataIndex: 'test5-002',
-        //       key: 'test5-002',
-        //     },
-        //   ],
-        // },
-        // {
-        //   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',
-        // },
+        {
+            title: '测试4',
+            width: 100,
+            dataIndex: 'test4',
+            key: 'test4',
+        },
+        {
+            title: '测试5',
+            // width: 100,
+            // dataIndex: 'test5',
+            // key: 'test5',
+            children: [
+                {
+                    title: '测试5-001',
+                    width: 100,
+                    dataIndex: 'test5-001',
+                    key: 'test5-001',
+                },
+                {
+                    title: '测试5-002',
+                    width: 100,
+                    dataIndex: 'test5-002',
+                    key: 'test5-002',
+                },
+            ],
+        },
+        {
+            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 () {
@@ -525,6 +530,8 @@ var EditableTable = function () {
             } }, "\u9A8C\u8BC1"),
         React.createElement(Button, { onClick: function () {
                 console.log(records);
+                var ids = records.map(function (item) { return item.id; });
+                setExpandedRowKeys(ids);
             } }, "\u83B7\u53D6\u6570\u636E"),
         React.createElement(Table, { dataSource: records, columns: columns, rowKey: "id", 
             // 表格项可输入
@@ -536,14 +543,27 @@ var EditableTable = function () {
             // tableValidate
             tableHandleRef: tableHandleRef, tableName: "\u6211\u662F\u4E00\u4E2A\u8868\u683C", 
             // 显隐配置
-            configInfo: tableConfig, showColumnDynamic: true, showColumnDynamicKey: "test-o-0011", onTableChange: onTableChange, showInnerPagination: true, expandable: {
-                expandedRowRender: function (record) { return React.createElement("p", { style: { margin: 0 } }, "111"); },
-                rowExpandable: function (record) { return true; },
-            }, 
-            // scroll={{ x: 1000, y: 200 }}
-            showDelAllBtn: true, delAllChange: onDelAllChange, rowSelection: {
+            // configInfo={tableConfig}
+            showColumnDynamic: true, showColumnDynamicKey: "test-o-0011", onTableChange: onTableChange, showInnerPagination: true, expandable: {
+                // expandedRowRender: (record) => <p style={{ margin: 0 }}>111</p>,
+                // rowExpandable: (record) => true,
+                expandedRowKeys: expandedRowKeys,
+                onExpand: function (expanded, record) {
+                    if (expanded) {
+                        setExpandedRowKeys(function (pre) { return __spreadArray(__spreadArray([], pre), [record === null || record === void 0 ? void 0 : record.id]); });
+                    }
+                    else {
+                        setExpandedRowKeys(function (pre) {
+                            var index = pre.findIndex(function (id) { return id === (record === null || record === void 0 ? void 0 : record.id); });
+                            var newRecord = pre.slice();
+                            newRecord.splice(index, 1);
+                            return newRecord;
+                        });
+                    }
+                },
+            }, isOpenVirtualScrollBar: true, scroll: { x: 1200, y: 400 }, showDelAllBtn: true, delAllChange: onDelAllChange, rowSelection: {
                 type: 'checkbox',
-            }, summaryConfig: [
+            }, summaryFixed: true, summaryConfig: [
                 {
                     type: 'subtotal',
                     fields: [