ztxkui 4.2.23-2 → 4.2.23-21

package/dist/UI/Modal/hooks.js

@@ -0,0 +1,172 @@
+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);
+};
+import React, { useMemo } from 'react';
+import { Input, EnhanceSelect, DatePicker } from '../../index';
+import { Select } from 'antd';
+import dayjs from 'dayjs';
+var getLastMonth = function () {
+    var date = [];
+    var start = dayjs().subtract(1, 'month').format('YYYY-MM') + '-01';
+    var end = dayjs(start)
+        .subtract(-1, 'month')
+        .add(-1, 'days')
+        .format('YYYY-MM-DD');
+    date.push(dayjs(start));
+    date.push(dayjs(end));
+    return date;
+};
+export var RANGEPICKER_RANGES = {
+    此刻: [dayjs(), dayjs()],
+    最近7天: [dayjs().subtract(6, 'days'), dayjs().subtract(0, 'days')],
+    最近30天: [dayjs().subtract(29, 'days'), dayjs().subtract(0, 'days')],
+    上月: getLastMonth(),
+    本月: [dayjs().startOf('month'), dayjs().endOf('month')],
+    上季度: [
+        dayjs()
+            .quarter(dayjs().quarter() - 1)
+            .startOf('quarter'),
+        dayjs()
+            .quarter(dayjs().quarter() - 1)
+            .endOf('quarter'),
+    ],
+    本季度: [dayjs().startOf('quarter'), dayjs().endOf('quarter')],
+    上一年: [
+        dayjs()
+            .year(dayjs().year() - 1)
+            .startOf('year'),
+        dayjs()
+            .year(dayjs().year() - 1)
+            .endOf('year'),
+    ],
+    本年: [dayjs().startOf('year'), dayjs().endOf('year')],
+};
+export function useForm() {
+    var items = useMemo(function () {
+        return [
+            {
+                name: 'test1',
+                label: '测试1',
+                render: function (itemProps) { return React.createElement(Input, __assign({}, itemProps, { allowClear: true })); },
+            },
+            {
+                name: 'test2',
+                label: '测试2',
+                render: function (itemProps) { return (React.createElement(Select, __assign({}, itemProps, { allowClear: true }),
+                    React.createElement(Select.Option, { value: 1 }, "1"),
+                    React.createElement(Select.Option, { value: 2 }, "2"))); },
+            },
+            {
+                name: 'companyId',
+                label: '公司',
+                render: function (itemProps) { return (React.createElement(EnhanceSelect, __assign({}, itemProps, { list: [
+                        { id: '1', name: '小明' },
+                        { id: '2', name: '小虎' },
+                    ], allowClear: true }))); },
+            },
+            {
+                name: 'depId',
+                label: '部门',
+                render: function (itemProps) { return (React.createElement(EnhanceSelect, __assign({}, itemProps, { list: [
+                        { id: '1', name: '小明' },
+                        { id: '2', name: '小虎' },
+                    ], allowClear: true }))); },
+            },
+            {
+                name: 'createTime',
+                label: '时间',
+                render: function (itemProps) { return (React.createElement(DatePicker.RangePicker, __assign({}, itemProps, { ranges: RANGEPICKER_RANGES }))); },
+            },
+            {
+                name: 'oneTime',
+                label: '时间1',
+                render: function (itemProps) { return React.createElement(DatePicker, __assign({}, itemProps)); },
+            },
+        ];
+    }, []);
+    // 时间转换
+    var dateTransformToString = useMemo(function () {
+        return {
+            fromKey: ['createTime', 'oneTime'],
+            toKey: [['startTime', 'endTime'], 'oneTimeEnd'],
+            format: ['YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD'],
+            type: 'string',
+        };
+    }, []);
+    // 外部初始值
+    var outsideParams = useMemo(function () {
+        return {
+            test1: '22',
+            test2: 1,
+            createTime: [dayjs().subtract(30, 'days'), dayjs().subtract(0, 'days')],
+        };
+    }, []);
+    return {
+        items: items,
+        outsideParams: outsideParams,
+        dateTransformToString: dateTransformToString,
+    };
+}
+export function useTable() {
+    var columns = [
+        {
+            title: '测试列3',
+            width: 100,
+            dataIndex: 'test3',
+            key: 'test3',
+            // 普通输入框配置
+            editable: true,
+            // 配置列的验证规则，这种是最普通的非空校验
+            validate: {},
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test3 !== preRecord.test3;
+            },
+        },
+        {
+            title: '测试列2',
+            width: 100,
+            dataIndex: 'test2',
+            key: 'test2',
+            // 普通输入框配置
+            editable: true,
+            // 配置列的验证规则，这种是最普通的非空校验
+            validate: {},
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test2 !== preRecord.test2;
+            },
+        },
+        {
+            title: '测试列1',
+            width: 100,
+            dataIndex: 'test1',
+            key: 'test1',
+            // 普通输入框配置
+            editable: true,
+            // 配置列的验证规则，这种是最普通的非空校验
+            validate: {},
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test1 !== preRecord.test1;
+            },
+        },
+    ];
+    var tablePropsReset = useMemo(function () {
+        return {
+            isEdit: true,
+            showColumnDynamic: true,
+            showColumnDynamicKey: 'modal-table-ui',
+            scroll: { x: 1000, y: 500 },
+        };
+    }, []);
+    return {
+        columns: columns,
+        tablePropsReset: tablePropsReset,
+    };
+}

