Skip to content

platform / fanxing_new

Go to a project
Commit 2f10b220 by 潘建波
Options

Merge branch 'fanxing' of http://192.168.9.26/platform/fanxing_new into fanxing 

# Conflicts:
#	src/api/apiList.js
#	src/router/index.js
#	src/views/Show.vue
2 parents 97adad9d c156293e
Inline Side-by-side
Showing 20 changed files with 2472 additions and 23 deletions
package-lock.json
......@@ -3700,6 +3700,26 @@
"randomfill": "^1.0.3"
}
},
"css": {
"version": "2.2.4",
"resolved": "https://registry.npm.taobao.org/css/download/css-2.2.4.tgz",
"integrity": "sha1-xkZ1XHOXHyu6amAeLPL9cbEpiSk=",
"dev": true,
"requires": {
"inherits": "^2.0.3",
"source-map": "^0.6.1",
"source-map-resolve": "^0.5.2",
"urix": "^0.1.0"
},
"dependencies": {
"source-map": {
"version": "0.6.1",
"resolved": "http://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz",
"integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=",
"dev": true
}
}
},
"css-color-names": {
"version": "0.0.4",
"resolved": "https://registry.npm.taobao.org/css-color-names/download/css-color-names-0.0.4.tgz",
......@@ -3760,6 +3780,15 @@
}
}
},
"css-parse": {
"version": "2.0.0",
"resolved": "https://registry.npm.taobao.org/css-parse/download/css-parse-2.0.0.tgz",
"integrity": "sha1-pGjuZnwW2BzPBcWMONKpfHgNv9Q=",
"dev": true,
"requires": {
"css": "^2.0.0"
}
},
"css-select": {
"version": "2.1.0",
"resolved": "https://registry.npm.taobao.org/css-select/download/css-select-2.1.0.tgz",
......@@ -7605,6 +7634,12 @@
"integrity": "sha1-tEf2ZwoEVbv+7dETku/zMOoJdUg=",
"dev": true
},
"lodash.clonedeep": {
"version": "4.5.0",
"resolved": "https://registry.npm.taobao.org/lodash.clonedeep/download/lodash.clonedeep-4.5.0.tgz",
"integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=",
"dev": true
},
"lodash.defaultsdeep": {
"version": "4.6.1",
"resolved": "https://registry.npm.taobao.org/lodash.defaultsdeep/download/lodash.defaultsdeep-4.6.1.tgz",
......@@ -11825,6 +11860,62 @@
}
}
},
"stylus": {
"version": "0.54.7",
"resolved": "https://registry.npm.taobao.org/stylus/download/stylus-0.54.7.tgz",
"integrity": "sha1-xs5Hk5Ze5Ti86+UPMVN7/ATYjNI=",
"dev": true,
"requires": {
"css-parse": "~2.0.0",
"debug": "~3.1.0",
"glob": "^7.1.3",
"mkdirp": "~0.5.x",
"safer-buffer": "^2.1.2",
"sax": "~1.2.4",
"semver": "^6.0.0",
"source-map": "^0.7.3"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "http://registry.npm.taobao.org/debug/download/debug-3.1.0.tgz",
"integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
"dev": true,
"requires": {
"ms": "2.0.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npm.taobao.org/ms/download/ms-2.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fms%2Fdownload%2Fms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
"dev": true
},
"semver": {
"version": "6.3.0",
"resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz?cache=0&sync_timestamp=1576601945958&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-6.3.0.tgz",
"integrity": "sha1-7gpkyK9ejO6mdoexM3YeG+y9HT0=",
"dev": true
},
"source-map": {
"version": "0.7.3",
"resolved": "http://registry.npm.taobao.org/source-map/download/source-map-0.7.3.tgz",
"integrity": "sha1-UwL4FpAxc1ImVECS5kmB91F1A4M=",
"dev": true
}
}
},
"stylus-loader": {
"version": "3.0.2",
"resolved": "https://registry.npm.taobao.org/stylus-loader/download/stylus-loader-3.0.2.tgz",
"integrity": "sha1-J6cGQgsFo44DjnyssVNXjUUFE8Y=",
"dev": true,
"requires": {
"loader-utils": "^1.0.2",
"lodash.clonedeep": "^4.5.0",
"when": "~3.6.x"
}
},
"supports-color": {
"version": "5.5.0",
"resolved": "https://registry.npm.taobao.org/supports-color/download/supports-color-5.5.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsupports-color%2Fdownload%2Fsupports-color-5.5.0.tgz",
......@@ -13084,6 +13175,12 @@
"webidl-conversions": "^4.0.2"
}
},
"when": {
"version": "3.6.4",
"resolved": "https://registry.npm.taobao.org/when/download/when-3.6.4.tgz",
"integrity": "sha1-RztRfsFZ4rhQBUl6E5g/CVQS404=",
"dev": true
},
"which": {
"version": "1.3.1",
"resolved": "https://registry.npm.taobao.org/which/download/which-1.3.1.tgz?cache=0&sync_timestamp=1570145314160&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwhich%2Fdownload%2Fwhich-1.3.1.tgz",
......
package.json
......@@ -57,7 +57,8 @@
"no-use-before-define": "off",
"no-undef": "off",
"no-irregular-whitespace": "off",
"no-debugger": "off"
"no-debugger": "off",
"vue/no-unused-components": "off"
},
"parserOptions": {
"parser": "babel-eslint"
......
src/api/search/index.js
......@@ -16,4 +16,13 @@ export default {
// return出去了一个promise
return api.delete(urls.patchdel,params)
},
eventTypes(params,id) {
return api.get(urls.eventTypes, params)
},
eventTableList(params,id) {
return api.get(urls.eventTableList, params)
},
traficflow(params,id) {
return api.get(urls.traficflow, params)
},
}
\ No newline at end of file
src/api/search/urls.js
import baseUrl from '../baseUrl'
export default {
// 交通方面表格
tableList: baseUrl + '/api/v1/traffic/events',
// 事件查询表格
eventTableList: baseUrl + '/api/v1/behavior/events',
// 获取详情图片
detailImg: baseUrl + '/api/v1/web/pics/',
// 删除
delVehicle: baseUrl + '/api/v1/traffic/events/',
patchdel: baseUrl + '/api/v1/traffic/events/patchdel'
// 批量删除
patchdel: baseUrl + '/api/v1/traffic/events/patchdel',
// 事件类型
eventTypes: baseUrl + '/api/v1/codes/event_types',
//交通流量表格
traficflow: baseUrl + '/api/v1/traffic/flow/statistics',
}
\ No newline at end of file
src/assets/js/buildcodes.js
......@@ -37,7 +37,7 @@ class Codes {
// 安防事件处理
beheiverCode () {
this.publicCode()
console.log('安防事件')
this.behavior()
}
// 交通事件处理
trafficCode () {
......@@ -82,6 +82,30 @@ class Codes {
this.result.location_speed = ''
}
}
//安防
behavior(){
if(this.allData.event_type === "32") {
this.result.number = this.allData.event_data.number;
}
else {
this.result.number = '--'
}
try {
this.result.event_type = this.getCode('安防事件', this.allData.event_type)
} catch (error) {
this.result.event_type = '未识别';
}
try {
this.result.direction_text = this.getCode('卡口方向', this.allData.event_data.direction.code)
} catch (err) {
this.result.direction_text = '未识别'
}
try {
this.result.lane_text = this.getCode('车道类型', this.allData.event_data.lane.code)
} catch (err) {
this.result.lane_text = '未识别'
}
}
// 交通
vehicle () {
try {
......@@ -228,6 +252,12 @@ class Codes {
} catch (err) {
this.result.illegalType = '未识别'
}
//身高
try {
this.result.driver_height = this.allData.event_data.pedestrian.height.toFixed(2);
} catch (err) {
this.result.driver_height = '未识别';
}
// 行人上身颜色
try {
this.result.driver_face_upbody_text = this.getCode('车身颜色', this.allData.event_data.driver.face[0].upbody.code)
......
src/assets/resetElementCss/index.css
......@@ -22,7 +22,7 @@
.el-popper[x-placement^=bottom] .popper__arrow{
display: none;
}
.el-popper[x-placement^=bottom]{
.selectBox .el-popper[x-placement^=bottom]{
margin-top: 0;
}
.el-select-dropdown__list{
......
src/assets/scss/common.scss
......@@ -43,6 +43,35 @@ a:active{
width:150px;
display: inline-block;
}
.editIcon{
cursor: pointer;
color:#0069ff;
font-size:16px;
}
.editIcon2{
cursor: pointer;
color:#87d14b;
font-size:16px;
}
.playIcon{
cursor: pointer;
color:#34b3a2;
font-size:16px;
}
.pauseIcon{
cursor: pointer;
color:#ffc62e;
font-size:14px;
}
.delIcon{
cursor: pointer;
color:#f2365a;
font-size:16px;
}
.no-btn{
color:#cccccc;
}
.blue{
.tableSpanBorder{
display: inline-block;
......@@ -90,7 +119,7 @@ a:active{
}
.detaiCon span{
display: inline-block;
width: 120px;
width: 150px;
}
.arrow{
position: absolute;
......
src/components/video.vue 0 → 100644
<template>
<div class="video-box">
<el-dialog title="录像" :visible.sync="videoDialogVisible">
<video id="playerVideo" class="dom-video" controls muted></video>
<div slot="footer" class="player-footer">
<button @click="closeVideoDialog">关闭</button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data () {
return {
videoDialogVisible: false,
domTimer: null,
player: ''
}
},
methods: {
playvideos: function (play_url) {
let _this = this;
this.videoDialogVisible = true;
this.domTimer = setTimeout(() => {
_this.player = document.getElementById('playerVideo');
console.log(this.player)
_this.player.loop = true;
_this.player.src = play_url;
_this.player.play();
}, 100);
},
closeVideoDialog: function () {
this.domTimer = null;
this.player.src = '';
this.player = '';
this.videoDialogVisible = false;
}
}
}
</script>
<style scoped>
.dom-video {
width: 100%;
height: 100%;
border-radius: 5px;
}
.player-footer button {
padding: 0 2%;
}
</style>
src/router/index.js
......@@ -24,26 +24,47 @@ const routes = [
{
path: "/task/sceneSet",
name: "sceneSet",
component: resolve =>
require(["../views/sceneManage/index.vue"], resolve)
component: resolve => require(['../views/sceneManage/index.vue'], resolve),
},
{
path: "/task/taskSet",
name: "taskSet",
component: resolve =>
require(["../views/taskManage/index.vue"], resolve)
component: resolve => require(['../views/taskManage/index.vue'], resolve),
},
{
path: "/search/vehicleSearch",
name: "taskSet",
component: resolve =>
require(["../views/search/vehicleSearch.vue"], resolve)
component: resolve => require(['../views/search/vehicleSearch.vue'], resolve),
},
{
path: "/search/xcycle",
name: "xcycle",
component: resolve => require(["../views/search/xcycle.vue"], resolve)
}
component: resolve => require(['../views/search/xcycle.vue'], resolve),
},
{
path: "/search/pedestrian",
name: "pedestrian",
component: resolve => require(['../views/search/pedestrian.vue'], resolve),
},
{
path: "/search/event",
name: "event",
component: resolve => require(['../views/search/event.vue'], resolve),
},
{
path: "/search/illegal",
name: "illegal",
component: resolve => require(['../views/search/illegal.vue'], resolve),
},
{
path: "/search/traficflow",
name: "traficflow",
component: resolve => require(['../views/search/traficflow.vue'], resolve),
},{
path: "/search/publicFlow",
name: "publicFlow",
component: resolve => require(['../views/search/publicFlow.vue'], resolve),
},
]
},
{
......
src/views/Home.vue
......@@ -35,6 +35,11 @@
</template>
<el-menu-item index="/search/vehicleSearch"> <i class="el-icon-location"></i>过车记录检索</el-menu-item>
<el-menu-item index="/search/xcycle"> <i class="el-icon-location"></i>非机动车检索</el-menu-item>
<el-menu-item index="/search/pedestrian"> <i class="el-icon-location"></i>行人检索</el-menu-item>
<el-menu-item index="/search/event"> <i class="el-icon-location"></i>事件查询</el-menu-item>
<el-menu-item index="/search/illegal"> <i class="el-icon-location"></i>违法记录查询</el-menu-item>
<el-menu-item index="/search/publicFlow"> <i class="el-icon-location"></i>公共客流</el-menu-item>
<el-menu-item index="/search/traficflow"> <i class="el-icon-location"></i>交通流量</el-menu-item>
</el-submenu>
<el-submenu index="4">
<template slot="title">
......
src/views/Login.vue
......@@ -65,6 +65,7 @@ import types from '../store/types.js'
this.storeConfList();
//code列表
this.getCodeList();
this.getEventList();
this.$router.push('/map')
}
......@@ -109,7 +110,17 @@ import types from '../store/types.js'
})
}).catch((err) => {
})
}
},
getEventList(){
this.$api.search.eventTypes({}).then(res=>{
// 存储code列表
window.localStorage.setItem('安防事件',JSON.stringify(res.list_data))
// 存储单独code
res.list_data.forEach(item=>{
window.localStorage.setItem('安防事件-'+item.code,item.name)
})
})
},
},
watch: {},
mounted() {
......
src/views/Show.vue
......@@ -3,6 +3,7 @@
<el-header class="headers">
<span class="title">实事分析展示</span>
</el-header>
<<<<<<< HEAD
<el-container style="min-height:calc(100vh - 64px);" class="showbox">
<el-main style="padding: 12px;overflow:hidden">
<div style="margin-bottom: 12px;">
......@@ -38,6 +39,27 @@
</el-col>
</el-row>
<div style="clear: both;"></div>
=======
<el-container>
<el-main class="mainDiv">
<div class="topDiv">
<div class="videoCon">
<!-- 加入视频 -->
</div>
<div class="imgCon">
<div class="imgDiv">
<!-- 加入img 100% -->
</div>
<div class="textDiv">
<p>抓拍时间：2019年10月29日 17:01:47</p>
<p>抓拍地点：丰豪东路与北清路交叉口</p>
<p>车牌号码：京B123456</p>
<p>车辆类型：小轿车</p>
<p>车身颜色：白色</p>
<p>违法类型：占用公交车道年</p>
</div>
</div>
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
</div>
<el-row class="bottomDiv" :gutter="10">
<!-- 循环生成lDiv -->
......@@ -242,17 +264,17 @@ export default {
};
</script>
<style scoped="scoped" lang="scss">
body{
overflow: hidden;
.headers{
line-height: 60px;
}
.title{
font-size:24px;
font-family:MicrosoftYaHeiUI;
color:rgba(255,255,255,1);
line-height:30px;
-webkit-background-clip:text;
}
.videoCon{
<<<<<<< HEAD
background: #FFFFFF;
width:100%;
height:70vh;
......@@ -271,13 +293,38 @@ export default {
}
.lDiv{
float: left;
=======
flex:1212;
height:682px;
background: red;
margin-right: 12px;
}
.imgCon{
background: #FFFFFF;
padding: 12px;
flex:644;
}
.imgDiv{
width:100%;
height:360px;
background:rgba(216,216,216,1);
}
.lDiv{
margin-right: 12px;
flex: 1;
display: flex;
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
}
.lDiv:nth-last-of-type(2){
margin: 0;
}
.rightDiv{
<<<<<<< HEAD
width:10.5vw;
height:20vh;
=======
flex:226;
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
border:1px solid rgba(229,229,229,1);
border-left: none;
color: #555555;
......@@ -289,7 +336,11 @@ export default {
margin-left: 10px;
}
.textDiv{
<<<<<<< HEAD
height:29vh;
=======
height:286px;
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
border:1px solid rgba(229,229,229,1);
color: #555555;
font-size:22px;
......@@ -301,14 +352,22 @@ export default {
.bottomDiv{
padding: 7px;
background: #FFFFFF;
display: flex;
flex-flow: row nowrap;
}
.leftImg{
<<<<<<< HEAD
width: 21vw;
height: 20.2vh;
=======
flex: 390;
height: 186px;
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
background: #d8d8d8;
overflow: hidden;
float: left;
}
<<<<<<< HEAD
.leftImg>div{
height: 100%;
width: 100%;
......@@ -316,5 +375,69 @@ export default {
.photos{
width: 100%;
height: 100%;
=======
.topDiv{
margin-bottom: 8px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.mainDiv{
padding: 8px;
}
@media screen and (max-width: 1366px) {
.topDiv{
margin-bottom: 5px;
}
.mainDiv{
padding: 5px 40px;
}
.videoCon{
flex:1212;
height:446.78px;
margin-right: 12px;
}
.imgDiv{
height: 237.46px;
}
.textDiv{
height: 171px;
font-size: 16px;
padding-top: 4px;
padding-bottom: 9px;
}
.textDiv p{
margin: 7px 0;
margin-left: 37px;
}
.leftImg{
height: 143px;
}
.rightDiv p {
margin: -1px 0;
margin-left: 7px;
}
.rightDiv{
padding-top: 0px;
}
}
@media (min-height:1080px){
.headers{
line-height: 120px!important;
height: 120px!important;
}
.title{
font-size:40px;
font-family:MicrosoftYaHeiUI;
color:rgba(255,255,255,1);
-webkit-background-clip:text;
}
.mainDiv{
padding-top: 20px;
}
.topDiv{
margin-bottom: 16px;
}
>>>>>>> c156293e5665c9ed403aab57b2df7ed02e5cce09
}
</style>
\ No newline at end of file
src/views/sceneManage/eventTab.vue
......@@ -101,6 +101,7 @@ export default {
this.cws.onmessage = evt => {
let data = JSON.parse(evt.data);
if (data.command) {
console.log('a')
} else if (data.type == "response") {
console.log("请求任务推送成功");
} else if (data.event_cate) {
......@@ -215,7 +216,9 @@ export default {
this.quitws = true
try {
window.clearTimeout(this.keepAlive);
} catch (error) {}
} catch (error) {
console.log(error)
}
}
};
</script>
src/views/search/event.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="资源类型" >
<span class="inputBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.source_type">
<el-option value="pull_video_stream" label='拉取视频'></el-option>
<el-option value="pull_pic_files" label='拉取图片'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="事件类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.type">
<el-option value="" label="全部"></el-option>
<el-option v-for='item in eventList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="任务名称">
<span class="inputBox">
<el-input placeholder="请输入任务名称" v-model="conditions.task_name"></el-input>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
prop="event_type"
align="center"
label="事件类型">
</el-table-column>
<el-table-column
prop="task_name"
align="center"
label="任务名称">
</el-table-column>
<el-table-column
align="center"
label="地点">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data">{{scope.row.event_data.locate_name}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="面积(㎡)">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].area}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="人数(个)">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].count}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="进入阈值">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].max_len}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="离开阈值">
<template slot-scope="scope" >
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data&&scope.row.event_data.area_list">{{scope.row.area_list[0].normal_len}}</span>
</div>
</template>
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="抓拍时间">
<template slot-scope="scope">
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
align="center"
label="车道号">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.event_data.lane.number}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="方向类型">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data &&scope.row.event_type !=='jinggaidiushi'&&scope.row.event_type !=='daobantingche'">{{scope.row.direction_text}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="车道类型">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{scope.row.lane_text}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="事件发生时间">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{$moment($moment.utc(scope.row.event_data.start_dt).format()).local().format('YYYY-MM-DD HH:mm:ss')}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="事件结束时间">
<template slot-scope="scope">
<div>
<span v-if="scope.row.event_cate == 'behavior'&&scope.row.event_data">{{$moment($moment.utc(scope.row.event_data.end_dt).format()).local().format('YYYY-MM-DD HH:mm:ss')}}</span>
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="操作">
<template slot-scope="scope">
<el-tooltip content="播放" placement="bottom" effect="light" :visible-arrow=false>
<span :class="{'iconfont icon-bofang playIcon':true,'no-btn':scope.row.video&&scope.row.video[0].src_url!=''?false:true}" @click="playFun(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="经过日期:">
<span>{{ detailObj.shoot_date ? detailObj.shoot_date : '' }}</span>
</el-form-item>
<el-form-item label="经过时间:">
<span>{{ detailObj.shoot_time ? detailObj.shoot_time : '' }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="事件类型:">
<span>{{ detailObj.event_type }}</span>
</el-form-item>
</div>
</el-form>
</div>
<div class="rightArrow" @click="rightFun"><i class="el-icon-d-arrow-right"></i></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
<curVideo ref="visableDialog" :playersrc="playurl"></curVideo>
</div>
</template>
<script>
import videoDialog from '@/components/video'
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
detailObj:{},
carImg:require("@/assets/img/home/defaultImg.png"),
detailImg:'',
detailVisible:false,
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
type: '',
source_type:'',
task_name:''
},
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0,
eventList:JSON.parse(window.localStorage.getItem('安防事件')),
playurl:''
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{
videoDialog
},
mounted(){
this.getData()
},
methods:{
exportFun(){
window.open(
encodeURI(
process.env.VUE_APP_URL+
"/api/v1/behavior/events/export?s=" + Math.random()+
'&event_dt__gte='+ this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&task_name='+this.conditions.task_name+
'&event_type='+this.conditions.type
)
);
},
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex+1];
this.currentIndex+=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
handleSelectionChange(obj){
this.selectcheck = [];
obj.forEach(item => {
this.selectcheck.push(item.id)
});
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
task_name: this.conditions.task_name ? this.conditions.task_name.replace(/\s\s*/g, '') : this.conditions.task_name,
event_type: this.conditions.type,
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss')
}
this.$api.search.eventTableList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
})
},
playFun(index,row){
if(!row.video) {
return
}
var play_url = '';
if(row.video) {
play_url = row.video[0].src_url
}
this.$refs.visableDialog.playvideos(play_url);
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
}
this.detailVisible=true;
}
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/search/illegal.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="资源类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.source_type">
<el-option value="pull_video_stream" label='拉取视频'></el-option>
<el-option value="pull_pic_files" label='拉取图片'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="相机名称" >
<span class="inputBox">
<el-input placeholder="请输入相机名称" v-model="conditions.vchan_name"></el-input>
</span>
</el-form-item>
<el-form-item label="任务名称">
<span class="inputBox">
<el-input placeholder="请输入任务名称" v-model="conditions.task_name"></el-input>
</span>
</el-form-item>
<el-form-item label="车牌号码">
<span class="inputBox">
<el-input placeholder="请输入车牌号码" v-model="conditions.plate"></el-input>
</span>
</el-form-item>
<el-form-item label="车辆类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.car_type" >
<el-option value="" label='全部'></el-option>
<el-option v-for='item in vehicleTypeList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="车身颜色">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.car_color">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in vehicleColorList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="车辆品牌">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.logo_type">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in brandList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="标志物">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.marker">
<el-option value="" label='全部'></el-option>
<el-option value="0" label='年检标志'></el-option>
<el-option value="1" label='摆件'></el-option>
<el-option value="2" label='吊坠'></el-option>
<el-option value="3" label='遮阳板'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="违法类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.illegal">
<el-option value="all" label='全部'></el-option>
<el-option v-for='item in illegalList' :value="item.code" :key="item.code" :label='item.name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="危险品车">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.is_key_vehicle">
<el-option :value="false" label='否'></el-option>
<el-option :value="true" label='是'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
<div>
<el-button type="success" class="block" @click="batchdel">批量删除</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
align="center"
width="55">
</el-table-column>
<el-table-column
prop="vehicle_plate_text"
align="center"
label="车牌号码">
</el-table-column>
<el-table-column
prop="vehicle_body_type_text"
align="center"
label="车辆类型">
</el-table-column>
<el-table-column
prop="vehicle_body_logo_text"
align="center"
label="车辆品牌">
</el-table-column>
<el-table-column
prop="vehicle_body_color_text"
align="center"
label="车身颜色">
</el-table-column>
<el-table-column
prop="RefinedFeature_text"
align="center"
label="标识物">
</el-table-column>
<el-table-column
prop="illegalType"
align="center"
label="违法类型">
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="违法日期">
<template slot-scope="scope">
<span>{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
prop="location_name"
align="center"
label="抓拍地点">
</el-table-column>
<el-table-column
align="center"
label="操作">
<template slot-scope="scope">
<el-tooltip content="播放" placement="bottom" effect="light" :visible-arrow=false>
<span :class="{'iconfont icon-bofang playIcon':true,'no-btn':scope.row.video&&scope.row.video[0].src_url!=''?false:true}" @click="playFun(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
</el-tooltip>
<span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="车牌号码:">
<span>{{ detailObj.vehicle_plate_text }}</span>
</el-form-item>
<el-form-item label="车牌类型:">
<span>{{ detailObj.plate_type_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="经过日期:">
<span>{{ detailObj.shoot_date ? detailObj.shoot_date : '' }}</span>
</el-form-item>
<el-form-item label="经过时间:">
<span>{{ detailObj.shoot_time ? detailObj.shoot_time : '' }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="经过地点:">
<span>{{ detailObj.location_name }}</span>
</el-form-item>
<el-form-item label="车辆品牌:">
<span>{{ detailObj.vehicle_body_logo_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="车辆类型:">
<span>{{ detailObj.vehicle_body_type_text }}</span>
</el-form-item>
<el-form-item label="车牌颜色:">
<span>{{ detailObj.plate_color_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="车身颜色:">
<span>{{ detailObj.vehicle_body_color_text }}</span>
</el-form-item>
<el-form-item label="标志物:">
<span>{{ detailObj.RefinedFeature_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="违法类型:">
<span>{{ detailObj.illegalType }}</span>
</el-form-item>
</div>
</el-form>
</div>
<div class="rightArrow" @click="rightFun"><i class="el-icon-d-arrow-right"></i></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="detailDel">删 除</el-button>
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
<curVideo ref="visableDialog" :playersrc="playurl"></curVideo>
</div>
</template>
<script>
import videoDialog from '@/components/video'
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
playurl:'',
detailObj:{},
carImg:require("@/assets/img/home/defaultImg.png"),
detailImg:'',
detailVisible:false,
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
source_type: 'pull_video_stream',
marker: '',
car_type: '',
car_color: '',
logo_type: '',
plate:'',
task_name:'',
vchan_name:'',
illegal:'all',
is_key_vehicle:false,
},
brandList:this.$buildCode.getCodeList('车辆品牌'),
vehicleTypeList:this.$buildCode.getCodeList('车辆类型'),
vehicleColorList:this.$buildCode.getCodeList('车身颜色'),
illegalList:this.$buildCode.getCodeList('违法类型'),
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
},
methods:{
playFun(index,row){
if(!row.video) {
return
}
var play_url = '';
if(row.video) {
play_url = row.video[0].src_url
}
this.$refs.visableDialog.playvideos(play_url);
},
exportFun(){
window.open(encodeURI(process.env.VUE_APP_URL +
'/api/v1/traffic/events/export?s=' + Math.random()+
'&event_type=&event_dt__gte='+this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss')+
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss')+
'&source_type='+this.conditions.source_type+
'&vchan_name__like='+this.conditions.vchan_name+
'&vehicle_type='+this.conditions.car_type+
'&body_color='+this.conditions.car_color+
'&logo_type='+this.conditions.logo_type+
'&plate_number__like='+this.conditions.plate+
'&marker='+this.conditions.marker+
'&task_name='+this.conditions.task_name+
'&is_key_vehicle='+this.conditions.is_key_vehicle+
'&illegal_code='+this.conditions.illegal))
},
batchdel(){
if(this.selectcheck.length==0){
this.$message({
message: '请选择至少一条记录',
type: 'warning'
});
return false
}
this.$confirm('此操作将永久删除选中记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.patchdel({
"event_unids":this.selectcheck
}).then(res=>{
if(res.ecode == '200'){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getData();
}else{
this.$message.error('删除失败!');
}
})
})
},
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex+1];
this.currentIndex+=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
handleSelectionChange(obj){
this.selectcheck = [];
obj.forEach(item => {
this.selectcheck.push(item.id)
});
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
source_type: this.conditions.source_type,
vchan_name__like: this.conditions.vchan_name,
vehicle_type: this.conditions.car_type,
body_color: this.conditions.car_color,
logo_type: this.conditions.logo_type,
plate_number__like: this.conditions.plate,
marker: this.conditions.marker,
illegal_code:this.conditions.illegal,
is_key_vehicle:this.conditions.is_key_vehicle,
event_type: '',
task_name: this.conditions.task_name ? this.conditions.task_name.replace(/\s\s*/g, '') : this.conditions.task_name
}
this.$api.search.tableList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
})
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
}
this.detailVisible=true;
},
delFun(index,row){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({
},row.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(index);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
},
detailDel(){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({},this.detailObj.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(this.currentIndex,1);
this.detailObj = Object.assign({},this.formattterData[this.currentIndex]);
this.getImg(this.formattterData[this.currentIndex].pics[0].pic_unid);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
}
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/search/pedestrian.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="抓拍地点" >
<span class="inputBox">
<el-input placeholder="请输入抓拍地点" v-model="conditions.location_name"></el-input>
</span>
</el-form-item>
<el-form-item label="任务名称">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.task_id" @change="getSubTask">
<el-option v-for='item in taskList' :value="item.task_id" :key="item.task_id" :label='item.task_name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="相机名称">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.subtask_id">
<el-option v-for='item in subTaskList' :value="item.subtask_id" :key="item.subtask_id" :label='item.subtask_name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="性别">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.sex">
<el-option value="" label="全部"></el-option>
<el-option value="1" label="男"></el-option>
<el-option value="2" label="女"></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="上身颜色">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.upbodyColor">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in bodyColorList' :value="item.value" :key="item.value" :label='item.label'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="下身颜色">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.lobodyColor">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in bodyColorList' :value="item.value" :key="item.value" :label='item.label'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
<div>
<el-button type="success" class="block" @click="batchdel">批量删除</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
align="center"
width="55">
</el-table-column>
<el-table-column
prop="driver_face_upbody_text"
align="center"
label="上身颜色">
</el-table-column>
<el-table-column
prop="driver_face_lobody_text"
align="center"
label="下身颜色">
</el-table-column>
<el-table-column
prop="driver_face_sex"
align="center"
label="性别">
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="抓拍时间">
<template slot-scope="scope">
<span>{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
prop="location_name"
align="center"
label="抓拍地点">
</el-table-column>
<el-table-column
align="center"
label="操作">
<template slot-scope="scope">
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="经过日期:">
<span>{{ detailObj.shoot_date ? detailObj.shoot_date : '' }}</span>
</el-form-item>
<el-form-item label="经过时间:">
<span>{{ detailObj.shoot_time ? detailObj.shoot_time : '' }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="经过地点:">
<span>{{ detailObj.location_name }}</span>
</el-form-item>
<el-form-item label="性别:">
<span>{{ detailObj.driver_face_sex }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="上身颜色:">
<span>{{ detailObj.driver_face_lobody_text }}</span>
</el-form-item>
<el-form-item label="下身颜色:">
<span>{{ detailObj.driver_face_lobody_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="身高:">
<span>{{ detailObj.driver_height }}</span>
</el-form-item>
<el-form-item label="速度:">
<span>{{ detailObj.location_speed }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="戴帽子:">
<span>{{ detailObj.driver_face_with_hats }}</span>
</el-form-item>
<el-form-item label="违法类型:">
<span>{{ detailObj.illegalType }}</span>
</el-form-item>
</div>
</el-form>
</div>
<div class="rightArrow" @click="rightFun"><i class="el-icon-d-arrow-right"></i></div>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="detailDel">删 除</el-button> -->
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
detailObj:{},
carImg:require("@/assets/img/home/defaultImg.png"),
detailImg:'',
detailVisible:false,
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
event_type: 'pedestrian',
location_name:'',
subtask_id:null,
task_id:null,
upbodyColor: '',
lobodyColor: '',
sex:''
},
bodyColorList:this.$buildCode.getCodeList('车身颜色'),
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0,
taskList:[],
subTaskList:[]
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
this.getTaskList();
},
methods:{
getTaskList(){
this.$api.task.getTask({
source_type: "pull_video_stream",
task_type: "normal"
}).then(res=>{
this.taskList=res.list_data;
})
},
getSubTask(){
this.conditions.subtask_id=null;
this.$api.task.getSubTask(this.conditions.task_id).then(res => {
this.subTaskList = res.list_data;
if( this.subTaskList.length>0){
this.conditions.subtask_id=this.subTaskList[0].subtask_id
}
})
},
exportFun(){
window.open(
encodeURI(
process.env.VUE_APP_URL+
"/api/v1/traffic/events/export?s=" + Math.random()+
'&event_type=pedestrian&event_dt__gte='+ this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&location_name='+this.conditions.location_name+
'&task_id='+this.conditions.task_id+
'&subtask_id='+this.conditions.subtask_id+
'&upbodyColor='+this.conditions.upbodyColor+
'&lobodyColor='+this.conditions.lobodyColor+
'&sex='+this.conditions.sex
)
);
},
batchdel(){
if(this.selectcheck.length==0){
this.$message({
message: '请选择至少一条记录',
type: 'warning'
});
return false
}
this.$confirm('此操作将永久删除选中记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.patchdel({
"event_unids":this.selectcheck
}).then(res=>{
if(res.ecode == '200'){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getData();
}else{
this.$message.error('删除失败!');
}
})
})
},
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex+1];
this.currentIndex+=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
handleSelectionChange(obj){
this.selectcheck = [];
obj.forEach(item => {
this.selectcheck.push(item.id)
});
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
event_type: "pedestrian",
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
upbodyColor: this.conditions.upbodyColor,
lobodyColor: this.conditions.lobodyColor,
sex: this.conditions.sex,
task_id: this.conditions.task_id,
subtask_id: this.conditions.subtask_id,
location_name: this.conditions.location_name
}
this.$api.search.tableList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
})
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
}
this.detailVisible=true;
},
delFun(index,row){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({
},row.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(index);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
},
detailDel(){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({},this.detailObj.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(this.currentIndex,1);
this.detailObj = Object.assign({},this.formattterData[this.currentIndex]);
this.getImg(this.formattterData[this.currentIndex].pics[0].pic_unid);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
}
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/search/publicFlow.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="抓拍地点" >
<span class="inputBox">
<el-input placeholder="请输入抓拍地点" v-model="conditions.location_name"></el-input>
</span>
</el-form-item>
<el-form-item label="任务名称">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.task_id" @change="getSubTask">
<el-option v-for='item in taskList' :value="item.task_id" :key="item.task_id" :label='item.task_name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="相机名称">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.subtask_id">
<el-option v-for='item in subTaskList' :value="item.subtask_id" :key="item.subtask_id" :label='item.subtask_name'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="性别">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.sex">
<el-option value="" label="全部"></el-option>
<el-option value="1" label="男"></el-option>
<el-option value="2" label="女"></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="上身颜色">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.upbodyColor">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in bodyColorList' :value="item.value" :key="item.value" :label='item.label'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="下身颜色">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.lobodyColor">
<el-option value="" label='全部'></el-option>
<el-option v-for='item in bodyColorList' :value="item.value" :key="item.value" :label='item.label'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
<div>
<el-button type="success" class="block" @click="batchdel">批量删除</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
align="center"
width="55">
</el-table-column>
<el-table-column
prop="driver_face_upbody_text"
align="center"
label="上身颜色">
</el-table-column>
<el-table-column
prop="driver_face_lobody_text"
align="center"
label="下身颜色">
</el-table-column>
<el-table-column
prop="driver_face_sex"
align="center"
label="性别">
</el-table-column>
<el-table-column
prop="shoot_date"
align="center"
label="抓拍时间">
<template slot-scope="scope">
<span>{{scope.row.shoot_date}} {{scope.row.shoot_time}}</span>
</template>
</el-table-column>
<el-table-column
prop="location_name"
align="center"
label="抓拍地点">
</el-table-column>
<el-table-column
align="center"
label="操作">
<template slot-scope="scope">
<el-tooltip content="详情" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon" @click="detailFun(scope.$index, scope.row)"></span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
<el-dialog
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="经过日期:">
<span>{{ detailObj.shoot_date ? detailObj.shoot_date : '' }}</span>
</el-form-item>
<el-form-item label="经过时间:">
<span>{{ detailObj.shoot_time ? detailObj.shoot_time : '' }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="经过地点:">
<span>{{ detailObj.location_name }}</span>
</el-form-item>
<el-form-item label="性别:">
<span>{{ detailObj.driver_face_sex }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="上身颜色:">
<span>{{ detailObj.driver_face_lobody_text }}</span>
</el-form-item>
<el-form-item label="下身颜色:">
<span>{{ detailObj.driver_face_lobody_text }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="身高:">
<span>{{ detailObj.driver_height }}</span>
</el-form-item>
<el-form-item label="速度:">
<span>{{ detailObj.location_speed }}</span>
</el-form-item>
</div>
<div>
<el-form-item label="戴帽子:">
<span>{{ detailObj.driver_face_with_hats }}</span>
</el-form-item>
<el-form-item label="违法类型:">
<span>{{ detailObj.illegalType }}</span>
</el-form-item>
</div>
</el-form>
</div>
<div class="rightArrow" @click="rightFun"><i class="el-icon-d-arrow-right"></i></div>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="detailDel">删 除</el-button> -->
<el-button type="primary" @click="detailVisible = false">关 闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
detailObj:{},
carImg:require("@/assets/img/home/defaultImg.png"),
detailImg:'',
detailVisible:false,
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
event_type: 'pedestrian',
location_name:'',
subtask_id:null,
task_id:null,
upbodyColor: '',
lobodyColor: '',
sex:''
},
bodyColorList:this.$buildCode.getCodeList('车身颜色'),
tableData:[],
formattterData:[],
total:0,
page:1,
pageSize:30,
selectcheck:[],
currentIndex:0,
taskList:[],
subTaskList:[]
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
this.getTaskList();
},
methods:{
getTaskList(){
this.$api.task.getTask({
source_type: "pull_video_stream",
task_type: "normal"
}).then(res=>{
this.taskList=res.list_data;
})
},
getSubTask(){
this.conditions.subtask_id=null;
this.$api.task.getSubTask(this.conditions.task_id).then(res => {
this.subTaskList = res.list_data;
if( this.subTaskList.length>0){
this.conditions.subtask_id=this.subTaskList[0].subtask_id
}
})
},
exportFun(){
window.open(
encodeURI(
process.env.VUE_APP_URL+
"/api/v1/traffic/events/export?s=" + Math.random()+
'&event_type=pedestrian&event_dt__gte='+ this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss') +
'&location_name='+this.conditions.location_name+
'&task_id='+this.conditions.task_id+
'&subtask_id='+this.conditions.subtask_id+
'&upbodyColor='+this.conditions.upbodyColor+
'&lobodyColor='+this.conditions.lobodyColor+
'&sex='+this.conditions.sex
)
);
},
batchdel(){
if(this.selectcheck.length==0){
this.$message({
message: '请选择至少一条记录',
type: 'warning'
});
return false
}
this.$confirm('此操作将永久删除选中记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.patchdel({
"event_unids":this.selectcheck
}).then(res=>{
if(res.ecode == '200'){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getData();
}else{
this.$message.error('删除失败!');
}
})
})
},
leftFun(){
if(this.currentIndex-1<0){
this.$message({
message: '目前为第一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex-1];
this.currentIndex-=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
rightFun(){
if(this.currentIndex==this.formattterData.length-1){
this.$message({
message: '目前为最后一条',
type: 'warning'
});
return false;
}
this.detailObj=this.formattterData[this.currentIndex+1];
this.currentIndex+=1;
this.getImg(this.detailObj.pics[0].pic_unid);
},
handleSelectionChange(obj){
this.selectcheck = [];
obj.forEach(item => {
this.selectcheck.push(item.id)
});
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
event_type: "pedestrian",
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
upbodyColor: this.conditions.upbodyColor,
lobodyColor: this.conditions.lobodyColor,
sex: this.conditions.sex,
task_id: this.conditions.task_id,
subtask_id: this.conditions.subtask_id,
location_name: this.conditions.location_name
}
this.$api.search.tableList(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
},
getImg(unid){
this.$api.search.detailImg({
},unid).then(res=>{
this.detailImg=res.pic_url ? res.pic_url : carImg;
}).catch(e=>{
})
},
detailFun(index,row){
this.currentIndex=index;
if(row.pics.length>0){
this.detailObj = Object.assign({},row);
this.getImg(row.pics[0].pic_unid);
}
this.detailVisible=true;
},
delFun(index,row){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({
},row.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(index);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
},
detailDel(){
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.search.delVehicle({},this.detailObj.id).then(res=>{
if(res.ecode==200){
this.formattterData.splice(this.currentIndex,1);
this.detailObj = Object.assign({},this.formattterData[this.currentIndex]);
this.getImg(this.formattterData[this.currentIndex].pics[0].pic_unid);
this.$message({
type: 'success',
message: '删除成功!'
});
}else{
this.$message.error('删除失败!');
}
}).catch(e=>{
this.$message.error('删除失败!');
})
})
}
},
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/search/traficflow.vue 0 → 100644
<template>
<div class="innnerBox">
<el-col :span="22">
<el-form ref="form" label-width="80px" inline>
<el-form-item label="地点名称">
<span class="inputBox">
<el-input placeholder="请输入任务名称" v-model="conditions.location_name"></el-input>
</span>
</el-form-item>
<el-form-item label="相机名称" >
<span class="inputBox">
<el-input placeholder="请输入相机名称" v-model="conditions.device_name"></el-input>
</span>
</el-form-item>
<el-form-item label="检测类型">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.detection_type">
<el-option value="" label='全部'></el-option>
<el-option value="big_vehicle" label='大车'></el-option>
<el-option value="small_vehicle" label='小车'></el-option>
<el-option value="xcycle" label='非机动车'></el-option>
<el-option value="pedestrian" label='行人'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="统计方式">
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.statistic_type">
<el-option value="road" label='按车道统计'></el-option>
<el-option value="device" label='按相机统计'></el-option>
</el-select>
</span>
</el-form-item>
<el-form-item label="起始时间">
<span class="dateBox">
<el-date-picker
v-model="dates"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</span>
</el-form-item>
</el-form>
</el-col>
<el-col :span="2">
<div style="margin-bottom: 6px;padding-top: 3px;">
<el-button type="primary" style="" @click="query" class="block">查询</el-button>
<el-button type="success" class="block" @click="exportFun">导出</el-button>
</div>
</el-col>
<div style="">
<el-table
:data="formattterData"
height="574"
stripe
border>
<el-table-column
align="center"
prop="event_dt"
label="时间">
</el-table-column>
<el-table-column
prop="device_name"
align="center"
label="相机名称">
</el-table-column>
<el-table-column
prop="detection_type"
align="center"
:formatter="typeFormatter"
label="检测类型">
</el-table-column>
<el-table-column
v-if="conditions.statistic_type =='road'"
prop="road"
align="center"
label="车道">
</el-table-column>
<el-table-column
v-if="conditions.statistic_type =='device'"
prop="direction"
align="center"
label="方向">
<template slot-scope="scope">
<div>
{{scope.row.direction == 1?"来向":(scope.row.direction == 2?"去向":"来向")}}
</div>
</template>
</el-table-column>
<el-table-column
align="center"
label="平均速度(km/h)">
<template slot-scope="scope">
<div>
{{scope.row.velocity.toFixed(2)}}
</div>
</template>
</el-table-column>
<el-table-column
prop="occupy"
align="center"
label="空间占有率%">
<template slot-scope="scope">
<div>
{{(scope.row.occupy*100).toFixed(2)}}
</div>
</template>
</el-table-column>
<el-table-column
prop="sample_dura"
align="center"
label="统计周期(秒)">
</el-table-column>
<el-table-column
prop="distance"
align="center"
label="车头间距(m)">
<template slot-scope="scope">
<div>
{{(scope.row.distance).toFixed(2)}}
</div>
</template>
</el-table-column>
<el-table-column
prop="queue_length"
align="center"
label="排队长度(m)">
<template slot-scope="scope">
<div>
{{parseInt(scope.row.queue_length)}}
</div>
</template>
</el-table-column>
<el-table-column
prop="sample_num"
align="center"
label="车流量(辆)">
</el-table-column>
</el-table>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
background
prev-text="上一页"
next-text="下一页"
:page-sizes="[30, 50, 100, 200]"
layout="prev, pager, next,sizes"
:current-page="page"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
let start_dt = this.$moment('2019-12-20').format('YYYY-MM-DD')+' 00:00:00';
let end_dt = this.$moment().format('YYYY-MM-DD')+' 23:59:59';
return{
dates:[ start_dt,end_dt ],
conditions: {
start_dt:start_dt,
end_dt:end_dt,
location_name: '',
device_name: '',
detection_type: '',
statistic_type: 'road'
},
formattterData:[],
total:0,
page:1,
pageSize:30,
}
},
watch:{
dates(val){
this.conditions.start_dt=val[0];
this.conditions.end_dt=val[1];
}
},
components:{},
mounted(){
this.getData()
},
methods:{
typeFormatter(row, column, cellValue, index){
let codename = '';
switch(cellValue){
case 'big_vehicle':
codename = "大车"
break;
case 'small_vehicle':
codename = "小车"
break;
case 'xcycle':
codename = "非机动车"
case 'pedestrian':
codename = "行人"
break;
case null:
codename = "全部"
break;
}
return codename
},
exportFun(){
window.open(encodeURI(
process.env.VUE_APP_URL + '/api/v1/traffic/flow/statistics/export?s=' + Math.random()+
'&event_type=&event_dt__gte='+this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss')+
'&event_dt__lt='+this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss')+
'&location_name='+this.conditions.location_name+
'&device_name='+this.conditions.device_name+
'&statistic_type='+this.conditions.statistic_type
))
},
handleSizeChange(val) {
this.pageSize=val;
this.getData();
},
handleCurrentChange(val) {
this.page=val;
this.getData();
},
query(){
this.getData();
},
getData(){
this.formattterData=[];
let offset = (this.page - 1) * this.pageSize;
let search_params = {
limit: this.pageSize,
offset: offset,
event_dt__gte: this.$moment(this.conditions.start_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
event_dt__lt:this.$moment(this.conditions.end_dt).utc().format('YYYY-MM-DD HH:mm:ss'),
location_name: this.conditions.location_name,
device_name: this.conditions.device_name,
detection_type: this.conditions.detection_type,
statistic_type: this.conditions.statistic_type
}
this.$api.search.traficflow(search_params
).then((res)=>{
this.total=res.total_num;
res.list_data.forEach((item,index)=>{
this.formattterData.push(this.$buildCode.init(item));
})
}).catch((err)=>{
})
}
}
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/views/search/vehicleSearch.vue
......@@ -184,11 +184,15 @@
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="1000px">
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<img :src="detailImg" alt="" style="width: 100%;">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
</el-image>
<el-form label-width="120px" inline>
<div>
<el-form-item label="车牌号码:">
......
src/views/search/xcycle.vue
......@@ -12,7 +12,7 @@
<el-input placeholder="请输入任务名称" v-model="conditions.task_name"></el-input>
</span>
</el-form-item>
<el-form-item label="非机动车类型">
<el-form-item label="非机动车类型" label-width="110px" >
<span class="selectBox">
<el-select placeholder="请选择" :popper-append-to-body=false v-model="conditions.xcycle_type">
<el-option value="" label='全部'></el-option>
......@@ -120,11 +120,11 @@
title="详情"
top="12vh"
:visible.sync="detailVisible"
width="1000px">
width="700px">
<div style="position: relative;padding: 10px 20px;">
<div class="leftArrow" @click="leftFun"><i class="el-icon-d-arrow-left"></i></div>
<div class="detaiCon">
<el-image style="width: 100%;">
<el-image style="width: 100%;" :src="this.detailImg">
<div slot="error" class="image-slot">
<img :src="carImg" alt="" style="width: 40%;display: block;margin: 0 auto;">
</div>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!