20230228
This commit is contained in:
parent
eb0b0ed722
commit
6fc3855ff1
|
|
@ -236,11 +236,6 @@ export default {
|
|||
// console.log("newVal",newVal)
|
||||
series[0].data = newVal.map(val => {
|
||||
return val.speed;
|
||||
// if(timeMode=='周期统计'){
|
||||
// return val.ave_speed;
|
||||
// }else{
|
||||
// return val.speed;
|
||||
// }
|
||||
});
|
||||
} else if (title === '流量') {
|
||||
series[0].data = newVal.map(ele => {
|
||||
|
|
@ -262,11 +257,21 @@ export default {
|
|||
});
|
||||
} else if (title === '排队数') {
|
||||
series[0].data = newVal.map(val => {
|
||||
// return val.n_queue;
|
||||
if(timeMode=='周期统计'){
|
||||
return val.ave_queue;
|
||||
}else{
|
||||
return val.n_queue;
|
||||
}
|
||||
});
|
||||
} else if (title === '检测数') {
|
||||
series[0].data = newVal.map(val => {
|
||||
if(timeMode=='周期统计'){
|
||||
return val.ave_stay;
|
||||
}else{
|
||||
return val.n_stay;
|
||||
}
|
||||
|
||||
});
|
||||
} else if (title === '延误') {
|
||||
series[0].data = newVal.map(val => {
|
||||
|
|
|
|||
|
|
@ -112,6 +112,7 @@ window.PubScribe = function (topic, number, _callback) {
|
|||
});
|
||||
} else {
|
||||
if (topic != null) {
|
||||
console.log("topic",topic)
|
||||
currentTopics = topic;
|
||||
client.subscribe(currentTopics, {
|
||||
qos: 0
|
||||
|
|
|
|||
|
|
@ -156,7 +156,8 @@ export default {
|
|||
formLabelWidth: '120px',
|
||||
formLabelWidth: '200px',
|
||||
videoTypeForm:{
|
||||
videoType:'实时视频'
|
||||
// videoType:'实时视频'
|
||||
videoType:'离线视频'
|
||||
},
|
||||
videoList:[],
|
||||
fullscreenLoading: false,
|
||||
|
|
@ -182,41 +183,14 @@ destroyed: function () {
|
|||
/** 创建mqtt */
|
||||
createMqtt() {
|
||||
//创建链接，接收数据
|
||||
if(this.videoTypeForm.videoType=='实时视频'){
|
||||
window.PubScribe(null,-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('消息订阅失败！')
|
||||
}else if(this.videoTypeForm.videoType=='离线视频'){
|
||||
console.log("this.videoTypeForm.videoType",this.videoTypeForm.videoType)
|
||||
this.topicSends = ['VideoStatusData'];
|
||||
window.PubScribe(this.topicSends,-1, this.realInfo);
|
||||
}
|
||||
});
|
||||
// }, 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
|
||||
disConnect() {
|
||||
|
|
@ -277,6 +251,19 @@ destroyed: function () {
|
|||
|
||||
} 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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -249,49 +249,44 @@ export default {
|
|||
|
||||
if (newVal!= undefined&&newVal.length != 0 ) {
|
||||
newVal.forEach(ele => {
|
||||
// if( ele.timeMode == '周期统计'){
|
||||
// var thatNN = this;
|
||||
// if (ele.cycleTimeData.length == 10) {
|
||||
// ele.cycleTimeData.pop();
|
||||
// } else {
|
||||
// ele.cycleStatisticsData.forEach(item => {
|
||||
// if (item.type_data != null) {
|
||||
// // 周期时刻的类型数据
|
||||
// thatNN.typeCycleStatistics = item;
|
||||
// }
|
||||
// ele.cycleStatisticsData.unshift(item);
|
||||
// // thatN.$nextTick(() => {
|
||||
// if(thatNN.$refs.itemTypeChartRef2!=undefined){
|
||||
|
||||
if( ele.timeMode == '周期统计'){
|
||||
var thatNN = this;
|
||||
ele.cycleStatisticsData.forEach(item => {
|
||||
if (item.type_data != null) {
|
||||
// 周期时刻的类型数据
|
||||
thatNN.typeCycleStatistics = item;
|
||||
}
|
||||
console.log("thatNN.$refs.typeChartRef2",thatNN.$refs.typeChartRef2)
|
||||
// thatN.$nextTick(() => {
|
||||
if(thatNN.$refs.typeChartRef2!=undefined){
|
||||
// // 轮循周期时刻生成的各类组件
|
||||
// for (let i = 0; i < thatNN.$refs.itemTypeChartRef2.length; i++) {
|
||||
// let itemTypeChartRef2 = thatNN.$refs.typeChartRef1[i]
|
||||
// if (itemTypeChartRef2.length!=0&&itemTypeChartRef2.dataArr!= undefined && itemTypeChartRef2.dataArr.length != 0) {
|
||||
for (let i = 0; i < thatNN.$refs.typeChartRef2.length; i++) {
|
||||
let itemTypeChartRef2 = thatNN.$refs.typeChartRef2[i]
|
||||
|
||||
// if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
|
||||
// thatNN.$refs.typeChartRef1[i].$refs.lineChartRef.drawLine(thatNN.$refs.typeChartRef1[i].dataArr, thatNN.$refs.typeChartRef1[i].componentName.split('_')[0],'周期统计')
|
||||
// }
|
||||
// if (itemTypeChartRef2.echartArr.includes('数值')) {
|
||||
// thatNN.$refs.typeChartRef1[i].getDataArr(thatNN.$refs.typeChartRef1[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])
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
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])
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// if ( ele.timeMode == '周期时刻') {
|
||||
// var thatN = this;
|
||||
// if (ele.cycleTimeData.length == 10) {
|
||||
|
|
@ -369,7 +364,7 @@ export default {
|
|||
}
|
||||
ele.trigger.unshift(item);
|
||||
_this.$nextTick(() => {
|
||||
if(_this.$refs.typeChartRef1!=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]
|
||||
|
|
@ -529,13 +524,11 @@ export default {
|
|||
},
|
||||
//周期统计
|
||||
cycleStatisticsData: {
|
||||
handler(newVal, oldVal) {
|
||||
|
||||
console.log("oldVal",oldVal)
|
||||
if (newVal!= undefined&& newVal.length != 0 && this.sectionData) {
|
||||
handler(newVal) {
|
||||
console.log("newVal",newVal)
|
||||
if (newVal!= undefined&& newVal.length != 0 && this.sectionData) {
|
||||
var that = this;
|
||||
that.componentList.forEach(ele => {
|
||||
that.classify.forEach((ele, index) => {
|
||||
// if (ele.cycleStatisticsData == undefined && ele.timeMode == '周期统计') {
|
||||
// ele.cycleStatisticsData = [];
|
||||
// }else{
|
||||
|
|
@ -546,17 +539,18 @@ export default {
|
|||
if (ele.cycleStatisticsData.length == 10) {
|
||||
ele.cycleStatisticsData.pop();
|
||||
} else {
|
||||
ele.cycleStatisticsData.unshift(item);
|
||||
|
||||
item.time = item.time.split('.')[0];
|
||||
if (item.type_data != null) {
|
||||
that.typeCycleStatistics = item;
|
||||
}
|
||||
ele.cycleStatisticsData.unshift(item);
|
||||
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];
|
||||
// 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],'周期统计')
|
||||
}
|
||||
|
|
@ -593,7 +587,7 @@ export default {
|
|||
else {
|
||||
|
||||
var _that = this
|
||||
_that.componentList.forEach(ele => {
|
||||
_that.classify.forEach(ele => {
|
||||
if ( ele.timeMode == '周期统计') {
|
||||
if (ele.cycleStatisticsData.length == 10) {
|
||||
ele.cycleStatisticsData.pop();
|
||||
|
|
|
|||
Loading…
Reference in New Issue