package/dist/UI/Modal/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Modal: React.FC;
+export default Modal;

package/dist/UI/Modal/index.js

@@ -0,0 +1,46 @@
+import React, { useState, useCallback } from 'react';
+import ProModal, { useVisible } from 'components/ProModal';
+import { Button } from '../../index';
+import { data2 } from '../Table/data';
+import { useForm, useTable } from './hooks';
+function request(params) {
+    return new Promise(function (resolve) {
+        setTimeout(function () {
+            resolve(data2);
+        }, 2000);
+    });
+}
+var Modal = function () {
+    var _a = useVisible(), visible = _a.visible, onClose = _a.onClose, onOpen = _a.onOpen;
+    // 表单配置相关信息
+    var _b = useForm(), items = _b.items, outsideParams = _b.outsideParams, dateTransformToString = _b.dateTransformToString;
+    // 已选中的选择项
+    var _c = useState(), selectedRowKeys = _c[0], setSelectedRowKeys = _c[1];
+    var _d = useState(), selectedRows = _d[0], setSelectedRows = _d[1];
+    var tablePropsChoiceFilterHandle = useCallback(function (record, selectedRowKeys, selectedRows) {
+        return {};
+    }, []);
+    // 选中后点击确认选择回调
+    var tablePropsOnSelectedRowChange = useCallback(function (selectedRowKeys, selectedRows) {
+        setSelectedRowKeys(selectedRowKeys);
+        setSelectedRows(selectedRows);
+    }, []);
+    // 当前选中项回调
+    var _e = useState(), childContent = _e[0], setChildContent = _e[1];
+    var tablePropsOnSelect = useCallback(function (record, selected, selectedRows) {
+        console.log(record, selected, selectedRows);
+        setChildContent(record);
+    }, []);
+    // 表格配置相关信息
+    var _f = useTable(), columns = _f.columns, tablePropsReset = _f.tablePropsReset;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Button, { onClick: function () { return onOpen(); } }, "\u5F00\u542F\u5F39\u6846"),
+        React.createElement(Button, { onClick: function () {
+                console.log(selectedRowKeys, selectedRows);
+            } }, "\u83B7\u53D6\u6570\u636E"),
+        React.createElement(ProModal, { title: "\u8BF7\u9009\u62E9", visible: visible, onClose: onClose, request: request, outsideParams: outsideParams, formPropsItems: items, formPropsDateTransform: dateTransformToString, tablePropsColumns: columns, tablePropsRowKey: "id", tablePropsReset: tablePropsReset, tablePropsIsChoice: true, tablePropsIsChoiceFilter: true, tablePropsSelectedRowKeys: selectedRowKeys, tablePropsSelectedRows: selectedRows, tablePropsChoiceFilterHandle: tablePropsChoiceFilterHandle, tablePropsOnSelectedRowChange: tablePropsOnSelectedRowChange, tablePropsOnSelect: tablePropsOnSelect, tablePropsIsRepeatChoice: true },
+            React.createElement("div", null,
+                "\u6211\u662F\u5B50\u8868",
+                JSON.stringify(childContent)))));
+};
+export default Modal;

