From 3d3b89a84fd8c3aa524c013afe56c6949fc3a874 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期日, 08 十月 2023 16:19:45 +0800
Subject: [PATCH] feat: 工序添加工艺参数展示

---
 src/views/visualization.vue |   78 ++++++++++++++++++++++++++++----------
 1 files changed, 57 insertions(+), 21 deletions(-)

diff --git a/src/views/visualization.vue b/src/views/visualization.vue
index 9599ef7..a74ba65 100644
--- a/src/views/visualization.vue
+++ b/src/views/visualization.vue
@@ -271,11 +271,12 @@
                   v-for="(item, index) in taskData.procedureList"
                 >
                   <div
-                    class="card"
                     :key="index2"
                     v-for="(list, index2) in item"
                   >
-                    <template v-if="list.name == '宸ュ簭'">
+                    <div
+                      class="card"
+                      v-if="list.name == '宸ュ簭'">
                       <div class="card_content">
                         <div class="card_contentLeft color_blue font_dian">
                           <!-- {{ list.deviceName }} -->
@@ -333,24 +334,34 @@
                         <!-- <span class="card-top-r-t">瀹屾垚杩涘害锛�50%</span>
                           <span class="card-top-r-b">12鏈�28鏃� 08:24</span> -->
                       </div>
-                    </template>
-                    <template v-else>
-                      <!-- <div class="card_content">
-
-                      </div> -->
-                      <div :class="(activeName==1||activeName == 3)?'card_top-4 font_size_20px':'card_top-4'">
-                        <div>宸ヨ壓缂栧彿锛�<div >{{ list.number }}</div></div>
-                        <!-- <div
-                          style="
-                            font-size: 14px;
-                            color: #cfcfcf;
-                            line-height: 20px;
-                          "
+                    </div>
+                    <div v-else class="process-params">
+                      <div class="process-params-title">
+                        <el-popover
+                          width="200"
+                          :content="list.number"
+                          placement="top-start"
+                          trigger="click"
                         >
-                          宸ヨ壓鐨勫叿浣撲俊鎭鐐瑰嚮鎺у埗鏌ョ湅锛�
-                        </div> -->
+                          <span slot="reference">宸ヨ壓缂栧彿锛歿{ list.number }}</span>
+                        </el-popover>
+
                       </div>
-                    </template>
+                      <div class="process-params-value">
+                        <!-- 宸ヨ壓鍙傛暟-->
+                        {{mergeProcessParams(taskData.Arr)}}
+                      </div>
+
+                      <!-- <div
+                        style="
+                          font-size: 14px;
+                          color: #cfcfcf;
+                          line-height: 20px;
+                        "
+                      >
+                        宸ヨ壓鐨勫叿浣撲俊鎭鐐瑰嚮鎺у埗鏌ョ湅锛�
+                      </div> -->
+                    </div>
                   </div>
                 </el-carousel-item>
               </el-carousel>
@@ -790,6 +801,13 @@
     // }
   },
   methods: {
+    mergeProcessParams(params){
+      if (params?.length){
+        return params.map(ele=> `${ele.Key}: ${ele.Value}`).join(' ')
+      }else{
+        return ''
+      }
+    },
     taskClick(){
       if(this.TaskCount>0){
         // this.getStartArr()
@@ -1038,7 +1056,7 @@
                   this.TasksCopy[i].procedureList[0].push({
                     number: res.data.Number,
                   });
-                  // this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : []
+                  this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : []
                   // this.isFinsh=Number(i)+1
                 }
               });
@@ -1459,8 +1477,7 @@
       overflow-y:auto;
     }
     .el-carousel__item{
-    //  height:auto;
-     min-height:160px;
+      height:auto;
     }
   }
   .bottom-box-btn{
@@ -1969,4 +1986,23 @@
   font-weight: 700 !important;
   font-size: 16px;
 }
+.process-params{
+  margin-top: 10px;
+  border-radius: 5px;
+  overflow: hidden;
+  color: #fff;
+  font-size: 12px;
+  &-title{
+    height: 25px;
+    padding: 0 5px;
+    background-color: #13235a;
+    line-height: 25px;
+  }
+  &-value{
+    background-color: #6b83ff;
+    min-height: 45px;
+    box-sizing: border-box;
+    padding: 12px;
+  }
+}
 </style>

--
Gitblit v1.8.0