布局调

This commit is contained in:
2023-06-21 16:34:28 +08:00
parent 71d05e74ae
commit 15befd694f
6 changed files with 74 additions and 29 deletions

View File

@@ -180,6 +180,12 @@
<router-link to="/pdone" class="tooltip_page">6</router-link> <router-link to="/pdone" class="tooltip_page">6</router-link>
</div> </div>
</div> </div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
</div> </div>
</template> </template>
@@ -253,6 +259,7 @@ export default {
@import '~@css/mixin' @import '~@css/mixin'
.n_container .n_container
_wh(100%, 100%) _wh(100%, 100%)
position relative
.n_header .n_header
_wh(100%, 8%) _wh(100%, 8%)
_bis('../../../images/bg_header.jpg') _bis('../../../images/bg_header.jpg')
@@ -399,12 +406,12 @@ export default {
img img
_wh(100%, auto) _wh(100%, auto)
.mtp_wrap_4 .mtp_wrap_4
left 18.3% left 14%
// top: 87% // top: 87%
top: 127% top: 133%
.mtp_wrap_5 .mtp_wrap_5
// top 105% // top 105%
top 145% top 151%
z-index 0 z-index 0
.popup_block_wraper .popup_block_wraper
position absolute position absolute

View File

@@ -35,9 +35,9 @@
<ul class="scroll_tab_1"> <ul class="scroll_tab_1">
<li>货位</li> <li>货位</li>
<li style="width: 20%;">物料编码</li> <li style="width: 20%;">物料编码</li>
<li>数量</li>
<li>载具号</li>
<li style="width: 15%;">碾次</li> <li style="width: 15%;">碾次</li>
<li>载具号</li>
<li style="width: 9%;">数量</li>
<li style="width: 25%;">入库时间</li> <li style="width: 25%;">入库时间</li>
</ul> </ul>
<div class="scroll_container_1"> <div class="scroll_container_1">
@@ -46,9 +46,9 @@
<li v-for="(e, i) in array1" :key="i"> <li v-for="(e, i) in array1" :key="i">
<div class="scroll-ul_1_div">{{e.point_code}}</div> <div class="scroll-ul_1_div">{{e.point_code}}</div>
<div class="scroll-ul_1_div" style="width: 20%;">{{e.material_code}}</div> <div class="scroll-ul_1_div" style="width: 20%;">{{e.material_code}}</div>
<div class="scroll-ul_1_div">{{e.qty}}</div>
<div class="scroll-ul_1_div">{{e.vehicle_code}}</div>
<div class="scroll-ul_1_div" style="width: 15%;">{{e.mix_num}}</div> <div class="scroll-ul_1_div" style="width: 15%;">{{e.mix_num}}</div>
<div class="scroll-ul_1_div">{{e.vehicle_code}}</div>
<div class="scroll-ul_1_div" style="width: 9%;">{{e.qty}}</div>
<div class="scroll-ul_1_div" style="width: 25%;">{{e.create_time}}</div> <div class="scroll-ul_1_div" style="width: 25%;">{{e.create_time}}</div>
</li> </li>
</ul> </ul>
@@ -66,7 +66,7 @@
<ul class="scroll_tab_1"> <ul class="scroll_tab_1">
<li>类别</li> <li>类别</li>
<li style="width: 15%;">物料编码</li> <li style="width: 15%;">物料编码</li>
<li>数量</li> <li style="width: 7%;">数量</li>
<li>载具号</li> <li>载具号</li>
<li>碾次</li> <li>碾次</li>
<li>货位</li> <li>货位</li>
@@ -78,7 +78,7 @@
<li v-for="(e, i) in array2" :key="i"> <li v-for="(e, i) in array2" :key="i">
<div class="scroll-ul_1_div">{{e.io_type}}</div> <div class="scroll-ul_1_div">{{e.io_type}}</div>
<div class="scroll-ul_1_div" style="width: 15%;">{{e.material_code}}</div> <div class="scroll-ul_1_div" style="width: 15%;">{{e.material_code}}</div>
<div class="scroll-ul_1_div">{{e.qty}}</div> <div class="scroll-ul_1_div" style="width: 7%;">{{e.qty}}</div>
<div class="scroll-ul_1_div">{{e.vehicle_code}}</div> <div class="scroll-ul_1_div">{{e.vehicle_code}}</div>
<div class="scroll-ul_1_div">{{e.mix_num}}</div> <div class="scroll-ul_1_div">{{e.mix_num}}</div>
<div class="scroll-ul_1_div">{{e.point_code}}</div> <div class="scroll-ul_1_div">{{e.point_code}}</div>
@@ -105,6 +105,12 @@
</div> </div>
<div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div> <div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div>
</div> </div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
</div> </div>
</template> </template>
@@ -416,6 +422,7 @@ export default {
@import '~@css/mixin' @import '~@css/mixin'
.n_container .n_container
_wh(100%, 100%) _wh(100%, 100%)
position relative
.n_header .n_header
_wh(100%, 8%) _wh(100%, 8%)
_bis('../../../images/bg_header.jpg') _bis('../../../images/bg_header.jpg')
@@ -463,9 +470,11 @@ export default {
_wh(100%, 58%) _wh(100%, 58%)
_fj(row) _fj(row)
.box2 .box2
_wh(100%, 40%) _wh(100%, 37.5%)
_fj(row) _fj(row)
.item_wrap .item_wrap
position relative
z-index 10
_wh(calc(50% - 8px), 100%) _wh(calc(50% - 8px), 100%)
+.item_wrap +.item_wrap
margin 0 .3% margin 0 .3%

View File

@@ -357,8 +357,8 @@ export default {
.box_l1 .box_l1
_wh(6%, 18%) _wh(6%, 18%)
position absolute position absolute
top 25% top 20%
right 30% right 35%
z-index 2 z-index 2
transform rotate(90deg) transform rotate(90deg)
.picbox .picbox
@@ -371,7 +371,7 @@ export default {
_wh(3%, 10%) _wh(3%, 10%)
position absolute position absolute
top 52% top 52%
right 31.5% right 36.5%
z-index 1 z-index 1
transform rotate(90deg) transform rotate(90deg)
.picbox .picbox
@@ -407,7 +407,7 @@ export default {
img img
_wh(100%, auto) _wh(100%, auto)
.box2 .box2
_wh(100%, 40%) _wh(100%, 37.5%)
.item_wrap .item_wrap
_wh(100%, 100%) _wh(100%, 100%)
+.item_wrap +.item_wrap

View File

@@ -23,7 +23,7 @@
</div> </div>
</div> </div>
<div class="box_l1"> <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}" @click.stop="getInfo1(e, i)"> <div v-for="(e,i) in TrappedShelf40List.slice(0, 20)" :key="i" class="picbox" :class="{'mgt5': i === 10 || i === 14 || i === 18, 'mgt6': i === 6, 'mgt2': i === 2}" @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) === ''" 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) === '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) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
@@ -83,7 +83,7 @@
</div> </div>
</div> </div>
<div class="box_l2"> <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}" @click.stop="getInfo1(e, i)"> <div v-for="(e,i) in TrappedShelf40List.slice(20, 40)" :key="i" class="picbox" :class="{'mgt5': i === 6 || i === 10 || i === 14 || i === 18, 'mgt6': i === 6, 'mgt2': i === 2}" @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) === ''" 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) === '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) === '5'" src="../../../images/workshop/lz_hj_red.png" alt="">
@@ -276,8 +276,8 @@
<li>物料名称</li> <li>物料名称</li>
<li>重量</li> <li>重量</li>
<li>载具号</li> <li>载具号</li>
<li style="width: 6%">静置(h)</li>
<li>碾次</li> <li>碾次</li>
<li>静置(h)</li>
<li>状态</li> <li>状态</li>
</ul> </ul>
<div class="scroll_container_1"> <div class="scroll_container_1">
@@ -290,8 +290,8 @@
<div class="scroll-ul_1_div">{{e.material_code}}</div> <div class="scroll-ul_1_div">{{e.material_code}}</div>
<div class="scroll-ul_1_div">{{e.weight}}</div> <div class="scroll-ul_1_div">{{e.weight}}</div>
<div class="scroll-ul_1_div">{{e.vehicle_code}}</div> <div class="scroll-ul_1_div">{{e.vehicle_code}}</div>
<div class="scroll-ul_1_div" style="width: 6%">{{e.standing_time}}</div>
<div class="scroll-ul_1_div">{{e.mix_num}}</div> <div class="scroll-ul_1_div">{{e.mix_num}}</div>
<div class="scroll-ul_1_div">{{e.standing_time}}</div>
<div class="scroll-ul_1_div">{{e.stand_status_name}}</div> <div class="scroll-ul_1_div">{{e.stand_status_name}}</div>
</li> </li>
</ul> </ul>
@@ -350,6 +350,12 @@
</div> </div>
<div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div> <div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div>
</div> </div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
</div> </div>
</template> </template>
@@ -453,6 +459,7 @@ export default {
.c_red .c_red
color $orange !important color $orange !important
.n_container .n_container
position relative
_wh(100%, 100%) _wh(100%, 100%)
.n_header .n_header
_wh(100%, 8%) _wh(100%, 8%)
@@ -556,8 +563,12 @@ export default {
_wh(100%, auto) _wh(100%, auto)
.mgt5 .mgt5
margin-top 55% margin-top 55%
.mgt2
margin-top 71%
.mgt6
margin-top 42%
.box2 .box2
_wh(100%, 40%) _wh(100%, 37.5%)
_fj(row) _fj(row)
.item_wrap .item_wrap
_wh(calc(50% - 8px), 100%) _wh(calc(50% - 8px), 100%)

View File

@@ -107,6 +107,12 @@
<div class="tooltip_page current_page pointer">6</div> <div class="tooltip_page current_page pointer">6</div>
</div> </div>
</div> </div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
</div> </div>
</template> </template>
@@ -477,7 +483,7 @@ export default {
fontSize: 14, fontSize: 14,
lineHeight: 14 lineHeight: 14
}, },
itemGap: 30.86, itemGap: 50.86,
itemWidth: 14.16, itemWidth: 14.16,
itemHeight: 7.38, itemHeight: 7.38,
data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}] data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}]
@@ -720,7 +726,7 @@ export default {
fontSize: 14, fontSize: 14,
lineHeight: 14 lineHeight: 14
}, },
itemGap: 30.86, itemGap: 50.86,
itemWidth: 14.16, itemWidth: 14.16,
itemHeight: 7.38, itemHeight: 7.38,
data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}] data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}]
@@ -953,6 +959,7 @@ export default {
@import '~@css/mixin' @import '~@css/mixin'
.n_container .n_container
_wh(100%, 100%) _wh(100%, 100%)
position relative
.n_header .n_header
_wh(100%, 84px) _wh(100%, 84px)
_bis('../../../images/top_left.png', auto,,right,,) _bis('../../../images/top_left.png', auto,,right,,)
@@ -964,7 +971,7 @@ export default {
margin-right -3px margin-right -3px
.n_body_container .n_body_container
_wh(100%, calc(100% - 84px)) _wh(100%, calc(100% - 84px))
padding 40px 0 0 54px padding 40px 0 0 34px
.n_body_container_wraper .n_body_container_wraper
_wh(100%, 100%) _wh(100%, 100%)
padding-right 8px padding-right 8px
@@ -982,7 +989,7 @@ export default {
.box1 .box1
// _wh(100%, 20%) // _wh(100%, 20%)
width 100% width 100%
height 212px height 218px
_fj() _fj()
flex-direction row flex-direction row
margin-bottom 1% margin-bottom 1%
@@ -1020,6 +1027,8 @@ export default {
_wh(4.0273rem, 100%) _wh(4.0273rem, 100%)
.item_wrap .item_wrap
_wh(calc(50% - 8px), 100%) _wh(calc(50% - 8px), 100%)
position relative
z-index 10
.item_tip .item_tip
clear both clear both
_wh(100%, 32px) _wh(100%, 32px)
@@ -1169,7 +1178,7 @@ export default {
_wh(140px, 140px) _wh(140px, 140px)
background center bottom / 100% 100% url(../../..//images/screen1/item_3.png) no-repeat background center bottom / 100% 100% url(../../..//images/screen1/item_3.png) no-repeat
_fj(row,center) _fj(row,center)
margin-right 150px margin-right 160px
.echart_d3_wrap .echart_d3_wrap
_wh(82%, 82%) _wh(82%, 82%)
margin 0 auto margin 0 auto

View File

@@ -111,6 +111,12 @@
</div> </div>
<div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div> <div class="tooltip_arrow pointer" @click="expandTooltip" v-text="expand ? '&lt;&lt;' : '&gt;&gt;'"></div>
</div> </div>
<div class="style_block" style="left: calc(100% / 3);top:0;"></div>
<div class="style_block" style="background: green;left: calc(100% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="left: calc(100% / 3);bottom: 0"></div>
<div class="style_block" style="background: green;left: calc(200% / 3);top:0;"></div>
<div class="style_block" style="left: calc(200% / 3);top:calc(100% / 3);"></div>
<div class="style_block" style="background: blue;left: calc(200% / 3);bottom: 0"></div>
</div> </div>
</template> </template>
@@ -486,7 +492,7 @@ export default {
fontSize: 14, fontSize: 14,
lineHeight: 14 lineHeight: 14
}, },
itemGap: 30.86, itemGap: 50.86,
itemWidth: 14.16, itemWidth: 14.16,
itemHeight: 7.38, itemHeight: 7.38,
data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}] data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}]
@@ -776,7 +782,7 @@ export default {
fontSize: 14, fontSize: 14,
lineHeight: 14 lineHeight: 14
}, },
itemGap: 30.86, itemGap: 50.86,
itemWidth: 14.16, itemWidth: 14.16,
itemHeight: 7.38, itemHeight: 7.38,
data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}] data: [{name: '合格数', itemStyle: {color: '#33CCCC'}}, {name: '不合格数', itemStyle: {color: '#EAAD24'}}]
@@ -1166,6 +1172,7 @@ export default {
@import '~@css/mixin' @import '~@css/mixin'
.n_container .n_container
_wh(100%, 100%) _wh(100%, 100%)
position relative
.n_header .n_header
_wh(100%, 84px) _wh(100%, 84px)
_bis('../../../images/top_right.png', auto,,left,,) _bis('../../../images/top_right.png', auto,,left,,)
@@ -1177,14 +1184,14 @@ export default {
padding-left 3px padding-left 3px
.n_body_container .n_body_container
_wh(100%, calc(100% - 84px)) _wh(100%, calc(100% - 84px))
padding 40px 54px 0 0 padding 40px 34px 0 0
.n_body_container_wraper .n_body_container_wraper
_wh(100%, 100%) _wh(100%, 100%)
padding-left 8px padding-left 8px
.box1 .box1
// _wh(100%, 20%) // _wh(100%, 20%)
width 100% width 100%
height 212px height 218px
_fj() _fj()
flex-direction row flex-direction row
margin-bottom 1% margin-bottom 1%
@@ -1222,6 +1229,8 @@ export default {
_wh(4.0273rem, 100%) _wh(4.0273rem, 100%)
.item_wrap .item_wrap
_wh(calc(50% - 8px), 100%) _wh(calc(50% - 8px), 100%)
position relative
z-index 10
.item_tip .item_tip
clear both clear both
_wh(100%, 32px) _wh(100%, 32px)
@@ -1386,7 +1395,7 @@ export default {
.right_1_up_p1 .right_1_up_p1
font-family "SourceHanSansCN" font-family "SourceHanSansCN"
_font(22px, 60px, #78B1DE, 700, center) _font(22px, 60px, #78B1DE, 700, center)
margin-left 24px margin-left 12px
.right_1_up_p2 .right_1_up_p2
font-family "SourceHanSansCN" font-family "SourceHanSansCN"
_font(24px, 60px, $yellow, 700, center) _font(24px, 60px, $yellow, 700, center)