feat:调整

张含笑

2026-01-21 36f16b199e5a841ae18ccff09681ff749997fcc6

feat:调整

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

@@ -420,8 +420,8 @@
.detail-container {
    padding: 20px;
    display: flex;
    align-items: flex-start;
    gap: 30px;
    align-items: stretch;
}

/* 左侧步骤条 */

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

@@ -1,19 +1,14 @@
<template>
  <div class="audit-record-container">
    <div class="label">审批记录</div>
    <el-steps :active="activeStep" direction="vertical" align-center>
      <el-step v-for="(step, index) in displayedSteps" :key="step.status" :title="step.title">
        <template #description>
          <div class="step-person">{{ step.person }}</div>
          <div class="step-time">{{ step.time }}</div>
        </template>
      </el-step>
    <el-steps direction="vertical" :active="displayedSteps.length">
      <el-step v-for="step in displayedSteps" :key="step.status" :title="step.title" :description="`${step.person || ''}\n${step.time || ''}`" />
    </el-steps>
  </div>
</template>

<script setup>
import { ref, watch, computed } from 'vue'
import { ref, watch } from 'vue'
import { gdSupplyDemandAuditListApi } from '@/views/orderView/orderDataManage/supplyAdd/supplyAddApi'

const props = defineProps({
@@ -25,63 +20,8 @@
const detailDemandStatus = inject('detailDemandStatus')
const reasonForRejection = inject('reasonForRejection')

// 所有可能的步骤配置
const allStepConfigs = ref([
  { title: '需求申请', status: '0', person: '', time: '' },
  { title: '审核通过', status: '1', person: '', time: '' },
  { title: '拒绝申请', status: '2', person: '', time: '' }
])

// 步骤条数据
const stepResponse = ref([])

// 当前激活步骤
const activeStep = ref(0)

// 计算要显示的步骤
const displayedSteps = computed(() => {
  // 创建一个映射，将状态映射到审核记录
  const statusToRecord = {};
  stepResponse.value.forEach(record => {
    statusToRecord[record.auditStatus] = record;
  });
  
  // 根据审核记录筛选并构建要显示的步骤
  return allStepConfigs.value.filter(stepConfig => {
    // 如果是需求申请步骤，始终显示
    if (stepConfig.status === '0') {
      return true;
    }
    // 其他步骤只有在有对应状态的审核记录时才显示
    return statusToRecord.hasOwnProperty(stepConfig.status);
  }).map(stepConfig => {
    // 获取对应状态的审核记录
    const record = statusToRecord[stepConfig.status];
    if (record) {
      // 如果有审核记录，使用记录中的信息
      return {
        ...stepConfig,
        person: record.createUser ? `${record.createUser}` : '',
        time: record.createTime ? record.createTime : ''
      };
    }
    // 如果没有审核记录，使用默认信息
    return stepConfig;
  });
})

// 计算当前激活步骤
const calculateCurrentStep = () => {
  if (stepResponse.value.length === 0) {
    return 0;
  }
  
  // 获取最新的审核记录
  const latestRecord = stepResponse.value[stepResponse.value.length - 1];
  // 查找最新状态在显示步骤中的索引
  const stepIndex = displayedSteps.value.findIndex(step => step.status === latestRecord.auditStatus);
  return stepIndex !== -1 ? stepIndex : 0;
}
const displayedSteps = ref([])

// 监听 demandId 变化
watch(() => props.demandId, (newVal) => {
@@ -91,27 +31,55 @@
}, { immediate: true })

// 加载审核记录
async function loadAuditRecords(demandId) {
  try {
    const res = await gdSupplyDemandAuditListApi({ demandId })
function loadAuditRecords(demandId) {
  gdSupplyDemandAuditListApi({ demandId }).then(res => {
    const auditRecords = res?.data?.data ?? []
    
    // 按创建时间排序（最新的在最后）
    stepResponse.value = [...auditRecords].sort((a, b) => new Date(a.createTime) - new Date(b.createTime))
	
    // 查找拒绝原因（auditStatus为2的记录的auditOpinion）
    const rejectedRecord = stepResponse.value.find(record => record.auditStatus === '2')
    reasonForRejection.value = rejectedRecord?.auditOpinion || ''

    // 计算当前激活步骤
    activeStep.value = calculateCurrentStep()
  } catch (error) {
    const sortedRecords = [...auditRecords].sort((a, b) => new Date(a.createTime) - new Date(b.createTime))
    
    // 构建步骤数据
    const steps = []
    
    // 添加需求申请步骤
    steps.push({
      status: '0',
      title: '需求申请',
      person: sortedRecords.find(r => r.auditStatus === '0')?.createUser || '',
      time: sortedRecords.find(r => r.auditStatus === '0')?.createTime || ''
    })
    
    // 添加审核通过步骤（如果有）
    const approvedRecord = sortedRecords.find(r => r.auditStatus === '1')
    if (approvedRecord) {
      steps.push({
        status: '1',
        title: '审核通过',
        person: approvedRecord.createUser || '',
        time: approvedRecord.createTime || ''
      })
    }
    
    // 添加拒绝申请步骤（如果有）
    const rejectedRecord = sortedRecords.find(r => r.auditStatus === '2')
    if (rejectedRecord) {
      steps.push({
        status: '2',
        title: '拒绝申请',
        person: rejectedRecord.createUser || '',
        time: rejectedRecord.createTime || ''
      })
      // 查找拒绝原因
      reasonForRejection.value = rejectedRecord.auditOpinion || ''
    }
    
    displayedSteps.value = steps
  }).catch(error => {
    console.error('加载审核记录失败:', error)
    // 重置步骤数据
    stepResponse.value = []
    activeStep.value = 0
    displayedSteps.value = []
    reasonForRejection.value = ''
  }
  })
}

defineExpose({
@@ -134,24 +102,18 @@
}

:deep(.el-step) {
  margin-bottom: 20px;
  // margin-bottom: 20px;
}

:deep(.el-step__title) {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
}

/* 步骤描述 */
.step-person {
:deep(.el-step__description) {
  font-size: 13px;
  color: #333;
  margin-bottom: 4px;
}

.step-time {
  font-size: 12px;
  color: #909399;
  color: #666;
  white-space: pre-wrap;
  line-height: 1.4;
}
</style>