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

cangchu

Browse Source
This commit is contained in:
xiangxy
2023-05-11 13:56:23 +08:00
parent 81c40e3042
commit 0d2efae3f1
1 changed files with 57 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/pages/StorageMonitor2.vue
View File

@@ -11,9 +11,10 @@
<div class="yard_group_p" @click="getInfo1(e)"> <div class="yard_group_p" @click="getInfo1(e)">
<p class="fontselect">{{e.point_name}}</p> <p class="fontselect">{{e.point_name}}</p>
<div v-if="e.struct_url == '1'" class="machine_1"></div> <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:(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>
<div v-show="code1 === e.point_code" class="locate-wrap clearfix"> <div v-show="code1 === e.point_code" class="locate-wrap clearfix" :class="e.mgl">
<div :class="e.aline"> <div :class="e.aline">
<div class="foldcricle0 foldcricle1"></div> <div class="foldcricle0 foldcricle1"></div>
<div class="foldline0 foldline1"></div> <div class="foldline0 foldline1"></div>
@@ -24,12 +25,12 @@
</div> </div>
<div class="clearfix locate-content" :class="e.coordinate"> <div class="clearfix locate-content" :class="e.coordinate">
<div class="tan_pline"> <div class="tan_pline">
<p class="tan_p">货位：{{e.point_name}}</p> <p class="tan_p">货位：{{e.point_name}}<span :class="{cgreen:e.stand_status ==='2',cyellow:e.stand_status ==='3',cred:e.stand_status ==='4',cblue:e.stand_status ==='5'}">{{e.stand_status_name}}</span></p>
<p class="tan_p">载具：{{e.vehicle_code}}</p> <p class="tan_p">载具：{{e.vehicle_code}}</p>
<p class="tan_p">物料：{{e.material_code}}</p> <p class="tan_p">BOM：{{e.material_code}}</p>
<p class="tan_p">重量(kg)：{{e.ivt_qty}}</p> <p class="tan_p">重量(千克)：{{e.ivt_qty}}</p>
<p class="tan_p">入库时间：{{e.instorage_time}}</p> <p class="tan_p">入库时间：{{e.instorage_time}}</p>
<p class="tan_p">静置(h)：{{e.finish_times}}</p> <p class="tan_p">静置(小时)：{{e.standing_time}}</p>
</div> </div>
<div class="iconfont icon-guanbi close_btn" @click="closebtn"></div> <div class="iconfont icon-guanbi close_btn" @click="closebtn"></div>
</div> </div>
@@ -41,9 +42,10 @@
<div class="yard_group_p" @click="getInfo1(e)"> <div class="yard_group_p" @click="getInfo1(e)">
<p class="fontselect">{{e.point_name}}</p> <p class="fontselect">{{e.point_name}}</p>
<div v-if="e.struct_url == '1'" class="machine_1"></div> <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:(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>
<div v-show="code1 === e.point_code" class="locate-wrap clearfix"> <div v-show="code1 === e.point_code" class="locate-wrap clearfix" :class="e.mgl">
<div :class="e.aline"> <div :class="e.aline">
<div class="foldcricle0 foldcricle1"></div> <div class="foldcricle0 foldcricle1"></div>
<div class="foldline0 foldline1"></div> <div class="foldline0 foldline1"></div>
@@ -54,12 +56,12 @@
</div> </div>
<div class="clearfix locate-content" :class="e.coordinate"> <div class="clearfix locate-content" :class="e.coordinate">
<div class="tan_pline"> <div class="tan_pline">
<p class="tan_p">货位：{{e.point_name}}</p> <p class="tan_p">货位：{{e.point_name}}<span :class="{cgreen:e.stand_status ==='2',cyellow:e.stand_status ==='3',cred:e.stand_status ==='4',cblue:e.stand_status ==='5'}">{{e.stand_status_name}}</span></p>
<p class="tan_p">载具：{{e.vehicle_code}}</p> <p class="tan_p">载具：{{e.vehicle_code}}</p>
<p class="tan_p">物料：{{e.material_code}}</p> <p class="tan_p">BOM：{{e.material_code}}</p>
<p class="tan_p">重量(kg)：{{e.ivt_qty}}</p> <p class="tan_p">重量(千克)：{{e.ivt_qty}}</p>
<p class="tan_p">入库时间：{{e.instorage_time}}</p> <p class="tan_p">入库时间：{{e.instorage_time}}</p>
<p class="tan_p">静置(h)：{{e.finish_times}}</p> <p class="tan_p">静置(小时)：{{e.standing_time}}</p>
</div> </div>
<div class="iconfont icon-guanbi close_btn" @click="closebtn"></div> <div class="iconfont icon-guanbi close_btn" @click="closebtn"></div>
</div> </div>
@@ -76,7 +78,7 @@
<div v-if="e.struct_url == '2'" class="machine_2"></div> <div v-if="e.struct_url == '2'" class="machine_2"></div>
<div class="ingbox" :style="{height:(Number(e.show_struct_qty)/1000*60+'px')}"></div> <div class="ingbox" :style="{height:(Number(e.show_struct_qty)/1000*60+'px')}"></div>
</div> </div>
<div v-show="code1 === e.point_code" class="locate-wrap clearfix"> <div v-show="code1 === e.point_code" class="locate-wrap clearfix" :class="e.mgl">
<div :class="e.aline"> <div :class="e.aline">
<div class="foldcricle0 foldcricle1"></div> <div class="foldcricle0 foldcricle1"></div>
<div class="foldline0 foldline1"></div> <div class="foldline0 foldline1"></div>
@@ -89,7 +91,7 @@
<div class="tan_pline"> <div class="tan_pline">
<p class="tan_p">货位：{{e.point_name}}</p> <p class="tan_p">货位：{{e.point_name}}</p>
<p class="tan_p">载具：{{e.vehicle_code}}</p> <p class="tan_p">载具：{{e.vehicle_code}}</p>
<p class="tan_p">物料：{{e.material_code}}</p> <p class="tan_p">BOM：{{e.material_code}}</p>
<p class="tan_p">库存(块)：{{e.ivt_qty}}</p> <p class="tan_p">库存(块)：{{e.ivt_qty}}</p>
<p class="tan_p">入库时间：{{e.instorage_time}}</p> <p class="tan_p">入库时间：{{e.instorage_time}}</p>
</div> </div>
@@ -261,7 +263,7 @@ export default {
methods: { methods: {
refresh () { refresh () {
this.timer = setInterval(() => { this.timer = setInterval(() => {
this.code1 = '' // this.code1 = ''
this.initData() this.initData()
}, this.interTime) }, this.interTime)
}, },
@@ -273,16 +275,16 @@ export default {
this.group02 = [...res.result.productionTask] this.group02 = [...res.result.productionTask]
this.group03 = [...res.result.materialYJTask] this.group03 = [...res.result.materialYJTask]
for (let i = 0; i < this.group01.length; i++) { for (let i = 0; i < this.group01.length; i++) {
this.group01[i] = Object.assign(this.group01[i], {coordinate: 'coordinate1', aline: 'aline1', bline: 'bline1', show: 0}) this.group01[i] = Object.assign(this.group01[i], {mgl: 'mgl1', coordinate: 'coordinate1', aline: 'aline1', bline: 'bline1', show: 0})
} }
for (let i = 0; i < this.group03.length; i++) { for (let i = 0; i < this.group03.length; i++) {
this.group03[i] = Object.assign(this.group03[i], {coordinate: 'coordinate2', aline: 'aline2', bline: 'bline2', show: 0}) this.group03[i] = Object.assign(this.group03[i], {mgl: 'mgl2', coordinate: 'coordinate2', aline: 'aline2', bline: 'bline2', show: 0})
} }
for (let i = 0; i < this.group02.length; i++) { for (let i = 0; i < this.group02.length; i++) {
if (i === 16 || i === 17 || i === 18 || i === 19 || i === 36 || i === 37 || i === 38 || i === 39) { if (i === 21 || i === 22 || i === 23 || i === 24 || i === 25 || i === 47 || i === 48 || i === 49 || i === 50 || i === 51 ) {
this.group02[i] = Object.assign(this.group02[i], {coordinate: 'coordinate2', aline: 'aline2', bline: 'bline2', show: 0}) this.group02[i] = Object.assign(this.group02[i], {mgl: 'mgl2', coordinate: 'coordinate2', aline: 'aline2', bline: 'bline2', show: 0})
} else { } else {
this.group02[i] = Object.assign(this.group02[i], {coordinate: 'coordinate1', aline: 'aline1', bline: 'bline1', show: 0}) this.group02[i] = Object.assign(this.group02[i], {mgl: 'mgl1', coordinate: 'coordinate1', aline: 'aline1', bline: 'bline1', show: 0})
} }
} }
// for (let i = 1; i <= 20; i++) { // for (let i = 1; i <= 20; i++) {
@@ -356,7 +358,7 @@ export default {
margin 12px auto margin 12px auto
.top_wrapper .top_wrapper
position relative position relative
height 60% height 45%
.tag_block .tag_block
position absolute position absolute
// bottom .1rem // bottom .1rem
@@ -386,6 +388,18 @@ export default {
background #F96700 !important background #F96700 !important
.red .red
background #FF0000 !important background #FF0000 !important
.cblue
color #32C5FF !important
.cgreen
color #30EBC9 !important
.cgray
color #516282 !important
.cyellow
color #E2BB0E !important
.corange
color #F96700 !important
.cred
color #FF0000 !important
.lock .lock
border .02rem solid #f00 !important border .02rem solid #f00 !important
.yard-wrap .yard-wrap
@@ -409,17 +423,17 @@ export default {
.yard_group_ul_1 .yard_group_ul_1
width 100% width 100%
position absolute position absolute
grid-template-columns repeat(16, 80% / 16) grid-template-columns repeat(20, 83.4% / 20)
// grid-template-rows repeat(2, 1.8rem / 2) // grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(3, 110px) grid-template-rows repeat(2, 110px)
.yard_group_ul_2 .yard_group_ul_2
width 100% width 100%
position absolute position absolute
grid-template-columns repeat(20, 100% / 20) grid-template-columns repeat(26, 100% / 26)
// grid-template-rows repeat(2, 1.8rem / 2) // grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(3, 110px) grid-template-rows repeat(2, 110px)
.yard_group_ul_3 .yard_group_ul_3
width 15% width 12.5%
grid-template-columns repeat(3, 100% / 3) grid-template-columns repeat(3, 100% / 3)
// grid-template-rows repeat(2, 1.8rem / 2) // grid-template-rows repeat(2, 1.8rem / 2)
grid-template-rows repeat(2, 110px) grid-template-rows repeat(2, 110px)
@@ -486,7 +500,7 @@ height 90px
.corridor_2 .corridor_2
_wh(100%,22px) _wh(100%,22px)
_font(16px, 22px, #fff,,left) _font(16px, 22px, #fff,,left)
margin 12px 12px 12px 0 margin 22px 12px 30px 0
.locate-wrap .locate-wrap
position absolute position absolute
width 100% width 100%
@@ -507,6 +521,9 @@ height 90px
height .36rem height .36rem
overflow hidden overflow hidden
color #fff color #fff
span
padding-right .4rem
float right
.close_btn .close_btn
position absolute position absolute
top 3% top 3%
@@ -519,8 +536,9 @@ height 90px
cursor pointer cursor pointer
.bottom_wrapper .bottom_wrapper
width 100% width 100%
height 40% height 55%
padding-top 20px padding-top 60px
padding-bottom 40px
_fj(row) _fj(row)
.bottom_wrapper_l .bottom_wrapper_l
_wh(calc(50% - 10px), 100%) _wh(calc(50% - 10px), 100%)
@@ -595,7 +613,7 @@ height 90px
background center center / 100% 100% url(../assets/images/dot.png) no-repeat background center center / 100% 100% url(../assets/images/dot.png) no-repeat
.foldcricle2 .foldcricle2
top .50rem top .50rem
left .55rem left .6rem
.foldcricle1 .foldcricle1
top 0 top 0
left -0.1rem left -0.1rem
@@ -605,13 +623,13 @@ height 90px
border 1px dashed #32C5FF border 1px dashed #32C5FF
height 1px height 1px
.foldline1 .foldline1
width .30rem width .33rem
top .12rem top .12rem
left .09rem left .09rem
.foldline2 .foldline2
width .60rem width .60rem
top .38rem top .39rem
left .24rem left .27rem
transform rotate(60deg) transform rotate(60deg)
.coordinate1 .coordinate1
left .9rem left .9rem
@@ -641,8 +659,8 @@ height 90px
position absolute position absolute
z-index 102 z-index 102
transform rotate(60deg) transform rotate(60deg)
top -1.01rem top -1.05rem
right 1.38rem right 1.28rem
.aline3 .aline3
position absolute position absolute
z-index 102 z-index 102
@@ -729,4 +747,8 @@ height 90px
_font(12px, 30px, #fff,,) _font(12px, 30px, #fff,,)
// transform scale(0.8) // transform scale(0.8)
white-space:nowrap white-space:nowrap
.mgl1
margin-left -22px
.mgl2
margin-left 0px
</style> </style>