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

Compare commits

base: chengdandan:25b90985a2f843ef63fbb4fce47c69cffbf51eee
Branches Tags
chengdandan:master
...
compare: chengdandan:350c45f8877cf11193c42d25beaaf500eb844547
Branches Tags
chengdandan:master

5 Commits
25b90985a2 ... 350c45f887

Author SHA1 Message Date
chengdandan 350c45f887 20230204 2023-02-04 18:16:22 +08:00
chengdandan e391f08dc4 20230203 2023-02-03 18:11:46 +08:00
chengdandan e1caab6602 Merge branch 'master' of http://git.lgzn.space/chengdandan/TransFlow 2023-02-02 13:07:38 +08:00
chengdandan 2bb75854d6 Merge branch 'master' of http://git.lgzn.space/chengdandan/TransFlow 2023-02-01 15:15:20 +08:00
chengdandan d969cf36b0 20230201 2023-02-01 15:15:15 +08:00
9 changed files with 320 additions and 134 deletions
Show Stats Expand all files Collapse all files

BIN
public/VideoWeb/Build/APP.data.unityweb
View File

Binary file not shown.

BIN
public/VideoWeb/Build/APP.framework.js.unityweb
View File

Binary file not shown.

BIN
public/VideoWeb/Build/APP.wasm.unityweb
View File

Binary file not shown.

20
public/VideoWeb/StreamingAssets/JsonJianktx.txt Normal file
View File

@ -0,0 +1,20 @@
{
"code": 200,
"msg": "成功",
"data": [{
"graphicId": "35fb0709596841e5b005fb1bc33a0fa4",
"graphicName": "测试区域",
"graphicType": "区域",
"coordinate": "218.6106 984.2285,453.5649 994.1006,267.9708 820.3528,218.6106 984.2285"
}, {
"graphicId": "957eb7cba61240f5a099ee6080bd29f0",
"graphicName": "测试路线2",
"graphicType": "轨迹",
"coordinate": "157.404 236.9287,179.1225 260.6216,192.9433 300.1097,202.8154 329.7258,214.6618 357.3675,222.5594 392.9068,236.3803 424.4973,258.0987 446.2157,289.6892 465.9598,317.3309 485.7039,350.8958 503.4735,382.4863 509.3967,420 517.2943,467.3858 521.2432,508.8483 525.192,556.234 525.192,599.671 525.192,631.2614 525.192,662.8519 513.3455,690.4936 499.5247,712.2121 477.8062,724.0585 444.2413,728.0073 412.6508,745.777 386.9836,775.3931 377.1115,806.9836 379.0859"
}, {
"graphicId": "7c24aa16e12840859164780d71827f5f",
"graphicName": "测试线2",
"graphicType": "断面",
"coordinate": "437.7697 642.6563,880.0366 737.4278"
}]
}

14
public/VideoWeb/index.html
View File

