Commit cfd18d2e authored by xxx's avatar xxx

1

parent 97550108
<template> <template>
<div> <div class="DPcomputer2Box">
<!-- 司机信息 -->
<div class="dataScrView_leftView_title">司机信息</div>
<div class="dataScrView_leftView_content">
<div class="driverInforViewsStyle">
<div class="driverTotalnumberStyle">
<img src="../../../../assets/images/cutGraph/siji11.png">
<div>
<div style="text-align: center;font-size:15px;">司机总人数</div>
<div style="text-align: center;font-size:18px;">{{driverData.totalNumber}}</div>
</div>
</div>
<div class="presentDrivernumberStyle">
<div style="color:#3DFBEB;">
<div style="text-align: center;font-size:15px;">当前工作人数</div>
<div style="text-align: center;font-size:18px;">{{driverData.workersNumber}}</div>
</div>
<div style="color:#F7E518;">
<div style="text-align: center;font-size:15px;">当前休息人数</div>
<div style="text-align: center;font-size:18px;">{{driverData.restNumber}}</div>
</div>
</div>
</div>
<div class="driverInforListStyle">
<div class="rolling">
<div class="table-box">
<dl>
<dt>
<div>司机姓名</div>
<div>驾驶车辆</div>
<div>驾驶时长</div>
<div>计划结束时间</div>
</dt>
<dd v-for="(item,index) in driverData.driverTableData" :key="index">
<div>{{item.name}}</div>
<div>{{item.car}}</div>
<div>{{item.time}}</div>
<div>{{item.endTime}}</div>
</dd>
</dl>
</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -11,19 +53,71 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js'; ...@@ -11,19 +53,71 @@ import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
export default { export default {
data(){ data(){
return { return {
DPcomputer2BoxTimer:null,
//司机信息
driverData:{
totalNumber:0,
workersNumber:0,
restNumber:0,
driverTableData:[],
},
} }
}, },
mounted(){ mounted(){
this.loadData();
}, },
methods:{ methods:{
loadData(){ loadData(){
//获取司机信息
HttpReq.truckDispatching.screenDriverInformationQuery({size:9999}).then((res) => {
if(res.code == 200){
//司机信息处理
let workerTemporary = [];
let restTemporary = [];
res.data.content.forEach((item) => {
if(item.status == 1){
workerTemporary.push(item);
}else{
restTemporary.push(item);
}
});
this.driverData.totalNumber = res.data.totalElements;
this.driverData.driverTableData = workerTemporary;
this.driverData.workersNumber = workerTemporary.length;
this.driverData.restNumber = restTemporary.length;
}
})
this.DPcomputer2BoxTimer = setInterval(() => {
//获取司机信息
HttpReq.truckDispatching.screenDriverInformationQuery({size:9999}).then((res) => {
if(res.code == 200){
//司机信息处理
let workerTemporary = [];
let restTemporary = [];
res.data.content.forEach((item) => {
if(item.status == 1){
workerTemporary.push(item);
}else{
restTemporary.push(item);
}
});
this.driverData.totalNumber = res.data.totalElements;
this.driverData.driverTableData = workerTemporary;
this.driverData.workersNumber = workerTemporary.length;
this.driverData.restNumber = restTemporary.length;
}
})
},10000)
}, },
}, },
beforeDestroy(){ beforeDestroy(){
if(this.DPcomputer2BoxTimer) {
clearInterval(this.DPcomputer2BoxTimer);
this.DPcomputer2BoxTimer = null;
}
} }
} }
</script> </script>
...@@ -33,5 +127,93 @@ export default { ...@@ -33,5 +127,93 @@ export default {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.DPcomputer2Box{
width: 20vw;
height: 23.5vh;
background-color: rgba(32,42,67,0.95);
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.DPcomputer2Box .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;
}
.DPcomputer2Box .dataScrView_leftView_content{
width: 100%;
height: 19vh;
}
.DPcomputer2Box .driverInforViewsStyle{
width: 100%;
display: flex;
justify-content: space-between;
}
.DPcomputer2Box .driverTotalnumberStyle{
width: 40%;
height: 5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/sijirenshu1.png');
background-size:100% 100%;
display: flex;
align-items: center;
justify-content: space-evenly;
color: white;
}
.DPcomputer2Box .presentDrivernumberStyle{
width: 59%;
height: 5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/dangqianrenshu1.png');
background-size:100% 100%;
display: flex;
align-items: center;
justify-content: space-evenly;
}
.DPcomputer2Box .driverInforListStyle{
text-align: center;
}
.DPcomputer2Box .rolling{
height: 13.5vh;
overflow-y:auto;
scrollbar-width: none;
}
.DPcomputer2Box .rolling::-webkit-scrollbar {
display: none;
}
/* .DPcomputer2Box .table-box{
margin-top: -10px;
} */
.DPcomputer2Box dl{
display:table;
width:100%;
}
.DPcomputer2Box dt{
margin-top: 20px;
display:table-row;
background-color: #274088;
}
.DPcomputer2Box dt>div{
display:table-cell;
padding:5px 3px;
font-size: 15px;
font-weight: 500;
color: rgb(24,228,240);
}
.DPcomputer2Box dd{
display:table-row;
}
.DPcomputer2Box dd>div{
display:table-cell;
padding:5px 3px;
font-size: 14px;
color: rgb(24,228,240);
}
</style> </style>
\ No newline at end of file
<template> <template>
<div> <div class="DPcomputer4Box">
</div> </div>
</template> </template>
<script> <script>
import { Tools, HttpReq, CAMap} from '@/assets/js/common.js'; import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
import * as echarts from 'echarts';
export default { export default {
data(){ data(){
return { return {
DPcomputer4BoxTimer:null,
} }
}, },
mounted(){}, mounted(){
this.loadData();
},
methods:{ methods:{
loadData(){
}
}, },
beforeDestroy(){ beforeDestroy(){
if(this.DPcomputer4BoxTimer) {
clearInterval(this.DPcomputer4BoxTimer);
this.DPcomputer4BoxTimer = null;
}
} }
} }
</script> </script>
...@@ -29,5 +38,12 @@ export default { ...@@ -29,5 +38,12 @@ export default {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.DPcomputer4Box{
width: 20vw;
height: 23.5vh;
background-color: rgba(32,42,67,0.95);
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
</style> </style>
\ No newline at end of file
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