From 6ac0146455dd001787d27d6840756b4a2c63c0f6 Mon Sep 17 00:00:00 2001 From: Qi <3194726156@qq.com> Date: Sat, 9 Aug 2025 22:17:09 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=9E=E7=8E=B0=E8=A1=A8=E5=8D=95=E6=8F=90?= =?UTF-8?q?=E4=BA=A4=E4=B8=8A=E4=BC=A0=E5=9B=BE=E7=89=87=E3=80=81=E8=A7=86?= =?UTF-8?q?=E9=A2=91=E7=AD=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/OroqenHeritageProjectModal.vue | 184 +++++++++++++++++- 1 file changed, 180 insertions(+), 4 deletions(-) diff --git a/src/views/oroqen/heritage-project/components/OroqenHeritageProjectModal.vue b/src/views/oroqen/heritage-project/components/OroqenHeritageProjectModal.vue index 1e5f523..b1c5b93 100644 --- a/src/views/oroqen/heritage-project/components/OroqenHeritageProjectModal.vue +++ b/src/views/oroqen/heritage-project/components/OroqenHeritageProjectModal.vue @@ -12,6 +12,8 @@ import { saveOrUpdate } from '../OroqenHeritageProject.api'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; + import { uploadFile } from '/@/api/common/api'; + import { defHttp } from '/@/utils/http/axios'; const { createMessage } = useMessage(); // Emits声明 const emit = defineEmits(['register', 'success']); @@ -51,25 +53,199 @@ // 预处理日期数据 changeDateValue(values); setModalProps({ confirmLoading: true }); + + // 处理文件上传 + await handleFileUploads(values); + //提交表单 await saveOrUpdate(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); - } catch ({ errorFields }) { - if (errorFields) { - const firstField = errorFields[0]; + } catch (error) { + console.error('表单提交失败:', error); + + // 处理表单验证错误 + if (error && error.errorFields) { + const firstField = error.errorFields[0]; if (firstField) { scrollToField(firstField.name, { behavior: 'smooth', block: 'center' }); } } - return Promise.reject(errorFields); + + // 显示错误消息 + if (error && error.message) { + createMessage.error(error.message); + } else if (typeof error === 'string') { + createMessage.error(error); + } else { + createMessage.error('操作失败，请重试'); + } + + // 重要：必须抛出错误，否则会导致未处理的Promise拒绝 + throw error; } finally { setModalProps({ confirmLoading: false }); } } + /** + * 处理文件上传 + * @param formData 表单数据 + */ + async function handleFileUploads(formData) { + console.log('开始处理文件上传，表单数据:', formData); + + try { + // 查找所有需要处理文件上传的字段 + const fileFields = ['coverImage', 'images', 'videoUrl']; + + for (const field of fileFields) { + // 如果字段有值且包含blob URL，说明有新文件需要上传 + if (formData[field] && typeof formData[field] === 'string') { + const fieldValue = formData[field]; + const filePaths = fieldValue.split(',').filter(path => path.trim()); + + for (const path of filePaths) { + if (path.startsWith('blob:')) { + // 这是一个需要处理的blob文件 + console.log(`发现需要处理的blob文件: ${field} -> ${path}`); + + try { + const uploadedPath = await uploadBlobFile(path, field); + // 替换表单数据中的blob URL为服务器路径 + formData[field] = formData[field].replace(path, uploadedPath); + console.log(`文件上传成功，更新路径: ${path} -> ${uploadedPath}`); + } catch (error) { + console.error(`上传文件失败 (${field}):`, error); + createMessage.error(`上传文件失败: ${error.message}`); + throw error; + } + } + } + } + } + + console.log('所有文件处理完成，最终表单数据:', formData); + + } catch (error) { + console.error('文件上传处理失败:', error); + throw error; + } + } + + /** + * 上传blob文件 + * @param filePath 文件路径或blob URL + * @param fieldName 字段名 + * @returns 上传后的文件路径 + */ + async function uploadBlobFile(filePath, fieldName) { + try { + console.log('处理文件:', filePath, '字段:', fieldName); + + let file; + let fileName; + + if (filePath.startsWith('blob:')) { + // 从blob URL获取文件 + console.log('从blob URL获取文件'); + const response = await fetch(filePath); + const blob = await response.blob(); + fileName = `${fieldName}_${Date.now()}.${blob.type.split('/')[1] || 'jpg'}`; + file = new File([blob], fileName, { type: blob.type }); + + console.log('从blob URL创建的文件:', file); + } else { + console.log('非blob URL，可能是已存在的文件路径'); + return filePath; // 返回原路径，可能是已存在的文件 + } + + if (!file) { + throw new Error('无法获取文件对象'); + } + + // 确定业务路径 + let bizPath = 'heritage-project/temp'; + if (fieldName === 'coverImage') { + bizPath = 'heritage-project/cover'; + } else if (fieldName === 'images') { + bizPath = 'heritage-project/images'; + } else if (fieldName === 'videoUrl') { + bizPath = 'heritage-project/video'; + } + + // 上传文件参数 + const uploadParams = { + file: file, + name: 'file', + filename: fileName, + data: { + biz: bizPath + } + }; + + console.log('上传参数:', uploadParams); + console.log('上传参数详细信息:'); + console.log('- file对象:', file); + console.log('- file.name:', file.name); + console.log('- file.size:', file.size); + console.log('- file.type:', file.type); + console.log('- bizPath:', bizPath); + + // 上传文件 + const uploadResult = await defHttp.uploadFile( + { + url: '/sys/common/upload', + timeout: 30000 + }, + uploadParams, + { + isReturnResponse: true + } + ); + + console.log('上传结果完整信息:', uploadResult); + console.log('上传结果类型:', typeof uploadResult); + + // 处理可能的undefined情况 + if (!uploadResult) { + console.error('上传结果为空或undefined'); + throw new Error('上传失败：服务器未返回结果'); + } + + console.log('上传结果success字段:', uploadResult?.success); + console.log('上传结果message字段:', uploadResult?.message); + console.log('上传结果code字段:', uploadResult?.code); + + // 检查上传结果 - 兼容不同的返回格式 + const isSuccess = uploadResult && ( + uploadResult.success === true || + uploadResult.code === 0 || + uploadResult.code === 200 + ); + + if (isSuccess) { + const filePath = uploadResult.message || uploadResult.result || uploadResult.data; + console.log('上传成功，文件路径:', filePath); + return filePath; + } else { + console.error('上传失败详细信息:', { + result: uploadResult, + success: uploadResult?.success, + message: uploadResult?.message, + code: uploadResult?.code, + error: uploadResult?.error + }); + throw new Error(uploadResult?.message || uploadResult?.error || '上传失败，请检查网络连接或联系管理员'); + } + } catch (error) { + console.error('上传文件失败:', error); + throw error; + } + } + /** * 处理日期值 * @param formData 表单数据