Skip to content

platform / fanxing_new

Go to a project
Commit 8f739a8a by 潘建波
Options

修改展示页 上线环境IP

1 parent 91972a43
Inline Side-by-side
Showing 11 changed files with 581 additions and 508 deletions
src/App.vue
...@@ -16,7 +16,7 @@ export default { ...@@ -16,7 +16,7 @@ export default {
} }
let token = localStorage.getItem("atoken"); let token = localStorage.getItem("atoken");
if (!token) { if (!token) {
alert('errtoken') console.log('errtoken')
this.$router.push("/login"); this.$router.push("/login");
} }
}, },
......
src/api/baseUrl.js
...@@ -10,7 +10,7 @@ switch (process.env.NODE_ENV) { ...@@ -10,7 +10,7 @@ switch (process.env.NODE_ENV) {
baseUrl = "https://pre-server.feleti.cn"; // 预上线环境url baseUrl = "https://pre-server.feleti.cn"; // 预上线环境url
break; break;
case "production": case "production":
baseUrl = "http://192.168.9.133:20080"; // 生产环境url baseUrl = "http://vion-panda.51vip.biz:52510"; // 生产环境url
break; break;
} }
......
src/api/resource/index.js
import api from '../index' import api from "../index";
import baseUrl from '../baseUrl' import baseUrl from "../baseUrl";
export default { export default {
devs(params){ devs(params) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs`, params) return api.get(`${baseUrl}/api/v1/devconf_fx/devs`, params);
}, },
treeList(params,id) { treeList(params, id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchan_struct`, params) return api.get(
}, `${baseUrl}/api/v1/devconf_fx/devs/${id}/vchan_struct`,
getVideoList(params,id) { params
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params) );
}, },
addCode(params,id) { getVideoList(params, id) {
return api.post(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params) return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params);
}, },
addNode(params,id){ addCode(params, id) {
return api.post(`${baseUrl}/api/v1/org`, params) return api.post(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params);
}, },
getCode(params,id){ addNode(params, id) {
return api.get(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params) return api.post(`${baseUrl}/api/v1/org`, params);
}, },
editCamera(params,id,unid){ getCode(params, id) {
return api.post(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`, params) return api.get(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes`, params);
}, },
delCode(params,id,unid){ editCamera(params, id, unid) {
return api.delete(`${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`, params) return api.post(
}, `${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`,
delOrg(params,id){ params
return api.delete(`${baseUrl}/api/v1/org/${id}`, params) );
}, },
delCamera(params,id,id2){ delCode(params, id, unid) {
return api.delete(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params) return api.delete(
}, `${baseUrl}/api/v1/codes/custom/cates/${id}/codes/${unid}`,
getCameraTable(params,id,id2){ params
console.log(id2) );
if(id2){ },
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params) delOrg(params, id) {
}else{ return api.delete(`${baseUrl}/api/v1/org/${id}`, params);
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params) },
} delCamera(params, id, id2) {
}, return api.delete(
editVideo(params,id,id2){ `${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`,
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params) params
}, );
editCamera(params,id,id2){ },
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`, params) getCameraTable(params, id, id2) {
}, console.log(id2);
uploadFile(params,id){ if (id2) {
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vfile_vchans`, params,{'Content-Type': 'multipart/form-data'}) return api.get(
}, `${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`,
params
);
} else {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params);
}
},
editVideo(params, id, id2) {
return api.post(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`,
params
);
},
addCamera(params, id) {
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans`, params);
},
editCamera(params, id, id2) {
return api.post(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/vchans/${id2}`,
params
);
},
uploadFile(params, id) {
return api.post(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/vfile_vchans`,
params,
{ "Content-Type": "multipart/form-data" }
);
},
getResource(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/status`, params)
},
getDevsName(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/fx_devs`, params)
},
getStoreConList(params){
return api.get(`${baseUrl}/api/v1/devconf_fx/store_confs`, params)
},
uploadStore(params){
return api.post(`${baseUrl}/api/v1/devconf_fx/store_confs`, params,{'Content-Type': 'multipart/form-data'})
},
getSubTask(params,id){
return api.get(`${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtasks`, params)
},
delStore(params,id){
return api.delete(`${baseUrl}/api/v1/devconf_fx/store_confs/${id}`, params)
},
getsip(params,id,id2){
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/sip_server`, params)
},
addSip(params,id,id2){
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/sip_server`, params)
},
editSip(params,id,id2,id3){
return api.post(`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/${id3}/sip_server`, params)
},
delSip(params,id,id2,id3){
return api.delete(`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/${id3}/sip_server`, params)
}
}
\ No newline at end of file \ No newline at end of file
getResource(params, id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/status`, params);
},
getDevsName(params, id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${id}/fx_devs`, params);
},
getStoreConList(params) {
return api.get(`${baseUrl}/api/v1/devconf_fx/store_confs`, params);
},
uploadStore(params) {
return api.post(`${baseUrl}/api/v1/devconf_fx/store_confs`, params, {
"Content-Type": "multipart/form-data"
});
},
getSubTask(params, id) {
return api.get(`${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtasks`, params);
},
delStore(params, id) {
return api.delete(`${baseUrl}/api/v1/devconf_fx/store_confs/${id}`, params);
},
getsip(params, id, id2) {
return api.get(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/sip_server`,
params
);
},
addSip(params, id, id2) {
return api.post(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/sip_server`,
params
);
},
editSip(params, id, id2, id3) {
return api.post(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/${id3}/sip_server`,
params
);
},
delSip(params, id, id2, id3) {
return api.delete(
`${baseUrl}/api/v1/devconf_fx/devs/${id}/${id2}/${id3}/sip_server`,
params
);
}
};
src/views/Show.vue
<template> <template>
<div class=""> <div class>
<el-header class="headers"> <el-header class="headers">
<span class="title">实事分析展示</span> <span class="title">实事分析展示</span>
</el-header> </el-header>
<el-container style="min-height:calc(100vh - 64px);" class="showbox"> <el-container style="min-height:calc(100vh - 64px);" class="showbox">
<el-main style="padding: 12px;overflow:hidden"> <el-main style="padding: 12px;overflow:hidden">
<div style="margin-bottom: 12px;"> <div style="margin-bottom: 12px;">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="15"> <el-col :span="15">
<div class="videoCon"> <div class="videoCon">
<!-- 加入视频 --> <!-- 加入视频 -->
<videoplay ref="videoplay" :playurl="playurl"></videoplay> <videoplay ref="videoplay" :playurl="playurl"></videoplay>
</div> </div>
</el-col> </el-col>
<el-col :span="9"> <el-col :span="9">
<div class="imgCon"> <div class="imgCon">
<div class="imgDiv"> <div class="imgDiv">
<!-- 加入img 100% --> <!-- 加入img 100% -->
<div v-if="resultData[0]"> <div v-if="resultData[0]">
<img :src = "resultData[0].pic" class="photos"/> <img :src="resultData[0].pic" class="photos" />
</div> </div>
</div> </div>
<div style="padding:0 10px 10px 10px"> <div style="padding:0 10px 10px 10px">
<div class="textDiv"> <div class="textDiv">
<div v-if="resultData[0]"> <div v-if="resultData[0]">
<p>抓拍时间：{{resultData[0].shoot_dt}}</p> <p>抓拍时间：{{ resultData[0].shoot_dt }}</p>
<p>抓拍地点：{{resultData[0].location_name}}</p> <p>抓拍地点：{{ resultData[0].location_name }}</p>
<p>车牌号码：{{resultData[0].vehicle_plate_text}}</p> <p>车牌号码：{{ resultData[0].vehicle_plate_text }}</p>
<p>车辆类型：{{resultData[0].vehicle_body_type_text}}</p> <p>
<p>车身颜色：{{resultData[0].vehicle_body_color_text}}</p> 车辆类型：{{ resultData[0].vehicle_body_type_text }}
<p>违法类型：{{resultData[0].illegal_text}}</p> </p>
</div> <p>
</div> 车身颜色：{{ resultData[0].vehicle_body_color_text }}
</div> </p>
<p>违法类型：{{ resultData[0].illegal_text }}</p>
</div> </div>
</el-col> </div>
</el-row> </div>
<div style="clear: both;"></div> </div>
</div> </el-col>
<el-row class="bottomDiv" :gutter="10"> </el-row>
<!-- 循环生成lDiv --> <div style="clear: both;"></div>
<el-col :span="8" class="lDiv"> </div>
<div class="leftImg"> <el-row class="bottomDiv" :gutter="10">
<!-- 加入img 100% --> <!-- 循环生成lDiv -->
<div v-if="resultData[1]"> <el-col :span="8" class="lDiv">
<img :src = "resultData[1].pic" class="photos"/> <div class="leftImg">
</div> <!-- 加入img 100% -->
</div> <div v-if="resultData[1]">
<div class="rightDiv"> <img :src="resultData[1].pic" class="photos" />
<div v-if="resultData[1]"> </div>
<p>抓拍时间：{{resultData[1].shoot_dt}}</p> </div>
<p>抓拍地点：{{resultData[1].location_name}}</p> <div class="rightDiv">
<p>车牌号码：{{resultData[1].vehicle_plate_text}}</p> <div v-if="resultData[1]">
<p>车辆类型：{{resultData[1].vehicle_body_type_text}}</p> <p>抓拍时间：{{ resultData[1].shoot_dt }}</p>
<p>车身颜色：{{resultData[1].vehicle_body_color_text}}</p> <p>抓拍地点：{{ resultData[1].location_name }}</p>
<p>违法类型：{{resultData[1].illegal_text}}</p> <p>车牌号码：{{ resultData[1].vehicle_plate_text }}</p>
</div> <p>车辆类型：{{ resultData[1].vehicle_body_type_text }}</p>
</div> <p>车身颜色：{{ resultData[1].vehicle_body_color_text }}</p>
<div style="clear: both;"></div> <p>违法类型：{{ resultData[1].illegal_text }}</p>
</el-col> </div>
</div>
<el-col :span="8" class="lDiv"> <div style="clear: both;"></div>
<div class="leftImg"> </el-col>
<!-- 加入img 100% -->
<div v-if="resultData[2]"> <el-col :span="8" class="lDiv">
<img :src = "resultData[2].pic" class="photos"/> <div class="leftImg">
</div> <!-- 加入img 100% -->
</div> <div v-if="resultData[2]">
<div class="rightDiv"> <img :src="resultData[2].pic" class="photos" />
<div v-if="resultData[2]"> </div>
<p>抓拍时间：{{resultData[2].shoot_dt}}</p> </div>
<p>抓拍地点：{{resultData[2].location_name}}</p> <div class="rightDiv">
<p>车牌号码：{{resultData[2].vehicle_plate_text}}</p> <div v-if="resultData[2]">
<p>车辆类型：{{resultData[2].vehicle_body_type_text}}</p> <p>抓拍时间：{{ resultData[2].shoot_dt }}</p>
<p>车身颜色：{{resultData[2].vehicle_body_color_text}}</p> <p>抓拍地点：{{ resultData[2].location_name }}</p>
<p>违法类型：{{resultData[2].illegal_text}}</p> <p>车牌号码：{{ resultData[2].vehicle_plate_text }}</p>
</div> <p>车辆类型：{{ resultData[2].vehicle_body_type_text }}</p>
</div> <p>车身颜色：{{ resultData[2].vehicle_body_color_text }}</p>
<div style="clear: both;"></div> <p>违法类型：{{ resultData[2].illegal_text }}</p>
</el-col> </div>
</div>
<el-col :span="8" class="lDiv"> <div style="clear: both;"></div>
<div class="leftImg"> </el-col>
<!-- 加入img 100% -->
<div v-if="resultData[3]"> <el-col :span="8" class="lDiv">
<img :src = "resultData[3].pic" class="photos"/> <div class="leftImg">
</div> <!-- 加入img 100% -->
</div> <div v-if="resultData[3]">
<div class="rightDiv"> <img :src="resultData[3].pic" class="photos" />
<div v-if="resultData[3]"> </div>
<p>抓拍时间：{{resultData[3].shoot_dt}}</p> </div>
<p>抓拍地点：{{resultData[3].location_name}}</p> <div class="rightDiv">
<p>车牌号码：{{resultData[3].vehicle_plate_text}}</p> <div v-if="resultData[3]">
<p>车辆类型：{{resultData[3].vehicle_body_type_text}}</p> <p>抓拍时间：{{ resultData[3].shoot_dt }}</p>
<p>车身颜色：{{resultData[3].vehicle_body_color_text}}</p> <p>抓拍地点：{{ resultData[3].location_name }}</p>
<p>违法类型：{{resultData[3].illegal_text}}</p> <p>车牌号码：{{ resultData[3].vehicle_plate_text }}</p>
</div> <p>车辆类型：{{ resultData[3].vehicle_body_type_text }}</p>
</div> <p>车身颜色：{{ resultData[3].vehicle_body_color_text }}</p>
<div style="clear: both;"></div> <p>违法类型：{{ resultData[3].illegal_text }}</p>
</el-col> </div>
</div>
<div style="clear: both;"></div> <div style="clear: both;"></div>
</el-row> </el-col>
</el-main>
</el-container> <div style="clear: both;"></div>
</el-row>
</el-main>
</el-container>
</div> </div>
</template> </template>
<script> <script>
import videoplay from './public/videoPlay' import videoplay from "./public/videoPlay";
export default { export default {
name: "home", name: "home",
data(){ data() {
return{ return {
isCollapse: false, isCollapse: false,
conHeight:0, conHeight: 0,
playurl:'', playurl: "",
subtaskid:'', subtaskid: "",
taskid:'', taskid: "",
showws:null, showws: null,
keepAlive:null, keepAlive: null,
quitws:false, quitws: false,
resultData:[] resultData: []
}; };
},
created() {
let url = location.href;
let params = url.split("?")[1];
this.taskid = this.getQueryVariable("taskid");
this.subtaskid = this.getQueryVariable("subtaskid");
this.playurl = this.getQueryVariable("playurl");
}, },
created(){
this.taskid = this.$route.params.taskid
this.subtaskid = this.$route.params.subtaskid
this.playurl = this.$route.params.playurl
},
mounted(){ mounted() {
this.$refs.videoplay.videoPlay()
this.$refs.videoplay.videoPlay();
}, },
components: { components: {
videoplay videoplay
// HelloWorld // HelloWorld
}, },
methods:{ methods: {
connectwebsocket(type) { connectwebsocket(type) {
let that = this; let that = this;
this.connect_id = new Date().getTime(); this.connect_id = new Date().getTime();
this.showws = new WebSocket( this.showws = new WebSocket(
...@@ -151,17 +156,18 @@ export default { ...@@ -151,17 +156,18 @@ export default {
this.connect_id this.connect_id
); );
this.showws.onopen = () => { this.showws.onopen = () => {
console.log("ws事件推送服务连接成功"); console.log("ws事件推送服务连接成功");
let send_mesage = let send_mesage =
'{"type":"request","connect_id": "' + '{"type":"request","connect_id": "' +
this.connect_id + this.connect_id +
'","subtask_id":"' + '","subtask_id":"' +
this.subtaskid + this.subtaskid +
'"}'; '"}';
this.showws.send(send_mesage); this.showws.send(send_mesage);
}; };
this.showws.onmessage = evt => { this.showws.onmessage = evt => {
let data = JSON.parse(evt.data); let data = JSON.parse(evt.data);
// eslint-disable-next-line no-empty
if (data.command) { if (data.command) {
} else if (data.type == "response") { } else if (data.type == "response") {
console.log("请求任务推送成功"); console.log("请求任务推送成功");
...@@ -169,15 +175,18 @@ export default { ...@@ -169,15 +175,18 @@ export default {
if (data.event_cate != "flow") { if (data.event_cate != "flow") {
try { try {
data.picsEmpty = data.pics.length == 0 ? true : false; data.picsEmpty = data.pics.length == 0 ? true : false;
data.pic = data.pic =
data.pics[0].src_url || "data:image/jpeg;base64," + data.pics[0].pic_base64; data.pics[0].src_url ||
data.bigpic = data.pics[0].src_url || "data:image/jpeg;base64," + data.pics[0].pic_base64; "data:image/jpeg;base64," + data.pics[0].pic_base64;
that.$buildCode.init(data); data.bigpic =
if(that.resultData.length > 4) { data.pics[0].src_url ||
that.resultData.pop(data) "data:image/jpeg;base64," + data.pics[0].pic_base64;
} else { that.$buildCode.init(data);
that.resultData.unshift(data) if (that.resultData.length > 4) {
} that.resultData.pop(data);
} else {
that.resultData.unshift(data);
}
} catch (err) { } catch (err) {
console.log(err); console.log(err);
} }
...@@ -205,33 +214,44 @@ export default { ...@@ -205,33 +214,44 @@ export default {
} catch (err) { } catch (err) {
console.log(err); console.log(err);
} }
},
getQueryVariable(variable) {
var query = window.location.href.split("?")[1];
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return false;
} }
}, },
beforeMount() { beforeMount() {
this.connectwebsocket(); this.connectwebsocket();
//监听成功 //监听成功
this.showws.onopen = ()=> { this.showws.onopen = () => {
let send_mesage = let send_mesage =
'{"type":"request","connect_id": "' + '{"type":"request","connect_id": "' +
this.connect_id + this.connect_id +
'","subtask_id":"' + '","subtask_id":"' +
this.subtaskid + this.subtaskid +
'"}'; '"}';
this.showws.send(send_mesage); this.showws.send(send_mesage);
console.log("showws事件推送服务连接成功"); console.log("showws事件推送服务连接成功");
}; };
//监听断开 //监听断开
this.showws.onclose = function() { this.showws.onclose = function() {
if(quitws) return if (quitws) return;
window.clearInterval(this.keepAlive); window.clearInterval(this.keepAlive);
this.connectwebsocket(1); this.connectwebsocket(1);
}; };
}, },
beforeDestroy() { beforeDestroy() {
this.showws.close(); this.showws.close();
this.quitws = true this.quitws = true;
try { try {
window.clearTimeout(this.keepAlive); window.clearTimeout(this.keepAlive);
} catch (error) {} } catch (error) {}
...@@ -239,80 +259,80 @@ export default { ...@@ -239,80 +259,80 @@ export default {
}; };
</script> </script>
<style scoped="scoped" lang="scss"> <style scoped="scoped" lang="scss">
.headers{
line-height: 60px;
}
.title{
font-size:24px;
font-family:MicrosoftYaHeiUI;
color:rgba(255,255,255,1);
-webkit-background-clip:text;
}
.videoCon{
background: #FFFFFF;
width:100%;
height:70vh;
}
.imgCon{
height: 70vh;
background: #FFFFFF;
}
.imgDiv{
padding:0 10px 0 10px;
height:40vh;
}
.imgDiv>div{
height: 100%;
background: #d8d8d8;
}
.lDiv{
float: left;
}
.lDiv:nth-last-of-type(2){
margin: 0;
}
.rightDiv{
width:10.5vw;
height:20vh;
border:1px solid rgba(229,229,229,1);
border-left: none;
color: #555555;
font-size: 12px;
float: left;
}
.rightDiv p{
margin: 10px 0;
margin-left: 10px;
}
.textDiv{
height:29vh;
border:1px solid rgba(229,229,229,1);
color: #555555;
font-size:22px;
}
.textDiv p{
margin: 14px 0;
margin-left: 37px;
}
.bottomDiv{
padding: 7px;
background: #FFFFFF;
display: flex;
flex-flow: row nowrap;
}
.leftImg{
width: 21vw;
height: 20.2vh;
background: #d8d8d8;
overflow: hidden;
float: left;
}
.leftImg>div{
height: 100%;
width: 100%;
}
.photos{
width: 100%;
height: 100%;
}
</style>
\ No newline at end of file \ No newline at end of file
.headers {
line-height: 60px;
}
.title {
font-size: 24px;
font-family: MicrosoftYaHeiUI;
color: rgba(255, 255, 255, 1);
-webkit-background-clip: text;
}
.videoCon {
background: #ffffff;
width: 100%;
height: 70vh;
}
.imgCon {
height: 70vh;
background: #ffffff;
}
.imgDiv {
padding: 0 10px 0 10px;
height: 40vh;
}
.imgDiv > div {
height: 100%;
background: #d8d8d8;
}
.lDiv {
float: left;
}
.lDiv:nth-last-of-type(2) {
margin: 0;
}
.rightDiv {
width: 10.5vw;
height: 20vh;
border: 1px solid rgba(229, 229, 229, 1);
border-left: none;
color: #555555;
font-size: 12px;
float: left;
}
.rightDiv p {
margin: 10px 0;
margin-left: 10px;
}
.textDiv {
height: 29vh;
border: 1px solid rgba(229, 229, 229, 1);
color: #555555;
font-size: 22px;
}
.textDiv p {
margin: 14px 0;
margin-left: 37px;
}
.bottomDiv {
padding: 7px;
background: #ffffff;
display: flex;
flex-flow: row nowrap;
}
.leftImg {
width: 21vw;
height: 20.2vh;
background: #d8d8d8;
overflow: hidden;
float: left;
}
.leftImg > div {
height: 100%;
width: 100%;
}
.photos {
width: 100%;
height: 100%;
}
</style>
src/views/resource/treeComponents/cameraDialog.vue
...@@ -170,7 +170,7 @@ ...@@ -170,7 +170,7 @@
if(this.type == 'add'){ if(this.type == 'add'){
this.$refs['cameraDialog'].validate((valid) => { this.$refs['cameraDialog'].validate((valid) => {
if (valid) { if (valid) {
this.$api.resource.addCamera(this.addVideoParam,this.devsId).then(res=>{ this.$api.resource.addCamera(this.addVideoParam,localStorage.getItem('dev_unid')).then(res=>{
if(res.ecode==200){ if(res.ecode==200){
this.$message({ this.$message({
message: res.enote, message: res.enote,
......
src/views/sceneManage/setting/area.vue
<template> <template>
<div> <div>
<el-dialog <el-dialog
title="区域设置" title="区域设置"
:visible.sync="dialogVisible" :visible.sync="dialogVisible"
width="1100px" width="1100px"
:before-close="beforeHideModal" :before-close="beforeHideModal"
> >
<TraficCanvas :bgUrl='bgUrl' v-if="type=='0' || type=='5'" ref='canvas'></TraficCanvas> <TraficCanvas
<FlowCanvas :bgUrl='bgUrl' v-if="type=='1'" ref='canvas'></FlowCanvas> :bgUrl="bgUrl"
<SafeCanvas :bgUrl='bgUrl' v-if="type=='2'" ref='canvas'></SafeCanvas> v-if="type == '0' || type == '5' || type == '3'"
<FaceCanvas :bgUrl='bgUrl' v-if="type=='4'" ref='canvas'></FaceCanvas> ref="canvas"
<ComplexCanvas :bgUrl='bgUrl' v-if="type=='7'" ref='canvas'></ComplexCanvas> ></TraficCanvas>
<FlowCanvas :bgUrl="bgUrl" v-if="type == '1'" ref="canvas"></FlowCanvas>
<SafeCanvas :bgUrl="bgUrl" v-if="type == '2'" ref="canvas"></SafeCanvas>
<FaceCanvas :bgUrl="bgUrl" v-if="type == '4'" ref="canvas"></FaceCanvas>
<ComplexCanvas
:bgUrl="bgUrl"
v-if="type == '7'"
ref="canvas"
></ComplexCanvas>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="beforeHideModal">取 消</el-button> <el-button @click="beforeHideModal">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button> <el-button type="primary" @click="save">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import TraficCanvas from "./areaconfig/TraficCanvas"; import TraficCanvas from "./areaconfig/TraficCanvas";
import FlowCanvas from "./areaconfig/FlowCanvas"; import FlowCanvas from "./areaconfig/FlowCanvas";
import SafeCanvas from "./areaconfig/SafeCanvas"; import SafeCanvas from "./areaconfig/SafeCanvas";
import FaceCanvas from "./areaconfig/FaceCanvas"; import FaceCanvas from "./areaconfig/FaceCanvas";
import ComplexCanvas from "./areaconfig/ComplexCanvas"; import ComplexCanvas from "./areaconfig/ComplexCanvas";
export default { export default {
data() { data() {
return { return {
dialogVisible: false, dialogVisible: false,
isShow: false, isShow: false,
type: '0', type: "0",
btnIsactive: false, btnIsactive: false,
showClose: false, showClose: false,
roiBody: {}, roiBody: {},
XMLStr: "", XMLStr: "",
taskData:'', taskData: "",
bgUrl:'' bgUrl: ""
}; };
}, },
components: { components: {
TraficCanvas, TraficCanvas,
SafeCanvas, SafeCanvas,
...@@ -46,87 +54,92 @@ export default { ...@@ -46,87 +54,92 @@ export default {
ComplexCanvas ComplexCanvas
}, },
methods: { methods: {
showModal: function(data,mtaskdata) { showModal: function(data, mtaskdata) {
var _this = this; var _this = this;
this.$store.commit('setocxstate',0) this.$store.commit("setocxstate", 0);
this.taskData = mtaskdata; this.taskData = mtaskdata;
this.dialogVisible =true; this.dialogVisible = true;
this.type = data.algo_type; this.type = data.algo_type;
// this.type = 2; // this.type = 2;
this.bgUrl = ""; this.bgUrl = "";
//获取视频截图 //获取视频截图
this.$api.task.cutpic(mtaskdata.vchan.vdev_unid, mtaskdata.vchan.vchan_refid,mtaskdata.subtask_id).then(data => { this.$api.task
if (!data.ecode) { .cutpic(
this.bgUrl = "data:image/png;base64," + data.pic_base64; mtaskdata.vchan.vdev_unid,
setTimeout(() => { mtaskdata.vchan.vchan_refid,
let img = document.getElementById('pic').childNodes[0] mtaskdata.subtask_id
let canvas = document.createElement("canvas"); )
canvas.width = 800; .then(data => {
canvas.height = 500; if (!data.ecode) {
try { this.bgUrl = "data:image/png;base64," + data.pic_base64;
canvas.getContext("2d").drawImage(img, 0, 0, 800, 500); setTimeout(() => {
_this.bgUrl = canvas.toDataURL("image/webp"); let img = document.getElementById("pic").childNodes[0];
} catch (error) {} let canvas = document.createElement("canvas");
}, 500); canvas.width = 800;
} else { canvas.height = 500;
alert("区域设置截图失败!" + data.enote); try {
} canvas.getContext("2d").drawImage(img, 0, 0, 800, 500);
}) _this.bgUrl = canvas.toDataURL("image/webp");
.catch(err => { } catch (error) {
console.log("区域设置截图返回异常:", err.message); console.log(error);
}); }
setTimeout(() => { }, 500);
_this.$refs.canvas.stageInit(); } else {
if (data.rois) { alert("区域设置截图失败!" + data.enote);
_this.$refs.canvas.configInit(
data.rois[0].roi
);
} }
}, 300); })
}, .catch(err => {
beforeHideModal: function() { console.log("区域设置截图返回异常:", err.message);
this.$store.commit('setocxstate',1) });
this.dialogVisible = false; setTimeout(() => {
this.$refs.canvas.clear(); _this.$refs.canvas.stageInit();
this.$refs.canvas.cindex = 0; if (data.rois) {
this.bgUrl = ""; _this.$refs.canvas.configInit(data.rois[0].roi);
},
getType: function() {
if (this.$parent.subTaskInfo) {
this.type = this.$parent.subTaskInfo.task_algo_type;
} else {
this.type = this.$parent.$parent.subTaskInfo.task_algo_type;
}
this.XMLStr = "";
this.btnIsactive = true;
try {
this.EditList(1);
} catch (error) {}
},
save: function() {
if (this.$refs.canvas.roadFlag === false) {
this.$alert("车道线有修改，请检查车道属性是否正确", "提示", {
confirmButtonText: "确定"
});
//xieminghui
// this.$refs.canvas.roadFlag = "confirm";
return;
} }
let XMLStr = this.$refs.canvas.save(); }, 300);
if (this.type == "1" && (XMLStr === "dir" || XMLStr === "in")) { },
this.$message({ beforeHideModal: function() {
type: "warning", this.$store.commit("setocxstate", 1);
message: "请检查配置是否正确" this.dialogVisible = false;
}); this.$refs.canvas.clear();
return; this.$refs.canvas.cindex = 0;
} this.bgUrl = "";
this.$parent.submit(XMLStr, "roi", this.taskData); },
this.beforeHideModal(); getType: function() {
if (this.$parent.subTaskInfo) {
this.type = this.$parent.subTaskInfo.task_algo_type;
} else {
this.type = this.$parent.$parent.subTaskInfo.task_algo_type;
}
this.XMLStr = "";
this.btnIsactive = true;
try {
this.EditList(1);
} catch (error) {
console.log(error);
}
},
save: function() {
if (this.$refs.canvas.roadFlag === false) {
this.$alert("车道线有修改，请检查车道属性是否正确", "提示", {
confirmButtonText: "确定"
});
//xieminghui
// this.$refs.canvas.roadFlag = "confirm";
return;
}
let XMLStr = this.$refs.canvas.save();
if (this.type == "1" && (XMLStr === "dir" || XMLStr === "in")) {
this.$message({
type: "warning",
message: "请检查配置是否正确"
});
return;
} }
this.$parent.submit(XMLStr, "roi", this.taskData);
this.beforeHideModal();
} }
} }
};
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped></style>
</style>
src/views/sceneManage/setting/areaconfig/TraficCanvas.vue
...@@ -2305,8 +2305,8 @@ export default { ...@@ -2305,8 +2305,8 @@ export default {
} }
}, },
mounted() { mounted() {
console.log(eventJson); // console.log(eventJson);
this.eventData = eventJson; // this.eventData = eventJson;
// this.stageInit() // this.stageInit()
key("alt+1", () => { key("alt+1", () => {
if (this.istest) { if (this.istest) {
......
src/views/sceneManage/setting/areaconfig/trafficback.vue
...@@ -2299,7 +2299,6 @@ export default { ...@@ -2299,7 +2299,6 @@ export default {
} }
}, },
mounted() { mounted() {
console.log(eventJson)
this.eventData = eventJson this.eventData = eventJson
// this.stageInit() // this.stageInit()
key('alt+1',()=>{ key('alt+1',()=>{
......
src/views/sceneManage/setting/demarcate.vue
...@@ -207,8 +207,8 @@ export default { ...@@ -207,8 +207,8 @@ export default {
this.stage.add(this.signLayer); this.stage.add(this.signLayer);
this.layers = [this.signLayer]; this.layers = [this.signLayer];
} }
console.log(this.taskData.mtasks[0].scenes[0].calibration); console.log(this.taskData.calibration);
let cal = this.taskData.mtasks[0].scenes[0].calibration; let cal = this.taskData.calibration;
if (cal === null || cal == undefined) { if (cal === null || cal == undefined) {
this.configInit(""); this.configInit("");
} }
......
src/views/sceneManage/setting/index.vue
...@@ -6,8 +6,9 @@ ...@@ -6,8 +6,9 @@
border border
stripe stripe
style="width: 80%;float:left" style="width: 80%;float:left"
height="25vh"
> >
<el-table-column label="序号" type="index" width="80"> <el-table-column label="序号" type="index" width="50" align="center">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
...@@ -27,10 +28,10 @@ ...@@ -27,10 +28,10 @@
<el-table-column prop="address" align="center" label="参数设置"> <el-table-column prop="address" align="center" label="参数设置">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="table-set"> <div class="table-set">
<span @click="setParam(scope.row)">参数设置</span> <span @click="setParam(scope.row, scope.$index)">参数设置</span>
<span @click="setArea(scope.row)">区域设置</span> <span @click="setArea(scope.row, scope.$index)">区域设置</span>
<span @click="setDemarcate(scope.row)">标定设置</span> <span @click="setDemarcate(scope.row, scope.$index)">标定设置</span>
<span @click="setTimer(scope.row)">时间设置</span> <span @click="setTimer(scope.row, scope.$index)">时间设置</span>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -127,6 +128,7 @@ export default { ...@@ -127,6 +128,7 @@ export default {
timer: 0, timer: 0,
timersel: 0, timersel: 0,
timerDialog: false, timerDialog: false,
curindex: 0,
timeroptions: [30, 40, 50, 60, 100], timeroptions: [30, 40, 50, 60, 100],
timerscenes: null, timerscenes: null,
taskInfo: { taskInfo: {
...@@ -148,14 +150,17 @@ export default { ...@@ -148,14 +150,17 @@ export default {
handleparam handleparam
}, },
methods: { methods: {
setParam() { setParam(scenesdata, index) {
this.$refs.parameter.init(this.taskInfo); this.curindex = index;
this.$refs.parameter.init(scenesdata);
}, },
setArea(roidata) { setArea(roidata, index) {
this.curindex = index;
this.$refs.areas.showModal(roidata, this.taskInfo); this.$refs.areas.showModal(roidata, this.taskInfo);
}, },
setDemarcate() { setDemarcate(scenesdata, index) {
this.$refs.demarcate.showModal(this.taskInfo); this.curindex = index;
this.$refs.demarcate.showModal(scenesdata);
}, },
handleparam(type) { handleparam(type) {
this.$refs.handleparam.show(type); this.$refs.handleparam.show(type);
...@@ -195,14 +200,15 @@ export default { ...@@ -195,14 +200,15 @@ export default {
}); });
}, },
showview() { showview() {
this.$router.push({ let routeData = this.$router.resolve({
name: "show", name: "show",
params: { query: {
taskid: this.taskid, taskid: this.taskid,
subtaskid: this.subtaskid, subtaskid: this.subtaskid,
playurl: this.playurl playurl: this.playurl
} }
}); });
window.open(routeData.href, '_blank');
}, },
submit: function(xml, type) { submit: function(xml, type) {
let postObj = { let postObj = {
...@@ -212,31 +218,23 @@ export default { ...@@ -212,31 +218,23 @@ export default {
mtask_unid: this.taskInfo.mtasks[0].mtask_unid, mtask_unid: this.taskInfo.mtasks[0].mtask_unid,
// type: 0, // type: 0,
// priority: 0, // priority: 0,
scenes: [ scenes: this.taskInfo.mtasks[0].scenes
{
scene_unid: this.taskInfo.mtasks[0].scenes[0].scene_unid,
play_urls: {
rtsp: this.vchanUrl
}
// algo_args: {}
}
]
} }
] ]
}; };
if (type == "roi") { if (type == "roi") {
postObj.mtasks[0].scenes[0].rois = [ postObj.mtasks[0].scenes[this.curindex].rois = [
{ {
roi: xml roi: xml
} }
]; ];
} else if (type == "config") { } else if (type == "config") {
postObj.mtasks[0].scenes[0].config = { postObj.mtasks[0].scenes[this.curindex].config = {
xml: xml xml: xml
}; };
} else if (type == "calibration") { } else if (type == "calibration") {
console.log(xml); console.log(xml);
postObj.mtasks[0].scenes[0].calibration = { postObj.mtasks[0].scenes[this.curindex].calibration = {
calibration: xml calibration: xml
}; };
} }
...@@ -254,14 +252,14 @@ export default { ...@@ -254,14 +252,14 @@ export default {
}); });
switch (type) { switch (type) {
case "roi": case "roi":
this.taskInfo.mtasks[0].scenes[0].rois = [ this.taskInfo.mtasks[0].scenes[this.curindex].rois = [
{ {
roi: xml roi: xml
} }
]; ];
break; break;
case "calibration": case "calibration":
this.taskInfo.mtasks[0].scenes[0].calibration = { this.taskInfo.mtasks[0].scenes[this.curindex].calibration = {
calibration: xml calibration: xml
}; };
break; break;
......
src/views/sceneManage/setting/parameter.vue
<template> <template>
<div> <div>
<el-dialog <el-dialog
title="参数设置" title="参数设置"
:visible.sync="dialogVisible" :visible.sync="dialogVisible"
width="50%" width="50%"
:before-close="handleClose"> :before-close="handleClose"
>
<span> <span>
<iframe <iframe
id="iframe" id="iframe"
ref="iframe" ref="iframe"
src="./dynamicParameters.html" src="./dynamicParameters.html"
frameborder="0" frameborder="0"
width="100%" width="100%"
height="415" height="415"
scrolling="no" scrolling="no"
></iframe> ></iframe>
</span> </span>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="handleClose">取 消</el-button> <el-button @click="handleClose">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button> <el-button type="primary" @click="save">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
dialogVisible: false, dialogVisible: false,
XMLStr:'', XMLStr: "",
basicXml:'', basicXml: "",
taskData:"" taskData: ""
}; };
}, },
methods: { methods: {
init(data){ init(data) {
this.$store.commit('setocxstate',0) this.$store.commit("setocxstate", 0);
this.dialogVisible = true; this.dialogVisible = true;
this.taskData = data; this.taskData = data;
let that = this; let that = this;
setTimeout(()=>{ setTimeout(() => {
that.xmlInit(data.mtasks[0].scenes[0]); that.xmlInit(data);
},800) }, 800);
}, },
balltaskinit(data){ balltaskinit(data) {
this.$store.commit('setocxstate',0) this.$store.commit("setocxstate", 0);
this.dialogVisible = true; this.dialogVisible = true;
setTimeout(()=>{ setTimeout(() => {
this.xmlInit(data); this.xmlInit(data);
},800) }, 800);
},
xmlInit: function(obj) {
this.XMLStr =
obj.config.xml || '<?xml version="1.0" encoding="GBK"?><root></root>';
console.log("XML:" + this.XMLStr.split("@").length);
if (this.XMLStr.split("@").length > 1) {
this.XMLStr = '<?xml version="1.0" encoding="GBK"?><root></root>';
}
this.basicXml = obj.basicConfig.xml;
this.$refs.iframe.contentWindow.loadParameterTree(
this.basicXml,
this.XMLStr
);
}, },
xmlInit: function (obj) { save: function() {
this.$refs.iframe.contentWindow.submit();
this.XMLStr = obj.config.xml || '<?xml version="1.0" encoding="GBK"?><root></root>' //ifram 传递回来的饿xml
console.log('XML:'+this.XMLStr.split('@').length) this.XMLStr = this.$refs.iframe.contentWindow.xmlStr;
if (this.XMLStr.split('@').length>1) { this.dialogVisible = false;
this.XMLStr = '<?xml version="1.0" encoding="GBK"?><root></root>' this.$parent.submit(this.XMLStr, "config");
}
this.basicXml = obj.basicConfig.xml;
this.$refs.iframe.contentWindow.loadParameterTree(this.basicXml,this.XMLStr);
}, },
save:function () {
this.$refs.iframe.contentWindow.submit();
//ifram 传递回来的饿xml
this.XMLStr = this.$refs.iframe.contentWindow.xmlStr;
this.dialogVisible = false;
this.$parent.submit(this.XMLStr,'config')
},
handleClose(done) { handleClose(done) {
this.dialogVisible = false; this.dialogVisible = false;
this.$store.commit('setocxstate',1) this.$store.commit("setocxstate", 1);
} }
} }
} };
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped></style>
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!