@ -128,13 +128,21 @@
//unity初始化
function OnSceneLoaded(){
window.parent.OnScene();
}
//初始化传离线视频数据功能
function lixianVideo(string){
console.log("string",string)
if(unity!=null){
unity.SendMessage('AAA','Unity_OfflineDataPrepare', string);
}
}
//获取图像
function getDestination(string){
// console.log("string",string)
if(unity!=null){
unity.SendMessage('AAA', 'SendImage', string);
}
if(unity!=null){
unity.SendMessage('AAA', 'SendImage', string);
}
}
//获取图像id等数据
function getData(string){

28
src/views/AnalysisMain.vue
View File

@ -19,16 +19,17 @@
<img src="@/assets/img/AnalysisMain/leftTop.png" alt="" v-if="item.type=='实时视频'">
<img src="@/assets/img/AnalysisMain/leftTop2.png" alt="" v-if="item.type=='离线视频'">
</div>
<div class="name">
<div class="name">
<img src="@/assets/img/AnalysisMain/ssVideo.png" alt="" v-if="item.type=='实时视频'">
<img src="@/assets/img/AnalysisMain/lxVideo.png" alt="" v-if="item.type=='离线视频'">
</div>
<div class="statusN" v-if="item.type=='实时视频'|| item.status=='已分析'">
<img src="@/assets/img/AnalysisMain/status.png" alt="" v-if="item.type=='实时视频'">
<div class="statusN">
<img src="@/assets/img/AnalysisMain/status.png" alt="" >
<span class="statusName">{{ item.status }}</span>
</div>
<!-- <div class="del" @click="open(item.id)"> <i class='el-icon-delete'></i></div> -->
<img :src="item.img" class="image" @click="goToPage(item.id,item.num,item.title,item.type)">
<img :src="item.img" class="image" @click="goToPage(item.id,item.num,item.title,item.type,item.status)">
<div class="bot">
<span style=" vertical-align: middle;">
<img src="@/assets/img/AnalysisMain/video (1).png" alt="">
@ -69,8 +70,7 @@
<el-dialog
title="视频源配置"
width="40%"
:visible.sync="dialogFormVisible"
:visible.sync="dialogFormVisible"
>
<!-- <editModal ></editModal> -->
<el-form :model="form">
@ -299,8 +299,13 @@ destroyed: function () {
console.log("form",form)
let formData = new FormData();
formData.append("VideoName",form.videoName);
formData.append("VideoType",form.videoType);
formData.append("VideoStreamAddress",form.videoStreamAddress);
formData.append("VideoType",this.videoTypeForm.videoType);
if(this.videoTypeForm.videoType=='离线视频'){
formData.append("VideoPath",form.videoStreamAddress);
}else{
formData.append("VideoStreamAddress",form.videoStreamAddress);
}
axios({
method: "post",
url: serverUrl.dataUrl,
@ -419,7 +424,7 @@ destroyed: function () {
message: r.data.msg,
type: 'success'
});
this.form.videoStreamAddress=r.data.data
}
}
}).catch(e => {
@ -427,9 +432,10 @@ destroyed: function () {
});
}
},
goToPage(id,num,name,type) {
goToPage(id,num,name,type,status) {
this.$router.push({path:'index',query: {id:id,num:num,name:name,type:type}})
this.$router.push({path:'index',query: {id:id,num:num,name:name,type:type,status:status
}})
},
//获取视频数据

127
src/views/bounced/analysisPreview.vue
View File

@ -109,44 +109,38 @@ export default {
// console.log("[MQTT-TEST] 已连接的客户端ID: ", connect);
// 订阅
this.mqttClient.subscribe('img0', { qos: 0 });
// this.client.connect('aaa', '111')
this.mqttClient.publish('aaa', '111');
// this.mqttClient.subscribe('msg_stream', { msg_flag: 0 });
this.mqttClient.subscribe('img1', { qos: 0 });
this.mqttClient.subscribe('img2', { qos: 0 });
this.mqttClient.subscribe('img3', { qos: 0 });
this.mqttClient.subscribe('img4', { qos: 0 });
this.mqttClient.subscribe('img5', { qos: 0 });
this.mqttClient.subscribe('img6', { qos: 0 });
this.mqttClient.subscribe('img7', { qos: 0 });
this.mqttClient.subscribe('stream0', { qos: 0 });
this.mqttClient.subscribe('stream1', { qos: 0 });
this.mqttClient.subscribe('stream2', { qos: 0 });
this.mqttClient.subscribe('stream3', { qos: 0 });
this.mqttClient.subscribe('stream4', { qos: 0 });
this.mqttClient.subscribe('stream5', { qos: 0 });
this.mqttClient.subscribe('stream6', { qos: 0 });
this.mqttClient.subscribe('stream7', { qos: 0 });
});
// 接收回调
this.mqttClient.on("message", (topic, message, packet) => {
this.mqttClient.on("message", (topic, message, packet) => {
if (topic.indexOf("img0") != -1) {
try {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
// debugger
// console.log("msg", msg) //msg为转换后的JSON数据
// console.log("1111",document.getElementById("mapModule"))
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
// this.imgUrl = 'data:image/png;base64,' + msg.pic;
// console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)
// console.log("imageUrl", imageUrl)
console.log("imageUrl", imageUrl)
}
} else if (topic.indexOf("img1") != -1) {
try {
@ -155,8 +149,7 @@ export default {
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
// console.log("msg", msg) //msg为转换后的JSON数据
this.imgUrl1 = 'data:image/png;base64,' + msg.pic;
console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
@ -170,8 +163,7 @@ export default {
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
this.imgUrl2 = 'data:image/png;base64,' + msg.pic;
console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
@ -185,8 +177,7 @@ export default {
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
this.imgUrl3 = 'data:image/png;base64,' + msg.pic;
console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
@ -200,8 +191,7 @@ export default {
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
this.imgUrl4 = 'data:image/png;base64,' + msg.pic;
console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
@ -215,50 +205,89 @@ export default {
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
this.imgUrl5 = 'data:image/png;base64,' + msg.pic;
console.log("imageUrl", imageUrl)
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)
console.log("imageUrl", imageUrl)
}
} else if (topic.indexOf("stream0") != -1) {
} else if (topic.indexOf("img6") != -1) {
try {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)
console.log("imageUrl", imageUrl)
}
}else if (topic.indexOf("img7") != -1) {
try {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp) //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log("msg", msg) //msg为转换后的JSON数据
document.getElementById("mapModule").contentWindow.getDestination(JSON.stringify(msg))
} catch {
let imageType = 'arraybuffer';
const blob = new Blob([message], { type: imageType })
const imageUrl = (window.URL || window.webkitURL).createObjectURL(blob)
console.log("imageUrl", imageUrl)
}
}else if (topic.indexOf("stream0") != -1) {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
} else if (topic.indexOf("stream1") != -1) {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date(),
new Date().getMilliseconds()
);
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
} else if (topic.indexOf("stream2") != -1) {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date(),
new Date().getMilliseconds()
);
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
} else if (topic.indexOf("stream3") != -1) {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date(),
new Date().getMilliseconds()
);
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
} else if (topic.indexOf("stream4") != -1) {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date(),
new Date().getMilliseconds()
);
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
} else if (topic.indexOf("stream5") != -1) {
console.log(
`[MQTT-TEST] 从主题 "${topic}" 收到的内容: ${message.toString()}`,
new Date(),
new Date().getMilliseconds()
);
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
}else if (topic.indexOf("stream6") != -1) {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
}else if (topic.indexOf("stream7") != -1) {
const utf8decoder = new TextDecoder()
const u8arr = new Uint8Array(message)
const temp = utf8decoder.decode(u8arr) // 将二进制数据转为字符串
const msg = JSON.parse(temp)
document.getElementById("mapModule").contentWindow.getData(JSON.stringify(msg))
}
});

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

