From 980aeb1bb0d2e81784340fa9976678b5da6effba Mon Sep 17 00:00:00 2001
From: jhd <1684074631@qq.com>
Date: Wed, 1 Jul 2026 14:37:37 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E6=80=BB=E8=A7=88=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=9B=BE=E6=A0=87=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/views/rm/project/index.vue | 78 +++++++++++++++----------
 1 file changed, 48 insertions(+), 30 deletions(-)

diff --git a/ruoyi-ui/src/views/rm/project/index.vue b/ruoyi-ui/src/views/rm/project/index.vue
index 76e4f1a..62b28be 100644
--- a/ruoyi-ui/src/views/rm/project/index.vue
+++ b/ruoyi-ui/src/views/rm/project/index.vue
@@ -73,7 +73,7 @@
       <div class="progress-steps">
         <template v-for="(stage, index) in stages">
           <div :key="stage.key" :class="['progress-step', stageClass(stage.key)]">
-            <div class="circle">{{ stageIcon(stage.key) }}</div>
+            <div class="circle"><i :class="stage.iconClass" /></div>
             <div class="step-label">{{ stage.label }}</div>
           </div>
           <div :key="'line-'+index" :class="['progress-line', stageLineClass(stage.key)]" v-if="index < stages.length - 1" />
@@ -85,11 +85,13 @@
     <div style="font-size:12px;font-weight:600;margin-bottom:8px;"> 各阶段概览</div>
     <div class="dashboard-grid">
       <div v-for="stage in stages" :key="stage.key" :class="['stat-card', getStageInfo(stage.key).locked ? 'stage-locked' : '']" style="cursor:pointer;" @click="switchStage(stage.key)">
-        <div class="label">
-          {{ stage.icon }} {{ stage.label }}
+        <div class="label" :style="{ borderLeftColor: stage.color }">
+          <i :class="stage.iconClass" :style="{ color: stage.color }"></i>
+          {{ stage.label }}
           <el-tag v-if="getStageInfo(stage.key).confirmed && getStageInfo(stage.key).confirmType === 'override'" size="mini" type="warning" style="margin-left:4px;">已放行</el-tag>
           <el-tag v-else-if="getStageInfo(stage.key).confirmed" size="mini" type="success" style="margin-left:4px;">已确认</el-tag>
           <el-tag v-if="getStageInfo(stage.key).locked" size="mini" type="info" style="margin-left:4px;">锁定</el-tag>
+          <el-tag v-if="taskCount(stage.key) > 0" size="mini" type="primary" style="margin-left:4px;">任务{{ taskCount(stage.key) }}</el-tag>
         </div>
         <div class="value" style="font-size:14px;">{{ stageStatusText(stage.key) }}</div>
         <div class="sub">
@@ -169,23 +171,24 @@ import { selectContractByProjectId } from '@/api/oa/oaContract'
 import { getStageStatus } from '@/api/rm/dashboard'
 import { getProject as getRmProject } from '@/api/rm/project'
 import { confirmStage, overrideStage } from '@/api/rm/stageConfirm'
