bug修改
This commit is contained in:
parent
53b7083f9a
commit
0bf3950dac
|
|
@ -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,17 +48,16 @@ export default {
|
|||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
};
|
||||
return {};
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
drawBar(newVal) {
|
||||
if (newVal) {
|
||||
var xData = newVal.type_data.map(ele => {
|
||||
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 => {
|
||||
var yData = newVal.type_data.map((ele) => {
|
||||
return ele.quantity;
|
||||
});
|
||||
}
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -209,11 +209,13 @@ export default {
|
|||
var mapN = [];
|
||||
if (arr && arr.length > 0) {
|
||||
for (var t = 0; t < arr.length; t++) {
|
||||
if (arr[t] && arr[t].length > 0) {
|
||||
for (var i = 0; i < arr[t].length; i++) {
|
||||
mapN.push(arr[t][i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var lineArr = [];
|
||||
if (newVal[0].type_data != undefined) {
|
||||
|
|
@ -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);
|
||||
// }
|
||||
});
|
||||
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 {
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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');
|
||||
|
|
@ -249,9 +277,22 @@ export default {
|
|||
// slicedData = data; // 如果数据不足 10 条，则保留全部数据
|
||||
// }
|
||||
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 });
|
||||
console.log('类型-typeData',this.typeData)
|
||||
}
|
||||
// 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(() => {
|
||||
|
|
|
|||
|
|
@ -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,10 +400,16 @@ export default {
|
|||
},
|
||||
getTotal(dataArr) {
|
||||
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 cur.quantity + prev;
|
||||
}, 0);
|
||||
}
|
||||
return 0
|
||||
}
|
||||
return 0
|
||||
}
|
||||
},
|
||||
getNewQueue(val) {
|
||||
if (val[0].n_queue) {
|
||||
|
|
|
|||
|
|
@ -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
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 = [
|
||||
|
|
|
|||
|
|
@ -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,24 +254,25 @@
|
|||
</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') }}
|
||||
{{ getTotal(i.cycleTimeData[0].type_data, 'quantity', 'value') }}
|
||||
</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 v-else-if="i.triggerData && i.triggerData.type_data">
|
||||
{{ getTotal(i.triggerData.type_data, 'quantity', 'value') }}
|
||||
<!-- <span
|
||||
v-if="
|
||||
!Number.isNaN(
|
||||
|
|
@ -287,31 +291,7 @@
|
|||
>
|
||||
<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 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,21 +442,30 @@
|
|||
</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') }}
|
||||
{{
|
||||
i.cycleStatisticsData[0].type_data &&
|
||||
i.cycleStatisticsData[0].type_data.length > 0
|
||||
? getTotal(i.cycleStatisticsData[0].type_data, 'quantity', 'value')
|
||||
: '-'
|
||||
}}
|
||||
</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 &&
|
||||
i.triggerData.type_data
|
||||
"
|
||||
>
|
||||
<!-- {{i.triggerData[0].quantity + i.triggerData[1].quantity + i.triggerData[2].quantity}} -->
|
||||
|
|
@ -504,35 +486,9 @@
|
|||
}}</span
|
||||
>
|
||||
<span v-else>0</span> -->
|
||||
{{ getTotal(i.triggerData.type_data, 'quantity') }}
|
||||
{{ getTotal(i.triggerData.type_data, 'quantity', 'value') }}
|
||||
</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') }}
|
||||
<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) => {
|
||||
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) {
|
||||
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)) {
|
||||
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.$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,
|
||||
|
|
|
|||
Loading…
Reference in New Issue