Compare commits

...

6 Commits

Author SHA1 Message Date
luoshiwen 1bae6a255c 20230228 2023-02-28 16:08:35 +08:00
luoshiwen 12201308ad 20230228 2023-02-28 13:49:27 +08:00
luoshiwen 3666ea2416 20230228 2023-02-28 11:03:48 +08:00
luoshiwen 3b9756e165 Merge branch 'master' of https://git.lgzn.space/chengdandan/TransFlow 2023-02-28 09:08:12 +08:00
luoshiwen 99e7243fd5 20230228 2023-02-28 09:08:04 +08:00
luoshiwen 771ab77f6a 0228 2023-02-28 08:54:00 +08:00
10 changed files with 340 additions and 369 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -45,7 +45,8 @@ export default {
default() {
return {};
}
}
},
},
data() {
return {
@ -73,12 +74,17 @@ export default {
},
methods: {
drawLine(newVal, title,timeMode) {
drawLine(newVal, title, timeMode) {
let myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);
if (myChart == null) {
myChart = this.$echarts.init(this.$refs.lineChart);
}
// var series = []
if (newVal) {
this.xData = newVal.map(val => {
return val.time;
});
}
@ -138,26 +144,24 @@ export default {
}
}
],
series: this.getMessage(newVal, title,timeMode)
series: this.getMessage(newVal, title, timeMode)
};
myChart.setOption(option);
window.addEventListener('resize', function() {
window.addEventListener('resize', function () {
myChart.resize();
});
// this.$nextTick(() => {
// myChart.setOption(option)
// myChart.resize();
// })
// this.$nextTick(() => {
// myChart.setOption(option)
// myChart.resize();
// })
},
getMessage(newVal, title,timeMode) {
if(newVal){
this.xData = newVal.map(val => {
return val.time;
});
getMessage(newVal, title, timeMode) {
if (newVal) {
var series = [
{
@ -248,9 +252,9 @@ export default {
confine: true
};
series[0].data = newVal.map(val => {
if(timeMode=='周期统计'){
if (timeMode == '周期统计') {
return val.ave_headway;
}else{
} else {
return val.headway;
}
@ -258,17 +262,17 @@ export default {
} else if (title === '排队数') {
series[0].data = newVal.map(val => {
// return val.n_queue;
if(timeMode=='周期统计'){
if (timeMode == '周期统计') {
return val.ave_queue;
}else{
} else {
return val.n_queue;
}
});
} else if (title === '检测数') {
series[0].data = newVal.map(val => {
if(timeMode=='周期统计'){
if (timeMode == '周期统计') {
return val.ave_stay;
}else{
} else {
return val.n_stay;
}
@ -280,7 +284,7 @@ export default {
} else if (title === '拥堵') {
series[0].data = newVal.map(val => { });
}
series.forEach(ele=>{
series.forEach(ele => {
ele.data.reverse()
})
return series
@ -289,7 +293,12 @@ export default {
},
mounted() {
// this.drawLine();
// if (this.historyData.length != 0) {
// this.drawLine(this.historyData, this.title, this.status);
// }
// this.getMessage(this.list)
// console.log(this.$parent.dataArr, 'dataArr');
// this.$set(this.$parent.dataArr)

View File

@ -152,8 +152,9 @@ export default {
};
},
created() {
// console.log(this.title);
console.log(this.componentName);
},
methods: {
//
@ -179,6 +180,10 @@ export default {
this.newDataArr[0].headway = val[0].headway;
} else if (val[0].ave_headway) {
this.newDataArr[0].headway = val[0].ave_headway;
}else if (val[0].n_stay) {
this.newDataArr[0].n_stay = val[0].n_stay;
} else if (val[0].ave_stay) {
this.newDataArr[0].n_stay = val[0].ave_stay;
}
},

View File

@ -36,7 +36,9 @@
:componentName="o.componentName" :dataArr="o.cycleTimeData"
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
:chartName="o.combinationName" :typeValue="typeCycleTimeData"
:startEndData="{ start: o.startSectionNames, end: o.endSectionNames }" />
:startEndData="{ start: o.startSectionNames, end: o.endSectionNames }"
:historyData="o.cycleTimeData
" />
<!-- 周期统计的组件 -->
<typeChart ref="typeChartRef2" style="width: 100%;"
@ -45,7 +47,8 @@
:dataArr="o.cycleStatisticsData" :echartArr="o.presentationForm"
:title="o.componentName.split('_')[0]" :chartName="o.combinationName"
:typeValue="typeCycleStatistics"
:startEndData="{ start: o.startSectionNames, end: o.endSectionNames }" />
:startEndData="{ start: o.startSectionNames, end: o.endSectionNames }"
:historyData="o.cycleStatisticsData" />
</el-collapse-item>
</div>
</el-collapse>
@ -155,7 +158,7 @@ export default {
// this.idVal = ;
getComponentSection({ VideoId: this.$route.query.id, Number: 10 }).then(res => {
if (res.data.code == 200) {
// console.log(res.data.data, '');
console.log(res.data.data, '组件的数据');
this.componentList = res.data.data;
this.siftData();
}
@ -180,10 +183,10 @@ export default {
if (item.title == val.combinationName) {
this.classify.push(val);
item.children.push(val);
if(val.timeMode=='周期统计'||this.cycleStatisticsData.length==0){
if (val.timeMode == '周期统计' || this.cycleStatisticsData.length == 0) {
item.cycleStatisticsData = val.cycleStatisticsData
}
if(val.timeMode=='周期时刻'||this.cycleTimeData.length==0){
if (val.timeMode == '周期时刻' || this.cycleTimeData.length == 0) {
item.cycleTimeData = val.cycleTimeData
}
@ -213,19 +216,36 @@ export default {
}
}
},
channge(oldVal, newVal) {
if (oldVal == 'second') {
this.sectionArr = [];
this.sectionData = [];
this.getNew();
} else if (newVal == 'second') {
this.sectionArr = [];
this.sectionData = [];
this.getNew();
}
}
//
//
getRef(data,timeMode) {
console.log(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 (refItem.echartArr.includes('时间曲线图')) {
refItem.$refs.lineChartRef.drawLine(refItem.dataArr,refItem.componentName.split('_')[0],timeMode)
}
if (refItem.echartArr.includes('数值')) {
refItem.getDataArr(refItem.dataArr)
}
if (refItem.echartArr.includes('直方图') && refItem.$refs.barChartRef.drawBar) {
//
refItem.$refs.barChartRef.drawBar(refItem.dataArr[0])
}
if (refItem.echartArr.includes('饼状图') && refItem.$refs.pieChartRef.drawPie) {
//
refItem.$refs.pieChartRef.drawPie(refItem.dataArr[0])
}
if (refItem.echartArr.includes('均值图') && refItem.$refs.avgChartRef != undefined) {
refItem.$refs.avgChartRef.drawBar(refItem.dataArr[0])
}
}
}
}
},
mounted() { },
watch: {
@ -243,102 +263,51 @@ export default {
handler(newVal, oldVal) { },
immediate: true
},
componentList:{
componentList: {
handler(newVal) {
console.log("componentList",newVal)
console.log("componentList", newVal)
if (newVal!= undefined&&newVal.length != 0 ) {
if (newVal != undefined && newVal.length != 0) {
newVal.forEach(ele => {
if( ele.timeMode == '周期统计'){
var thatNN = this;
if (ele.timeMode == '周期统计') {
this.$nextTick(() => {
// var thatNN = this;
ele.cycleStatisticsData.forEach(item => {
if (item.type_data != null) {
//
thatNN.typeCycleStatistics = item;
this.typeCycleStatistics = item;
}
console.log("thatNN.$refs.typeChartRef2",thatNN.$refs.typeChartRef2)
// thatN.$nextTick(() => {
if(thatNN.$refs.typeChartRef2!=undefined){
})
if (this.$refs.typeChartRef2 != undefined) {
// //
for (let i = 0; i < thatNN.$refs.typeChartRef2.length; i++) {
let itemTypeChartRef2 = thatNN.$refs.typeChartRef2[i]
if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) {
console.log("itemTypeChartRef2.echartArr",itemTypeChartRef2.echartArr)
if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
thatNN.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(thatNN.$refs.typeChartRef2[i].dataArr, thatNN.$refs.typeChartRef2[i].componentName.split('_')[0],'周期统计')
}
if (itemTypeChartRef2.echartArr.includes('数值')) {
thatNN.$refs.typeChartRef2[i].getDataArr(thatNN.$refs.typeChartRef2[i].dataArr)
}
if (itemTypeChartRef2.echartArr.includes('直方图') &&itemTypeChartRef2.$refs.barChartRef.drawBar) {
//
itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0])
}
if (itemTypeChartRef2.echartArr.includes('饼状图') &&itemTypeChartRef2.$refs.pieChartRef.drawPie) {
//
itemTypeChartRef2.$refs.pieChartRef.drawPie(itemTypeChartRef2.dataArr[0])
}
if (itemTypeChartRef2.echartArr.includes('均值图') && itemTypeChartRef2.$refs.avgChartRef != undefined) {
itemTypeChartRef2.$refs.avgChartRef.drawBar(itemTypeChartRef2.dataArr[0])
}
}
}
this.getRef(this.$refs.typeChartRef2,ele.timeMode)
}
})
}
// if ( ele.timeMode == '') {
// var thatN = this;
// if (ele.cycleTimeData.length == 10) {
// ele.cycleTimeData.pop();
// } else {
// ele.cycleTimeData.forEach(item => {
// if (item.type_data != null) {
// //
// thatN.typeCycleTimeData = item;
// }
// ele.cycleTimeData.unshift(item);
// // thatN.$nextTick(() => {
// if(thatN.$refs.typeChartRef1!=undefined){
// // console.log("thatN.$refs.typeChartRef1",thatN.$refs.typeChartRef1)
if (ele.timeMode == '周期时刻') {
this.$nextTick(()=>{
ele.cycleStatisticsData.forEach(item => {
if (item.type_data != null) {
this.typeCycleStatistics = item;
}
// thatN.$nextTick(() => {
})
if (this.$refs.typeChartRef1 != undefined) {
// //
// for (let i = 0; i < thatN.$refs.typeChartRef1.length; i++) {
// let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i]
// if (itemTypeChartRef1.length!=0&&itemTypeChartRef1.dataArr!= undefined && itemTypeChartRef1.dataArr.length != 0) {
// if (itemTypeChartRef1.echartArr.includes('线')) {
// thatN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(thatN.$refs.typeChartRef1[i].dataArr, thatN.$refs.typeChartRef1[i].componentName.split('_')[0],'')
// }
// if (itemTypeChartRef1.echartArr.includes('')) {
// thatN.$refs.typeChartRef1[i].getDataArr(thatN.$refs.typeChartRef1[i].dataArr)
// }
// if (itemTypeChartRef1.echartArr.includes('') &&itemTypeChartRef1.$refs.barChartRef.drawBar) {
// //
// itemTypeChartRef1.$refs.barChartRef.drawBar(itemTypeChartRef1.dataArr[0])
// }
// if (itemTypeChartRef1.echartArr.includes('') &&itemTypeChartRef1.$refs.pieChartRef.drawPie) {
// //
// itemTypeChartRef1.$refs.pieChartRef.drawPie(itemTypeChartRef1.dataArr[0])
// }
// if (itemTypeChartRef1.echartArr.includes('') && itemTypeChartRef1.$refs.avgChartRef != undefined) {
// itemTypeChartRef1.$refs.avgChartRef.drawBar(itemTypeChartRef1.dataArr[0])
// }
// }
// }
// }
// })
// }
this.getRef(this.$refs.typeChartRef1,ele.timeMode)
}
})
// }
}
});
}
}
},
immediate: true,
deep: true,
},
// activeName:'channge',
//
@ -364,13 +333,13 @@ export default {
}
ele.trigger.unshift(item);
_this.$nextTick(() => {
if(_this.$refs.typeChartRef!=undefined){
if (_this.$refs.typeChartRef != undefined) {
for (let i = 0; i < _this.$refs.typeChartRef.length; i++) {
// console.log(_this.$refs.typeChartRef[i], '');
let itemTypeChart = _this.$refs.typeChartRef[i]
if (itemTypeChart.dataArr!= undefined && itemTypeChart.dataArr.length != 0) {
if (itemTypeChart.dataArr != undefined && itemTypeChart.dataArr.length != 0) {
if (itemTypeChart.echartArr.includes('时间曲线图')) {
_this.$refs.typeChartRef[i].$refs.lineChartRef.drawLine(_this.$refs.typeChartRef[i].dataArr, _this.$refs.typeChartRef[i].componentName.split('_')[0],'触发')
_this.$refs.typeChartRef[i].$refs.lineChartRef.drawLine(_this.$refs.typeChartRef[i].dataArr, _this.$refs.typeChartRef[i].componentName.split('_')[0], '触发')
}
if (itemTypeChart.echartArr.includes('数值')) {
_this.$refs.typeChartRef[i].getDataArr(_this.$refs.typeChartRef[i].dataArr)
@ -404,14 +373,10 @@ export default {
//
console.log(newVal, '周期时刻数据');
if (newVal!= undefined&&newVal.length != 0 && this.sectionData) {
if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var thatN = this;
thatN.classify.forEach((ele, index) => {
// if (ele.cycleTimeData == undefined && ele.timeMode == '') {
// ele.cycleTimeData = [];
// }else{
// }
newVal.forEach(item => {
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期时刻') {
if (ele.cycleTimeData.length == 10) {
@ -432,7 +397,7 @@ export default {
if (itemTypeChartRef1.length != 0 && itemTypeChartRef1.dataArr != undefined && itemTypeChartRef1.dataArr.length != 0) {
if (itemTypeChartRef1.echartArr.includes('时间曲线图')) {
thatN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(thatN.$refs.typeChartRef1[i].dataArr, thatN.$refs.typeChartRef1[i].componentName.split('_')[0],'周期时刻')
thatN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(thatN.$refs.typeChartRef1[i].dataArr, thatN.$refs.typeChartRef1[i].componentName.split('_')[0], '周期时刻')
}
if (itemTypeChartRef1.echartArr.includes('数值')) {
thatN.$refs.typeChartRef1[i].getDataArr(thatN.$refs.typeChartRef1[i].dataArr)
@ -464,11 +429,7 @@ export default {
} else {
var _thatN = this
_thatN.classify.forEach((ele, index) => {
// if (ele.cycleTimeData == undefined && ele.timeMode == '') {
// ele.cycleTimeData = [];
// }else{
// }
// newVal.forEach(item => {
if (ele.timeMode == '周期时刻') {
if (ele.cycleTimeData.length == 10) {
@ -481,25 +442,25 @@ export default {
// }
// ele.cycleTimeData.unshift(item);
// _thatN.$nextTick(() => {
if(_thatN.$refs.typeChartRef1!=undefined){
if (_thatN.$refs.typeChartRef1 != undefined) {
// console.log("thatN.$refs.typeChartRef1",_thatN.$refs.typeChartRef1)
//
for (let i = 0; i < _thatN.$refs.typeChartRef1.length; i++) {
let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i]
if (itemTypeChartRef1.length!=0&&itemTypeChartRef1.dataArr!= undefined && itemTypeChartRef1.dataArr.length != 0) {
if (itemTypeChartRef1.length != 0 && itemTypeChartRef1.dataArr != undefined && itemTypeChartRef1.dataArr.length != 0) {
if (itemTypeChartRef1.echartArr.includes('时间曲线图')) {
_thatN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(_thatN.$refs.typeChartRef1[i].dataArr, _thatN.$refs.typeChartRef1[i].componentName.split('_')[0],'周期时刻')
_thatN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(_thatN.$refs.typeChartRef1[i].dataArr, _thatN.$refs.typeChartRef1[i].componentName.split('_')[0], '周期时刻')
}
if (itemTypeChartRef1.echartArr.includes('数值')) {
_thatN.$refs.typeChartRef1[i].getDataArr(_thatN.$refs.typeChartRef1[i].dataArr)
}
if (itemTypeChartRef1.echartArr.includes('直方图') &&itemTypeChartRef1.$refs.barChartRef.drawBar) {
if (itemTypeChartRef1.echartArr.includes('直方图') && itemTypeChartRef1.$refs.barChartRef.drawBar) {
//
itemTypeChartRef1.$refs.barChartRef.drawBar(itemTypeChartRef1.dataArr[0])
}
if (itemTypeChartRef1.echartArr.includes('饼状图') &&itemTypeChartRef1.$refs.pieChartRef.drawPie) {
if (itemTypeChartRef1.echartArr.includes('饼状图') && itemTypeChartRef1.$refs.pieChartRef.drawPie) {
//
itemTypeChartRef1.$refs.pieChartRef.drawPie(itemTypeChartRef1.dataArr[0])
}
@ -525,15 +486,10 @@ export default {
//
cycleStatisticsData: {
handler(newVal) {
console.log("newVal",newVal)
if (newVal!= undefined&& newVal.length != 0 && this.sectionData) {
// console.log("newVal", newVal)
if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var that = this;
that.classify.forEach((ele, index) => {
// if (ele.cycleStatisticsData == undefined && ele.timeMode == '') {
// ele.cycleStatisticsData = [];
// }else{
// // ele.cycleStatisticsData =
// }
newVal.forEach(item => {
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期统计') {
if (ele.cycleStatisticsData.length == 10) {
@ -545,14 +501,14 @@ export default {
that.typeCycleStatistics = item;
}
ele.cycleStatisticsData.unshift(item);
if(that.$refs.typeChartRef2!=undefined){
if (that.$refs.typeChartRef2 != undefined) {
console.log(that.$refs.typeChartRef2, '触发接收的表格数据');
for (let i = 0; i < that.$refs.typeChartRef2.length; i++) {
let itemTypeChartRef2 = that.$refs.typeChartRef2[i];
if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) {
if (itemTypeChartRef2.length != 0 && itemTypeChartRef2.dataArr != undefined && itemTypeChartRef2.dataArr.length != 0) {
if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
that.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(that.$refs.typeChartRef2[i].dataArr, that.$refs.typeChartRef2[i].componentName.split('_')[0],'周期统计')
that.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(that.$refs.typeChartRef2[i].dataArr, that.$refs.typeChartRef2[i].componentName.split('_')[0], '周期统计')
}
if (itemTypeChartRef2.echartArr.includes('数值')) {
that.$refs.typeChartRef2[i].getDataArr(that.$refs.typeChartRef2[i].dataArr)
@ -588,7 +544,7 @@ export default {
var _that = this
_that.classify.forEach(ele => {
if ( ele.timeMode == '周期统计') {
if (ele.timeMode == '周期统计') {
if (ele.cycleStatisticsData.length == 10) {
ele.cycleStatisticsData.pop();
} else {
@ -597,25 +553,25 @@ export default {
// _that.typeCycleStatistics = item;
// }
// ele.cycleStatisticsData.unshift(item);
if(_that.$refs.typeChartRef2!=undefined){
if (_that.$refs.typeChartRef2 != undefined) {
for (let i = 0; i < _that.$refs.typeChartRef2.length; i++) {
let itemTypeChartRef2 = _that.$refs.typeChartRef2[i];
// console.log(_this.$refs.typeChartRef[i], '');
if (itemTypeChartRef2.length != 0 && itemTypeChartRef2.dataArr != undefined && itemTypeChartRef2.dataArr.length != 0) {
// this.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(this.$refs.typeChartRef2[i].dataArr, _this.$refs.typeChartRe2f[i].componentName.split('_')[0])
if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
_that.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(_that.$refs.typeChartRef2[i].dataArr, _that.$refs.typeChartRef2[i].componentName.split('_')[0],'周期统计')
_that.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(_that.$refs.typeChartRef2[i].dataArr, _that.$refs.typeChartRef2[i].componentName.split('_')[0], '周期统计')
}
if (itemTypeChartRef2.echartArr.includes('数值')) {
_that.$refs.typeChartRef2[i].getDataArr(_that.$refs.typeChartRef2[i].dataArr)
}
// console.log(item,'');
if (itemTypeChartRef2.echartArr.includes('直方图')&&itemTypeChartRef2.$refs.barChartRef.drawBar) {
if (itemTypeChartRef2.echartArr.includes('直方图') && itemTypeChartRef2.$refs.barChartRef.drawBar) {
//
// console.log(item, '');
itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0])
}
if (itemTypeChartRef2.echartArr.includes('饼状图')&&itemTypeChartRef2.$refs.pieChartRef.drawPie) {
if (itemTypeChartRef2.echartArr.includes('饼状图') && itemTypeChartRef2.$refs.pieChartRef.drawPie) {
//
itemTypeChartRef2.$refs.pieChartRef.drawPie(itemTypeChartRef2.dataArr[0])
}
@ -636,7 +592,8 @@ export default {
});
}
}
},
immediate: true
}
// activeName: {
// handler(newVal) {