Browse Source

监控管理

master
x_ying 3 years ago
parent
commit
f351a1f9c8
  1. 10
      src/api/storeManage/listenManage/index.js
  2. 2
      src/views/storeManage/listenManage/listenConfig/index.vue
  3. 91
      src/views/storeManage/listenManage/videoListen/index.vue

10
src/api/storeManage/listenManage/index.js

@ -1,4 +1,5 @@
import request from '@/utils/request'
import qs from 'qs'
export function bind(data) {
return request({
@ -15,4 +16,11 @@ export function getDevice() {
})
}
export default { bind, getDevice }
export function cameraDownload(params) {
return request({
url: 'api/camera/download' + '?' + qs.stringify(params, { indices: false }),
method: 'get'
})
}
export default { bind, getDevice, cameraDownload }

2
src/views/storeManage/listenManage/listenConfig/index.vue

@ -15,7 +15,7 @@
<rrOperation />
</div>
<!-- :cell-class-name="cell" -->
<el-table ref="table" :data="crud.data" style="width: 100%;" height="calc(100vh - 356px)" @row-click="clickRowHandler" @row-dblclick="handleDbClick" @selection-change="selectionChangeHandler">
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 356px)" @row-click="clickRowHandler" @row-dblclick="handleDbClick" @selection-change="selectionChangeHandler">
<el-table-column type="selection" width="55" align="center" />
<el-table-column type="index" label="序号" width="100" align="center" />
<el-table-column prop="storeroomName" label="所属区域" align="center" min-width="150" />

91
src/views/storeManage/listenManage/videoListen/index.vue

@ -1,7 +1,7 @@
<template>
<div>
<div class="head-container">
<el-select v-model="optionVal" class="filter-item" style="width: 125px; height: 30px;margin:0 10px 0 0">
<el-select v-model="optionVal" class="filter-item" style="width: 125px; height: 30px;margin:0 10px 0 0" @change="crud.toQuery">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<date-range-picker v-model="queryTime" type="datetimerange" class="date-item el-date-range-picker" />
@ -9,32 +9,33 @@
</div>
<el-table
ref="table"
v-loading="crud.loading"
:data="crud.data"
style="width: 100%;"
:cell-class-name="cell"
height="calc(100vh - 356px)"
>
<!-- :cell-class-name="cell" -->
<el-table-column type="index" label="序号" width="80" align="center" />
<el-table-column prop="isdload" label="监控下载" min-width="100" align="center">
<!-- <el-table-column prop="isdload" label="监控下载" min-width="100" align="center">
<template slot-scope="scope">
<span v-if="scope.row.isdload===true" class="text">下载成功</span>
<span v-if="scope.row.isdload===false" class="text">下载失败</span>
</template>
</el-table-column>
<el-table-column prop="storeroomName" label="所属区域" min-width="150" align="center" />
<el-table-column prop="camerName" label="设备" align="center" min-width="150" />
<el-table-column prop="" label="摄像头" align="center" min-width="150" />
<el-table-column prop="" label="事件" align="center" min-width="180" />
<el-table-column prop="" label="内容描述" align="center" min-width="180" />
<el-table-column prop="" label="事件发生时间" align="center" min-width="180">
</el-table-column> -->
<el-table-column prop="deviceCamerBindId.storeroomName" label="所属区域" min-width="150" align="center" />
<el-table-column prop="deviceCamerBindId.deviceName" label="设备" align="center" min-width="150" />
<el-table-column prop="cameraName" label="摄像头" align="center" min-width="150" />
<el-table-column prop="event" label="事件" align="center" min-width="180" />
<el-table-column prop="description" label="内容描述" align="center" min-width="180" />
<el-table-column prop="create_time" label="事件发生时间" align="center" min-width="180">
<template slot-scope="scope">
<div>{{ scope.row.create_time | parseTime }}</div>
</template>
</el-table-column>
<el-table-column prop="" label="操作" align="center" min-width="100">
<el-table-column prop="downloadLink" label="操作" align="center" min-width="100">
<template slot-scope="scope">
<el-button v-if="scope.row.isdload===true" size="mini" style="background:#3A99FD;border:none" @click="handleListen">查看监控</el-button>
<el-button v-if="scope.row.isdload===false" size="mini" style="background:#FD8042;border:none" @click="handleListen">重新下载</el-button>
<el-button v-if="scope.row.downloadLink" size="mini" style="background:#3A99FD;border:none" @click="handleListen(scope.row.downloadLink)">查看监控</el-button>
<el-button v-if="!scope.row.downloadLink" size="mini" style="background:#FD8042;border:none" @click="handleListen(scope.row.downloadLink)">重新下载</el-button>
</template>
</el-table-column>
</el-table>
@ -56,6 +57,7 @@ import CRUD, { presenter, crud, header } from '@crud/crud'
import DateRangePicker from '@/components/DateRangePicker'
import pagination from '@crud/Pagination'
import data1 from '../module/data1'
import { cameraDownload } from '@/api/storeManage/listenManage'
// import qs from 'qs'
export default {
name: 'VideoListen',
@ -63,19 +65,20 @@ export default {
mixins: [presenter(), crud(), header()],
cruds() {
return CRUD({
url: 'api/videomonitorng/list'
url: 'api/videos/list',
optShow: {}
})
},
data() {
return {
tableData: [],
lookVisible: false,
optionVal: 0,
optionVal: '全部',
options: [
{ value: 0, label: '全部' },
{ value: 1, label: '密集架开架' },
{ value: 2, label: '密集架报警' },
{ value: 3, label: '通道门报警' }
{ value: '全部', label: '全部' },
{ value: '密集架开架', label: '密集架开架' },
{ value: '密集架报警', label: '密集架报警' },
{ value: '通道门报警', label: '通道门报警' }
],
queryTime: null
}
@ -84,17 +87,39 @@ export default {
this.tableData = data1.rows
},
methods: {
cell({ row, columnIndex }) {
if (row.isdload === true && columnIndex === 1) {
return 'text-green'
} else if (row.isdload === false && columnIndex === 1) {
return 'text-red'
// cell({ row, columnIndex }) {
// if (row.isdload === true && columnIndex === 1) {
// return 'text-green'
// } else if (row.isdload === false && columnIndex === 1) {
// return 'text-red'
// }
// },
[CRUD.HOOK.beforeRefresh]() {
// this.crud.downloadLoading = true
this.crud.query.event = null
this.crud.query.createTime = null
if (this.optionVal === '全部') {
this.crud.query.event = null
} else {
this.crud.query.event = this.optionVal
}
// this.crud.query.blurry = this.keyWord
if (this.queryTime) {
this.crud.query.createTime = this.queryTime
} else {
this.crud.query.createTime = null
}
},
//
handleListen() {
this.lookVisible = true
handleListen(row) {
// this.lookVisible = true
console.log(row)
const params = {
'fileName': '1662714646.ts'
}
cameraDownload(params).then(res => {
console.log(res)
})
}
}
}
@ -103,12 +128,12 @@ export default {
<style lang="scss" scoped>
@import '~@/assets/styles/lend-manage.scss';
@import "~@/assets/styles/archives-manage.scss";
.text-green .text{
color: #1AAE93;
}
.text-red .text{
color:#F65163;
}
// .text-green .text{
// color: #1AAE93;
// }
// .text-red .text{
// color:#F65163;
// }
.head-container{
.date-item{
width: 350px !important;

Loading…
Cancel
Save