@ -348,7 +348,7 @@ export default {
sections[i].style.height = 500
return
} else if (sections[i].firstChild.offsetHeight + 30 <1030) {
this.$refs.dataBoard.style.height = '1030px'
// this.$refs.dataBoard.style.height = '1030px'
}
sections[i].style.height = sections[i].firstChild.offsetHeight + 20 + 'px';
} else {
@ -390,7 +390,7 @@ export default {
mounted() {
let dataBoard = document.querySelector('.dataBoard')
if (this.regionData.length <= 2 || this.sectionData.length <= 2) {
dataBoard.style.height = '1030px'
// dataBoard.style.height = '1030px'
} else {
dataBoard.style.height = 'auto'
}

261
src/views/index.vue
View File

@ -12,9 +12,13 @@
frameborder="0"
style="width: 100%; height:100%;"
scrolling="no"
v-if="videoUnityShow"
></iframe>
<!-- <iframe src="./VideoWeb/index.html" style="height: 100%; width: 100%;border: none"
ref="iframe"></iframe> -->
<!-- <iframe src="./VideoWeb/index.html" style="height: 100%; width: 100%;border: none" ref="iframe"></iframe> -->
<el-empty :description="description" v-if="videoAnalysisShow">
<!-- <el-button type="primary">按钮</el-button> -->
<!-- <el-button type="primary" size="mini" @click="videoAnalysisBtn" v-if="videoAnalysisShow">视频分析</el-button> -->
</el-empty>
</div>
</el-tab-pane>
<el-tab-pane label="数据看板" name="second">
@ -31,33 +35,10 @@
<el-button class="videoAnalysis" type="primary" size="mini" @click="videoAnalysisBtn" v-if="videoAnalysisShow"
>视频分析</el-button
>
<el-button class="trafficAnalysis" type="primary" plain size="mini" @click="trafficAnalysisBtn" v-if="trafficAnalysisShow"
<el-button class="trafficAnalysis" type="primary" plain size="mini" @click="trafficAnalysisBtn" v-if="trafficAnalysisShow" :disabled='disabledTrafficAnalysis'
>交通分析</el-button
>
</div>
<!-- <div id="dialog" style="height:500px"> -->
<!-- <el-dialog class="new-dialog" :title="title+'组件'" :modal="false" :close-on-click-modal="false" :visible.sync="dialogFormVisible" v-alterELDialogMarginTop="{marginTop:'0vh'}" customClass='customWidth' width="100%" @close='closeForm(form)'>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="组件名称">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="断面方向" v-if="form.type=='断面'">
<el-select v-model="form.Direction" placeholder="请选择类型">
<el-option label="正向" value="正向"></el-option>
<el-option label="反向" value="反向"></el-option>
<el-option label="双向" value="双向"></el-option>
</el-select>
</el-form-item>
<el-form-item label="速度阈值" v-if="form.type=='区域'">
<el-input-number v-model="form.StoppingSpeed" :precision="1" :step="0.1"></el-input-number>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit(form)">确认</el-button>
<el-button @click="closeFigure(form)">取消</el-button>
</el-form-item>
</el-form>
</el-dialog> -->
<el-drawer
class="new-dialog"
:visible.sync="dialogFormVisible"
@ -104,31 +85,26 @@
<el-form-item label="类型筛选：" v-if="componentForm.componentType == '类型'">
<el-checkbox-group v-model="componentForm.type" @change="handleTypeData">
<el-checkbox v-for="item in typeData" :label="item" :key="item">{{ item }}</el-checkbox>
<!-- <el-checkbox label="小汽车" name="type" ></el-checkbox>
<el-checkbox label="公交车" name="type" ></el-checkbox>
<el-checkbox label="卡车" name="type" ></el-checkbox>
<el-checkbox label="非机动车" name="type" ></el-checkbox>
<el-checkbox label="行人" name="type" ></el-checkbox> -->
</el-checkbox-group>
</el-form-item>
<el-form-item label="数值筛选：" v-if="componentForm.componentType != 'OD'">
<el-form-item label="数值筛选：" v-if="componentForm.componentType != 'OD' &&componentForm.componentType != '类型'&&componentForm.componentType != '流量'">
<el-input-number v-model="componentForm.startValue"></el-input-number>
<el-input-number v-model="componentForm.endValue" style="margin-left:5%"></el-input-number>
</el-form-item>
<el-form-item label="时间模式：">
<el-select v-model="componentForm.timeMode" placeholder="请选择时间模式">
<el-option label="触发" value="touch"></el-option>
<el-option label="触发" value="触发" v-if="componentForm.componentType != '延误'&&componentForm.componentType != '拥堵'"></el-option>
<el-option
label="周期时刻"
value="timeing"
value="周期时刻"
v-if="
componentForm.componentType != '排队数' &&
componentForm.componentType != '排队数' &&
componentForm.componentType != '检测数' &&
componentForm.componentType != '延误' &&
componentForm.componentType != '拥堵'
"
></el-option>
<el-option label="周期统计" value="date" v-if="componentForm.componentType != 'OD'"></el-option>
componentForm.componentType != '拥堵'&&
componentForm.componentType != '流量'
"></el-option>
<el-option label="周期统计" value="周期统计" v-if="componentForm.componentType != 'OD'"></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="触发类型：" v-if="componentForm.timeModel=='touch'">
@ -137,12 +113,18 @@
<el-radio label="间隔"></el-radio>
</el-radio-group>
</el-form-item> -->
<el-form-item label="周期间隔：" v-if="componentForm.timeMode != 'touch'">
<el-form-item label="周期间隔：" v-if="componentForm.timeMode != '触发'">
<!-- <el-slider v-model="componentForm.cycleInterval" show-input>
</el-slider> -->
<div style="display:inline">
<el-select v-model="componentForm.company" placeholder="请选择单位" @change="changeCompany">
<el-option v-for="item in timeSelect" :key="item.value" :label="item.label" :value="item.value"></el-option>
<!-- <el-option v-for="item in timeSelect" :key="item.value" :label="item.label" :value="item.value"></el-option> -->
<el-option label="秒" value="秒" v-if="componentForm.timeMode != '周期统计'"></el-option>
<el-option
label="分钟"
value="分钟"
></el-option>
<el-option label="小时" value="小时" ></el-option>
</el-select>
<el-slider v-model="componentForm.cycleInterval" :max="max"> </el-slider>
</div>
@ -229,6 +211,7 @@ export default {
dialogFormVisible: false,
areaComponent: false,
indexModule: false,
disabledTrafficAnalysis:true,
//判断模拟区，画布区
numberNew: 1,
speed: false,
@ -275,7 +258,7 @@ export default {
titName: '',
componentForm: {
//单位
company: '秒',
company: '',
componentName: '',
componentParameterId: '01888e05fac246b29e3a19a27c3d2ab0',
//周期间隔
@ -289,7 +272,7 @@ export default {
presentationForm: '',
presentation: [],
startValue: '',
timeMode: '触发',
timeMode: '',
type: [],
startSection: [],
endSection: [],
@ -297,7 +280,8 @@ export default {
typeFiltering: '',
typeData: []
},
typeData: ['小汽车', '公交车', '卡车', '非机动车', '行人'],
// typeData: ['小汽车', '公交车', '卡车', '非机动车', '行人'],
typeData:['机动车','非机动车','行人'],
//展现形式
presentation: ['数值', '表格', '时间曲线图', '均值图'],
@ -357,7 +341,20 @@ export default {
//视频类型
videoType: '',
videoAnalysisShow: false,
trafficAnalysisShow: false
trafficAnalysisShow: false,
//控制unity展示
videoUnityShow:true,
videoAnalysisSta:'',
analysis:{
trafficAnalysisPath1:'',
trafficAnalysisPath2:'',
videoAnalysisPath:'',
videoName:'',
videoPath:'',
videoTotalFrames:'',
videoType:''
},
description:'请点击视频分析'
};
},
@ -378,13 +375,22 @@ export default {
this.VideoId = this.$route.query.id;
this.number = this.$route.query.num;
this.titName = this.$route.query.name;
this.videoType = this.$route.query.type;
if (this.videoType != '实时视频') {
// this.videoType = this.$route.query.type;
if (this.$route.query.type == '实时视频') {
this.videoAnalysisShow = false;
this.trafficAnalysisShow = false;
document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
} else {
this.videoAnalysisShow = true;
this.trafficAnalysisShow = true;
// if(this.$route.query.status=='未分析'){
// // document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
// }else{
// }
this.getAnalysisStatus()
}
},
mounted() {
@ -393,16 +399,14 @@ export default {
// this.getSingleComponentIdN()
this.componentForm.company = this.timeSelect[0].value;
this.createMqtt();
},
methods: {
/** 创建mqtt */
createMqtt() {
//创建链接，接收数据
this.topicSends = ['stream' + this.number, 'trajectory' + this.number, 'detection' + this.number];
// console.log(window.PubScribe,'********************');
this.topicSends = ['stream' + this.number, 'trajectory' + this.number, 'detection' + this.number,'trigger'+ this.$route.query.id];
window.PubScribe(this.topicSends, this.number, this.realInfo);
// mqtt = mqttConfig;
/*mqtt = new mqttConfig(this.topicSends);
client = mqtt.createConnect();
@ -429,16 +433,71 @@ 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 == '分析中'){
}else if(res.data.data.videoAnalysisStatus == '已分析'){
this.videoUnityShow = true
this.videoAnalysisSta = res.data.data.videoAnalysisStatus
this.analysisData()
}else if(res.data.data.trafficAnalysisStatus==''){
}else if(res.data.data.trafficAnalysisStatus==''){
}
});
},
//分析视频按钮
videoAnalysisBtn() {
startVideoAnalysis(this.$route.query.id).then(res => {
//
if(res.data.msg=='请求成功'){
this.$message({
message: '启动成功',
type: 'success'
});
if(this.videoAnalysisSta=='已分析'){
}else if(this.videoAnalysisSta=='分析中'){
this.description = '正在分析中'
setTimeout(() => {
this.getAnalysisStatus()
}, 5000);
}else if(this.videoAnalysisSta=='未分析'){
// setTimeout(() => {
// this.getAnalysisStatus()
// }, 5000);
}
}
});
},
//交通分析
trafficAnalysisBtn() {
startTrafficAnalysis(this.$route.query.id).then(res => {
//
console.log("res.data",res.data.data)
});
},
//获取视频分析结果
analysisData(){
getAnalysisData(this.$route.query.id).then(res => {
console.log("res.data.data",res.data.data)
this.analysis.trafficAnalysisPath1 = res.data.data.trafficAnalysisPath1
this.analysis.trafficAnalysisPath2 = res.data.data.trafficAnalysisPath2
this.analysis.videoAnalysisPath = res.data.data.videoAnalysisPath
this.analysis.videoName = res.data.data.videoName
this.analysis.videoPath = res.data.data.videoPath
this.analysis.videoTotalFrames = res.data.data.videoTotalFrames
this.analysis.videoType=this.$route.query.type
});
},
//停止订阅mqtt
@ -452,9 +511,14 @@ export default {
realInfo(topic, message) {
switch (topic) {
// 接收托片
case 'img0':
case 'img1':
case 'img2':
case 'img'+this.number:
// case 'img1':
// case 'img2':
// case 'img3':
// case 'img4':
// case 'img5':
// case 'img6':
// case 'img7':
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
@ -469,9 +533,14 @@ export default {
} catch (error) {}
break;
// 树结构
case 'stream0':
case 'stream1':
case 'stream2':
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);
@ -481,10 +550,14 @@ export default {
} catch (error) {}
break;
// 控制台输出
case 'trajectory0':
case 'trajectory1':
case 'trajectory2':
case 'trajectory3':
case 'trajectory'+this.number:
// case 'trajectory1':
// case 'trajectory2':
// case 'trajectory3':
// case 'trajectory4':
// case 'trajectory5':
// case 'trajectory6':
// case 'trajectory7':
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
@ -497,9 +570,14 @@ export default {
} catch (error) {}
break;
// 触发
case 'detection0':
case 'detection1':
case 'detection2':
case 'detection'+this.number:
// case 'detection1':
// case 'detection2':
// case 'detection3':
// case 'detection4':
// case 'detection5':
// case 'detection6':
// case 'detection7':
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
@ -522,6 +600,17 @@ export default {
}
} catch (error) {}
break;
case 'trigger'+this.$route.query.id:
try {
const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = [];
const msgN = JSON.parse(temp);
console.log("trigger_msgN",msgN)
} catch (error) {}
break;
}
this.receiveNews = '';
},
@ -539,6 +628,7 @@ export default {
//初始化unity
OnSceneN() {
document.getElementById('mapModule').contentWindow.postVideoId(JSON.stringify(this.$route.query.id));
document.getElementById('mapModule').contentWindow.lixianVideo(JSON.stringify(this.analysis));
},
// //新增组件根据组件id获取单个组件数据
getSingleComponentIdN(id, type, name) {
@ -556,11 +646,21 @@ export default {
if (res.data.data.company != '') {
this.componentForm.company = res.data.data.company;
}
if (res.data.data.timeMode != '') {
this.componentForm.timeMode = res.data.data.timeMode;
}
// this.componentForm.componentName = res.data.data.componentName+'-'+type
this.componentForm.componentName = res.data.data.componentName;
if (res.data.data.timeMode != '') {
this.componentForm.timeMode = res.data.data.timeMode;
}else{
console.log("this.componentForm.timeMode",this.componentForm.timeMode);
console.log("this.componentForm.componentType",this.componentForm.componentType);
if(this.componentForm.componentType=='延误'||this.componentForm.componentType=='拥堵'){
console.log("this.componentForm.timeMode",this.componentForm.timeMode);
this.componentForm.timeMode = '周期统计'
}else{
this.componentForm.timeMode = '触发'
}
}
this.componentForm.componentParameterId = res.data.data.componentParameterId;
this.componentForm.cycleInterval = res.data.data.cycleInterval;
this.componentForm.startSectionIds = res.data.data.startSectionIds;
@ -658,6 +758,12 @@ export default {
}
if (res.data.data.timeMode != '') {
this.componentForm.timeMode = res.data.data.timeMode;
}else{
if(this.componentForm.componentType=='延误'||this.componentForm.componentType=='拥堵'){
this.componentForm.timeMode = '周期统计'
}else{
this.componentForm.timeMode = '触发'
}
}
// this.componentForm.componentName = res.data.data.componentName+'-'+type
this.componentForm.componentName = res.data.data.componentName;
@ -812,6 +918,15 @@ export default {
message: res.data.msg,
type: 'success'
});
setTimeout(() => {
this.$message({
type: "warning",
message: "请点击交通分析，获取最新数据！",
showClose: true,
duration:0,
});
}, 5000);
document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data));
document
.getElementById('mapModule')
@ -861,6 +976,14 @@ export default {
message: res.data.msg,
type: 'success'
});
setTimeout(() => {
this.$message({
type: "warning",
message: "请点击交通分析，获取最新数据！",
showClose: true,
duration:0,
});
}, 5000);
console.log('startFigureName', this.startFigureName);
document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data));
console.log('this.numberNew', this.numberNew);
@ -953,7 +1076,7 @@ export default {
this.component = false;
this.componentForm = {
//单位
company: '秒',
company: '',
componentName: '',
componentParameterId: '01888e05fac246b29e3a19a27c3d2ab0',
//周期间隔
@ -967,7 +1090,7 @@ export default {
presentationForm: '',
presentation: [],
startValue: '',
timeMode: '触发',
timeMode: '',
type: [],
startSection: [],
endSection: [],