feat:权限按钮

张含笑

2026-01-30 6c4bd2467bb6651c6edcf8a9741dcd4e9b1aa6d3

 applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/ApplyViewDialog.vue

@@ -1,5 +1,5 @@
<template>
   <el-dialog class="gd-dialog" :close-on-click-modal="false" v-model="visible" :title="'查看'" @closed="visible = false" destroy-on-close>
   <el-dialog width="80%" class="gd-dialog" :close-on-click-modal="false" v-model="visible" :title="'查看'" @closed="visible = false" destroy-on-close>
      <div class="detail-container">
         <!-- 左侧审批记录 -->
         <div class="detail-left">
@@ -68,8 +68,8 @@
                  </el-row>
            </div>
            <!--            申请中-->
            <div v-if="detailDemandStatus === '1' && !requesterProvider">
               <div class="detail-title">数据上传</div>
            <div v-if="detailDemandStatus === '1' && (permissionList.approvedBtn || permissionList.rejectBtn)">
               <div class="detail-title" :style="{ marginTop:pxToRem(10)}">数据上传</div>
               <div class="upload-container">
                  <el-upload
                  :http-request="handleHttpRequest"
@@ -98,7 +98,7 @@
                  <el-table-column prop="fileSize" label="文件大小" />
                  <el-table-column fixed="right" label="操作" min-width="100">
                     <template #default="scope">
                        <el-button link type="text" @click="downloadFileFromTable(scope.row)">下载</el-button>
                        <el-link  type="primary"  @click="downloadFileFromTable(scope.row)">下载</el-link>
                     </template>
                  </el-table-column>
               </el-table>
@@ -106,16 +106,16 @@
         </div>
      </div>
      <template #footer>
         <template v-if="detailDemandStatus === '1' && !requesterProvider">
            <el-button color="#F2F3F5" :loading="submitting" :disabled="submitting" @click="rejectTheApplication">拒绝申请</el-button>
            <el-button class="" color="#4C34FF" :loading="submitting" :disabled="submitting" @click="approvedByTheReview">审核通过</el-button>
         <template v-if="detailDemandStatus === '1' ">
            <el-button v-if="permissionList.rejectBtn" color="#F2F3F5" :loading="submitting || uploading" :disabled="submitting || uploading" @click="rejectTheApplication">拒绝申请</el-button>
            <el-button v-if="permissionList.approvedBtn" class="" color="#4C34FF" :loading="submitting || uploading" :disabled="submitting || uploading" @click="approvedByTheReview">审核通过</el-button>
         </template>
         <template v-if="detailDemandStatus === '2'">
            <el-button class="" color="#4C34FF" @click="downloadAllFiles">全部下载</el-button>
         </template>
         <template v-if="detailDemandStatus === '3'">
            <el-button class="" color="#4C34FF" @click="visible =false">关闭</el-button>
         </template>
<!--         <template v-if="detailDemandStatus === '3'">-->
<!--            <el-button class="" color="#4C34FF" @click="visible =false">关闭</el-button>-->
<!--         </template>-->
      </template>
   </el-dialog>

