895 lines
32 KiB
Vue
895 lines
32 KiB
Vue
<template>
|
|
<div 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 class="machine_wrap lz_wrap_3">
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div v-for="(e,i) in [1,2,3]" :key="i" class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div v-for="(e,i) in [1,2,3]" :key="i" class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="lz_boxs">
|
|
<div class="lz">
|
|
<img src="../../../images/workshop/lz.png" alt="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="yaji_wrap">
|
|
<div class="machine_wrap yj_wrap_1">
|
|
<div class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[0].device_status === 0" src="../../../images/workshop/yj_2500_gray.png" alt="">
|
|
<img v-show="PressMachineList[0].device_status === 1" src="../../../images/workshop/yj_2500_yellow.png" alt="">
|
|
<img v-show="PressMachineList[0].device_status === 2" src="../../../images/workshop/yj_2500_green.png" alt="">
|
|
<img v-show="PressMachineList[0].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine wzm"></div>
|
|
<div class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine robot">
|
|
<img src="../../../images/workshop/robot_2500_green.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 class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[1].device_status === 0" src="../../../images/workshop/yj_2500_gray.png" alt="">
|
|
<img v-show="PressMachineList[1].device_status === 1" src="../../../images/workshop/yj_2500_yellow.png" alt="">
|
|
<img v-show="PressMachineList[1].device_status === 2" src="../../../images/workshop/yj_2500_green.png" alt="">
|
|
<img v-show="PressMachineList[1].device_status === 3" src="../../../images/workshop/yj_2500_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine wzm"></div>
|
|
<div class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine robot">
|
|
<img src="../../../images/workshop/robot_2500_green.png" alt="">
|
|
</div>
|
|
<div class="sh_machine block_1 block_2">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3">
|
|
<div class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<div class="bg_line"></div>
|
|
</div>
|
|
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[2].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[2].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[2].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[2].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
|
|
<img v-show="PressMachineList[3].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[3].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[3].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[3].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</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 class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_3">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_4">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine robot">
|
|
<img src="../../../images/workshop/robot_2500_green.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5">
|
|
<div class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<div class="bg_line"></div>
|
|
</div>
|
|
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[4].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[4].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[4].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[4].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
|
|
<img v-show="PressMachineList[5].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[5].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[5].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[5].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_3">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_4">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7">
|
|
<div class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[6].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[6].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[6].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[6].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine weilan">
|
|
<img src="../../../images/workshop/weilan_6.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine jcpmj">
|
|
<img src="../../../images/workshop/jcpmj.png" alt="">
|
|
</div>
|
|
<div class="sh_machine robot">
|
|
<img src="../../../images/workshop/robot_2500_green.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8">
|
|
<div class="sh_machine yj_info_wrap">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<div class="bg_line"></div>
|
|
</div>
|
|
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<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">
|
|
<img v-show="PressMachineList[7].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[7].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[7].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[7].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
|
|
<img v-show="PressMachineList[8].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[8].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[8].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[8].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_2">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_3">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_4">
|
|
<img src="../../../images/workshop/ktp.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">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
<div class="sh_machine cyj_1 cyj_2">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_13">
|
|
<div class="sh_machine cyj_1">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
<div class="sh_machine cyj_1 cyj_2">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_7 yj_wrap_12">
|
|
<div class="sh_machine cyj_1">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap yj_wrap_1 yj_wrap_3 yj_wrap_5 yj_wrap_8 yj_wrap_10">
|
|
<div class="sh_machine yj_info_wrap yj_info_wrap_1">
|
|
<p>2023-6-10</p>
|
|
<p>成品1</p>
|
|
<p>367</p>
|
|
<div class="bg_line"></div>
|
|
</div>
|
|
<div class="sh_machine cyj_1">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
<div v-if="PressMachineList.length > 0" class="sh_machine cyj_1 cyj_2">
|
|
<img v-show="PressMachineList[9].device_status === 0" src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
<img v-show="PressMachineList[9].device_status === 1" src="../../../images/workshop/yj_630_yellow.png" alt="">
|
|
<img v-show="PressMachineList[9].device_status === 2" src="../../../images/workshop/yj_630_green.png" alt="">
|
|
<img v-show="PressMachineList[9].device_status === 3" src="../../../images/workshop/yj_630_red.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_3">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
<div class="sh_machine kongtuopan_1 kongtuopan_4">
|
|
<img src="../../../images/workshop/ktp.png" alt="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1 mtp_wrap_2">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1 mtp_wrap_3">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1 mtp_wrap_4">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1 mtp_wrap_5">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="machine_wrap mtp_wrap_1 mtp_wrap_6">
|
|
<div class="mtp" v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i">
|
|
<img src="../../../images/workshop/yj_630_gray.png" alt="">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { workshopCondition } from '@js/getData2'
|
|
export default {
|
|
data () {
|
|
return {
|
|
interTime: this.$store.getters.setTime,
|
|
timer: null,
|
|
myCharts1: '',
|
|
myCharts2: '',
|
|
myCharts3: '',
|
|
PressMachineList: [], // 压机数据
|
|
MixMachineList: [], // 混料机数据
|
|
MixBlankingList: [], // 混料机下料位
|
|
TrappedShelfList: [] // 困料位料盅
|
|
}
|
|
},
|
|
mounted () {
|
|
this._workshopCondition()
|
|
// this.refresh()
|
|
},
|
|
beforeDestroy () {
|
|
clearInterval(this.timer)
|
|
},
|
|
methods: {
|
|
refresh () {
|
|
this.timer = setInterval(() => {
|
|
this._workshopCondition()
|
|
}, 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]
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
@import '~@css/mixin'
|
|
.n_container
|
|
_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 0
|
|
.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)
|
|
.mtp_wrap_1
|
|
width 1.5%
|
|
height 7.4%
|
|
top: 72%;
|
|
right: 3.6%;
|
|
transform rotate(90deg)
|
|
.mtp
|
|
width 100%
|
|
img
|
|
_wh(100%, auto)
|
|
.mtp_wrap_2
|
|
top 76%
|
|
.mtp_wrap_3
|
|
top 86%
|
|
.mtp_wrap_4
|
|
top 90%
|
|
.mtp_wrap_5
|
|
right 27%
|
|
top 86%
|
|
.mtp_wrap_6
|
|
right 27%
|
|
top 90%
|
|
.lz_wrap_3
|
|
width 2%
|
|
height 100%
|
|
top: -46%;
|
|
right: 26%;
|
|
transform rotate(90deg)
|
|
.lz_boxs
|
|
position relative
|
|
top 0
|
|
left 0
|
|
_wh(100%, 100%)
|
|
.lz
|
|
width 100%
|
|
img
|
|
_wh(100%, auto)
|
|
&:nth-child(1)
|
|
height: 8%;
|
|
&:nth-child(2)
|
|
height: 17%;
|
|
&:nth-child(3)
|
|
height: 8%;
|
|
&:nth-child(4)
|
|
height: 30%;
|
|
&:nth-child(5)
|
|
height: 13%;
|
|
left: 200%
|
|
&:nth-child(6)
|
|
height: 26%;
|
|
left: 100%
|
|
&:nth-child(7)
|
|
height: 53%;
|
|
left: 200%
|
|
&:nth-child(8)
|
|
height: 26%;
|
|
left: 200%
|
|
&:nth-child(9)
|
|
height: 8%;
|
|
left: 200%
|
|
.yaji_wrap
|
|
position: absolute;
|
|
left: 0;
|
|
top: 15%;
|
|
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: 4.4%;
|
|
// left: 90.5%;
|
|
left 87%
|
|
.yj_info_wrap
|
|
display none
|
|
width 60%
|
|
top: 0
|
|
left: -77%
|
|
padding: 5px
|
|
_bis('../../../images/workshop/txtbg.png')
|
|
p
|
|
_font(14px, 16px, #fff,,right)
|
|
.bg_line
|
|
position absolute
|
|
_wh(67%, 2px)
|
|
background-color #03fcfd
|
|
right -100%
|
|
top 50%
|
|
transform translate(-50%)
|
|
.yyj
|
|
width 50%
|
|
img
|
|
width: 83%;
|
|
left: 37%;
|
|
.wzm
|
|
_wh(50%, 41%)
|
|
background-color #d9d9d9
|
|
top auto
|
|
bottom 0
|
|
.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%;
|
|
.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
|
|
animation rotate_630_1 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: 54%
|
|
.yj_info_wrap
|
|
top -10%
|
|
.bg_line
|
|
width: 100%;
|
|
right: -150%;
|
|
.yj_info_wrap_1
|
|
top 46%
|
|
.blj_1
|
|
width: 18%;
|
|
top: 14%;
|
|
left: 16%;
|
|
.blj_2
|
|
top 70%
|
|
.cyj_1
|
|
width 50%
|
|
height 50%
|
|
img
|
|
width 28%
|
|
left auto
|
|
right 0
|
|
.cyj_2
|
|
top 50%
|
|
img
|
|
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%;
|
|
.kongtuopan_1
|
|
top: 21%
|
|
left: 64%;
|
|
.kongtuopan_2
|
|
left: 80%;
|
|
.kongtuopan_3
|
|
top: 64%
|
|
.kongtuopan_4
|
|
top: 64%
|
|
left: 80%;
|
|
.yj_wrap_5
|
|
left: 37%
|
|
.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 22%
|
|
.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 8%
|
|
.yj_wrap_17
|
|
top 54%
|
|
.yyj
|
|
left auto
|
|
right 0
|
|
img
|
|
left auto
|
|
right 37%
|
|
transform rotate(180deg)
|
|
.wzm
|
|
left auto
|
|
right 0
|
|
.yj_wrap_15
|
|
top 54%
|
|
.cyj_1
|
|
left auto
|
|
right 0
|
|
img
|
|
left 0
|
|
right auto
|
|
.yj_wrap_13
|
|
top 54%
|
|
.cyj_1
|
|
left auto
|
|
right 0
|
|
img
|
|
left 0
|
|
right auto
|
|
.yj_wrap_12
|
|
top 54%
|
|
.cyj_1
|
|
left auto
|
|
right 0
|
|
img
|
|
left 0
|
|
right auto
|
|
.yj_wrap_10
|
|
top 54%
|
|
.yj_info_wrap_1
|
|
left auto
|
|
right -81%
|
|
_bis('../../../images/workshop/txtbg1.png')
|
|
p
|
|
text-align left
|
|
.bg_line
|
|
left -50%
|
|
.cyj_1
|
|
left auto
|
|
right 0
|
|
img
|
|
left 0
|
|
right auto
|
|
.kongtuopan_1
|
|
left auto
|
|
right 64%
|
|
transform rotate(-90deg)
|
|
@keyframes rotate_2500_1 {
|
|
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(-46deg)
|
|
}
|
|
10% {
|
|
transform: rotateZ(-46deg)
|
|
}
|
|
20% {
|
|
transform: rotateZ(-46deg)
|
|
}
|
|
90% {
|
|
transform: rotateZ(-90deg)
|
|
}
|
|
100% {
|
|
transform: rotateZ(-90deg)
|
|
}
|
|
}
|
|
@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>
|