lixiaobang
/
TransFlow
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bug修改

This commit is contained in:
qiudan 2023-11-06 22:20:40 +08:00
parent 53b7083f9a
commit 0bf3950dac
8 changed files with 252 additions and 218 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/chart/barChart.vue
View File

@ -1,14 +1,22 @@
<template> <template>
<div style="width: 100%;margin-top: 5px;"> <div style="width: 100%; margin-top: 5px">
<div class="tableTitle"> <div class="tableTitle">
<div> <div>
<span <span
style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;" style="
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #3297ff;
display: inline-block;
vertical-align: middle;
margin-right: 8px;
"
></span> ></span>
<span style="font-size:18px;">{{ componentName + '-' + chartName + '-' + '柱状图'+'-'+status }}</span> <span style="font-size: 18px">{{ componentName + '-' + chartName + '-' + '柱状图' + '-' + status }}</span>
</div> </div>
</div> </div>
<div id="barChart" ref="barChart" style="width:705px;height:300px;"></div> <div id="barChart" ref="barChart" style="width: 705px; height: 300px"></div>
</div> </div>
</template> </template>
@ -40,17 +48,16 @@ export default {
} }
}, },
data() { data() {
return { return {};
};
}, },
created() {}, created() {},
methods: { methods: {
drawBar(newVal) { drawBar(newVal) {
if (newVal) { if (newVal && newVal.type_data && newVal.type_data.length > 0) {
var xData = newVal.type_data.map(ele => { var xData = newVal.type_data.map((ele) => {
return ele.name; return ele.name;
}); });
var yData = newVal.type_data.map(ele => { var yData = newVal.type_data.map((ele) => {
return ele.quantity; return ele.quantity;
}); });
} }
@ -134,10 +141,7 @@ export default {
// }) // })
} }
}, },
mounted() { mounted() {},
}, watch: {}
watch: {
}
}; };
</script> </script>

24
src/components/chart/lineChart.vue
View File

