LiuXue
/
JinZHouXiYiJi_DaPin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

数据大屏三的修改

main
DengJiangKun 2023-12-09 14:13:32 +08:00
parent cac8709214
commit fe2fcae9a5
5 changed files with 57 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/components/datav/CenterCmp.vue
View File

@ -2,29 +2,29 @@
<div class="center-cmp">
<div class="cc-details">
<div style="width:40%;height:30px;align-items: center ;font-size: 15px ;text-align: center" >
<span>当月入库</span>
<div style="width:40%;height:30px;align-items: center ;font-size: 15px ;text-align: center;margin-top: 30px" >
<span>当日入库</span>
</div>
<div style="width:20%;height:30px;align-items: center ;font-size: 15px ;text-align: center" >
</div>
<div style="width:40%;height:30px;align-items: center ;font-size: 15px ;text-align: center" >
<span>当月出库</span>
<div style="width:40%;height:30px;align-items: center ;font-size: 15px ;text-align: center;margin-top: 30px" >
<span>当日出库</span>
</div>
</div>
<div class="cc-header">
<div style="width:40%;height:50px; float: left;display: flex" >
<div class="card">{{r1}}</div>
<div class="card">{{r2}}</div>
<div class="card">{{r3}}</div>
<div class="card">{{r4}}</div>
<div class="card">{{r5}}</div>
<div style="width:40%;height:50px; float: left;display: flex;margin-left: 20px" >
<div class="card">{{this.inZX}}</div>
<!-- <div class="card"></div>-->
<div class="card">{{this.inDZX}}</div>
<!-- <div class="card"></div>-->
<!-- <div class="card"></div>-->
</div>
<div style="width:40%;height:50px; float: left;display: flex" >
<div class="card">{{c1}}</div>
<div class="card">{{c2}}</div>
<div class="card">{{c3}}</div>
<div class="card">{{c4}}</div>
<div class="card">{{c5}}</div>
<div style="width:40%;height:50px; float: left;display: flex;margin-right: -20px" >
<div class="card">{{this.outZX}}</div>
<!-- <div class="card"></div>-->
<div class="card">{{this.outDZX}}</div>
<!-- <div class="card"></div>-->
<!-- <div class="card"></div>-->
</div>
</div>
@ -32,8 +32,10 @@
</div>
<div class="cc-main-container">
<dv-active-ring-chart class="ccmc-middle" :config="config1" />
<dv-active-ring-chart class="ccmc-middle" :config="config2" />
<dv-decoration-9 style="width:150px;height:150px;margin-left: 40px;margin-top: 10px" :color="['#007ef9', '#052650']">{{this.inAllData}}</dv-decoration-9>
<dv-decoration-9 style="width:150px;height:150px;margin-left: 110px;margin-top: 10px" :color="['#007ef9', '#052650']">{{this.outAllData}}</dv-decoration-9>
<!-- <dv-active-ring-chart class="ccmc-middle" :config="config1" />-->
<!-- <dv-active-ring-chart class="ccmc-middle" :config="config2" />-->
</div>
<div class="cc-details">
@ -66,7 +68,13 @@ export default {
c2:'0',
c3:'0',
c4:'0',
c5:'0'
c5:'0',
outAllData:0,
outZX:0,
outDZX:0,
inAllData:0,
inZX:0,
inDZX:0
}
},
mounted () {
@ -75,11 +83,13 @@ export default {
this.getListData()
this.getListData2()
this.getListData3()
this.getListData4()
}, 2500)
setInterval(this.getListData, 535000)
setInterval(this.getListData2, 545000)
setInterval(this.getListData3, 555000)
setInterval(this.getListData4, 60000)
},
methods: {
getListData () {
@ -134,6 +144,18 @@ export default {
//let data2=JSON.parse(this.list);
})
},
getListData4(){
this.$axios.post('/api/api/screeView/inOutData',{}).then(res => {
console.log("===============")
console.log(res)
this.outAllData=res.data.outAll;
this.outZX=res.data.outZX;
this.outDZX=res.data.outDZX;
this.inAllData=res.data.inAll;
this.inZX=res.data.inZX;
this.inDZX=res.data.inDZX;
})
}
}
}

4
src/components/datav/LeftChart2.vue
View File

@ -114,8 +114,8 @@ export default {
flex-direction: column;
justify-content: center;
align-items: center;
border-left: 3px solid rgb(6, 30, 93);
border-right: 3px solid rgb(6, 30, 93);
border-left: 3px solid #052650;
border-right: 3px solid #052650;
}
.digital-flop-title {

4
src/components/datav/RightChart1.vue
View File

@ -161,7 +161,8 @@ export default {
box-sizing: border-box;
margin: 0;
padding: 0;
padding: 10px;
margin-top: -16px;
right: 20px;
}
.m-video {
@ -171,6 +172,7 @@ export default {
position: relative;
background: #ffffff00;
cursor: pointer;
transform: scale(0.85);
.u-play {
position: absolute;
top: 0;

12
src/components/datav/RightChart3.vue
View File

@ -1,6 +1,6 @@
<template>
<div className="bottom-right-table-3">
<dv-scroll-board :config="config1" style="width: 410px;height: 400px;padding: 10px"/>
<dv-scroll-board :config="config1" style="width: 350px;height: 300px;margin: 5px 0 0 5px"/>
</div>
</template>
@ -17,7 +17,7 @@ export default {
['<span style="font-size: 24px">料号行</span>', '<span style="font-size: 24px">0</span>']
],
rowNum: 6,
headerBGC: '#000fff82',
headerBGC: '#061a3a',
oddRowBGC: '#ededed33',
evenRowBGC: '#ededed33',
headerHeight:60,
@ -32,14 +32,14 @@ export default {
console.log('123123213123131')
setTimeout(() => {
this.getListData()
}, 3500)
}, 6000)
setInterval(this.getListData, 585000)
setInterval(this.getListData, 60000)
},
methods: {
getListData () {
// 这里getList获取到的res是接口返回的所有内容（包含code、msg、data等），里面只有data是业务数据
this.$axios.post('/api/api/screeView/inventoryView',{
this.$axios.post('/api/api/screeView/taskPerformed',{
methodType:9
})
.then(res => {
@ -59,7 +59,7 @@ export default {
.bottom-right-table-3 {
width: 400px;
height: 100%;
margin: 0 -5px;
margin: 0 -3px;
.border-box-content {
padding: 20px;

8
src/components/datav/index.vue
View File

@ -3,7 +3,8 @@
<dv-full-screen-container>
<div class="main-header">
<div class="mh-left"></div>
<div class="mh-middle">荆州洗衣机数据可视化平台</div>
<!-- <div class="mh-middle">荆州洗衣机数据可视化平台</div>-->
<dv-decoration-7 class="mh-middle" style="margin-left: 40px">荆州洗衣机数据可视化平台</dv-decoration-7>
<div class="mh-right">
</div>
@ -40,7 +41,7 @@
<div class="right-top-container">
<div class="rmctc-right-container">
<dv-border-box-8 class="rmctc-chart-1">
<dv-border-box-8 class="rmctc-chart-1" style="width: 358px">
<Right-Chart-1/>
@ -98,7 +99,8 @@ export default {
color: #fff;
#dv-full-screen-container {
background-image: url('./img/bg3.png');
//background-image: url('./img/bg3.png');
background-color: #050c1e;
background-size: 100% 100%;
box-shadow: 0 0 3px blue;
display: flex;