1417 lines
47 KiB
Vue
1417 lines
47 KiB
Vue
<template>
|
||
<section>
|
||
<t-header index='0'></t-header>
|
||
<div class="content clearfix">
|
||
<div class="fl block_left">
|
||
<div class="item_block block_1">
|
||
<div class="border-top"></div>
|
||
<div class="dot_top"></div>
|
||
<div class="echart_item">
|
||
<div id="echart_d1" style="width: 100%;height:100%;"></div>
|
||
</div>
|
||
</div>
|
||
<div class="item_block block_1">
|
||
<div class="border-top"></div>
|
||
<div class="dot_top"></div>
|
||
<div class="echart_item">
|
||
<div id="echart_d2" style="width: 100%;height:100%;"></div>
|
||
</div>
|
||
</div>
|
||
<div class="item_block block_2">
|
||
<div class="border-top"></div>
|
||
<div class="dot_top"></div>
|
||
<h2>最近五个故障设备</h2>
|
||
<div class="scroll_item">
|
||
<ul class="scroll_tab">
|
||
<li>故障时间</li>
|
||
<li>设备编号</li>
|
||
<li>设备名称</li>
|
||
<li>当前状态</li>
|
||
</ul>
|
||
<div class="scroll_container">
|
||
<vue-seamless-scroll :data="deviceRows" :class-option="defaultOption">
|
||
<ul class="content-block-scroll-ul">
|
||
<li v-for="(e, i) in deviceRows" :key="i">
|
||
<div><p>{{e.faultyTime}}</p></div>
|
||
<div><p>{{e.deviceCode}}</p></div>
|
||
<div><p>{{e.deviceName}}</p></div>
|
||
<div><p>{{['暂停', '运行', '故障', '关机'][Number(e.pointStatus) - 1]}}</p></div>
|
||
</li>
|
||
</ul>
|
||
</vue-seamless-scroll>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="fr block_right">
|
||
<div class="workshop">
|
||
<div class="line_test">
|
||
<div class="workshop_bg">
|
||
<div class="hr_abs hr1">
|
||
<div class="guan guan1" v-for="(e, i) in area2" :key="i" :class="['', 'a_1', 'a_2', 'a_3', 'a_4', 'a_5'][Number(e.status)]" @click="getInfo('2', e)"></div>
|
||
</div>
|
||
<div class="hr_abs hr2">
|
||
<div class="guan guan1" v-for="(e, i) in area3" :key="i" :class="['', 'a_1', 'a_2', 'a_3', 'a_4', 'a_5'][Number(e.status)]" @click="getInfo('2', e)"></div>
|
||
</div>
|
||
<div class="hr_abs hr3">
|
||
<div class="guan guan1" v-for="(e, i) in area4" :key="i" :class="['', 'a_1', 'a_2', 'a_3', 'a_4', 'a_5'][Number(e.status)]" @click="getInfo('2', e)"></div>
|
||
</div>
|
||
<div class="hr_abs hr4">
|
||
<div class="hnj_item" v-for="e in area1" :key="e.device_uuid">
|
||
<div class="jiazi"></div>
|
||
<div class="guan guan2"></div>
|
||
<div class="hnj" :class="'nj_' + e.status" @click="getInfo('1', e)"></div>
|
||
</div>
|
||
</div>
|
||
<div v-if="area5.length > 0" class="hr_abs hr5">
|
||
<div class="yam_item">
|
||
<div class="yam_bg"></div>
|
||
<div class="yam_left yal1_4"></div>
|
||
<div class="yam_right yar1_4"></div>
|
||
<div class="yam_inner yai1_4"></div>
|
||
</div>
|
||
<div class="yam_item" v-for="(e, i) in area5" :key="i">
|
||
<div class="yam_bg"></div>
|
||
<div class="yam_left" :class="'yal1_' + e.press.leftpress.status" @click="getInfo('1', e.press.leftpress)"></div>
|
||
<div class="yam_right" :class="'yar1_' + e.press.rightpress.status" @click="getInfo('1', e.press.rightpress)"></div>
|
||
<div class="yam_inner" :class="'yai1_' + e.robot.status" @click="getInfo('1', e.robot)"></div>
|
||
<div v-if="e.presspoint.MP01.status === '1'" class="yam_mtp_l"></div>
|
||
<div v-if="e.presspoint.MD01.status === '1'" class="yam_mtp_l yam_mtp_l1"></div>
|
||
<div v-if="e.presspoint.MP02.status === '1'" class="yam_mtp_r"></div>
|
||
<div v-if="e.presspoint.MD02.status === '1'" class="yam_mtp_r yam_mtp_r1"></div>
|
||
<div v-if="e.presspoint.MDJXSKD.status === '2'" class="yam_ktp"></div>
|
||
</div>
|
||
<div class="yam_item">
|
||
<div class="yam_bg"></div>
|
||
<div class="yam_left yal1_4"></div>
|
||
<div class="yam_right yar1_4"></div>
|
||
<div class="yam_inner yai1_4"></div>
|
||
</div>
|
||
</div>
|
||
<div v-if="area6.truss.length > 0" class="hr_abs hr6" :style="{'left': area6.truss[0].x}">
|
||
<div class="diaoz" :class="'dz_' + area6.truss[0].status" @click="getInfo('1', area6.truss[0])"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr7">
|
||
<div class="kyc" v-for="e in goods.slice(0,area7[4].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr8">
|
||
<div class="mtp" v-for="e in goods.slice(0,area7[5].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr9">
|
||
<div class="yao" :class="'yao1_' + area7[0].status" @click="getInfo('1', area7[0])"></div>
|
||
</div>
|
||
<div class="hr_abs hr10">
|
||
<div class="yao yao1_4"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr11">
|
||
<div class="mtp" v-for="e in goods.slice(0,area7[0].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr12">
|
||
<div class="mtp" v-for="e in goods.slice(0,area7[2].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr23">
|
||
<div class="mtp" v-for="e in goods.slice(0,area7[1].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area7.length > 0" class="hr_abs hr24">
|
||
<div class="mtp" v-for="e in goods.slice(0,area7[3].vehicle_num)" :key="e.id"></div>
|
||
</div>
|
||
<div v-if="area6.trusspoint.length > 0" class="hr_abs hr13">
|
||
<div v-if="area6.trusspoint[0].status === '1'" class="mtp"></div>
|
||
</div>
|
||
<div v-if="area8.headpoint.length > 0" class="hr_abs hr14">
|
||
<div class="kyc" v-for="(e, i) in area8.headpoint" :key="i" :class="{'hide': e.status === '0'}"></div>
|
||
</div>
|
||
<div v-if="area8.head.length > 0" class="hr_abs hr15">
|
||
<div class="dtj" :class="'dtj_' + area8.head[0].status" @click="getInfo('1', area8.head[0])"></div>
|
||
</div>
|
||
<div v-if="area9.length > 0" class="hr_abs hr16" :style="{'left': area9[0].x}">
|
||
<div class="bdc" :class="'bdc_' + area9[0].status" @click="getInfo('1', area9[0])"></div>
|
||
</div>
|
||
<div class="hr_abs hr20">
|
||
<div class="mtp2_block" v-for="(e,i) in area10" :key="i">
|
||
<div class="mtp2" v-for="(el,i) in e.mpoint" :key="i" :class="{'hide': el.status === '0'}"></div>
|
||
</div>
|
||
</div>
|
||
<div class="hr_abs hr17">
|
||
<div class="jxs1" v-for="(e, i) in area10" :key="i" :class="'jxs1_' + e.crobot.status" @click="getInfo('1', e.crobot)"></div>
|
||
</div>
|
||
<div class="hr_abs hr18">
|
||
<div class="jxs2" v-for="(e, i) in area10" :key="i" :class="'jxs1_' + e.mrobot.status" @click="getInfo('1', e.mrobot)"></div>
|
||
</div>
|
||
<div class="hr_abs hr19">
|
||
<div class="mtp_block" v-for="(e, i) in area10" :key="i">
|
||
<div class="mtp" v-for="(el, i) in e.cpoint" :key="i" :class="{'hide': el.status === '0'}"></div>
|
||
</div>
|
||
</div>
|
||
<div class="hr_abs hr21">
|
||
<div class="guding"></div>
|
||
<div class="guding"></div>
|
||
<div class="guding"></div>
|
||
<div class="guding"></div>
|
||
</div>
|
||
<div class="hr_abs hr22" :style="{'left': area11.agv1.web_x_coor, 'top': area11.agv1.web_y_coor}">
|
||
<div class="agv" :class="'agv_' + area11.agv1.angle"></div>
|
||
</div>
|
||
<div class="hr_abs hr22" :style="{'left': area11.agv2.web_x_coor, 'top': area11.agv2.web_y_coor}">
|
||
<div class="agv" :class="'agv_' + area11.agv2.angle"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 2.3.4货架 -->
|
||
<div class="tag_block clear">
|
||
<div class="fl">
|
||
<div class="tag_type tag_sb">货架：</div>
|
||
<div class="tag_type">
|
||
<div class="type_color green2"></div>
|
||
<div class="tag_text">静置中</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color green"></div>
|
||
<div class="tag_text">空盅</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color gray"></div>
|
||
<div class="tag_text">禁用</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color yellow"></div>
|
||
<div class="tag_text">静置完成</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color orange"></div>
|
||
<div class="tag_text">强制完成</div>
|
||
</div>
|
||
</div>
|
||
<div class="fr">
|
||
<div class="tag_type tag_sb">设备：</div>
|
||
<div class="tag_type">
|
||
<div class="type_color green2"></div>
|
||
<div class="tag_text">运行</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color yellow"></div>
|
||
<div class="tag_text">暂停</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color gray"></div>
|
||
<div class="tag_text">停机</div>
|
||
</div>
|
||
<div class="tag_type">
|
||
<div class="type_color orange"></div>
|
||
<div class="tag_text">故障</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 混碾机LB0001 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0001'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">当前生产：{{form.material_name}}</div>
|
||
<div class="pop_tip">已生产：{{form.produce_num}}KG</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
<table class="pop_table">
|
||
<tr>
|
||
<th width="48%">本日生产</th>
|
||
<th width="26%">已生产数量</th>
|
||
<th>单位</th>
|
||
</tr>
|
||
<tr v-for="(e,i) in allrows1" :key="i">
|
||
<td>{{e.material_name}}</td>
|
||
<td>{{e.produce_num}}</td>
|
||
<td>{{e.unit_name}}</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 压力机LB0004、机械手LB0006 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0004' || (obj.deviceclass_code === 'LB0006' && obj.device_code !== 'CDJQR01' && obj.device_code !== 'MDJXS01')" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">当前生产：{{form.material_name}}</div>
|
||
<div class="pop_tip">已生产：{{form.produce_num}}KG</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
<table class="pop_table">
|
||
<tr>
|
||
<th width="48%">本日生产</th>
|
||
<th width="26%">生产厂家</th>
|
||
<th>已生产（块）</th>
|
||
</tr>
|
||
<tr v-for="(e,i) in allrows2" :key="i">
|
||
<td>{{e.material_name}}</td>
|
||
<td>{{e.factory_name}}</td>
|
||
<td>{{e.produce_num}}</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 衍架LB0010 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0010'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">搬运托盘数：{{form.in_produce_num}}托</div>
|
||
<div class="pop_tip">搬入准备车道：{{form.in_prepare}}托</div>
|
||
<div class="pop_tip">搬入1号窑：{{form.in_first}}托</div>
|
||
<div class="pop_tip">搬入2号窑：{{form.in_second}}托</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 空车道LB0011、准备车道LB0012、窑-暂存LB0014 -->
|
||
<!-- <div v-if="obj.deviceclass_code === 'LB0011' || obj.deviceclass_code === 'LB0012' || obj.deviceclass_code === 'LB0014'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen', 'forange', 'fgray'][Number(form.status) - 1]">{{['待机', '生产中', '故障', '关机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">当前窑车数：车</div>
|
||
<div class="pop_tip">容量：车</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div> -->
|
||
<!-- 窑LB0013 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0013'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">窑1窑车数：{{form.vehicle_num01}}车</div>
|
||
<div class="pop_tip">窑2窑车数： {{form.vehicle_num02}}车</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
<table class="pop_table">
|
||
<tr>
|
||
<th width="48%">本日生产</th>
|
||
<th width="26%">生产厂家</th>
|
||
<th>已生产（块）</th>
|
||
</tr>
|
||
<tr v-for="(e,i) in allrows2" :key="i">
|
||
<td>{{e.material_name}}</td>
|
||
<td>{{e.factory_name}}</td>
|
||
<td>{{e.produce_num}}</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- RGVLB0015 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0015'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">运行状态：{{form.run_type}}</div>
|
||
<div class="pop_tip">完成托盘数：{{form.carrier_num}}托</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 拆垛机械手、码垛机械手LB0006 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0006' && obj.device_code === 'CDJQR01'|| obj.device_code === 'MDJXS01'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">完成托盘数：{{form.carrier_num}}托</div>
|
||
<div class="pop_tip">完成数量：{{form.produce_total_num}}块</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 叠盘机LB0016 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0016'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">完成托盘数：{{form.carrier_num}}托</div>
|
||
<div class="pop_tip">完成垛数：{{form.stack_num}}垛</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- AGVLB0019 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0019'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name">{{form.device_name}}</div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">当前载具：{{form.carrier_no}}</div>
|
||
<div class="pop_tip">当前任务：{{form.task_no}}</div>
|
||
<div class="pop_tip">已完成搬运：{{form.carrier_num}}个</div>
|
||
<div class="pop_tip">剩余电量：{{form.left_electricity}}</div>
|
||
<div class="pop_tip">故障信息：{{form.error_info}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
<!-- 罐LB0002 -->
|
||
<div v-if="obj.deviceclass_code === 'LB0002'" class="popover_block">
|
||
<div class="popver_bg">
|
||
<div class="popver_block">
|
||
<div class="pop_info_name"> </div>
|
||
<div class="pop_info_tip">
|
||
<div v-if="device === '1'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['yellow', 'green2', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fyellow', 'fgreen2', 'forange', 'fgray'][Number(form.status) - 1]">{{['暂停', '运行', '故障', '停机'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div v-if="device === '2'" class="pop_status">
|
||
<div class="pop_status_dot" :class="['green', 'green2', 'yellow', 'orange', 'gray'][Number(form.status) - 1]"></div>
|
||
<div class="pop_status_text" :class="['fgreen', 'fgreen2', 'fyellow', 'forange', 'fgray'][Number(form.status) - 1]">{{['空盅', '静置中', '静置完成', '强制完成', '禁用'][Number(form.status) - 1]}}</div>
|
||
</div>
|
||
<div class="pop_tip">货位：{{form.struct_code}}</div>
|
||
<div class="pop_tip">载具： {{form.storagevehicle_code}}</div>
|
||
<div class="pop_tip">物料：{{form.material_code}}</div>
|
||
<div class="pop_tip">名称：{{form.material_name}}</div>
|
||
<div class="pop_tip">重量(kg)：{{form.ivt_qty}}</div>
|
||
<div class="pop_tip">入库时间：{{form.instorage_time}}</div>
|
||
<div class="pop_tip">静置(h)：{{form.finish_times}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="iconfont icon-guanbi close_btn" @click="closePop"></div>
|
||
</div>
|
||
<div class="mask" @click="closePop"></div>
|
||
</div>
|
||
</section>
|
||
</template>
|
||
|
||
<script>
|
||
import THeader from '@components/header.vue'
|
||
import TCircle from '@components/circle.vue'
|
||
import { workshopCondition } from '@js/getData2'
|
||
export default {
|
||
name: 'HomePage',
|
||
components: {
|
||
THeader,
|
||
TCircle
|
||
},
|
||
data () {
|
||
return {
|
||
interTime: this.$store.getters.setTime,
|
||
timer: null,
|
||
area1: [],
|
||
area2: [],
|
||
area3: [],
|
||
area4: [],
|
||
area5: [],
|
||
area6: {trusspoint: [], truss: []},
|
||
area7: [],
|
||
area8: {headpoint: [], head: []},
|
||
area9: [],
|
||
area10: [],
|
||
area11: {agv1: {}, agv2: {}},
|
||
goods: [{id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}, {id: 6}, {id: 7}, {id: 8}, {id: 9}, {id: 10}, {id: 11}, {id: 12}, {id: 13}, {id: 14}, {id: 15}, {id: 16}, {id: 17}, {id: 18}, {id: 19}, {id: 20}, {id: 21}, {id: 22}, {id: 23}, {id: 24}, {id: 25}],
|
||
dayRows: [],
|
||
weekRows: [],
|
||
deviceRows: [],
|
||
obj: {},
|
||
device: '',
|
||
form: {},
|
||
allrows1: [],
|
||
allrows2: []
|
||
}
|
||
},
|
||
computed: {
|
||
defaultOption () {
|
||
return {
|
||
step: 0.2, // 数值越大速度滚动越快
|
||
limitMoveNum: 4, // 开始无缝滚动的数据量 this.dataList.length
|
||
hoverStop: true, // 是否开启鼠标悬停stop
|
||
direction: 1, // 0向下 1向上 2向左 3向右
|
||
openWatch: true, // 开启数据实时监控刷新dom
|
||
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||
waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
|
||
}
|
||
}
|
||
},
|
||
mounted () {
|
||
// this.initData1()
|
||
this._workshopCondition()
|
||
this.refresh()
|
||
},
|
||
beforeDestroy () {
|
||
clearInterval(this.timer)
|
||
},
|
||
methods: {
|
||
refresh () {
|
||
this.timer = setInterval(() => {
|
||
// this.initData1()
|
||
this._workshopCondition()
|
||
}, this.interTime)
|
||
},
|
||
async _workshopCondition () {
|
||
let res = await workshopCondition()
|
||
this.dayRows = [...res.result.runningStatus]
|
||
this.weekRows = [...res.result.faultyStatus]
|
||
this.deviceRows = [...res.result.faultyInfo]
|
||
if (this.dayRows.length > 0) {
|
||
this.setEchart1()
|
||
}
|
||
if (this.weekRows.length > 0) {
|
||
this.setEchart2()
|
||
}
|
||
},
|
||
rectClick () {
|
||
var ev = window.event
|
||
// 获取相对于当前所指向对象的位置坐标
|
||
alert('x:' + ev.offsetX + 'y:' + ev.offsetY)
|
||
},
|
||
setEchart1 () {
|
||
let arr1 = []
|
||
let arr2 = []
|
||
let arr3 = []
|
||
this.dayRows.map(el => {
|
||
arr1.push(el.workorder_procedure)
|
||
arr2.push(el.deviceQty)
|
||
arr3.push(el.faultyDevice)
|
||
})
|
||
let option = {
|
||
title: {
|
||
text: '设备故障次数（昨天/今天）',
|
||
x: 10,
|
||
y: 8,
|
||
textStyle: {
|
||
fontWeight: 'normal',
|
||
fontSize: 16,
|
||
lineHeight: 22,
|
||
color: '#fff'
|
||
}
|
||
},
|
||
legend: {
|
||
top: 13,
|
||
left: 243,
|
||
itemGap: 28,
|
||
itemWidth: 10,
|
||
itemHeight: 10,
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: 'rgba(255,255,255,0.60)',
|
||
lineHeight: 17
|
||
},
|
||
data: ['总设备数', '故障设备数']
|
||
},
|
||
grid: {
|
||
top: 47,
|
||
left: 17,
|
||
right: 15,
|
||
bottom: 9,
|
||
containLabel: true
|
||
},
|
||
xAxis: [{
|
||
type: 'category',
|
||
boundaryGap: true,
|
||
axisLine: {
|
||
show: true,
|
||
lineStyle: {
|
||
color: '#253249'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: 'rgba(255,255,255,0.6)',
|
||
margin: 6.2
|
||
}
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
data: arr1
|
||
}],
|
||
yAxis: [{
|
||
type: 'value',
|
||
min: 0,
|
||
axisLine: {
|
||
show: false
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
margin: 2,
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: 'rgba(255,255,255,0.60)'
|
||
}
|
||
},
|
||
splitLine: {
|
||
show: true,
|
||
lineStyle: {
|
||
type: 'dashed',
|
||
color: 'rgba(255,255,255,0.2)'
|
||
}
|
||
}
|
||
}],
|
||
series: [
|
||
{
|
||
name: '总设备数',
|
||
type: 'bar',
|
||
barWidth: 10,
|
||
itemStyle: {
|
||
color: '#F7B502'
|
||
},
|
||
data: arr2
|
||
},
|
||
{
|
||
name: '故障设备数',
|
||
type: 'bar',
|
||
barWidth: 10,
|
||
itemStyle: {
|
||
color: '#32C5FF'
|
||
},
|
||
barGap: '100%',
|
||
data: arr3
|
||
}
|
||
]
|
||
}
|
||
let echart = document.getElementById('echart_d1')
|
||
let myChart = this.$echarts.init(echart)
|
||
myChart.setOption(option)
|
||
window.addEventListener('resize', function () {
|
||
myChart.resize()
|
||
})
|
||
},
|
||
setEchart2 () {
|
||
let arr1 = []
|
||
let arr2 = []
|
||
this.weekRows.map(el => {
|
||
arr1.push(el.deviceName)
|
||
arr2.push(el.faultyFrequency)
|
||
})
|
||
let yAxisData = ['TOP1', 'TOP2', 'TOP3', 'TOP4', 'TOP5']
|
||
let option = {
|
||
title: {
|
||
text: '近一周故障次数前五设备',
|
||
x: 10,
|
||
y: 8,
|
||
textStyle: {
|
||
fontWeight: 'normal',
|
||
fontSize: 16,
|
||
lineHeight: 22,
|
||
color: '#fff'
|
||
}
|
||
},
|
||
grid: {
|
||
top: 47,
|
||
left: 17,
|
||
right: 15,
|
||
bottom: 0,
|
||
containLabel: false
|
||
},
|
||
yAxis: [
|
||
{
|
||
type: 'category',
|
||
inverse: true,
|
||
axisLine: {
|
||
show: false
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: '#fff',
|
||
align: 'left'
|
||
},
|
||
margin: 0,
|
||
formatter: '{value}\n{a|占位}\n{a|占位}',
|
||
rich: {
|
||
a: {
|
||
color: 'rgba(255, 255, 255, 0)',
|
||
lineHeight: 20
|
||
}
|
||
}
|
||
},
|
||
data: yAxisData
|
||
},
|
||
{
|
||
type: 'category',
|
||
inverse: true,
|
||
offset: -50,
|
||
position: 'left',
|
||
axisLine: {
|
||
show: false
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: '#fff',
|
||
align: 'left'
|
||
},
|
||
formatter: '{value}\n{a|占位}\n{a|占位}',
|
||
rich: {
|
||
a: {
|
||
color: 'rgba(255, 255, 255, 0)',
|
||
lineHeight: 20
|
||
}
|
||
}
|
||
},
|
||
data: arr1
|
||
},
|
||
{
|
||
type: 'category',
|
||
inverse: true,
|
||
offset: 0,
|
||
axisLine: {
|
||
show: false
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
inside: true,
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: '#8db0ff',
|
||
align: 'right'
|
||
},
|
||
formatter: '{value}\n{a|占位}\n{a|占位}',
|
||
rich: {
|
||
a: {
|
||
color: 'rgba(255, 255, 255, 0)',
|
||
lineHeight: 20
|
||
}
|
||
}
|
||
},
|
||
data: arr2
|
||
}
|
||
],
|
||
xAxis: {
|
||
show: false
|
||
},
|
||
series: [
|
||
{
|
||
type: 'bar',
|
||
data: arr2,
|
||
barWidth: 6,
|
||
itemStyle: {
|
||
normal: {
|
||
color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, ['#0080DE', '#32C5FF'].map((color, offset) => ({color, offset})))
|
||
}
|
||
},
|
||
showBackground: true,
|
||
backgroundStyle: {
|
||
color: 'rgba(0, 205, 236, 0.1)'
|
||
}
|
||
}
|
||
]
|
||
}
|
||
let echart = document.getElementById('echart_d2')
|
||
let myChart = this.$echarts.init(echart)
|
||
myChart.setOption(option)
|
||
window.addEventListener('resize', function () {
|
||
myChart.resize()
|
||
})
|
||
},
|
||
initData1 () {
|
||
let data = {
|
||
'_SRVNAME': 'service.st.al.realivt',
|
||
'_SRVMETHOD': 'queryDevicesInhomePage',
|
||
'_DATA': JSON.stringify({
|
||
accountId: '-1'
|
||
})
|
||
}
|
||
this
|
||
.$post(data)
|
||
.then(res => {
|
||
if (res.code === '1') {
|
||
this.area1 = res.result.area1.content
|
||
this.area2 = res.result.area2.content
|
||
this.area3 = res.result.area3.content
|
||
this.area4 = res.result.area4.content
|
||
this.area5 = res.result.area5.content
|
||
this.area6 = res.result.area6.content
|
||
this.area7 = res.result.area7.content
|
||
this.area8 = res.result.area8.content
|
||
this.area9 = res.result.area9.content
|
||
this.area10 = res.result.area10.content
|
||
this.area11 = res.result.area11.content
|
||
} else {
|
||
this.toast(res.desc)
|
||
}
|
||
})
|
||
},
|
||
getData (i, obj) {
|
||
let data = {
|
||
'_SRVNAME': 'service.st.al.realivt',
|
||
'_SRVMETHOD': 'queryDeviceByIdInhomePage',
|
||
'_DATA': JSON.stringify({
|
||
accountId: '-1',
|
||
device_uuid: obj.device_uuid
|
||
})
|
||
}
|
||
this
|
||
.$post(data)
|
||
.then(res => {
|
||
if (res.code === '1') {
|
||
this.form = res.result.form
|
||
// if (res.result.hasOwnProperty('allrows1')) {
|
||
// this.allrows1 = res.result.form.allrows1
|
||
// }
|
||
// if (res.result.hasOwnProperty('allrows2')) {
|
||
// this.allrows2 = res.result.form.allrows2
|
||
// }
|
||
this.allrows1 = res.result.form.allrows1
|
||
this.allrows2 = res.result.form.allrows2
|
||
this.obj = obj
|
||
this.device = i
|
||
} else {
|
||
this.toast(res.desc)
|
||
}
|
||
})
|
||
},
|
||
getInfo (i, obj) {
|
||
this.getData(i, obj)
|
||
},
|
||
closePop () {
|
||
this.obj = {}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="stylus" scoped>
|
||
@import '~@css/mixin'
|
||
.content
|
||
_wh(100% , calc(100% - 84px))
|
||
padding 20px 49px 0
|
||
.block_left
|
||
_wh(554px, 100%)
|
||
.block_right
|
||
position relative
|
||
_wh(calc(100% - 603px), 924px)
|
||
overflow hidden
|
||
.item_block
|
||
position relative
|
||
background #000F2B
|
||
border 1px solid #31384B
|
||
.border-top
|
||
position absolute
|
||
top -2px
|
||
left 0
|
||
_wh(100%,1px)
|
||
background #32C5FF
|
||
z-index 2019
|
||
.dot_top
|
||
position absolute
|
||
top -5px
|
||
left -5px
|
||
_wh(8px,9px)
|
||
background #32C5FF
|
||
z-index 2020
|
||
.block_1
|
||
_wh(100%, 300px)
|
||
margin-bottom 15px
|
||
.block_2
|
||
_wh(100%, 294px)
|
||
h2
|
||
_font(16px,22px,,,left)
|
||
margin 12px 0 10px 12px
|
||
.scroll_item
|
||
width 100%
|
||
height calc(100% - 44px)
|
||
padding 0 12px
|
||
.scroll_tab
|
||
li
|
||
float left
|
||
_font(12px,32px,rgba(255,255,255,0.60))
|
||
background #262F52
|
||
box-sizing border-box
|
||
&:nth-child(1), &:nth-child(2)
|
||
width 30%
|
||
&:nth-child(3), &:nth-child(4)
|
||
width 20%
|
||
.scroll_container
|
||
width 100%
|
||
height calc(100% - 32px)
|
||
overflow hidden
|
||
.content-block-scroll-ul
|
||
li
|
||
div
|
||
float left
|
||
height 40px
|
||
overflow hidden
|
||
white-space nowrap
|
||
p
|
||
_font(12px,40px,#fff)
|
||
&:nth-child(1), &:nth-child(2)
|
||
width 30%
|
||
&:nth-child(3), &:nth-child(4)
|
||
width 20%
|
||
&:nth-child(4) p
|
||
_font(12px,40px,#F7B502)
|
||
&:nth-child(even) div
|
||
background rgba(38,47,82,0.50)
|
||
.tag_block
|
||
position absolute
|
||
width 970px
|
||
bottom 0
|
||
left 50%
|
||
margin-left -485px
|
||
.tag_type
|
||
display inline-block
|
||
margin 0 9px
|
||
.type_color
|
||
display inline-block
|
||
_wh(10px,10px)
|
||
border-radius 50%
|
||
.tag_text
|
||
display inline-block
|
||
_font(14px,20px)
|
||
.tag_sb
|
||
margin-right 0
|
||
_font(16px,20px, $green2)
|
||
.workshop
|
||
_wh(100%,902px)
|
||
margin 0 auto
|
||
.line_test
|
||
_wh(949px, 902px)
|
||
margin 0 auto
|
||
// _bis('../assets/images/homepg/aaa.png')
|
||
.workshop_bg
|
||
position relative
|
||
_wh(949px,902px)
|
||
margin 0 auto
|
||
_bis('../assets/images/homepg/1.png')
|
||
.hr_abs
|
||
position absolute
|
||
.hr1
|
||
width 144px
|
||
top -4px
|
||
left 160px
|
||
.hr2
|
||
top 74px
|
||
left 90px
|
||
width 365px
|
||
.hr3
|
||
width 324px
|
||
top 74px
|
||
left 520px
|
||
.hr4
|
||
width 470px
|
||
top 3px
|
||
left 333px
|
||
.hr5
|
||
width 870px
|
||
top 213px
|
||
left 171px
|
||
.hr6
|
||
width 22px
|
||
top 336px
|
||
// left 296px
|
||
.hr7
|
||
top 372px
|
||
left 407px
|
||
.hr8
|
||
top 370px
|
||
left 432px
|
||
.hr9
|
||
top 362px
|
||
left 452px
|
||
.hr10
|
||
top 362px
|
||
left 547px
|
||
.hr11
|
||
top 370px
|
||
left 462px
|
||
height 216px
|
||
overflow hidden
|
||
.hr12
|
||
top 602px
|
||
left 462px
|
||
height 168px
|
||
overflow hidden
|
||
.hr13
|
||
top 348px
|
||
left 512px
|
||
.hr14
|
||
top 705px
|
||
left 386px
|
||
.kyc
|
||
_wh(9px,10px)
|
||
margin-bottom 1px
|
||
.hr15
|
||
top 772px
|
||
left 381px
|
||
.hr16
|
||
top 775px
|
||
// left 306px
|
||
.hr17
|
||
top 793px
|
||
left 417px
|
||
.hr18
|
||
top 846px
|
||
left 425px
|
||
.hr19
|
||
top 804px
|
||
left 414px
|
||
.mtp
|
||
float left
|
||
margin-right 13px
|
||
&:nth-child(2n)
|
||
margin-right 24px
|
||
.mtp_block
|
||
float left
|
||
width 59px
|
||
.mtp2_block
|
||
float left
|
||
width 59px
|
||
.hr20
|
||
top 843px
|
||
left 409px
|
||
.hr21
|
||
top 863px
|
||
left 431px
|
||
.hr22
|
||
top 0
|
||
left 0
|
||
.hr23
|
||
top 370px
|
||
left 484px
|
||
height 216px
|
||
overflow hidden
|
||
.hr24
|
||
top 602px
|
||
left 487px
|
||
height 168px
|
||
overflow hidden
|
||
.diaoz
|
||
_wh(22px,26px)
|
||
.dz_1
|
||
_bis('../assets/images/homepg/dz1_1.png')
|
||
.dz_2
|
||
_bis('../assets/images/homepg/dz1_2.png')
|
||
.dz_3
|
||
_bis('../assets/images/homepg/dz1_3.png')
|
||
.dz_4
|
||
_bis('../assets/images/homepg/dz1_4.png')
|
||
.guan
|
||
_wh(12px,14px)
|
||
.a_1
|
||
_bis('../assets/images/homepg/a1_1.png')
|
||
.a_2
|
||
_bis('../assets/images/homepg/a1_2.png')
|
||
.a_3
|
||
_bis('../assets/images/homepg/a1_3.png')
|
||
.a_4
|
||
_bis('../assets/images/homepg/a1_4.png')
|
||
.a_5
|
||
_bis('../assets/images/homepg/a1_5.png')
|
||
.guan1
|
||
float left
|
||
margin-right 5px
|
||
&:nth-child(2n)
|
||
margin-right 7px
|
||
.hnj_item
|
||
position relative
|
||
float left
|
||
_wh(30px,30px)
|
||
margin-right 22px
|
||
.jiazi
|
||
_wh(30px,30px)
|
||
_bis('../assets/images/homepg/jz.png')
|
||
.guan2
|
||
position absolute
|
||
top 17px
|
||
left 9.5px
|
||
_bis('../assets/images/homepg/a1_2.png')
|
||
.hnj
|
||
position absolute
|
||
top 4px
|
||
left 9.5px
|
||
_wh(12px,20px)
|
||
.nj_1
|
||
_bis('../assets/images/homepg/nj1_1.png')
|
||
.nj_2
|
||
_bis('../assets/images/homepg/nj1_2.png')
|
||
.nj_3
|
||
_bis('../assets/images/homepg/nj1_3.png')
|
||
.nj_4
|
||
_bis('../assets/images/homepg/nj1_4.png')
|
||
.yam_item
|
||
position relative
|
||
float left
|
||
_wh(90px,90px)
|
||
margin-right 64px
|
||
.yam_bg
|
||
_wh(90px,90px)
|
||
_bis('../assets/images/homepg/ya1_1.png')
|
||
.yam_left
|
||
position absolute
|
||
top -22px
|
||
left -5px
|
||
_wh(44px,78px)
|
||
.yal1_1
|
||
_bis('../assets/images/homepg/yal1_1.png')
|
||
.yal1_2
|
||
_bis('../assets/images/homepg/yal1_2.png')
|
||
.yal1_3
|
||
_bis('../assets/images/homepg/yal1_3.png')
|
||
.yal1_4
|
||
_bis('../assets/images/homepg/yal1_4.png')
|
||
.yam_right
|
||
position absolute
|
||
top -22px
|
||
left 60px
|
||
_wh(44px,78px)
|
||
.yar1_1
|
||
_bis('../assets/images/homepg/yar1_1.png')
|
||
.yar1_2
|
||
_bis('../assets/images/homepg/yar1_2.png')
|
||
.yar1_3
|
||
_bis('../assets/images/homepg/yar1_3.png')
|
||
.yar1_4
|
||
_bis('../assets/images/homepg/yar1_4.png')
|
||
.yam_inner
|
||
position absolute
|
||
top 29px
|
||
left 42px
|
||
_wh(12px,20px)
|
||
.yai1_1
|
||
_bis('../assets/images/homepg/yai1_1.png')
|
||
.yai1_2
|
||
_bis('../assets/images/homepg/yai1_2.png')
|
||
.yai1_3
|
||
_bis('../assets/images/homepg/yai1_3.png')
|
||
.yai1_4
|
||
_bis('../assets/images/homepg/yai1_4.png')
|
||
.yam_mtp_l
|
||
position absolute
|
||
top 41px
|
||
left 22px
|
||
_wh(13px,17px)
|
||
_bis('../assets/images/homepg/mtp.png')
|
||
.yam_mtp_l1
|
||
top 58px
|
||
left 22px
|
||
.yam_mtp_r
|
||
position absolute
|
||
top 41px
|
||
left 58px
|
||
_wh(13px,17px)
|
||
_bis('../assets/images/homepg/mtp.png')
|
||
.yam_mtp_r1
|
||
top 58px
|
||
left 58px
|
||
.yam_ktp
|
||
position absolute
|
||
top 64px
|
||
left 42px
|
||
_wh(10px,11px)
|
||
_bis('../assets/images/homepg/ktp.png')
|
||
.yao
|
||
_wh(52px,240px)
|
||
.yao1_1
|
||
_bis('../assets/images/homepg/yao1_1.png')
|
||
.yao1_2
|
||
_bis('../assets/images/homepg/yao1_2.png')
|
||
.yao1_3
|
||
_bis('../assets/images/homepg/yao1_3.png')
|
||
.yao1_4
|
||
_bis('../assets/images/homepg/yao1_4.png')
|
||
.kyc
|
||
_wh(11px,16px)
|
||
_bis('../assets/images/homepg/kyc.png')
|
||
margin-bottom 6px
|
||
.mtp
|
||
_wh(11px,11px)
|
||
_bis('../assets/images/homepg/mtp.png')
|
||
margin-bottom 1px
|
||
.mtp2
|
||
_wh(11px,11px)
|
||
_bis('../assets/images/homepg/mtp.png')
|
||
.dtj
|
||
_wh(17px,21px)
|
||
.dtj_1
|
||
_bis('../assets/images/homepg/dtj1_1.png')
|
||
.dtj_2
|
||
_bis('../assets/images/homepg/dtj1_2.png')
|
||
.dtj_3
|
||
_bis('../assets/images/homepg/dtj1_3.png')
|
||
.dtj_4
|
||
_bis('../assets/images/homepg/dtj1_4.png')
|
||
.bdc
|
||
_wh(25px,15px)
|
||
.bdc_1
|
||
_bis('../assets/images/homepg/bdc1_1.png')
|
||
.bdc_2
|
||
_bis('../assets/images/homepg/bdc1_2.png')
|
||
.bdc_3
|
||
_bis('../assets/images/homepg/bdc1_3.png')
|
||
.bdc_4
|
||
_bis('../assets/images/homepg/bdc1_4.png')
|
||
.jxs1
|
||
float left
|
||
_wh(20px,10px)
|
||
margin-right 39px
|
||
.jxs1_1
|
||
_bis('../assets/images/homepg/jxs1_1.png')
|
||
.jxs1_2
|
||
_bis('../assets/images/homepg/jxs1_2.png')
|
||
.jxs1_3
|
||
_bis('../assets/images/homepg/jxs1_3.png')
|
||
.jxs1_4
|
||
_bis('../assets/images/homepg/jxs1_4.png')
|
||
.jxs2
|
||
float left
|
||
_wh(21px,16px)
|
||
_bis('../assets/images/homepg/jxs2_1.png')
|
||
margin-right 38px
|
||
.jxs2_1
|
||
_bis('../assets/images/homepg/jxs2_1.png')
|
||
.jxs2_2
|
||
_bis('../assets/images/homepg/jxs2_2.png')
|
||
.jxs2_3
|
||
_bis('../assets/images/homepg/jxs2_3.png')
|
||
.jxs2_4
|
||
_bis('../assets/images/homepg/jxs2_4.png')
|
||
.guding
|
||
float left
|
||
_wh(10px,35px)
|
||
_bis('../assets/images/homepg/6.png')
|
||
margin-right 49px
|
||
.agv
|
||
position absolute
|
||
left -21px
|
||
top -19px
|
||
_wh(42px,38px)
|
||
.agv_1
|
||
_bis('../assets/images/homepg/agv_z.png')
|
||
.agv_2
|
||
_bis('../assets/images/homepg/agv_b.png')
|
||
.agv_3
|
||
_bis('../assets/images/homepg/agv_l.png')
|
||
.agv_4
|
||
_bis('../assets/images/homepg/agv_r.png')
|
||
.popover_block
|
||
position fixed
|
||
left 0
|
||
top 0
|
||
_wh(100%,100%)
|
||
z-index 100000
|
||
.mask
|
||
_wh(100%,100%)
|
||
background-color rgba(0,0,0,0.4)
|
||
.popver_bg
|
||
position absolute
|
||
left 50%
|
||
top 50%
|
||
_wh(500px,288px)
|
||
margin-left -250px
|
||
margin-top -144px
|
||
padding 20px 18px 36px 10px
|
||
overflow hidden
|
||
_bis('../assets/images/popover_1.png')
|
||
.popver_block
|
||
padding 8px 0 0 12px
|
||
background top center / 100% 18px url(../assets/images/popover_line.png) no-repeat
|
||
_wh(100%,100%)
|
||
overflow hidden
|
||
.pop_info_name
|
||
width 100%
|
||
_font(14px,20px,#32C5FF,,left)
|
||
text-shadow 2px 2px 4px #A6E6FF
|
||
margin-bottom 8px
|
||
margin-top 8px
|
||
.pop_info_tip
|
||
position relative
|
||
height 196px
|
||
overflow-y scroll
|
||
.pop_status
|
||
position absolute
|
||
right 0
|
||
top 0
|
||
.pop_tip
|
||
font-size 14px
|
||
line-height 28px
|
||
.pop_status_dot
|
||
display inline-block
|
||
width 10px
|
||
height 10px
|
||
border-radius 50%
|
||
background-color #fff
|
||
.pop_status_text
|
||
display inline-block
|
||
font-size 14px
|
||
color #fff
|
||
.pop_table
|
||
width 100%
|
||
margin-top 10px
|
||
border-collapse separate
|
||
border 1px solid #2595DE
|
||
border-spacing 0
|
||
border-radius 4px 4px 0 0
|
||
tr
|
||
th
|
||
opacity 0.7
|
||
_font(12px,32px,rgba(255,255,255,0.60))
|
||
background #3D6CAA
|
||
padding 0 10px
|
||
border-right 1px solid #2595DE
|
||
border-bottom 1px solid #2595DE
|
||
&:nth-child(1)
|
||
text-align left
|
||
&:last-child
|
||
border-right none
|
||
td
|
||
_font(12px,14px)
|
||
height 36px
|
||
vertical-align middle
|
||
padding 0 10px
|
||
border-right 1px solid #2595DE
|
||
border-bottom 1px solid #2595DE
|
||
&:nth-child(1)
|
||
text-align left
|
||
&:last-child
|
||
border-right none
|
||
&:last-child td
|
||
border-bottom none
|
||
.close_btn
|
||
position absolute
|
||
top 2px
|
||
right 8px
|
||
font-size 14px
|
||
line-height 34px
|
||
padding 0 16px
|
||
border-radius 5px
|
||
cursor pointer
|
||
.green
|
||
background-color $green
|
||
.green2
|
||
background-color $green2
|
||
.yellow
|
||
background-color $yellow
|
||
.gray
|
||
background-color $gray
|
||
.orange
|
||
background-color $orange
|
||
.fgreen
|
||
color $green
|
||
.fgreen2
|
||
color $green2
|
||
.fyellow
|
||
color $yellow
|
||
.fgray
|
||
color $gray
|
||
.forange
|
||
color $orange
|
||
@media screen and (max-width:1800px)
|
||
.tag_block
|
||
width 100%
|
||
margin-left -50%
|
||
.tag_type
|
||
margin 0 5px
|
||
.block_left
|
||
_wh(454px, 100%)
|
||
.block_right
|
||
_wh(949px, 924px)
|
||
</style>
|