From 7147c2f8a732ab764f2ad1dd18365053b1cafae7 Mon Sep 17 00:00:00 2001
From: chengdandan <2549057906@qq.com>
Date: Mon, 6 Feb 2023 09:08:13 +0800
Subject: [PATCH] 20230206
---
public/VideoWeb/index.html | 5 +-
src/views/AnalysisMain.vue | 13 ++-
src/views/index.vue | 171 +++++++++++++++----------------------
3 files changed, 81 insertions(+), 108 deletions(-)
diff --git a/public/VideoWeb/index.html b/public/VideoWeb/index.html
index 3f0019db..f2bea6d9 100644
--- a/public/VideoWeb/index.html
+++ b/public/VideoWeb/index.html
@@ -238,7 +238,10 @@
console.log("组件名称",name)
window.parent.getSimulationAreaEdit(id,type,componentType,name,2);
}
-
+ //获取左侧区域删除图形或断面成功后返回的数据
+ function getdeleData(data){
+ console.log("id",data)
+ }
document.body.appendChild(script);
diff --git a/src/views/AnalysisMain.vue b/src/views/AnalysisMain.vue
index 6d58b904..df27028e 100644
--- a/src/views/AnalysisMain.vue
+++ b/src/views/AnalysisMain.vue
@@ -38,7 +38,7 @@
-
{{ item.videoStreamAddress}}
+
{{item.videoStreamAddress!=''? item.videoStreamAddress:item.videoPath}}
@@ -134,6 +134,7 @@ export default {
videoName:'测试视频01',
city:'',
videoStreamAddress:'',
+ videoPath:''
},
formLabelWidth: '120px',
formLabelWidth: '200px',
@@ -266,6 +267,7 @@ destroyed: function () {
videoName:'测试视频01',
city:'',
videoStreamAddress:'',
+ videoPath:''
},
this.dialogFormVisible = true;
@@ -453,6 +455,7 @@ destroyed: function () {
num:item.number,
status:item.status,
videoStreamAddress:item.videoStreamAddress,
+ videoPath:item.videoPath,
img: require('@/assets/img/AnalysisMain/img1.png'),
});
})
@@ -500,14 +503,18 @@ destroyed: function () {
.streamAddress{
color: coral;
font-size: 12px;
- /* line-height: 16px; */
- padding-top: 5px;
+ padding-top: 5px;
+
}
.bottom {
margin-top: 10px;
line-height: 12px;
display: inline-block;
margin-left: 15px;
+ width: 67%;
+ text-overflow:ellipsis;
+ white-space:nowrap;
+ overflow:hidden;
}
.st{
position: absolute;
diff --git a/src/views/index.vue b/src/views/index.vue
index 39df21a1..be7f191d 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -32,12 +32,10 @@
存储
- 视频分析
+ 视频分析
交通分析
+ >交通分析
-
确认
取消
@@ -90,6 +85,12 @@
+
+
+
+
+
+
@@ -104,7 +105,8 @@
componentForm.componentType != '拥堵'&&
componentForm.componentType != '流量'
">
-
+
+
+
{{
@@ -191,9 +191,7 @@ import axios from 'axios';
import mqttConfig from '@/utils/mqttConfig.js';
var mqtt; //mqtt 处理对象（全局变量）
var client;
-// var topicSends; //订阅的topic 例如：["Time1", "EngineMain1", "Console1", "Location1"]
// //判断
-// var number = 1
export default {
data() {
return {
@@ -212,6 +210,7 @@ export default {
areaComponent: false,
indexModule: false,
disabledTrafficAnalysis:true,
+ disabledVideoAnalysis:false,
//判断模拟区，画布区
numberNew: 1,
speed: false,
@@ -278,26 +277,19 @@ export default {
endSection: [],
componentType: '',
typeFiltering: '',
- typeData: []
+ typeData: [],
+ flow:'出流'
+
},
// typeData: ['小汽车', '公交车', '卡车', '非机动车', '行人'],
typeData:['机动车','非机动车','行人'],
//展现形式
presentation: ['数值', '表格', '时间曲线图', '均值图'],
-
trackForm: {
name: ''
},
- // dateTime: this.$moment(new Date()).format("LL"),
nowTime: '',
- // weekday: this.$moment().format("dddd"),
ins: 0,
- imgUrl: '',
- imgUrl1: '',
- imgUrl2: '',
- imgUrl3: '',
- imgUrl4: '',
- imgUrl5: '',
btnPic: [],
Data: [
{
@@ -347,14 +339,14 @@ export default {
videoUnityShow:true,
videoAnalysisSta:'',
analysis:{
- trafficAnalysisPath1:'',
- trafficAnalysisPath2:'',
- videoAnalysisPath:'',
- videoName:'',
- videoPath:'',
- videoTotalFrames:'',
- videoType:''
- },
+ trafficAnalysisPath1:'',
+ trafficAnalysisPath2:'',
+ videoAnalysisPath:'',
+ videoName:'',
+ videoPath:'',
+ videoTotalFrames:'',
+ videoType:''
+ },
description:'请点击视频分析'
};
},
@@ -380,26 +372,21 @@ export default {
if (this.$route.query.type == '实时视频') {
this.videoAnalysisShow = false;
this.trafficAnalysisShow = false;
- document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
- } else {
+ document.getElementById('mapModule').contentWindow.lixianVideo(JSON.stringify(this.analysis));
+ this.createMqtt();
+ } else if (this.$route.query.type == '离线视频'){
this.videoAnalysisShow = true;
this.trafficAnalysisShow = true;
+ this.getAnalysisStatus()
+ // if(this.$route.query.status=='未分析'){
+ // }
// if(this.$route.query.status=='未分析'){
// // document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
-
// }else{
-
- // }
- this.getAnalysisStatus()
-
+ // }
}
},
mounted() {
- // this.testMqtt()
-
- // this.getSingleComponentIdN()
- this.componentForm.company = this.timeSelect[0].value;
- this.createMqtt();
},
methods: {
@@ -438,21 +425,32 @@ export default {
getAnalysisStatus(){
getVideoStatus(this.$route.query.id).then(res => {
console.log("res.data",res.data)
+ //视频分析状态
if(res.data.data.videoAnalysisStatus == '未分析'){
this.disabledTrafficAnalysis= true
// this.videoUnityShow = false
this.videoUnityShow = true
this.analysisData()
}else if(res.data.data.videoAnalysisStatus == '分析中'){
-
+ this.disabledVideoAnalysis= true
+ this.videoUnityShow = false
+ setTimeout(() => {
+ this.getAnalysisStatus()
+ }, 5000);
}else if(res.data.data.videoAnalysisStatus == '已分析'){
this.videoUnityShow = true
this.videoAnalysisSta = res.data.data.videoAnalysisStatus
+ this.disabledTrafficAnalysis= false
this.analysisData()
- }else if(res.data.data.trafficAnalysisStatus==''){
-
- }else if(res.data.data.trafficAnalysisStatus==''){
-
+ //交通分析状态
+ }else if(res.data.data.trafficAnalysisStatus=='未分析'){
+ this.disabledVideoAnalysis= true
+ }else if(res.data.data.trafficAnalysisStatus=='分析中'){
+ this.disabledVideoAnalysis= true
+ this.disabledTrafficAnalysis= true
+ }else if(res.data.data.videoAnalysisStatus == '已分析'||res.data.data.trafficAnalysisStatus == '已分析'){
+ this.disabledVideoAnalysis= false
+ this.disabledTrafficAnalysis= true
}
});
},
@@ -485,6 +483,17 @@ export default {
startTrafficAnalysis(this.$route.query.id).then(res => {
//
console.log("res.data",res.data.data)
+ if (res.data.code == 200) {
+ this.$message({
+ message: res.data.msg,
+ type: 'success'
+ });
+ }else{
+ this.$message({
+ message: res.data.msg,
+ type: 'warning'
+ });
+ }
});
},
//获取视频分析结果
@@ -512,14 +521,7 @@ export default {
realInfo(topic, message) {
switch (topic) {
// 接收托片
- case 'img'+this.number:
- // case 'img1':
- // case 'img2':
- // case 'img3':
- // case 'img4':
- // case 'img5':
- // case 'img6':
- // case 'img7':
+ case 'img'+this.number:
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
@@ -535,13 +537,6 @@ export default {
break;
// 树结构
case 'stream'+this.number:
- // case 'stream1':
- // case 'stream2':
- // case 'stream3':
- // case 'stream4':
- // case 'stream5':
- // case 'stream6':
- // case 'stream7':
try {
const utf8decoder1 = new TextDecoder();
const u8arr = new Uint8Array(message);
@@ -551,58 +546,34 @@ export default {
} catch (error) {}
break;
// 控制台输出
- case 'trajectory'+this.number:
- // case 'trajectory1':
- // case 'trajectory2':
- // case 'trajectory3':
- // case 'trajectory4':
- // case 'trajectory5':
- // case 'trajectory6':
- // case 'trajectory7':
+ case 'trajectory'+this.number:
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
- // console.log("message11",message)
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
- // console.log("temp11",temp)
const msg = JSON.parse(temp);
- // console.log("msg11",msg)
document.getElementById('mapModule').contentWindow.getGuiJi(JSON.stringify(msg));
} catch (error) {}
break;
// 触发
- case 'detection'+this.number:
- // case 'detection1':
- // case 'detection2':
- // case 'detection3':
- // case 'detection4':
- // case 'detection5':
- // case 'detection6':
- // case 'detection7':
+ case 'detection'+this.number:
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
- // console.log("message",message)
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
- // console.log("temp",temp)
var detId = [];
const msgN = JSON.parse(temp);
- // console.log("msgN",msgN)
this.triggerData = msgN;
if (temp.length != 0) {
for (let i = 0; i < msgN.length; i++) {
detId.push(msgN[i].det_id);
}
- // console.log("detId",detId)
- // const msg = detId
- // console.log("msg",msg)
document.getElementById('mapModule').contentWindow.getChuFa(JSON.stringify(detId));
- // document.getElementById("mapModule").contentWindow.getChuFa(detId)
}
- } catch (error) {}
- break;
- case 'trigger-'+this.$route.query.id:
- try {
+ } catch (error) {}
+ break;
+ case 'trigger-'+this.$route.query.id:
+ try {
// console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
@@ -648,7 +619,6 @@ export default {
if (res.data.data.company != '') {
this.componentForm.company = res.data.data.company;
}
-
// this.componentForm.componentName = res.data.data.componentName+'-'+type
this.componentForm.componentName = res.data.data.componentName;
if (res.data.data.timeMode != '') {
@@ -669,6 +639,7 @@ export default {
this.componentForm.startSectionNames = res.data.data.startSectionNames;
this.componentForm.endSectionIds = res.data.data.endSectionIds;
this.componentForm.endSectionNames = res.data.data.endSectionNames;
+ this.componentForm.company = res.data.data.company;
this.componentForm.endValue = res.data.data.endValue;
this.componentForm.startValue = res.data.data.startValue;
this.componentForm.presentationForm = res.data.data.presentationForm;
@@ -707,11 +678,6 @@ export default {
});
});
}
- // if(res.data.data.presentationForm!=''){
- // var presentationN = []
- // presentationN = res.data.data.presentationForm.split(',')
- // this.componentForm.presentation = presentationN
- // }
if (this.componentForm.presentationForm != '') {
var arr = [];
arr = this.componentForm.presentationForm.split(',');
@@ -767,7 +733,6 @@ export default {
this.componentForm.timeMode = '触发'
}
}
- // this.componentForm.componentName = res.data.data.componentName+'-'+type
this.componentForm.componentName = res.data.data.componentName;
this.componentForm.componentParameterId = res.data.data.componentParameterId;
this.componentForm.cycleInterval = res.data.data.cycleInterval;
@@ -927,7 +892,7 @@ export default {
showClose: true,
duration:0,
});
- }, 5000);
+ }, 3000);
document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data));
document
@@ -1107,7 +1072,6 @@ export default {
console.log('form', form);
if (form.id != '') {
this.dialogFormVisible = false;
- // document.getElementById("mapModule").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))
document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));
} else {
this.dialogFormVisible = false;
@@ -1122,7 +1086,6 @@ export default {
if (this.form.id != '') {
this.dialogFormVisible = false;
document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));
- // document.getElementById("mapModule").contentWindow.closeEdit(form.type,form.id)
} else {
this.dialogFormVisible = false;
document.getElementById('mapModule').contentWindow.delFigure();