困料弹框
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="n_container">
|
||||
<div @click.stop="closeModal" class="n_container">
|
||||
<div class="n_header">
|
||||
<div class="n_header_h1">
|
||||
<h1>据控制中心</h1>
|
||||
@@ -23,47 +23,227 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_l1">
|
||||
<div v-for="(e,i) in TrappedShelf40List.slice(0, 20)" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
|
||||
<!-- <div v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}"> -->
|
||||
<!-- <img src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<!-- <img :class="e.point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<div v-for="(e,i) in TrappedShelf40List.slice(0, 20)" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}" @click.stop="getInfo1(e, i)">
|
||||
<img v-show="String(e.stand_status) === ''" src="../../../images/workshop/hj.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||||
<div v-if="pkId === e.point_code" class="popup_block_wraper" :class="youModel" :style="{'top': top, 'left': left}">
|
||||
<div class="foldline foldline_left" :class="foldlineStyle"></div>
|
||||
<div class="popup_bg">
|
||||
<div class="popup_block">
|
||||
<div class="pop_header">
|
||||
<div class="pop_name">{{pkObj.point_code}}</div>
|
||||
<div class="pop_status">
|
||||
<!-- <div class="pop_status_dot" :class="['green', 'yellow', 'red'][Number(pkObj.stand_status) - 2]"></div> -->
|
||||
<div class="pop_status_dot" :class="{green:pkObj.status ==='2',red:pkObj.status ==='5',yellow:(pkObj.status ==='3' || pkObj.status ==='4')}"></div>
|
||||
<div class="pop_status_text fgray">{{pkObj.stand_status_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop_content">
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">状态</div>
|
||||
<div class="pop_val">{{pkObj.point_status_name}}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">载具</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.vehicle_code }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">BOM号</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.bom }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">碾次</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.mix_num }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">重量(kg)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
|
||||
<div class="pop_unit">kg</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">入库时间</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.instorage_time }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">静置(h)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.standing_time }}</div>
|
||||
<div class="pop_unit">h</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_l2">
|
||||
<div v-for="(e,i) in TrappedShelf40List.slice(20, 40)" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}">
|
||||
<!-- <div v-for="(e,i) in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}"> -->
|
||||
<!-- <img src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<!-- <img :class="e.point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<div v-for="(e,i) in TrappedShelf40List.slice(20, 40)" :key="i" class="picbox" :class="{'mgt5': i === 2 || i === 6 || i === 10 || i === 14 || i === 18}" @click.stop="getInfo1(e, i)">
|
||||
<img v-show="String(e.stand_status) === ''" src="../../../images/workshop/hj.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||||
<div v-if="pkId === e.point_code" class="popup_block_wraper" :class="youModel" :style="{'top': top, 'left': left}">
|
||||
<div class="foldline foldline_left" :class="foldlineStyle"></div>
|
||||
<div class="popup_bg">
|
||||
<div class="popup_block">
|
||||
<div class="pop_header">
|
||||
<div class="pop_name">{{pkObj.point_code}}</div>
|
||||
<div class="pop_status">
|
||||
<!-- <div class="pop_status_dot" :class="['green', 'yellow', 'red'][Number(pkObj.stand_status) - 2]"></div> -->
|
||||
<div class="pop_status_dot" :class="{green:pkObj.status ==='2',red:pkObj.status ==='5',yellow:(pkObj.status ==='3' || pkObj.status ==='4')}"></div>
|
||||
<div class="pop_status_text fgray">{{pkObj.stand_status_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop_content">
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">状态</div>
|
||||
<div class="pop_val">{{pkObj.point_status_name}}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">载具</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.vehicle_code }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">BOM号</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.bom }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">碾次</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.mix_num }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">重量(kg)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
|
||||
<div class="pop_unit">kg</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">入库时间</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.instorage_time }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">静置(h)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.standing_time }}</div>
|
||||
<div class="pop_unit">h</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_r1">
|
||||
<div v-for="(e,i) in TrappedShelf6List.slice(0, 3)" :key="i" class="picbox">
|
||||
<!-- <div v-for="(e,i) in [1,2,3]" :key="i" class="picbox"> -->
|
||||
<!-- <img src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<!-- <img :class="e.point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<div v-for="(e,i) in TrappedShelf6List.slice(0, 3)" :key="i" class="picbox" @click.stop="getInfo2(e, i)">
|
||||
<img v-show="String(e.stand_status) === ''" src="../../../images/workshop/hj.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||||
<div v-if="pkId === e.point_code" class="popup_block_wraper popup_block_wraper2" :style="{'top': top, 'left': left}">
|
||||
<div class="foldline foldline_left2"></div>
|
||||
<div class="popup_bg">
|
||||
<div class="popup_block">
|
||||
<div class="pop_header">
|
||||
<div class="pop_name">{{pkObj.point_code}}</div>
|
||||
<div class="pop_status">
|
||||
<!-- <div class="pop_status_dot" :class="['green', 'yellow', 'red'][Number(pkObj.stand_status) - 2]"></div> -->
|
||||
<div class="pop_status_dot" :class="{green:pkObj.status ==='2',red:pkObj.status ==='5',yellow:(pkObj.status ==='3' || pkObj.status ==='4')}"></div>
|
||||
<div class="pop_status_text fgray">{{pkObj.stand_status_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop_content">
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">状态</div>
|
||||
<div class="pop_val">{{pkObj.point_status_name}}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">载具</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.vehicle_code }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">BOM号</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.bom }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">碾次</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.mix_num }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">重量(kg)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
|
||||
<div class="pop_unit">kg</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">入库时间</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.instorage_time }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">静置(h)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.standing_time }}</div>
|
||||
<div class="pop_unit">h</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_r2">
|
||||
<div v-for="(e,i) in TrappedShelf6List.slice(3, 6)" :key="i" class="picbox">
|
||||
<!-- <div v-for="(e,i) in [1,2,3]" :key="i" class="picbox"> -->
|
||||
<!-- <img src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<!-- <img :class="e.point_status === '0' ? 'hidden': ''" src="../../../images/workshop/lz.png" alt=""> -->
|
||||
<div v-for="(e,i) in TrappedShelf6List.slice(3, 6)" :key="i" class="picbox" @click.stop="getInfo2(e, i)">
|
||||
<img v-show="String(e.stand_status) === ''" src="../../../images/workshop/hj.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '2'" src="../../../images/workshop/lz_hj_green.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
|
||||
<img v-show="String(e.stand_status) === '3' || String(e.stand_status) === '4'" src="../../../images/workshop/lz_hj_yellow.png" alt="">
|
||||
<div v-if="pkId === e.point_code" class="popup_block_wraper popup_block_wraper2" :style="{'top': top, 'left': left}">
|
||||
<div class="foldline foldline_left2"></div>
|
||||
<div class="popup_bg">
|
||||
<div class="popup_block">
|
||||
<div class="pop_header">
|
||||
<div class="pop_name">{{pkObj.point_code}}</div>
|
||||
<div class="pop_status">
|
||||
<!-- <div class="pop_status_dot" :class="['green', 'yellow', 'red'][Number(pkObj.stand_status) - 2]"></div> -->
|
||||
<div class="pop_status_dot" :class="{green:pkObj.status ==='2',red:pkObj.status ==='5',yellow:(pkObj.status ==='3' || pkObj.status ==='4')}"></div>
|
||||
<div class="pop_status_text fgray">{{pkObj.stand_status_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop_content">
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">状态</div>
|
||||
<div class="pop_val">{{pkObj.point_status_name}}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">载具</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.vehicle_code }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">BOM号</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.bom }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">碾次</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.mix_num }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">重量(kg)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.weight }}</div>
|
||||
<div class="pop_unit">kg</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">入库时间</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.instorage_time }}</div>
|
||||
</div>
|
||||
<div class="pop_item">
|
||||
<div class="pop_label">静置(h)</div>
|
||||
<div class="pop_val pop_val_s">{{ pkObj.standing_time }}</div>
|
||||
<div class="pop_unit">h</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="iconfont icon-guanbi close_btn" @click.stop="closeModal"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -150,6 +330,15 @@ export default {
|
||||
name: 'one',
|
||||
data () {
|
||||
return {
|
||||
top: '',
|
||||
left: '',
|
||||
youModel: '',
|
||||
foldlineStyle: '',
|
||||
pkId: '',
|
||||
pkObj: {
|
||||
aaa: 'aaa',
|
||||
num: '3'
|
||||
},
|
||||
resData: {},
|
||||
TrappedShelf40List: [],
|
||||
TrappedShelf6List: [],
|
||||
@@ -189,6 +378,25 @@ export default {
|
||||
this.initData()
|
||||
},
|
||||
methods: {
|
||||
getInfo1 (e, i) {
|
||||
this.pkId = e.point_code
|
||||
this.pkObj = e
|
||||
if (i === 0 || i === 1 || i === 2 || i === 3 || i === 4 || i === 5 || i === 6 || i === 20 || i === 21 || i === 22 || i === 23 || i === 24 || i === 25 || i === 26) {
|
||||
this.youModel = 'popup_block_wraper2'
|
||||
this.foldlineStyle = 'foldline_left2'
|
||||
} else {
|
||||
this.youModel = ''
|
||||
this.foldlineStyle = ''
|
||||
}
|
||||
},
|
||||
getInfo2 (e, i) {
|
||||
this.pkId = e.point_code
|
||||
this.pkObj = e
|
||||
},
|
||||
closeModal () {
|
||||
this.pkId = ''
|
||||
this.pkObj = {}
|
||||
},
|
||||
async initData () {
|
||||
let res = await trappedMaterialCondition()
|
||||
this.resData = res.result
|
||||
@@ -269,6 +477,7 @@ export default {
|
||||
z-index 2
|
||||
transform rotate(90deg)
|
||||
.picbox
|
||||
position relative
|
||||
width 100%
|
||||
margin-bottom 1%
|
||||
img
|
||||
@@ -281,6 +490,7 @@ export default {
|
||||
z-index 2
|
||||
transform rotate(90deg)
|
||||
.picbox
|
||||
position relative
|
||||
width 100%
|
||||
margin-bottom 1%
|
||||
img
|
||||
@@ -293,6 +503,7 @@ export default {
|
||||
z-index 2
|
||||
transform rotate(90deg)
|
||||
.picbox
|
||||
position relative
|
||||
width 100%
|
||||
margin-bottom 20%
|
||||
img
|
||||
@@ -305,6 +516,7 @@ export default {
|
||||
z-index 2
|
||||
transform rotate(90deg)
|
||||
.picbox
|
||||
position relative
|
||||
width 100%
|
||||
margin-bottom 20%
|
||||
img
|
||||
@@ -373,4 +585,21 @@ export default {
|
||||
// white-space nowrap
|
||||
padding 0 5px
|
||||
overflow hidden
|
||||
.popup_block_wraper
|
||||
position absolute
|
||||
top: -706%;
|
||||
left: -287%;
|
||||
z-index 10
|
||||
transform rotate(-90deg)
|
||||
.popup_block_wraper2
|
||||
position absolute
|
||||
top: 506%;
|
||||
left: -287%;
|
||||
z-index 10
|
||||
transform rotate(-90deg)
|
||||
.foldline_left2
|
||||
left 530px
|
||||
transform rotateY(0)
|
||||
.top1
|
||||
top 100%
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user