|
|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
|
|
|
- <el-form-item label="名称" prop="cameraName">
|
|
|
+ <el-form-item label="设备名称" prop="cameraName">
|
|
|
<el-input
|
|
|
v-model="queryParams.cameraName"
|
|
|
placeholder="请输入摄像头名称"
|
|
|
@@ -122,6 +122,17 @@
|
|
|
>导出
|
|
|
</el-button>
|
|
|
</el-col>
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ icon="el-icon-camera"
|
|
|
+ size="mini"
|
|
|
+ @click="handleAddAll"
|
|
|
+ v-hasPermi="['camera:camera:edit']"
|
|
|
+ >批量绑定
|
|
|
+ </el-button>
|
|
|
+ </el-col>
|
|
|
<!-- <el-col :span="1.5">-->
|
|
|
<!-- <el-button-->
|
|
|
<!-- icon="el-icon-refresh"-->
|
|
|
@@ -547,6 +558,52 @@
|
|
|
></aidevicedept>
|
|
|
</el-dialog>
|
|
|
|
|
|
+ <!-- 批量绑定摄像头对话框 -->
|
|
|
+ <el-dialog :title="title" :visible.sync="showCameraDeptAll" width="500px" append-to-body>
|
|
|
+ <el-form ref="form" :model="form" :rules="rules" label-width="85px">
|
|
|
+ <el-form-item label="摄像头名称">
|
|
|
+ <el-input
|
|
|
+ v-model="form.deviceName"
|
|
|
+ placeholder="请输入摄像头名称"
|
|
|
+ clearable
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="摄像头用途" >
|
|
|
+ <el-select v-model="form.id" placeholder="摄像头用途" style="width: 375px;" clearable>
|
|
|
+ <el-option
|
|
|
+ v-for="dict in dict.type.camera_use"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="部门名称" prop="mapDeptId">
|
|
|
+ <treeselect :options="deptOptions" v-model="form.mapDeptId" :show-count="true" placeholder="请选择部门名称"
|
|
|
+ @select="hx"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="部门类型" prop="deptProtype">
|
|
|
+ <el-select v-model="form.deptProtype" placeholder="请输入部门类型">
|
|
|
+ <el-option
|
|
|
+ v-for="item in deptProtypeOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :value="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="指挥中心" prop="isCommandCenter">
|
|
|
+ <el-radio v-model='form.isCommandCenter' :label='0'>否</el-radio>
|
|
|
+ <el-radio v-model='form.isCommandCenter' :label='1'>是</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitFormAll('add')">绑 定</el-button>
|
|
|
+ <el-button type="warning" @click="submitFormAll('delete')">解 绑</el-button>
|
|
|
+ <el-button @click="showCameraDeptAll=false">关 闭</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
<!-- 事件管理弹框 -->
|
|
|
<el-dialog :title="titleCameraEvent" :visible.sync="showCameraEvent" @close="closeDialog">
|
|
|
<!--<cameraevent v-if="showCameraEvent" ref="cameraEvent" :sonId="sonIdValue"
|
|
|
@@ -593,6 +650,9 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { addAidevicedeptAll, deleteAidevicedeptAll } from "@/api/centerMonitor/aidevicedept/aidevicedept";
|
|
|
+import {treeselect} from "@/api/system/dept";
|
|
|
+import Treeselect from "@riophae/vue-treeselect";
|
|
|
import {
|
|
|
listCamera,
|
|
|
listCameraByDept,
|
|
|
@@ -636,6 +696,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
+ Treeselect,
|
|
|
deptselector,
|
|
|
supermap,
|
|
|
camerachannel,
|
|
|
@@ -693,6 +754,8 @@ export default {
|
|
|
total: 0,
|
|
|
// 摄像头表格数据
|
|
|
cameraList: [],
|
|
|
+ // 部门树选项
|
|
|
+ deptOptions: undefined,
|
|
|
// 弹出层标题
|
|
|
title: '',
|
|
|
// 是否显示弹出层
|
|
|
@@ -712,6 +775,8 @@ export default {
|
|
|
titleCameraLog: '',
|
|
|
// 部门
|
|
|
showCameraDept: false,
|
|
|
+ // 所有部门
|
|
|
+ showCameraDeptAll: false,
|
|
|
titleCameraDept: '',
|
|
|
// 事件
|
|
|
showCameraEvent: false,
|
|
|
@@ -779,8 +844,21 @@ export default {
|
|
|
cameraImages: [],
|
|
|
cameraImagesList: []
|
|
|
},
|
|
|
+ deptProtypeOptions: [
|
|
|
+ {value: "1", label: '责任单位,接收推送'},
|
|
|
+ {value: "2", label: '查看单位'}
|
|
|
+ ],
|
|
|
// 表单校验
|
|
|
rules: {
|
|
|
+ mapDeptId: [
|
|
|
+ { required: true, message: "部门名称不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ deptProtype: [
|
|
|
+ { required: true, message: "部门类型不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ isCommandCenter: [
|
|
|
+ { required: true, message: "请选择是否指挥中心", trigger: "blur" }
|
|
|
+ ],
|
|
|
cameraName: [
|
|
|
{required: true, message: '摄像头名称不能为空', trigger: 'blur'}
|
|
|
],
|
|
|
@@ -933,6 +1011,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
+ this.getTreeselect();
|
|
|
//此处必须第二次调用 防止组件注册后直接F5刷新页面 导致不走getList方法
|
|
|
this.getList()
|
|
|
/** ----------------------------------摄像头预览开始------------------------------------- */
|
|
|
@@ -949,6 +1028,17 @@ export default {
|
|
|
}, 2000)
|
|
|
},
|
|
|
methods: {
|
|
|
+ /** 查询部门下拉树结构 */
|
|
|
+ getTreeselect() {
|
|
|
+ treeselect().then(response => {
|
|
|
+ this.deptOptions = response.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //部门ID、部门名称赋值
|
|
|
+ hx(node) {
|
|
|
+ this.form.mapDeptId = node.id;
|
|
|
+ this.form.mapDeptName = node.label
|
|
|
+ },
|
|
|
isFormIncomplete() {
|
|
|
return !this.form.cameraFactory || !this.form.cameraName || !this.form.cameraRegion || !this.form.cameraRadius || !this.form.height || !this.form.longitude || !this.form.latitude
|
|
|
},
|
|
|
@@ -1146,6 +1236,12 @@ export default {
|
|
|
this.open = true
|
|
|
this.title = '添加摄像头'
|
|
|
},
|
|
|
+ /** 批量绑定按钮操作 */
|
|
|
+ handleAddAll() {
|
|
|
+ this.reset()
|
|
|
+ this.showCameraDeptAll = true
|
|
|
+ this.title = '批量绑定摄像头'
|
|
|
+ },
|
|
|
/** 修改按钮操作 */
|
|
|
handleUpdate(row) {
|
|
|
this.reset()
|
|
|
@@ -1895,6 +1991,26 @@ export default {
|
|
|
},
|
|
|
/** ----------------------------------海康摄像头预览结束------------------------------------- */
|
|
|
|
|
|
+ /** 批量绑定提交按钮 */
|
|
|
+ submitFormAll(type) {
|
|
|
+ this.$refs["form"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ if(type == "add"){
|
|
|
+ this.form.deviceType = "device_type_1";
|
|
|
+ addAidevicedeptAll(this.form).then(response => {
|
|
|
+ this.$modal.msgSuccess("批量绑定成功");
|
|
|
+ // this.showCameraDeptAll = false; // 支持继续绑定及解绑,用户手动关闭
|
|
|
+ // this.getDeptList();
|
|
|
+ });
|
|
|
+ }else {
|
|
|
+ this.form.deviceType = "device_type_1";
|
|
|
+ deleteAidevicedeptAll(this.form).then(response => {
|
|
|
+ this.$modal.msgSuccess("批量解绑成功");
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
/** 提交按钮 */
|
|
|
submitForm() {
|
|
|
this.$refs['form'].validate(valid => {
|