xuhuajiao
8 months ago
20 changed files with 484 additions and 41 deletions
-
2src/api/storeManage/deviceManage/device.js
-
4src/views/archivesManage/caseManage/caseList/index.vue
-
43src/views/archivesManage/lendManage/components/lendArchivesList.vue
-
154src/views/archivesManage/lendManage/components/video.vue
-
2src/views/components/WarehouseWarning.vue
-
27src/views/dashboard/PanelGroup.vue
-
6src/views/environmentalScreen/index.vue
-
8src/views/home.vue
-
23src/views/storeManage/deviceManage/module/deviceDetail.vue
-
2src/views/storeManage/listenManage/index.vue
-
19src/views/storeManage/listenManage/listenConfig/index.vue
-
154src/views/storeManage/taskManage/index.vue
-
7src/views/storeManage/warehouse3D/archivesStorage/index.vue
-
2src/views/storeManage/warehouse3D/destroyedFileRoom/index.vue
-
6src/views/storeManage/warehouse3D/index.vue
-
2src/views/storeManage/warehouse3D/infoRoom/index.vue
-
6src/views/system/logManage/deviceLog/index.vue
-
24src/views/system/notifyManage/index.vue
-
2src/views/system/role/index.vue
-
30src/views/system/user/messageCenter/index.vue
@ -0,0 +1,154 @@ |
|||
<template> |
|||
<el-dialog :close-on-click-modal="false" :visible.sync="openVideoVisible" :before-close="handleClose" title="实时监控" width="1068px"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div style="flex: 1; padding: 20px; background-color:#031435;"> |
|||
<jsmpeg-player :url="wsUrl" :with-toolbar="false" /> |
|||
</div> |
|||
<div class="video-list"> |
|||
<h4>档案室</h4> |
|||
<span v-for="(item,index) in cameraData" :key="index" :class="[{'active': index === videoIndex}]" @click="changeVideo(index)">{{ item.deviceInfo.deviceName }}</span> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
// import JSMpeg from '@/components/jsmpeg' |
|||
import JsmpegPlayer from '@/components/jsmpeg-player/jsmpeg-player.vue' |
|||
import axios from 'axios' |
|||
import qs from 'qs' |
|||
export default { |
|||
components: { JsmpegPlayer }, |
|||
props: { |
|||
dialogOpen: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
cameraData: { |
|||
type: Array, |
|||
default: () => { return [] } |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
videoIndex: 0, |
|||
videoTitle: '', |
|||
camConfig: null, |
|||
player: null, |
|||
noSignal: true, |
|||
wsUrl: '' |
|||
} |
|||
}, |
|||
computed: { |
|||
rtspUrl: function() { |
|||
return 'rtsp://' + this.camConfig.deviceInfo.deviceAccount + ':' + this.camConfig.deviceInfo.devicePassword + '@' + this.camConfig.deviceInfo.deviceIp + ':554/' + this.camConfig.deviceInfo.videoRoute + '/1' |
|||
}, |
|||
openVideoVisible: { |
|||
get() { |
|||
return this.dialogOpen |
|||
}, |
|||
set(value) { |
|||
this.$emit('update:dialogOpen', value) |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
changeVideo(index) { |
|||
this.videoIndex = index |
|||
this.camConfig = this.cameraData[index] |
|||
this.play() |
|||
}, |
|||
handleClose(done) { |
|||
this.openVideoVisible = false |
|||
// this.myVideo = document.getElementById('canvas') |
|||
// this.myVideo.pause() |
|||
// $.post('http://127.0.0.1:3000/cameras/close/', { rtspUrl: $('#rtsp').val() }, function(result) { |
|||
const data = { rtspUrl: this.rtspUrl } |
|||
// console.log(process.env.VUE_APP_CAMERA_API) |
|||
const Uri = 'http://' + process.env.VUE_APP_CAMERA_API + '/cameras/close/' |
|||
axios.post(Uri, qs.stringify(data), |
|||
{ |
|||
headers: { |
|||
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' |
|||
} |
|||
} |
|||
).then(res => { |
|||
this.wsUrl = '' |
|||
done() |
|||
}) |
|||
}, |
|||
play() { |
|||
const data = { rtspUrl: this.rtspUrl, size: '1024*768', port: process.env.VUE_APP_CAMERA_API.split(':')[1], videoRoute: this.camConfig.deviceInfo.videoRoute } |
|||
const Uri = 'http://' + process.env.VUE_APP_CAMERA_API + '/cameras/' |
|||
axios.post(Uri, qs.stringify(data), |
|||
{ |
|||
headers: { |
|||
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' |
|||
} |
|||
} |
|||
).then(res => { |
|||
// res.data.port |
|||
const ip = process.env.VUE_APP_CAMERA_API.split(':')[0] |
|||
this.wsUrl = 'ws://' + ip + ':' + res.data.port |
|||
// var canvas = document.getElementById('canvas') |
|||
// const opt = { |
|||
// contianer: this.$refs['canvas-wrap'], |
|||
// poster: '0.jpg', |
|||
// onSourceEstablished: (source) => { |
|||
// console.log('onSourceEstablished') |
|||
// // this.flags.noSignal = false |
|||
// this.noSignal = false |
|||
// // clearTimeout(this.timers.noSignal) |
|||
// // this.timers.noSignal = null |
|||
// this.$emit('source-established', source) |
|||
// } |
|||
// } |
|||
// this.player = new JSMpeg.Player(this.wsUrl, opt) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style rel="stylesheet/scss" lang="scss" scoped> |
|||
::v-deep .el-dialog { |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
.el-dialog__body{ |
|||
padding: 0; |
|||
} |
|||
.setting-dialog{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
min-height: 300px; |
|||
} |
|||
} |
|||
.video-list{ |
|||
width: 200px; |
|||
padding: 20px; |
|||
background-color: #021941; |
|||
h4{ |
|||
font-size: 18px; |
|||
font-weight: bold; |
|||
color: #339CFF; |
|||
line-height: 40px; |
|||
} |
|||
span{ |
|||
display: block; |
|||
color: #339CFF; |
|||
line-height: 40px; |
|||
cursor: pointer; |
|||
&:hover{ |
|||
color: #fff; |
|||
background-image: linear-gradient(90deg, rgba(59, 160, 255, 0) 0%, rgba(42,112,177,0.3) 43%, rgba(51, 156, 255, 0) 100%);; |
|||
} |
|||
&.active{ |
|||
color: #fff; |
|||
background-image: linear-gradient(90deg, rgba(59, 160, 255, 0) 0%, rgba(42,112,177,0.3) 43%, rgba(51, 156, 255, 0) 100%);; |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,154 @@ |
|||
<template> |
|||
<div> |
|||
<div class="head-container"> |
|||
<crudOperation :permission="permission" /> |
|||
<div class="head-search" style="margin-left: 40px;"> |
|||
<!-- 搜索 --> |
|||
<el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 100px" @change="crud.toQuery"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai-fanbai" /> |
|||
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" /> |
|||
</el-select> |
|||
<el-input v-model="query.blurry" size="small" clearable placeholder="输入任务名称搜索" prefix-icon="el-icon-search" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" /> |
|||
<rrOperation /> |
|||
</div> |
|||
</div> |
|||
<div class="app-container container-wrap" style="min-height: calc(100vh - 266px)"> |
|||
<span class="right-top-line" /> |
|||
<span class="left-bottom-line" /> |
|||
<!--表格渲染--> |
|||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 300px)" @row-click="clickRowHandler" @row-dblclick="handleDbClick" @selection-change="crud.selectionChangeHandler"> |
|||
<el-table-column type="selection" width="55" align="center" /> |
|||
<el-table-column align="center" prop="username" label="任务名称" /> |
|||
<el-table-column align="center" prop="username" label="任务类型" /> |
|||
<el-table-column align="center" prop="username" label="目标设备" /> |
|||
<el-table-column align="center" prop="username" label="计划" /> |
|||
<el-table-column prop="createTime" label="下次运行"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.createTime | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="createTime" label="最后运行"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.createTime | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="状态" prop="enabled"> |
|||
<template slot-scope="scope"> |
|||
<el-switch v-model="scope.row.enabled" active-color="#409EFF" inactive-color="#F56C6C" @change="changeEnabled(scope.row, scope.row.enabled)" /> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination /> |
|||
</div> |
|||
<!-- form --> |
|||
<el-dialog :title="formTitle" :visible.sync="formVisible" :before-close="handleClose"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div class="dialog-delt"> |
|||
111 |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text">取消</el-button> |
|||
<el-button type="primary" @click.native="formVisible = false">确定</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import crudRoles from '@/api/system/role' |
|||
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
|||
import rrOperation from '@crud/RR.operation' |
|||
import crudOperation from '@crud/CRUD.operation' |
|||
import pagination from '@crud/Pagination' |
|||
|
|||
const defaultForm = { id: null, name: null, depts: [], description: null, dataScope: '全部', level: 3 } |
|||
|
|||
export default { |
|||
name: 'TaskManage', |
|||
components: { rrOperation, crudOperation, pagination }, |
|||
cruds() { |
|||
return CRUD({ title: '计划任务管理', url: 'api/roles', crudMethod: crudRoles, |
|||
optShow: { |
|||
add: true, |
|||
edit: true, |
|||
del: true, |
|||
download: true, |
|||
group: false |
|||
} |
|||
}) |
|||
}, |
|||
mixins: [presenter(), header(), form(defaultForm), crud()], |
|||
data() { |
|||
return { |
|||
formVisible: false, |
|||
formTitle: '新增任务', |
|||
enabledTypeOptions: [ |
|||
{ key: 'true', display_name: '激活' }, |
|||
{ key: 'false', display_name: '锁定' } |
|||
], |
|||
permission: { |
|||
add: ['admin', 'task:add'], |
|||
edit: ['admin', 'task:edit'], |
|||
del: ['admin', 'task:del'] |
|||
} |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
methods: { |
|||
// 新增与编辑前做的操作 |
|||
[CRUD.HOOK.afterToCU](crud, form) { |
|||
}, |
|||
// 新增前将多选的值设置为空 |
|||
[CRUD.HOOK.beforeToAdd]() { |
|||
}, |
|||
// 初始化编辑时候的角色与岗位 |
|||
[CRUD.HOOK.beforeToEdit](crud, form) { |
|||
}, |
|||
// 提交前做的操作 |
|||
[CRUD.HOOK.afterValidateCU](crud) { |
|||
return true |
|||
}, |
|||
clickRowHandler(row) { |
|||
this.$refs.table.toggleRowSelection(row) |
|||
}, |
|||
// 双击详情 |
|||
handleDbClick(row) { |
|||
this.$refs.DetailsDom.detailsVisible = true |
|||
}, |
|||
// 改变状态 |
|||
changeEnabled(data, val) { |
|||
this.$confirm('此操作将 "' + this.dict.label.user_status[val] + '" ' + data.username + ', 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
// crudRoles.edit(data).then(res => { |
|||
// this.crud.notify(this.dict.label.user_status[val] + '成功', CRUD.NOTIFICATION_TYPE.SUCCESS) |
|||
// }).catch(() => { |
|||
// data.enabled = !data.enabled |
|||
// }) |
|||
}).catch(() => { |
|||
data.enabled = !data.enabled |
|||
}) |
|||
}, |
|||
handleClose() { |
|||
this.formVisible = false |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
::v-deep .head-container{ |
|||
display: flex; |
|||
padding-bottom: 0; |
|||
} |
|||
.head-search{ |
|||
margin-bottom:0 ; |
|||
} |
|||
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue