Commit 5b9b2c40 authored by xxx's avatar xxx

1

parent b84db947
......@@ -2534,6 +2534,22 @@ var HttpReq = function(){
params:param,
})
},
//大屏组件27接口
apiAlarmBlQuery: function(param){
return request({
url: '/api/Alarm/Bl',
method: 'get',
params:param,
})
},
//大屏组件9接口
apiAlarmBjQuery: function(param){
return request({
url: '/api/Alarm/Bj',
method: 'get',
params:param,
})
},
......
<template>
<div class="DPcomputer21Box">
<!-- <template>
<div class="DPcomputer21Box"> -->
<!-- 采区产量统计 -->
<div class="dataAnalysisScrView_leftView_title">采区产量统计</div>
<!-- <div class="dataAnalysisScrView_leftView_title">采区产量统计</div>
<div class="dataAnalysisScrView_leftView_content" style="position: relative;">
<div id="echarts1View"></div>
</div>
</div>
</template>
</template> -->
<!--
<script>
import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
import * as echarts from 'echarts';
......@@ -185,3 +185,291 @@ export default {
height: 27vh;
}
</style>
-->
<template>
<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>
</template>
<script>
import { Tools, HttpReq, CAMap} from '@/assets/js/common.js';
export default {
data(){
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(){
this.loadData();
},
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;
})
},60000)
}
},
beforeDestroy(){
if(this.DPcomputer1BoxTimer) {
clearInterval(this.DPcomputer1BoxTimer);
this.DPcomputer1BoxTimer = null;
}
}
}
</script>
<style scoped>
*{
margin: 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>
\ No newline at end of file
......@@ -27,114 +27,74 @@ export default {
methods:{
loadData(){
//报警路障申报统计
HttpReq.truckDispatching.breakDownQueryDay({size:9999}).then((res) => {
HttpReq.truckDispatching.apiAlarmBlQuery({size:9999}).then((res) => {
let that = this;
if(res.code == 200){
//报警路障申报统计过度数组
let alarmBreakArray = [];
let breakObj1 = {};
breakObj1.name = '车辆故障';
breakObj1.value = res.data.totalElements;
alarmBreakArray.push(breakObj1);
//获取报警信息
HttpReq.truckDispatching.callPoliceQuery({size:9999,}).then((res) => {
if(res.code == 200){
let alarmObj1 = {};
let alarmArray1 = [];
let alarmObj2 = {};
let alarmArray2 = [];
let alarmObj3 = {};
let alarmArray3 = [];
let alarmObj4 = {};
let alarmArray4 = [];
res.data.content.forEach((item,index)=>{
if(item.alarmclass == '超速'){
alarmArray1.push(item);
}else if(item.alarmclass == '无故停车'){
alarmArray2.push(item);
}else if(item.alarmclass == '驾离电子围栏'){
alarmArray3.push(item);
}else if(item.alarmclass == '驶入电子围栏'){
alarmArray4.push(item);
}
})
alarmObj1.name = '超速';
alarmObj1.value = alarmArray1.length;
alarmObj2.name = '无故停车';
alarmObj2.value = alarmArray2.length;
alarmObj3.name = '驾离电子围栏';
alarmObj3.value = alarmArray3.length;
alarmObj4.name = '驶入电子围栏';
alarmObj4.value = alarmArray4.length;
alarmBreakArray.push(alarmObj1);
alarmBreakArray.push(alarmObj2);
alarmBreakArray.push(alarmObj3);
alarmBreakArray.push(alarmObj4);
that.echarts6Data = alarmBreakArray;
let arr1 = [];
let obj1 = {};
obj1.name = '超速';
obj1.value = res[0].cs;
let obj2 = {};
obj2.name = '车辆故障';
obj2.value = res[0].gz;
let obj3 = {};
obj3.name = '路障申报';
obj3.value = res[0].lz;
let obj4 = {};
obj4.name = '无故停车';
obj4.value = res[0].wg;
let obj5 = {};
obj5.name = '驶入电子围栏';
obj5.value = res[0].xr;
let obj6 = {};
obj6.name = '驶离电子围栏';
obj6.value = res[0].xc;
arr1.push(obj1);
arr1.push(obj2);
arr1.push(obj3);
arr1.push(obj4);
arr1.push(obj5);
arr1.push(obj6);
that.echarts6Data = arr1;
this.$nextTick(()=>{
that.echarts6Fn();
})
}
})
}
})
this.DPcomputer27BoxTimer = setInterval(() => {
//报警路障申报统计
HttpReq.truckDispatching.breakDownQueryDay({size:9999}).then((res) => {
HttpReq.truckDispatching.apiAlarmBlQuery({size:9999}).then((res) => {
let that = this;
if(res.code == 200){
//报警路障申报统计过度数组
let alarmBreakArray = [];
let breakObj1 = {};
breakObj1.name = '车辆故障';
breakObj1.value = res.data.totalElements;
alarmBreakArray.push(breakObj1);
//获取报警信息
HttpReq.truckDispatching.callPoliceQuery({size:9999,}).then((res) => {
if(res.code == 200){
let alarmObj1 = {};
let alarmArray1 = [];
let alarmObj2 = {};
let alarmArray2 = [];
let alarmObj3 = {};
let alarmArray3 = [];
let alarmObj4 = {};
let alarmArray4 = [];
res.data.content.forEach((item,index)=>{
if(item.alarmclass == '超速'){
alarmArray1.push(item);
}else if(item.alarmclass == '无故停车'){
alarmArray2.push(item);
}else if(item.alarmclass == '驾离电子围栏'){
alarmArray3.push(item);
}else if(item.alarmclass == '驶入电子围栏'){
alarmArray4.push(item);
}
})
alarmObj1.name = '超速';
alarmObj1.value = alarmArray1.length;
alarmObj2.name = '无故停车';
alarmObj2.value = alarmArray2.length;
alarmObj3.name = '驾离电子围栏';
alarmObj3.value = alarmArray3.length;
alarmObj4.name = '驶入电子围栏';
alarmObj4.value = alarmArray4.length;
alarmBreakArray.push(alarmObj1);
alarmBreakArray.push(alarmObj2);
alarmBreakArray.push(alarmObj3);
alarmBreakArray.push(alarmObj4);
that.echarts6Data = alarmBreakArray;
let arr1 = [];
let obj1 = {};
obj1.name = '超速';
obj1.value = res[0].cs;
let obj2 = {};
obj2.name = '车辆故障';
obj2.value = res[0].gz;
let obj3 = {};
obj3.name = '路障申报';
obj3.value = res[0].lz;
let obj4 = {};
obj4.name = '无故停车';
obj4.value = res[0].wg;
let obj5 = {};
obj5.name = '驶入电子围栏';
obj5.value = res[0].xr;
let obj6 = {};
obj6.name = '驶离电子围栏';
obj6.value = res[0].xc;
arr1.push(obj1);
arr1.push(obj2);
arr1.push(obj3);
arr1.push(obj4);
arr1.push(obj5);
arr1.push(obj6);
that.echarts6Data = arr1;
this.$nextTick(()=>{
that.echarts6Fn();
})
}
})
}
})
},20000)
},60000)
},
//报警路障申报统计
......@@ -158,7 +118,7 @@ export default {
{
name: '次数',
type: 'pie',
radius: ['40%', '85%'],
radius: ['40%', '80%'],
avoidLabelOverlap: false,
label: {
show: true,
......@@ -218,6 +178,7 @@ export default {
.DPcomputer27Box #echarts6View{
position: absolute;
left: -6vw;
top: -1vh;
width: 125%;
height: 20vh;
}
......
......@@ -10,8 +10,8 @@
<img v-else-if="index % 2 == 0" src="../../../../assets/images/cutGraph/jingshikaobei3.png">
<img v-else src="../../../../assets/images/cutGraph/jingshikaobei4.png">
<div style="color:#A6F6F9;margin-left:10px;">
<div>{{item.alarmexplain ? item.alarmexplain : item.number + item.carbreak}}</div>
<div>{{item.createTime}}</div>
<div>{{item.num + (item.type == 1 ? '驶入电子围栏' : item.type == 2 ? '驶出电子围栏' : item.type)}}报警</div>
<div>{{item.time}}</div>
</div>
</div>
</div>
......@@ -39,26 +39,12 @@ export default {
methods:{
loadData(){
//实时报警
HttpReq.truckDispatching.callPoliceQuery({status:1,size:9999}).then((res) => {
if(res.code == 200){
HttpReq.truckDispatching.carFaultQuery({status:1,size:9999,sort:'createTime,desc'}).then((res1) => {
if(res1.code == 200){
this.realAlarmStyleData.listData = res.data.content.concat(res1.data.content);
}
})
}
HttpReq.truckDispatching.apiAlarmBjQuery({size:9999}).then((res) => {
this.realAlarmStyleData.listData = res;
})
this.DPcomputer9BoxTimer = setInterval(() => {
//实时报警
HttpReq.truckDispatching.callPoliceQuery({status:1,size:9999}).then((res) => {
if(res.code == 200){
HttpReq.truckDispatching.carFaultQuery({status:1,size:9999,sort:'createTime,desc'}).then((res1) => {
if(res1.code == 200){
this.realAlarmStyleData.listData = res.data.content.concat(res1.data.content);
}
})
}
HttpReq.truckDispatching.apiAlarmBjQuery({size:9999}).then((res) => {
this.realAlarmStyleData.listData = res;
})
},10000)
},
......
......@@ -26,17 +26,11 @@
<br>
<el-form-item label="轨迹时间点" style="display: inline-block;">
<el-date-picker
<el-time-picker
v-model="trajectoryTimePoint"
type="datetime"
@change="trajectoryTimePointFn"
:placeholder="trajectoryTimePointPlaceholder"
:picker-options="{
disabledDate (time) {
return time.getTime() >= query.eTime || time.getTime() < query.bTime//选当前时间之前的时间
}
}"
></el-date-picker>
:placeholder="trajectoryTimePointPlaceholder">
</el-time-picker>
</el-form-item>
<el-button style="display: inline-block;" @click="pauseResume()">{{pauseResumeBoolean ? '暂停' : '继续'}}</el-button>
......@@ -339,20 +333,22 @@ export default {
},
//接收当前进度时间
progressTimeFn(time){
this.trajectoryTimePointPlaceholder = time;
let text1 = time.split(' ')[1];
this.trajectoryTimePointPlaceholder = text1;
},
//轨迹时间点跳转
trajectoryTimePointFn(){
if(this.query.number == '' || !this.query.bTime || !this.query.eTime){
return;
}else{
if(!this.trajectoryTimePoint){
return
}else{
this.$refs.mars3dViewerMapMethod.changeTime(this.trajectoryTimePoint);
this.trajectoryTimePoint = '';
}
}
console.log(this.trajectoryTimePoint);
// if(this.query.number == '' || !this.query.bTime || !this.query.eTime){
// return;
// }else{
// if(!this.trajectoryTimePoint){
// return
// }else{
// this.$refs.mars3dViewerMapMethod.changeTime(this.trajectoryTimePoint);
// this.trajectoryTimePoint = '';
// }
// }
},
// 地图构造完成回调
onMapload(map) {
......
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