package/dist/UI/Table/DefaultTable.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function DefaultTable(): JSX.Element;

package/dist/UI/Table/DefaultTable.js

@@ -0,0 +1,49 @@
+// 普通的表格使用
+import { useState, useEffect } from 'react';
+import { ProTable } from '../../index';
+import { data1 } from './data';
+// 表格列配置相关逻辑
+// 可以把columns定义成常量再最外面，或者state
+function useColumns() {
+    var _a = useState([]), data = _a[0], setData = _a[1];
+    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',
+            showCopy: true,
+        },
+        {
+            title: '测试列2',
+            width: 100,
+            dataIndex: 'test2',
+            key: 'test2',
+            showCopy: true,
+            render: function (_text, _record, index) {
+                return _text + '自定义添加';
+            },
+        },
+    ];
+    useEffect(function () {
+        setTimeout(function () {
+            setData(data1);
+        }, 300);
+    }, []);
+    return { columns: columns, data: data };
+}
+export default function DefaultTable() {
+    var _a = useColumns(), columns = _a.columns, data = _a.data;
+    return (React.createElement(ProTable, { rowKey: "id", columns: columns, dataSource: data, 
+        // 是否开启动态列配置
+        showColumnDynamic: true, 
+        // 动态列配置必须参数，唯一的键值
+        showColumnDynamicKey: "single-local-key-001" }));
+}

package/dist/UI/Table/EditTable.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function EditTable(): JSX.Element;

package/dist/UI/Table/EditTable.js