+import { taskCountByStage } from '@/api/oa/task'
 
 const OVERRIDE_STAGES = ['procurement', 'manufacturing']
 
 const STAGES = [
-  { key: 'budget', label: '项目预算', icon: '💰' },
-  { key: 'tech_plan', label: '技术方案', icon: '📋' },
-  { key: 'layout', label: '布局图', icon: '🗺️' },
-  { key: 'tech_review', label: '技术审查', icon: '🔍' },
-  { key: 'drawing_design', label: '图纸设计', icon: '📐' },
-  { key: 'drawing_review', label: '图纸审查', icon: '✏️' },
-  { key: 'procurement', label: '采购管理', icon: '🛒' },
-  { key: 'manufacturing', label: '制造进度', icon: '🏭' },
-  { key: 'manuals', label: '说明书', icon: '📖' },
-  { key: 'install_prep', label: '安装准备', icon: '🛠️' },
-  { key: 'install_feedback', label: '问题反馈', icon: '💬' },
-  { key: 'acceptance', label: '安装验收', icon: '✅' },
-  { key: 'hot_commissioning', label: '热负荷试车', icon: '🔥' }
+  { key: 'budget', label: '项目预算', iconClass: 'el-icon-coin', color: '#2176ae' },
+  { key: 'tech_plan', label: '技术方案', iconClass: 'el-icon-document', color: '#1abc9c' },
+  { key: 'layout', label: '布局图', iconClass: 'el-icon-map-location', color: '#3498db' },
+  { key: 'tech_review', label: '技术审查', iconClass: 'el-icon-search', color: '#2980b9' },
+  { key: 'drawing_design', label: '图纸设计', iconClass: 'el-icon-edit-outline', color: '#16a085' },
+  { key: 'drawing_review', label: '图纸审查', iconClass: 'el-icon-view', color: '#27ae60' },
+  { key: 'procurement', label: '采购管理', iconClass: 'el-icon-s-goods', color: '#e67e22' },
+  { key: 'manufacturing', label: '制造进度', iconClass: 'el-icon-setting', color: '#d35400' },
+  { key: 'manuals', label: '说明书', iconClass: 'el-icon-notebook-1', color: '#9b59b6' },
+  { key: 'install_prep', label: '安装准备', iconClass: 'el-icon-s-tools', color: '#e74c3c' },
+  { key: 'install_feedback', label: '问题反馈', iconClass: 'el-icon-chat-line-square', color: '#f39c12' },
+  { key: 'acceptance', label: '安装验收', iconClass: 'el-icon-circle-check', color: '#2ecc71' },
+  { key: 'hot_commissioning', label: '热负荷试车', iconClass: 'el-icon-s-promotion', color: '#e74c3c' }
 ]
 
 export default {
@@ -207,7 +210,8 @@ export default {
       currentProjectId: null,
       projectList: [],
       isCreating: false,
-      overrideStages: OVERRIDE_STAGES
+      overrideStages: OVERRIDE_STAGES,
+      taskCountMap: {}
     }
   },
   computed: {
@@ -307,6 +311,13 @@ export default {
       getStageStatus(this.currentProjectId).then(res => {
         this.stageStatus = res.data || {}
       })
+      taskCountByStage(this.currentProjectId).then(res => {
+        const map = {}
+        ;(res.data || []).forEach(item => {
+          map[item.stageCode] = item.taskCount
+        })
+        this.taskCountMap = map
+      })
     },
     createProject() {
       this.isCreating = true
@@ -369,10 +380,6 @@ export default {
       const st = this.stageStatus[key]
       return st && st.status === 'done' ? 'done' : ''
     },
-    stageIcon(key) {
-      const st = this.stageStatus[key]
-      return st && st.status === 'done' ? '✓' : (STAGES.findIndex(s => s.key === key) + 1)
-    },
     stageStatusText(key) {
       const st = this.stageStatus[key]
       const map = { done: '已完成', progress: '进行中', pending: '未开始' }
@@ -436,6 +443,9 @@ export default {
     },
     getStageInfo(key) {
       return this.stageStatus[key] || {}
+    },
+    taskCount(key) {
+      return this.taskCountMap[key] || 0
     }
   }
 }
@@ -468,7 +478,13 @@ export default {
   font-size: 11px;
   color: #666;
   margin-bottom: 4px;
+  border-left: 3px solid transparent;
+  padding-left: 8px;
+  display: flex;
+  align-items: center;
+  gap: 4px;
 }
+.stat-card .label i { font-size: 14px; }
 .stat-card .value {
   font-size: 20px;
   font-weight: 700;
@@ -514,21 +530,21 @@ export default {
   position: relative;
 }
 .progress-step .circle {
-  width: 24px;
-  height: 24px;
+  width: 28px;
+  height: 28px;
   border-radius: 50%;
-  background: #ddd;
-  color: #fff;
+  background: #e8eaed;
+  color: #aaa;
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 10px;
-  font-weight: 600;
+  font-size: 14px;
   flex-shrink: 0;
   z-index: 1;
+  transition: all 0.2s;
 }
-.progress-step.done .circle { background: #27ae60; }
-.progress-step.active .circle { background: #2176ae; }
+.progress-step.done .circle { background: #27ae60; color: #fff; }
+.progress-step.active .circle { background: #2176ae; color: #fff; box-shadow: 0 0 0 3px rgba(33,118,174,0.2); }
 .progress-step .step-label {
   font-size: 9px;
   color: #666;
@@ -541,11 +557,13 @@ export default {
 }
 .progress-line {
   height: 2px;
-  background: #ddd;
+  background: #e8eaed;
   flex: 1;
   min-width: 10px;
+  transition: background 0.3s;
 }
 .progress-line.done { background: #27ae60; }
+.progress-step:hover .circle { transform: scale(1.1); }
 
 .dialog-footer {
   text-align: right;