sov
This commit is contained in:
804
src/pages/management/StorageData.vue
Normal file
804
src/pages/management/StorageData.vue
Normal file
@@ -0,0 +1,804 @@
|
||||
<template>
|
||||
<section class="bg">
|
||||
<t-header title="海亮铜管智能车间可视化看板">
|
||||
<p class="p1">仓储数据</p>
|
||||
</t-header>
|
||||
<div class="container">
|
||||
<div class="yard-wrap">
|
||||
<div class="yard_group yard_group_1">
|
||||
<ul class="yard_group_ul yard_group_ul_1">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 8, 75 * 9)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">9</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_2">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 7, 75 * 8)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">8</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_3">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 6, 75 * 7)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">7</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_4">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 5, 75 * 6)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">6</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_5">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 4, 75 * 5)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">5</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_6">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 3, 75 * 4)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">4</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_7">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75 * 2, 75 * 3)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">3</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_8">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(75, 75 * 2)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">2</div>
|
||||
</div>
|
||||
<div class="yard_group yard_group_9">
|
||||
<ul class="yard_group_ul">
|
||||
<li class="yard_group_cell" v-for="(e, i) in allGroup.slice(0, 75)" :key="i">
|
||||
<button class="primary" :class="e.disabled === true ? 'syellow' : e.bgcolor" @click="getInfo($event, e)">
|
||||
<span class="scaleFont">{{e.struct_name}}</span>
|
||||
</button>
|
||||
<div v-show="e.disabled" class="locate-wrap clearfix" :style="{'left': coordinateX,'top': coordinateY}">
|
||||
<div class="locate-content">
|
||||
<div class="tan_pline">
|
||||
<p class="tan_p">货位：{{equipInfo.struct_name}}</p>
|
||||
<p class="tan_p">托盘：{{equipInfo.storagevehicle_name}}</p>
|
||||
<p class="tan_p">订单号：{{equipInfo.order_code}}</p>
|
||||
<p class="tan_p">类型: {{['待入', '待出', '库存'][Number(equipInfo.ios_type)]}}</p>
|
||||
</div>
|
||||
<div class="tan_tables">
|
||||
<table>
|
||||
<tr>
|
||||
<th width="25%">规格</th>
|
||||
<th width="15%">数量</th>
|
||||
<th width="15%">重量</th>
|
||||
<th width="45%">物料名称</th>
|
||||
</tr>
|
||||
<tr v-for="(e, i) in equipArr" :key="i">
|
||||
<td>{{e.material_spec}}</td>
|
||||
<td>{{e.ivt_qty}}</td>
|
||||
<td>{{e.ivt_weight}}</td>
|
||||
<td>{{e.material_name}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="yard_number">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-wrap">
|
||||
<div class="fl content-block">
|
||||
<div class="item_tip">
|
||||
<div class="item_tip_left">入库作业</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab">
|
||||
<li>时间</li>
|
||||
<li>货位</li>
|
||||
<li>待入托盘</li>
|
||||
<li>规格</li>
|
||||
<li>物料</li>
|
||||
<li>数量</li>
|
||||
<li>重量</li>
|
||||
</ul>
|
||||
<div class="scroll_container">
|
||||
<vue-seamless-scroll :data="array2" :class-option="defaultOption">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in array2" :key="i">
|
||||
<div class="scroll-ul_1_div">{{e.dis_time}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.struct_name}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.storagevehicle_code}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.material_type}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.material_name}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.num}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.qty}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fr content-block">
|
||||
<div class="item_tip">
|
||||
<div class="item_tip_left">出库作业</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab">
|
||||
<li>时间</li>
|
||||
<li>货位</li>
|
||||
<li>待出托盘</li>
|
||||
<li>规格</li>
|
||||
<li>物料</li>
|
||||
<li>数量</li>
|
||||
<li>重量</li>
|
||||
</ul>
|
||||
<div class="scroll_container">
|
||||
<vue-seamless-scroll :data="array3" :class-option="defaultOption">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in array3" :key="i">
|
||||
<div class="scroll-ul_1_div">{{e.dis_time}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.struct_name}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.storagevehicle_code}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.material_type}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.material_name}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.num}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.qty}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="bottom"></section>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import THeader from '@components/header.vue'
|
||||
export default {
|
||||
name: 'StorageData',
|
||||
components: {
|
||||
THeader
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
interTime: this.$store.getters.setTime,
|
||||
timer: null,
|
||||
nav: {
|
||||
title: '海亮铜管智能车间可视化看板',
|
||||
tab: [{title: '仓储数据', url: '/storageData'}]
|
||||
},
|
||||
// array2: [],
|
||||
// array3: [],
|
||||
array2: [
|
||||
{
|
||||
struct_name: '1-2-5',
|
||||
storagevehicle_code: 'T001',
|
||||
material_name: '紫铜弯通连接帽\'CG\'M1/2\'ZM-BA40101-1',
|
||||
num: '1000'
|
||||
}
|
||||
],
|
||||
array3: [
|
||||
{
|
||||
struct_name: '1-2-5',
|
||||
storagevehicle_code: 'T001',
|
||||
material_name: '紫铜弯通连接帽\'CG\'M1/2\'ZM-BA40101-1',
|
||||
num: '1000'
|
||||
}
|
||||
],
|
||||
allGroup: [
|
||||
{struct_name: '1-1-1'}, {struct_name: '1-2-1'}, {struct_name: '1-3-1'}, {struct_name: '1-4-1'}, {struct_name: '1-5-1'}, {struct_name: '1-1-2'}, {struct_name: '1-2-2'}, {struct_name: '1-3-2'}, {struct_name: '1-4-2'}, {struct_name: '1-5-2'}, {struct_name: '1-1-3'}, {struct_name: '1-2-3'}, {struct_name: '1-3-3'}, {struct_name: '1-4-3'}, {struct_name: '1-5-3'}, {struct_name: '1-1-4'}, {struct_name: '1-2-4'}, {struct_name: '1-3-4'}, {struct_name: '1-4-4'}, {struct_name: '1-5-4'}, {struct_name: '1-1-5'}, {struct_name: '1-2-5'}, {struct_name: '1-3-5'}, {struct_name: '1-4-5'}, {struct_name: '1-5-5'}, {struct_name: '1-1-6'}, {struct_name: '1-2-6'}, {struct_name: '1-3-6'}, {struct_name: '1-4-6'}, {struct_name: '1-5-6'}, {struct_name: '1-1-7'}, {struct_name: '1-2-7'}, {struct_name: '1-3-7'}, {struct_name: '1-4-7'}, {struct_name: '1-5-7'}, {struct_name: '1-1-8'}, {struct_name: '1-2-8'}, {struct_name: '1-3-8'}, {struct_name: '1-4-8'}, {struct_name: '1-5-8'}, {struct_name: '1-1-9'}, {struct_name: '1-2-9'}, {struct_name: '1-3-9'}, {struct_name: '1-4-9'}, {struct_name: '1-5-9'}, {struct_name: '1-1-10'}, {struct_name: '1-2-10'}, {struct_name: '1-3-10'}, {struct_name: '1-4-10'}, {struct_name: '1-5-10'}, {struct_name: '1-1-11'}, {struct_name: '1-2-11'}, {struct_name: '1-3-11'}, {struct_name: '1-4-11'}, {struct_name: '1-5-11'}, {struct_name: '1-1-12'}, {struct_name: '1-2-12'}, {struct_name: '1-3-12'}, {struct_name: '1-4-12'}, {struct_name: '1-5-12'}, {struct_name: '1-1-13'}, {struct_name: '1-2-13'}, {struct_name: '1-3-13'}, {struct_name: '1-4-13'}, {struct_name: '1-5-13'}, {struct_name: '1-1-14'}, {struct_name: '1-2-14'}, {struct_name: '1-3-14'}, {struct_name: '1-4-14'}, {struct_name: '1-5-14'}, {struct_name: '1-1-15'}, {struct_name: '1-2-15'}, {struct_name: '1-3-15'}, {struct_name: '1-4-15'}, {struct_name: '1-5-15'},
|
||||
{struct_name: '2-5-1'}, {struct_name: '2-4-1'}, {struct_name: '2-3-1'}, {struct_name: '2-2-1'}, {struct_name: '2-1-1'}, {struct_name: '2-5-2'}, {struct_name: '2-4-2'}, {struct_name: '2-3-2'}, {struct_name: '2-2-2'}, {struct_name: '2-1-2'}, {struct_name: '2-5-3'}, {struct_name: '2-4-3'}, {struct_name: '2-3-3'}, {struct_name: '2-2-3'}, {struct_name: '2-1-3'}, {struct_name: '2-5-4'}, {struct_name: '2-4-4'}, {struct_name: '2-3-4'}, {struct_name: '2-2-4'}, {struct_name: '2-1-4'}, {struct_name: '2-5-5'}, {struct_name: '2-4-5'}, {struct_name: '2-3-5'}, {struct_name: '2-2-5'}, {struct_name: '2-1-5'}, {struct_name: '2-5-6'}, {struct_name: '2-4-6'}, {struct_name: '2-3-6'}, {struct_name: '2-2-6'}, {struct_name: '2-1-6'}, {struct_name: '2-5-7'}, {struct_name: '2-4-7'}, {struct_name: '2-3-7'}, {struct_name: '2-2-7'}, {struct_name: '2-1-7'}, {struct_name: '2-5-8'}, {struct_name: '2-4-8'}, {struct_name: '2-3-8'}, {struct_name: '2-2-8'}, {struct_name: '2-1-8'}, {struct_name: '2-5-9'}, {struct_name: '2-4-9'}, {struct_name: '2-3-9'}, {struct_name: '2-2-9'}, {struct_name: '2-1-9'}, {struct_name: '2-5-10'}, {struct_name: '2-4-10'}, {struct_name: '2-3-10'}, {struct_name: '2-2-10'}, {struct_name: '2-1-10'}, {struct_name: '2-5-11'}, {struct_name: '2-4-11'}, {struct_name: '2-3-11'}, {struct_name: '2-2-11'}, {struct_name: '2-1-11'}, {struct_name: '2-5-12'}, {struct_name: '2-4-12'}, {struct_name: '2-3-12'}, {struct_name: '2-2-12'}, {struct_name: '2-1-12'}, {struct_name: '2-5-13'}, {struct_name: '2-4-13'}, {struct_name: '2-3-13'}, {struct_name: '2-2-13'}, {struct_name: '2-1-13'}, {struct_name: '2-5-14'}, {struct_name: '2-4-14'}, {struct_name: '2-3-14'}, {struct_name: '2-2-14'}, {struct_name: '2-1-14'}, {struct_name: '2-5-15'}, {struct_name: '2-4-15'}, {struct_name: '2-3-15'}, {struct_name: '2-2-15'}, {struct_name: '2-1-15'},
|
||||
{struct_name: '3-1-1'}, {struct_name: '3-2-1'}, {struct_name: '3-3-1'}, {struct_name: '3-4-1'}, {struct_name: '3-5-1'}, {struct_name: '3-1-2'}, {struct_name: '3-2-2'}, {struct_name: '3-3-2'}, {struct_name: '3-4-2'}, {struct_name: '3-5-2'}, {struct_name: '3-1-3'}, {struct_name: '3-2-3'}, {struct_name: '3-3-3'}, {struct_name: '3-4-3'}, {struct_name: '3-5-3'}, {struct_name: '3-1-4'}, {struct_name: '3-2-4'}, {struct_name: '3-3-4'}, {struct_name: '3-4-4'}, {struct_name: '3-5-4'}, {struct_name: '3-1-5'}, {struct_name: '3-2-5'}, {struct_name: '3-3-5'}, {struct_name: '3-4-5'}, {struct_name: '3-5-5'}, {struct_name: '3-1-6'}, {struct_name: '3-2-6'}, {struct_name: '3-3-6'}, {struct_name: '3-4-6'}, {struct_name: '3-5-6'}, {struct_name: '3-1-7'}, {struct_name: '3-2-7'}, {struct_name: '3-3-7'}, {struct_name: '3-4-7'}, {struct_name: '3-5-7'}, {struct_name: '3-1-8'}, {struct_name: '3-2-8'}, {struct_name: '3-3-8'}, {struct_name: '3-4-8'}, {struct_name: '3-5-8'}, {struct_name: '3-1-9'}, {struct_name: '3-2-9'}, {struct_name: '3-3-9'}, {struct_name: '3-4-9'}, {struct_name: '3-5-9'}, {struct_name: '3-1-10'}, {struct_name: '3-2-10'}, {struct_name: '3-3-10'}, {struct_name: '3-4-10'}, {struct_name: '3-5-10'}, {struct_name: '3-1-11'}, {struct_name: '3-2-11'}, {struct_name: '3-3-11'}, {struct_name: '3-4-11'}, {struct_name: '3-5-11'}, {struct_name: '3-1-12'}, {struct_name: '3-2-12'}, {struct_name: '3-3-12'}, {struct_name: '3-4-12'}, {struct_name: '3-5-12'}, {struct_name: '3-1-13'}, {struct_name: '3-2-13'}, {struct_name: '3-3-13'}, {struct_name: '3-4-13'}, {struct_name: '3-5-13'}, {struct_name: '3-1-14'}, {struct_name: '3-2-14'}, {struct_name: '3-3-14'}, {struct_name: '3-4-14'}, {struct_name: '3-5-14'}, {struct_name: '3-1-15'}, {struct_name: '3-2-15'}, {struct_name: '3-3-15'}, {struct_name: '3-4-15'}, {struct_name: '3-5-15'},
|
||||
{struct_name: '4-5-1'}, {struct_name: '4-4-1'}, {struct_name: '4-3-1'}, {struct_name: '4-2-1'}, {struct_name: '4-1-1'}, {struct_name: '4-5-2'}, {struct_name: '4-4-2'}, {struct_name: '4-3-2'}, {struct_name: '4-2-2'}, {struct_name: '4-1-2'}, {struct_name: '4-5-3'}, {struct_name: '4-4-3'}, {struct_name: '4-3-3'}, {struct_name: '4-2-3'}, {struct_name: '4-1-3'}, {struct_name: '4-5-4'}, {struct_name: '4-4-4'}, {struct_name: '4-3-4'}, {struct_name: '4-2-4'}, {struct_name: '4-1-4'}, {struct_name: '4-5-5'}, {struct_name: '4-4-5'}, {struct_name: '4-3-5'}, {struct_name: '4-2-5'}, {struct_name: '4-1-5'}, {struct_name: '4-5-6'}, {struct_name: '4-4-6'}, {struct_name: '4-3-6'}, {struct_name: '4-2-6'}, {struct_name: '4-1-6'}, {struct_name: '4-5-7'}, {struct_name: '4-4-7'}, {struct_name: '4-3-7'}, {struct_name: '4-2-7'}, {struct_name: '4-1-7'}, {struct_name: '4-5-8'}, {struct_name: '4-4-8'}, {struct_name: '4-3-8'}, {struct_name: '4-2-8'}, {struct_name: '4-1-8'}, {struct_name: '4-5-9'}, {struct_name: '4-4-9'}, {struct_name: '4-3-9'}, {struct_name: '4-2-9'}, {struct_name: '4-1-9'}, {struct_name: '4-5-10'}, {struct_name: '4-4-10'}, {struct_name: '4-3-10'}, {struct_name: '4-2-10'}, {struct_name: '4-1-10'}, {struct_name: '4-5-11'}, {struct_name: '4-4-11'}, {struct_name: '4-3-11'}, {struct_name: '4-2-11'}, {struct_name: '4-1-11'}, {struct_name: '4-5-12'}, {struct_name: '4-4-12'}, {struct_name: '4-3-12'}, {struct_name: '4-2-12'}, {struct_name: '4-1-12'}, {struct_name: '4-5-13'}, {struct_name: '4-4-13'}, {struct_name: '4-3-13'}, {struct_name: '4-2-13'}, {struct_name: '4-1-13'}, {struct_name: '4-5-14'}, {struct_name: '4-4-14'}, {struct_name: '4-3-14'}, {struct_name: '4-2-14'}, {struct_name: '4-1-14'}, {struct_name: '4-5-15'}, {struct_name: '4-4-15'}, {struct_name: '4-3-15'}, {struct_name: '4-2-15'}, {struct_name: '4-1-15'},
|
||||
{struct_name: '5-1-1'}, {struct_name: '5-2-1'}, {struct_name: '5-3-1'}, {struct_name: '5-4-1'}, {struct_name: '5-5-1'}, {struct_name: '5-1-2'}, {struct_name: '5-2-2'}, {struct_name: '5-3-2'}, {struct_name: '5-4-2'}, {struct_name: '5-5-2'}, {struct_name: '5-1-3'}, {struct_name: '5-2-3'}, {struct_name: '5-3-3'}, {struct_name: '5-4-3'}, {struct_name: '5-5-3'}, {struct_name: '5-1-4'}, {struct_name: '5-2-4'}, {struct_name: '5-3-4'}, {struct_name: '5-4-4'}, {struct_name: '5-5-4'}, {struct_name: '5-1-5'}, {struct_name: '5-2-5'}, {struct_name: '5-3-5'}, {struct_name: '5-4-5'}, {struct_name: '5-5-5'}, {struct_name: '5-1-6'}, {struct_name: '5-2-6'}, {struct_name: '5-3-6'}, {struct_name: '5-4-6'}, {struct_name: '5-5-6'}, {struct_name: '5-1-7'}, {struct_name: '5-2-7'}, {struct_name: '5-3-7'}, {struct_name: '5-4-7'}, {struct_name: '5-5-7'}, {struct_name: '5-1-8'}, {struct_name: '5-2-8'}, {struct_name: '5-3-8'}, {struct_name: '5-4-8'}, {struct_name: '5-5-8'}, {struct_name: '5-1-9'}, {struct_name: '5-2-9'}, {struct_name: '5-3-9'}, {struct_name: '5-4-9'}, {struct_name: '5-5-9'}, {struct_name: '5-1-10'}, {struct_name: '5-2-10'}, {struct_name: '5-3-10'}, {struct_name: '5-4-10'}, {struct_name: '5-5-10'}, {struct_name: '5-1-11'}, {struct_name: '5-2-11'}, {struct_name: '5-3-11'}, {struct_name: '5-4-11'}, {struct_name: '5-5-11'}, {struct_name: '5-1-12'}, {struct_name: '5-2-12'}, {struct_name: '5-3-12'}, {struct_name: '5-4-12'}, {struct_name: '5-5-12'}, {struct_name: '5-1-13'}, {struct_name: '5-2-13'}, {struct_name: '5-3-13'}, {struct_name: '5-4-13'}, {struct_name: '5-5-13'}, {struct_name: '5-1-14'}, {struct_name: '5-2-14'}, {struct_name: '5-3-14'}, {struct_name: '5-4-14'}, {struct_name: '5-5-14'}, {struct_name: '5-1-15'}, {struct_name: '5-2-15'}, {struct_name: '5-3-15'}, {struct_name: '5-4-15'}, {struct_name: '5-5-15'},
|
||||
{struct_name: '6-5-1'}, {struct_name: '6-4-1'}, {struct_name: '6-3-1'}, {struct_name: '6-2-1'}, {struct_name: '6-1-1'}, {struct_name: '6-5-2'}, {struct_name: '6-4-2'}, {struct_name: '6-3-2'}, {struct_name: '6-2-2'}, {struct_name: '6-1-2'}, {struct_name: '6-5-3'}, {struct_name: '6-4-3'}, {struct_name: '6-3-3'}, {struct_name: '6-2-3'}, {struct_name: '6-1-3'}, {struct_name: '6-5-4'}, {struct_name: '6-4-4'}, {struct_name: '6-3-4'}, {struct_name: '6-2-4'}, {struct_name: '6-1-4'}, {struct_name: '6-5-5'}, {struct_name: '6-4-5'}, {struct_name: '6-3-5'}, {struct_name: '6-2-5'}, {struct_name: '6-1-5'}, {struct_name: '6-5-6'}, {struct_name: '6-4-6'}, {struct_name: '6-3-6'}, {struct_name: '6-2-6'}, {struct_name: '6-1-6'}, {struct_name: '6-5-7'}, {struct_name: '6-4-7'}, {struct_name: '6-3-7'}, {struct_name: '6-2-7'}, {struct_name: '6-1-7'}, {struct_name: '6-5-8'}, {struct_name: '6-4-8'}, {struct_name: '6-3-8'}, {struct_name: '6-2-8'}, {struct_name: '6-1-8'}, {struct_name: '6-5-9'}, {struct_name: '6-4-9'}, {struct_name: '6-3-9'}, {struct_name: '6-2-9'}, {struct_name: '6-1-9'}, {struct_name: '6-5-10'}, {struct_name: '6-4-10'}, {struct_name: '6-3-10'}, {struct_name: '6-2-10'}, {struct_name: '6-1-10'}, {struct_name: '6-5-11'}, {struct_name: '6-4-11'}, {struct_name: '6-3-11'}, {struct_name: '6-2-11'}, {struct_name: '6-1-11'}, {struct_name: '6-5-12'}, {struct_name: '6-4-12'}, {struct_name: '6-3-12'}, {struct_name: '6-2-12'}, {struct_name: '6-1-12'}, {struct_name: '6-5-13'}, {struct_name: '6-4-13'}, {struct_name: '6-3-13'}, {struct_name: '6-2-13'}, {struct_name: '6-1-13'}, {struct_name: '6-5-14'}, {struct_name: '6-4-14'}, {struct_name: '6-3-14'}, {struct_name: '6-2-14'}, {struct_name: '6-1-14'}, {struct_name: '6-5-15'}, {struct_name: '6-4-15'}, {struct_name: '6-3-15'}, {struct_name: '6-2-15'}, {struct_name: '6-1-15'},
|
||||
{struct_name: '7-1-1'}, {struct_name: '7-2-1'}, {struct_name: '7-3-1'}, {struct_name: '7-4-1'}, {struct_name: '7-5-1'}, {struct_name: '7-1-2'}, {struct_name: '7-2-2'}, {struct_name: '7-3-2'}, {struct_name: '7-4-2'}, {struct_name: '7-5-2'}, {struct_name: '7-1-3'}, {struct_name: '7-2-3'}, {struct_name: '7-3-3'}, {struct_name: '7-4-3'}, {struct_name: '7-5-3'}, {struct_name: '7-1-4'}, {struct_name: '7-2-4'}, {struct_name: '7-3-4'}, {struct_name: '7-4-4'}, {struct_name: '7-5-4'}, {struct_name: '7-1-5'}, {struct_name: '7-2-5'}, {struct_name: '7-3-5'}, {struct_name: '7-4-5'}, {struct_name: '7-5-5'}, {struct_name: '7-1-6'}, {struct_name: '7-2-6'}, {struct_name: '7-3-6'}, {struct_name: '7-4-6'}, {struct_name: '7-5-6'}, {struct_name: '7-1-7'}, {struct_name: '7-2-7'}, {struct_name: '7-3-7'}, {struct_name: '7-4-7'}, {struct_name: '7-5-7'}, {struct_name: '7-1-8'}, {struct_name: '7-2-8'}, {struct_name: '7-3-8'}, {struct_name: '7-4-8'}, {struct_name: '7-5-8'}, {struct_name: '7-1-9'}, {struct_name: '7-2-9'}, {struct_name: '7-3-9'}, {struct_name: '7-4-9'}, {struct_name: '7-5-9'}, {struct_name: '7-1-10'}, {struct_name: '7-2-10'}, {struct_name: '7-3-10'}, {struct_name: '7-4-10'}, {struct_name: '7-5-10'}, {struct_name: '7-1-11'}, {struct_name: '7-2-11'}, {struct_name: '7-3-11'}, {struct_name: '7-4-11'}, {struct_name: '7-5-11'}, {struct_name: '7-1-12'}, {struct_name: '7-2-12'}, {struct_name: '7-3-12'}, {struct_name: '7-4-12'}, {struct_name: '7-5-12'}, {struct_name: '7-1-13'}, {struct_name: '7-2-13'}, {struct_name: '7-3-13'}, {struct_name: '7-4-13'}, {struct_name: '7-5-13'}, {struct_name: '7-1-14'}, {struct_name: '7-2-14'}, {struct_name: '7-3-14'}, {struct_name: '7-4-14'}, {struct_name: '7-5-14'}, {struct_name: '7-1-15'}, {struct_name: '7-2-15'}, {struct_name: '7-3-15'}, {struct_name: '7-4-15'}, {struct_name: '7-5-15'},
|
||||
{struct_name: '8-5-1'}, {struct_name: '8-4-1'}, {struct_name: '8-3-1'}, {struct_name: '8-2-1'}, {struct_name: '8-1-1'}, {struct_name: '8-5-2'}, {struct_name: '8-4-2'}, {struct_name: '8-3-2'}, {struct_name: '8-2-2'}, {struct_name: '8-1-2'}, {struct_name: '8-5-3'}, {struct_name: '8-4-3'}, {struct_name: '8-3-3'}, {struct_name: '8-2-3'}, {struct_name: '8-1-3'}, {struct_name: '8-5-4'}, {struct_name: '8-4-4'}, {struct_name: '8-3-4'}, {struct_name: '8-2-4'}, {struct_name: '8-1-4'}, {struct_name: '8-5-5'}, {struct_name: '8-4-5'}, {struct_name: '8-3-5'}, {struct_name: '8-2-5'}, {struct_name: '8-1-5'}, {struct_name: '8-5-6'}, {struct_name: '8-4-6'}, {struct_name: '8-3-6'}, {struct_name: '8-2-6'}, {struct_name: '8-1-6'}, {struct_name: '8-5-7'}, {struct_name: '8-4-7'}, {struct_name: '8-3-7'}, {struct_name: '8-2-7'}, {struct_name: '8-1-7'}, {struct_name: '8-5-8'}, {struct_name: '8-4-8'}, {struct_name: '8-3-8'}, {struct_name: '8-2-8'}, {struct_name: '8-1-8'}, {struct_name: '8-5-9'}, {struct_name: '8-4-9'}, {struct_name: '8-3-9'}, {struct_name: '8-2-9'}, {struct_name: '8-1-9'}, {struct_name: '8-5-10'}, {struct_name: '8-4-10'}, {struct_name: '8-3-10'}, {struct_name: '8-2-10'}, {struct_name: '8-1-10'}, {struct_name: '8-5-11'}, {struct_name: '8-4-11'}, {struct_name: '8-3-11'}, {struct_name: '8-2-11'}, {struct_name: '8-1-11'}, {struct_name: '8-5-12'}, {struct_name: '8-4-12'}, {struct_name: '8-3-12'}, {struct_name: '8-2-12'}, {struct_name: '8-1-12'}, {struct_name: '8-5-13'}, {struct_name: '8-4-13'}, {struct_name: '8-3-13'}, {struct_name: '8-2-13'}, {struct_name: '8-1-13'}, {struct_name: '8-5-14'}, {struct_name: '8-4-14'}, {struct_name: '8-3-14'}, {struct_name: '8-2-14'}, {struct_name: '8-1-14'}, {struct_name: '8-5-15'}, {struct_name: '8-4-15'}, {struct_name: '8-3-15'}, {struct_name: '8-2-15'}, {struct_name: '8-1-15'},
|
||||
{struct_name: '9-5-1'}, {struct_name: '9-4-1'}, {struct_name: '9-3-1'}, {struct_name: '9-2-1'}, {struct_name: '9-1-1'}, {struct_name: '9-5-2'}, {struct_name: '9-4-2'}, {struct_name: '9-3-2'}, {struct_name: '9-2-2'}, {struct_name: '9-1-2'}, {struct_name: '9-5-3'}, {struct_name: '9-4-3'}, {struct_name: '9-3-3'}, {struct_name: '9-2-3'}, {struct_name: '9-1-3'}, {struct_name: '9-5-4'}, {struct_name: '9-4-4'}, {struct_name: '9-3-4'}, {struct_name: '9-2-4'}, {struct_name: '9-1-4'}, {struct_name: '9-5-5'}, {struct_name: '9-4-5'}, {struct_name: '9-3-5'}, {struct_name: '9-2-5'}, {struct_name: '9-1-5'}, {struct_name: '9-5-6'}, {struct_name: '9-4-6'}, {struct_name: '9-3-6'}, {struct_name: '9-2-6'}, {struct_name: '9-1-6'}, {struct_name: '9-5-7'}, {struct_name: '9-4-7'}, {struct_name: '9-3-7'}, {struct_name: '9-2-7'}, {struct_name: '9-1-7'}, {struct_name: '9-5-8'}, {struct_name: '9-4-8'}, {struct_name: '9-3-8'}, {struct_name: '9-2-8'}, {struct_name: '9-1-8'}, {struct_name: '9-5-9'}, {struct_name: '9-4-9'}, {struct_name: '9-3-9'}, {struct_name: '9-2-9'}, {struct_name: '9-1-9'}, {struct_name: '9-5-10'}, {struct_name: '9-4-10'}, {struct_name: '9-3-10'}, {struct_name: '9-2-10'}, {struct_name: '9-1-10'}, {struct_name: '9-5-11'}, {struct_name: '9-4-11'}, {struct_name: '9-3-11'}, {struct_name: '9-2-11'}, {struct_name: '9-1-11'}, {struct_name: '9-5-12'}, {struct_name: '9-4-12'}, {struct_name: '9-3-12'}, {struct_name: '9-2-12'}, {struct_name: '9-1-12'}, {struct_name: '9-5-13'}, {struct_name: '9-4-13'}, {struct_name: '9-3-13'}, {struct_name: '9-2-13'}, {struct_name: '9-1-13'}, {struct_name: '9-5-14'}, {struct_name: '9-4-14'}, {struct_name: '9-3-14'}, {struct_name: '9-2-14'}, {struct_name: '9-1-14'}, {struct_name: '9-5-15'}, {struct_name: '9-4-15'}, {struct_name: '9-3-15'}, {struct_name: '9-2-15'}, {struct_name: '9-1-15'}
|
||||
],
|
||||
coordinateX: '',
|
||||
coordinateY: '',
|
||||
equipInfo: {},
|
||||
equipArr: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
defaultOption () {
|
||||
return {
|
||||
step: 0.4, // 数值越大速度滚动越快
|
||||
limitMoveNum: 5, // 开始无缝滚动的数据量 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.initData()
|
||||
this.refresh()
|
||||
},
|
||||
beforeDestroy () {
|
||||
clearInterval(this.timer)
|
||||
},
|
||||
methods: {
|
||||
refresh () {
|
||||
this.timer = setInterval(() => {
|
||||
this.initData()
|
||||
}, this.interTime)
|
||||
},
|
||||
initGroup () {
|
||||
this.allGroup.map(el => {
|
||||
this.$set(el, 'disabled', false)
|
||||
// this.$set(el, 'bgcolor', '')
|
||||
})
|
||||
},
|
||||
async initData () {
|
||||
await this.initGroup()
|
||||
let data = {
|
||||
'_SRVNAME': 'server.app.screenAPI',
|
||||
'_SRVMETHOD': 'queryEquipProductFor090',
|
||||
'_DATA': JSON.stringify({
|
||||
accountId: this.$store.getters.accountId,
|
||||
form: {
|
||||
center_id: this.$store.getters.workshopId,
|
||||
Workstation_code: '090'
|
||||
}
|
||||
})
|
||||
}
|
||||
this
|
||||
.$post(data)
|
||||
.then(res => {
|
||||
if (res.code === '1') {
|
||||
let array1 = res.result.array1
|
||||
for (let i = 0; i < array1.length; i++) {
|
||||
for (let j = 0; j < this.allGroup.length; j++) {
|
||||
if (array1[i].struct_name === this.allGroup[j].struct_name) {
|
||||
if (Number(array1[i].ivt_qty) > 0) {
|
||||
this.allGroup[j].bgcolor = 'sblue'
|
||||
} else {
|
||||
this.allGroup[j].bgcolor = ''
|
||||
}
|
||||
if (Number(array1[i].warehousing_num) > 0) {
|
||||
this.allGroup[j].bgcolor = 'sgreen'
|
||||
}
|
||||
if (Number(array1[i].frozen_num) > 0) {
|
||||
this.allGroup[j].bgcolor = 'sred'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
this.array2 = res.result.array2
|
||||
this.array3 = res.result.array3
|
||||
} else {
|
||||
this.toast(res.desc)
|
||||
}
|
||||
})
|
||||
},
|
||||
getInfo (event, e) {
|
||||
let cWidth = document.body.scrollWidth / 2
|
||||
let cHeight = document.body.scrollHeight / 3
|
||||
if (event.clientX <= cWidth) {
|
||||
this.coordinateX = '90%'
|
||||
} else {
|
||||
this.coordinateX = '-4.8rem'
|
||||
}
|
||||
if (event.clientY <= cHeight) {
|
||||
this.coordinateY = '90%'
|
||||
} else {
|
||||
this.coordinateY = '-2.8rem'
|
||||
}
|
||||
let data = {
|
||||
'_SRVNAME': 'server.app.screenAPI',
|
||||
'_SRVMETHOD': 'queryEquipInfoFor090',
|
||||
'_DATA': JSON.stringify({
|
||||
accountId: '',
|
||||
form: {
|
||||
simple_name: e.struct_name
|
||||
}
|
||||
})
|
||||
}
|
||||
this
|
||||
.$post(data)
|
||||
.then(res => {
|
||||
if (res.code === '1') {
|
||||
this.allGroup.map(el => {
|
||||
if (e === el) {
|
||||
e.disabled = !e.disabled
|
||||
} else {
|
||||
el.disabled = false
|
||||
}
|
||||
})
|
||||
this.equipInfo = {}
|
||||
this.equipArr = []
|
||||
this.equipInfo = res.result
|
||||
this.equipArr = res.allrows
|
||||
} else {
|
||||
this.toast(res.desc)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~@css/mixin'
|
||||
.bg
|
||||
_wh(100%, 100%)
|
||||
overflow hidden
|
||||
.p1
|
||||
position absolute
|
||||
display block
|
||||
cursor pointer
|
||||
left .2509rem
|
||||
top .22rem
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.2rem, .30rem, #fff, 700,)
|
||||
letter-spacing .01rem
|
||||
.container
|
||||
_wh(100%, calc(100% - 1.38rem))
|
||||
padding .3rem .2509rem 0
|
||||
overflow hidden
|
||||
.bottom
|
||||
_wh(100%, .38rem)
|
||||
background center bottom / 19.06rem 100% url(../../assets/images/screen1/bottom.png) no-repeat
|
||||
.yard-wrap
|
||||
height 66%
|
||||
width 100%
|
||||
margin-bottom .2rem
|
||||
.yard_group
|
||||
width 10.2%
|
||||
height 100%
|
||||
float left
|
||||
.yard_group_1
|
||||
margin-right 1%
|
||||
.yard_group_2, .yard_group_4, .yard_group_6, .yard_group_8
|
||||
margin-right 1.6%
|
||||
.yard_group_3, .yard_group_5, .yard_group_7
|
||||
margin-right .1%
|
||||
.yard_group_1
|
||||
margin-left .2%
|
||||
.yard_group_9
|
||||
margin-right .2%
|
||||
.yard_group_ul
|
||||
width 100%
|
||||
border-top 1px solid #BECFEE
|
||||
border-left 1px solid #BECFEE
|
||||
.yard_group_ul_1
|
||||
li
|
||||
&:nth-child(71), &:nth-child(72), &:nth-child(73), &:nth-child(74), &:nth-child(75)
|
||||
visibility:hidden
|
||||
.yard_group_cell
|
||||
position relative
|
||||
width 20%
|
||||
float left
|
||||
height 6.2666%
|
||||
display flex
|
||||
align-items center
|
||||
justify-content center
|
||||
border-right 1px solid #BECFEE
|
||||
border-bottom 1px solid #BECFEE
|
||||
background-color #fff
|
||||
box-sizing border-box
|
||||
.primary
|
||||
background #f5f5f5
|
||||
span
|
||||
color #333
|
||||
.sblue
|
||||
background #3164f1
|
||||
span
|
||||
color #fff
|
||||
.sred
|
||||
background #ed4040
|
||||
span
|
||||
color #fff
|
||||
.sgreen
|
||||
background #59c262
|
||||
span
|
||||
color #fff
|
||||
.syellow
|
||||
background #f39669
|
||||
span
|
||||
color #fff
|
||||
.disabled
|
||||
background #919191
|
||||
span
|
||||
color #fff
|
||||
.active
|
||||
background #f39669
|
||||
span
|
||||
color #fff
|
||||
button
|
||||
display block
|
||||
width 100%
|
||||
height 100%
|
||||
margin 0
|
||||
padding 0
|
||||
border none
|
||||
outline none
|
||||
overflow hidden
|
||||
text-align center
|
||||
span
|
||||
font-size .12rem
|
||||
white-space:nowrap
|
||||
.scaleFont
|
||||
display inline-block
|
||||
transform scale(.9)
|
||||
color #333
|
||||
.yard_number
|
||||
height 5.5%
|
||||
width 100%
|
||||
font-size .18rem
|
||||
display flex
|
||||
align-items center
|
||||
justify-content center
|
||||
.content-wrap
|
||||
height calc(34% - .2rem)
|
||||
overflow hidden
|
||||
.content-block
|
||||
width 49%
|
||||
height 100%
|
||||
// background center / 100% 100% url(../assets/images/devintro-leftb-bg.png) no-repeat
|
||||
.item_tip
|
||||
_wh(100%, .32rem)
|
||||
line-height .32rem
|
||||
background center center / 100% 100% url(../../assets/images/screen1/title_bg_2.png) no-repeat
|
||||
.item_tip_left
|
||||
float left
|
||||
_wh(60%, 100%)
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.18rem, inherit, #fff, 700,)
|
||||
letter-spacing .02rem
|
||||
text-shadow 0 0 .09rem #159AFF
|
||||
padding-left .38rem
|
||||
.locate-wrap
|
||||
position absolute
|
||||
width 4.8rem
|
||||
z-index 999
|
||||
// background center / 100% 100% url(../assets/images/mon_04.png) no-repeat
|
||||
padding .5rem .4rem .5rem .5rem
|
||||
.locate-content
|
||||
position relative
|
||||
z-index 90
|
||||
left -0.05rem
|
||||
width 100%
|
||||
.tan_pline
|
||||
width 3.5rem
|
||||
margin 0 auto
|
||||
.tan_p
|
||||
display block
|
||||
float left
|
||||
width 50%
|
||||
font-size .14rem
|
||||
line-height .18rem
|
||||
height .18rem
|
||||
overflow hidden
|
||||
padding-right .1rem
|
||||
color #fff
|
||||
margin-bottom .1rem
|
||||
.tan_tables
|
||||
width 3.5rem
|
||||
margin 0 auto
|
||||
table
|
||||
width 100%
|
||||
text-align center
|
||||
vertical-align middle
|
||||
tr
|
||||
th, td
|
||||
font-size .13rem
|
||||
line-height .18rem
|
||||
color #fff
|
||||
border 1px solid #919191
|
||||
padding .02rem
|
||||
text-align center
|
||||
vertical-align middle
|
||||
.item_content
|
||||
_wh(100%, calc(100% - 0.38rem))
|
||||
padding 0
|
||||
margin-top .06rem
|
||||
border 0.01rem solid rgba(8,205,248,0.3)
|
||||
background-color #011834
|
||||
.scroll_wrap
|
||||
_wh(100%, 100%)
|
||||
background-image linear-gradient(180deg, rgba(55,141,186,0.00) 0%, rgba(40,183,235,0.10) 100%)
|
||||
overflow hidden
|
||||
.scroll_tab
|
||||
_wh(100%, .4rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
li
|
||||
float left
|
||||
width 13%
|
||||
_font(.14rem,.4rem,#78B1DE,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
white-space nowrap
|
||||
padding 0 .02rem
|
||||
overflow hidden
|
||||
box-sizing border-box
|
||||
&:nth-child(5)
|
||||
width 22%
|
||||
.scroll_container
|
||||
width 100%
|
||||
height calc(100% - .4rem)
|
||||
overflow hidden
|
||||
.scroll-ul_1
|
||||
li
|
||||
_wh(100%, .44rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
&:nth-child(even)
|
||||
background rgba(1,24,52,0.60)
|
||||
box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
|
||||
.scroll-ul_1_div
|
||||
float left
|
||||
_wh(13%, .44rem)
|
||||
_fj(center)
|
||||
_font(.14rem, .18rem, #fff,,center)
|
||||
// word-wrap break-word
|
||||
// word-break break-all
|
||||
// white-space nowrap
|
||||
padding .04rem .02rem
|
||||
overflow hidden
|
||||
&:nth-child(5)
|
||||
width 22%
|
||||
.scroll_status_wrap
|
||||
position relative
|
||||
span
|
||||
position absolute
|
||||
left 25%
|
||||
_wh(7px, 7px)
|
||||
border-radius 50%
|
||||
</style>
|
||||
@@ -0,0 +1,686 @@
|
||||
<template>
|
||||
<section class="bg">
|
||||
<t-header title="海亮铜管件智能车间推弯生产看板">
|
||||
<p class="p1" @click="toJump">海亮铜管件智能车间直盘管下料看板</p>
|
||||
</t-header>
|
||||
<div class="container">
|
||||
<div class="fir_wrap">
|
||||
<div class="item_wrap_l">
|
||||
<div class="item_tip item_tip_l">
|
||||
<div class="item_tip_left">盘管下料</div>
|
||||
</div>
|
||||
<div class="item_content item_content_1">
|
||||
<div class="item_wrap_l item_wrap_flex">
|
||||
<div class="item_td_box">
|
||||
<div class="item_td_inner">
|
||||
<div class="item_td_txt1">计划生产</div>
|
||||
<div class="item_td_txt2">10000<span>个</span></div>
|
||||
</div>
|
||||
<div class="item_td_inner">
|
||||
<div class="item_td_txt1">已生产</div>
|
||||
<div class="item_td_txt2">10000<span>个</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_td_box item_td_box_1">
|
||||
<div class="echart_zpg_wrap_1">
|
||||
<div id="echart_zpg_1" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec_wrap">
|
||||
<div class="left_wrap">
|
||||
<div class="item_wrap_l">
|
||||
<div class="item_tip">
|
||||
<div class="item_tip_left">设备报警信息</div>
|
||||
</div>
|
||||
<div class="item_content item_content_2">
|
||||
<div class="alarm_box_l"></div>
|
||||
<div class="alarm_box_r">
|
||||
<vue-seamless-scroll class="scroll_wrap" :data="scollList1" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in scollList1" :key="i">
|
||||
<div class="scroll-ul_1_div">{{e.time}}</div>
|
||||
<div class="scroll-ul_1_div">{{e.p}}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right_wrap">
|
||||
<div class="item_wrap_l">
|
||||
<div class="item_tip">
|
||||
<div class="item_tip_left">设备状态</div>
|
||||
</div>
|
||||
<div class="item_content">
|
||||
<div id="echart_zpg_5" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom_wrap">
|
||||
<div class="item_wrap_l">
|
||||
<div class="item_tip item_tip_l">
|
||||
<div class="item_tip_left">任务列表</div>
|
||||
</div>
|
||||
<div class="item_content item_content_3">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab">
|
||||
<li>序号</li>
|
||||
<li>工单号</li>
|
||||
<li>物料</li>
|
||||
<li>规格</li>
|
||||
<li>数量</li>
|
||||
<li>已生产</li>
|
||||
<li>单位</li>
|
||||
<li>机台</li>
|
||||
<li>归属订单</li>
|
||||
<li>状态</li>
|
||||
<li>计划开始</li>
|
||||
<li>开始时间</li>
|
||||
<li>结束时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container">
|
||||
<vue-seamless-scroll :data="scollList2" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in scollList2" :key="i">
|
||||
<div class="scroll-ul_2_div">{{i + 1}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.data1}}</div>
|
||||
<div class="scroll-ul_2_div">盘管双斜</div>
|
||||
<div class="scroll-ul_2_div">规格1</div>
|
||||
<div class="scroll-ul_2_div">15000</div>
|
||||
<div class="scroll-ul_2_div">15010</div>
|
||||
<div class="scroll-ul_2_div">个</div>
|
||||
<div class="scroll-ul_2_div">盘管双斜1</div>
|
||||
<div class="scroll-ul_2_div">{{e.data1}}</div>
|
||||
<div class="scroll-ul_2_div scroll_status_wrap"><span :style="{'background-color': ['#33CCCC', '#EAAD24', '#0E90FD', '#c9c9c9'][Number(e.device_status)]}"></span>已完成</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="bottom"></section>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import THeader from '@components/header.vue'
|
||||
export default {
|
||||
name: 'TuiWan',
|
||||
components: {
|
||||
THeader
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
myCharts1: '',
|
||||
myCharts2: '',
|
||||
myCharts3: '',
|
||||
myCharts4: '',
|
||||
myCharts5: '',
|
||||
scollList1: [{time: '2020-1-1', p: '故障故障故障故障故障1'}, {time: '2020-1-1', p: '故障故障故障故障故障2'}, {time: '2020-1-1', p: '故障故障故障故障故障3'}, {time: '2020-1-1', p: '故障故障故障故障故障4'}],
|
||||
echartData1: [{data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}],
|
||||
scollList2: [{data1: 'GD00001', device_status: '0'}, {data1: 'GD00001', device_status: '1'}, {data1: 'GD00001', device_status: '2'}, {data1: 'GD00001', device_status: '3'}]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
defaultOption1 () {
|
||||
return {
|
||||
step: 0.4, // 数值越大速度滚动越快
|
||||
limitMoveNum: 5, // 开始无缝滚动的数据量 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)
|
||||
}
|
||||
},
|
||||
defaultOption2 () {
|
||||
return {
|
||||
step: 0.4, // 数值越大速度滚动越快
|
||||
limitMoveNum: 6, // 开始无缝滚动的数据量 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.setEchart1()
|
||||
this.setEchart2()
|
||||
},
|
||||
methods: {
|
||||
toJump () {
|
||||
this.$router.push('/TuiWan')
|
||||
},
|
||||
setEchart1 () {
|
||||
// let value = Number(this.objL1.finish_rate)
|
||||
let value = 50
|
||||
let title = '%'
|
||||
let text = '进度'
|
||||
let option = {
|
||||
title: [
|
||||
{
|
||||
text: '{a|' + value + '}{b|' + title + '}\n{c|' + text + '}',
|
||||
x: 'center',
|
||||
y: 'center',
|
||||
textStyle: {
|
||||
rich: {
|
||||
a: {
|
||||
fontSize: 26,
|
||||
color: '#00D9FF',
|
||||
fontFamily: 'SourceHanSansCN',
|
||||
foontWeight: '700'
|
||||
},
|
||||
b: {
|
||||
fontSize: 16,
|
||||
color: '#ffffff',
|
||||
fontFamily: 'SourceHanSansCN',
|
||||
foontWeight: '700',
|
||||
padding: [10, 0, 0, 3]
|
||||
},
|
||||
c: {
|
||||
color: '#FFFFFF',
|
||||
fontSize: 13,
|
||||
fontWeight: '700',
|
||||
fontFamily: 'SourceHanSansCN',
|
||||
padding: [10, 0, 0, 0]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
polar: {
|
||||
radius: ['75%', '83%'],
|
||||
center: ['50%', '50%']
|
||||
},
|
||||
angleAxis: {
|
||||
max: 100,
|
||||
show: false
|
||||
},
|
||||
radiusAxis: {
|
||||
type: 'category',
|
||||
show: true,
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{name: '',
|
||||
type: 'bar',
|
||||
roundCap: true,
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: '#0a2543'
|
||||
},
|
||||
data: [value],
|
||||
coordinateSystem: 'polar',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#00dfff'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
let option1 = JSON.parse(JSON.stringify(option))
|
||||
let option2 = JSON.parse(JSON.stringify(option))
|
||||
let option3 = JSON.parse(JSON.stringify(option))
|
||||
let option4 = JSON.parse(JSON.stringify(option))
|
||||
option1.title[0].text = '{a|' + '10' + '}{b|' + title + '}\n{c|' + text + '}'
|
||||
option2.title[0].text = '{a|' + '20' + '}{b|' + title + '}\n{c|' + text + '}'
|
||||
option3.title[0].text = '{a|' + '30' + '}{b|' + title + '}\n{c|' + text + '}'
|
||||
option4.title[0].text = '{a|' + '40' + '}{b|' + title + '}\n{c|' + text + '}'
|
||||
let echart1 = document.getElementById('echart_zpg_1')
|
||||
let echart2 = document.getElementById('echart_zpg_2')
|
||||
let echart3 = document.getElementById('echart_zpg_3')
|
||||
let echart4 = document.getElementById('echart_zpg_4')
|
||||
if (this.myCharts1 !== '') {
|
||||
this.myCharts1.dispose()
|
||||
}
|
||||
if (this.myCharts2 !== '') {
|
||||
this.myCharts2.dispose()
|
||||
}
|
||||
if (this.myCharts3 !== '') {
|
||||
this.myCharts3.dispose()
|
||||
}
|
||||
if (this.myCharts4 !== '') {
|
||||
this.myCharts4.dispose()
|
||||
}
|
||||
if (echart1 !== null) {
|
||||
this.myCharts1 = this.$echarts.init(echart1)
|
||||
this.myCharts1.setOption(option1)
|
||||
window.addEventListener('resize', () => {
|
||||
this.myCharts1.resize()
|
||||
})
|
||||
}
|
||||
if (echart2 !== null) {
|
||||
this.myCharts2 = this.$echarts.init(echart2)
|
||||
this.myCharts2.setOption(option2)
|
||||
window.addEventListener('resize', () => {
|
||||
this.myCharts2.resize()
|
||||
})
|
||||
}
|
||||
if (echart3 !== null) {
|
||||
this.myCharts3 = this.$echarts.init(echart3)
|
||||
this.myCharts3.setOption(option3)
|
||||
window.addEventListener('resize', () => {
|
||||
this.myCharts3.resize()
|
||||
})
|
||||
}
|
||||
if (echart4 !== null) {
|
||||
this.myCharts4 = this.$echarts.init(echart4)
|
||||
this.myCharts4.setOption(option4)
|
||||
window.addEventListener('resize', () => {
|
||||
this.myCharts4.resize()
|
||||
})
|
||||
}
|
||||
},
|
||||
setEchart2 () {
|
||||
let data1 = []
|
||||
let data2 = []
|
||||
let data3 = []
|
||||
let data4 = []
|
||||
let device = []
|
||||
this.echartData1.map(e => {
|
||||
data1.push(e.data1)
|
||||
data2.push(e.data2)
|
||||
data3.push(e.data3)
|
||||
data4.push(e.data4)
|
||||
device.push(e.device)
|
||||
})
|
||||
let option = {
|
||||
grid: {
|
||||
top: 50,
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
containLabel: true
|
||||
},
|
||||
legend: {
|
||||
icon: 'rect',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontSize: 14,
|
||||
lineHeight: 14
|
||||
},
|
||||
itemGap: 30.86,
|
||||
itemWidth: 14.16,
|
||||
itemHeight: 7.38,
|
||||
data: [{name: '正常运行', itemStyle: {color: '#33CCCC'}}, {name: '故障', itemStyle: {color: '#EAAD24'}}, {name: '待机', itemStyle: {color: '#0E90FD'}}, {name: '关机', itemStyle: {color: '#c9c9c9'}}]
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#8FABBF'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
textStyle: {
|
||||
color: '#8FABBF',
|
||||
fontSize: 16
|
||||
}
|
||||
},
|
||||
data: device
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
splitNumber: 2,
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#8FABBF',
|
||||
fontSize: 14
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
type: [8, 4],
|
||||
dashOffset: 4,
|
||||
color: '#8FABBF'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '正常运行',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#33CCCC',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(31,89,89,0.25)',
|
||||
opacity: 0.25
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data1
|
||||
},
|
||||
{
|
||||
name: '故障',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#B68845',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(134,98,45,0.25)',
|
||||
opacity: 0.25
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data2
|
||||
},
|
||||
{
|
||||
name: '待机',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(96,112,128,0.10)',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: '#0E90FD',
|
||||
opacity: 0.1
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data3
|
||||
},
|
||||
{
|
||||
name: '关机',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#c9c9c9',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(148,145,145,0.25)',
|
||||
opacity: 0.25
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data4
|
||||
}
|
||||
]
|
||||
}
|
||||
let echart = document.getElementById('echart_zpg_5')
|
||||
if (this.myCharts5 !== '') {
|
||||
this.myCharts5.dispose()
|
||||
}
|
||||
if (echart !== null) {
|
||||
this.myCharts5 = this.$echarts.init(echart)
|
||||
this.myCharts5.setOption(option)
|
||||
window.addEventListener('resize', () => {
|
||||
this.myCharts5.resize()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import '~@css/mixin'
|
||||
.bg
|
||||
_wh(100%, 100%)
|
||||
overflow hidden
|
||||
.p1
|
||||
position absolute
|
||||
display block
|
||||
cursor pointer
|
||||
left .2509rem
|
||||
top .22rem
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.18rem, .30rem, #fff, 700,)
|
||||
letter-spacing .01rem
|
||||
.container
|
||||
_wh(100%, calc(100% - 1.38rem))
|
||||
padding .3rem .2509rem 0
|
||||
overflow hidden
|
||||
.bottom
|
||||
_wh(100%, .38rem)
|
||||
background center bottom / 19.06rem 100% url(../../assets/images/screen1/bottom.png) no-repeat
|
||||
.fir_wrap
|
||||
_wh(100%, 25%)
|
||||
.sec_wrap
|
||||
_wh(100%, 35%)
|
||||
clear both
|
||||
.bottom_wrap
|
||||
_wh(100%, calc(40% - .3rem))
|
||||
margin-top .3rem
|
||||
.left_wrap
|
||||
float left
|
||||
width 49%
|
||||
.right_wrap
|
||||
float right
|
||||
width 49%
|
||||
.item_wrap
|
||||
_wh(100%, 50%)
|
||||
.item_wrap_l
|
||||
_wh(100%, 100%)
|
||||
.item_wrap_flex
|
||||
_fj(flex-start)
|
||||
.item_tip
|
||||
_wh(100%, .32rem)
|
||||
line-height .32rem
|
||||
background center center / 100% 100% url(../../assets/images/screen1/title_bg_2.png) no-repeat
|
||||
.item_tip_l
|
||||
background-image url(../../assets/images/screen1/title_bg_3.png)
|
||||
.item_tip_left
|
||||
float left
|
||||
_wh(60%, 100%)
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.18rem, inherit, #fff, 700,)
|
||||
letter-spacing .02rem
|
||||
text-shadow 0 0 .09rem #159AFF
|
||||
padding-left .38rem
|
||||
.item_content
|
||||
_wh(100%, calc(100% - .32rem))
|
||||
padding .17rem .17rem .24rem .17rem
|
||||
background-color #011834
|
||||
.item_content_1
|
||||
clear both
|
||||
.item_td_box_l
|
||||
float left
|
||||
_wh(50%, 100%)
|
||||
padding-right .5rem
|
||||
_fj()
|
||||
.item_td_box_r
|
||||
float right
|
||||
_wh(50%, 100%)
|
||||
padding-left .5rem
|
||||
_fj()
|
||||
background center left / .02rem 1.42rem url(../../assets/images/screen1/line_3.png) no-repeat
|
||||
.item_td_box
|
||||
width auto
|
||||
_fj()
|
||||
.item_td_inner
|
||||
_wh(1.8rem, .7rem)
|
||||
background center bottom / 100% 100% url(../../assets/images/screen1/item_4.png) no-repeat
|
||||
padding .05rem
|
||||
&:nth-child(2)
|
||||
margin-left .2rem
|
||||
.item_td_txt1
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.14rem, .3rem, #78b1de,bold,center)
|
||||
.item_td_txt2
|
||||
font-family "SourceHanSansCN"
|
||||
_font(.18rem, .3rem, #fff,bold,center)
|
||||
span
|
||||
font-size .12rem
|
||||
padding 0 .05rem
|
||||
.echart_zpg_wrap_1
|
||||
_wh(80%, 80%)
|
||||
.item_td_box_1
|
||||
_wh(1.6rem, 1.6rem)
|
||||
_fj(center, center)
|
||||
background center bottom / 100% 100% url(../../assets/images/screen1/item_3.png) no-repeat
|
||||
margin-left .2rem
|
||||
.item_content_2
|
||||
position relative
|
||||
padding 0
|
||||
&::after
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
content ''
|
||||
_wh(100%, 100%)
|
||||
background-image: linear-gradient(0deg,#f1c76d 0px,#f1c76d 1px,transparent 1px,transparent 100px),
|
||||
linear-gradient(90deg,#f1c76d 0px,#f1c76d 1px,transparent 1px,transparent 100px);
|
||||
background-size: 28px 13px
|
||||
opacity .2
|
||||
z-index 10
|
||||
.alarm_box_l
|
||||
position absolute
|
||||
left 10%
|
||||
top 0
|
||||
z-index 100
|
||||
_wh(35%, 100%)
|
||||
background left center / 55% auto url(../../assets/images/alarm.png) no-repeat
|
||||
.alarm_box_r
|
||||
position relative
|
||||
z-index 101
|
||||
_wh(73%, 100%)
|
||||
margin-left 27%
|
||||
padding .17rem 10% .24rem 1rem
|
||||
background-color rgba(244,247,38,.34)
|
||||
&::after
|
||||
content ''
|
||||
_wh(3px, 100%)
|
||||
position absolute
|
||||
z-index 102
|
||||
top 0
|
||||
left 0
|
||||
background rgba(244,247,38,.55)
|
||||
box-shadow 0px 0px 5px 3px rgba(244,247,38,.34)
|
||||
.scroll_wrap
|
||||
_wh(100%, 100%)
|
||||
background-image linear-gradient(180deg, rgba(55,141,186,0.00) 0%, rgba(40,183,235,0.10) 100%)
|
||||
overflow hidden
|
||||
.scroll-ul_1
|
||||
li
|
||||
_wh(100%, .44rem)
|
||||
.scroll-ul_1_div
|
||||
float left
|
||||
_font(.18rem, .44rem, #fff,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
white-space nowrap
|
||||
overflow hidden
|
||||
&:nth-child(1)
|
||||
color #f1c76d
|
||||
margin-right .2rem
|
||||
font-size .16rem
|
||||
.item_content_3
|
||||
height: calc(100% - 0.38rem)
|
||||
padding 0
|
||||
margin-top .06rem
|
||||
border 0.01rem solid rgba(8,205,248,0.3)
|
||||
.scroll_tab
|
||||
_wh(100%, .4rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
li
|
||||
float left
|
||||
width 8%
|
||||
_font(.14rem,.18rem,#78B1DE,,center)
|
||||
// word-wrap break-word
|
||||
// word-break break-all
|
||||
// white-space nowrap
|
||||
padding .04rem .02rem
|
||||
overflow hidden
|
||||
box-sizing border-box
|
||||
&:nth-child(1)
|
||||
width 4%
|
||||
.scroll_container
|
||||
width 100%
|
||||
height calc(100% - .4rem)
|
||||
overflow hidden
|
||||
.scroll-ul_2
|
||||
li
|
||||
_wh(100%, .44rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
&:nth-child(even)
|
||||
background rgba(1,24,52,0.60)
|
||||
box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
|
||||
.scroll-ul_2_div
|
||||
float left
|
||||
_wh(8%, .44rem)
|
||||
_fj(center)
|
||||
_font(.14rem, .44rem, #fff,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
white-space nowrap
|
||||
padding 0 .02rem
|
||||
overflow hidden
|
||||
&:nth-child(1)
|
||||
width 4%
|
||||
.scroll_status_wrap
|
||||
position relative
|
||||
span
|
||||
position absolute
|
||||
left 25%
|
||||
_wh(7px, 7px)
|
||||
border-radius 50%
|
||||
</style>
|
||||
|
||||
@@ -54,7 +54,7 @@
|
||||
<div class="item_content item_content_2">
|
||||
<div class="alarm_box_l"></div>
|
||||
<div class="alarm_box_r">
|
||||
<vue-seamless-scroll :data="scollList1" :class-option="defaultOption1">
|
||||
<vue-seamless-scroll class="scroll_wrap" :data="scollList1" :class-option="defaultOption1">
|
||||
<ul class="scroll-ul_1">
|
||||
<li v-for="(e, i) in scollList1" :key="i">
|
||||
<div class="scroll-ul_1_div">{{e.time}}</div>
|
||||
@@ -123,7 +123,46 @@
|
||||
<div class="item_tip item_tip_l">
|
||||
<div class="item_tip_left">任务列表</div>
|
||||
</div>
|
||||
<div class="item_content"></div>
|
||||
<div class="item_content item_content_3">
|
||||
<div class="scroll_wrap">
|
||||
<ul class="scroll_tab">
|
||||
<li>序号</li>
|
||||
<li>工单号</li>
|
||||
<li>物料</li>
|
||||
<li>规格</li>
|
||||
<li>数量</li>
|
||||
<li>已生产</li>
|
||||
<li>单位</li>
|
||||
<li>机台</li>
|
||||
<li>归属订单</li>
|
||||
<li>状态</li>
|
||||
<li>计划开始</li>
|
||||
<li>开始时间</li>
|
||||
<li>结束时间</li>
|
||||
</ul>
|
||||
<div class="scroll_container">
|
||||
<vue-seamless-scroll :data="scollList2" :class-option="defaultOption2">
|
||||
<ul class="scroll-ul_2">
|
||||
<li v-for="(e, i) in scollList2" :key="i">
|
||||
<div class="scroll-ul_2_div">{{i + 1}}</div>
|
||||
<div class="scroll-ul_2_div">{{e.data1}}</div>
|
||||
<div class="scroll-ul_2_div">盘管双斜</div>
|
||||
<div class="scroll-ul_2_div">规格1</div>
|
||||
<div class="scroll-ul_2_div">15000</div>
|
||||
<div class="scroll-ul_2_div">15010</div>
|
||||
<div class="scroll-ul_2_div">个</div>
|
||||
<div class="scroll-ul_2_div">盘管双斜1</div>
|
||||
<div class="scroll-ul_2_div">{{e.data1}}</div>
|
||||
<div class="scroll-ul_2_div scroll_status_wrap"><span :style="{'background-color': ['#33CCCC', '#EAAD24', '#0E90FD', '#c9c9c9'][Number(e.device_status)]}"></span>已完成</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
<div class="scroll-ul_2_div">08:00:00</div>
|
||||
</li>
|
||||
</ul>
|
||||
</vue-seamless-scroll>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -145,15 +184,28 @@ export default {
|
||||
myCharts3: '',
|
||||
myCharts4: '',
|
||||
myCharts5: '',
|
||||
scollList1: [{time: '2020-1-1', p: '故障故障故障故障故障1'}, {time: '2020-1-1', p: '故障故障故障故障故障2'}, {time: '2020-1-1', p: '故障故障故障故障故障3'}, {time: '2020-1-1', p: '故障故障故障故障故障4'}, {time: '2020-1-1', p: '故障故障故障故障故障5'}, {time: '2020-1-1', p: '故障故障故障故障故障6'}],
|
||||
arrL2: [{date: '2020-1-1', elbow_qty: '1', comprehensive_qty: '2'}]
|
||||
scollList1: [{time: '2020-1-1', p: '故障故障故障故障故障1'}, {time: '2020-1-1', p: '故障故障故障故障故障2'}, {time: '2020-1-1', p: '故障故障故障故障故障3'}, {time: '2020-1-1', p: '故障故障故障故障故障4'}],
|
||||
echartData1: [{data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}, {data1: '10', data2: '15', data3: '9', data4: '5', device: '盘管双斜切'}],
|
||||
scollList2: [{data1: 'GD00001', device_status: '0'}, {data1: 'GD00001', device_status: '1'}, {data1: 'GD00001', device_status: '2'}, {data1: 'GD00001', device_status: '3'}]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
defaultOption1 () {
|
||||
return {
|
||||
step: 0.4, // 数值越大速度滚动越快
|
||||
limitMoveNum: 7, // 开始无缝滚动的数据量 this.dataList.length
|
||||
limitMoveNum: 5, // 开始无缝滚动的数据量 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)
|
||||
}
|
||||
},
|
||||
defaultOption2 () {
|
||||
return {
|
||||
step: 0.4, // 数值越大速度滚动越快
|
||||
limitMoveNum: 6, // 开始无缝滚动的数据量 this.dataList.length
|
||||
hoverStop: true, // 是否开启鼠标悬停stop
|
||||
direction: 1, // 0向下 1向上 2向左 3向右
|
||||
openWatch: true, // 开启数据实时监控刷新dom
|
||||
@@ -301,15 +353,17 @@ export default {
|
||||
}
|
||||
},
|
||||
setEchart2 () {
|
||||
let date = []
|
||||
let data1 = []
|
||||
let data2 = []
|
||||
let data3 = []
|
||||
this.arrL2.map(e => {
|
||||
date.push(e.date)
|
||||
data1.push(e.elbow_qty)
|
||||
data2.push(e.comprehensive_qty)
|
||||
data3.push(e.comprehensive_qty)
|
||||
let data4 = []
|
||||
let device = []
|
||||
this.echartData1.map(e => {
|
||||
data1.push(e.data1)
|
||||
data2.push(e.data2)
|
||||
data3.push(e.data3)
|
||||
data4.push(e.data4)
|
||||
device.push(e.device)
|
||||
})
|
||||
let option = {
|
||||
grid: {
|
||||
@@ -329,7 +383,7 @@ export default {
|
||||
itemGap: 30.86,
|
||||
itemWidth: 14.16,
|
||||
itemHeight: 7.38,
|
||||
data: [{name: '弯头工段', itemStyle: {color: '#0E90FD'}}, {name: '综合工段', itemStyle: {color: '#33CCCC'}}, {name: '成品工段', itemStyle: {color: '#EAAD24'}}]
|
||||
data: [{name: '正常运行', itemStyle: {color: '#33CCCC'}}, {name: '故障', itemStyle: {color: '#EAAD24'}}, {name: '待机', itemStyle: {color: '#0E90FD'}}, {name: '关机', itemStyle: {color: '#c9c9c9'}}]
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
@@ -348,10 +402,9 @@ export default {
|
||||
textStyle: {
|
||||
color: '#8FABBF',
|
||||
fontSize: 16
|
||||
},
|
||||
rotate: 50
|
||||
}
|
||||
},
|
||||
data: date
|
||||
data: device
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
@@ -379,29 +432,7 @@ export default {
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '弯头工段',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(96,112,128,0.10)',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: '#0E90FD',
|
||||
opacity: 0.1
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data1
|
||||
},
|
||||
{
|
||||
name: '综合工段',
|
||||
name: '正常运行',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
@@ -420,10 +451,10 @@ export default {
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data2
|
||||
data: data1
|
||||
},
|
||||
{
|
||||
name: '成品工段',
|
||||
name: '故障',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
@@ -442,7 +473,51 @@ export default {
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data2
|
||||
},
|
||||
{
|
||||
name: '待机',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(96,112,128,0.10)',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: '#0E90FD',
|
||||
opacity: 0.1
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data3
|
||||
},
|
||||
{
|
||||
name: '关机',
|
||||
type: 'bar',
|
||||
barWidth: '8',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#c9c9c9',
|
||||
opacity: 1
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(148,145,145,0.25)',
|
||||
opacity: 0.25
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
data: data4
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -487,7 +562,8 @@ export default {
|
||||
_wh(100%, 60%)
|
||||
clear both
|
||||
.bottom_wrap
|
||||
_wh(100%, 40%)
|
||||
_wh(100%, calc(40% - .3rem))
|
||||
margin-top .3rem
|
||||
.left_wrap
|
||||
float left
|
||||
width 49%
|
||||
@@ -580,7 +656,6 @@ export default {
|
||||
margin-left 27%
|
||||
padding .17rem 10% .24rem 1rem
|
||||
background-color rgba(244,247,38,.34)
|
||||
overflow hidden
|
||||
&::after
|
||||
content ''
|
||||
_wh(3px, 100%)
|
||||
@@ -588,8 +663,12 @@ export default {
|
||||
z-index 102
|
||||
top 0
|
||||
left 0
|
||||
background rgba(244,247,38,.6)
|
||||
background rgba(244,247,38,.55)
|
||||
box-shadow 0px 0px 5px 3px rgba(244,247,38,.34)
|
||||
.scroll_wrap
|
||||
_wh(100%, 100%)
|
||||
background-image linear-gradient(180deg, rgba(55,141,186,0.00) 0%, rgba(40,183,235,0.10) 100%)
|
||||
overflow hidden
|
||||
.scroll-ul_1
|
||||
li
|
||||
_wh(100%, .44rem)
|
||||
@@ -604,4 +683,54 @@ export default {
|
||||
color #f1c76d
|
||||
margin-right .2rem
|
||||
font-size .16rem
|
||||
.item_content_3
|
||||
height: calc(100% - 0.38rem)
|
||||
padding 0
|
||||
margin-top .06rem
|
||||
border 0.01rem solid rgba(8,205,248,0.3)
|
||||
.scroll_tab
|
||||
_wh(100%, .4rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
li
|
||||
float left
|
||||
width 8%
|
||||
_font(.14rem,.4rem,#78B1DE,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
white-space nowrap
|
||||
padding 0 .02rem
|
||||
overflow hidden
|
||||
box-sizing border-box
|
||||
&:nth-child(1)
|
||||
width 4%
|
||||
.scroll_container
|
||||
width 100%
|
||||
height calc(100% - .4rem)
|
||||
overflow hidden
|
||||
.scroll-ul_2
|
||||
li
|
||||
_wh(100%, .44rem)
|
||||
border-bottom .01rem solid rgba(8,205,248,0.3)
|
||||
&:nth-child(even)
|
||||
background rgba(1,24,52,0.60)
|
||||
box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
|
||||
.scroll-ul_2_div
|
||||
float left
|
||||
_wh(8%, .44rem)
|
||||
_fj(center)
|
||||
_font(.14rem, .18rem, #fff,,center)
|
||||
word-wrap break-word
|
||||
word-break break-all
|
||||
white-space nowrap
|
||||
padding .04rem .02rem
|
||||
overflow hidden
|
||||
&:nth-child(1)
|
||||
width 4%
|
||||
.scroll_status_wrap
|
||||
position relative
|
||||
span
|
||||
position absolute
|
||||
left 25%
|
||||
_wh(7px, 7px)
|
||||
border-radius 50%
|
||||
</style>
|
||||
|
||||
@@ -10,6 +10,8 @@ const HomeScreen = r => require.ensure([], () => r(require('@page/HomeScreen')),
|
||||
const Chengpin = r => require.ensure([], () => r(require('@page/management/Chengpin')), 'Chengpin')
|
||||
const Clean = r => require.ensure([], () => r(require('@page/management/Clean')), 'Clean')
|
||||
const ZhiPanGuan = r => require.ensure([], () => r(require('@page/management/ZhiPanGuan')), 'ZhiPanGuan')
|
||||
const TuiWan = r => require.ensure([], () => r(require('@page/management/TuiWan')), 'TuiWan')
|
||||
const StorageData = r => require.ensure([], () => r(require('@page/management/StorageData')), 'StorageData')
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
@@ -36,6 +38,14 @@ export default new Router({
|
||||
path: '/ZhiPanGuan',
|
||||
component: ZhiPanGuan
|
||||
},
|
||||
{
|
||||
path: '/TuiWan',
|
||||
component: TuiWan
|
||||
},
|
||||
{
|
||||
path: '/StorageData',
|
||||
component: StorageData
|
||||
},
|
||||
{
|
||||
path: '/MonitoringScreen',
|
||||
component: MonitoringScreen
|
||||
|
||||
Reference in New Issue
Block a user