分拣

src/assets/js/getData2.js

@@ -2949,7 +2949,7 @@ export const moldingTableDate = () => {
 // 分拣包装左
 // export const sortingAndPackagingPopover = () => post('api/cockpit/sortingAndPackagingPopover', {})
 export const sortingAndPackagingPopover = () => {
-  let res = {'code': 200, 'desc': '操作成功', 'result': {'SplitOrPalletizingList': [{'bom': '3012C1', 'is_full': '是', 'device_name': '压机1', 'qty': '270', 'mix_num': '20230606000', 'point_name': '分拣拆垛1对接位1', 'vehicle_code': '5070', 'point_code': 'FJCD01DJ01', 'point_status': '1', 'material_code': 'GBMAC3012C1'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣拆垛1对接位2', 'vehicle_code': '', 'point_code': 'FJCD01DJ02', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣码垛1对接位1', 'vehicle_code': '0000', 'point_code': 'FJMD01DJ01', 'point_status': '1', 'material_code': '-'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣码垛1对接位2', 'vehicle_code': '0000', 'point_code': 'FJMD01DJ02', 'point_status': '1', 'material_code': '-'}], 'HalfSupportCacheList': [{'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}], 'DevicesInfoList': {'DT01': {'device_status': 2, 'device_name': '叠托位', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'DT01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJCDJXS01': {'device_status': 2, 'device_name': '分拣拆垛机械手', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJCDJXS01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'RGV01': {'device_status': 2, 'device_name': 'RGV搬运车', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'RGV01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJMDJXS01': {'device_status': 2, 'device_name': '分拣码垛机械手', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJMDJXS01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'CPJ01': {'device_status': 2, 'device_name': '拆盘机', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'CPJ01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'BZJ01': {'device_status': 2, 'device_name': '包装机', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'BZJ01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJRGCD01': {'device_status': 2, 'device_name': '分拣人工拆垛', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJRGCD01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}}}}
+  let res = {'code': 200, 'desc': '操作成功', 'result': {'SplitOrPalletizingList': [{'bom': '3012C1', 'is_full': '是', 'device_name': '压机1', 'qty': '270', 'mix_num': '20230606000', 'point_name': '分拣拆垛1对接位1', 'vehicle_code': '5070', 'point_code': 'FJCD01DJ01', 'point_status': '1', 'material_code': 'GBMAC3012C1'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣拆垛1对接位2', 'vehicle_code': '', 'point_code': 'FJCD01DJ02', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣码垛1对接位1', 'vehicle_code': '0000', 'point_code': 'FJMD01DJ01', 'point_status': '1', 'material_code': '-'}, {'bom': '-', 'is_full': '-', 'device_name': '-', 'qty': '-', 'mix_num': '-', 'point_name': '分拣码垛1对接位2', 'vehicle_code': '0000', 'point_code': 'FJMD01DJ02', 'point_status': '1', 'material_code': '-'}], 'HalfSupportCacheList': [{'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}, {'bom': '-', 'device_name': '-', 'instorage_time': '-', 'qty': '-', 'mix_num': '-', 'point_name': '半托缓存位1', 'point_status_name': '无货', 'vehicle_code': '-', 'point_code': 'BTHC01', 'point_status': '0', 'material_code': '-'}], 'DevicesInfoList': {'DT01': {'device_status': 2, 'device_name': '叠托位', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'DT01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJCDJXS01': {'device_status': 2, 'device_name': '分拣拆垛机械手', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJCDJXS01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'RGV01': {'device_status': 2, 'device_name': 'RGV搬运车', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'RGV01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJMDJXS01': {'device_status': 2, 'device_name': '分拣码垛机械手', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJMDJXS01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'CPJ01': {'device_status': 2, 'device_name': '拆盘机', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'CPJ01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'BZJ01': {'device_status': 2, 'device_name': '包装机', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'BZJ01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}, 'FJRGCD01': {'device_status': 2, 'device_name': '分拣人工拆垛', 'device_status_name': '运行中', 'error_time': '0', 'stand_time': '2', 'device_code': 'FJRGCD01', 'open_time': '2023-06-02 11:12:02', 'work_time': '7'}}}}
   return res
 }
 

src/pages/modules/homepage/one.vue

@@ -117,12 +117,20 @@
                             <img v-show="String(StackingPositionList[0].color_status) === '1'" src="../../../images/workshop/ktp_green.png" alt="">
                             <img v-show="String(StackingPositionList[0].color_status) === '2'" src="../../../images/workshop/ktp_red.png" alt="">
                             <img v-show="String(StackingPositionList[0].color_status) === '3'" src="../../../images/workshop/ktp_yellow.png" alt="">
+                            <div class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
                             <img v-show="String(StackingPositionList[1].color_status) === '0'" src="../../../images/workshop/ktp_gray.png" alt="">
                             <img v-show="String(StackingPositionList[1].color_status) === '1'" src="../../../images/workshop/ktp_green.png" alt="">
                             <img v-show="String(StackingPositionList[1].color_status) === '2'" src="../../../images/workshop/ktp_red.png" alt="">
                             <img v-show="String(StackingPositionList[1].color_status) === '3'" src="../../../images/workshop/ktp_yellow.png" alt="">
+                            <div class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot" :class="{'rotate_2500_1': String(ManipulatorInfoList[0].color_status) === '1'}">
                             <img v-show="String(ManipulatorInfoList[0].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
@@ -165,12 +173,20 @@
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot" :class="{'rotate_2500_2': String(ManipulatorInfoList[1].color_status) === '1'}">
                             <img v-show="String(ManipulatorInfoList[1].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
@@ -239,24 +255,40 @@
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3">
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4">
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot" :class="{'rotate_630_1': String(ManipulatorInfoList[2].color_status) === '1'}">
                             <img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
@@ -357,12 +389,20 @@
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2">
                             <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 class="zhuan_qty">
+                              <p>200</p>
+                              <div class="zhuan_bg_arrow"></div>
+                            </div>
                           </div>
                           <div class="sh_machine jcpmj">
                             <img src="../../../images/workshop/jcpmj.png" alt="">
@@ -1395,11 +1435,47 @@ export default {
       top: -800%;
       left: -2000%;
   .kongtuopan_1
-    width: 12%;
+    _wh(12%, 12%)
     top: 81%;
     left: 61%;
+    .zhuan_qty
+      position absolute
+      bottom -30px
+      right: 0;
+      z-index 8
+      _wh(50px, 20px)
+      background-color: #0ff;
+      border: 1px solid #0ff;
+      border-radius: 5px
+      p
+        display block
+        _fj(row,center)
+        _wh(100%, 100%)
+        _font(13px, 13px, #fff,,center)
+        white-space nowrap
+      .zhuan_bg_arrow
+        position: absolute;
+        top -5px
+        right 10%
+        display: block;
+        width: 0;
+        height: 0;
+        border-color: transparent;
+        border-style: solid;
+        border-width: 5px
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        &:after
+          content: " ";
+          border-width: 5px;
   .kongtuopan_2
     left: 74%;
+    .zhuan_qty
+      right auto
+      left 0
+      .zhuan_bg_arrow
+        right auto
+        left 10%
   .block_1
     width: 10%;
     height: 9%;
@@ -1413,11 +1489,24 @@ export default {
   .robot
     transform: rotate(-46deg)
   .kongtuopan_1
-    top 37%
+    top 31%
     left 85%
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
+    .zhuan_qty
+      bottom auto
+      top 0
+      right auto
+      left 32px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-left-width: 0;
+        border-right-color: #0ff;
+        top: 20%;
+        left: -5px;
   .kongtuopan_2
-    top 76%
+    top 80%
   .weilan
     top 16%
   .block_2
@@ -1482,25 +1571,60 @@ export default {
   .kongtuopan_1
     top: 21%
     left: 64%;
+    .zhuan_qty
+      bottom auto
+      top -47px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-bottom-width: 0;
+        border-top-color: #0ff;
+        top auto
+        bottom -5px
   .kongtuopan_2
     left: 80%;
   .kongtuopan_3
     top: 64%
+    .zhuan_qty
+      bottom -47px
+      top auto
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        top -5px
+        bottom auto
   .kongtuopan_4
     top: 64%
     left: 80%;
+    .zhuan_qty
+      bottom -47px
+      top auto
+      right auto
+      left 0
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        top -5px
+        bottom auto
+        right auto
+        left 10%
 .yj_wrap_5
   top 61%
   .kongtuopan_1
-    top: 14%;
+    top: 7%;
     left: 64%;
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
   .kongtuopan_2
-    top 30%
+    top 25%
   .kongtuopan_3
-    top 70%
+    top 62%
   .kongtuopan_4
-    top 86%
+    top 80%
 .yj_wrap_7
   top 75%
   .yj_info_wrap
@@ -1518,11 +1642,24 @@ export default {
     left: 75%
     transform: rotate(15deg);
   .kongtuopan_1
-    top 43%
+    top 35%
     left 90%
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
+    .zhuan_qty
+      bottom auto
+      top 0
+      right auto
+      left 32px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-left-width: 0;
+        border-right-color: #0ff;
+        top: 20%;
+        left: -5px;
   .kongtuopan_2
-    top: 63%
+    top: 59%
   .jcpmj
     width: 18%;
     top: 12%;
@@ -1578,7 +1715,8 @@ export default {
   .kongtuopan_1
     left auto
     right 64%
-    transform rotate(-90deg)
+    img
+      transform rotate(-90deg)
 .kl_wrap_1
   width 2%
   height 63%

src/pages/modules/sortpack/one.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="n_container">
+    <div @click.stop="closeModal" class="n_container">
         <div class="n_header">
             <div class="n_header_h1">
                 <h1>晟华生产数</h1>
@@ -27,10 +27,10 @@
                 </div>
                 <div class="center_content">
                     <div class="machine_wrap diepanji_wrap">
-                        <div class="machine_wrap mtp_wrap_1">
+                        <!-- <div class="machine_wrap mtp_wrap_1">
                             <img src="../../../images/workshop/mtp.png"  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">
-                        </div>
-                        <div class="machine_wrap gtssj_wrap_1">
+                        </div> -->
+                        <div class="machine_wrap gtssj_wrap_1" ref="BZJ01" @click.stop="yjInfo('device', 'BZJ01')">
                             <img src="../../../images/workshop/gtssj.png" alt="" v-for="(e,i) in [1,2,3,4,5]" :key="i">
                         </div>
                         <div class="machine_wrap cpj_wrap_1">
@@ -40,7 +40,7 @@
                         </div>
                     </div>
                     <div class="cmd_block">
-                      <div class="machine_wrap ktp_wrap_1">
+                      <div class="machine_wrap ktp_wrap_1" ref="DT01" @click.stop="yjInfo('device', 'DT01')">
                         <div class="ktp">
                           <img src="../../../images/workshop/ktp_gray.png" alt="">
                         </div>
@@ -52,19 +52,19 @@
                         <div class="sh_machine fjfztb">
                           <img src="../../../images/workshop/fjfztb.png" alt="">
                         </div>
-                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_1">
+                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_1" ref="cmgw01" @click.stop="yjInfo('cmgw', 1)">
                           <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 v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_2">
+                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine kongtuopan_2" ref="cmgw02" @click.stop="yjInfo('cmgw', 2)">
                           <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 v-if="ManipulatorInfoList.length > 0" class="sh_machine robot_1" :class="{'rotate_1': String(ManipulatorInfoList[4].color_status) === '1'}">
+                        <div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot_1" :class="{'rotate_1': String(ManipulatorInfoList[4].color_status) === '1'}" ref="FJCDJXS01" @click.stop="yjInfo('device', 'FJCDJXS01')">
                           <img v-show="String(ManipulatorInfoList[4].color_status) === '0'" src="../../../images/workshop/robot_cmd_gray.png" alt="">
                           <img v-show="String(ManipulatorInfoList[4].color_status) === '1'" src="../../../images/workshop/robot_cmd_green.png" alt="">
                           <img v-show="String(ManipulatorInfoList[4].color_status) === '2'" src="../../../images/workshop/robot_cmd_red.png" alt="">
@@ -73,19 +73,19 @@
                         <div class="sh_machine weilan2">
                           <img src="../../../images/workshop/weilan_5.png" alt="">
                         </div>
-                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1">
+                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1" ref="cmgw03" @click.stop="yjInfo('cmgw', 3)">
                           <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 v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1 cmdssj_2">
+                        <div v-if="SortAndPalletizingList.length > 0" class="sh_machine cmdssj_1 cmdssj_2" ref="cmgw04" @click.stop="yjInfo('cmgw', 4)">
                           <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">
+                        <div class="sh_machine robot_2 rotate_2" ref="FJMDJXS01" @click.stop="yjInfo('device', 'FJMDJXS01')">
                           <img src="../../../images/workshop/robot_cmd_green.png" alt="">
                         </div>
                       </div>
@@ -138,7 +138,7 @@
                           </div>
                           <div class="rgv_line_3"></div>
                         </div>
-                        <div class="sh_machine rgvct">
+                        <div class="sh_machine rgvct" ref="RGV01" @click.stop="yjInfo('device', 'RGV01')">
                           <img src="../../../images/workshop/rgv_ct.png" alt="">
                         </div>
                         <div class="machine_wrap ggtj_wrap_1">
@@ -150,12 +150,12 @@
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_2">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc01" @click.stop="yjInfo('bthc', 1)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_3">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc02" @click.stop="yjInfo('bthc', 2)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
@@ -168,7 +168,7 @@
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_5">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc03" @click.stop="yjInfo('bthc', 3)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
@@ -190,27 +190,27 @@
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_7">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc04" @click.stop="yjInfo('bthc', 4)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_8">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc05" @click.stop="yjInfo('bthc', 5)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_9">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc06" @click.stop="yjInfo('bthc', 6)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_10">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc07" @click.stop="yjInfo('bthc', 7)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
                         <div class="machine_wrap ggtj_wrap_1 ggtj_wrap_11">
-                          <div class="machine_wrap ggtj">
+                          <div class="machine_wrap ggtj pointer" ref="bthc08" @click.stop="yjInfo('bthc', 8)">
                             <img src="../../../images/workshop/ggtssj_y.png" alt="">
                           </div>
                         </div>
@@ -224,6 +224,81 @@
                 </div>
             </div>
         </div>
+        <div v-if="showModal" class="popup_block_wraper" :style="{'top': top, 'left': left}">
+          <div class="foldline" :class="foldlineStyle"></div>
+          <div class="popup_bg">
+            <div class="popup_block">
+              <div class="pop_header">
+                <div v-show="machine === 'device'" class="pop_name">{{pkObj.device_name}}</div>
+                <div v-show="machine === 'device'" class="pop_status">
+                  <div class="pop_status_dot" :class="['gray', 'yellow', 'green', 'red'][Number(pkObj.device_status)]"></div>
+                  <div class="pop_status_text fgray">{{pkObj.device_status_name}}</div>
+                </div>
+              </div>
+              <div v-show="machine === 'device'" class="pop_content">
+                <div class="pop_item">
+                  <div class="pop_label">开机时间</div>
+                  <div class="pop_val">{{ pkObj.open_time }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">待机时间</div>
+                  <div class="pop_val pop_val_s">{{ pkObj.stand_time }}</div>
+                  <div class="pop_unit">时</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">生产时间</div>
+                  <div class="pop_val pop_val_s">{{ pkObj.work_time }}</div>
+                  <div class="pop_unit">时</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">故障时间</div>
+                  <div class="pop_val pop_val_s">{{ pkObj.error_time }}</div>
+                  <div class="pop_unit">时</div>
+                </div>
+              </div>
+              <div v-show="machine === 'cmgw' || machine === 'bthc'" class="pop_content">
+                <div class="pop_item">
+                  <div class="pop_label">状态</div>
+                  <div class="pop_val">{{ ['无货', '有货'][Number(pkObj.point_status) - 1] }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">载具</div>
+                  <div class="pop_val">{{ pkObj.vehicle_code }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">bom号</div>
+                  <div class="pop_val">{{ pkObj.bom }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">物料编码</div>
+                  <div class="pop_val">{{ pkObj.material_code }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">数量</div>
+                  <div class="pop_val pop_val_s">{{ pkObj.qty }}</div>
+                  <div class="pop_unit">块</div>
+                </div>
+                <div v-show="machine === 'cmgw'" class="pop_item">
+                  <div class="pop_label">机台</div>
+                  <div class="pop_val">{{ pkObj.device_name }}</div>
+                </div>
+                <div class="pop_item">
+                  <div class="pop_label">碾次</div>
+                  <div class="pop_val">{{ pkObj.mix_num }}</div>
+                </div>
+                <div v-show="machine === 'cmgw'" class="pop_item">
+                  <div class="pop_label">是否满托</div>
+                  <div class="pop_val">{{ pkObj.is_full }}</div>
+                </div>
+                <div v-show="machine === 'bthc'" class="pop_item">
+                  <div class="pop_label">入库时间</div>
+                  <div class="pop_val">{{ pkObj.instorage_time }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="iconfont icon-guanbi close_btn" @click.stop="closeModal"></div>
+        </div>
         <div class="tooltip_wrap left_tooltip_wrap" :style="expand ? 'opacity: 1' : 'opacity: 0.1'">
           <div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&gt;&gt;' : '&lt;&lt;'"></div>
           <div class="tooltip_pages" :style="expand ? 'width: 240px' : 'width: 0'">
@@ -247,11 +322,17 @@ export default {
       interTime: this.$store.getters.setTime,
       timer: null,
       expand: false,
-      SplitOrPalletizingList: [],
-      HalfSupportCacheList: [],
-      DevicesInfoList: [],
+      SplitOrPalletizingList: [], // 拆码工位弹窗
+      HalfSupportCacheList: [], // 点位/货位弹出框
+      DevicesInfoList: {}, // 设备弹窗
       SortAndPalletizingList: [], // 分拣拆码垛对接位
-      ManipulatorInfoList: [] // 机械手数据
+      ManipulatorInfoList: [], // 机械手数据
+      showModal: false,
+      machine: '',
+      top: '',
+      left: '',
+      foldlineStyle: '',
+      pkObj: {}
     }
   },
   mounted () {
@@ -281,7 +362,7 @@ export default {
       if (res.code === 200) {
         this.SplitOrPalletizingList = [...res.result.SplitOrPalletizingList]
         this.HalfSupportCacheList = [...res.result.HalfSupportCacheList]
-        this.DevicesInfoList = [...res.result.DevicesInfoList]
+        this.DevicesInfoList = res.result.DevicesInfoList
       }
     },
     expandTooltip () {
@@ -307,6 +388,138 @@ export default {
           this.$router.push('/pdone')
           break
       }
+    },
+    closeModal () {
+      this.showModal = false
+      this.machine = ''
+      this.pkObj = {}
+    },
+    yjInfo (m, type) {
+      this.machine = m
+      if (m === 'cmgw') {
+        if (!this.SplitOrPalletizingList.length) {
+          return
+        }
+        switch (type) {
+          case 1:
+            this.pkObj = this.SplitOrPalletizingList[0]
+            this.top = this.$refs.cmgw01.getBoundingClientRect().top - 13
+            this.left = this.$refs.cmgw01.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 2:
+            this.pkObj = this.SplitOrPalletizingList[1]
+            this.top = this.$refs.cmgw02.getBoundingClientRect().top - 13
+            this.left = this.$refs.cmgw02.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 3:
+            this.pkObj = this.SplitOrPalletizingList[2]
+            this.top = this.$refs.cmgw03.getBoundingClientRect().top - 13
+            this.left = this.$refs.cmgw03.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 4:
+            this.pkObj = this.SplitOrPalletizingList[3]
+            this.top = this.$refs.cmgw04.getBoundingClientRect().top - 13
+            this.left = this.$refs.cmgw04.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+        }
+      }
+      if (m === 'bthc') {
+        if (!this.HalfSupportCacheList.length) {
+          return
+        }
+        switch (type) {
+          case 1:
+            this.pkObj = this.HalfSupportCacheList[0]
+            this.top = this.$refs.bthc01.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc01.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 2:
+            this.pkObj = this.HalfSupportCacheList[1]
+            this.top = this.$refs.bthc02.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc02.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 3:
+            this.pkObj = this.HalfSupportCacheList[2]
+            this.top = this.$refs.bthc03.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc03.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 4:
+            this.pkObj = this.HalfSupportCacheList[3]
+            this.top = this.$refs.bthc04.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc04.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 5:
+            this.pkObj = this.HalfSupportCacheList[4]
+            this.top = this.$refs.bthc05.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc05.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 6:
+            this.pkObj = this.HalfSupportCacheList[5]
+            this.top = this.$refs.bthc06.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc06.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 7:
+            this.pkObj = this.HalfSupportCacheList[6]
+            this.top = this.$refs.bthc07.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc07.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 8:
+            this.pkObj = this.HalfSupportCacheList[7]
+            this.top = this.$refs.bthc08.getBoundingClientRect().top - 13
+            this.left = this.$refs.bthc08.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+        }
+      }
+      if (m === 'device') {
+        if (JSON.stringify(this.DevicesInfoList.length) === '{}') {
+          return
+        }
+        switch (type) {
+          case 'DT01':
+            this.pkObj = this.DevicesInfoList.DT01
+            this.top = this.$refs.DT01.getBoundingClientRect().top - 13
+            this.left = this.$refs.DT01.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 'RGV01':
+            this.pkObj = this.DevicesInfoList.RGV01
+            this.top = this.$refs.RGV01.getBoundingClientRect().top - 13
+            this.left = this.$refs.RGV01.getBoundingClientRect().left - 627
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 'FJCDJXS01':
+            this.pkObj = this.DevicesInfoList.FJCDJXS01
+            this.top = this.$refs.FJCDJXS01.getBoundingClientRect().top - 31
+            this.left = this.$refs.FJCDJXS01.getBoundingClientRect().left - 650
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 'FJMDJXS01':
+            this.pkObj = this.DevicesInfoList.FJMDJXS01
+            this.top = this.$refs.FJMDJXS01.getBoundingClientRect().top - 31
+            this.left = this.$refs.FJMDJXS01.getBoundingClientRect().left - 650
+            this.foldlineStyle = 'foldline_right'
+            break
+          case 'BZJ01':
+            this.pkObj = this.DevicesInfoList.BZJ01
+            this.top = this.$refs.BZJ01.getBoundingClientRect().top
+            this.left = this.$refs.BZJ01.getBoundingClientRect().left + 119
+            this.foldlineStyle = 'foldline_left'
+            break
+        }
+      }
+      this.showModal = true
     }
   }
 }
@@ -393,13 +606,14 @@ export default {
         _wh(100%, auto)
 .gtssj_wrap_1
     width: 7%;
-    left: 11%;
+    // left: 11%
     img
         _wh(100%, auto)
 .cpj_wrap_1
     width: 11%;
     top: 8%;
-    left: 8%;
+    // left: 8%;
+    left: -3%;
     .cpj
         width 100%
 .cmd_block
@@ -435,6 +649,7 @@ export default {
     width 26%
     top 3%
     left 3%
+    cursor pointer
   .kongtuopan_2
     width 26%
     top 3%

src/pages/modules/takeshape/one.vue

@@ -748,14 +748,15 @@ export default {
     },
     closeModal () {
       this.showModal = false
+      this.machine = ''
       this.pkObj = {}
     },
     yjInfo (m, type) {
       this.machine = m
-      if (!this.PressPopoverList.length) {
-        return
-      }
       if (m === 'yj') {
+        if (!this.PressPopoverList.length) {
+          return
+        }
         switch (type) {
           case 1:
             this.pkObj = this.PressPopoverList[0]
@@ -820,6 +821,9 @@ export default {
         }
       }
       if (m === 'jxs') {
+        if (!this.ManipulatorList.length) {
+          return
+        }
         switch (type) {
           case 1:
             this.pkObj = this.ManipulatorList[0]
@@ -848,6 +852,9 @@ export default {
         }
       }
       if (m === 'mpgw') {
+        if (!this.TrayStationPopoverList.length) {
+          return
+        }
         switch (type) {
           case 1:
             this.pkObj = this.TrayStationPopoverList[0]
@@ -1153,18 +1160,53 @@ export default {
     left: 75%;
     top: 55%;
     transform: rotate(-46deg)
-    animation rotate_2500_1 1.5s linear 1.5s infinite alternate-reverse
     img
       width 2400%
       top: -800%;
       left: -2000%;
   .kongtuopan_1
-    width: 12%;
+    cursor pointer
+    _wh(12%, 12%)
     top: 81%;
     left: 61%;
-    cursor pointer
+    .zhuan_qty
+      position absolute
+      bottom -30px
+      right: 0;
+      z-index 8
+      _wh(50px, 20px)
+      background-color: #0ff;
+      border: 1px solid #0ff;
+      border-radius: 5px
+      p
+        display block
+        _fj(row,center)
+        _wh(100%, 100%)
+        _font(13px, 13px, #fff,,center)
+        white-space nowrap
+      .zhuan_bg_arrow
+        position: absolute;
+        top -5px
+        right 10%
+        display: block;
+        width: 0;
+        height: 0;
+        border-color: transparent;
+        border-style: solid;
+        border-width: 5px
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        &:after
+          content: " ";
+          border-width: 5px;
   .kongtuopan_2
     left: 74%;
+    .zhuan_qty
+      right auto
+      left 0
+      .zhuan_bg_arrow
+        right auto
+        left 10%
   .block_1
     width: 10%;
     height: 9%;
@@ -1177,13 +1219,25 @@ export default {
   left: 71%
   .robot
     transform: rotate(-46deg)
-    animation rotate_2500_2 1.5s linear 1.5s infinite alternate-reverse
   .kongtuopan_1
-    top 37%
+    top 31%
     left 85%
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
+    .zhuan_qty
+      bottom auto
+      top 0
+      right auto
+      left 32px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-left-width: 0;
+        border-right-color: #0ff;
+        top: 20%;
+        left: -5px;
   .kongtuopan_2
-    top 76%
+    top 80%
   .weilan
     top 16%
   .block_2
@@ -1257,29 +1311,63 @@ export default {
     left: 79%;
     top: 49%;
     transform: rotate(-4deg)
-    animation rotate_630_1 1.5s linear 1.5s infinite alternate-reverse
   .kongtuopan_1
     top: 21%
     left: 64%;
+    .zhuan_qty
+      bottom auto
+      top -47px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-bottom-width: 0;
+        border-top-color: #0ff;
+        top auto
+        bottom -5px
   .kongtuopan_2
     left: 80%;
   .kongtuopan_3
     top: 64%
+    .zhuan_qty
+      bottom -47px
+      top auto
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        top -5px
+        bottom auto
   .kongtuopan_4
     top: 64%
     left: 80%;
+    .zhuan_qty
+      bottom -47px
+      top auto
+      right auto
+      left 0
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-top-width: 0;
+        border-bottom-color: #0ff;
+        top -5px
+        bottom auto
+        right auto
+        left 10%
 .yj_wrap_5
   left: 36%
   .kongtuopan_1
-    top: 14%;
+    top: 7%;
     left: 64%;
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
   .kongtuopan_2
-    top 30%
+    top 25%
   .kongtuopan_3
-    top 70%
+    top 62%
   .kongtuopan_4
-    top 86%
+    top 80%
 .yj_wrap_7
   left 18%
   .yj_info_wrap
@@ -1295,14 +1383,26 @@ export default {
     top 15%
   .robot
     left: 75%
-    transform: rotate(15deg);
-    animation rotate_630_2 3s linear 1.5s infinite alternate-reverse
+    transform: rotate(15deg)
   .kongtuopan_1
-    top 43%
+    top 35%
     left 90%
-    transform rotate(90deg)
+    img
+      transform rotate(90deg)
+    .zhuan_qty
+      bottom auto
+      top 0
+      right auto
+      left 32px
+      .zhuan_bg_arrow
+        border-color: transparent;
+        border-width: 5px;
+        border-left-width: 0;
+        border-right-color: #0ff;
+        top: 20%;
+        left: -5px;
   .kongtuopan_2
-    top: 63%
+    top: 59%
   .jcpmj
     width: 18%;
     top: 12%;
@@ -1360,7 +1460,8 @@ export default {
   .kongtuopan_1
     left auto
     right 64%
-    transform rotate(-90deg)
+    img
+      transform rotate(-90deg)
 .yjlz_wrap_1
   width: 1.365%;
   height: 17%;
@@ -1396,6 +1497,14 @@ export default {
   .lz_1
     top 50%
     transform translateY(-50%)
+.rotate_2500_1
+  animation rotate_2500_1 1.5s linear 1.5s infinite alternate-reverse
+.rotate_2500_2
+  animation rotate_2500_2 1.5s linear 1.5s infinite alternate-reverse
+.rotate_630_1
+  animation rotate_630_1 1.5s linear 1.5s infinite alternate-reverse
+.rotate_630_2
+  animation rotate_630_2 3s linear 1.5s infinite alternate-reverse
 @keyframes rotate_2500_1 {
     0% {
       transform: rotateZ(-46deg)