diff --git a/src/components/CURD/PageContent.vue b/src/components/CURD/PageContent.vue index 0d173cb6..9d185e3e 100644 --- a/src/components/CURD/PageContent.vue +++ b/src/components/CURD/PageContent.vue @@ -416,28 +416,28 @@ *.xlsx / *.xls 确 定 - 取 消 + 取 消 @@ -706,19 +706,19 @@ function handleExports() { // 导入表单 let isFileImport = false; const uploadRef = ref(); -const importsModalVisible = ref(false); -const importsFormRef = ref(); -const importsFormData = reactive<{ +const importModalVisible = ref(false); +const importFormRef = ref(); +const importFormData = reactive<{ files: UploadUserFile[]; }>({ files: [], }); -const importsFormRules: FormRules = { +const importFormRules: FormRules = { files: [{ required: true, message: "请选择文件" }], }; // 打开导入弹窗 -function handleOpenImportsModal(isFile: boolean = false) { - importsModalVisible.value = true; +function handleOpenImportModal(isFile: boolean = false) { + importModalVisible.value = true; isFileImport = isFile; } // 覆盖前一个文件 @@ -730,11 +730,11 @@ function handleFileExceed(files: File[]) { } // 下载导入模板 function handleDownloadTemplate() { - const importsTemplate = props.contentConfig.importsTemplate; - if (typeof importsTemplate === "string") { - window.open(importsTemplate); - } else if (typeof importsTemplate === "function") { - importsTemplate().then((response) => { + const importTemplate = props.contentConfig.importTemplate; + if (typeof importTemplate === "string") { + window.open(importTemplate); + } else if (typeof importTemplate === "function") { + importTemplate().then((response) => { const fileData = response.data; const fileName = decodeURI( response.headers["content-disposition"].split(";")[1].split("=")[1] @@ -742,12 +742,12 @@ function handleDownloadTemplate() { saveXlsx(fileData, fileName); }); } else { - ElMessage.error("未配置importsTemplate"); + ElMessage.error("未配置importTemplate"); } } // 导入确认 -const handleImportsSubmit = useThrottleFn(() => { - importsFormRef.value?.validate((valid: boolean) => { +const handleImportSubmit = useThrottleFn(() => { + importFormRef.value?.validate((valid: boolean) => { if (valid) { if (isFileImport) { handleImport(); @@ -758,11 +758,11 @@ const handleImportsSubmit = useThrottleFn(() => { }); }, 3000); // 关闭导入弹窗 -function handleCloseImportsModal() { - importsModalVisible.value = false; - importsFormRef.value?.resetFields(); +function handleCloseImportModal() { + importModalVisible.value = false; + importFormRef.value?.resetFields(); nextTick(() => { - importsFormRef.value?.clearValidate(); + importFormRef.value?.clearValidate(); }); } // 文件导入 @@ -772,9 +772,9 @@ function handleImport() { ElMessage.error("未配置importAction"); return; } - importAction(importsFormData.files[0].raw as File).then(() => { + importAction(importFormData.files[0].raw as File).then(() => { ElMessage.success("导入数据成功"); - handleCloseImportsModal(); + handleCloseImportModal(); handleRefresh(true); }); } @@ -786,7 +786,7 @@ function handleImports() { return; } // 获取选择的文件 - const file = importsFormData.files[0].raw as File; + const file = importFormData.files[0].raw as File; // 创建Workbook实例 const workbook = new ExcelJS.Workbook(); // 使用FileReader对象来读取文件内容 @@ -833,7 +833,7 @@ function handleImports() { } importsAction(data).then(() => { ElMessage.success("导入数据成功"); - handleCloseImportsModal(); + handleCloseImportModal(); handleRefresh(true); }); }) @@ -854,7 +854,7 @@ function handleToolbar(name: string) { handleOpenExportsModal(); break; case "imports": - handleOpenImportsModal(); + handleOpenImportModal(); break; case "search": emit("searchClick"); @@ -866,7 +866,7 @@ function handleToolbar(name: string) { handleDelete(); break; case "import": - handleOpenImportsModal(true); + handleOpenImportModal(true); break; case "export": emit("exportClick"); diff --git a/src/components/CURD/types.ts b/src/components/CURD/types.ts index c2082033..af0cd7f9 100644 --- a/src/components/CURD/types.ts +++ b/src/components/CURD/types.ts @@ -92,10 +92,10 @@ export interface IContentConfig { exportAction?: (queryParams: T) => Promise; // 前端全量导出的网络请求函数(需返回promise) exportsAction?: (queryParams: T) => Promise; + // 导入模板 + importTemplate?: string | (() => Promise); // 后端导入的网络请求函数(需返回promise) importAction?: (file: File) => Promise; - // 前端导入模板 - importsTemplate?: string | (() => Promise); // 前端导入的网络请求函数(需返回promise) importsAction?: (data: IObject[]) => Promise; // 主键名(默认为id) diff --git a/src/views/demo/curd/config/content.ts b/src/views/demo/curd/config/content.ts index bda6a058..8a79fecb 100644 --- a/src/views/demo/curd/config/content.ts +++ b/src/views/demo/curd/config/content.ts @@ -29,7 +29,7 @@ const contentConfig: IContentConfig = { return UserAPI.import(1, file); }, exportAction: UserAPI.export, - importsTemplate: UserAPI.downloadTemplate, + importTemplate: UserAPI.downloadTemplate, importsAction(data) { // 模拟导入数据 console.log("importsAction", data);