root/screen-shunhe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change

Browse Source
This commit is contained in:
xiangxy
2023-08-24 16:23:17 +08:00
parent fd928c97ff
commit cb796174d4
4 changed files with 1065 additions and 691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
src/pages/shunhe/StorageMonitor.vue
View File

@@ -1,13 +1,33 @@
<template>
<section class="bg">
<t-header title="顺和大屏监控">
<t-header title="顺和大屏监控——仓储监控">
<!-- <p class="p1">1</p> -->
</t-header>
<div class="container">
<div class="top_wrapper">
<div class="yard-wrap">
<div class="corridor_2" style="display: none;">困料监控</div>
<div class="yard_group clearfix" style="display: none;">
<div class="cont-1">
<div class="corridor_2">困料监控</div>
<div class="tags">
<div class="tag_type">
<div class="type_color green"></div>
<div class="tag_text">静置中</div>
</div>
<div class="tag_type">
<div class="type_color blue"></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 red"></div>
<div class="tag_text">强制完成</div>
</div>
</div>
</div>
<div class="yard_group clearfix">
<div class="yard_group_ul yard_group_ul_1 fl">
<div class="yard_group_cell" v-for="(e, i) in group01" :key="i" :class="{lock:e.lock_type ==='01'}">
<div class="yard_group_p" @click="getInfo1(e)">
@@ -44,7 +64,6 @@
<div class="yard_group_p" @click="getInfo1(e)">
<p class="fontselect">{{e.point_name}}</p>
<div v-if="e.struct_url == '1'" class="machine_1"></div>
<!-- <div class="ingbox" :style="{height:(Number(e.show_struct_qty)/1000*60+'px')}" :class="{green:e.stand_status ==='2',yellow:e.stand_status ==='3',red:e.stand_status ==='4',blue:e.stand_status ==='5'}"></div> -->
<div class="ingbox" style="height:78px;" :class="{green:e.stand_status ==='2',yellow:e.stand_status ==='3',red:e.stand_status ==='4',blue:e.stand_status ==='5'}"></div>
</div>
<div v-show="code1 === e.point_code" class="locate-wrap clearfix" :class="e.mgl">
@@ -71,8 +90,8 @@
</div>
</div>
</div>
<div class="corridor_2" style="display: none;">成型暂存监控</div>
<div class="yard_group clearfix" style="display: none;">
<div class="corridor_2">成型暂存监控</div>
<div class="yard_group clearfix">
<div class="yard_group_ul yard_group_ul_2">
<div class="yard_group_cell" v-for="(e, i) in group02" :key="i" :class="{lock:e.lock_type ==='01'}">
<div class="yard_group_p" @click="getInfo1(e)">
@@ -104,22 +123,38 @@
</div>
</div>
</div>
<div class="tag_block">
<div class="tag_type">
<div class="type_color green"></div>
<div class="tag_text">静置中</div>
</div>
<div class="tag_type">
<div class="type_color blue"></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 red"></div>
<div class="tag_text">强制完成</div>
<div class="yard-right">
<div class="corridor_2">出窑暂存监控</div>
<div class="yard_group clearfix">
<div class="yard_group_ul yard_group_ul_4">
<div class="yard_group_cell" v-for="(e, i) in group02" :key="i" :class="{lock:e.lock_type ==='01'}">
<div class="yard_group_p" @click="getInfo1(e)">
<p class="fontselect">{{e.point_name}}</p>
<div v-if="e.struct_url == '2'" class="machine_2" style="height: 55px;"></div>
<div class="ingbox" :style="{height:(Number(e.show_struct_qty)/1000*60+'px')}"></div>
</div>
<div v-show="code1 === e.point_code" class="locate-wrap clearfix" :class="e.mgl">
<div :class="e.aline">
<div class="foldcricle0 foldcricle1"></div>
<div class="foldline0 foldline1"></div>
</div>
<div :class="e.bline">
<div class="foldline0 foldline2"></div>
<div class="foldcricle0 foldcricle2"></div>
</div>
<div class="clearfix locate-content" :class="e.coordinate">
<div class="tan_pline">
<p class="tan_p">货位：{{e.point_name}}</p>
<p class="tan_p">载具：{{e.vehicle_code}}</p>
<p class="tan_p">物料：{{e.material_code}}</p>
<p class="tan_p">库存(块)：{{e.ivt_qty}}</p>
<p class="tan_p">入库时间：{{e.instorage_time}}</p>
</div>
<div class="iconfont icon-guanbi close_btn" @click="closebtn"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -134,7 +169,7 @@
<vue-seamless-scroll :data="array1" :class-option="classOption" class="content-block-scroll">
<ul class="content-block-scroll-ul">
<li v-for="(e, i) in array1" :key="i">
<span>{{e.point_name}}</span><span>{{e.material_code}}</span><span>{{e.ivt_weight}}</span><span>{{e.standing_time}}</span><span>{{e.standing_time}}</span><span>{{e.stand_status_name}}</span>
<span>{{e.storageLocation}}</span><span>{{e.materialCode}}</span><span>{{e.materialName}}</span><span>{{e.weight}}</span><span>{{e.standTime}}</span><span>{{e.standStatus}}</span>
</li>
</ul>
</vue-seamless-scroll>
@@ -149,7 +184,7 @@
<vue-seamless-scroll :data="array2" :class-option="classOption" class="content-block-scroll">
<ul class="content-block-scroll-ul">
<li v-for="(e, i) in array2" :key="i">
<span>{{e.point_name}}</span><span>{{e.point_name}}</span><span>{{e.ivt_qty}}</span><span>{{e.is_full}}</span><span>{{e.vehicle_code}}</span><span>{{e.vehicle_code}}</span>
<span>{{e.storageLocation}}</span><span>{{e.materialCode}}</span><span>{{e.materialName}}</span><span>{{e.qty}}</span><span>{{e.vehicleCode}}</span><span>{{e.warehousingTime}}</span>
</li>
</ul>
</vue-seamless-scroll>
@@ -161,10 +196,10 @@
<div class="list_scroll_title">
<span>货位</span><span>物料编码</span><span>物料名称</span><span>库存数(块)</span><span>托盘号</span><span>入库时间</span>
</div>
<vue-seamless-scroll :data="array2" :class-option="classOption" class="content-block-scroll">
<vue-seamless-scroll :data="array3" :class-option="classOption" class="content-block-scroll">
<ul class="content-block-scroll-ul">
<li v-for="(e, i) in array2" :key="i">
<span>{{e.point_name}}</span><span>{{e.point_name}}</span><span>{{e.ivt_qty}}</span><span>{{e.is_full}}</span><span>{{e.vehicle_code}}</span><span>{{e.vehicle_code}}</span>
<li v-for="(e, i) in array3" :key="i">
<span>{{e.storageLocation}}</span><span>{{e.materialCode}}</span><span>{{e.materialName}}</span><span>{{e.qty}}</span><span>{{e.vehicleCode}}</span><span>{{e.warehousingTime}}</span>
</li>
</ul>
</vue-seamless-scroll>
@@ -192,6 +227,7 @@ export default {
structArr: [],
array1: [],
array2: [],
array3: [],
group01: [],
group02: [],
group03: [],
@@ -283,8 +319,9 @@ export default {
},
async initData () {
let res = await storageMonitor()
this.array1 = res.result.materialList
this.array2 = res.result.productionList
this.array1 = res.standStock
this.array2 = res.frontWarehouseStock
this.array3 = res.backWarehouseStock
this.group01 = [...res.result.materialTask]
this.group02 = [...res.result.productionTask]
this.group03 = [...res.result.materialYJTask]
@@ -381,7 +418,8 @@ export default {
bottom 0
.top_wrapper
position relative
height 60%
height 66%
display flex
.tag_block
position absolute
// bottom .1rem
@@ -390,7 +428,6 @@ export default {
_fj(row)
.tag_type
_fj(row)
padding-left .3rem
.type_color
width .1rem
height .1rem
@@ -428,11 +465,11 @@ export default {
.yard-wrap
// height 6.95rem
height 100%
width 100%
width 80%
// padding .1rem 0
.yard_group
width 100%
height calc(50% - 46px)
// height calc(50% - 46px)
clear both
&:nth-child(1)
margin-bottom 20px
@@ -444,22 +481,28 @@ export default {
align-items center
margin-top -.01rem
.yard_group_ul_1
width 100%
width 80%
position absolute
grid-template-columns repeat(20, 83.4% / 20)
grid-template-columns repeat(18, 80% / 18)
// grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(2, 110px)
.yard_group_ul_2
width 100%
position absolute
grid-template-columns repeat(26, 100% / 26)
grid-template-columns repeat(14, 80% / 14)
// grid-template-columns repeat(26, 100% / 26)
// grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(2, 110px)
.yard_group_ul_3
width 12.5%
grid-template-columns repeat(3, 100% / 3)
width 20%
grid-template-columns repeat(5, 100% / 5)
// grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(2, 110px)
.yard_group_ul_4
width 100%
grid-template-columns repeat(5, 100% / 5)
// grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(6, 85px)
.yard_group_cell
position relative
display inline-block
@@ -521,7 +564,7 @@ height 90px
width 100%
z-index 97 //
.corridor_2
_wh(100%,22px)
_wh(80%,22px)
_font(16px, 22px, #fff,,left)
margin 22px 12px 30px 0
.locate-wrap
@@ -786,4 +829,17 @@ height 90px
margin-left -22px
.mgl2
margin-left 0px
.yard-right
width 18%
height 100%
margin-left 2%
box-sizing border-box
border 1px solid #32c5ff
.cont-1
display flex
.tags
display flex
width 20%
align-items center
justify-content space-around
</style>