吉安感知网项目-前端
张含笑
2026-01-20 ea8805b6e0ec8f6de7bf997d019b56c42055d34d
applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/ApplyViewDialog.vue
@@ -1,8 +1,9 @@
<template>
   <el-dialog class="gd-dialog" v-model="visible" :title="'查看申请'" @closed="visible = false" destroy-on-close>
      <div class="detail-container">
         <!-- 左侧步骤条 -->
         <!-- 左侧审批记录 -->
         <div class="detail-left">
            <div class="label">审批记录</div>
            <el-steps :active="activeStep" direction="vertical" align-center>
               <el-step v-for="(step, index) in steps" :key="index" :title="step.title">
                  <template #description>
@@ -134,13 +135,13 @@
</template>
<script setup>
import { ref, inject } from 'vue'
import { getDictLabel } from '@ztzf/utils'
import {
   gdSupplyDemandDetailApi,
   putFileAttachApi,
   gdSupplyDemandAuditPassApi,
   gdSupplyDemandAuditRejectApi,
   gdSupplyDemandAuditListApi
} from '@/views/orderView/orderDataManage/supplyAdd/supplyAddApi'
import { ElMessage } from 'element-plus'
import reasonForRejectionDialog from './reasonForRejectionDialog.vue'
@@ -160,8 +161,8 @@
const rejectionDialogVisible = ref(false) // 拒绝申请弹框显隐
// 步骤条数据
const steps = ref([
   { title: '需求申请', person: '张三', time: '2025-03-31 12:23:30' },
   { title: '审核通过', person: '', time: '' },
   { title: '需求申请', person: '', time: '' },
   { title: '审核通过', person: '', time: '' }
])
// 当前激活步骤
const activeStep = ref(0)
@@ -322,7 +323,95 @@
      data.responsibleDeptName = getDeptNameById(data.responsibleDeptId, deptTree.value)
   }
   formData.value = data
   // 加载审核记录
   await loadAuditRecords(id)
}
// 加载审核记录
async function loadAuditRecords(demandId) {
   try {
      const res = await gdSupplyDemandAuditListApi({ demandId })
      const auditRecords = res?.data?.data ?? []
      // 处理审核记录为步骤格式
      processAuditRecords(auditRecords)
   } catch (error) {
      console.error('加载审核记录失败:', error)
      ElMessage.error('加载审核记录失败,请重试')
      // 保持默认步骤,不做清空
      activeStep.value = 0
   }
}
// 处理审核记录为步骤格式
function processAuditRecords(records) {
   // 重置为默认步骤结构
   steps.value = [
      { title: '需求申请', person: '', time: '' },
      { title: '审核通过', person: '', time: '' }
   ]
   if (!records || records.length === 0) {
      // 没有审核记录,保持默认步骤
      activeStep.value = 0
      return
   }
   // 按创建时间排序(最新的在最后)
   const sortedRecords = [...records].sort((a, b) => new Date(a.createTime) - new Date(b.createTime))
   // 处理需求申请步骤(第一个步骤)
   const demandRecord = sortedRecords.find(record => record.auditStatus === '0') || sortedRecords[0]
   if (demandRecord) {
      steps.value[0] = {
         title: '需求申请',
         person: demandRecord.createUser ? `${demandRecord.createUser}` : '',
         time: demandRecord.createTime ? demandRecord.createTime : ''
      }
   }
   // 处理审核步骤(第二个步骤)
   const latestRecord = sortedRecords[sortedRecords.length - 1]
   if (latestRecord) {
      // 根据最新审核结果设置标题
      let auditTitle = '审核通过'
      if (latestRecord.auditStatus === '2') {
         auditTitle = '审核驳回'
         // 更新第二个步骤的标题为审核驳回
         steps.value[1].title = auditTitle
      }
      // 添加审核意见(如果有)
      if (latestRecord.auditOpinion) {
         steps.value[1].title += ` - ${latestRecord.auditOpinion}`
      }
      // 更新审核步骤的信息
      steps.value[1].person = latestRecord.createUser ? `${latestRecord.createUser}` : ''
      steps.value[1].time = latestRecord.createTime ? latestRecord.createTime : ''
      // 根据最新审核结果设置activeStep
      switch (latestRecord.auditStatus) {
         case '0':
            // 审核中,高亮第一个步骤
            activeStep.value = 0
            break
         case '1':
            // 审核通过,高亮第二个步骤
            activeStep.value = 1
            break
         case '2':
            // 审核驳回,高亮第二个步骤
            activeStep.value = 1
            break
         default:
            // 默认高亮第一个步骤
            activeStep.value = 0
      }
   }
}
// 拒绝申请
const rejectTheApplication = () => {
@@ -434,7 +523,7 @@
}
:deep(.el-step) {
   margin-bottom: 20px;
   margin-bottom: 90px;
}
:deep(.el-step__title) {