@cloudbase/weda-ui 3.4.2 → 3.4.4

package/dist/web/components/table/ImportFileModalByApi/index.js

@@ -0,0 +1,321 @@
+import React, { useEffect, useState } from 'react';
+import { Modal, Button, Stepper, Dropdown, List, Status, Icon, } from 'tea-component';
+import { UploadCSVFile } from './uploadCSVFile';
+import { alertErrorMessage } from '../../../utils/platform';
+import { useImportingStatus } from '../hooks/useImportingStatus';
+import './index.css';
+import { callWedaApi } from '../../../utils/tcb';
+// 字段映射
+const FileTitleDropdown = ({ fileHeader, fileItem, upddateFileJsonMap }) => {
+    const [currentItem, setCurrentItem] = useState(fileItem === null || fileItem === void 0 ? void 0 : fileItem.fileTitle);
+    return (React.createElement(Dropdown, { clearable: true, trigger: "click", appearance: "button", style: { marginRight: 10 }, button: currentItem, onClear: () => {
+            setCurrentItem(null);
+            upddateFileJsonMap(null);
+        } },
+        React.createElement(List, { type: "option" }, fileHeader.map((i, index) => (React.createElement(List.Item, { key: index, onClick: () => {
+                setCurrentItem(i);
+                upddateFileJsonMap(i);
+            } }, i))))));
+};
+// 提交前校验是否存在重复字段
+const repeatabilityCheck = (fileJsonMap) => {
+    let repeatList = [];
+    const fileTitleList = [];
+    fileJsonMap.forEach((i) => {
+        if (!fileTitleList.includes(i.fileTitle)) {
+            fileTitleList.push(i.fileTitle);
+        }
+        else {
+            repeatList.push(i.fileTitle);
+            repeatList = [...new Set(repeatList)];
+        }
+    });
+    return repeatList;
+};
+/**
+ * 菜单导航配置弹窗
+ */
+export function ImportFileModalByApi({ onCancel, handleInOrOutRecordModealVisible, visible, fields, datasourceTitle, dbName, refresh, }) {
+    const [file, setFile] = useState(null);
+    const [fileId, setFileIds] = useState(null);
+    const [fileHeader, setFileHeader] = useState([]);
+    const [fileJsonMap, setFileJsonMap] = useState([]);
+    const [disableNext, setDisableNext] = useState(true);
+    const [status, setStatus] = useState(null);
+    const [errorMessage, setErrorMessage] = useState([]);
+    const { fileImportStatus, fileImportErrorMessage } = useImportingStatus(fileId, dbName, 'import');
+    const [createDataImportQuery, setCreateDataImportQuery] = useState({
+        writeType: 'create',
+        isTriggerWorkflow: false,
+        fileId: '',
+        fileName: '',
+        fileSize: 0,
+    });
+    const importFileHandle = async () => {
+        var _a;
+        try {
+            // 设置上传参数
+            // 去除空字段，隐藏计算字段
+            const trimFields = fileJsonMap.filter((field) => {
+                var _a;
+                return field &&
+                    typeof field === 'object' &&
+                    ((_a = Object.keys(field)) === null || _a === void 0 ? void 0 : _a.length) &&
+                    field.format !== 'function';
+            });
+            const fieldMapAction = (_a = trimFields === null || trimFields === void 0 ? void 0 : trimFields.map(({ name, fileTitle, format, updateRelateByFieldsKey }) => {
+                const result = {
+                    FieldId: name,
+                    ColumnName: fileTitle,
+                };
+                if (format === 'related' ||
+                    format === 'x-enum' ||
+                    format === 'father-son') {
+                    result['Strategy'] = updateRelateByFieldsKey;
+                }
+                return result;
+            })) === null || _a === void 0 ? void 0 : _a.filter((item) => item === null || item === void 0 ? void 0 : item.ColumnName); // 没有选择表列字段的过滤掉
+            const { fileSize, fileName, fileId, isTriggerWorkflow, writeType } = createDataImportQuery;
+            // 启动导入接口
+            const queryParams = {
+                action: 'CreateDataImport',
+                data: {
+                    FileId: fileId,
+                    FileName: fileName,
+                    FileSize: fileSize,
+                    WriteType: writeType,
+                    TriggerWorkflow: isTriggerWorkflow,
+                    DataSourceName: dbName,
+                    FieldMap: fieldMapAction,
+                    UpdateBy: 'identity',
+                },
+            };
+            const { FileId, Status, ErrorMessage } = await callWedaApi(queryParams);
+            if (Status === 'success') {
+                setStatus('success');
+                refresh();
+            }
+            else if (Status === 'failure') {
+                setErrorMessage(['导入文件失败', [ErrorMessage || '']]);
+            }
+            else if (Status === 'importing' || Status === 'init') {
+                // 轮询查询状态
+                setFileIds(FileId);
+            }
+        }
+        catch (error) {
+            setStatus('error');
+            setErrorMessage(['导入文件请求失败', [(error === null || error === void 0 ? void 0 : error.message) || '']]);
+            console.error('importFileHandle error', error);
+        }
+    };
+    // 枚举 关联关系 主子明细根据可选「选项标识」「选项值」「主列字段」或「数据标识」作为导入匹配标识
+    const getUpdateRelateByFields = ({ format, updateRelateByFieldsValue, name, }) => {
+        const relatedMenuList = [
+            {
+                key: 'identity',
+                value: '数据标识',
+            },
+            {
+                key: 'primary',
+                value: '主列字段',
+            },
+        ];
+        const menuList = {
+            related: relatedMenuList,
+            'x-enum': [
+                {
+                    key: 'key',
+                    value: '选项标识',
+                },
+                {
+                    key: 'value',
+                    value: '选项值',
+                },
+            ],
+            'father-son': relatedMenuList,
+        };
+        const menu = (format) => {
+            var _a;
+            return (React.createElement(List, { type: "option" }, (_a = menuList === null || menuList === void 0 ? void 0 : menuList[format]) === null || _a === void 0 ? void 0 : _a.map((item) => (React.createElement(List.Item, { key: item.key, onClick: () => {
+                    const list = fileJsonMap.map((fileItem) => {
+                        if (fileItem.name === name) {
+                            fileItem.updateRelateByFieldsValue = item.value;
+                            fileItem.updateRelateByFieldsKey = item.key;
+                        }
+                        return fileItem;
+                    });
+                    setFileJsonMap(list);
+                } }, item.value)))));
+        };
+        if (format === 'related' ||
+            format === 'x-enum' ||
+            format === 'father-son') {
+            return (React.createElement(Dropdown, { trigger: "click", clickClose: true, button: updateRelateByFieldsValue, appearance: "button", className: "file-json-map-content_update_fileds" }, menu(format)));
+        }
+        return null;
+    };
+    const addUpdateFieldsBy = (fileJsonMapList, fileHeader, type) => {
+        const isExidsId = fileHeader === null || fileHeader === void 0 ? void 0 : fileHeader.find((item) => item === '数据标识');
+        const isSelectUpdateBy = (fileJsonMapList === null || fileJsonMapList === void 0 ? void 0 : fileJsonMapList.findIndex((item) => item.name === '_id')) !== -1;
+        if (!isSelectUpdateBy && type === 'add') {
+            fileJsonMapList === null || fileJsonMapList === void 0 ? void 0 : fileJsonMapList.unshift({
+                fileTitle: isExidsId || '请指定更新依据字段',
+                title: '数据标识（更新依据字段）',
+                name: '_id',
+            });
+        }
+        if (isSelectUpdateBy && type === 'remove') {
+            fileJsonMapList === null || fileJsonMapList === void 0 ? void 0 : fileJsonMapList.shift();
+        }
+        setFileJsonMap(fileJsonMapList);
+    };
+    useEffect(() => {
+        if (fileImportStatus === 'success') {
+            refresh();
+            setStatus('success');
+        }
+        else if (fileImportStatus === 'failure') {
+            setStatus('error');
+            setErrorMessage([fileImportErrorMessage === null || fileImportErrorMessage === void 0 ? void 0 : fileImportErrorMessage.ErrorMessage]);
+        }
+    }, [fileImportStatus, fileImportErrorMessage]);
+    const steps = [
+        {
+            id: 'uploadFile',
+            label: '选择文件',
+            component: (React.createElement(UploadCSVFile, { file: file, setFile: setFile, datasourceTitle: datasourceTitle, dbName: dbName, fields: fields, parseFile: ({ fileHeader }) => {
+                    setFileHeader(fileHeader);
+                    const fileJsonMapList = fields.map((i) => {
+                        const item = { ...i };
+                        item.fileTitle = fileHeader.find((j) => j === item.title);
+                        if (i.format === 'x-enum') {
+                            item.updateRelateByFieldsValue = '选项标识';
+                            item.updateRelateByFieldsKey = 'key';
+                        }
+                        if (i.format === 'related' || i.format === 'father-son') {
+                            item.updateRelateByFieldsValue = '主列字段';
+                            item.updateRelateByFieldsKey = 'primary';
+                        }
+                        return item;
+                    });
+                    setFileJsonMap(fileJsonMapList);
+                    setDisableNext(false);
+                }, setDisableNext: setDisableNext, createDataImportQuery: createDataImportQuery, setCreateDataImportQuery: setCreateDataImportQuery })),
+        },
+        {
+            id: 'fieldMap',
+            label: '映射字段',
+            component: (React.createElement("div", { className: "file-json-map-wrap" },
+                React.createElement("div", { className: "file-json-map-header" },
+                    React.createElement("p", null, "\u6587\u6863\u5B57\u6BB5"),
+                    React.createElement("span", { className: "arrow" }),
+                    React.createElement("p", null, "\u8868\u683C\u5B57\u6BB5")),
+                React.createElement("div", { className: "file-json-map-container" }, fileJsonMap.map((i, index) => (React.createElement("div", { className: "file-json-map-content", key: index },
+                    React.createElement(FileTitleDropdown, { fileHeader: fileHeader, fileItem: i, upddateFileJsonMap: (fileTitle) => {
+                            const list = fileJsonMap.map((j) => {
+                                const item = { ...j };
+                                if (i.title === j.title) {
+                                    item.fileTitle = fileTitle;
+                                }
+                                return item;
+                            });
+                            setFileJsonMap(list);
+                        } }),
+                    React.createElement("span", { className: "arrow" }),
+                    React.createElement("span", { className: "table-field" }, i.title),
+                    getUpdateRelateByFields(i))))))),
+            nextAction: () => {
+                const { writeType } = createDataImportQuery;
+                const updateFieldsBystatus = writeType === 'update' || writeType === 'upsert';
+                addUpdateFieldsBy(fileJsonMap, fileHeader, updateFieldsBystatus ? 'add' : 'remove');
+                setCurrent(next ? next.id : null);
+            },
+        },
+        {
+            id: 'importFile',
+            label: '导入文件',
+            component: (React.createElement("div", { className: "import-file-result-wrap" },
+                status === 'error' && (React.createElement("div", { className: "error-container" },
+                    React.createElement("div", { className: "error-tip" },
+                        React.createElement(Icon, { type: "error", size: "s" }),
+                        React.createElement("p", null, "\u6570\u636E\u5BFC\u5165\u5931\u8D25")),
+                    React.createElement("div", { className: "error-content" },
+                        React.createElement(List, null, Array.isArray(errorMessage)
+                            ? errorMessage === null || errorMessage === void 0 ? void 0 : errorMessage.map((i, index) => (React.createElement(List.Item, { key: index }, i)))
+                            : errorMessage)))),
+                status !== 'validateError' && status !== 'error' && (React.createElement("div", { className: `status-wrap ${status}` },
+                    React.createElement(Status, { icon: 'blank', size: 'm', title: status === 'success'
+                            ? '数据导入完成'
+                            : '数据导入中，请稍后...', description: status !== 'success' ? (React.createElement("div", null,
+                            "\u5173\u95ED\u5F39\u7A97\u540E\uFF0C\u5BFC\u5165\u4EFB\u52A1\u4F1A\u7EE7\u7EED\u6267\u884C\uFF0C\u53EF\u5728",
+                            React.createElement("a", { onClick: () => {
+                                    handleInOrOutRecordModealVisible('import');
+                                    onCancel();
+                                } }, "\u6211\u7684\u5BFC\u5165\u8BB0\u5F55"),
+                            "\u67E5\u770B\u4EFB\u52A1\u8FDB\u5EA6")) : (React.createElement("div", null,
+                            React.createElement("span", null,
+                                "\u6210\u529F", fileImportErrorMessage === null || fileImportErrorMessage === void 0 ? void 0 :
+                                fileImportErrorMessage.Success,
+                                "\u6761\uFF0C\u5931\u8D25", fileImportErrorMessage === null || fileImportErrorMessage === void 0 ? void 0 :
+                                fileImportErrorMessage.Failure,
+                                "\u6761"),
+                            !!(fileImportErrorMessage === null || fileImportErrorMessage === void 0 ? void 0 : fileImportErrorMessage.Failure) && (React.createElement("a", { target: '_blank', href: fileImportErrorMessage === null || fileImportErrorMessage === void 0 ? void 0 : fileImportErrorMessage.ErrorDownloadUrl, rel: "noreferrer", style: { marginLeft: '6px' } }, "\u4E0B\u8F7D\u9519\u8BEF\u62A5\u544A")))) }))))),
+            nextAction: () => {
+                var _a;
+                // 更新依据字段
+                const isSelectUpdateBy = fileJsonMap.find((item) => item.fileTitle === '请指定更新依据字段');
+                if (isSelectUpdateBy) {
+                    alertErrorMessage({ message: `请指定更新依据字段才能更新数据` });
+                    return;
+                }
+                const repeatList = (_a = repeatabilityCheck(fileJsonMap)) === null || _a === void 0 ? void 0 : _a.filter((item) => !!item);
+                if (repeatList.length) {
+                    let text = repeatList.reduce((res, i) => `${res}、${i}`);
+                    text = text ? text === null || text === void 0 ? void 0 : text.replace('null', '空') : '空';
+                    const modal = Modal.show({
+                        size: 's',
+                        children: (React.createElement(React.Fragment, null,
+                            React.createElement(Modal.Body, null,
+                                React.createElement(Modal.Message, { icon: "warning", message: "\u6587\u6863\u5B57\u6BB5\u91CD\u590D\u6620\u5C04", description: `文档的「${text}」字段被映射到多个表格字段，是否确认导入` })),
+                            React.createElement(Modal.Footer, null,
+                                React.createElement(Button, { onClick: () => {
+                                        modal.destroy();
+                                    } }, "\u53D6\u6D88"),
+                                React.createElement(Button, { type: "primary", onClick: async () => {
+                                        modal.destroy();
+                                        importFileHandle();
+                                        setCurrent(next ? next.id : null);
+                                    } }, "\u786E\u8BA4\u5BFC\u5165")))),
+                        onClose: () => modal.destroy(),
+                    });
+                }
+                else {
+                    importFileHandle();
+                    setCurrent(next ? next.id : null);
+                }
+            },
+        },
+    ];
+    const [current, setCurrent] = useState('uploadFile');
+    const currentIndex = current ? steps.findIndex((x) => x.id === current) : -1;
+    const next = current && steps[currentIndex + 1];
+    const prev = current ? steps[currentIndex - 1] : steps[steps.length - 1];
+    return (React.createElement(Modal, { caption: "\u5BFC\u5165\u6570\u636E", visible: visible, onClose: onCancel, destroyOnClose: true, size: 'l', className: `weda-import-csv-file-modal weda-import-by-api-csv-file-modal ${current === 'importFile' && 'none-border'}` },
+        React.createElement(Modal.Body, null,
+            React.createElement("div", null,
+                React.createElement(Stepper, { steps: steps, current: current }),
+                React.createElement("section", { className: "modal-section" }, steps[currentIndex] && steps[currentIndex].component))),
+        React.createElement(Modal.Footer, null,
+            current === 'uploadFile' && (React.createElement(Button, { type: "link", style: { float: 'left' }, onClick: () => {
+                    handleInOrOutRecordModealVisible('import');
+                    onCancel();
+                } }, "\u6211\u7684\u5BFC\u5165\u8BB0\u5F55")),
+            current !== 'importFile' && (React.createElement(React.Fragment, null,
+                React.createElement(Button, { disabled: !prev, onClick: () => setCurrent(prev.id) }, "\u4E0A\u4E00\u6B65"),
+                React.createElement(Button, { type: "primary", disabled: (!next && !current) || disableNext, onClick: () => {
+                        if (next.nextAction) {
+                            next.nextAction();
+                        }
+                    }, style: { marginLeft: 10 } }, next ? '下一步' : '开始导入'))))));
+}