@ -209,11 +209,13 @@ export default {
var mapN = []; var mapN = [];
if (arr && arr.length > 0) { if (arr && arr.length > 0) {
for (var t = 0; t < arr.length; t++) { for (var t = 0; t < arr.length; t++) {
if (arr[t] && arr[t].length > 0) {
for (var i = 0; i < arr[t].length; i++) { for (var i = 0; i < arr[t].length; i++) {
mapN.push(arr[t][i]); mapN.push(arr[t][i]);
} }
} }
} }
}
var lineArr = []; var lineArr = [];
if (newVal[0].type_data != undefined) { if (newVal[0].type_data != undefined) {
@ -226,18 +228,24 @@ export default {
}); });
}); });
} }
mapN.forEach((ele) => { mapN.forEach((ele, index) => {
if (ele.name == '机动车') { if (lineArr[index] && lineArr[index].data) {
lineArr[0].data.push(ele.quantity); lineArr[index].data.push(ele.quantity);
} else if (ele.name == '非机动车') {
lineArr[1].data.push(ele.quantity);
} else {
lineArr[2].data.push(ele.quantity);
} }
// if (ele.name == '机动车') {
// lineArr[0].data.push(ele.quantity);
// } else if (ele.name == '非机动车') {
// lineArr[1].data.push(ele.quantity);
// } else {
// lineArr[2].data.push(ele.quantity);
// }
}); });
if (lineArr && lineArr.length > 0) {
for (let j = 0; j < lineArr.length; j++) { for (let j = 0; j < lineArr.length; j++) {
series.push(lineArr[j]); series.push(lineArr[j]);
} }
}
// 总和数量 // 总和数量
let mapNR1 = []; let mapNR1 = [];
newVal.map(function (ele) { newVal.map(function (ele) {
@ -251,7 +259,7 @@ export default {
series[0].data = mapNR1; series[0].data = mapNR1;
} else if (title === '速度') { } else if (title === '速度') {
let unit = 'km/h'; let unit = 'km/h';
if (this.originalDataArr.length > 0) { if (this.originalDataArr && this.originalDataArr.length > 0) {
if (this.originalDataArr[0].speed >= 0) { if (this.originalDataArr[0].speed >= 0) {
unit = 'km/h'; unit = 'km/h';
} else { } else {

2
src/components/chart/pieChart.vue
View File

@ -52,7 +52,7 @@ export default {
created() {}, created() {},
methods: { methods: {
drawPie(newVal) { drawPie(newVal) {
if (newVal) { if (newVal&&newVal.type_data&&newVal.type_data.length>0) {
var legend = newVal.type_data.map((ele) => { var legend = newVal.type_data.map((ele) => {
return ele.name; return ele.name;
}); });

77
src/components/sensorFusion/echartsLine.vue
View File

@ -50,7 +50,8 @@ export default {
}, //表格数据 }, //表格数据
seriesList: [], //类型数组 seriesList: [], //类型数组
typeData: [], typeData: [],
title: '' title: '',
num: 1
}; };
}, },
created() {}, created() {},
@ -58,12 +59,18 @@ export default {
methods: { methods: {
//传值对应字段返回相应字段数组 //传值对应字段返回相应字段数组
extractKeyValues(arr, key) { extractKeyValues(arr, key) {
return arr.map((item) => item[key]); return arr.map((item) => {
if (key == 'speed' && item[key]) {
return Math.abs(item[key]);
}
return item[key];
});
}, },
//数据判断处理 //数据判断处理
dataProcessing(val) { dataProcessing(val) {
if (val.length > 10) { if (val.length > 10) {
val = val.slice(-10); val = val.slice(-10);
// this.typeData = this.typeData.slice(-10);
} }
if (val != null) { if (val != null) {
if (this.timeMode == '实时触发') { if (this.timeMode == '实时触发') {
@ -82,12 +89,18 @@ export default {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed'); this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') { } else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time').reverse();
let seriesArr = this.extractKeyValues(val, 'type_data'); let seriesArr = this.extractKeyValues(val, 'type_data');
const transformedData = []; const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) { for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; //quantity const item = seriesArr[0][i]; //quantity
const valueList = seriesArr.map((arr) => arr[i].value); const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
}
return t;
});
transformedData.push({ transformedData.push({
name: item.name, name: item.name,
value: valueList value: valueList
@ -124,15 +137,21 @@ export default {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed'); this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') { } else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time').reverse();
let seriesArr = this.extractKeyValues(val, 'type_data'); let seriesArr = this.extractKeyValues(val, 'type_data');
console.log('seriesArr-固定时刻',seriesArr) // console.log('seriesArr-固定时刻', seriesArr);
const transformedData = []; const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) { for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; const item = seriesArr[0][i];
//固定间隔主题-类型组件type_data取value字段和固定时刻不一样，固定时刻取quantity字段 //固定间隔主题-类型组件type_data取value字段和历史数据接口不一样，历史数据接口取quantity字段
// const valueList = seriesArr.map((arr) => arr[i].quantity); // const valueList = seriesArr.map((arr) => arr[i].quantity);
const valueList = seriesArr.map((arr) => arr[i].value); const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
}
return t;
});
transformedData.push({ transformedData.push({
name: item.name, name: item.name,
value: valueList value: valueList
@ -170,20 +189,28 @@ export default {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed'); this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') { } else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time').reverse();
let seriesArr = this.extractKeyValues(val, 'type_data'); let seriesArr = this.extractKeyValues(val, 'type_data');
// console.log('seriesArr-固定间隔',seriesArr) // console.log('固定间隔-类型-seriesArr-', seriesArr);
// console.log('固定间隔-类型-xData-', this.chartData.xData);
const transformedData = []; const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) { for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; const item = seriesArr[0][i];
//固定间隔主题-类型组件type_data取value字段和固定时刻不一样，固定时刻取quantity字段 //固定间隔主题-类型组件type_data取value字段和历史数据接口不一样，历史数据接口取quantity字段
const valueList = seriesArr.map((arr) => arr[i].value); // const valueList = seriesArr.map((arr) => arr[i].value);
const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
}
return t;
});
transformedData.push({ transformedData.push({
name: item.name, name: item.name,
value: valueList value: valueList
}); });
} }
// console.log('transformedData-2',transformedData) // console.log('固定间隔-类型-transformedData-1', transformedData);
const totalCountList = transformedData[0].value.map((_, i) => { const totalCountList = transformedData[0].value.map((_, i) => {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0); return transformedData.reduce((sum, curr) => sum + curr.value[i], 0);
}); });
@ -192,6 +219,7 @@ export default {
value: totalCountList value: totalCountList
}); });
this.seriesList = transformedData; this.seriesList = transformedData;
// console.log('固定间隔-类型-transformedData-2', transformedData);
} else if (this.componentType == '延误') { } else if (this.componentType == '延误') {
this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'ave_delay'); this.chartData.yData = this.extractKeyValues(val, 'ave_delay');
@ -249,9 +277,22 @@ export default {
// slicedData = data; // 如果数据不足 10 条，则保留全部数据 // slicedData = data; // 如果数据不足 10 条，则保留全部数据
// } // }
if (this.componentType == '类型') { if (this.componentType == '类型') {
console.log('类型-dataList',this.dataList) // console.log('类型-dataList', this.dataList);
if (this.dataList.length > 0 && this.num == 1) {
// this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time });
this.dataList.sort((a, b) => {
const timeA = new Date(a.time);
const timeB = new Date(b.time);
return timeA - timeB;
});
for (const item of this.dataList) {
this.typeData.push({ type_data: item.type_data, time: item.time });
}
this.num++;
} else {
this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time }); this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time });
console.log('类型-typeData',this.typeData) }
// console.log('类型-typeData', this.typeData);
this.dataProcessing(this.typeData); this.dataProcessing(this.typeData);
} else { } else {
this.dataProcessing(this.dataList); this.dataProcessing(this.dataList);
@ -266,7 +307,7 @@ export default {
var seriesList = []; var seriesList = [];
var color = ['#0CD2E6', '#3751E6', '#FFC722', 'rgb(255,115,38)']; var color = ['#0CD2E6', '#3751E6', '#FFC722', 'rgb(255,115,38)'];
if (this.componentType == '类型') { if (this.componentType == '类型') {
console.log('类型-seriesList',this.seriesList) // console.log('类型-seriesList', this.seriesList);
for (let i = 0; i < this.seriesList.length; i++) { for (let i = 0; i < this.seriesList.length; i++) {
seriesList.push({ seriesList.push({
name: this.seriesList[i].name, name: this.seriesList[i].name,
@ -465,8 +506,8 @@ export default {
}, },
echartsRef: { echartsRef: {
handler: function (oldValues, newValues) { handler: function (oldValues, newValues) {
console.log('old', oldValues); // console.log('old', oldValues);
console.log('newV', newValues); // console.log('newV', newValues);
let that = this; let that = this;
setTimeout(() => { setTimeout(() => {
that.$nextTick(() => { that.$nextTick(() => {

51
src/components/target/typeChart.vue
View File

@ -17,7 +17,7 @@
<span style="font-size: 30px; font-weight: bold">{{ <span style="font-size: 30px; font-weight: bold">{{
n.quantity || n.quantity === 0 ? n.quantity : ' - ' n.quantity || n.quantity === 0 ? n.quantity : ' - '
}}</span> }}</span>
<span style="font-size: 15px;" v-if="n.quantity || n.quantity === 0 "> 个</span> <span style="font-size: 15px" v-if="n.quantity || n.quantity === 0"> 个</span>
<!-- <span v-if="n.name=='速度'">km/h</span> --> <!-- <span v-if="n.name=='速度'">km/h</span> -->
</div> </div>
<div> <div>
@ -28,7 +28,7 @@
</el-card> </el-card>
</div> </div>
</div> </div>
<div v-else-if="newDataArr && newDataArr.length != 0 && newDataArr != undefined"> <div v-else-if="newDataArr && newDataArr.length > 0">
<div v-if="title == '类型'" style="display: flex; flex-wrap: wrap"> <div v-if="title == '类型'" style="display: flex; flex-wrap: wrap">
<el-card <el-card
v-for="(n, i) in newDataArr[0].type_data" v-for="(n, i) in newDataArr[0].type_data"
@ -41,7 +41,7 @@
<span style="font-size: 30px; font-weight: bold">{{ <span style="font-size: 30px; font-weight: bold">{{
n.quantity || n.quantity === 0 ? n.quantity : ' - ' n.quantity || n.quantity === 0 ? n.quantity : ' - '
}}</span> }}</span>
<span style="font-size: 15px;" v-if="n.quantity || n.quantity === 0 "> 个</span> <span style="font-size: 15px" v-if="n.quantity || n.quantity === 0"> 个</span>
<!-- <span v-if="n.name=='速度'">km/h</span> --> <!-- <span v-if="n.name=='速度'">km/h</span> -->
</div> </div>
<div> <div>
@ -59,12 +59,9 @@
<span style="font-size: 30px; font-weight: bold"> <span style="font-size: 30px; font-weight: bold">
{{ getTotal(cycleAccumulateDataArr) }} {{ getTotal(cycleAccumulateDataArr) }}
</span> </span>
<span style="font-size: 15px;">个</span> <span style="font-size: 15px">个</span>
</div> </div>
<div <div style="font-size: 30px; font-weight: bold" v-if="title == '速度' && dataArr && dataArr.length > 0">
style="font-size: 30px; font-weight: bold"
v-if="title == '速度' && dataArr && dataArr.length != 0 && dataArr != undefined"
>
<span style="font-size: 15px">速度</span><br /> <span style="font-size: 15px">速度</span><br />
<!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> --> <!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> -->
@ -90,12 +87,8 @@
</span> </span>
</span> </span>
</div> </div>
<div <div style="font-size: 30px; font-weight: bold" v-if="title == '流量' && dataArr && dataArr.length > 0">
style="font-size: 30px; font-weight: bold" <span style="font-size: 15px">流量</span><br />
v-if="title == '流量' && dataArr && dataArr.length != 0 && dataArr != undefined"
>
<span style="font-size: 15px">流量</span
><br />
<span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '出流'">{{ <span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '出流'">{{
cycleAccumulateDataArr[0].out_flow || cycleAccumulateDataArr[0].out_flow === 0 cycleAccumulateDataArr[0].out_flow || cycleAccumulateDataArr[0].out_flow === 0
? cycleAccumulateDataArr[0].out_flow ? cycleAccumulateDataArr[0].out_flow
@ -149,18 +142,15 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else-if="newDataArr && newDataArr.length != 0 && newDataArr != undefined"> <div v-else-if="newDataArr && newDataArr.length > 0">
<div v-if="title == '类型'"> <div v-if="title == '类型'">
<span style="font-size: 15px">类型数量总和</span><br /> <span style="font-size: 15px">类型数量总和</span><br />
<span style="font-size: 30px; font-weight: bold"> <span style="font-size: 30px; font-weight: bold">
{{ getTotal(newDataArr) }} {{ getTotal(newDataArr) }}
</span> </span>
<span style="font-size: 15px;">个</span> <span style="font-size: 15px">个</span>
</div> </div>
<div <div style="font-size: 30px; font-weight: bold" v-if="title == '速度' && dataArr && dataArr.length > 0">
style="font-size: 30px; font-weight: bold"
v-if="title == '速度' && dataArr && dataArr.length != 0 && dataArr != undefined"
>
<span style="font-size: 15px">速度</span><br /> <span style="font-size: 15px">速度</span><br />
<!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> --> <!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> -->
@ -176,20 +166,13 @@
</span> </span>
</span> </span>
</div> </div>
<div <div style="font-size: 30px; font-weight: bold" v-if="title == '流量' && dataArr && dataArr.length > 0">
style="font-size: 30px; font-weight: bold"
v-if="title == '流量' && dataArr && dataArr.length != 0 && dataArr != undefined"
>
<span style="font-size: 15px">流量</span><br /> <span style="font-size: 15px">流量</span><br />
<span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '出流'">{{ <span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '出流'">{{
newDataArr[0].out_flow || newDataArr[0].out_flow === 0 newDataArr[0].out_flow || newDataArr[0].out_flow === 0 ? newDataArr[0].out_flow : ' - '
? newDataArr[0].out_flow
: ' - '
}}</span> }}</span>
<span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '入流'">{{ <span style="font-size: 30px; font-weight: bold" v-if="itemData.flowType && itemData.flowType == '入流'">{{
newDataArr[0].in_flow || newDataArr[0].in_flow === 0 newDataArr[0].in_flow || newDataArr[0].in_flow === 0 ? newDataArr[0].in_flow : ' - '
? newDataArr[0].in_flow
: ' - '
}}</span> }}</span>
<span style="font-size: 20px; font-weight: 200">辆</span> <span style="font-size: 20px; font-weight: 200">辆</span>
</div> </div>
@ -236,7 +219,7 @@
</el-card> </el-card>
</div> </div>
<div v-show="echartArr.includes('表格')"> <div v-show="echartArr.includes('表格')">
<div class="tableTitle" v-if="newDataArr && newDataArr.length != 0"> <div class="tableTitle" v-if="newDataArr && newDataArr.length > 0">
<div> <div>
<span <span
style=" style="
@ -417,10 +400,16 @@ export default {
}, },
getTotal(dataArr) { getTotal(dataArr) {
if (this.title == '类型') { if (this.title == '类型') {
if (dataArr && dataArr.length > 0) {
if (dataArr[0].type_data && dataArr[0].type_data.length > 0) {
return dataArr[0].type_data.reduce(function (prev, cur) { return dataArr[0].type_data.reduce(function (prev, cur) {
return cur.quantity + prev; return cur.quantity + prev;
}, 0); }, 0);
} }
return 0
}
return 0
}
}, },
getNewQueue(val) { getNewQueue(val) {
if (val[0].n_queue) { if (val[0].n_queue) {

18
src/views/bounced/dataBoard.vue
View File

@ -253,7 +253,7 @@ export default {
getRef(data, timeMode) { getRef(data, timeMode) {
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
let refItem = data[i]; let refItem = data[i];
if (data.length != 0 && refItem.dataArr != undefined && refItem.dataArr.length != 0) { if (data.length != 0 && refItem.dataArr && refItem.dataArr.length > 0) {
if (refItem.echartArr.includes('时间曲线图')) { if (refItem.echartArr.includes('时间曲线图')) {
refItem.$refs.lineChartRef.drawLine(refItem.dataArr, refItem.componentName.split('_')[0], timeMode); refItem.$refs.lineChartRef.drawLine(refItem.dataArr, refItem.componentName.split('_')[0], timeMode);
} }
@ -277,6 +277,7 @@ export default {
if ( if (
refItem.componentName.includes('OD') && refItem.componentName.includes('OD') &&
refItem.$refs.ODChartRef != undefined && refItem.$refs.ODChartRef != undefined &&
refItem.dataArr[0].ob_data &&
refItem.dataArr[0].ob_data.length != 0 refItem.dataArr[0].ob_data.length != 0
) { ) {
refItem.$refs.ODChartRef.drawThermalChart(refItem.dataArr[0].ob_data, refItem.startEndData); refItem.$refs.ODChartRef.drawThermalChart(refItem.dataArr[0].ob_data, refItem.startEndData);
@ -530,6 +531,7 @@ export default {
if ( if (
itemTypeChart.componentName.includes('OD') && itemTypeChart.componentName.includes('OD') &&
itemTypeChart.$refs.ODChartRef != undefined && itemTypeChart.$refs.ODChartRef != undefined &&
itemTypeChart.dataArr[0].ob_data &&
itemTypeChart.dataArr[0].ob_data.length != 0 itemTypeChart.dataArr[0].ob_data.length != 0
) { ) {
itemTypeChart.$refs.ODChartRef.drawThermalChart( itemTypeChart.$refs.ODChartRef.drawThermalChart(
@ -552,7 +554,7 @@ export default {
cycleTimeData: { cycleTimeData: {
handler(newVal) { handler(newVal) {
// 监听到打印固定时刻数据 // 监听到打印固定时刻数据
// //console.log(newVal, '固定时刻数据'); // console.log(newVal, '固定时刻数据');
if (newVal != undefined && newVal.length != 0 && this.sectionData) { if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var thatN = this; var thatN = this;
@ -624,6 +626,7 @@ export default {
if ( if (
itemTypeChartRef1.componentName.includes('OD') && itemTypeChartRef1.componentName.includes('OD') &&
itemTypeChartRef1.$refs.ODChartRef != undefined && itemTypeChartRef1.$refs.ODChartRef != undefined &&
itemTypeChartRef1.dataArr[0].ob_data &&
itemTypeChartRef1.dataArr[0].ob_data.length != 0 itemTypeChartRef1.dataArr[0].ob_data.length != 0
) { ) {
itemTypeChartRef1.$refs.ODChartRef.drawThermalChart( itemTypeChartRef1.$refs.ODChartRef.drawThermalChart(
@ -766,6 +769,17 @@ export default {
) { ) {
itemTypeChartRef2.$refs.avgChartRef.drawBar(itemTypeChartRef2.dataArr[0]); itemTypeChartRef2.$refs.avgChartRef.drawBar(itemTypeChartRef2.dataArr[0]);
} }
if (
itemTypeChartRef2.componentName.includes('OD') &&
itemTypeChartRef2.$refs.ODChartRef != undefined &&
itemTypeChartRef2.dataArr[0].ob_data &&
itemTypeChartRef2.dataArr[0].ob_data.length != 0
) {
itemTypeChartRef2.$refs.ODChartRef.drawThermalChart(
itemTypeChartRef2.dataArr[0].ob_data,
itemTypeChartRef2.startEndData
);
}
} }
} }
} }

25
src/views/index.vue
View File

@ -1090,7 +1090,7 @@ export default {
//获取离线视频数据 //获取离线视频数据
'VideoStatusData', 'VideoStatusData',
'TargetAnalysisStatusData', 'TargetAnalysisStatusData',
'TrafficAnalysisStatusData', 'TrafficAnalysisStatusData'
//目标数量 //目标数量
// 'simulator_target-' + this.$route.query.id // 'simulator_target-' + this.$route.query.id
]; ];
@ -1118,7 +1118,7 @@ export default {
'img5', 'img5',
'img6', 'img6',
'img7', 'img7',
'Contorl_server', 'Contorl_server'
//目标数量 //目标数量
// 'simulator_target-' + this.$route.query.id // 'simulator_target-' + this.$route.query.id
]; ];
@ -1477,10 +1477,16 @@ export default {
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// console.log('实时触发trigger-', msgN);
// //console.log("trigger_msgN",msgN) // //console.log("trigger_msgN",msgN)
// msgN.forEach(item => { // msgN.forEach(item => {
// //console.log("item.name",item.name) // //console.log("item.name",item.name)
// }) // })
// for (const item of msgN) {
// if (item.name == 'gate3触发') {
// console.log('实时触发trigger-', item);
// }
// }
this.triggerListData = msgN; this.triggerListData = msgN;
} catch (error) {} } catch (error) {}
break; break;
@ -1516,24 +1522,23 @@ export default {
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
//console.log("cycle_statistics-固定间隔1",temp) // console.log("cycle_statistics-固定间隔",temp)
// //console.log("cycle_statistics-固定间隔2",msgN)
this.cycleStatisticsData = msgN; this.cycleStatisticsData = msgN;
} catch (error) {} } catch (error) {}
break; break;
case 'cycle_accumulate-' + this.$route.query.id: case 'cycle_accumulate-' + this.$route.query.id:
try { try {
//周期统计实时累计数据主题 //周期统计实时累计数据主题
// //console.log("trigger_msgN",message) // console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('cycle_accumulate-周期统计实时累计数据主题', msgN); // console.log('cycle_accumulate-周期统计实时累计数据主题', msgN);
for (const t of msgN) { // for (const t of msgN) {
console.log(JSON.stringify(t.type_data)) // console.log(JSON.stringify(t.type_data))
} // }
this.cycleAccumulateData = msgN; this.cycleAccumulateData = msgN;
} catch (error) {} } catch (error) {}
break; break;
@ -1917,7 +1922,7 @@ export default {
this.startFigureName = index; this.startFigureName = index;
//console.log('图形位置', indexNew); //console.log('图形位置', indexNew);
// numberNew 1-画布区 2-模拟区 // numberNew 1-画布区 2-模拟区
this.numberNew = numberNew this.numberNew = numberNew;
this.dialogFormVisible = true; this.dialogFormVisible = true;
this.switchValue = 0; this.switchValue = 0;
this.typeCheckList = [ this.typeCheckList = [

159
src/views/sensorFusion/index.vue
View File

@ -128,7 +128,10 @@
i.triggerData.type_data[0].quantity i.triggerData.type_data[0].quantity
}}</span> --> }}</span> -->
<!-- <span v-else>0</span> --> <!-- <span v-else>0</span> -->
<span>{{ getTotal(i.triggerData.type_data, 'quantity') }}</span> <span v-if="i.triggerData && i.triggerData.type_data">{{
getTotal(i.triggerData.type_data, 'quantity', 'value')
}}</span>
<span v-else>-</span>
</span> </span>
<span <span
@ -251,24 +254,25 @@
</span> </span>
<span <span
style="color: rgb(71, 161, 255); font-size: 23px" style="color: rgb(71, 161, 255); font-size: 23px"
v-if="i.componentType == '类型' && i.triggerData == null" v-if="i.componentType == '类型'"
>
<span
v-if="
!i.triggerData &&
i.cycleTimeData &&
i.cycleTimeData.length > 0 &&
i.cycleTimeData[0].type_data
"
> >
<!-- {{ <!-- {{
i.cycleTimeData[0].type_data[0].quantity + i.cycleTimeData[0].type_data[0].quantity +
i.cycleTimeData[0].type_data[1].quantity + i.cycleTimeData[0].type_data[1].quantity +
i.cycleTimeData[0].type_data[2].quantity i.cycleTimeData[0].type_data[2].quantity
}} --> }} -->
{{ getTotal(i.cycleTimeData[0].type_data, 'quantity') }} {{ getTotal(i.cycleTimeData[0].type_data, 'quantity', 'value') }}
</span> </span>
<span <span v-else-if="i.triggerData && i.triggerData.type_data">
style="color: rgb(71, 161, 255); font-size: 23px" {{ getTotal(i.triggerData.type_data, 'quantity', 'value') }}
v-if="
i.componentType == '类型' &&
i.triggerData != null &&
i.triggerData.type_data[0].quantity != undefined
"
>
{{ getTotal(i.triggerData.type_data, 'quantity') }}
<!-- <span <!-- <span
v-if=" v-if="
!Number.isNaN( !Number.isNaN(
@ -287,31 +291,7 @@
> >
<span v-else>0</span> --> <span v-else>0</span> -->
</span> </span>
<span <span v-else>-</span>
style="color: rgb(71, 161, 255); font-size: 23px"
v-else-if="
i.componentType == '类型' &&
i.triggerData != null &&
i.triggerData.type_data[0].quantity == undefined
"
>{{ getTotal(i.triggerData.type_data, 'value') }}
<!-- <span
v-if="
!Number.isNaN(
Number(
i.triggerData.type_data[0].value +
i.triggerData.type_data[1].value +
i.triggerData.type_data[2].value
)
)
"
>{{
i.triggerData.type_data[0].value +
i.triggerData.type_data[1].value +
i.triggerData.type_data[2].value
}}</span
>
<span v-else>0</span> -->
</span> </span>
<span <span
style="color: rgb(71, 161, 255); font-size: 23px" style="color: rgb(71, 161, 255); font-size: 23px"
@ -355,9 +335,7 @@
" "
> >
{{ {{
i.triggerData.speed > 0 || i.triggerData.speed === 0 i.triggerData.speed > 0 || i.triggerData.speed === 0 ? 'km/h' : 'pix/s'
? 'km/h'
: 'pix/s'
}} }}
</span> </span>
</span> </span>
@ -379,12 +357,7 @@
</div> </div>
</div> </div>
<div v-if="i.timeMode == '固定间隔'"> <div v-if="i.timeMode == '固定间隔'">
<el-empty <div class="cardContent" v-if="i.cycleStatisticsData && i.cycleStatisticsData.length > 0">
:image-size="20"
description="暂无数据"
v-if="i.cycleStatisticsData == null || i.cycleStatisticsData.length == 0"
></el-empty>
<div class="cardContent" v-else>
<div class="count"> <div class="count">
<span <span
style="color: rgb(71, 161, 255); font-size: 23px" style="color: rgb(71, 161, 255); font-size: 23px"
@ -469,21 +442,30 @@
</span> </span>
<span <span
style="color: rgb(71, 161, 255); font-size: 23px" style="color: rgb(71, 161, 255); font-size: 23px"
v-if="i.componentType == '类型' && i.triggerData == null" v-if="i.componentType == '类型'"
> >
<span
v-if="
!i.triggerData && i.cycleStatisticsData && i.cycleStatisticsData.length > 0
"
>
<!-- {{JSON.stringify(i.cycleStatisticsData)}} -->
<!-- {{ <!-- {{
i.cycleStatisticsData[0].type_data[0].quantity + i.cycleStatisticsData[0].type_data[0].quantity +
i.cycleStatisticsData[0].type_data[1].quantity + i.cycleStatisticsData[0].type_data[1].quantity +
i.cycleStatisticsData[0].type_data[2].quantity i.cycleStatisticsData[0].type_data[2].quantity
}} --> }} -->
{{ getTotal(i.cycleStatisticsData[0].type_data, 'quantity') }} {{
i.cycleStatisticsData[0].type_data &&
i.cycleStatisticsData[0].type_data.length > 0
? getTotal(i.cycleStatisticsData[0].type_data, 'quantity', 'value')
: '-'
}}
</span> </span>
<span <span
style="color: rgb(71, 161, 255); font-size: 23px"
v-else-if=" v-else-if="
i.componentType == '类型' && i.triggerData &&
i.triggerData != null && i.triggerData.type_data
i.triggerData.type_data[0].quantity != undefined
" "
> >
<!-- {{i.triggerData[0].quantity + i.triggerData[1].quantity + i.triggerData[2].quantity}} --> <!-- {{i.triggerData[0].quantity + i.triggerData[1].quantity + i.triggerData[2].quantity}} -->
@ -504,35 +486,9 @@
}}</span }}</span
> >
<span v-else>0</span> --> <span v-else>0</span> -->
{{ getTotal(i.triggerData.type_data, 'quantity') }} {{ getTotal(i.triggerData.type_data, 'quantity', 'value') }}
</span> </span>
<span <span v-else>-</span>
style="color: rgb(71, 161, 255); font-size: 23px"
v-else-if="
i.componentType == '类型' &&
i.triggerData != null &&
i.triggerData.type_data[0].quantity == undefined
"
>
<!-- {{i.triggerData[0].quantity + i.triggerData[1].quantity + i.triggerData[2].quantity}} -->
<!-- <span
v-if="
!Number.isNaN(
Number(
i.triggerData.type_data[0].value +
i.triggerData.type_data[1].value +
i.triggerData.type_data[2].value
)
)
"
>{{
i.triggerData.type_data[0].value +
i.triggerData.type_data[1].value +
i.triggerData.type_data[2].value
}}</span
>
<span v-else>0</span> -->
{{ getTotal(i.triggerData.type_data, 'value') }}
</span> </span>
<span <span
style="color: rgb(71, 161, 255); font-size: 23px" style="color: rgb(71, 161, 255); font-size: 23px"
@ -597,12 +553,14 @@
<span v-if="i.triggerData == null"> <span v-if="i.triggerData == null">
<span <span
v-if=" v-if="
(i.cycleStatisticsData[0].speed && i.cycleStatisticsData[0].speed != -1) || (i.cycleStatisticsData[0].speed &&
i.cycleTimeData[0].speed === 0 i.cycleStatisticsData[0].speed != -1) ||
i.cycleStatisticsData[0].speed === 0
" "
> >
{{ {{
i.cycleStatisticsData[0].speed > 0 || i.cycleStatisticsData[0].speed === 0 i.cycleStatisticsData[0].speed > 0 ||
i.cycleStatisticsData[0].speed === 0
? 'km/h' ? 'km/h'
: 'pix/s' : 'pix/s'
}} }}
@ -616,9 +574,7 @@
" "
> >
{{ {{
i.triggerData.speed > 0 || i.triggerData.speed === 0 i.triggerData.speed > 0 || i.triggerData.speed === 0 ? 'km/h' : 'pix/s'
? 'km/h'
: 'pix/s'
}} }}
</span> </span>
</span> </span>
@ -638,6 +594,7 @@
<span style="text-align: center" v-else>{{ i.triggerData.time }}</span> <span style="text-align: center" v-else>{{ i.triggerData.time }}</span>
</div> </div>
</div> </div>
<el-empty :image-size="20" description="暂无数据" v-else></el-empty>
</div> </div>
</el-card> </el-card>
</div> </div>
@ -1853,16 +1810,28 @@ export default {
}, },
methods: { methods: {
//类型数据累计 //类型数据累计
getTotal(arr, field) { getTotal(arr, field, field2) {
const total = arr.reduce((accumulator, item) => { let total = 0;
if (arr && arr.length > 0) {
total = arr.reduce((accumulator, item) => {
let t = 0;
if (item[field] || item[field] === 0) { if (item[field] || item[field] === 0) {
const fieldValue = parseFloat(item[field]); t = item[field];
}
if (item[field2] || item[field2] === 0) {
t = item[field2];
}
if (t || t === 0) {
const fieldValue = parseFloat(t);
if (!isNaN(fieldValue)) { if (!isNaN(fieldValue)) {
return accumulator + fieldValue; return accumulator + fieldValue;
} }
} }
return accumulator; // 如果无效则不累加 return accumulator; // 如果无效则不累加
}, 0); }, 0);
}
return total; return total;
}, },
//获取视频列表接口 //获取视频列表接口
@ -1881,9 +1850,9 @@ export default {
this.addSelectOptionField(this.intersectionList); this.addSelectOptionField(this.intersectionList);
// this.addTriggerDataField(this.intersectionList); // this.addTriggerDataField(this.intersectionList);
//mqtt订阅 //mqtt订阅
this.$nextTick(() => { // this.$nextTick(() => {
this.getMqtt(); this.getMqtt();
}); // });
//console.log(this.intersectionList, 'this.intersectionList'); //console.log(this.intersectionList, 'this.intersectionList');
//开发路口默认展开第一个 //开发路口默认展开第一个
@ -2926,7 +2895,7 @@ export default {
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// //console.log(msgN,'msgN'); // console.log('实时触发trigger-',msgN);
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
const locations = this.findLocationById(this.intersectionList, msgN[j].component_id); const locations = this.findLocationById(this.intersectionList, msgN[j].component_id);
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
@ -3066,6 +3035,7 @@ export default {
originalSpeed: msgN[j].speed originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == '类型') { } else if (msgN[j].component_type == '类型') {
//console.log('实时触发-类型-', msgN[j].type_data);
let map = { let map = {
type_data: msgN[j].type_data, type_data: msgN[j].type_data,
time: msgN[j].time time: msgN[j].time
@ -3213,7 +3183,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('固定时刻', msgN); // console.log('固定时刻', msgN);
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
const locations = this.findLocationById(this.intersectionList, msgN[j].component_id); const locations = this.findLocationById(this.intersectionList, msgN[j].component_id);
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
@ -3413,6 +3383,7 @@ export default {
); );
}); });
} else if (msgN[j].component_type == '速度') { } else if (msgN[j].component_type == '速度') {
// console.log('固定间隔-速度', msgN[j].speed)
//卡片区 //卡片区
let map = { let map = {
speed: msgN[j].speed, speed: msgN[j].speed,
@ -3450,6 +3421,8 @@ export default {
); );
}); });
} else if (msgN[j].component_type == '类型') { } else if (msgN[j].component_type == '类型') {
// console.log('固定间隔-类型', JSON.stringify(msgN[j].type_data))
// console.log('固定间隔-类型', JSON.stringify(msgN[j].time))
//卡片区 //卡片区
let map = { let map = {
type_data: msgN[j].type_data, type_data: msgN[j].type_data,