首页

src/pages/modules/homepage/one.vue

@@ -11,10 +11,12 @@
                     <div class="right_wrap">
                       <div v-if="MixMachineList.length > 0" class="machine_wrap hlj_s_wrap">
                         <div v-for="(e,i) in MixMachineList.slice(0, 4)" :key="i" class="sh_machine hlj_s">
-                          <div class="sh_machine yj_info_wrap">
+                          <div class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{e.open_time}}</p>
-                            <p>367</p>
+                              <p><span>BOM：</span>{{e.bom}}</p>
+                              <p><span>产能：</span>{{e.now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <img v-show="e.device_status === 0" src="../../../images/workshop/hlj_s_gray.png" alt="">
@@ -25,9 +27,12 @@
                       </div>
                       <div v-if="MixMachineList.length > 0" class="machine_wrap hlj_wrap">
                         <div v-for="(e,i) in MixMachineList.slice(4)" :key="i"  class="sh_machine hlj">
-                          <div class="sh_machine yj_info_wrap">
+                          <div class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1&nbsp;&nbsp;367</p>
+                              <p><span>时间：</span>{{e.open_time}}</p>
+                              <p><span>BOM：</span>{{e.bom}}</p>
+                              <p><span>产能：</span>{{e.now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <img v-show="e.device_status === 0" src="../../../images/workshop/hlj_gray.png" alt="">
@@ -84,10 +89,12 @@
                       </div>
                       <div @click="jumpTakeShape">
                         <div class="machine_wrap yj_wrap_1">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[0].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[0].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[0].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine weilan">
@@ -103,11 +110,17 @@
                             <img v-show="PressMachineList[0].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
                           </div>
                           <div class="sh_machine wzm"></div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[0].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[0].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[0].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[0].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[1].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[1].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[1].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[1].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                           <div class="sh_machine robot">
                             <img src="../../../images/workshop/robot_2500_green.png" alt="">
@@ -119,10 +132,12 @@
 
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_2">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[1].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[1].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[1].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine weilan">
@@ -138,11 +153,17 @@
                             <img v-show="PressMachineList[1].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
                           </div>
                           <div class="sh_machine wzm"></div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[2].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[2].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[2].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[2].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[3].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[3].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[3].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[3].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                           <div class="sh_machine robot">
                             <img src="../../../images/workshop/robot_2500_green.png" alt="">
@@ -151,16 +172,20 @@
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_3">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[2].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[2].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[2].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
-                          <div class="sh_machine yj_info_wrap yj_info_wrap_1">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[3].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[3].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[3].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine blj_1">
@@ -193,33 +218,49 @@
                           <div class="sh_machine lmyzj">
                             <img src="../../../images/workshop/lmyzj_630.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[4].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[4].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[4].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[4].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[5].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[5].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[5].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[5].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_3">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[6].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[6].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[6].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[6].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_4">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[7].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[7].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[7].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[7].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                           <div class="sh_machine robot">
                             <img src="../../../images/workshop/robot_2500_green.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[4].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[4].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[4].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
-                          <div class="sh_machine yj_info_wrap yj_info_wrap_1">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[5].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[5].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[5].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine blj_1">
@@ -237,24 +278,38 @@
                             <img v-show="PressMachineList[5].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
                             <img v-show="PressMachineList[5].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[8].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[8].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[8].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[8].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[9].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[9].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[9].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[9].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_3">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[10].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[10].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[10].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[10].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_4">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[11].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[11].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[11].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[11].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p>{{PressMachineList[6].open_time}}</p>
-                            <p>367</p>
+                              <p>{{PressMachineList[6].material_code}}</p>
+                              <p>{{PressMachineList[6].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine blj_1">
@@ -269,11 +324,17 @@
                           <div class="sh_machine weilan">
                             <img src="../../../images/workshop/weilan_6.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[12].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[12].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[12].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[12].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[13].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[13].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[13].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[13].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                           <div class="sh_machine jcpmj">
                             <img src="../../../images/workshop/jcpmj.png" alt="">
@@ -283,16 +344,20 @@
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8">
-                          <div class="sh_machine yj_info_wrap">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[7].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[7].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[7].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
-                          <div class="sh_machine yj_info_wrap yj_info_wrap_1">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[8].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[8].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[8].now_capacity}}</p>
+                            </div>
                             <div class="bg_line"></div>
                           </div>
                           <div class="sh_machine blj_1 blj_2">
@@ -310,17 +375,29 @@
                             <img v-show="PressMachineList[8].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
                             <img v-show="PressMachineList[8].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[14].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[14].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[14].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[14].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_2">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[15].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[15].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[15].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[15].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_3">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[16].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[16].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[16].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[16].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_4">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[17].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[17].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[17].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[17].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_17">
@@ -357,11 +434,13 @@
                           </div>
                         </div>
                         <div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8 yj_wrap_10">
-                          <div class="sh_machine yj_info_wrap yj_info_wrap_1">
+                          <div v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
                             <div class="bg_line"></div>
-                            <p>2023-6-10</p>
+                            <div class="yj_info">
-                            <p>成品1</p>
+                              <p><span>时间：</span>{{PressMachineList[9].open_time}}</p>
-                            <p>367</p>
+                              <p><span>物料：</span>{{PressMachineList[9].material_code}}</p>
+                              <p><span>产能：</span>{{PressMachineList[9].now_capacity}}</p>
+                            </div>
                           </div>
                           <div class="sh_machine cyj_1">
                             <img src="../../../images/workshop/yj_630_gray.png" alt="">
@@ -372,17 +451,28 @@
                             <img v-show="PressMachineList[9].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
                             <img v-show="PressMachineList[9].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_3">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[19].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[19].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[19].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[19].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1 kongtuopan_4">
+                          <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img v-show="StackingPositionList[18].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="StackingPositionList[18].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="StackingPositionList[18].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="StackingPositionList[18].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                         </div>
                       </div>
-                      <div class="machine_wrap lz_wrap_4">
+                      <div class="machine_wrap kl_wrap_1">
                         <div v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i" class="lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
-                          <img src="../../../images/workshop/lz.png" alt="">
+                          <img src="../../../images/workshop/hj.png" alt="">
+                        </div>
+                      </div>
+                      <div class="machine_wrap kl_wrap_1 kl_wrap_2">
+                        <div v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i" class="lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
+                          <img src="../../../images/workshop/hj.png" alt="">
                         </div>
                       </div>
                       <div class="machine_wrap mtp_wrap_1">
@@ -446,7 +536,8 @@ export default {
       PressMachineList: [], // 压机数据
       MixMachineList: [], // 混料机数据
       MixBlankingList: [], // 混料机下料位
-      TrappedShelfList: [] // 困料位料盅
+      TrappedShelfList: [], // 困料位料盅
+      StackingPositionList: [] // 压制码垛数据信息
     }
   },
   mounted () {
@@ -472,6 +563,7 @@ export default {
         this.MixMachineList = [...res.result.MixMachineList]
         this.MixBlankingList = [...res.result.MixBlankingList]
         this.TrappedShelfList = [...res.result.TrappedShelfList]
+        this.StackingPositionList = [...res.result.StackingPositionList]
         this.setEchart1()
         this.setEchart2()
         this.setEchart3()
@@ -988,25 +1080,35 @@ export default {
 .hlj_s_wrap
   width 4%
   height 85.5%
-  top 9%
+  top 5%
-  left 15%
+  left 17%
   .hlj_s
     height 7%
     .yj_info_wrap
-      width: 210%;
+      position absolute
-      top: -17%
+      top -17%
-      left: -270%;
+      left -356%
-      padding: 5px
+      z-index 0
-      _bis('../../../images/workshop/txtbg.png')
+      width 355%
-      p
+      _fj(row)
-        _font(14px, 16px, #fff,,right)
+      .yj_info
+        width 96%
+        height 52px
+        padding 2px 5px
+        background-image linear-gradient(to right, #067272, transparent)
+        border 1px solid #00ffff
+        border-radius 5px
+        overflow hidden
+        p
+          _font(12px, 14px, #00ffff,,left)
+          border-bottom 0.5px solid #067272
+          span
+            color #fff
+          &:last-child
+            border none
       .bg_line
-        position absolute
+        _wh(4%, 1px)
-        _wh(67%, 2px)
         background-color #03fcfd
-        right -100%
-        top 50%
-        transform translate(-50%)
     &:nth-child(2)
       top 9%
     &:nth-child(3)
@@ -1016,52 +1118,62 @@ export default {
 .hlj_wrap
   width 4%
   height 66.5%
-  top 44%
+  top 39%
-  left 15%
+  left 17%
   .hlj
     height 7%
     .yj_info_wrap
-      width: 210%;
+      position absolute
-      top: -2%
+      top -22%
-      left: -270%;
+      left -356%
-      padding: 5px
+      z-index 0
-      _bis('../../../images/workshop/txtbg.png')
+      width 355%
-      p
+      _fj(row)
-        _font(14px, 16px, #fff,,right)
+      .yj_info
+        width 96%
+        height 52px
+        padding 2px 5px
+        background-image linear-gradient(to right, #067272, transparent)
+        border 1px solid #00ffff
+        border-radius 5px
+        overflow hidden
+        p
+          _font(12px, 14px, #00ffff,,left)
+          border-bottom 0.5px solid #067272
+          span
+            color #fff
+          &:last-child
+            border none
       .bg_line
-        position absolute
+        _wh(4%, 1px)
-        _wh(67%, 2px)
         background-color #03fcfd
-        right -100%
-        top 50%
-        transform translate(-50%)
     &:nth-child(2)
-      top 7%
+      top 8%
     &:nth-child(3)
-      top 15%
+      top 17%
     &:nth-child(4)
-      top 22%
+      top 25%
     &:nth-child(5)
-      top 30%
+      top 34%
     &:nth-child(6)
-      top 37%
+      top 42%
     &:nth-child(7)
-      top 45%
+      top 51%
     &:nth-child(8)
-      top 52%
+      top 59%
     &:nth-child(9)
-      top 60%
+      top 68%
     &:nth-child(10)
-      top 67%
+      top 76%
     &:nth-child(11)
-      top 75%
+      top 85%
     &:nth-child(12)
-      top 82%
+      top 93%
 .lz_wrap_1
   width 2%
   height 84.6%
-  top 10%
+  top 6%
-  left 24%
+  left 22%
   .lz
     &:nth-child(2)
       top 9%
@@ -1072,31 +1184,31 @@ export default {
 .lz_wrap_2
   width 2%
   height 66.3%
-  top 45%
+  top 40%
-  left 20%
+  left 22%
   .lz
     &:nth-child(2)
-      top 6.5%
+      top 7.5%
     &:nth-child(3)
-      top 15%
+      top 17%
     &:nth-child(4)
-      top 21.5%
+      top 24.5%
     &:nth-child(5)
-      top 30%
+      top 34%
     &:nth-child(6)
-      top 36.5%
+      top 42.5%
     &:nth-child(7)
-      top 45%
+      top 51%
     &:nth-child(8)
-      top 51.5%
+      top 59.5%
     &:nth-child(9)
-      top 60%
+      top 68%
     &:nth-child(10)
-      top 66.5%
+      top 76.5%
     &:nth-child(11)
-      top 75%
+      top 85%
     &:nth-child(12)
-      top 81.5%
+      top 92.5%
 .yjlz_wrap_1
   width 2%
   height 16.442%
@@ -1137,20 +1249,30 @@ export default {
   top 2%
   left 44.7%
   .yj_info_wrap
-    width 60%
+    position absolute
-    top: 0
+    top 1%
-    left: -81%
+    left -112%
-    padding: 5px
+    z-index 0
-    _bis('../../../images/workshop/txtbg.png')
+    width 130%
-    p
+    _fj(row)
-      _font(14px, 16px, #fff,,right)
+    .yj_info
+      width 72%
+      height 61px
+      padding 5px
+      background-image linear-gradient(to right, #067272, transparent)
+      border 1px solid #00ffff
+      border-radius 5px
+      overflow hidden
+      p
+        _font(13px, 17px, #00ffff,,left)
+        border-bottom 0.5px solid #067272
+        span
+          color #fff
+        &:last-child
+          border none
     .bg_line
-      position absolute
+      _wh(28%, 1px)
-      _wh(67%, 2px)
       background-color #03fcfd
-      right -100%
-      top 50%
-      transform translate(-50%)
   .yyj
     width 50%
     img
@@ -1214,9 +1336,11 @@ export default {
   top 41%
   .yj_info_wrap
     top -10%
+    width 148%
+    .yj_info
+      width 63%
     .bg_line
-      width: 100%;
+      width 37%
-      right: -150%;
   .yj_info_wrap_1
     top 46%
   .blj_1
@@ -1348,14 +1472,8 @@ export default {
       right auto
 .yj_wrap_10
   left 62.5%
-  .yj_info_wrap_1
+  .yj_info_wrap
-    left auto
+    left 63%
-    right -81%
-    _bis('../../../images/workshop/txtbg1.png')
-    p
-      text-align left
-    .bg_line
-      left -50%
   .cyj_1
     left auto
     right 0
@@ -1366,7 +1484,7 @@ export default {
     left auto
     right 64%
     transform rotate(-90deg)
-.lz_wrap_4
+.kl_wrap_1
   width 2%
   height 63%
   bottom 4%
@@ -1381,6 +1499,8 @@ export default {
       _wh(100%, 100%)
   .mgt5
     margin-top 45%
+.kl_wrap_2
+  right 5%
 .mtp_wrap_1
   width 2.5%
   top 9%

src/pages/modules/homepage/two.vue

@@ -72,7 +72,7 @@
                       <div class="cmd_block">
                         <div class="machine_wrap ktp_wrap_1">
                           <div class="ktp">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img src="../../../images/workshop/ktp_gray.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap cmd_wrap_1">
@@ -82,11 +82,17 @@
                           <div class="sh_machine fjfztb">
                             <img src="../../../images/workshop/fjfztb.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_1">
+                          <div v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_1">
-                            <img src="../../../images/workshop/mtp.png" alt="">
+                            <img v-show="SortAndPalletizingList[0].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="SortAndPalletizingList[0].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="SortAndPalletizingList[0].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="SortAndPalletizingList[0].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine kongtuopan_2">
+                          <div v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_2">
-                            <img src="../../../images/workshop/mtp.png" alt="">
+                            <img v-show="SortAndPalletizingList[1].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
+                            <img v-show="SortAndPalletizingList[1].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
+                            <img v-show="SortAndPalletizingList[1].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
+                            <img v-show="SortAndPalletizingList[1].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
                           </div>
                           <div class="sh_machine robot_1 rotate_1">
                             <img src="../../../images/workshop/robot_cmd_green.png" alt="">
@@ -94,11 +100,17 @@
                           <div class="sh_machine weilan2">
                             <img src="../../../images/workshop/weilan_5.png" alt="">
                           </div>
-                          <div class="sh_machine cmdssj_1">
+                          <div v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img v-show="SortAndPalletizingList[2].color_status === 0" src="../../../images/workshop/cmdssj_gray.png" alt="">
+                            <img v-show="SortAndPalletizingList[2].color_status === 1" src="../../../images/workshop/cmdssj_green.png" alt="">
+                            <img v-show="SortAndPalletizingList[2].color_status === 2" src="../../../images/workshop/cmdssj_red.png" alt="">
+                            <img v-show="SortAndPalletizingList[2].color_status === 3" src="../../../images/workshop/cmdssj_yellow.png" alt="">
                           </div>
-                          <div class="sh_machine cmdssj_1 cmdssj_2">
+                          <div v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1 cmdssj_2">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img v-show="SortAndPalletizingList[3].color_status === 0" src="../../../images/workshop/cmdssj_gray.png" alt="">
+                            <img v-show="SortAndPalletizingList[3].color_status === 1" src="../../../images/workshop/cmdssj_green.png" alt="">
+                            <img v-show="SortAndPalletizingList[3].color_status === 2" src="../../../images/workshop/cmdssj_red.png" alt="">
+                            <img v-show="SortAndPalletizingList[3].color_status === 3" src="../../../images/workshop/cmdssj_yellow.png" alt="">
                           </div>
                           <div class="sh_machine robot_2 rotate_2">
                             <img src="../../../images/workshop/robot_cmd_green.png" alt="">
@@ -124,10 +136,10 @@
                             <img src="../../../images/workshop/weilan_5.png" alt="">
                           </div>
                           <div class="sh_machine cmdssj_1">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img src="../../../images/workshop/cmdssj_gray.png" alt="">
                           </div>
                           <div class="sh_machine cmdssj_1 cmdssj_2">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img src="../../../images/workshop/cmdssj_gray.png" alt="">
                           </div>
                           <div class="sh_machine robot_2">
                             <img src="../../../images/workshop/robot_cmd_gray.png" alt="">
@@ -138,10 +150,10 @@
                             <img src="../../../images/workshop/liu.png" alt="">
                           </div> -->
                           <div class="sh_machine cmdssj_1">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img src="../../../images/workshop/cmdssj_gray.png" alt="">
                           </div>
                           <div class="sh_machine cmdssj_1 cmdssj_2">
-                            <img src="../../../images/workshop/cmdssj.png" alt="">
+                            <img src="../../../images/workshop/cmdssj_gray.png" alt="">
                           </div>
                           <div class="rgv_line_wrap">
                             <div class="rgv_line_1">
@@ -311,7 +323,8 @@ export default {
       myCharts2: '',
       DeviceConditionList: [],
       LastMonthFailureList: [],
-      LastTenFailureList: []
+      LastTenFailureList: [],
+      SortAndPalletizingList: []
     }
   },
   computed: {
@@ -347,6 +360,7 @@ export default {
         this.DeviceConditionList = [...res.result.DeviceConditionList]
         this.LastMonthFailureList = [...res.result.LastMonthFailureList]
         this.LastTenFailureList = [...res.result.LastTenFailureList]
+        this.SortAndPalletizingList = [...res.result.SortAndPalletizingList]
         this.setEchart1()
         this.setEchart2()
       }

src/pages/modules/sortpack/one.vue

@@ -42,7 +42,7 @@
                     <div class="machine_wrap cmd_block">
                         <div class="machine_wrap ktp_wrap_1">
                             <div class="sh_machine ktp">
-                            <img src="../../../images/workshop/ktp.png" alt="">
+                            <img src="../../../images/workshop/ktp_gray.png" alt="">
                             </div>
                         </div>
                         <div class="machine_wrap cmd_wrap_1">