1421 lines
68 KiB
Vue
1421 lines
68 KiB
Vue
<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>
|
||
<div class="center_content">
|
||
<div v-if="TrappedShelfList.length > 0" class="machine_wrap yjlz_wrap_1">
|
||
<div class="sh_machine lz_1">
|
||
<img :class="TrappedShelfList[0].point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt="">
|
||
</div>
|
||
<div class="sh_machine lz_1 lz_2">
|
||
<img v-for="(e,i) in TrappedShelfList.slice(1, 4)" :key="i" src="../../../images/workshop/lz.png" alt="" :class="e.point_status === '0' ? 'hidden': ''">
|
||
</div>
|
||
</div>
|
||
<div v-if="TrappedShelfList.length > 0" class="machine_wrap yjlz_wrap_1 yjlz_wrap_2">
|
||
<div class="sh_machine lz_1">
|
||
<img :class="TrappedShelfList[4].point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt="">
|
||
</div>
|
||
<div class="sh_machine lz_1 lz_2">
|
||
<img v-for="(e,i) in TrappedShelfList.slice(5)" :key="i" src="../../../images/workshop/lz.png" alt="" :class="e.point_status === '0' ? 'hidden': ''">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_3">
|
||
<div class="sh_machine lz_1">
|
||
<img src="../../../images/workshop/lz.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_5">
|
||
<div class="sh_machine lz_1">
|
||
<img src="../../../images/workshop/lz.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_7">
|
||
<div class="sh_machine lz_1">
|
||
<img src="../../../images/workshop/lz.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yjlz_wrap_1 yjlz_wrap_8">
|
||
<div class="sh_machine lz_1">
|
||
<img src="../../../images/workshop/lz.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 class="sh_machine jzjcss">
|
||
<img src="../../../images/workshop/jzjcss_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="PressMachineList.length > 0" class="sh_machine yyj" ref="yj01" @click.stop="yjInfo('yj', 1)">
|
||
<img v-show="String(PressMachineList[0].device_status) === '0'" src="../../../images/workshop/yj_2500_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[0].device_status) === '1'" src="../../../images/workshop/yj_2500_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[0].device_status) === '2'" src="../../../images/workshop/yj_2500_green.png" alt="">
|
||
<img v-show="String(PressMachineList[0].device_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[0].color_status) === '0'" src="../../../images/workshop/ktp_gray.png" alt="">
|
||
<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>
|
||
<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[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>
|
||
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_2500_1': String(ManipulatorInfoList[0].color_status) === '1'}" 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_green.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[0].color_status) === '2'" src="../../../images/workshop/robot_2500_red.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[0].color_status) === '3'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
|
||
</div>
|
||
<div class="sh_machine block_1">
|
||
</div>
|
||
<div class="sh_machine block_1 block_2">
|
||
</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 class="sh_machine jzjcss">
|
||
<img src="../../../images/workshop/jzjcss_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="PressMachineList.length > 0" class="sh_machine yyj" ref="yj02" @click.stop="yjInfo('yj', 2)">
|
||
<img v-show="String(PressMachineList[1].device_status) === '0'" src="../../../images/workshop/yj_2500_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[1].device_status) === '1'" src="../../../images/workshop/yj_2500_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[1].device_status) === '2'" src="../../../images/workshop/yj_2500_green.png" alt="">
|
||
<img v-show="String(PressMachineList[1].device_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_green.png" alt="">
|
||
<img v-show="StackingPositionList[2].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[2].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[3].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[3].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_2500_2': String(ManipulatorInfoList[1].color_status) === '1'}" 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_green.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[1].color_status) === '2'" src="../../../images/workshop/robot_2500_red.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[1].color_status) === '3'" src="../../../images/workshop/robot_2500_yellow.png" alt="">
|
||
</div>
|
||
<div class="sh_machine block_1 block_2">
|
||
</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="PressMachineList.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(PressMachineList[2].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[2].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[2].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[2].device_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div v-if="PressMachineList.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(PressMachineList[3].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[3].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[3].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[3].device_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 class="sh_machine jzjcj_1">
|
||
<img src="../../../images/workshop/jzjcj_630.png" alt="">
|
||
</div>
|
||
<div class="sh_machine jzjcj_1 jzjcj_2">
|
||
<img src="../../../images/workshop/jzjcj_630.png" alt="">
|
||
</div>
|
||
<div class="sh_machine lmyzj">
|
||
<img src="../../../images/workshop/lmyzj_630.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[4].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
|
||
<img v-show="StackingPositionList[4].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
|
||
<img v-show="StackingPositionList[4].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[4].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_2" ref="mpgw06" @click.stop="yjInfo('mpgw', 6)">
|
||
<img v-show="StackingPositionList[5].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
|
||
<img v-show="StackingPositionList[5].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
|
||
<img v-show="StackingPositionList[5].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[5].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_3" ref="mpgw07" @click.stop="yjInfo('mpgw', 7)">
|
||
<img v-show="StackingPositionList[6].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
|
||
<img v-show="StackingPositionList[6].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
|
||
<img v-show="StackingPositionList[6].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[6].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="StackingPositionList.length > 0" class="sh_machine kongtuopan_1 kongtuopan_4" ref="mpgw08" @click.stop="yjInfo('mpgw', 8)">
|
||
<img v-show="StackingPositionList[7].color_status === 0" src="../../../images/workshop/ktp_gray.png" alt="">
|
||
<img v-show="StackingPositionList[7].color_status === 1" src="../../../images/workshop/ktp_green.png" alt="">
|
||
<img v-show="StackingPositionList[7].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[7].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_630_1': String(ManipulatorInfoList[2].color_status) === '1'}" 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_green.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[2].color_status) === '2'" src="../../../images/workshop/robot_2500_red.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[2].color_status) === '3'" src="../../../images/workshop/robot_2500_yellow.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="PressMachineList.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="String(PressMachineList[4].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[4].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[4].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[4].device_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div v-if="PressMachineList.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="String(PressMachineList[5].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[5].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[5].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[5].device_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_green.png" alt="">
|
||
<img v-show="StackingPositionList[8].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[8].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[9].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[9].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[10].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[10].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[11].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[11].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7">
|
||
<div 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="PressMachineList.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(PressMachineList[6].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[6].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[6].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[6].device_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_green.png" alt="">
|
||
<img v-show="StackingPositionList[12].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[12].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[13].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[13].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div class="sh_machine jcpmj">
|
||
<img src="../../../images/workshop/jcpmj.png" alt="">
|
||
</div>
|
||
<div v-if="ManipulatorInfoList.length > 0" class="sh_machine robot pointer" :class="{'rotate_630_2': String(ManipulatorInfoList[3].color_status) === '1'}" 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_green.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[3].color_status) === '2'" src="../../../images/workshop/robot_2500_red.png" alt="">
|
||
<img v-show="String(ManipulatorInfoList[3].color_status) === '3'" src="../../../images/workshop/robot_2500_yellow.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="PressMachineList.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="String(PressMachineList[7].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[7].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[7].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[7].device_status) === '3'" src="../../../images/workshop/yj_630_red.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div v-if="PressMachineList.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="String(PressMachineList[8].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[8].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[8].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[8].device_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_green.png" alt="">
|
||
<img v-show="StackingPositionList[14].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[14].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[15].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[15].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[16].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[16].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[17].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[17].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="machine_wrap yj_wrap_1 yj_wrap_17">
|
||
<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="PressMachineList.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="String(PressMachineList[9].device_status) === '0'" src="../../../images/workshop/yj_630_gray.png" alt="">
|
||
<img v-show="String(PressMachineList[9].device_status) === '1'" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
||
<img v-show="String(PressMachineList[9].device_status) === '2'" src="../../../images/workshop/yj_630_green.png" alt="">
|
||
<img v-show="String(PressMachineList[9].device_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_green.png" alt="">
|
||
<img v-show="StackingPositionList[19].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[19].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
<div 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_green.png" alt="">
|
||
<img v-show="StackingPositionList[18].color_status === 2" src="../../../images/workshop/ktp_red.png" alt="">
|
||
<img v-show="StackingPositionList[18].color_status === 3" src="../../../images/workshop/ktp_yellow.png" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-if="TrappedMaterialShelfList.length > 0" class="machine_wrap kl_wrap_1">
|
||
<div v-for="(e,i) in TrappedMaterialShelfList.slice(0, 20)" :key="i" class="lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
|
||
<img v-show="String(e.stand_status_color) === '0'" src="../../../images/workshop/hj.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '1'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '2'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '3'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||
</div>
|
||
</div>
|
||
<div v-if="TrappedMaterialShelfList.length > 0" class="machine_wrap kl_wrap_1 kl_wrap_2">
|
||
<div v-for="(e,i) in TrappedMaterialShelfList.slice(20)" :key="i" class="lz" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
|
||
<img v-show="String(e.stand_status_color) === '0'" src="../../../images/workshop/hj.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '1'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '2'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||
<img v-show="String(e.stand_status_color) === '3'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||
</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) - 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.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 ? '>>' : '<<'"></div>
|
||
<div class="tooltip_pages" :style="expand ? 'width: 240px' : 'width: 0'">
|
||
<div class="tooltip_page pointer" @click.stop="toJumpPage(1)">1</div>
|
||
<div class="tooltip_page pointer" @click.stop="toJumpPage(2)">2</div>
|
||
<div class="tooltip_page current_page pointer" @click.stop="toJumpPage(3)">3</div>
|
||
<div class="tooltip_page pointer" @click.stop="toJumpPage(4)">4</div>
|
||
<div class="tooltip_page pointer" @click.stop="toJumpPage(5)">5</div>
|
||
<div class="tooltip_page pointer" @click.stop="toJumpPage(6)">6</div>
|
||
</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'
|
||
export default {
|
||
data () {
|
||
return {
|
||
interTime: this.$store.getters.setTime,
|
||
timer: null,
|
||
expand: false,
|
||
myCharts1: '',
|
||
myCharts2: '',
|
||
myCharts3: '',
|
||
PressMachineList: [], // 压机数据
|
||
MixMachineList: [], // 混料机数据
|
||
MixBlankingList: [], // 混料机下料位
|
||
TrappedShelfList: [], // 困料位料盅
|
||
StackingPositionList: [], // 压制码垛数据信息
|
||
TrappedMaterialShelfList: [], // 困料货架信息
|
||
ManipulatorInfoList: [], // 机械手数据
|
||
PressPopoverList: [], // 压机弹窗数据
|
||
ManipulatorList: [], // 机械手弹窗数据
|
||
TrayStationPopoverList: [], // 码盘工位弹窗数据
|
||
showModal: false,
|
||
machine: '',
|
||
top: '',
|
||
left: '',
|
||
foldlineStyle: '',
|
||
pkObj: {}
|
||
}
|
||
},
|
||
mounted () {
|
||
this._workshopCondition()
|
||
this._moldingMaterialCondition()
|
||
// this.refresh()
|
||
},
|
||
beforeDestroy () {
|
||
clearInterval(this.timer)
|
||
},
|
||
methods: {
|
||
refresh () {
|
||
this.timer = setInterval(() => {
|
||
this._workshopCondition()
|
||
this._moldingMaterialCondition()
|
||
}, this.interTime)
|
||
},
|
||
async _workshopCondition () {
|
||
let res = await workshopCondition()
|
||
if (res.code === 200) {
|
||
this.PressMachineList = [...res.result.PressMachineList]
|
||
this.MixMachineList = [...res.result.MixMachineList]
|
||
this.MixBlankingList = [...res.result.MixBlankingList]
|
||
this.TrappedShelfList = [...res.result.TrappedShelfList]
|
||
this.StackingPositionList = [...res.result.StackingPositionList]
|
||
this.TrappedMaterialShelfList = [...res.result.TrappedMaterialShelfList]
|
||
this.ManipulatorInfoList = [...res.result.ManipulatorInfoList]
|
||
}
|
||
},
|
||
// 弹窗内容
|
||
async _moldingMaterialCondition () {
|
||
let res = await moldingMaterialCondition()
|
||
if (res.code === 200) {
|
||
this.PressPopoverList = [...res.result.PressPopoverList]
|
||
this.ManipulatorList = [...res.result.ManipulatorList]
|
||
this.TrayStationPopoverList = [...res.result.TrayStationPopoverList]
|
||
}
|
||
},
|
||
expandTooltip () {
|
||
this.expand = !this.expand
|
||
},
|
||
toJumpPage (type) {
|
||
switch (type) {
|
||
case 1:
|
||
this.$router.push('/homepageone')
|
||
break
|
||
case 2:
|
||
this.$router.push('/hnlkone')
|
||
break
|
||
case 3:
|
||
break
|
||
case 4:
|
||
this.$router.push('/firedryone')
|
||
break
|
||
case 5:
|
||
this.$router.push('/sortpackone')
|
||
break
|
||
case 6:
|
||
this.$router.push('/pdone')
|
||
break
|
||
}
|
||
},
|
||
closeModal () {
|
||
this.showModal = false
|
||
this.pkObj = {}
|
||
},
|
||
yjInfo (m, type) {
|
||
this.machine = m
|
||
if (!this.PressPopoverList.length) {
|
||
return
|
||
}
|
||
if (m === 'yj') {
|
||
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') {
|
||
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') {
|
||
switch (type) {
|
||
case 1:
|
||
this.pkObj = this.TrayStationPopoverList[0]
|
||
this.top = this.$refs.mpgw01.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw01.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 2:
|
||
this.pkObj = this.PressPopoverList[1]
|
||
this.top = this.$refs.mpgw02.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw02.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 3:
|
||
this.pkObj = this.PressPopoverList[2]
|
||
this.top = this.$refs.mpgw03.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw03.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 4:
|
||
this.pkObj = this.PressPopoverList[3]
|
||
this.top = this.$refs.mpgw04.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw04.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 5:
|
||
this.pkObj = this.PressPopoverList[4]
|
||
this.top = this.$refs.mpgw05.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw05.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 6:
|
||
this.pkObj = this.PressPopoverList[5]
|
||
this.top = this.$refs.mpgw06.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw06.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 7:
|
||
this.pkObj = this.PressPopoverList[6]
|
||
this.top = this.$refs.mpgw07.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw07.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 8:
|
||
this.pkObj = this.PressPopoverList[7]
|
||
this.top = this.$refs.mpgw08.getBoundingClientRect().top - 21
|
||
this.left = this.$refs.mpgw08.getBoundingClientRect().left - 657
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 9:
|
||
this.pkObj = this.PressPopoverList[8]
|
||
this.top = this.$refs.mpgw09.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw09.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 10:
|
||
this.pkObj = this.PressPopoverList[9]
|
||
this.top = this.$refs.mpgw10.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw10.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 11:
|
||
this.pkObj = this.PressPopoverList[10]
|
||
this.top = this.$refs.mpgw11.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw11.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
case 12:
|
||
this.pkObj = this.PressPopoverList[11]
|
||
this.top = this.$refs.mpgw12.getBoundingClientRect().top - 40
|
||
this.left = this.$refs.mpgw12.getBoundingClientRect().left - 635
|
||
this.foldlineStyle = 'foldline_right'
|
||
break
|
||
}
|
||
}
|
||
this.showModal = true
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="stylus" scoped>
|
||
@import '~@css/mixin'
|
||
.n_container
|
||
position relative
|
||
_wh(100%, 100%)
|
||
overflow hidden
|
||
.n_header
|
||
_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: 57.5%;
|
||
transform: rotate(90deg);
|
||
.lz
|
||
position relative
|
||
width 100%
|
||
height 4.4%
|
||
img
|
||
position absolute
|
||
_wh(100%, 100%)
|
||
.mgt5
|
||
margin-top 45%
|
||
.kl_wrap_2
|
||
bottom -40%
|
||
.yaji_wrap
|
||
position: absolute;
|
||
left: 0;
|
||
top: 14%;
|
||
width: 98%;
|
||
height: 55%;
|
||
// 压机
|
||
.yyj_wrap_1
|
||
width 10.801%
|
||
height 29.895%
|
||
transform rotate(90deg)
|
||
top: 4.4%;
|
||
left: 90.5%;
|
||
.yyj_wrap_2
|
||
left: 80%;
|
||
.cyj_wrap_1
|
||
left 70%
|
||
.cyj_wrap_2
|
||
left 60%
|
||
.cyj_wrap_3
|
||
left 50%
|
||
.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)
|
||
animation rotate_2500_1 1.5s linear 1.5s infinite alternate-reverse
|
||
img
|
||
width 2400%
|
||
top: -800%;
|
||
left: -2000%;
|
||
.kongtuopan_1
|
||
width: 12%;
|
||
top: 81%;
|
||
left: 61%;
|
||
cursor pointer
|
||
.kongtuopan_2
|
||
left: 74%;
|
||
.block_1
|
||
width: 10%;
|
||
height: 9%;
|
||
left: 74%;
|
||
top: 27%;
|
||
background-color #fff
|
||
.block_2
|
||
left:86%
|
||
.yj_wrap_2
|
||
left: 71%
|
||
.robot
|
||
transform: rotate(-46deg)
|
||
animation rotate_2500_2 1.5s linear 1.5s infinite alternate-reverse
|
||
.kongtuopan_1
|
||
top 37%
|
||
left 85%
|
||
transform rotate(90deg)
|
||
.kongtuopan_2
|
||
top 76%
|
||
.weilan
|
||
top 16%
|
||
.block_2
|
||
top 9%
|
||
left: 89%;
|
||
.yj_wrap_3
|
||
left: 53%
|
||
.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 6%
|
||
.robot
|
||
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%;
|
||
.kongtuopan_2
|
||
left: 80%;
|
||
.kongtuopan_3
|
||
top: 64%
|
||
.kongtuopan_4
|
||
top: 64%
|
||
left: 80%;
|
||
.yj_wrap_5
|
||
left: 36%
|
||
.kongtuopan_1
|
||
top: 14%;
|
||
left: 64%;
|
||
transform rotate(90deg)
|
||
.kongtuopan_2
|
||
top 30%
|
||
.kongtuopan_3
|
||
top 70%
|
||
.kongtuopan_4
|
||
top 86%
|
||
.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);
|
||
animation rotate_630_2 3s linear 1.5s infinite alternate-reverse
|
||
.kongtuopan_1
|
||
top 43%
|
||
left 90%
|
||
transform rotate(90deg)
|
||
.kongtuopan_2
|
||
top: 63%
|
||
.jcpmj
|
||
width: 18%;
|
||
top: 12%;
|
||
left: 57%;
|
||
.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%
|
||
transform rotate(-90deg)
|
||
.yjlz_wrap_1
|
||
width: 1.365%;
|
||
height: 17%;
|
||
top: 4%;
|
||
right: 8.8%;
|
||
transform rotate(90deg);
|
||
.lz_1
|
||
width 100%
|
||
img
|
||
position relative
|
||
.lz_2
|
||
top auto
|
||
bottom 0
|
||
.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%)
|
||
@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)
|
||
}
|
||
}
|
||
</style>
|