Files
screen-lnsh/src/pages/modules/takeshape/one.vue
2023-07-10 16:11:53 +08:00

1837 lines
93 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div @click.stop="closeModal" class="n_container">
<div class="n_header">
<div class="n_header_h1">
<h1>晟华生产数</h1>
</div>
</div>
<div class="n_body_container">
<div class="n_body_container_wraper">
<div class="status_wrap">
<div class="status_item">
<div class="status_tip green"></div>
<div class="status_name">运行中</div>
</div>
<div class="status_item">
<div class="status_tip yellow"></div>
<div class="status_name">待机</div>
</div>
<div class="status_item">
<div class="status_tip gray"></div>
<div class="status_name">关机</div>
</div>
<div class="status_item">
<div class="status_tip red"></div>
<div class="status_name">故障</div>
</div>
<div class="status_item">
<div class="status_tip gray1"></div>
<div class="status_name">空料盅</div>
</div>
</div>
<div class="center_content">
<div v-if="TrappedShelfList.length > 0" class="machine_wrap yjlz_wrap_1">
<div class="sh_machine lz_1">
<img v-show="String(TrappedShelfList[0].point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(TrappedShelfList[0].point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(TrappedShelfList[0].point_status) === '2' && String(TrappedShelfList[0].stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(TrappedShelfList[0].point_status) === '2' && String(TrappedShelfList[0].stand_status) === '3' || String(TrappedShelfList[0].stand_status) === '4'" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(TrappedShelfList[0].point_status) === '2' && String(TrappedShelfList[0].stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
</div>
<div class="sh_machine lz_1 lz_2" v-for="(e,i) in TrappedShelfList.slice(1, 4)" :key="i">
<img v-show="String(e.point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(e.point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
</div>
</div>
<div v-if="TrappedShelfList.length > 0" class="machine_wrap yjlz_wrap_1 yjlz_wrap_2">
<div class="sh_machine lz_1">
<img v-show="String(TrappedShelfList[4].point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(TrappedShelfList[4].point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(TrappedShelfList[4].point_status) === '2' && String(TrappedShelfList[4].stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(TrappedShelfList[4].point_status) === '2' && String(TrappedShelfList[4].stand_status) === '3' || String(TrappedShelfList[4].stand_status) === '4'" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(TrappedShelfList[4].point_status) === '2' && String(TrappedShelfList[4].stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
</div>
<div class="sh_machine lz_1 lz_2" v-for="(e,i) in TrappedShelfList.slice(5)" :key="i">
<img v-show="String(e.point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(e.point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
</div>
</div>
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_3">
<div class="sh_machine lz_1">
<img src="../../../images/workshop/hj.png" alt="">
</div>
</div>
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_5">
<div class="sh_machine lz_1">
<img src="../../../images/workshop/hj.png" alt="">
</div>
</div>
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_7">
<div class="sh_machine lz_1">
<img src="../../../images/workshop/hj.png" alt="">
</div>
</div>
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_8">
<div class="sh_machine lz_1">
<img src="../../../images/workshop/hj.png" alt="">
</div>
</div>
<div class="yaji_wrap">
<div class="machine_wrap yj_wrap_1">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[0].open_time}}</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">
<img src="../../../images/workshop/weilan_2.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine jzjcss">
<img v-show="String(ManipulatorInfoList[0].color_status) === '0'" src="../../../images/workshop/jzjcss_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '1'" src="../../../images/workshop/jzjcss_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '2'" src="../../../images/workshop/jzjcss_green.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '3'" src="../../../images/workshop/jzjcss_red.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine yyj" ref="yj01" @click.stop="yjInfo('yj', 1)">
<img v-show="String(ManipulatorInfoList[0].color_status) === '0'" src="../../../images/workshop/yj_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '1'" src="../../../images/workshop/yj_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '2'" src="../../../images/workshop/yj_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '3'" src="../../../images/workshop/yj_2500_red.png" alt="">
</div>
<div class="sh_machine wzm">
<p v-if="PressMachineList.length > 0">{{ PressMachineList[0].device_name }}</p>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw01" @click.stop="yjInfo('mpgw', 1)">
<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_yellow.png" alt="">
<img v-show="String(StackingPositionList[1].color_status) === '2'" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="String(StackingPositionList[1].color_status) === '3'" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="String(StackingPositionList[1].color_status) === '2'" class="zhuan_qty">
<p>{{ StackingPositionList[1].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw02" @click.stop="yjInfo('mpgw', 2)">
<img v-show="String(StackingPositionList[0].color_status) === '0'" src="../../../images/workshop/ktp_gray.png" alt="">
<img v-show="String(StackingPositionList[0].color_status) === '1'" src="../../../images/workshop/ktp_yellow.png" alt="">
<img v-show="String(StackingPositionList[0].color_status) === '2'" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="String(StackingPositionList[0].color_status) === '3'" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="String(StackingPositionList[0].color_status) === '2'" class="zhuan_qty">
<p>{{ StackingPositionList[0].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_2500_1': String(ManipulatorInfoList[0].color_status) === '2'}" ref="jxs01" @click.stop="yjInfo('jxs', 1)">
<img v-show="String(ManipulatorInfoList[0].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '1'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '2'" src="../../../images/workshop/robot_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[0].color_status) === '3'" src="../../../images/workshop/robot_2500_red.png" alt="">
</div>
<div class="sh_machine elect_1">
<img src="../../../images/workshop/elect.png" alt="">
</div>
<div class="sh_machine elect_1 elect_2">
<img src="../../../images/workshop/elect.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_2">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[1].open_time}}</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">
<img src="../../../images/workshop/weilan_1.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine jzjcss">
<img v-show="String(ManipulatorInfoList[1].color_status) === '0'" src="../../../images/workshop/jzjcss_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '1'" src="../../../images/workshop/jzjcss_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '2'" src="../../../images/workshop/jzjcss_green.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '3'" src="../../../images/workshop/jzjcss_red.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine yyj" ref="yj02" @click.stop="yjInfo('yj', 2)">
<img v-show="String(ManipulatorInfoList[1].color_status) === '0'" src="../../../images/workshop/yj_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '1'" src="../../../images/workshop/yj_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '2'" src="../../../images/workshop/yj_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '3'" src="../../../images/workshop/yj_2500_red.png" alt="">
</div>
<div class="sh_machine wzm">
<p v-if="PressMachineList.length > 0">{{ PressMachineList[1].device_name }}</p>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw03" @click.stop="yjInfo('mpgw', 3)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[2].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[2].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[2].color_status === 2" class="zhuan_qty">
<p>{{ StackingPositionList[2].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw04" @click.stop="yjInfo('mpgw', 4)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[3].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[3].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[3].color_status === 2" class="zhuan_qty">
<p>{{ StackingPositionList[3].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_2500_2': String(ManipulatorInfoList[1].color_status) === '2'}" ref="jxs02" @click.stop="yjInfo('jxs', 2)">
<img v-show="String(ManipulatorInfoList[1].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '1'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '2'" src="../../../images/workshop/robot_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[1].color_status) === '3'" src="../../../images/workshop/robot_2500_red.png" alt="">
</div>
<div class="sh_machine elect_1 elect_2">
<img src="../../../images/workshop/elect.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[2].open_time}}</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 v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[3].open_time}}</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">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div class="sh_machine blj_1 blj_2">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine cyj_1">
<div class="cyj_img_wrap" ref="yj03" @click.stop="yjInfo('yj', 3)">
<p>{{ PressMachineList[2].device_name }}</p>
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap" ref="yj04" @click.stop="yjInfo('yj', 4)">
<p>{{ PressMachineList[3].device_name }}</p>
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_3.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine jzjcj_1">
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/jzjcj_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/jzjcj_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/jzjcj_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/jzjcj_red.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine jzjcj_1 jzjcj_2">
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/jzjcj_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/jzjcj_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/jzjcj_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/jzjcj_red.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine lmyzj">
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/lmyzj_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/lmyzj_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/lmyzj_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/lmyzj_red.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw05" @click.stop="yjInfo('mpgw', 5)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[5].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[5].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[5].color_status === 2" class="zhuan_qty">
<p>{{StackingPositionList[5].encoder_qty}}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw06" @click.stop="yjInfo('mpgw', 6)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[4].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[4].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[4].color_status === 2" class="zhuan_qty">
<p>{{StackingPositionList[4].encoder_qty}}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3" ref="mpgw07" @click.stop="yjInfo('mpgw', 7)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[7].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[7].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[7].color_status === 2" class="zhuan_qty">
<p>{{ StackingPositionList[7].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_3">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4" ref="mpgw08" @click.stop="yjInfo('mpgw', 8)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[6].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[6].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[6].color_status === 2" class="zhuan_qty">
<p>{{ StackingPositionList[6].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_4">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_630_1': String(ManipulatorInfoList[2].color_status) === '2'}" ref="jxs03" @click.stop="yjInfo('jxs', 3)">
<img v-show="String(ManipulatorInfoList[2].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '1'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/robot_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/robot_2500_red.png" alt="">
</div>
<div class="sh_machine elect_1 elect_2">
<img src="../../../images/workshop/elect.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[4].open_time}}</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 v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[5].open_time}}</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">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine cyj_1">
<div class="cyj_img_wrap" ref="yj05" @click.stop="yjInfo('yj', 5)">
<p>{{ PressMachineList[4].device_name }}</p>
<img v-show="StackingPositionList[8].color_status === 0 && StackingPositionList[9].color_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="StackingPositionList[8].color_status === 1 && StackingPositionList[9].color_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="StackingPositionList[8].color_status !== StackingPositionList[9].color_status" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="StackingPositionList[8].color_status === 3 && StackingPositionList[9].color_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap" ref="yj06" @click.stop="yjInfo('yj', 6)">
<p>{{ PressMachineList[5].device_name }}</p>
<img v-show="StackingPositionList[10].color_status === 0 && StackingPositionList[11].color_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="StackingPositionList[10].color_status === 1 && StackingPositionList[11].color_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="StackingPositionList[10].color_status !== StackingPositionList[11].color_status" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="StackingPositionList[10].color_status === 3 && StackingPositionList[11].color_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw09" @click.stop="yjInfo('mpgw', 9)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[8].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[8].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw10" @click.stop="yjInfo('mpgw', 10)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[9].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[9].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3" ref="mpgw11" @click.stop="yjInfo('mpgw', 11)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[10].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[10].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_3">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4" ref="mpgw12" @click.stop="yjInfo('mpgw', 12)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[11].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[11].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_4">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[6].open_time}}</p>
<p><span>物料</span>{{PressMachineList[6].material_code}}</p>
<p><span>产能</span>{{PressMachineList[6].now_capacity}}</p>
</div>
<div class="bg_line"></div>
</div>
<div class="sh_machine blj_1">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine cyj_1">
<div class="cyj_img_wrap" ref="yj07" @click.stop="yjInfo('yj', 7)">
<p>{{ PressMachineList[6].device_name }}</p>
<img v-show="String(ManipulatorInfoList[3].color_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div class="sh_machine weilan">
<img src="../../../images/workshop/weilan_6.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw13" @click.stop="yjInfo('mpgw', 13)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[12].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[12].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[12].color_status === 2" class="zhuan_qty">
<p>{{StackingPositionList[12].encoder_qty}}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw14" @click.stop="yjInfo('mpgw', 14)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[13].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[13].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
<div v-show="StackingPositionList[13].color_status === 2" class="zhuan_qty">
<p>{{ StackingPositionList[13].encoder_qty }}</p>
<div class="zhuan_bg_arrow"></div>
</div>
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine jcpmj">
<img v-show="String(ManipulatorInfoList[3].color_status) === '0'" src="../../../images/workshop/jcpmj_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '1'" src="../../../images/workshop/jcpmj_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '2'" src="../../../images/workshop/jcpmj_green.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '3'" src="../../../images/workshop/jcpmj_red.png" alt="">
</div>
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_630_2': String(ManipulatorInfoList[3].color_status) === '2'}" ref="jxs04" @click.stop="yjInfo('jxs', 4)">
<img v-show="String(ManipulatorInfoList[3].color_status) === '0'" src="../../../images/workshop/robot_2500_gray.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '1'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '2'" src="../../../images/workshop/robot_2500_green.png" alt="">
<img v-show="String(ManipulatorInfoList[3].color_status) === '3'" src="../../../images/workshop/robot_2500_red.png" alt="">
</div>
<div class="sh_machine elect_1 elect_2">
<img src="../../../images/workshop/elect.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[7].open_time}}</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 v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[8].open_time}}</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">
<img src="../../../images/workshop/blj.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine cyj_1">
<div class="cyj_img_wrap" ref="yj08" @click.stop="yjInfo('yj', 8)">
<p>{{ PressMachineList[7].device_name }}</p>
<img v-show="StackingPositionList[14].color_status === 0 && StackingPositionList[15].color_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="StackingPositionList[14].color_status === 1 && StackingPositionList[15].color_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="StackingPositionList[14].color_status !== StackingPositionList[15].color_status" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="StackingPositionList[14].color_status === 3 && StackingPositionList[15].color_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap" ref="yj09" @click.stop="yjInfo('yj', 9)">
<p>{{ PressMachineList[8].device_name }}</p>
<img v-show="StackingPositionList[16].color_status === 0 && StackingPositionList[17].color_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="StackingPositionList[16].color_status === 1 && StackingPositionList[17].color_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="StackingPositionList[16].color_status !== StackingPositionList[17].color_status" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="StackingPositionList[16].color_status === 3 && StackingPositionList[17].color_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1" ref="mpgw15" @click.stop="yjInfo('mpgw', 15)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[14].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[14].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw16" @click.stop="yjInfo('mpgw', 16)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[15].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[15].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_2">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3" ref="mpgw17" @click.stop="yjInfo('mpgw', 17)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[16].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[16].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_3">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4" ref="mpgw18" @click.stop="yjInfo('mpgw', 18)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[17].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[17].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_4">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_17">
<div class="sh_machine yyj">
<img src="../../../images/workshop/yj_2500_gray.png" alt="">
</div>
<div class="sh_machine wzm"></div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_2 yj_wrap_17">
<div class="sh_machine yyj">
<img src="../../../images/workshop/yj_2500_gray.png" alt="">
</div>
<div class="sh_machine wzm"></div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_15">
<div class="sh_machine cyj_1">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_13">
<div class="sh_machine cyj_1">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7 yj_wrap_12">
<div class="sh_machine cyj_1">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
</div>
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8 yj_wrap_10">
<div v-if="PressMachineList.length > 0" class="yj_info_wrap yj_info_wrap_1">
<div class="bg_line"></div>
<div class="yj_info">
<p><span>时间</span>{{PressMachineList[9].open_time}}</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">
<div class="cyj_img_wrap">
<img src="../../../images/workshop/yj_630_gray.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine cyj_1 cyj_2">
<div class="cyj_img_wrap" ref="yj10" @click.stop="yjInfo('yj', 10)">
<p>{{ PressMachineList[9].device_name }}</p>
<img v-show="StackingPositionList[18].color_status === 0 && StackingPositionList[19].color_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
<img v-show="StackingPositionList[18].color_status === 1 && StackingPositionList[19].color_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
<img v-show="StackingPositionList[18].color_status !== StackingPositionList[19].color_status" src="../../../images/workshop/yj_630_green.png" alt="">
<img v-show="StackingPositionList[18].color_status === 3 && StackingPositionList[19].color_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
</div>
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3" ref="mpgw20" @click.stop="yjInfo('mpgw', 20)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[19].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[19].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_3">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4" ref="mpgw19" @click.stop="yjInfo('mpgw', 19)">
<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_yellow.png" alt="">
<img v-show="StackingPositionList[18].color_status === 2" src="../../../images/workshop/ktp_green.png" alt="">
<img v-show="StackingPositionList[18].color_status === 3" src="../../../images/workshop/ktp_red.png" alt="">
</div>
<div v-else class="sh_machine kongtuopan_1 kongtuopan_4">
<img src="../../../images/workshop/ktp_gray.png" alt="">
</div>
<div class="sh_machine elect_1 elect_2">
<img src="../../../images/workshop/elect.png" alt="">
</div>
</div>
</div>
<div v-if="TrappedShelf40List.length > 0" class="machine_wrap kl_wrap_1">
<div v-for="(e,i) in TrappedShelf40List.slice(0, 20)" :key="i" class="sh_machine lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}" @click.stop="klhjInfo(e)">
<img v-show="String(e.point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(e.point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(e.point_status) === '2' && (String(e.stand_status) === '3' || String(e.stand_status) === '4')" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
<div v-if="e.point_code === pkId" class="popup_block_wraper popup_block_wraper_1">
<div class="foldline foldline_left"></div>
<div class="popup_bg">
<div class="popup_block">
<div class="pop_header">
<div class="pop_name">{{pkObj.point_name}}</div>
</div>
<div class="pop_content">
<div class="pop_item">
<div class="pop_label">状态</div>
<div class="pop_val">{{ pkObj.point_status_name }}</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.mix_num }}</div>
</div>
<div class="pop_item">
<div class="pop_label">重量</div>
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
<div class="pop_unit">kg</div>
</div>
<div class="pop_item">
<div class="pop_label">入库时间</div>
<div class="pop_val">{{ pkObj.instorage_time }}</div>
</div>
<div class="pop_item">
<div class="pop_label">静置</div>
<div class="pop_val">{{ pkObj.standing_time }}</div>
<div class="pop_unit">h</div>
</div>
</div>
</div>
</div>
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal1"></div>
</div>
</div>
</div>
<div v-if="TrappedShelf40List.length > 0" class="machine_wrap kl_wrap_1 kl_wrap_2">
<div v-for="(e,i) in TrappedShelf40List.slice(20)" :key="i" class="sh_machine lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}" @click.stop="klhjInfo(e)">
<img v-show="String(e.point_status) === '0'" src="../../../images/workshop/hj.png" alt="">
<img v-show="String(e.point_status) === '1'" src="../../../images/workshop/lz_hj_gray.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
<img v-show="String(e.point_status) === '2' && (String(e.stand_status) === '3' || String(e.stand_status) === '4')" src="../../../images/workshop/lz_hj_green.png" alt="">
<img v-show="String(e.point_status) === '2' && String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
<div v-if="e.point_code === pkId" class="popup_block_wraper popup_block_wraper_1">
<div class="foldline foldline_left"></div>
<div class="popup_bg">
<div class="popup_block">
<div class="pop_header">
<div class="pop_name">{{pkObj.point_name}}</div>
</div>
<div class="pop_content">
<div class="pop_item">
<div class="pop_label">状态</div>
<div class="pop_val">{{ pkObj.point_status_name }}</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.mix_num }}</div>
</div>
<div class="pop_item">
<div class="pop_label">重量</div>
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
<div class="pop_unit">kg</div>
</div>
<div class="pop_item">
<div class="pop_label">入库时间</div>
<div class="pop_val">{{ pkObj.instorage_time }}</div>
</div>
<div class="pop_item">
<div class="pop_label">静置</div>
<div class="pop_val">{{ pkObj.standing_time }}</div>
<div class="pop_unit">h</div>
</div>
</div>
</div>
</div>
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal1"></div>
</div>
</div>
</div>
</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 === 'yj' || machine === 'jxs'" class="pop_name">{{pkObj.device_name}}</div>
<div v-show="machine === 'mpgw'" class="pop_name">{{pkObj.point_name}}</div>
<div v-show="machine === 'yj' || machine === 'jxs'" 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 === 'yj'" class="pop_content">
<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.current_qty }}</div>
<div class="pop_unit"></div>
</div>
<div class="pop_item">
<div class="pop_label">当日物料种数</div>
<div class="pop_val pop_val_s">{{ pkObj.total_classify_material }}</div>
<div class="pop_unit"></div>
</div>
<div class="pop_item">
<div class="pop_label">当日累计生产</div>
<div class="pop_val pop_val_s">{{ pkObj.total_actual_quantity }}</div>
<div class="pop_unit"></div>
</div>
<div class="pop_item">
<div class="pop_label">当日累计合格数</div>
<div class="pop_val pop_val_s">{{ pkObj.total_qualified_qty }}</div>
<div class="pop_unit"></div>
</div>
<div class="pop_item">
<div class="pop_label">当日累计不合格数</div>
<div class="pop_val pop_val_s">{{ pkObj.total_unqualified_qty }}</div>
<div class="pop_unit"></div>
</div>
<div class="pop_item">
<div class="pop_label">当日累计托盘数</div>
<div class="pop_val pop_val_s">{{ pkObj.total_vehicle }}</div>
<div class="pop_unit"></div>
</div>
<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 === 'jxs'" 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 === 'mpgw'" class="pop_content">
<div class="pop_item">
<div class="pop_label">状态</div>
<div class="pop_val">{{ ['无货', '有货'][Number(pkObj.point_status)] }}</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.material_qty }}</div>
<div class="pop_unit"></div>
</div>
<div 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.is_full }}</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.stop="expandTooltip" v-text="expand ? '&gt;&gt;' : '&lt;&lt;'"></div>
<div class="tooltip_pages" :style="expand ? 'width: 300px' : 'width: 0'">
<router-link to="/setup" class="tooltip_page">配置</router-link>
<router-link to="/homepageone" class="tooltip_page">1</router-link>
<router-link to="/hnlkone" class="tooltip_page">2</router-link>
<div class="tooltip_page current_page pointer">3</div>
<router-link to="/firedryone" class="tooltip_page">4</router-link>
<router-link to="/sortpackone" class="tooltip_page">5</router-link>
<router-link to="/pdone" class="tooltip_page">6</router-link>
</div>
</div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: 0;top:0;"></div>
<div class="style_block" style="left: 0;top:calc(100% / 3);"></div>
<div class="style_block" style="background: green;left: 0;bottom: 0"></div>
</div>
</template>
<script>
import { workshopCondition, moldingMaterialCondition } from '@js/getData2'
import { trappedMaterialCondition } from '@js/getData0'
export default {
data () {
return {
interTime: this.$store.getters.setTime,
timer: null,
expand: false,
myCharts1: '',
myCharts2: '',
myCharts3: '',
PressMachineList: [], // 压机数据
TrappedShelfList: [], // 困料位料盅
StackingPositionList: [], // 压制码垛数据信息
TrappedMaterialShelfList: [], // 困料货架信息
ManipulatorInfoList: [], // 机械手数据
PressPopoverList: [], // 压机弹窗数据
ManipulatorList: [], // 机械手弹窗数据
TrayStationPopoverList: [], // 码盘工位弹窗数据
TrappedShelf40List: [], // 困料货架弹窗
showModal: false,
machine: '',
top: '',
left: '',
foldlineStyle: '',
pkObj: {},
pkId: ''
}
},
mounted () {
this._workshopCondition()
this._moldingMaterialCondition()
this._trappedMaterialCondition()
this.refresh()
},
beforeDestroy () {
clearInterval(this.timer)
},
methods: {
refresh () {
this.timer = setInterval(() => {
this._workshopCondition()
this._moldingMaterialCondition()
this._trappedMaterialCondition()
}, this.interTime)
},
async _workshopCondition () {
let res = await workshopCondition()
if (res.code === 200) {
if (res.result.hasOwnProperty('PressMachineList')) {
this.PressMachineList = [...res.result.PressMachineList]
}
if (res.result.hasOwnProperty('TrappedShelfList')) {
this.TrappedShelfList = [...res.result.TrappedShelfList]
}
if (res.result.hasOwnProperty('StackingPositionList')) {
this.StackingPositionList = [...res.result.StackingPositionList]
}
if (res.result.hasOwnProperty('TrappedMaterialShelfList')) {
this.TrappedMaterialShelfList = [...res.result.TrappedMaterialShelfList]
}
if (res.result.hasOwnProperty('ManipulatorInfoList')) {
this.ManipulatorInfoList = [...res.result.ManipulatorInfoList]
}
}
},
// 弹窗内容
async _moldingMaterialCondition () {
let res = await moldingMaterialCondition()
if (res.code === 200) {
if (res.result.hasOwnProperty('PressPopoverList')) {
this.PressPopoverList = [...res.result.PressPopoverList]
}
if (res.result.hasOwnProperty('ManipulatorList')) {
this.ManipulatorList = [...res.result.ManipulatorList]
}
if (res.result.hasOwnProperty('TrayStationPopoverList')) {
this.TrayStationPopoverList = [...res.result.TrayStationPopoverList]
}
}
},
// 困料货架弹窗
async _trappedMaterialCondition () {
let res = await trappedMaterialCondition()
if (res.code === 200) {
if (res.result.hasOwnProperty('TrappedShelf40List')) {
this.TrappedShelf40List = [...res.result.TrappedShelf40List]
}
}
},
expandTooltip () {
this.expand = !this.expand
},
closeModal () {
this.showModal = false
this.machine = ''
this.pkObj = {}
this.pkId = ''
},
yjInfo (m, type) {
this.machine = m
if (m === 'yj') {
if (!this.PressPopoverList.length) {
return
}
switch (type) {
case 1:
this.pkObj = this.PressPopoverList[0]
this.top = this.$refs.yj01.getBoundingClientRect().top + 36
this.left = this.$refs.yj01.getBoundingClientRect().left - 687
this.foldlineStyle = 'foldline_right'
break
case 2:
this.pkObj = this.PressPopoverList[1]
this.top = this.$refs.yj02.getBoundingClientRect().top + 36
this.left = this.$refs.yj02.getBoundingClientRect().left - 687
this.foldlineStyle = 'foldline_right'
break
case 3:
this.pkObj = this.PressPopoverList[2]
this.top = this.$refs.yj03.getBoundingClientRect().top - 17
this.left = this.$refs.yj03.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 4:
this.pkObj = this.PressPopoverList[3]
this.top = this.$refs.yj04.getBoundingClientRect().top - 17
this.left = this.$refs.yj04.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 5:
this.pkObj = this.PressPopoverList[4]
this.top = this.$refs.yj05.getBoundingClientRect().top - 17
this.left = this.$refs.yj05.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 6:
this.pkObj = this.PressPopoverList[5]
this.top = this.$refs.yj06.getBoundingClientRect().top - 17
this.left = this.$refs.yj06.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 7:
this.pkObj = this.PressPopoverList[6]
this.top = this.$refs.yj07.getBoundingClientRect().top - 17
this.left = this.$refs.yj07.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 8:
this.pkObj = this.PressPopoverList[7]
this.top = this.$refs.yj08.getBoundingClientRect().top - 17
this.left = this.$refs.yj08.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 9:
this.pkObj = this.PressPopoverList[8]
this.top = this.$refs.yj09.getBoundingClientRect().top - 17
this.left = this.$refs.yj09.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
case 10:
this.pkObj = this.PressPopoverList[9]
this.top = this.$refs.yj10.getBoundingClientRect().top - 17
this.left = this.$refs.yj10.getBoundingClientRect().left + 133
this.foldlineStyle = 'foldline_left'
break
}
}
if (m === 'jxs') {
if (!this.ManipulatorList.length) {
return
}
switch (type) {
case 1:
this.pkObj = this.ManipulatorList[0]
this.top = this.$refs.jxs01.getBoundingClientRect().top - 32
this.left = this.$refs.jxs01.getBoundingClientRect().left - 647
this.foldlineStyle = 'foldline_right'
break
case 2:
this.pkObj = this.ManipulatorList[1]
this.top = this.$refs.jxs02.getBoundingClientRect().top - 32
this.left = this.$refs.jxs02.getBoundingClientRect().left - 647
this.foldlineStyle = 'foldline_right'
break
case 3:
this.pkObj = this.ManipulatorList[2]
this.top = this.$refs.jxs03.getBoundingClientRect().top - 32
this.left = this.$refs.jxs03.getBoundingClientRect().left + 101
this.foldlineStyle = 'foldline_left'
break
case 4:
this.pkObj = this.ManipulatorList[3]
this.top = this.$refs.jxs04.getBoundingClientRect().top - 32
this.left = this.$refs.jxs04.getBoundingClientRect().left + 101
this.foldlineStyle = 'foldline_left'
break
}
}
if (m === 'mpgw') {
if (!this.TrayStationPopoverList.length) {
return
}
switch (type) {
case 1:
this.pkObj = this.TrayStationPopoverList[0]
this.top = this.$refs.mpgw01.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw01.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 2:
this.pkObj = this.TrayStationPopoverList[1]
this.top = this.$refs.mpgw02.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw02.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 3:
this.pkObj = this.TrayStationPopoverList[2]
this.top = this.$refs.mpgw03.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw03.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 4:
this.pkObj = this.TrayStationPopoverList[3]
this.top = this.$refs.mpgw04.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw04.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 5:
this.pkObj = this.TrayStationPopoverList[4]
this.top = this.$refs.mpgw05.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw05.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 6:
this.pkObj = this.TrayStationPopoverList[5]
this.top = this.$refs.mpgw06.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw06.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 7:
this.pkObj = this.TrayStationPopoverList[6]
this.top = this.$refs.mpgw07.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw07.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 8:
this.pkObj = this.TrayStationPopoverList[7]
this.top = this.$refs.mpgw08.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw08.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 9:
this.pkObj = this.TrayStationPopoverList[8]
this.top = this.$refs.mpgw09.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw09.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 10:
this.pkObj = this.TrayStationPopoverList[9]
this.top = this.$refs.mpgw10.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw10.getBoundingClientRect().left - 640
this.foldlineStyle = 'foldline_right'
break
case 11:
this.pkObj = this.TrayStationPopoverList[10]
this.top = this.$refs.mpgw11.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw11.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 12:
this.pkObj = this.TrayStationPopoverList[11]
this.top = this.$refs.mpgw12.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw12.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 13:
this.pkObj = this.TrayStationPopoverList[12]
this.top = this.$refs.mpgw13.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw13.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 14:
this.pkObj = this.TrayStationPopoverList[13]
this.top = this.$refs.mpgw14.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw14.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 15:
this.pkObj = this.TrayStationPopoverList[14]
this.top = this.$refs.mpgw15.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw15.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 16:
this.pkObj = this.TrayStationPopoverList[15]
this.top = this.$refs.mpgw16.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw16.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 17:
this.pkObj = this.TrayStationPopoverList[16]
this.top = this.$refs.mpgw17.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw17.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 18:
this.pkObj = this.TrayStationPopoverList[17]
this.top = this.$refs.mpgw18.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw18.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 19:
this.pkObj = this.TrayStationPopoverList[18]
this.top = this.$refs.mpgw19.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw19.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
case 20:
this.pkObj = this.TrayStationPopoverList[19]
this.top = this.$refs.mpgw20.getBoundingClientRect().top - 21
this.left = this.$refs.mpgw20.getBoundingClientRect().left + 112
this.foldlineStyle = 'foldline_left'
break
}
}
this.showModal = true
},
klhjInfo (e) {
this.pkId = this.pkId === e.point_code ? '' : e.point_code
this.pkObj = this.pkId === e.point_code ? e : {}
},
closeModal1 () {
this.pkId = ''
this.pkObj = {}
}
}
}
</script>
<style lang="stylus" scoped>
@import '~@css/mixin'
.n_container
position relative
_wh(100%, 100%)
overflow hidden
.n_header
position relative
z-index 0
_wh(100%, 8%)
_bis('../../../images/bg_header.jpg')
.n_header_h1
_wh(100%, 100%)
_fj(row, flex-end)
_bis('../../../images/top_left.png',auto,,right)
h1
_font(32px, 1, #fff,,right)
padding-bottom 2%
letter-spacing 6px
font-family "阿里妈妈数黑体" !important
margin-right -3px
.n_body_container
_wh(100%, 92%)
padding 40px 0 20px 20px
_bis('../../../images/bg_content_l.jpg')
.n_body_container_wraper
_wh(100%, 100%)
position relative
z-index 1
.center_content
_wh(100%, 100%)
position relative
z-index 0
.status_wrap
position absolute
top -26px
right 40px
z-index 1
_fj(row)
.status_item
_fj(row)
+.status_item
margin-left 20px
.status_tip
_wh(15px, 15px)
border-radius 50%
margin-right 10px
box-shadow 0px 0px 4px 0px rgba(33,121,195,0.88)
.status_name
_font(16px, 1, #fff)
.green
background-color $green2
.yellow
background-color $yellow
.gray
background-color $gray1
.red
background-color $orange
.machine_wrap
position absolute
z-index 2
.sh_machine
position absolute
top 0
left 0
z-index 3
width 100%
img
position absolute
top 0
left 0
z-index 4
_wh(100%, auto)
.kl_wrap_1
width 2%
height: 98%;
bottom: -33%;
left: auto;
right: 51.5%
transform: rotate(90deg);
.lz
position relative
_wh(100%,4.96%)
.mgt5
margin-top 75%
.kl_wrap_2
bottom -40%
.yaji_wrap
position: absolute;
left: 0;
top: 14%;
width: 98%;
height: 55%;
// 压机
.yj_wrap_1
width 10.801%
height 29.895%
// width: 15%;
// height: 41.5%;
transform rotate(90deg)
top: 5%
// left: 90.5%;
left 87%
.yj_info_wrap
position absolute
top 1%
left -112%
z-index 0
width 130%
_fj(row)
.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
transform rotate(270deg) translateY(100%)
p
_font(13px, 17px, #00ffff,,left)
border-bottom 0.5px solid #067272
span
color #fff
&:last-child
border none
.bg_line
_wh(28%, 1px)
background-color #03fcfd
.yyj
width 50%
cursor pointer
img
width: 83%;
left: 37%;
.wzm
_wh(50%, 41%)
background-color #d9d9d9
top auto
bottom 0
_fj(row,center)
p
_font(15px,17px,#333,,)
transform rotate(-90deg)
.jzjcss
width: 24%;
left: 51%;
top: 25%;
.weilan
width: 46%;
left: 54%;
top 37%
.robot
width 1%
height 1%
left: 75%;
top: 55%;
transform: rotate(-46deg)
img
width 2400%
top: -800%;
left: -2000%;
.kongtuopan_1
cursor pointer
_wh(12%, 12%)
top: 81%;
left: 61%;
.zhuan_qty
position absolute
bottom: -47px;
right: -49%;
z-index 8
_wh(50px, 20px)
background-color: #0ff;
border: 1px solid #0ff;
border-radius: 5px
transform: rotate(-90deg);
p
display block
_fj(row,center)
_wh(100%, 100%)
_font(13px, 13px, #fff,,center)
white-space nowrap
.zhuan_bg_arrow
position: absolute;
top: 3px;
right: -5px;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px
border-right-width: 0;
border-left-color: #0ff;
&:after
content: " ";
border-width: 5px;
.kongtuopan_2
left: 74%;
.elect_1
width: 10%;
height: 9%;
left: 74%;
top: 27%;
background-color #fff
_fj(row,center)
img
position static
_wh(50%, 100%)
.elect_2
left:86%
.yj_wrap_2
left: 71%
.robot
transform: rotate(-46deg)
.kongtuopan_1
top 31%
left 85%
img
transform rotate(90deg)
.zhuan_qty
bottom auto
top 0
right auto
left 20px
.zhuan_bg_arrow
border-color: transparent;
border-width: 5px;
border-top-width: 0;
border-bottom-color: #0ff;
top -5px
right 50%
transform: translateX(50%)
.kongtuopan_2
top 80%
.weilan
top 16%
.elect_2
top 9%
left: 89%;
.yj_wrap_3
left: 52.6%
.yj_info_wrap
top -10%
width 148%
.yj_info
width 63%
transform rotate(270deg) translateX(10%) translateY(100%)
.bg_line
width 37%
.yj_info_wrap_1
top 46%
left: -143%;
width 180%
.yj_info
width 51.8%
transform rotate(270deg) translateY(100%)
.bg_line
width 48.2%
.blj_1
width: 18%;
top: 14%;
left: 16%;
.blj_2
top 70%
.cyj_1
width 50%
height 50%
cursor pointer
.cyj_img_wrap
position absolute
_wh(28%, 91.49%)
left auto
right 0
_fj(row, center)
p
position relative
display block
z-index 7
_font(15px,17px,#333,,)
transform rotate(-90deg)
white-space nowrap
.cyj_2
top 50%
.cyj_img_wrap
top auto
bottom 0
.jzjcj_1
width 7%
height 50%
left 51%
img
top auto
bottom 5%
.jzjcj_2
top 50%
img
top 5%
.lmyzj
width: 13%;
left: 54%;
top: 33%;
.weilan
top 9%
.robot
left: 79%;
top: 49%;
transform: rotate(-4deg)
.kongtuopan_1
top: 21%
left: 64%;
.zhuan_qty
bottom auto
top -47px
.zhuan_bg_arrow
border-color: transparent;
border-width: 5px;
border-left-width: 0;
border-right-color: #0ff;
left: -5px;
right: auto;
.kongtuopan_2
left: 80%;
.kongtuopan_3
top: 64%
.zhuan_qty
bottom -47px
top auto
.zhuan_bg_arrow
border-color: transparent;
border-width: 5px;
border-right-width: 0;
border-left-color: #0ff;
left: auto;
right: -5px;
.kongtuopan_4
top: 64%
left: 80%;
.zhuan_qty
bottom -47px
top auto
.zhuan_bg_arrow
border-color: transparent;
border-width: 5px;
border-right-width: 0;
border-left-color: #0ff;
left: auto;
right: -5px;
.elect_2
top: 101%;
left: 38%;
.yj_wrap_5
left: 36%
.kongtuopan_1
top: 7%;
left: 64%;
img
transform rotate(90deg)
.kongtuopan_2
top 25%
.kongtuopan_3
top 62%
.kongtuopan_4
top 80%
.yj_wrap_7
left 18%
.yj_info_wrap
top 19%
.blj_1
top 42%
.cyj_1
top 25%
img
top 50%
transform translateY(-50%)
.weilan
top 15%
.robot
left: 75%
transform: rotate(15deg)
.kongtuopan_1
top 35%
left 90%
img
transform rotate(90deg)
.zhuan_qty
bottom auto
top -13px
right auto
left 20px
.zhuan_bg_arrow
border-color: transparent;
border-width: 5px;
border-top-width: 0;
border-bottom-color: #0ff;
top -5px
right 60%
left auto
.kongtuopan_2
top: 59%
.zhuan_qty
bottom -13px
top auto
.zhuan_bg_arrow
left 60%
right auto
.jcpmj
width: 18%;
top: 12%;
left: 57%;
.elect_2
top: 74%;
left: 38%;
.yj_wrap_8
left 3%
.yj_wrap_17
top 55%
.yyj
left auto
right 0
img
left auto
right 37%
transform rotate(180deg)
.wzm
left auto
right 0
.yj_wrap_15
top 55%
.cyj_1
left auto
right 0
.cyj_img_wrap
left 0
right auto
.yj_wrap_13
top 55%
.cyj_1
left auto
right 0
.cyj_img_wrap
left 0
right auto
.yj_wrap_12
top 55%
.cyj_1
left auto
right 0
.cyj_img_wrap
left 0
right auto
.yj_wrap_10
top 55%
.yj_info_wrap
left 63%
.yj_info
transform: rotate(270deg) translateY(-100%)
.cyj_1
left auto
right 0
.cyj_img_wrap
left 0
right auto
.kongtuopan_1
left auto
right 64%
img
transform rotate(-90deg)
.elect_2
top: 45%;
left: 52%;
.yjlz_wrap_1
width: 1.365%;
height: 17%;
top: 4%;
right: 8.8%;
transform rotate(90deg);
.lz_1
_wh(100%, 19.011%)
.lz_2
&:nth-child(2)
top 43%
&:nth-child(3)
top 62%
&:nth-child(4)
top 81%
.yjlz_wrap_2
right 24.5%
.yjlz_wrap_3
right 42%
.lz_1
top 50%
transform translateY(-50%)
.yjlz_wrap_5
right: 58.8%;
.lz_1
top 50%
transform translateY(-50%)
.yjlz_wrap_7
right: 76.5%
.lz_1
top 50%
transform translateY(-50%)
.yjlz_wrap_8
right: 91%;
.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)
}
10% {
transform: rotateZ(-46deg)
}
20% {
transform: rotateZ(-46deg)
}
90% {
transform: rotateZ(-115deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-115deg) rotateY(0deg)
}
}
@keyframes rotate_2500_2 {
0% {
transform: rotateZ(-46deg)
}
10% {
transform: rotateZ(-46deg)
}
20% {
transform: rotateZ(-46deg)
}
90% {
transform: rotateZ(-120deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-120deg) rotateY(0deg)
}
}
@keyframes rotate_630_1 {
0% {
transform: rotateZ(-4deg)
}
10% {
transform: rotateZ(-4deg)
}
20% {
transform: rotateZ(-20deg)
}
90% {
transform: rotateZ(-115deg) rotateY(-30deg)
}
100% {
transform: rotateZ(-115deg) rotateY(0deg)
}
}
@keyframes rotate_630_2 {
0% {
transform: rotateZ(150deg) rotateY(-30deg)
}
10% {
transform: rotateZ(150deg) rotateY(0deg)
}
50% {
transform: rotateZ(70deg) rotateY(-30deg)
}
60% {
transform: rotateZ(70deg) rotateY(0deg)
}
90% {
transform: rotateZ(15deg)
}
100% {
transform: rotateZ(15deg)
}
}
.popup_block_wraper_1
position absolute
top: -1029%;
left: -828%
z-index 10
transform rotate(-90deg)
.foldline_left
transform rotate(0deg)
top 34%
</style>