| | |
| | | :close-on-click-modal="false" |
| | | > |
| | | <div class="detail-container detail-container1" v-if="dialogReadonly"> |
| | | <div class="detail-title">异议详情</div> |
| | | <el-row class="detail-row-view"> |
| | | <el-col :span="12"> |
| | | <div class="label">标题</div> |
| | |
| | | <div class="val">{{ formData.reviewOpinion }}</div> |
| | | </el-col> |
| | | </el-row> |
| | | <div v-if=" detailObjectionStatus === '1'"> |
| | | <div v-if=" detailObjectionStatus === '1' && permission.orderData_feedback"> |
| | | <div class="detail-title" :style="{ marginTop:pxToRem(20)}">异议反馈</div> |
| | | <el-form ref="feedbackFormRef" class="gd-dialog-form" :model="feedbackFormData" |
| | | :rules="feedbackRules" label-width="140px"> |
| | |
| | | :model="formData" |
| | | :rules="rules" |
| | | :disabled="dialogReadonly" |
| | | label-width="180px" |
| | | :label-width="pxToRem(144)" |
| | | > |
| | | <el-row> |
| | | <el-col :span="12"> |
| | |
| | | <div class="upload-container"> |
| | | <el-upload |
| | | :http-request="handleHttpRequest" |
| | | :limit="3" |
| | | :on-success="handleUploadSuccess" |
| | | :on-error="handleUploadError" |
| | | :on-remove="handleFileRemove" |
| | |
| | | class="upload-demo" |
| | | > |
| | | <template #trigger> |
| | | <el-button type="primary">选择文件</el-button> |
| | | <el-button class="gd-upload-btn" type="primary">选择文件</el-button> |
| | | </template> |
| | | <template #tip> |
| | | <div class="el-upload__tip">支持上传 (.zip/.rar/.7z/.tar/.gz)格式文件</div> |
| | | <div class="el-upload__tip">支持上传 (.zip/.rar/.7z/.tar/.gz)格式</div> |
| | | </template> |
| | | </el-upload> |
| | | </div> |
| | |
| | | <template #footer> |
| | | <template v-if="!dialogReadonly"> |
| | | <el-button |
| | | color="#F2F3F5" |
| | | color="#F2F3F5" |
| | | |
| | | v-if="!dialogReadonly" |
| | | :loading="submitting" |
| | | :disabled="submitting" |
| | | @click="handleSubmit" |
| | | > |
| | | 保存 |
| | | </el-button> |
| | | <el-button class="" color="#4C34FF" :loading="submitting" :disabled="submitting" @click="handleApply">申请</el-button> |
| | | v-if="!dialogReadonly" |
| | | :loading="submitting || uploading" |
| | | :disabled="submitting || uploading" |
| | | @click="handleSubmit" |
| | | > |
| | | 保存 |
| | | </el-button> |
| | | <el-button class="" color="#4C34FF" :loading="submitting || uploading" :disabled="submitting || uploading" @click="handleApply">申请</el-button> |
| | | </template> |
| | | <template v-if="dialogReadonly && detailObjectionStatus === '1'"> |
| | | <template v-if="dialogReadonly && detailObjectionStatus === '1' && permission.orderData_feedback"> |
| | | <el-button color="#F2F3F5" :loading="submitting" :disabled="submitting" @click="visible = false">取消</el-button> |
| | | |
| | | <el-button |
| | |
| | | <!-- <el-button color="#F2F3F5" :loading="submitting" :disabled="submitting" @click="visible = false">关闭</el-button>--> |
| | | </template> |
| | | </template> |
| | | |
| | | <!-- 申请弹框 --> |
| | | <el-dialog |
| | | class="gd-dialog" |
| | | v-model="showApplyDialog" |
| | | title="申请" |
| | | @closed="handleApplyDialogClosed" |
| | | width="500px" |
| | | destroy-on-close |
| | | :close-on-click-modal="false" |
| | | > |
| | | <el-form class="gd-dialog-form" ref="applyFormRef" :model="applyFormData" :rules="applyRules"> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | <el-form-item label="申请对象部门" prop="applyTargetDeptId"> |
| | | <el-tree-select |
| | | class="gd-select" |
| | | popper-class="gd-tree-select-popper" |
| | | v-model="applyFormData.applyTargetDeptId" |
| | | node-key="id" |
| | | :data="deptTree" |
| | | :props="treeProps" |
| | | check-strictly |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <el-button color="#F2F3F5" @click="showApplyDialog = false">取消</el-button> |
| | | <el-button class="" color="#4C34FF" :loading="applying" :disabled="applying" @click="handleApplySubmit"> |
| | | 确认 |
| | | </el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | |
| | | } from '@/views/orderView/orderDataManage/dataObjection/dataObjectionApi' |
| | | import { putFileAttachApi } from '@/views/orderView/orderDataManage/supplyAdd/supplyAddApi' |
| | | import { pxToRem } from '@/utils/rem' |
| | | import { useStore } from 'vuex' |
| | | |
| | | const store = useStore() |
| | | const permission = computed(() => store.state.user.permission); |
| | | // const requesterProvider = computed(() => store.state.user.userInfo?.role_id === '2014158512610869250') |
| | | // 初始化表单数据 |
| | | const initForm = () => ({ |
| | | id:'', |
| | | title: '', |
| | | objectionType: '', |
| | | submitter: '', |
| | |
| | | const fileList = ref([]) // 上传文件列表 |
| | | const uploadedFiles = ref([]) // 已上传文件列表 |
| | | const attachmentDetailsList = ref([]) |
| | | const uploading = ref(false) // 文件上传中状态 |
| | | |
| | | // 申请弹框相关 |
| | | const showApplyDialog = ref(false) |
| | | const applyFormRef = ref(null) |
| | | const applying = ref(false) |
| | | const applyFormData = ref({ |
| | | applyTargetDeptId: '' |
| | | }) |
| | | |
| | | // 表单校验规则 |
| | | const rules = { |
| | | title: fieldRules(true), |
| | | title: fieldRules(true,50), |
| | | objectionType: fieldRules(true), |
| | | submitter: fieldRules(true), |
| | | submitterContact: fieldRules(true), |
| | | catalogResourceName: fieldRules(true), |
| | | objectionDesc: fieldRules(true), |
| | | objectionBasis: fieldRules(true), |
| | | submitter: fieldRules(true,50), |
| | | submitterContact: fieldRules(true,50), |
| | | catalogResourceName: fieldRules(true,50), |
| | | objectionDesc: fieldRules(true,200), |
| | | objectionBasis: fieldRules(true,200), |
| | | attachId: fieldRules(true) |
| | | |
| | | } |
| | | |
| | | // 异议反馈表单校验规则 |
| | |
| | | reviewOpinion: fieldRules(true), |
| | | } |
| | | |
| | | // 申请弹框校验规则 |
| | | const applyRules = { |
| | | applyTargetDeptId: fieldRules(true), |
| | | } |
| | | |
| | | // 自定义上传请求 |
| | | const handleHttpRequest = async options => { |
| | | uploading.value = true |
| | | try { |
| | | const formDataObj = new FormData() |
| | | formDataObj.append('file', options.file) |
| | |
| | | } catch (error) { |
| | | options.onError(error) |
| | | console.error('文件上传失败:', error) |
| | | } finally { |
| | | uploading.value = false |
| | | } |
| | | } |
| | | |
| | | // 文件移除 |
| | | const handleFileRemove = (file, fileListVal) => { |
| | | if (file.response && file.response.attachId) { |
| | | uploadedFiles.value = uploadedFiles.value.filter(item => item.attachId !== file.response.attachId) |
| | | } |
| | | // 从展示列表中移除 |
| | | fileList.value = fileListVal |
| | | |
| | | // 从已上传列表中移除 |
| | | const index = uploadedFiles.value.findIndex(item => |
| | | item.attachId === file.attachId || item.name === file.name |
| | | ) |
| | | if (index > -1) { |
| | | uploadedFiles.value.splice(index, 1) |
| | | } |
| | | } |
| | | |
| | | // 上传前验证 |
| | | const beforeFileUpload = file => { |
| | | const allowedExtensions = ['.zip', '.rar', '.7z', '.tar', '.gz'] |
| | |
| | | ElMessage.error('只能上传压缩文件格式:.zip/.rar/.7z/.tar/.gz') |
| | | return false |
| | | } |
| | | const maxSize = 100 * 1024 * 1024 // 100MB |
| | | if (file.size > maxSize) { |
| | | ElMessage.error('文件大小不能超过100MB') |
| | | return false |
| | | } |
| | | // const maxSize = 100 * 1024 * 1024 // 100MB |
| | | // if (file.size > maxSize) { |
| | | // ElMessage.error('文件大小不能超过100MB') |
| | | // return false |
| | | // } |
| | | return true |
| | | } |
| | | |
| | |
| | | |
| | | // 提交数据的通用函数 |
| | | async function submitForm(objectionStatus) { |
| | | const isValid = await formRef.value?.validate().catch(() => false) |
| | | if (!isValid) return |
| | | submitting.value = true |
| | | try { |
| | | // 构建符合接口要求的提交数据 |
| | | const submitData = { |
| | | title: formData.value.title, |
| | | objectionType: formData.value.objectionType, |
| | | submitter: formData.value.submitter, |
| | | submitterContact: formData.value.submitterContact, |
| | | catalogResourceName: formData.value.catalogResourceName, |
| | | objectionDesc: formData.value.objectionDesc, |
| | | objectionBasis: formData.value.objectionBasis, |
| | | areaCode: formData.value.areaCode || '', |
| | | handleUnit: formData.value.handleUnit || '', |
| | | // 构建附件列表 |
| | | attachmentList: uploadedFiles.value.map(file => ({ |
| | | attachId: file.attachId, |
| | | attachName: file.originalName, |
| | | })), |
| | | objectionStatus: objectionStatus |
| | | } |
| | | await gdDataObjectionSubmitApi(submitData) |
| | | ElMessage.success(dialogMode.value === 'add' ? '新增成功' : '更新成功') |
| | | visible.value = false |
| | | emit('success') |
| | | } finally { |
| | | submitting.value = false |
| | | } |
| | | formData.value.attachId = uploadedFiles.value.length > 0 ? uploadedFiles.value.length : '' |
| | | const isValid = await formRef.value?.validate().catch(() => false) |
| | | if (!isValid) return |
| | | |
| | | // 在编辑模式下,如果已有附件,可以不强制上传新附件 |
| | | if (dialogMode.value === 'add' && uploadedFiles.value.length === 0) { |
| | | return ElMessage.warning('请上传附件') |
| | | } |
| | | |
| | | submitting.value = true |
| | | |
| | | try { |
| | | // 构建符合接口要求的提交数据 |
| | | const submitData = { |
| | | // 编辑模式下传递id |
| | | ...(formData.value.id && { id: formData.value.id }), |
| | | title: formData.value.title, |
| | | objectionType: formData.value.objectionType, |
| | | submitter: formData.value.submitter, |
| | | submitterContact: formData.value.submitterContact, |
| | | catalogResourceName: formData.value.catalogResourceName, |
| | | objectionDesc: formData.value.objectionDesc, |
| | | objectionBasis: formData.value.objectionBasis, |
| | | areaCode: formData.value.areaCode || '', |
| | | handleUnit: applyFormData.value.applyTargetDeptId || formData.value.handleUnit || '', |
| | | // 构建附件列表 - 使用当前已上传的文件(包括回显的) |
| | | ...(uploadedFiles.value.length > 0 && { |
| | | attachmentList: uploadedFiles.value.map(file => ({ |
| | | attachId: file.attachId, |
| | | attachName: file.originalName, |
| | | })), |
| | | }), |
| | | objectionStatus: objectionStatus |
| | | } |
| | | await gdDataObjectionSubmitApi(submitData) |
| | | ElMessage.success(dialogMode.value === 'add' ? '新增成功' : '更新成功') |
| | | visible.value = false |
| | | emit('success') |
| | | } finally { |
| | | submitting.value = false |
| | | } |
| | | } |
| | | |
| | | // 提交新增/编辑(保存) |
| | |
| | | await submitForm('0') |
| | | } |
| | | |
| | | // 申请提交 |
| | | // 申请弹框关闭处理 |
| | | function handleApplyDialogClosed() { |
| | | applyFormData.value.applyTargetDeptId = '' |
| | | } |
| | | |
| | | // 申请 |
| | | async function handleApply() { |
| | | await submitForm('1') |
| | | formData.value.attachId = uploadedFiles.value.length > 0 ? uploadedFiles.value.length : '' |
| | | // 先验证主表单 |
| | | const mainFormValid = await formRef.value?.validate().catch(() => false) |
| | | if (!mainFormValid) return |
| | | |
| | | showApplyDialog.value = true |
| | | } |
| | | |
| | | // 根据部门 id 在部门树里递归查找对应的中文名称(title) |
| | | function findDeptTitleById(tree, id) { |
| | | if (!Array.isArray(tree) || id === '' || id == null) return '' |
| | | for (const node of tree) { |
| | | if (node.id === id) return node[treeProps.label] |
| | | const found = findDeptTitleById(node[treeProps.children], id) |
| | | if (found) return found |
| | | } |
| | | return '' |
| | | } |
| | | |
| | | // 申请提交 |
| | | async function handleApplySubmit() { |
| | | const isValid = await applyFormRef.value?.validate().catch(() => false) |
| | | if (!isValid) return |
| | | applying.value = true |
| | | try { |
| | | // 构建申请数据 |
| | | const applyData = { |
| | | ...formData.value, |
| | | objectionStatus: '1', |
| | | applyTargetDeptId: applyFormData.value.applyTargetDeptId |
| | | } |
| | | |
| | | // 构建符合接口要求的提交数据 |
| | | const submitData = { |
| | | // 编辑模式下传递id |
| | | ...(applyData.id && { id: applyData.id }), |
| | | title: applyData.title, |
| | | objectionType: applyData.objectionType, |
| | | submitter: applyData.submitter, |
| | | submitterContact: applyData.submitterContact, |
| | | catalogResourceName: applyData.catalogResourceName, |
| | | objectionDesc: applyData.objectionDesc, |
| | | objectionBasis: applyData.objectionBasis, |
| | | areaCode: applyData.areaCode || '', |
| | | // 处理单位存部门中文名称,而不是 id |
| | | handleUnit: findDeptTitleById(deptTree.value, applyFormData.value.applyTargetDeptId) || applyData.handleUnit || '', |
| | | // 构建附件列表 - 使用当前已上传的文件(包括回显的) |
| | | ...(uploadedFiles.value.length > 0 && { |
| | | attachmentList: uploadedFiles.value.map(file => ({ |
| | | attachId: file.attachId, |
| | | attachName: file.originalName, |
| | | })), |
| | | }), |
| | | objectionStatus: applyData.objectionStatus, |
| | | applyTargetDeptId: applyData.applyTargetDeptId |
| | | } |
| | | |
| | | await gdDataObjectionSubmitApi(submitData) |
| | | ElMessage.success('申请成功') |
| | | showApplyDialog.value = false |
| | | visible.value = false |
| | | emit('success') |
| | | } finally { |
| | | applying.value = false |
| | | } |
| | | } |
| | | |
| | | // 处理异议反馈提交 |
| | |
| | | } |
| | | // 加载详情 |
| | | async function loadDetail() { |
| | | if (!formData.value.id) return |
| | | const res = await gdDataObjectionDetailApi({ id: formData.value.id }) |
| | | formData.value = res?.data?.data ?? {} |
| | | if (formData.value.attachIds) { |
| | | getAttachDetail(formData.value.attachIds) |
| | | } |
| | | if (!formData.value.id) return |
| | | const res = await gdDataObjectionDetailApi({ id: formData.value.id }) |
| | | formData.value = res?.data?.data ?? {} |
| | | |
| | | // 处理附件回显 |
| | | if (formData.value.attachIds) { |
| | | await getAttachDetail(formData.value.attachIds) |
| | | // 回显到上传组件 |
| | | updateFileListForDisplay() |
| | | } |
| | | } |
| | | |
| | | // 更新文件列表用于显示 |
| | | function updateFileListForDisplay() { |
| | | fileList.value = [] |
| | | uploadedFiles.value = [] |
| | | |
| | | if (attachmentDetailsList.value && attachmentDetailsList.value.length > 0) { |
| | | attachmentDetailsList.value.forEach(attach => { |
| | | const fileItem = { |
| | | name: attach.originalName || attach.name, |
| | | url: attach.link, // 用于预览 |
| | | attachId: attach.id, // 文件ID |
| | | originalName: attach.originalName, |
| | | link: attach.link |
| | | } |
| | | |
| | | fileList.value.push({ |
| | | name: fileItem.name, |
| | | url: fileItem.url, |
| | | status: 'success' // 已上传状态 |
| | | }) |
| | | |
| | | uploadedFiles.value.push(fileItem) |
| | | }) |
| | | } |
| | | } |
| | | // 获取附件详情 |
| | | async function getAttachDetail(attachIds) { |
| | |
| | | const detailPromises = ids.map(id => getAttachDetailApi({ id })) |
| | | const results = await Promise.all(detailPromises) |
| | | attachmentDetailsList.value = results.map(res => res.data.data).filter(Boolean) |
| | | console.log('附件详情', attachmentDetailsList.value) |
| | | } |
| | | // 处理附件下载 |
| | | async function handleDownloadAttach() { |
| | | if (attachmentDetailsList.value.length === 0) { |
| | | ElMessage.warning('没有可下载的附件') |
| | | return |
| | | } |
| | | const handleDownloadAttach = async () => { |
| | | if (!attachmentDetailsList.value || attachmentDetailsList.value.length === 0) { |
| | | ElMessage.warning('没有可下载的附件') |
| | | return |
| | | } |
| | | // 顺序下载每个附件 |
| | | for (let i = 0; i < attachmentDetailsList.value.length; i++) { |
| | | const attach = attachmentDetailsList.value[i] |
| | | |
| | | if (!attach.link) { |
| | | console.warn(`附件 ${attach.originalName || attach.name} 链接无效,跳过`) |
| | | continue |
| | | } |
| | | |
| | | // 遍历所有附件并下载 |
| | | attachmentDetailsList.value.forEach(attach => { |
| | | if (attach.link) { |
| | | const link = document.createElement('a') |
| | | link.href = attach.link |
| | | link.download = attach.originalName || attach.name |
| | | link.style.display = 'none' |
| | | document.body.appendChild(link) |
| | | link.click() |
| | | document.body.removeChild(link) |
| | | } |
| | | }) |
| | | try { |
| | | const response = await fetch(attach.link) |
| | | const blob = await response.blob() |
| | | const url = window.URL.createObjectURL(blob) |
| | | const a = document.createElement('a') |
| | | a.href = url |
| | | |
| | | // 设置文件名:优先使用 originalName |
| | | let fileName = attach.originalName || attach.name || `附件_${i + 1}` |
| | | |
| | | // 确保有扩展名 |
| | | if (fileName && !fileName.includes('.')) { |
| | | const contentType = response.headers.get('content-type') |
| | | if (contentType && contentType.includes('zip')) { |
| | | fileName += '.zip' |
| | | } else if (contentType && contentType.includes('rar')) { |
| | | fileName += '.rar' |
| | | } else { |
| | | fileName += '.zip' |
| | | } |
| | | } |
| | | |
| | | a.download = fileName |
| | | a.style.display = 'none' |
| | | document.body.appendChild(a) |
| | | a.click() |
| | | |
| | | // 清理 |
| | | setTimeout(() => { |
| | | window.URL.revokeObjectURL(url) |
| | | document.body.removeChild(a) |
| | | }, 100) |
| | | |
| | | // 文件间延迟(除了最后一个) |
| | | if (i < attachmentDetailsList.value.length - 1) { |
| | | await new Promise(resolve => setTimeout(resolve, 1000)) |
| | | } |
| | | |
| | | } catch (error) { |
| | | console.error(`下载失败: ${attach.originalName || attach.name}`, error) |
| | | } |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | // 打开弹框 |
| | | async function open({ mode = 'add', row } = {}) { |
| | | dialogMode.value = mode |
| | | // 重置文件列表 |
| | | fileList.value = [] |
| | | uploadedFiles.value = [] |
| | | // 重置表单数据 |
| | | formData.value = dialogMode.value === 'add' ? initForm() : row |
| | | // 重置反馈表单数据 |
| | | feedbackFormData.value = initFeedbackForm() |
| | | if (dialogMode.value !== 'add') { |
| | | await loadDetail() |
| | | } |
| | | dialogMode.value = mode |
| | | // 重置文件列表 |
| | | fileList.value = [] |
| | | uploadedFiles.value = [] |
| | | // 重置表单数据 |
| | | formData.value = dialogMode.value === 'add' ? initForm() : row |
| | | // 重置反馈表单数据 |
| | | feedbackFormData.value = initFeedbackForm() |
| | | // 重置申请弹框数据 |
| | | applyFormData.value.applyTargetDeptId = '' |
| | | |
| | | if (dialogMode.value !== 'add') { |
| | | // 如果是编辑,设置ID并加载详情 |
| | | if (row && row.id) { |
| | | formData.value.id = row.id |
| | | } |
| | | await loadDetail() |
| | | } |
| | | } |
| | | |
| | | defineExpose({ open }) |
| | |
| | | .detail-container1 { |
| | | display: flex; |
| | | flex-direction: column; |
| | | height: 100% !important; |
| | | } |
| | | .upload-container { |
| | | width: 100%; |
| | | .el-upload__tip { |
| | | display: inline; |
| | | } |
| | | } |
| | | .label { |
| | | width: 120px !important; |