Commit 97550108 authored by xxx's avatar xxx

大屏模块新增1

parent 2c07a9cc
<template> <template>
<div> <div class="DPcomputer1Box">
<!-- 采区产量统计 -->
<div class="dataScrView_leftView_title">采区产量统计</div>
<div class="dataScrView_leftView_content">
<div class="dataScrView_leftView_content_view1">
<div class="dataScrView_leftView_content_view1_son1">{{parseInt(outputMineData.day.eff)}}%</div>
<div style="color:white;margin-left:15px;font-size: 16px;">
<div>日产量</div>
<div class="outside-div1">
<div v-for="(item,index) in parseInt(parseInt(outputMineData.day.eff) / 10)" :key="index" class="inside-div1"></div>
</div>
当前日产量:
<span style="color:#02F7EF;">{{outputMineData.day.finish}}</span>
</div>
</div>
<div class="dataScrView_leftView_content_view1">
<div class="dataScrView_leftView_content_view1_son1">{{parseInt(outputMineData.month.eff)}}%</div>
<div style="color:white;margin-left:15px;font-size: 16px;">
<div>月产量</div>
<div class="outside-div1">
<div v-for="(item,index) in parseInt(parseInt(outputMineData.month.eff) / 10)" :key="index" class="inside-div1"></div>
</div>
当前月产量:
<span style="color:#02F7EF;">{{outputMineData.month.finish}}</span>
</div>
</div>
<div class="dataScrView_leftView_content_view1">
<div class="dataScrView_leftView_content_view1_son1">{{parseInt(outputMineData.year.eff)}}%</div>
<div style="color:white;margin-left:15px;font-size: 16px;">
<div>年产量</div>
<div class="outside-div1">
<div v-for="(item,index) in parseInt(parseInt(outputMineData.year.eff) / 10)" :key="index" class="inside-div1"></div>
</div>
当前年产量:
<span style="color:#02F7EF;">{{outputMineData.year.finish}}</span>
</div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -11,15 +47,177 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js'; ...@@ -11,15 +47,177 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
export default { export default {
data(){ data(){
return { return {
//定时器
DPcomputer1BoxTimer:null,
//产量数据以及中间图表数据
outputMineData:{
day:{finish:'0',eff:0,plan:'0',},
month:{finish:'0',eff:0,plan:'0',},
year:{finish:'0',eff:0,plan:'0',},
},
} }
}, },
mounted(){}, mounted(){
this.loadData();
},
methods:{ methods:{
loadData(){
//获取采区当前日产量
HttpReq.truckDispatching.apiPlanDayQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.day = undueArray;
})
//获取采区当前月产量
HttpReq.truckDispatching.apiPlanMonthQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.month = undueArray;
})
//获取采区当前年产量
HttpReq.truckDispatching.apiPlanYearQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.year = undueArray;
})
this.DPcomputer1BoxTimer = setInterval(()=>{
//获取采区当前日产量
HttpReq.truckDispatching.apiPlanDayQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.day = undueArray;
})
//获取采区当前月产量
HttpReq.truckDispatching.apiPlanMonthQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.month = undueArray;
})
//获取采区当前年产量
HttpReq.truckDispatching.apiPlanYearQuery().then((res) => {
let undueArray = {};
if(res.length == 0 || JSON.stringify(res[0]) == '{}'){
undueArray.eff = 0;
undueArray.finish = 0;
undueArray.plan = 0;
}else{
if(res[0].eff == ''){
undueArray.eff = 0;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else if(res[0].eff >= 1){
undueArray.eff = 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}else{
undueArray.eff = parseFloat(res[0].eff) * 100;
undueArray.finish = res[0].finish;
undueArray.plan = res[0].plan;
}
}
this.outputMineData.year = undueArray;
})
},10000)
}
}, },
beforeDestroy(){ beforeDestroy(){
if(this.DPcomputer1BoxTimer) {
clearInterval(this.DPcomputer1BoxTimer);
this.DPcomputer1BoxTimer = null;
}
} }
} }
</script> </script>
...@@ -29,5 +227,59 @@ export default { ...@@ -29,5 +227,59 @@ export default {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.DPcomputer1Box{
width: 20vw;
height: 23.5vh;
background-color: rgba(32,42,67,0.95);
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.DPcomputer1Box .dataScrView_leftView_title{
margin-bottom: 5px;
width: 100%;
height: 3.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/biaoti1.png');
background-size:100% 100%;
padding-left: 10px;
box-sizing: border-box;
font-size: 18px;
line-height: 3.5vh;
color: #FAFAFB;
letter-spacing: 1px;
text-shadow: 1px 1px 1px #92CBFF;
}
.DPcomputer1Box .dataScrView_leftView_content{
width: 100%;
height: 19vh;
}
.DPcomputer1Box .dataScrView_leftView_content_view1{
margin-bottom: 7px;
display: flex;
align-items: center;
font-size: 20px;
}
.DPcomputer1Box .dataScrView_leftView_content_view1_son1{
width: 5.5vh;
height: 5.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/bilikuang.png');
background-size:100% 100%;
line-height: 5.5vh;
text-align: center;
color: white;
font-size: 16px;
}
.DPcomputer1Box .outside-div1{
width: 15vw;
height: 20px;
border: 1px solid #91A9FF;
display: flex;
align-items: center;
}
.DPcomputer1Box .inside-div1{
margin-left: 0.13vw;
width: 9%;
height: 12px;
background-color: #02EEF7;
}
</style> </style>
\ No newline at end of file
...@@ -11,12 +11,16 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js'; ...@@ -11,12 +11,16 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
export default { export default {
data(){ data(){
return { return {
} }
}, },
mounted(){}, mounted(){
},
methods:{ methods:{
loadData(){
},
}, },
beforeDestroy(){ beforeDestroy(){
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment