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

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

@ -1,14 +1,22 @@
<template>
<div style="width: 100%;margin-top: 5px;">
<div style="width: 100%; margin-top: 5px">
<div class="tableTitle">
<div>
<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 style="font-size:18px;">{{ componentName + '-' + chartName + '-' + '柱状图'+'-'+status }}</span>
<span style="font-size: 18px">{{ componentName + '-' + chartName + '-' + '柱状图' + '-' + status }}</span>
</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>
</template>
@ -40,20 +48,19 @@ export default {
}
},
data() {
return {
};
return {};
},
created() {},
methods: {
drawBar(newVal) {
if (newVal) {
var xData = newVal.type_data.map(ele => {
return ele.name;
});
var yData = newVal.type_data.map(ele => {
return ele.quantity;
});
}
if (newVal && newVal.type_data && newVal.type_data.length > 0) {
var xData = newVal.type_data.map((ele) => {
return ele.name;
});
var yData = newVal.type_data.map((ele) => {
return ele.quantity;
});
}
let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart);
if (myChart == null) {
myChart = this.$echarts.init(this.$refs.barChart);
@ -120,12 +127,12 @@ export default {
barWidth: 20,
itemStyle: { barBorderRadius: [5, 5, 0, 0] },
name: '时间',
data:yData
data: yData
}
]
};
myChart.setOption(option);
window.addEventListener('resize', function() {
window.addEventListener('resize', function () {
myChart.resize();
});
// this.$nextTick(() => {
@ -134,10 +141,7 @@ export default {
// })
}
},
mounted() {
},
watch: {
}
mounted() {},
watch: {}
};
</script>

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

@ -209,8 +209,10 @@ export default {
var mapN = [];
if (arr && arr.length > 0) {
for (var t = 0; t < arr.length; t++) {
for (var i = 0; i < arr[t].length; i++) {
mapN.push(arr[t][i]);
if (arr[t] && arr[t].length > 0) {
for (var i = 0; i < arr[t].length; i++) {
mapN.push(arr[t][i]);
}
}
}
}
@ -226,18 +228,24 @@ export default {
});
});
}
mapN.forEach((ele) => {
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);
mapN.forEach((ele, index) => {
if (lineArr[index] && lineArr[index].data) {
lineArr[index].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);
// }
});
for (let j = 0; j < lineArr.length; j++) {
series.push(lineArr[j]);
if (lineArr && lineArr.length > 0) {
for (let j = 0; j < lineArr.length; j++) {
series.push(lineArr[j]);
}
}
// 总和数量
let mapNR1 = [];
newVal.map(function (ele) {
@ -251,7 +259,7 @@ export default {
series[0].data = mapNR1;
} else if (title === '速度') {
let unit = 'km/h';
if (this.originalDataArr.length > 0) {
if (this.originalDataArr && this.originalDataArr.length > 0) {
if (this.originalDataArr[0].speed >= 0) {
unit = 'km/h';
} else {

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

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

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

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

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

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

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

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

29
src/views/index.vue
View File

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

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

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