@@ -0,0 +1,259 @@
+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 };
+    }
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+// 带编辑属性的表格使用
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { data2 } from './data';
+import ProEditTable from 'components/ProTable';
+import { Button, message, EnhanceSelect } from '../../index';
+// 表格列配置相关逻辑
+// 可以把columns定义成常量再最外面，或者state
+// 编辑列的配置需要注意的点
+// 1. 对于编辑想的scu配置，因为里面存在比较复杂的render
+// 2. 如果是input 或者inputNumber可以通过配置实现
+// 3. 可以通过配置校验规则 验证表格
+// 4. 自定义render 需要调用表格提供的修改数据方法
+function useColumns(tableHandleRef) {
+    var _a = useState([]), data = _a[0], setData = _a[1];
+    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',
+            showCopy: true,
+        },
+        {
+            title: '测试列2',
+            width: 100,
+            dataIndex: 'test2',
+            key: 'test2',
+            showCopy: true,
+            render: function (_text, _record, index) {
+                return _text + '自定义添加';
+            },
+        },
+        {
+            title: '测试列3',
+            width: 100,
+            dataIndex: 'test3',
+            key: 'test3',
+            showCopy: true,
+            // 普通输入框配置
+            editable: true,
+            // 配置列的验证规则，这种是最普通的非空校验
+            validate: {},
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test3 !== preRecord.test3;
+            },
+        },
+        {
+            title: '测试列4',
+            width: 100,
+            dataIndex: 'test4',
+            key: 'test4',
+            showCopy: true,
+            editable: true,
+            editableConfig: {
+                type: 'input',
+                placeholder: '输入',
+            },
+            // 配置列的验证规则，实现自定义校验
+            validate: {
+                validate: function (value, record, index, title) {
+                    // value 当前输入值
+                    // record 当前行数据
+                    // index 当前行
+                    // title 列头
+                    if (value === '我是张飞') {
+                        // 返回错误格式，为了迎合表单的校验
+                        return Promise.reject({
+                            errorFields: [
+                                {
+                                    errors: "\u67D0\u67D0\u8868\u683C \u7B2C" + index + "\u884C " + title + " \u4E0D\u80FD\u4E3A\u5F20\u98DE\uFF01",
+                                },
+                            ],
+                        });
+                    }
+                    return Promise.resolve();
+                },
+            },
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test4 !== preRecord.test4;
+            },
+        },
+        {
+            title: '测试列5',
+            width: 100,
+            dataIndex: 'test5',
+            key: 'test5',
+            showCopy: true,
+            editable: true,
+            // 可以增加一些编辑列的配置，目前只建议使用 inputNumber 或者input
+            // input的话 可以不使用这个配置 默认就是input
+            editableConfig: {
+                type: 'inputNumber',
+                placeholder: '输入',
+            },
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test5 !== preRecord.test5;
+            },
+        },
+        {
+            title: '测试列6',
+            width: 100,
+            dataIndex: 'test6',
+            key: 'test6',
+            shouldCellUpdate: function (record, preRecord) {
+                return record.test6 !== preRecord.test6;
+            },
+            // 自定义render的话 需要手动调用表格的修改数据方法，只传递当前值
+            render: function (_text, _record, index) {
+                return (React.createElement(EnhanceSelect, { value: _text, list: [
+                        {
+                            id: '1',
+                            name: '小明',
+                        },
+                        {
+                            id: '2',
+                            name: '小李',
+                        },
+                    ], onChange: function (value, option, fullData) {
+                        var _a;
+                        var newRecord = {
+                            test6: value,
+                            test6Name: fullData.name,
+                        };
+                        (_a = tableHandleRef.current) === null || _a === void 0 ? void 0 : _a.onEditableSaveHandle(newRecord, index);
+                    } }));
+            },
+        },
+    ];
+    useEffect(function () {
+        setTimeout(function () {
+            setData(data2);
+        }, 300);
+    }, []);
+    return { columns: columns, data: data, setData: setData };
+}
+export default function EditTable() {
+    var _this = this;
+    var tableHandleRef = useRef({});
+    var _a = useColumns(tableHandleRef), columns = _a.columns, data = _a.data, setData = _a.setData;
+    var _b = useState(1), num = _b[0], setNum = _b[1];
+    useEffect(function () {
+        setNum(2);
+    }, []);
+    // 触发onChange事件
+    var onChange = useCallback(function (dataSource, info) {
+        setData(dataSource);
+    }, [setData]);
+    // 选中相关
+    var _c = useState(), selectedRowKeys = _c[0], setSelectedRowKeys = _c[1];
+    var _d = useState(), setSelectedRows = _d[1];
+    var onSelectedRowChange = useCallback(function (selectedRowKeys, selectedRows) {
+        setSelectedRowKeys(selectedRowKeys);
+        setSelectedRows(selectedRows);
+    }, []);
+    return (React.createElement("div", null,
+        React.createElement(Button, { onClick: function () {
+                console.log(data, selectedRowKeys);
+            } },
+            "\u83B7\u53D6\u6570\u636E",
+            num),
+        React.createElement(Button, { onClick: function () { return __awaiter(_this, void 0, void 0, function () {
+                var err_1, errorFields;
+                var _a;
+                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();
+                            errorFields = err_1.errorFields;
+                            if (errorFields) {
+                                message.warning(errorFields[0].errors + '');
+                            }
+                            return [3 /*break*/, 3];
+                        case 3: return [2 /*return*/];
+                    }
+                });
+            }); } }, "\u89E6\u53D1\u9A8C\u8BC1"),
+        React.createElement(ProEditTable, { rowKey: "id", columns: columns, dataSource: data, 
+            // 调用表格内部提供的方法
+            tableHandleRef: tableHandleRef, 
+            // 是否开启编辑，对于可编辑表格来说 这个属性很重要
+            isEdit: true, 
+            // 是否开启拖拽
+            isMove: true, 
+            // 是否可以批量复制，如果批量复制需要前置处理 或者后置处理 可通过提供方法处理
+            isPaste: true, 
+            // 是否开启增减行
+            showDelIcon: true, showAddIcon: true, 
+            // 增加数据的规则 是增加空白行 还是 复制一行
+            addDataMode: "blank", addDataReturnRecord: useCallback(function (record) {
+                var id = record.id, resetRecord = __rest(record, ["id"]);
+                return resetRecord;
+            }, []), 
+            // 是否记录列宽，但是又不要显示那个按钮
+            showColumnDynamic: true, showColumnDynamicKey: "single-110011", hiddenColumnDynamicIcon: true, 
+            // 开启内部分页
+            showInnerPagination: true, defaultInnerPageSize: 10, 
+            // 是否选择
+            isChoice: true, selectedRowKeys: selectedRowKeys, onSelectedRowChange: onSelectedRowChange, onChange: onChange })));
+}

