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

20230228

This commit is contained in:
chengdandan 2023-02-28 11:01:57 +08:00
parent eb0b0ed722
commit 6fc3855ff1
4 changed files with 81 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -236,11 +236,6 @@ export default {
// console.log("newVal",newVal) // console.log("newVal",newVal)
series[0].data = newVal.map(val => { series[0].data = newVal.map(val => {
return val.speed; return val.speed;
// if(timeMode=='周期统计'){
// return val.ave_speed;
// }else{
// return val.speed;
// }
}); });
} else if (title === '流量') { } else if (title === '流量') {
series[0].data = newVal.map(ele => { series[0].data = newVal.map(ele => {
@ -262,11 +257,21 @@ export default {
}); });
} else if (title === '排队数') { } else if (title === '排队数') {
series[0].data = newVal.map(val => { series[0].data = newVal.map(val => {
return val.n_queue; // return val.n_queue;
if(timeMode=='周期统计'){
return val.ave_queue;
}else{
return val.n_queue;
}
}); });
} else if (title === '检测数') { } else if (title === '检测数') {
series[0].data = newVal.map(val => { series[0].data = newVal.map(val => {
return val.n_stay; if(timeMode=='周期统计'){
return val.ave_stay;
}else{
return val.n_stay;
}
}); });
} else if (title === '延误') { } else if (title === '延误') {
series[0].data = newVal.map(val => { series[0].data = newVal.map(val => {

1
src/main.js
View File

@ -112,6 +112,7 @@ window.PubScribe = function (topic, number, _callback) {
}); });
} else { } else {
if (topic != null) { if (topic != null) {
console.log("topic",topic)
currentTopics = topic; currentTopics = topic;
client.subscribe(currentTopics, { client.subscribe(currentTopics, {
qos: 0 qos: 0

57
src/views/AnalysisMain.vue
View File

@ -156,7 +156,8 @@ export default {
formLabelWidth: '120px', formLabelWidth: '120px',
formLabelWidth: '200px', formLabelWidth: '200px',
videoTypeForm:{ videoTypeForm:{
videoType:'实时视频' // videoType:'实时视频'
videoType:'离线视频'
}, },
videoList:[], videoList:[],
fullscreenLoading: false, fullscreenLoading: false,
@ -182,41 +183,14 @@ destroyed: function () {
/** 创建mqtt */ /** 创建mqtt */
createMqtt() { createMqtt() {
//创建链接，接收数据 //创建链接，接收数据
window.PubScribe(null,-1,this.realInfo); if(this.videoTypeForm.videoType=='实时视频'){
window.PubScribe(null,-1,this.realInfo);
}else if(this.videoTypeForm.videoType=='离线视频'){
console.log("this.videoTypeForm.videoType",this.videoTypeForm.videoType)
this.topicSends = ['VideoStatusData'];
window.PubScribe(this.topicSends,-1, this.realInfo);
}
/*mqtt = new mqttConfig(this.topicSends);
client = mqtt.createConnect();
// client.subscribe(,, { qos: 0 })
// client.subscribe('img'+this.videoList[i].num, { qos: 0 }, (err)=> {
// if (!err) {
// console.log("订阅成功");
// client.publish('msg_stream',JSON.stringify({"msg_flag":parseInt(-1)}))
// } else {
// console.log('消息订阅失败！')
// }
// });
// setTimeout(function() {
client.subscribe(['hert','img0','img1','img2','img3','img4','img5','img6','img7'], { qos: 0 }, (err)=> {
if (!err) {
console.log("订阅图片成功");
// client.publish('msg_stream',JSON.stringify({"msg_flag":parseInt(-1)}))
} else {
console.log('消息订阅失败！')
}
});
// }, 5000);
client.on("message", (topic, message) => {
//数据分类
try {
// this.receiveNews = this.receiveNews.concat(message);
// this.realInfo(topic, this.receiveNews);
this.realInfo(topic, message);
} catch (error) {
}
});*/
}, },
//停止订阅mqtt //停止订阅mqtt
disConnect() { disConnect() {
@ -277,6 +251,19 @@ destroyed: function () {
} catch (error) { } catch (error) {
}
break;
case "VideoStatusData":
try {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("VideoStatusData", msg) //msg为转换后的JSON数据
} catch (error) {
} }
break; break;
} }

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

@ -249,49 +249,44 @@ export default {
if (newVal!= undefined&&newVal.length != 0 ) { if (newVal!= undefined&&newVal.length != 0 ) {
newVal.forEach(ele => { newVal.forEach(ele => {
// if( ele.timeMode == '周期统计'){ if( ele.timeMode == '周期统计'){
// var thatNN = this; var thatNN = this;
// if (ele.cycleTimeData.length == 10) { ele.cycleStatisticsData.forEach(item => {
// ele.cycleTimeData.pop(); if (item.type_data != null) {
// } else { // 周期时刻的类型数据
// ele.cycleStatisticsData.forEach(item => { thatNN.typeCycleStatistics = item;
// if (item.type_data != null) { }
// // 周期时刻的类型数据 console.log("thatNN.$refs.typeChartRef2",thatNN.$refs.typeChartRef2)
// thatNN.typeCycleStatistics = item; // thatN.$nextTick(() => {
// } if(thatNN.$refs.typeChartRef2!=undefined){
// ele.cycleStatisticsData.unshift(item); // // 轮循周期时刻生成的各类组件
// // thatN.$nextTick(() => { for (let i = 0; i < thatNN.$refs.typeChartRef2.length; i++) {
// if(thatNN.$refs.itemTypeChartRef2!=undefined){ let itemTypeChartRef2 = thatNN.$refs.typeChartRef2[i]
// // 轮循周期时刻生成的各类组件 if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) {
// for (let i = 0; i < thatNN.$refs.itemTypeChartRef2.length; i++) { console.log("itemTypeChartRef2.echartArr",itemTypeChartRef2.echartArr)
// let itemTypeChartRef2 = thatNN.$refs.typeChartRef1[i] if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
// if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) { thatNN.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(thatNN.$refs.typeChartRef2[i].dataArr, thatNN.$refs.typeChartRef2[i].componentName.split('_')[0],'周期统计')
}
// if (itemTypeChartRef2.echartArr.includes('时间曲线图')) { if (itemTypeChartRef2.echartArr.includes('数值')) {
// thatNN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(thatNN.$refs.typeChartRef1[i].dataArr, thatNN.$refs.typeChartRef1[i].componentName.split('_')[0],'周期统计') thatNN.$refs.typeChartRef2[i].getDataArr(thatNN.$refs.typeChartRef2[i].dataArr)
// } }
// if (itemTypeChartRef2.echartArr.includes('数值')) { if (itemTypeChartRef2.echartArr.includes('直方图') &&itemTypeChartRef2.$refs.barChartRef.drawBar) {
// thatNN.$refs.typeChartRef1[i].getDataArr(thatNN.$refs.typeChartRef1[i].dataArr) // 数据改变重新渲染柱状图
// } itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0])
}
// if (itemTypeChartRef2.echartArr.includes('直方图') &&itemTypeChartRef2.$refs.barChartRef.drawBar) { if (itemTypeChartRef2.echartArr.includes('饼状图') &&itemTypeChartRef2.$refs.pieChartRef.drawPie) {
// // 数据改变重新渲染柱状图 // 数据改变重新渲染饼图
// itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0]) itemTypeChartRef2.$refs.pieChartRef.drawPie(itemTypeChartRef2.dataArr[0])
// } }
// if (itemTypeChartRef2.echartArr.includes('饼状图') &&itemTypeChartRef2.$refs.pieChartRef.drawPie) { if (itemTypeChartRef2.echartArr.includes('均值图') && itemTypeChartRef2.$refs.avgChartRef != undefined) {
// // 数据改变重新渲染饼图 itemTypeChartRef2.$refs.avgChartRef.drawBar(itemTypeChartRef2.dataArr[0])
// itemTypeChartRef2.$refs.pieChartRef.drawPie(itemTypeChartRef2.dataArr[0]) }
// } }
// if (itemTypeChartRef2.echartArr.includes('均值图') && itemTypeChartRef2.$refs.avgChartRef != undefined) { }
// itemTypeChartRef2.$refs.avgChartRef.drawBar(itemTypeChartRef2.dataArr[0]) }
// } })
// } }
// }
// }
// })
// }
// }
// if ( ele.timeMode == '周期时刻') { // if ( ele.timeMode == '周期时刻') {
// var thatN = this; // var thatN = this;
// if (ele.cycleTimeData.length == 10) { // if (ele.cycleTimeData.length == 10) {
@ -369,7 +364,7 @@ export default {
} }
ele.trigger.unshift(item); ele.trigger.unshift(item);
_this.$nextTick(() => { _this.$nextTick(() => {
if(_this.$refs.typeChartRef1!=undefined){ if(_this.$refs.typeChartRef!=undefined){
for (let i = 0; i < _this.$refs.typeChartRef.length; i++) { for (let i = 0; i < _this.$refs.typeChartRef.length; i++) {
// console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据'); // console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据');
let itemTypeChart = _this.$refs.typeChartRef[i] let itemTypeChart = _this.$refs.typeChartRef[i]
@ -529,13 +524,11 @@ export default {
}, },
//周期统计 //周期统计
cycleStatisticsData: { cycleStatisticsData: {
handler(newVal, oldVal) { handler(newVal) {
console.log("newVal",newVal)
console.log("oldVal",oldVal)
if (newVal!= undefined&& newVal.length != 0 && this.sectionData) { if (newVal!= undefined&& newVal.length != 0 && this.sectionData) {
console.log("newVal",newVal)
var that = this; var that = this;
that.componentList.forEach(ele => { that.classify.forEach((ele, index) => {
// if (ele.cycleStatisticsData == undefined && ele.timeMode == '周期统计') { // if (ele.cycleStatisticsData == undefined && ele.timeMode == '周期统计') {
// ele.cycleStatisticsData = []; // ele.cycleStatisticsData = [];
// }else{ // }else{
@ -546,17 +539,18 @@ export default {
if (ele.cycleStatisticsData.length == 10) { if (ele.cycleStatisticsData.length == 10) {
ele.cycleStatisticsData.pop(); ele.cycleStatisticsData.pop();
} else { } else {
ele.cycleStatisticsData.unshift(item);
item.time = item.time.split('.')[0]; item.time = item.time.split('.')[0];
if (item.type_data != null) { if (item.type_data != null) {
that.typeCycleStatistics = item; 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++) { for (let i = 0; i < that.$refs.typeChartRef2.length; i++) {
let itemTypeChartRef2 = that.$refs.typeChartRef2[i]; let itemTypeChartRef2 = that.$refs.typeChartRef2[i];
// console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据');
if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) { 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('时间曲线图')) { 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],'周期统计')
} }
@ -593,7 +587,7 @@ export default {
else { else {
var _that = this var _that = this
_that.componentList.forEach(ele => { _that.classify.forEach(ele => {
if ( ele.timeMode == '周期统计') { if ( ele.timeMode == '周期统计') {
if (ele.cycleStatisticsData.length == 10) { if (ele.cycleStatisticsData.length == 10) {
ele.cycleStatisticsData.pop(); ele.cycleStatisticsData.pop();