package/dist/web/components/table/ImportFileModalByApi/uploadCSVFile.js

@@ -0,0 +1,115 @@
+import React, { useState } from 'react';
+import { Upload, Form, Text, Status, Select } from 'tea-component';
+import { exportData, getXlsxFileHeader } from '../../../utils/file';
+import { callWedaApi } from '../../../utils/tcb';
+import csvTemplate from '../ImportFileModal/csvTemplate.json';
+// 下载模版
+const getCSVTemplate = (fields, datasourceTitle) => {
+    const header = [];
+    const row = [];
+    fields.forEach((i) => {
+        var _a;
+        const value = (_a = csvTemplate.find((j) => j.type === i.type && j.format === i.format)) === null || _a === void 0 ? void 0 : _a.value;
+        header.push(i.title);
+        row.push(value || '');
+    });
+    exportData([header, row], 'xlsx', `_${datasourceTitle}_导入模版`);
+};
+// 上传csv文件
+export function UploadCSVFile({ parseFile, fields, datasourceTitle, dbName, setDisableNext, setFile, file, createDataImportQuery, setCreateDataImportQuery, }) {
+    const [status, setStatus] = useState(null);
+    const [errorMsg, setErrorMsg] = useState('');
+    function handleStart(file) {
+        setFile(file);
+        getXlsxFileHeader(file, ({ headers }) => {
+            parseFile({ fileHeader: headers });
+        });
+    }
+    function handleSuccess(value) {
+        const { code } = value;
+        if (code === 'BAD_REQUEST') {
+            setStatus('error');
+            setDisableNext(true);
+        }
+        else {
+            setStatus('success');
+        }
+    }
+    function handleError(error) {
+        console.error('handleError', error);
+        setStatus('error');
+        setErrorMsg('上传文件失败' + error);
+        setDisableNext(true);
+    }
+    function beforeUpload(file, fileList, isAccepted) {
+        if (!isAccepted) {
+            setStatus('error');
+        }
+        return isAccepted;
+    }
+    async function getUploadUrl(file) {
+        try {
+            const { name, size } = file;
+            const queryParams = {
+                action: 'CreateDataPreImport',
+                data: { FileName: name, DataSourceName: dbName },
+            };
+            const { UploadUrl, FileId } = await callWedaApi(queryParams);
+            setCreateDataImportQuery({
+                ...createDataImportQuery,
+                fileId: FileId,
+                fileName: name,
+                fileSize: size,
+            });
+            return UploadUrl;
+        }
+        catch (error) {
+            setErrorMsg(`上传文件 CreateDataPreImport 接口调用失败，${(error === null || error === void 0 ? void 0 : error.message) || ''}`);
+            console.error('getUploadUrl error', error);
+        }
+    }
+    return (React.createElement("div", { className: "modal-upload-wrap" },
+        React.createElement(Form, { className: "weda_modal-upload-wrap_import_type" },
+            React.createElement(Form.Item, { label: "\u5BFC\u5165\u6A21\u5F0F" },
+                React.createElement(Select, { size: "m", appearance: "button", options: [
+                        { value: 'create', text: '仅新增' },
+                        { value: 'update', text: '仅更新' },
+                        { value: 'upsert', text: '新增或更新' },
+                    ], value: createDataImportQuery.writeType, onChange: (value) => setCreateDataImportQuery({
+                        ...createDataImportQuery,
+                        writeType: value,
+                    }) }))),
+        React.createElement(Form.Control, { status: status, message: status === 'error' ? errorMsg : '' },
+            React.createElement(Upload, { method: "put", action: getUploadUrl, send: (file) => file, accept: ".xlsx", maxSize: 1024 * 1024 * 2, onStart: handleStart, onSuccess: handleSuccess, onError: handleError, beforeUpload: beforeUpload }, ({ open, isDragging }) => (React.createElement(Upload.Dragger, { filename: file && file.name, button: React.createElement(Status, { className: "csv-file", icon: 'blank', size: 's', description: file && file.name, operation: React.createElement(React.Fragment, null,
+                        React.createElement("a", { onClick: open }, "\u91CD\u65B0\u4E0A\u4F20"),
+                        "\u00A0/\u00A0",
+                        React.createElement("a", { onClick: () => {
+                                setFile(null);
+                                setDisableNext(true);
+                            } }, "\u5220\u9664")) }) }, isDragging ? ('释放鼠标') : (React.createElement(Status, { className: "upload-file", icon: 'blank', size: 's', operation: React.createElement(React.Fragment, null,
+                    React.createElement("a", { onClick: open }, "\u70B9\u51FB\u4E0A\u4F20"),
+                    " /",
+                    ' ',
+                    React.createElement(Text, { theme: "weak" }, "\u62D6\u62FD\u5230\u6B64\u533A\u57DF")) })))))),
+        React.createElement("div", { className: "modal-upload-text-wrap" },
+            React.createElement("ul", null,
+                React.createElement("li", null,
+                    "1\u3001\u8BF7\u4E0B\u8F7D\u4F7F\u7528",
+                    React.createElement("span", { onClick: () => {
+                            getCSVTemplate(fields, datasourceTitle);
+                        } }, "\u00A0 \u5BFC\u5165\u6A21\u7248"),
+                    "\uFF0C\u5E76\u6309\u7167\u793A\u4F8B\u586B\u5199\u6570\u636E\uFF0C\u4EE5\u4FDD\u8BC1\u6570\u636E\u5BFC\u5165\u987A\u5229"),
+                React.createElement("li", null, "2\u3001\u652F\u6301xlsx\u7C7B\u578B\u6587\u4EF6\uFF0C\u8981\u6C42\u6587\u4EF6\u5927\u5C0F2M\u4EE5\u5185\uFF0C\u4E0D\u80FD\u8D85\u8FC710000\u884C"),
+                React.createElement("li", null,
+                    React.createElement("div", null, "3\u3001\u5BFC\u5165\u66F4\u65B0\u8BF4\u660E"),
+                    React.createElement("div", null, "\u00A01\uFF09\u652F\u6301\u4EE5\u300C\u6570\u636E\u6807\u8BC6\u300D\u4F5C\u4E3A\u4F9D\u636E\u5B57\u6BB5\uFF0C\u5BF9\u5DF2\u6709\u6570\u636E\u8FDB\u884C\u5339\u914D\u66F4\u65B0"),
+                    React.createElement("div", null, "\u00A02\uFF09\u5BFC\u5165\u6A21\u5F0F\u4E3A\u300C\u65B0\u589E\u6216\u66F4\u65B0\u300D\u65F6\uFF0C\u5982\u300C\u6570\u636E\u6807\u8BC6\u300D\u5217\u4E3A\u7A7A\uFF0C\u8BE5\u884C\u6570\u636E\u4F1A\u6267\u884C\u65B0\u589E\u64CD\u4F5C")),
+                React.createElement("li", null,
+                    React.createElement("div", null, "4\u3001\u6570\u636E\u683C\u5F0F\u8BF4\u660E"),
+                    React.createElement("div", null, "\u00A0 1\uFF09\u679A\u4E3E\u7C7B\u578B\u6570\u636E\uFF1A\u652F\u6301\u9009\u62E9\u9009\u9879\u6807\u8BC6\u6216\u9009\u9879\u503C\u8FDB\u884C\u5BFC\u5165\uFF1A\u9009\u9879\u6807\u8BC6\u4E3A\u8868\u683C\u4E2D\u5C55\u793A\u7684\u4E1A\u52A1\u540D\u79F0\uFF1B\u9009\u9879\u503C\u4E3A\u9009\u9879\u7684\u7CFB\u7EDF\u552F\u4E00\u6807\u8BC6"),
+                    React.createElement("div", null, "\u00A02\uFF09\u5173\u8054\u5173\u7CFB\u3001\u4E3B\u5B50\u660E\u7EC6\u7C7B\u578B\u6570\u636E\uFF1A\u652F\u6301\u9009\u62E9\u4E3B\u5217\u5B57\u6BB5\u6216\u6570\u636E\u6807\u8BC6\u8FDB\u884C\u5BFC\u5165\uFF1A\u4E3B\u5217\u5B57\u6BB5\u4E3A\u8868\u683C\u4E2D\u5C55\u793A\u7684\u5173\u8054\u6570\u636E\u4E1A\u52A1\u540D\u79F0\uFF1B\u6570\u636E\u6807\u8BC6\u4E3A\u5173\u8054\u6570\u636E\u7684\u7CFB\u7EDF\u552F\u4E00\u6807\u8BC6"),
+                    React.createElement("div", null, "\u00A03\uFF09\u5E03\u5C14\u7C7B\u578B\u6570\u636E\uFF1A\u652F\u6301\u5BFC\u5165\u300C\u662F/\u5426\u300D\u6216\u300Ctrue/false\u300D"),
+                    React.createElement("div", null, "\u00A04\uFF09\u56FE\u7247\u7C7B\u578B\u6570\u636E\uFF1A\u652F\u6301\u5BFC\u5165https\u6216cloud\u534F\u8BAE\u7684\u56FE\u7247\u5730\u5740"),
+                    React.createElement("div", null, "\u00A05\uFF09\u6587\u4EF6\u7C7B\u578B\u6570\u636E\uFF1A\u652F\u6301cloud\u534F\u8BAE\u7684\u6587\u4EF6\u5730\u5740"),
+                    React.createElement("div", null, "\u00A06\uFF09\u5730\u7406\u4F4D\u7F6E\u7C7B\u578B\u6570\u636E\uFF1A\u6570\u636E\u683C\u5F0F\u8981\u6C42\u4E3A\u5730\u70B9\u540D\u79F0(\u5750\u6807\u7ECF\u5EA6\uFF0C\u5750\u6807\u7EF4\u5EA6)"))))));
+}

