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

instore

Browse Source
This commit is contained in:
xiangxy
2024-04-29 16:03:47 +08:00
parent 0cf099d202
commit 0142e8a0f3
1 changed files with 76 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/pages/modules/InStore.vue
View File

@@ -10,7 +10,21 @@
</div>
<div class="item_content con01">
<div class="lbox">
<div id="echart_d01" style="width: 100%; height: 100%"></div>
<!-- <div id="echart_d01" style="width: 100%; height: 100%"></div> -->
<div class="three_w_item">
<vue-seamless-scroll :data="kc.list" :class-option="defaultOption1">
<ul class="scroll-ul_1">
<li v-for="(e, i) in kc.list" :key="i">
<span class="scroll_th">名称:</span>
<span>{{ e.name }}，</span>
<span class="scroll_th">数量:</span>
<span>{{ e.number }} </span>
<!-- <span class="scroll_th">占比:</span>
<span>{{ Number(e.number) / total }}</span> -->
</li>
</ul>
</vue-seamless-scroll>
</div>
</div>
<div class="rbox">
<div class="rbox-con">
@@ -73,24 +87,24 @@
<div class="item_content">
<div class="scroll_wrap">
<ul class="scroll_tab_2">
<li>序号</li>
<li>托盘号</li>
<li>物料编码</li>
<li style="width: 7%;">序号</li>
<li style="width: 17%;">托盘号</li>
<li style="width: 17%;">物料编码</li>
<li>名称</li>
<li>数量(条)</li>
<li>重量(kg)</li>
<!-- <li>数量(条)</li> -->
<li style="width: 13%;">重量(kg)</li>
<li>供应商</li>
</ul>
<div class="scroll_container_2">
<vue-seamless-scroll :data="kn" :class-option="defaultOption2">
<ul class="scroll-ul_2">
<li v-for="(e, i) in kn" :key="i">
<div class="scroll-ul_2_div">{{i + 1}}</div>
<div class="scroll-ul_2_div">{{e.palletSN}}</div>
<div class="scroll-ul_2_div">{{e.productName}}</div>
<div class="scroll-ul_2_div" style="width: 7%;">{{i + 1}}</div>
<div class="scroll-ul_2_div" style="width: 17%;">{{e.palletSN}}</div>
<div class="scroll-ul_2_div" style="width: 17%;">{{e.productName}}</div>
<div class="scroll-ul_2_div">{{e.productDescription}}</div>
<div class="scroll-ul_2_div">{{e.qty}}</div>
<div class="scroll-ul_2_div">{{e.incomingWeight}}</div>
<!-- <div class="scroll-ul_2_div">{{e.qty}}</div> -->
<div class="scroll-ul_2_div" style="width: 13%;">{{e.incomingWeight}}</div>
<div class="scroll-ul_2_div">{{e.supplierName}}</div>
</li>
</ul>
@@ -106,24 +120,24 @@
<div class="item_content">
<div class="scroll_wrap">
<ul class="scroll_tab_2">
<li>序号</li>
<li>托盘号</li>
<li>物料编码</li>
<li style="width: 7%;">序号</li>
<li style="width: 17%;">托盘号</li>
<li style="width: 17%;">物料编码</li>
<li>名称</li>
<li>数量(条)</li>
<li>重量(kg)</li>
<!-- <li>数量(条)</li> -->
<li style="width: 13%;">重量(kg)</li>
<li>供应商</li>
</ul>
<div class="scroll_container_2">
<vue-seamless-scroll :data="wrk" :class-option="defaultOption2">
<ul class="scroll-ul_2">
<li v-for="(e, i) in wrk" :key="i">
<div class="scroll-ul_2_div">{{i + 1}}</div>
<div class="scroll-ul_2_div">{{e.palletSN}}</div>
<div class="scroll-ul_2_div">{{e.productName}}</div>
<div class="scroll-ul_2_div" style="width: 7%;">{{i + 1}}</div>
<div class="scroll-ul_2_div" style="width: 17%;">{{e.palletSN}}</div>
<div class="scroll-ul_2_div" style="width: 17%;">{{e.productName}}</div>
<div class="scroll-ul_2_div">{{e.productDescription}}</div>
<div class="scroll-ul_2_div">{{e.qty}}</div>
<div class="scroll-ul_2_div">{{e.incomingWeight}}</div>
<!-- <div class="scroll-ul_2_div">{{e.qty}}</div> -->
<div class="scroll-ul_2_div" style="width: 13%;">{{e.incomingWeight}}</div>
<div class="scroll-ul_2_div">{{e.supplierName}}</div>
</li>
</ul>
@@ -156,11 +170,26 @@ export default {
wrk: [],
kc: {},
hw: {},
total: 0,
resData: {},
myCharts01: ''
}
},
computed: {
defaultOption1 () {
return {
timer1: null,
timer2: null,
step: 0.4, // 数值越大速度滚动越快
limitMoveNum: 8, // 开始无缝滚动的数据量 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 {
timer1: null,
@@ -198,7 +227,12 @@ export default {
this.wrk = res.wrk
this.kc = res.kc
this.hw = res.hw
this.setEchart01()
this.kc.list.map(el => {
this.total += Number(el.number)
if (this.total > 0) {
el.zhanbi = Number(el.number) / this.total
}
})
},
setEchart01 () {
// let data = [
@@ -317,6 +351,8 @@ export default {
.sec2
display flex
.bottom
position: fixed;
bottom: 0;
_wh(100%, 38px)
// background center bottom / 1906px 100% url(../../images/screen1/bottom.png) no-repeat
background center bottom / 100% 100% url(../../images/screen1/bottom.png) no-repeat
@@ -404,7 +440,7 @@ export default {
border-bottom 1px solid rgba(8,205,248,0.3)
li
float left
width 14%
width 23%
_font(12px,30px,#78B1DE,,center)
word-wrap break-word
word-break break-all
@@ -426,15 +462,15 @@ export default {
box-shadow inset 0px 1px 0px 0px rgba(13,89,115,0.3)
.scroll-ul_2_div
float left
_wh(14%, 30px)
_wh(23%, 30px)
_fj(center)
_font(12px, 44px, #fff,,center)
word-wrap break-word
word-break break-all
white-space nowrap
padding 0 2px
overflow hidden
scale 0.8
// overflow hidden
scale 0.61
.lbox
.list-con
.li
@@ -453,4 +489,18 @@ export default {
margin 0 20px
.li-right
margin-left 20px
.three_w_item
// _wh(calc(50% - 15px), 100%)
width 100%
// height 200px
background-image linear-gradient(to bottom, #040b1a, #050919)
overflow hidden
&:first-child
margin-right 30px
.three_w_item
.scroll-ul_1
li
line-height 26px
span
font-size 12px
</style>