@@ -142,7 +142,7 @@
import AuditRecord from '@/views/orderView/orderDataManage/supplyAdd/auditRecord.vue' // 导入新组件
import { useStore } from 'vuex'
const store = useStore()
const requesterProvider = computed(() => store.state.user.userInfo?.role_id === '2014158512610869250')
const permission = computed(() => store.state.user.permission);
const emit = defineEmits(['success'])
const dictObj = inject('dictObj')
const deptTree = inject('deptTree')
@@ -155,8 +155,20 @@
const uploadedFiles = ref([]) // 已上传文件列表
const responseData = ref(null)
const submitting = ref(false) // 提交中状态
const uploading = ref(false) // 文件上传中状态
function validData(value, defaultValue) {
   return value !== undefined ? value : defaultValue
}
const permissionList = computed(() => {
   return {
      addBtn: validData(permission.value.orderData_addDemand, false),
      rejectBtn: validData(permission.value.orderData_rejectApplication, false),
      approvedBtn: validData(permission.value.orderData_approved, false),
   }
})
// 自定义上传请求函数
const handleHttpRequest = async (options) => {
   uploading.value = true
   try {
      // 创建FormData对象
      const formData = new FormData()
@@ -164,7 +176,6 @@

      // 调用导入的API函数
      const response = await putFileAttachApi(formData)
      console.log('response',response)
      if (response.data && response.data.success) {
         // 调用上传成功的回调
         options.onSuccess(response)
@@ -176,6 +187,8 @@
      // 调用上传失败的回调
      options.onError(error)
      console.error('文件上传失败:', error)
   } finally {
      uploading.value = false
   }
}
// 拒绝申请弹框控制
@@ -183,10 +196,7 @@
const tableData = ref([]) // 附件表格数据
// 文件移除
const handleFileRemove = (file, fileList) => {
   // 从已上传文件列表中移除对应文件
   if (file.response && file.response.attachId) {
      uploadedFiles.value = uploadedFiles.value.filter(item => item.attachId !== file.response.attachId)
   }
uploadedFiles.value = fileList
   // 清空响应数据
   if (responseData.value && responseData.value.attachId === file.response?.attachId) {
      responseData.value = null
@@ -204,11 +214,11 @@
   }

   // 文件大小限制，这里限制为100MB
   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
}
@@ -218,7 +228,6 @@
   // 添加更严格的检查，确保response不是undefined
   if (response && response?.data && response?.data?.success) {
      const fileData = response.data.data
      console.log('成功数据', fileData)
      responseData.value = fileData
      // 添加到已上传文件列表
      uploadedFiles.value.push({
@@ -237,47 +246,52 @@
   ElMessage.error(error?.message || '文件上传失败，请重试')
}

// 查看文件
const viewFile = file => {
   if (file.link) {
      window.open(file.link, '_blank')
   } else {
      ElMessage.warning('文件链接无效')
   }
}
// 从表格下载文件 - 使用 fetch API
const downloadFileFromTable = async (file) => {
  if (!file.fileUrl) {
    ElMessage.warning('文件链接无效')
    return
  }

// 下载文件
const downloadFile = file => {
   if (file.link) {
      // 创建一个隐藏的a标签来触发下载
      const a = document.createElement('a')
      a.href = file.link
      a.download = file.originalName || file.name
      document.body.appendChild(a)
      a.click()
      document.body.removeChild(a)
   } else {
      ElMessage.warning('文件链接无效')
   }
}

// 从表格下载文件
const downloadFileFromTable = file => {
   if (file.fileUrl) {
      // 创建一个隐藏的a标签来触发下载
      const a = document.createElement('a')
      a.href = file.fileUrl
      a.download = file.name || 'attachment'
      document.body.appendChild(a)
      a.click()
      document.body.removeChild(a)
   } else {
      ElMessage.warning('文件链接无效')
   }
  try { 
    const response = await fetch(file.fileUrl)
    const blob = await response.blob()
    const url = window.URL.createObjectURL(blob)
    const a = document.createElement('a')
    a.href = url
    
    // 获取原始文件名，处理中文和特殊字符
    const originalName = file.fileOriginalName || 'download-file.zip'
    // 确保文件名有正确的扩展名
    let fileName = originalName
    if (!fileName.includes('.')) {
      // 从 Content-Type 推断扩展名
      const contentType = response.headers.get('content-type')
      if (contentType === 'application/zip') {
        fileName += '.zip'
      } else if (contentType === 'application/x-rar-compressed') {
        fileName += '.rar'
      }
    }
    
    a.download = fileName
    a.style.display = 'none'
    document.body.appendChild(a)
    a.click()
    
    // 清理
    setTimeout(() => {
      window.URL.revokeObjectURL(url)
      document.body.removeChild(a)
    }, 100)
    
  } catch (error) {
    console.error('下载失败:', error)
  }
}

// 下载所有文件
const downloadAllFiles = () => {
const downloadAllFiles =async () => {
   if (!tableData.value || tableData.value.length === 0) {
      ElMessage.warning('没有可下载的文件')
      return
@@ -289,22 +303,56 @@
      ElMessage.warning('所有文件链接均无效')
      return
   }

   ElMessage.success(`开始下载${validFiles.length}个文件`)

   // 依次下载每个文件（添加延迟以避免浏览器限制）
   validFiles.forEach((file, index) => {
      setTimeout(() => {
         if (file.fileUrl) {
            const a = document.createElement('a')
            a.href = file.fileUrl
            a.download = file.name || `attachment_${index + 1}`
            document.body.appendChild(a)
            a.click()
            document.body.removeChild(a)
         }
      }, index * 300) // 300ms delay between downloads
   })
  // 顺序下载每个文件
  for (let i = 0; i < validFiles.length; i++) {
    const file = validFiles[i]
    
    try {
      const response = await fetch(file.fileUrl)
      const blob = await response.blob()
      const url = window.URL.createObjectURL(blob)
      const a = document.createElement('a')
      a.href = url
      
      // 设置文件名，优先使用原始文件名
      let fileName = file.fileOriginalName || `附件_${i + 1}`
      
      // 确保文件名有扩展名
      if (!fileName.includes('.')) {
        const contentType = response.headers.get('content-type')
        if (contentType === 'application/zip') {
          fileName += '.zip'
        } else if (contentType === 'application/x-rar-compressed') {
          fileName += '.rar'
        } else if (contentType === 'application/x-7z-compressed') {
          fileName += '.7z'
        } 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 < validFiles.length - 1) {
        await new Promise(resolve => setTimeout(resolve, 500))
      }
      
    } catch (error) {
      console.error(`文件下载失败: ${file.fileOriginalName || '未知文件'}`, error)
      // 继续下载下一个文件
    }
  }
  
}

// 根据部门ID获取部门名称
@@ -378,9 +426,6 @@

// 拒绝申请
const rejectTheApplication = () => {
   if (uploadedFiles.value.length === 0) {
      return ElMessage.warning('请上传数据')
   }
   // 打开拒绝申请弹框
   rejectionDialogVisible.value = true
}
@@ -410,7 +455,7 @@
const approvedByTheReview = () => {
   if (uploadedFiles.value.length === 0) {
      return ElMessage.warning('请上传数据')
   }
   }	
   // 从 uploadedFiles.value 中提取所有 attachId
   const id = uploadedFiles.value.map(file => file.attachId)
   submitting.value = true
@@ -482,6 +527,10 @@
   }
}

.el-upload__tip {
   display: inline;
}



/* 上传按钮样式 */
@@ -492,4 +541,5 @@
:deep(.el-upload-list) {
   margin-top: 10px;
}

</style>