From 66c173a50b123742343c0663a03f741db4291881 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期一, 09 十月 2023 09:33:48 +0800
Subject: [PATCH] feat: 步骤条圆点前颜色与当前状态同步

---
 src/views/visualization.vue |   44 ++++++++++++++++++++++++++++++++++++--------
 1 files changed, 36 insertions(+), 8 deletions(-)

diff --git a/src/views/visualization.vue b/src/views/visualization.vue
index c0e7cc3..8428728 100644
--- a/src/views/visualization.vue
+++ b/src/views/visualization.vue
@@ -90,7 +90,7 @@
             </span> -->
           </div>
           <div class="gongx">
-          <el-steps v-if="taskData.AllProcedures" :active="taskData.CurrentProcedureIndex?taskData.CurrentProcedureIndex:0"  finish-status="success" class="steps">
+          <el-steps v-if="taskData.AllProcedures" :active="taskData.CurrentProcedureIndex ?? 0"  finish-status="success" class="steps">
             <el-step icon="" :title="item" v-for="(item,index) in taskData.AllProcedures" :key="index"></el-step>
           </el-steps>
         </div>
@@ -1373,13 +1373,6 @@
       }
     }
   }
-  .el-step__head.is-process{
-    color: #00cc66 !important;
-    border-color:#00cc66;
-  }
-  .el-step__title.is-process{
-    color: #00cc66 !important;
-  }
   .el-step__head.is-wait{
     color:#fff;
     border-color:#fff;
@@ -1387,6 +1380,41 @@
   .el-step__title.is-wait{
     color:#fff;
   }
+
+  // 浣挎楠ゆ潯鑺傜偣鐘舵�佹垚鍔熸椂,鍓嶉潰鐨勭嚎鍚屾鏇存敼棰滆壊
+  .steps{
+    /* 杩涜涓姸鎬侊細鍦堢嚎 */
+    &  .el-step__head.is-process {
+      color: #00cc66;
+      border-color: #00cc66;
+    }
+    /* 杩涜涓姸鎬侊細鍦堝唴 */
+    &  .el-step__head.is-process > .el-step__icon {
+      background: #00cc66;
+      color: #00cc66;
+    }
+    /* 杩涜涓姸鎬侊細title锛堟枃瀛楋級 */
+    &  .el-step__title.is-process {
+      color: #00cc66;
+    }
+
+    /* 瀹屾垚鐘舵�侊細鍦堢嚎 */
+    &  .el-step__head.is-success {
+      color: #00cc66;
+      border-color: #00cc66;
+    }
+    /* 瀹屾垚鐘舵�侊細title锛堟枃瀛楋級 */
+    &  .el-step__title.is-success {
+      color: #00cc66;
+    }
+    /* 瀹屾垚鐘舵�侊細line
+     * 鎻忚堪锛氱涓�姝ュ畬鎴愶紝绗簩姝ヨ繘琛屾椂锛屼箣闂寸殑杩涘害鏉℃湁棰滆壊
+     */
+    &  .el-step__head.is-success > .el-step__line > .el-step__line-inner {
+      width: 100% !important;
+      border-width: 1px !important;
+    }
+  }
 }
 .set-title {
   cursor: pointer;

--
Gitblit v1.8.0