Skip to content

platform / fanxing_new

Go to a project
Commit 57f9f83c by 潘建波
Options

提交展示页

1 parent 63f4224b
Inline Side-by-side
Showing 3 changed files with 142 additions and 158 deletions
src/views/behaviorShow/index.vue
<template> <template>
<el-row :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"> <el-row
<el-col :span="13" > :gutter="10"
style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"
>
<el-col :span="13">
<div id="map" class="maps"> <div id="map" class="maps">
<showmap></showmap> <showmap></showmap>
<div class="eventlist-box"> <div class="eventlist-box">
...@@ -18,19 +20,19 @@ ...@@ -18,19 +20,19 @@
<div class="header-title">今日抓拍量</div> <div class="header-title">今日抓拍量</div>
<div class="collect-content"> <div class="collect-content">
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.day_total_snap_num}}</div> <div class="item-num">{{ snapData.day_total_snap_num }}</div>
<div>事件检测总量</div> <div>事件检测总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.day_single_snap_num}}</div> <div class="item-num">{{ snapData.day_single_snap_num }}</div>
<div>单项总量</div> <div>单项总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.month_total_snap_num}}</div> <div class="item-num">{{ snapData.month_total_snap_num }}</div>
<div>本月事件检测总量</div> <div>本月事件检测总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.month_single_snap_num}}</div> <div class="item-num">{{ snapData.month_single_snap_num }}</div>
<div>本月单项总量</div> <div>本月单项总量</div>
</el-col> </el-col>
</div> </div>
...@@ -61,34 +63,34 @@ ...@@ -61,34 +63,34 @@
</template> </template>
<script> <script>
import showmap from './map' import showmap from "./map";
import videoPlay from '../public/videoPlay' import videoPlay from "../public/videoPlay";
import behaviortrend from './behaviortrend' import behaviortrend from "./behaviortrend";
import behaviordis from './behaviordis' import behaviordis from "./behaviordis";
import eventList from './eventList' import eventList from "./eventList";
import alarmEvent from './alarmEvent' import alarmEvent from "./alarmEvent";
import devInfo from './devInfo' import devInfo from "./devInfo";
export default{ export default {
data(){ data() {
return{ return {
collects:{}, collects: {},
typeList:[], typeList: [],
tableData:[], tableData: [],
eventTypeList:[], eventTypeList: [],
illageList:[], illageList: [],
setShow:false, setShow: false,
archiveUnid:0, archiveUnid: 0,
snap_num:0, snap_num: 0,
audit_num:0, audit_num: 0,
snapData:{ snapData: {
day_total_snap_num:0, day_total_snap_num: 0,
day_single_snap_num:0, day_single_snap_num: 0,
month_total_snap_num:0, month_total_snap_num: 0,
month_single_snap_num:0 month_single_snap_num: 0
} }
} };
}, },
components:{ components: {
showmap, showmap,
videoPlay, videoPlay,
behaviortrend, behaviortrend,
...@@ -97,31 +99,29 @@ import devInfo from './devInfo' ...@@ -97,31 +99,29 @@ import devInfo from './devInfo'
eventList, eventList,
devInfo devInfo
}, },
mounted(){ mounted() {},
methods: {
editVideo(index, row) {
this.setShow = true;
this.archiveUnid = row.archive_unid;
}, },
methods:{ delFun(index, row) {
editVideo(index,row){ this.$api.map.delEvent({}, row.archive_unid).then(res => {
this.setShow=true; console.log(res);
this.archiveUnid=row.archive_unid; });
}, console.log(row);
delFun(index,row){
this.$api.map.delEvent({},row.archive_unid).then((res)=>{
console.log(res)
})
console.log(row)
}, },
getBehaviorSnap(){ getBehaviorSnap() {
this.$api.show.getBehaviorSna().then(res => { this.$api.show.getBehaviorSna().then(res => {
this.snapData = res; this.snapData = res;
}) });
} }
}, },
created(){ created() {
this.getBehaviorSnap() this.getBehaviorSnap();
}
} }
};
</script> </script>
<style scoped="scoped" lang="stylus"> <style scoped="scoped" lang="stylus">
...@@ -318,5 +318,4 @@ import devInfo from './devInfo' ...@@ -318,5 +318,4 @@ import devInfo from './devInfo'
top 10px top 10px
z-index 1000 z-index 1000
} }
</style> </style>
src/views/trafficShow/index.vue
<template> <template>
<el-row :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"> <el-row
<el-col :span="13" > :gutter="10"
style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"
>
<el-col :span="15">
<div id="map" class="maps"> <div id="map" class="maps">
<showmap ref="map" @playvideo="playvideo"></showmap> <showmap ref="map" @playvideo="playvideo"></showmap>
<div class="eventlist-box"> <div class="eventlist-box">
<!-- <eventList></eventList> --> <!-- <eventList></eventList> -->
<devInfo></devInfo> <devInfo></devInfo>
<div class="video-box">
<videoPlay ref="ocx" :playurl="playurl"></videoPlay>
</div>
</div> </div>
</div> </div>
<div style="clear: both;"></div> <div style="clear: both;"></div>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="9">
<div class="video-box"> <el-row>
<videoPlay ref="ocx" :playurl="playurl"></videoPlay>
</div>
<div class="collect-box"> <div class="collect-box">
<div class="header-title">今日抓拍量</div> <div class="header-title">今日抓拍量</div>
<div class="collect-content"> <div class="collect-content">
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.kakou_total_snap_num}}</div> <div class="item-num">{{ snapData.kakou_total_snap_num }}</div>
<div>卡口总量</div> <div>卡口总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.event_total_snap_num}}</div> <div class="item-num">{{ snapData.event_total_snap_num }}</div>
<div>事件总量</div> <div>事件总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.illega_total_snap_num}}</div> <div class="item-num">{{ snapData.illega_total_snap_num }}</div>
<div>违法总量</div> <div>违法总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.key_vehicle_total_snap_num}}</div> <div class="item-num">
{{ snapData.key_vehicle_total_snap_num }}
</div>
<div>特殊车辆总量</div> <div>特殊车辆总量</div>
</el-col> </el-col>
</div> </div>
</div> </div>
<div style="clear: both;"></div> </el-row>
</el-col> <el-row :gutter="12" class="event-type-box" style="margin-top:1vh">
<el-col :span="24" class="clearpright"> <el-col :span="16">
<el-row :gutter="12" class="bottom-box"> <div class="right-item-box">
<el-col :span="8">
<div class="bottom-item-box">
<illegaltrend></illegaltrend>
</div>
</el-col>
<el-col :span="5">
<div class="bottom-item-box">
<eventTypedis></eventTypedis> <eventTypedis></eventTypedis>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="8" style="padding-right:0">
<div class="bottom-item-box"> <div class="right-item-box">
<div class="title">重点车辆分布</div> <div class="title">重点车辆分布</div>
<!-- <div class="car-dis-info" v-for="(item, index) in keyVehicleData" :key="index">
<div class="left-icon">
<span class="icon-fanxin-bianzu2"></span>
</div>
<div class="right-content">
<div class="">
<span class="car-num">{{item.total_num}}</span>辆
</div>
<div>{{item.vehicle_name}}</div>
</div>
</div> -->
<div class="car-dis-info"> <div class="car-dis-info">
<div class="left-icon"> <div class="left-icon">
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class=""><span class="car-num">10</span>辆</div>
<span class="car-num">10</span>辆
</div>
<div>渣土车抓拍</div> <div>渣土车抓拍</div>
</div> </div>
</div> </div>
...@@ -80,9 +65,7 @@ ...@@ -80,9 +65,7 @@
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class=""><span class="car-num">10</span>辆</div>
<span class="car-num">10</span>辆
</div>
<div>危险品车</div> <div>危险品车</div>
</div> </div>
</div> </div>
...@@ -91,55 +74,59 @@ ...@@ -91,55 +74,59 @@
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class=""><span class="car-num">29</span>辆</div>
<span class="car-num">29</span>辆
</div>
<div>重型罐式车</div> <div>重型罐式车</div>
</div> </div>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="8" class="clearpright"> </el-row>
<div class="bottom-item-box"> <el-row style="margin-top:1vh;background:#fff">
<div class="">
<illegaltrend></illegaltrend>
</div>
</el-row>
<el-row class="clearpright" style="margin-top:1vh">
<div class="right-item-box">
<div class="title">实时事件</div> <div class="title">实时事件</div>
<alarmEvent @event = "alarmevent"></alarmEvent> <alarmEvent @event="alarmevent"></alarmEvent>
</div> </div>
</el-col>
</el-row> </el-row>
<div style="clear: both;"></div>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
<script> <script>
import showmap from './map' import showmap from "./map";
import videoPlay from '../public/videoPlay' import videoPlay from "../public/videoPlay";
import illegaltrend from './illegaltrend' import illegaltrend from "./illegaltrend";
import eventTypedis from './eventTypedis' import eventTypedis from "./eventTypedis";
import eventList from './eventList' import eventList from "./eventList";
import alarmEvent from './alarmEvent' import alarmEvent from "./alarmEvent";
import devInfo from '../behaviorShow/devInfo' import devInfo from "../behaviorShow/devInfo";
export default{ export default {
data(){ data() {
return{ return {
typeList:[], typeList: [],
tableData:[], tableData: [],
eventTypeList:[], eventTypeList: [],
keyVehicleData:[], keyVehicleData: [],
illageList:[], illageList: [],
setShow:false, setShow: false,
archiveUnid:0, archiveUnid: 0,
snap_num:0, snap_num: 0,
playurl:'', playurl: "",
audit_num:0, audit_num: 0,
snapData:{ snapData: {
illega_total_snap_num:0, illega_total_snap_num: 0,
key_vehicle_total_snap_num:0, key_vehicle_total_snap_num: 0,
event_total_snap_num:0, event_total_snap_num: 0,
kakou_total_snap_num:0, kakou_total_snap_num: 0
} }
} };
}, },
components:{ components: {
showmap, showmap,
videoPlay, videoPlay,
illegaltrend, illegaltrend,
...@@ -148,25 +135,25 @@ import devInfo from '../behaviorShow/devInfo' ...@@ -148,25 +135,25 @@ import devInfo from '../behaviorShow/devInfo'
devInfo, devInfo,
eventList eventList
}, },
mounted(){ mounted() {},
methods: {
}, alarmevent(data) {
methods:{
alarmevent(data){
//移动地图 //移动地图
this.$refs.map.movemap(data) this.$refs.map.movemap(data);
}, },
playvideo(data){ playvideo(data) {
let obj = {}; let obj = {};
if(data.vchan_name == "视频1"){ if (data.vchan_name == "视频1") {
obj.rtsp_url= "rtsp://192.168.9.133:20090/6af6f0f9a445463d8b07273fe538694d" obj.rtsp_url =
} else if(data.vchan_name == "视频2"){ "rtsp://192.168.9.133:20090/6af6f0f9a445463d8b07273fe538694d";
obj.rtsp_url= "rtsp://192.168.9.133:20090/68504674201c4490bfe1a9d18c86b6ac" } else if (data.vchan_name == "视频2") {
} obj.rtsp_url =
this.playurl = obj "rtsp://192.168.9.133:20090/68504674201c4490bfe1a9d18c86b6ac";
}
this.playurl = obj;
setTimeout(() => { setTimeout(() => {
this.$refs.ocx.videoPlay() this.$refs.ocx.videoPlay();
}, 0); }, 0);
// this.$api.device.getFxStream(this.dev_unid, data.vchan_refid).then(res => { // this.$api.device.getFxStream(this.dev_unid, data.vchan_refid).then(res => {
...@@ -190,25 +177,23 @@ import devInfo from '../behaviorShow/devInfo' ...@@ -190,25 +177,23 @@ import devInfo from '../behaviorShow/devInfo'
// } // }
// }) // })
}, },
getTrafficSnap(){ getTrafficSnap() {
this.$api.show.getTrafficSnap().then(res => { this.$api.show.getTrafficSnap().then(res => {
this.snapData = res; this.snapData = res;
}) });
}, },
getKeyVehicle(){ getKeyVehicle() {
this.$api.show.getKeyVehicle().then(res => { this.$api.show.getKeyVehicle().then(res => {
this.keyVehicleData = res; this.keyVehicleData = res;
}) });
},
},
created(){
this.getTrafficSnap()
this.getKeyVehicle()
} }
},
created() {
this.getTrafficSnap();
this.getKeyVehicle();
} }
};
</script> </script>
<style scoped="scoped" lang="stylus"> <style scoped="scoped" lang="stylus">
...@@ -333,26 +318,27 @@ import devInfo from '../behaviorShow/devInfo' ...@@ -333,26 +318,27 @@ import devInfo from '../behaviorShow/devInfo'
width: 37px; width: 37px;
} }
.maps{ .maps{
height: 59.3vh; height: 89.3vh;
width:100%; width:100%;
margin-bottom: 8px; margin-bottom: 8px;
position: relative; position: relative;
background red
} }
.el-table__body tr{ .el-table__body tr{
background: #FFFFFF!important; background: #FFFFFF!important;
} }
.bottom-box{ .event-type-box{
width: 100%; width: 100%;
height: 26.5vh; height: 26.5vh;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box { .right-item-box {
height: 27vh; height: 27vh;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box .title{ .right-item-box .title{
padding-left: 5px; padding-left: 5px;
line-height 3vh line-height 3vh
} }
...@@ -402,5 +388,4 @@ import devInfo from '../behaviorShow/devInfo' ...@@ -402,5 +388,4 @@ import devInfo from '../behaviorShow/devInfo'
top 10px top 10px
z-index 1000 z-index 1000
} }
</style> </style>
yarn.lock 0 → 100644
This diff could not be displayed because it is too large.
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!