package/dist/web/components/table/InOrOutRecordModeal.js

@@ -0,0 +1,139 @@
+import React, { useEffect, useState } from 'react';
+import { useInOutFieldsRecords } from './hooks/useInOutFieldsRecords';
+import { mutate } from 'swr';
+import { Modal, Table, Button, Text, StatusTip, Icon, List, } from 'tea-component';
+import { moment } from '../form/select';
+const fieldsStatusTextColor = {
+    init: 'warning',
+    importing: 'warning',
+    success: 'text',
+    failure: 'danger',
+    partialFailure: 'danger',
+};
+/**
+ * 菜单导航配置弹窗
+ */
+export function InOrOutRecordModeal({ visible, onCancel, dbName }) {
+    var _a, _b, _c, _d, _e;
+    const isImportRecord = visible && visible === 'import';
+    const titlePre = isImportRecord ? '导入' : '导出';
+    const fieldsStatus = {
+        init: `${titlePre}初始化中`,
+        importing: `${titlePre}中`,
+        exporting: `${titlePre}中`,
+        success: '成功',
+        failure: '失败',
+        partialFailure: '部分失败',
+    };
+    const [isLodaing, setIsLodaing] = useState(null);
+    const [errorFiles, setErrorFiles] = useState(null);
+    const { data, isError } = useInOutFieldsRecords({
+        type: visible || 'import',
+        dbName,
+        setIsLodaing,
+    });
+    const tableRecords = ((_a = data === null || data === void 0 ? void 0 : data.Files) === null || _a === void 0 ? void 0 : _a.map((item) => {
+        const result = { ...item };
+        // 整理出部分失败状态，成功条数不为0，失败条数不为0，partialFailure
+        const { ErrorMessage, ErrorDownloadUrl } = item;
+        const isPartialFailure = (ErrorMessage === null || ErrorMessage === void 0 ? void 0 : ErrorMessage.Failure) && (ErrorMessage === null || ErrorMessage === void 0 ? void 0 : ErrorMessage.Success);
+        if (ErrorMessage && ErrorDownloadUrl) {
+            ErrorMessage['ErrorDownloadUrl'] = ErrorDownloadUrl;
+        }
+        if (isPartialFailure) {
+            result['Status'] = 'partialFailure';
+        }
+        result['ErrorMessage'] = ErrorMessage;
+        return result;
+    })) || [];
+    const renderStatus = (item) => {
+        const status = item === null || item === void 0 ? void 0 : item.Status;
+        return (React.createElement("div", null,
+            status && (React.createElement(Text, { theme: fieldsStatusTextColor[status] }, fieldsStatus[status])),
+            status !== 'success' && (React.createElement("span", { style: { color: '#E7E7E7', margin: '0 7px' } }, "|")),
+            (status === 'importing' || status === 'init') && (React.createElement(Button, { type: "link", onClick: () => {
+                    mutate(dbName + 'DescribeDataImportList');
+                } }, "\u5237\u65B0")),
+            (status === 'failure' || status === 'partialFailure') && (React.createElement(Button, { type: "link", onClick: () => {
+                    setErrorFiles(item === null || item === void 0 ? void 0 : item.ErrorMessage);
+                } }, (item === null || item === void 0 ? void 0 : item.ErrorMessage) ? '查看原因' : '未查询到失败原因'))));
+    };
+    const { scrollable } = Table.addons;
+    const columns = [
+        {
+            key: 'FileName',
+            header: '文件名称',
+            render: (item) => React.createElement("span", null, (item === null || item === void 0 ? void 0 : item.FileName) || '-'),
+        },
+        {
+            key: 'CreateDate',
+            header: `${titlePre}时间`,
+            render: (item) => moment(item === null || item === void 0 ? void 0 : item.CreateDate).format('YYYY-MM-DD HH:mm:ss'),
+        },
+        { key: 'Status', header: '状态', render: (item) => renderStatus(item) },
+    ];
+    if (!isImportRecord) {
+        columns.push({
+            key: 'Operate',
+            header: '操作',
+            render: (item) => {
+                return (item === null || item === void 0 ? void 0 : item.DownloadUrl) ? (React.createElement("a", { target: '_blank', href: item === null || item === void 0 ? void 0 : item.DownloadUrl, rel: "noreferrer" }, "\u70B9\u51FB\u4E0B\u8F7D")) : (React.createElement("span", null, "-"));
+            },
+        });
+    }
+    const getTopTip = (isError, isLodaing, tableRecords) => {
+        let type = null;
+        if (isError) {
+            type = 'error';
+        }
+        else if (isLodaing) {
+            type = 'loading';
+        }
+        else if (!(tableRecords === null || tableRecords === void 0 ? void 0 : tableRecords.length)) {
+            type = 'empty';
+        }
+        return type && React.createElement(StatusTip, { status: type });
+    };
+    const getTitle = (isErrorMessage) => {
+        if (isErrorMessage) {
+            return (React.createElement(React.Fragment, null,
+                React.createElement("span", { className: "weda-import-or-modal__arrowarp", onClick: () => {
+                        setErrorFiles([]);
+                    } },
+                    React.createElement("i", { className: "weda-import-or-modal__arrow" })),
+                React.createElement("span", null),
+                "\u5931\u8D25\u539F\u56E0\uFF1A", errorFiles === null || errorFiles === void 0 ? void 0 :
+                errorFiles.FileName));
+        }
+        return `${titlePre}数据`;
+    };
+    useEffect(() => {
+        mutate(dbName + 'DescribeDataImportList');
+    }, []);
+    return (React.createElement(Modal, { caption: getTitle((_b = errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage) === null || _b === void 0 ? void 0 : _b.length), visible: visible, onClose: onCancel, destroyOnClose: true, size: 'l', className: `weda-import-or-modal` },
+        React.createElement(Modal.Body, null, ((_c = errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage) === null || _c === void 0 ? void 0 : _c.length) ? (React.createElement("div", { className: "error-container" },
+            React.createElement("div", { className: "error-tip" },
+                React.createElement(Icon, { type: "error", size: "s" }),
+                React.createElement("p", null,
+                    "\u6570\u636E",
+                    titlePre,
+                    "\u5931\u8D25")),
+            React.createElement("div", { className: "error-content" },
+                React.createElement(List, null,
+                    (errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorDownloadUrl) && (React.createElement(List.Item, null,
+                        React.createElement("a", { target: '_blank', href: errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorDownloadUrl, rel: "noreferrer" }, "\u4E0B\u8F7D\u9519\u8BEF\u62A5\u544A"))),
+                    Array.isArray(errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage)
+                        ? (_d = errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage) === null || _d === void 0 ? void 0 : _d.map((i, index) => (React.createElement(List.Item, { key: index }, i)))
+                        : errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage)))) : (React.createElement(Table, { records: tableRecords, recordKey: "CreateDate", columns: columns, topTip: getTopTip(isError, isLodaing, tableRecords), addons: [
+                scrollable({
+                    maxHeight: 420,
+                }),
+            ] }))),
+        React.createElement(Modal.Footer, null, !((_e = errorFiles === null || errorFiles === void 0 ? void 0 : errorFiles.ErrorMessage) === null || _e === void 0 ? void 0 : _e.length) && (React.createElement(Button, { type: "text", style: {
+                float: 'left',
+                pointerEvents: 'none',
+                marginLeft: '0',
+                paddingLeft: '0',
+                color: 'rgba(0, 0, 0, 0.6)',
+            } }, "\u4EC5\u5C55\u793A24\u5C0F\u65F6\u5185\u5BFC\u5165/\u5BFC\u51FA\u8BB0\u5F55")))));
+}

package/dist/web/components/table/QuoteModal.js

@@ -0,0 +1,16 @@
+import React, { Fragment, useState } from 'react';
+import { Button, Modal } from 'tea-component';
+/**
+ * 引用类型显示弹窗
+ * @description 使用组件方式编写，避免数据流中断
+ */
+export const QuoteModal = ({ children, ...restProps }) => {
+    const [visible, setVisible] = useState(false);
+    const onHandleModalVisible = () => {
+        setVisible(!visible);
+    };
+    return (React.createElement(Fragment, null,
+        React.createElement(Button, { onClick: onHandleModalVisible, type: "link" }, "\u8BE6\u60C5"),
+        React.createElement(Modal, { ...restProps, visible: visible, onClose: onHandleModalVisible },
+            React.createElement(Modal.Body, null, children))));
+};