package/dist/UI/Table/data.d.ts

@@ -0,0 +1,10 @@
+export declare const data1: {
+    id: string;
+    test1: string;
+    test2: number;
+}[];
+export declare const data2: {
+    id: string;
+    test1: string;
+    test2: number;
+}[];

package/dist/UI/Table/data.js

@@ -0,0 +1,14 @@
+export var data1 = new Array(50).fill(1).map(function (item, index) {
+    return {
+        id: "id-" + index,
+        test1: "test1-" + index,
+        test2: index + 100,
+    };
+});
+export var data2 = new Array(40).fill(1).map(function (item, index) {
+    return {
+        id: "id-" + index,
+        test1: "test1-" + index,
+        test2: index + 100,
+    };
+});

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function TableDemo(): JSX.Element;

package/dist/UI/Table/index.js

@@ -0,0 +1,5 @@
+// 入口文件
+import React from 'react';
+export default function TableDemo() {
+    return React.createElement("div", null);
+}

package/dist/UI/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function UIComponent(): JSX.Element;

package/dist/UI/index.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { Link, Switch, Route } from 'react-router-dom';
+import DefaultTable from './Table/DefaultTable';
+import EditTable from './Table/EditTable';
+import Form from './Form';
+import Modal from './Modal';
+import Basic from './Basic';
+export default function UIComponent() {
+    return (React.createElement("div", { style: { padding: '10px' } },
+        React.createElement(Link, { to: "/ui/default-table", style: { marginRight: '10px' } }, "\u7B80\u5355\u8868\u683C"),
+        React.createElement(Link, { to: "/ui/edit-table", style: { marginRight: '10px' } }, "\u53EF\u7F16\u8F91\u8868\u683C"),
+        React.createElement(Link, { to: "/ui/form", style: { marginRight: '10px' } }, "\u8868\u5355"),
+        React.createElement(Link, { to: "/ui/modal", style: { marginRight: '10px' } }, "\u5F39\u6846"),
+        React.createElement(Link, { to: "/ui/basic", style: { marginRight: '10px' } }, "\u57FA\u7840"),
+        React.createElement(Switch, null,
+            React.createElement(Route, { path: "/ui/default-table" },
+                React.createElement(DefaultTable, null)),
+            React.createElement(Route, { path: "/ui/edit-table" },
+                React.createElement(EditTable, null)),
+            React.createElement(Route, { path: "/ui/form" },
+                React.createElement(Form, null)),
+            React.createElement(Route, { path: "/ui/modal" },
+                React.createElement(Modal, null)),
+            React.createElement(Route, { path: "/ui/basic" },
+                React.createElement(Basic, null)))));
+}

package/dist/components/EnhanceSelect/index.js

@@ -104,6 +104,7 @@ function getData(request, options) {
             options.data = options.params;
             Reflect.deleteProperty(options, 'params');
         }
+        options.isCatch = true;
         return request(options);
     }
     return Promise.resolve({
@@ -549,6 +550,8 @@ function EnhanceSelect(_a) {
                 var catchDataKey = params ? JSON.stringify(params) : 'single';
                 if (catchData[catchDataKey]) {
                     // 读取缓存数据
+                    fetchId.current++; // fetchId +1 防止之前的请求覆盖之后的数据
+                    setLoading(false);
                     setSelectList(catchData[catchDataKey]);
                 }
                 else {
@@ -601,6 +604,7 @@ function EnhanceSelect(_a) {
         sendRequest,
         setSelectList,
         url,
+        setLoading,
     ]);
     // 3、远程搜索，url必须传递
     // 关于远程查询，最好的做法还是后台根据主键再去查一次详情数据，这样就能保证