diff --git a/backend/ruoyi-modules/ruoyi-rs/src/main/java/org/dromara/rs/service/impl/RsOverseasApplicationServiceImpl.java b/backend/ruoyi-modules/ruoyi-rs/src/main/java/org/dromara/rs/service/impl/RsOverseasApplicationServiceImpl.java index e2c957eb..f9fa4656 100644 --- a/backend/ruoyi-modules/ruoyi-rs/src/main/java/org/dromara/rs/service/impl/RsOverseasApplicationServiceImpl.java +++ b/backend/ruoyi-modules/ruoyi-rs/src/main/java/org/dromara/rs/service/impl/RsOverseasApplicationServiceImpl.java @@ -489,6 +489,25 @@ public class RsOverseasApplicationServiceImpl extends ServiceImpl 0; } diff --git a/web/src/views/rs/overseas/index.vue b/web/src/views/rs/overseas/index.vue index a131a56f..17b056fe 100644 --- a/web/src/views/rs/overseas/index.vue +++ b/web/src/views/rs/overseas/index.vue @@ -790,47 +790,6 @@ - -
-
- - 申请附件上传(可选) -
-
- 请上传与出国申请相关的附件材料(如邀请函、行程安排、会议通知等),支持PDF、Word、Excel、图片格式 -
- - -
- -
点击或拖拽文件到此处上传
-
-
-
- +
+
+ + 党籍保留附件 +
+
+
+
+ + + {{ (state.viewData as OverseasApplicationVO).partyRetentionFileName }} + +
+ 上传时间: {{ (state.viewData as OverseasApplicationVO).partyRetentionUploadTime }} +
+
+
+ + 预览 + + + 下载 + +
+
+
+
+
@@ -1953,6 +1955,12 @@ const handleUpdateAndResubmitApplication = async (row: OverseasApplicationVO) => state.applicationDialog.title = '修改并重新提交因私出国(境)申请'; state.pageType = 'resubmit'; state.isResubmitMode = true; // 标记为重新提交模式 + + // 加载已上传的附件列表(关键:用于编辑时显示已有附件) + console.log('🔄 [重新提交] 开始加载已上传的附件列表,attachmentIds:', response.data.attachmentIds); + await loadApplicationAttachmentList(response.data.attachmentIds); + console.log('✅ [重新提交] 附件列表加载完成'); + // 更新弹窗key,确保每次打开都是全新的组件 state.applicationDialog.key = Date.now(); console.log('🔄 [重新提交] 打开弹窗,更新key:', state.applicationDialog.key); @@ -2342,6 +2350,10 @@ const resetApplicationForm = () => { state.partyRetentionFileList = []; console.log('🧹 [重置表单] 已清空党籍保留附件列表'); + // ✅ 清空申请附件列表(关键修复!) + applicationAttachmentFileList.value = []; + console.log('🧹 [重置表单] 已清空申请附件列表'); + // 重置签名画布 nextTick(() => { if (signatureCanvas.value) { @@ -2470,7 +2482,8 @@ const submitApplicationForm = () => { itinerary: state.applicationForm.itinerary, duration: state.applicationForm.duration, personnelCategory: state.applicationForm.personnelCategory, - emergencyContact: state.applicationForm.emergencyContact // 添加应急联系人字段 + emergencyContact: state.applicationForm.emergencyContact, // 添加应急联系人字段 + attachmentIds: (state.applicationForm as any).attachmentIds // 添加附件ID字段(关键) }); // 权限检查 @@ -3104,6 +3117,7 @@ const handlePartyRetentionFileUploadSuccess = (response: any, file: any) => { state.applicationForm.partyRetentionFileName = response.data.fileName; state.applicationForm.partyRetentionUploadTime = response.data.uploadTime; state.applicationForm.partyRetentionUploadStatus = '1'; + state.applicationForm.partyRetentionFileOssId = response.data.ossId; // ⭐ 保存OSS文件ID ElMessage.success('党籍保留附件上传成功!'); } else { @@ -3124,6 +3138,7 @@ const handlePartyRetentionFileRemove = () => { state.applicationForm.partyRetentionFileName = ''; state.applicationForm.partyRetentionUploadTime = ''; state.applicationForm.partyRetentionUploadStatus = '0'; + state.applicationForm.partyRetentionFileOssId = null; // ⭐ 清空OSS文件ID // 清空文件列表(重要:解决删除后文件仍显示的问题) state.partyRetentionFileList = []; @@ -3395,6 +3410,87 @@ const loadViewAttachmentList = async (attachmentIds: string | null | undefined) } }; +// 加载编辑表单的附件列表(用于编辑/重新提交时显示已上传的附件) +const loadApplicationAttachmentList = async (attachmentIds: string | null | undefined) => { + console.log('🔍 [编辑附件] 开始加载附件列表,attachmentIds:', attachmentIds); + try { + // 清空现有列表 + applicationAttachmentFileList.value = []; + + // 检查是否有附件ID + if (!attachmentIds || !attachmentIds.toString().trim()) { + console.log('⚠️ [编辑附件] 该申请暂无附件数据'); + return; + } + + // 解析OSS ID列表 + const ossIdsArray = attachmentIds + .toString() + .split(',') + .map((id) => id.trim()) + .filter((id) => id); + + if (ossIdsArray.length === 0) { + console.warn('⚠️ [编辑附件] OSS ID列表为空'); + return; + } + + console.log('📋 [编辑附件] OSS ID列表:', ossIdsArray); + + // 调用OSS接口获取文件信息 + const response = await request({ + url: `/resource/oss/listByIds/${ossIdsArray.join(',')}`, + method: 'get' + }); + + if (response.code === 200 && response.data) { + console.log('✅ [编辑附件] 获取OSS文件信息成功:', response.data); + + // 转换数据格式到 el-upload 需要的格式 + const attachmentFiles = response.data.map((item: any, index: number) => ({ + uid: `edit_attachment_${index}_${Date.now()}`, + name: item.originalName || `附件${index + 1}`, + url: item.url, + ossId: item.ossId, + status: 'success', // 标记为上传成功 + fileSize: item.fileSize || 0, + uploadTime: item.createTime, + response: { + code: 200, + data: { + url: item.url, + ossId: item.ossId + } + } + })); + + applicationAttachmentFileList.value = attachmentFiles; + console.log('✨ [编辑附件] 附件数据处理完成,共', attachmentFiles.length, '个附件'); + + // 更新表单的 attachmentIds 字段 + updateApplicationFormAttachmentIds(); + } else { + console.warn('⚠️ [编辑附件] OSS接口返回数据为空'); + } + } catch (error: any) { + console.error('❌ [编辑附件] 加载附件列表失败:', error); + console.error('📋 [编辑附件] 错误详情:', { + message: error.message, + response: error.response, + status: error.response?.status, + data: error.response?.data + }); + + // 根据错误类型给出提示 + if (error.response?.status === 403) { + console.error('🔒 [编辑附件] 权限不足!请检查是否有 resource:oss:list 权限'); + ElMessage.warning('您没有查询附件的权限,请联系管理员'); + } else if (error.response?.status === 404) { + console.error('🔍 [编辑附件] OSS接口不存在!请检查后端服务是否正常'); + } + } +}; + // 打开添加附件对话框 const handleAddAttachment = () => { if (!state.applicationForm.applicationId) { @@ -3554,142 +3650,6 @@ const handleDownloadStampedFile = async (data: OverseasApplicationVO) => { } }; -// 下载党籍保留附件 - 参考培训申请的实现 -const handleDownloadPartyRetentionFile = async (data: OverseasApplicationVO) => { - console.log('📥 下载党籍保留附件:', data.partyRetentionFileName); - - if (!data.partyRetentionFileOssId) { - ElMessage.warning('文件OSS ID不存在,无法下载'); - return; - } - - try { - // 使用request工具发送请求,自动包含认证头 - const response = await request({ - url: `/resource/oss/download/${data.partyRetentionFileOssId}`, - method: 'get', - responseType: 'blob' // 指定响应类型为blob - }); - - // 创建blob URL并触发下载(根据文件扩展名设置MIME类型) - const fileName = data.partyRetentionFileName || '党籍保留附件.pdf'; - const fileExt = fileName.split('.').pop()?.toLowerCase(); - const mimeType = fileExt === 'pdf' ? 'application/pdf' : 'application/octet-stream'; - - const blob = response instanceof Blob ? new Blob([response], { type: mimeType }) : new Blob([response.data], { type: mimeType }); - const url = window.URL.createObjectURL(blob); - - const link = document.createElement('a'); - link.href = url; - link.download = fileName; - - document.body.appendChild(link); - link.click(); - - // 清理资源 - document.body.removeChild(link); - window.URL.revokeObjectURL(url); - - ElMessage.success('文件下载成功'); - } catch (error) { - console.error('下载党籍保留附件失败:', error); - ElMessage.error('下载文件失败,请检查文件权限或稍后重试'); - } -}; - -// 预览党籍保留附件 -const handlePreviewPartyRetentionFile = async (data: OverseasApplicationVO) => { - console.log('👁️ 预览党籍保留附件:', data.partyRetentionFileName); - - if (!data.partyRetentionFileOssId) { - ElMessage.warning('文件OSS ID不存在,无法预览'); - return; - } - - try { - // 判断文件类型 - const fileName = data.partyRetentionFileName || ''; - const fileExt = fileName.split('.').pop()?.toLowerCase(); - - // 图片类型直接在新窗口预览 - if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(fileExt || '')) { - // 使用OSS下载接口获取图片 - const imageUrl = `/resource/oss/download/${data.partyRetentionFileOssId}`; - - // 获取blob URL用于预览 - const response = await request({ - url: imageUrl, - method: 'get', - responseType: 'blob' - }); - - const blob = - response instanceof Blob - ? new Blob([response], { type: response.type || 'image/jpeg' }) - : new Blob([response.data], { type: response.data.type || 'image/jpeg' }); - const blobUrl = window.URL.createObjectURL(blob); - - // 在新窗口打开图片 - const previewWindow = window.open('', '_blank'); - if (previewWindow) { - previewWindow.document.write(` - - - - ${fileName} - - - - ${fileName} - - - `); - previewWindow.document.close(); - } - } - // PDF类型在新窗口预览 - else if (fileExt === 'pdf') { - // 获取PDF文件 - const response = await request({ - url: `/resource/oss/download/${data.partyRetentionFileOssId}`, - method: 'get', - responseType: 'blob' - }); - - // 正确处理Blob创建,确保包含正确的MIME类型 - const blob = - response instanceof Blob ? new Blob([response], { type: 'application/pdf' }) : new Blob([response.data], { type: 'application/pdf' }); - - console.log('📄 [PDF预览] 党籍附件Blob创建成功:', { - size: blob.size, - type: blob.type, - fileName: fileName - }); - - const blobUrl = window.URL.createObjectURL(blob); - - // 在新窗口打开PDF - window.open(blobUrl, '_blank'); - - // 延迟清理,确保新窗口已加载 - setTimeout(() => { - window.URL.revokeObjectURL(blobUrl); - }, 60000); // 60秒后清理 - } - // 其他文件类型提示下载 - else { - ElMessage.info('该文件类型不支持在线预览,请下载后查看'); - await handleDownloadPartyRetentionFile(data); - } - } catch (error) { - console.error('预览党籍保留附件失败:', error); - ElMessage.error('预览文件失败,请检查文件权限或稍后重试'); - } -}; - // 预览出国境登记表盖章文件 const handlePreviewStampedFile = async (data: OverseasApplicationVO) => { console.log('👁️ 预览出国境登记表盖章文件:', data.stampedRegistrationFileName); @@ -3783,6 +3743,98 @@ const handlePreviewStampedFile = async (data: OverseasApplicationVO) => { } }; +// ==================== 党籍保留附件预览和下载方法 ==================== + +/** 预览党籍保留附件 */ +const handlePreviewPartyRetentionFile = async (data: OverseasApplicationVO) => { + console.log('👁️ 预览党籍保留附件:', data.partyRetentionFileName); + + if (!data.partyRetentionFileOssId) { + ElMessage.warning('文件OSS ID不存在,无法预览'); + return; + } + + try { + // 判断文件类型 + const fileName = data.partyRetentionFileName || ''; + const fileExt = fileName.split('.').pop()?.toLowerCase(); + + // 图片类型直接在新窗口预览 + if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(fileExt || '')) { + const imageUrl = `/resource/oss/download/${data.partyRetentionFileOssId}`; + const response = await request({ + url: imageUrl, + method: 'get', + responseType: 'blob' + }); + + const blob = new Blob([response as BlobPart], { type: 'image/jpeg' }); + const url = window.URL.createObjectURL(blob); + window.open(url, '_blank'); + return; + } + + // PDF文件在新窗口预览 + if (fileExt === 'pdf') { + const pdfUrl = `/resource/oss/download/${data.partyRetentionFileOssId}`; + const response = await request({ + url: pdfUrl, + method: 'get', + responseType: 'blob' + }); + + const blob = new Blob([response as BlobPart], { type: 'application/pdf' }); + const url = window.URL.createObjectURL(blob); + window.open(url, '_blank'); + return; + } + + // 其他文件类型提示下载 + ElMessage.info('该文件类型不支持预览,请下载后查看'); + await handleDownloadPartyRetentionFile(data); + } catch (error) { + console.error('预览党籍保留附件失败:', error); + ElMessage.error('预览文件失败,请检查文件权限或稍后重试'); + } +}; + +/** 下载党籍保留附件 */ +const handleDownloadPartyRetentionFile = async (data: OverseasApplicationVO) => { + console.log('📥 下载党籍保留附件:', data.partyRetentionFileName); + + if (!data.partyRetentionFileOssId) { + ElMessage.warning('文件OSS ID不存在,无法下载'); + return; + } + + try { + const response = await request({ + url: `/resource/oss/download/${data.partyRetentionFileOssId}`, + method: 'get', + responseType: 'blob' + }); + + const fileName = data.partyRetentionFileName || '党籍保留附件.pdf'; + const fileExt = fileName.split('.').pop()?.toLowerCase(); + const mimeType = fileExt === 'pdf' ? 'application/pdf' : 'application/octet-stream'; + + const blob = new Blob([response as BlobPart], { type: mimeType }); + const url = window.URL.createObjectURL(blob); + const link = document.createElement('a'); + link.href = url; + link.setAttribute('download', fileName); + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + window.URL.revokeObjectURL(url); + + ElMessage.success('下载成功'); + } catch (error) { + console.error('下载党籍保留附件失败:', error); + ElMessage.error('下载失败,请稍后重试'); + } +}; + // ==================== 申请附件上传相关方法(新增 - 参考培训申请模式) ==================== /** 申请附件上传前检查 */ @@ -3861,6 +3913,40 @@ function updateApplicationFormAttachmentIds() { } /** 移除申请附件 */ +/** 预览申请附件 */ +function handlePreviewApplicationAttachment(file: any) { + console.log('👁️ [申请附件] 预览附件:', file); + if (file.url) { + window.open(file.url, '_blank'); + } else { + proxy?.$modal.msgWarning('该附件暂无预览地址'); + } +} + +/** 下载申请附件 */ +function handleDownloadApplicationAttachment(file: any) { + console.log('⬇️ [申请附件] 下载附件:', file); + if (file.url) { + const link = document.createElement('a'); + link.href = file.url; + link.download = file.name; + link.click(); + } else { + proxy?.$modal.msgWarning('该附件暂无下载地址'); + } +} + +/** 确认移除申请附件 */ +function confirmRemoveApplicationAttachment(file: any, fileList: any[]) { + proxy?.$modal + .confirm('确定要移除附件【' + file.name + '】吗?') + .then(() => { + handleRemoveApplicationAttachment(file); + proxy?.$modal.msgSuccess('附件移除成功'); + }) + .catch(() => {}); +} + function handleRemoveApplicationAttachment(file: any) { console.log('🗑️ [申请附件] 移除附件:', file.name); // 更新 attachmentIds @@ -3976,6 +4062,43 @@ function handleRemoveApplicationAttachment(file: any) { font-size: 13px; } +/* 申请附件拖拽上传区域样式 */ +.el-upload-dragger-attachment { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 8px; + padding: 10px 15px; + min-height: 50px; + background: #fafafa; + border: 1px dashed #d9d9d9; + border-radius: 4px; + transition: all 0.3s; +} + +.el-upload-dragger-attachment:hover { + border-color: #409eff; + background: #f5f7fa; +} + +.el-upload-dragger-attachment .el-icon--upload { + margin: 0; + font-size: 20px; + color: #409eff; +} + +.el-upload-dragger-attachment .el-upload__text { + margin: 0; + font-size: 14px; + color: #606266; +} + +.el-upload-dragger-attachment .el-upload__text em { + color: #409eff; + font-style: normal; +} + /* 自定义文件卡片样式 */ .upload-file-card { width: 100%; @@ -4036,16 +4159,47 @@ function handleRemoveApplicationAttachment(file: any) { font-size: 12px; } -.upload-file-name { +/* 文件信息区域 */ +.upload-file-info { padding: 5px 8px; + background: #fff; + border-top: 1px solid #e4e7ed; +} + +.upload-file-name { font-size: 12px; color: #606266; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - background: #fff; - border-top: 1px solid #e4e7ed; + margin-bottom: 3px; +} + +.upload-file-status { + text-align: center; + font-size: 11px; +} + +.status-uploading { + color: #409eff; +} + +.status-success { + color: #67c23a; +} + +.status-fail { + color: #f56c6c; +} + +/* 文件图片预览样式 */ +.upload-file-image { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; } .upload-file-card-actions {