吉安感知网项目-前端
张含笑
2026-01-20 766c7dca5967f7c29d92e2c5d4dfba5c06a5d56a
applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/ApplyViewDialog.vue
@@ -1,19 +1,19 @@
<template>
   <el-dialog class="gd-dialog" v-model="visible" :title="'查看申请'" @closed="visible = false" destroy-on-close>
      <div class="detail-container">
         <!-- 左侧步骤条 -->
         <!-- 左侧审批记录 -->
         <div class="detail-left">
            <el-steps :active="activeStep" direction="vertical" align-center>
               <el-step v-for="(step, index) in steps" :key="index" :title="step.title">
                  <template #description>
                     <div class="step-person">{{ step.person }}</div>
                     <div class="step-time">{{ step.time }}</div>
                  </template>
               </el-step>
            </el-steps>
            <AuditRecord :demand-id="demandId" />
         </div>
         <!-- 右侧表单数据 -->
         <div class="detail-right">
            <!--            拒绝申请-->
            <div class="reject-reason-container" v-if="detailDemandStatus === '3'">
               <div class="label">拒绝原因 </div>
               <div class="reject-reason">
                  这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因这是拒绝原因
               </div>
            </div>
            <div>
               <div class="label">需求详情</div>
               <div class="requirementsDetailsBox">
@@ -81,8 +81,9 @@
                  </div>
               </div>
            </div>
            <div>
               <div class="label">数据上传</div>
<!--            申请中-->
            <div v-if="detailDemandStatus === '1'">
               <div class="label">数据上传 </div>
               <div class="upload-container">
                  <el-upload
                     ref="uploadRef"
@@ -134,19 +135,21 @@
</template>
<script setup>
import { ref, inject } from 'vue'
import { getDictLabel } from '@ztzf/utils'
import {
   gdSupplyDemandDetailApi,
   putFileAttachApi,
   gdSupplyDemandAuditPassApi,
   gdSupplyDemandAuditRejectApi,
   gdSupplyDemandAuditRejectApi
} from '@/views/orderView/orderDataManage/supplyAdd/supplyAddApi'
import { ElMessage } from 'element-plus'
import reasonForRejectionDialog from './reasonForRejectionDialog.vue'
import reasonForRejectionDialog from '@/views/orderView/orderDataManage/supplyAdd/reasonForRejectionDialog.vue'
import AuditRecord from '@/views/orderView/orderDataManage/supplyAdd/auditRecord.vue' // 导入新组件
const emit = defineEmits(['success'])
const dictObj = inject('dictObj')
const deptTree = inject('deptTree')
const detailDemandStatus = inject('detailDemandStatus')
const demandId = ref('')
const visible = defineModel() // 弹框显隐
const formData = ref({}) // 表单数据
@@ -158,13 +161,6 @@
const responseData = ref([])
// 拒绝申请弹框控制
const rejectionDialogVisible = ref(false) // 拒绝申请弹框显隐
// 步骤条数据
const steps = ref([
   { title: '需求申请', person: '张三', time: '2025-03-31 12:23:30' },
   { title: '审核通过', person: '', time: '' },
])
// 当前激活步骤
const activeStep = ref(0)
// 文件选择变化
const handleFileChange = (file, fileList) => {
@@ -308,7 +304,6 @@
   if (row?.id) {
      await loadDetail(row.id)
      demandId.value = row.id
      console.log('row.id', demandId.value)
   }
   visible.value = true
}
@@ -336,8 +331,6 @@
// 处理拒绝申请确认
const handleRejectionConfirm = reason => {
   const id = [responseData.value.attachId]
   console.log('demandId.value', demandId.value)
   gdSupplyDemandAuditRejectApi({ attachIds: id, auditOpinion: reason, demandId: demandId.value })
      .then(() => {
         ElMessage.success('拒绝申请成功')
@@ -384,6 +377,12 @@
/* 右侧表单 */
.detail-right {
   width: 75%;
   .reject-reason {
      margin-bottom: 20px;
      background: #F2F3F5;
      border-radius: 2px 2px 2px 2px;
      padding: 15px;
   }
   .requirementsDetailsBox {
      background: #F2F3F5;
      border-radius: 2px 2px 2px 2px;
@@ -426,40 +425,6 @@
      flex: 1;
      text-align: left;
   }
}
/* 步骤条样式 */
:deep(.el-steps) {
   align-items: flex-start;
}
:deep(.el-step) {
   margin-bottom: 20px;
}
:deep(.el-step__title) {
   font-size: 14px;
   font-weight: 500;
   margin-bottom: 8px;
}
/* 步骤描述 */
.step-person {
   font-size: 13px;
   color: #333;
   margin-bottom: 4px;
}
.step-time {
   font-size: 12px;
   color: #909399;
}
/* 表单样式 */
.label {
   font-weight: 500;
   margin-bottom: 8px;
   color: #333;
}
/* 上传容器样式 */