|
|
@ -1,6 +1,6 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div class="app-container">
|
|
|
|
<div class="app-container">
|
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="108px">
|
|
|
|
<el-form-item label="监控单元名称" prop="monitorUnitName">
|
|
|
|
<el-form-item label="监控单元名称" prop="monitorUnitName">
|
|
|
|
<el-input
|
|
|
|
<el-input
|
|
|
|
v-model="queryParams.monitorUnitName"
|
|
|
|
v-model="queryParams.monitorUnitName"
|
|
|
@ -9,72 +9,30 @@
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="所属场景,关联hw_scene表的scene_id字段" prop="sceneId">
|
|
|
|
<el-form-item label="所属场景" prop="sceneId">
|
|
|
|
<el-input
|
|
|
|
<el-select v-model="queryParams.sceneId" placeholder="请选择">
|
|
|
|
v-model="queryParams.sceneId"
|
|
|
|
<el-option
|
|
|
|
placeholder="请输入所属场景,关联hw_scene表的scene_id字段"
|
|
|
|
v-for="(scene, index) in scenes"
|
|
|
|
clearable
|
|
|
|
:key="index"
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
:label="scene.sceneName"
|
|
|
|
/>
|
|
|
|
:value="scene.sceneId"
|
|
|
|
</el-form-item>
|
|
|
|
></el-option>
|
|
|
|
<el-form-item label="父级监控单元ID" prop="parentId">
|
|
|
|
</el-select>
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.parentId"
|
|
|
|
|
|
|
|
placeholder="请输入父级监控单元ID"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="监控单元类型ID" prop="monitorUnitTypeId">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.monitorUnitTypeId"
|
|
|
|
|
|
|
|
placeholder="请输入监控单元类型ID"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="区域ID,关联表hw_area字段area_id" prop="areaId">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.areaId"
|
|
|
|
|
|
|
|
placeholder="请输入区域ID,关联表hw_area字段area_id"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="详细地址" prop="monitorAddress">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.monitorAddress"
|
|
|
|
|
|
|
|
placeholder="请输入详细地址"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="监控单元图片地址" prop="monitorPic">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.monitorPic"
|
|
|
|
|
|
|
|
placeholder="请输入监控单元图片地址"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="保存周期(单位:天),暂时不用,在场景中创建测试环境。" prop="preserveTime">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="queryParams.preserveTime"
|
|
|
|
|
|
|
|
placeholder="请输入保存周期(单位:天),暂时不用,在场景中创建测试环境。"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="预留字段" prop="monitorUnitField">
|
|
|
|
<el-form-item label="监控单元类型" prop="monitorUnitTypeId">
|
|
|
|
<el-input
|
|
|
|
<el-select v-model="queryParams.monitorUnitTypeId" placeholder="请选择">
|
|
|
|
v-model="queryParams.monitorUnitField"
|
|
|
|
<el-option
|
|
|
|
placeholder="请输入预留字段"
|
|
|
|
v-for="(monitorUnitType, index) in monitorUnitTypes"
|
|
|
|
clearable
|
|
|
|
:key="index"
|
|
|
|
@keyup.enter.native="handleQuery"
|
|
|
|
:label="monitorUnitType.monitorUnitTypeName"
|
|
|
|
/>
|
|
|
|
:value="monitorUnitType.monitorUnitTypeId"
|
|
|
|
|
|
|
|
></el-option>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item>
|
|
|
|
<el-form-item>
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
</el-form>
|
|
|
@ -88,7 +46,8 @@
|
|
|
|
size="mini"
|
|
|
|
size="mini"
|
|
|
|
@click="handleAdd"
|
|
|
|
@click="handleAdd"
|
|
|
|
v-hasPermi="['business:monitorUnit:add']"
|
|
|
|
v-hasPermi="['business:monitorUnit:add']"
|
|
|
|
>新增</el-button>
|
|
|
|
>新增
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="1.5">
|
|
|
|
<el-col :span="1.5">
|
|
|
|
<el-button
|
|
|
|
<el-button
|
|
|
@ -97,7 +56,8 @@
|
|
|
|
icon="el-icon-sort"
|
|
|
|
icon="el-icon-sort"
|
|
|
|
size="mini"
|
|
|
|
size="mini"
|
|
|
|
@click="toggleExpandAll"
|
|
|
|
@click="toggleExpandAll"
|
|
|
|
>展开/折叠</el-button>
|
|
|
|
>展开/折叠
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
|
</el-row>
|
|
|
|
</el-row>
|
|
|
@ -110,17 +70,9 @@
|
|
|
|
:default-expand-all="isExpandAll"
|
|
|
|
:default-expand-all="isExpandAll"
|
|
|
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
|
|
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<el-table-column label="监控单元名称" prop="monitorUnitName" />
|
|
|
|
<el-table-column label="监控单元名称" prop="monitorUnitName"/>
|
|
|
|
<el-table-column label="所属场景,关联hw_scene表的scene_id字段" align="center" prop="sceneId" />
|
|
|
|
<el-table-column label="所属场景" align="center" prop="sceneName"/>
|
|
|
|
<el-table-column label="父级监控单元ID" align="center" prop="parentId" />
|
|
|
|
<el-table-column label="监控单元类型" align="center" prop="monitorUnitTypeName"/>
|
|
|
|
<el-table-column label="监控单元类型ID" align="center" prop="monitorUnitTypeId" />
|
|
|
|
|
|
|
|
<el-table-column label="区域ID,关联表hw_area字段area_id" align="center" prop="areaId" />
|
|
|
|
|
|
|
|
<el-table-column label="详细地址" align="center" prop="monitorAddress" />
|
|
|
|
|
|
|
|
<el-table-column label="监控单元图片地址" align="center" prop="monitorPic" />
|
|
|
|
|
|
|
|
<el-table-column label="保存周期(单位:天),暂时不用,在场景中创建测试环境。" align="center" prop="preserveTime" />
|
|
|
|
|
|
|
|
<el-table-column label="场景描述" align="center" prop="remark" />
|
|
|
|
|
|
|
|
<el-table-column label="状态" align="center" prop="monitorUnitStatus" />
|
|
|
|
|
|
|
|
<el-table-column label="预留字段" align="center" prop="monitorUnitField" />
|
|
|
|
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
|
|
<el-button
|
|
|
@ -129,58 +81,115 @@
|
|
|
|
icon="el-icon-edit"
|
|
|
|
icon="el-icon-edit"
|
|
|
|
@click="handleUpdate(scope.row)"
|
|
|
|
@click="handleUpdate(scope.row)"
|
|
|
|
v-hasPermi="['business:monitorUnit:edit']"
|
|
|
|
v-hasPermi="['business:monitorUnit:edit']"
|
|
|
|
>修改</el-button>
|
|
|
|
>修改
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
<el-button
|
|
|
|
<el-button
|
|
|
|
size="mini"
|
|
|
|
size="mini"
|
|
|
|
type="text"
|
|
|
|
type="text"
|
|
|
|
icon="el-icon-plus"
|
|
|
|
icon="el-icon-plus"
|
|
|
|
@click="handleAdd(scope.row)"
|
|
|
|
@click="handleAdd(scope.row)"
|
|
|
|
v-hasPermi="['business:monitorUnit:add']"
|
|
|
|
v-hasPermi="['business:monitorUnit:add']"
|
|
|
|
>新增</el-button>
|
|
|
|
>新增
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
<el-button
|
|
|
|
<el-button
|
|
|
|
size="mini"
|
|
|
|
size="mini"
|
|
|
|
type="text"
|
|
|
|
type="text"
|
|
|
|
icon="el-icon-delete"
|
|
|
|
icon="el-icon-delete"
|
|
|
|
@click="handleDelete(scope.row)"
|
|
|
|
@click="handleDelete(scope.row)"
|
|
|
|
v-hasPermi="['business:monitorUnit:remove']"
|
|
|
|
v-hasPermi="['business:monitorUnit:remove']"
|
|
|
|
>删除</el-button>
|
|
|
|
>删除
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 添加或修改监控单元对话框 -->
|
|
|
|
<!-- 添加或修改监控单元对话框 -->
|
|
|
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
|
|
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="108px">
|
|
|
|
<el-form-item label="监控单元名称" prop="monitorUnitName">
|
|
|
|
<el-form-item label="监控单元名称" prop="monitorUnitName">
|
|
|
|
<el-input v-model="form.monitorUnitName" placeholder="请输入监控单元名称" />
|
|
|
|
<el-input v-model="form.monitorUnitName" placeholder="请输入监控单元名称"/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="所属场景,关联hw_scene表的scene_id字段" prop="sceneId">
|
|
|
|
<el-form-item label="所属场景" prop="sceneId">
|
|
|
|
<el-input v-model="form.sceneId" placeholder="请输入所属场景,关联hw_scene表的scene_id字段" />
|
|
|
|
<el-select v-model="form.sceneId" placeholder="请选择" :disabled="sceneDisable">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="(scene, index) in editedScenes"
|
|
|
|
|
|
|
|
:key="index"
|
|
|
|
|
|
|
|
:label="scene.sceneName"
|
|
|
|
|
|
|
|
:value="scene.sceneId"
|
|
|
|
|
|
|
|
:disabled="scene.selectedDisable && scene.selectedDisable == 1"
|
|
|
|
|
|
|
|
></el-option>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="父级监控单元ID" prop="parentId">
|
|
|
|
<el-form-item label="父级监控单元" prop="parentId">
|
|
|
|
<treeselect v-model="form.parentId" :options="monitorUnitOptions" :normalizer="normalizer" placeholder="请选择父级监控单元ID" />
|
|
|
|
<treeselect v-model="form.parentId" :options="monitorUnitOptions" :normalizer="normalizer"
|
|
|
|
|
|
|
|
placeholder="请选择父级监控单元ID"/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="监控单元类型ID" prop="monitorUnitTypeId">
|
|
|
|
<el-form-item label="监控单元类型" prop="monitorUnitTypeId">
|
|
|
|
<el-input v-model="form.monitorUnitTypeId" placeholder="请输入监控单元类型ID" />
|
|
|
|
<el-select v-model="form.monitorUnitTypeId" placeholder="请选择">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="(monitorUnitType, index) in editedMonitorUnitTypes"
|
|
|
|
|
|
|
|
:key="index"
|
|
|
|
|
|
|
|
:label="monitorUnitType.monitorUnitTypeName"
|
|
|
|
|
|
|
|
:value="monitorUnitType.monitorUnitTypeId"
|
|
|
|
|
|
|
|
></el-option>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="区域ID,关联表hw_area字段area_id" prop="areaId">
|
|
|
|
<!--el-form-item label="区域ID,关联表hw_area字段area_id" prop="areaId">
|
|
|
|
<el-input v-model="form.areaId" placeholder="请输入区域ID,关联表hw_area字段area_id" />
|
|
|
|
<el-input v-model="form.areaId" placeholder="请输入区域ID,关联表hw_area字段area_id" />
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item-->
|
|
|
|
<el-form-item label="详细地址" prop="monitorAddress">
|
|
|
|
<el-form-item label="详细地址" prop="monitorAddress">
|
|
|
|
<el-input v-model="form.monitorAddress" placeholder="请输入详细地址" />
|
|
|
|
<el-input v-model="form.monitorAddress" placeholder="请输入详细地址"/>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="监控单元图片地址" prop="monitorPic">
|
|
|
|
|
|
|
|
<el-input v-model="form.monitorPic" placeholder="请输入监控单元图片地址" />
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="保存周期(单位:天),暂时不用,在场景中创建测试环境。" prop="preserveTime">
|
|
|
|
|
|
|
|
<el-input v-model="form.preserveTime" placeholder="请输入保存周期(单位:天),暂时不用,在场景中创建测试环境。" />
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="场景描述" prop="remark">
|
|
|
|
<el-form-item label="场景描述" prop="remark">
|
|
|
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
|
|
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="预留字段" prop="monitorUnitField">
|
|
|
|
|
|
|
|
<el-input v-model="form.monitorUnitField" placeholder="请输入预留字段" />
|
|
|
|
<el-form-item label="监控单元图片" prop="monitorPic">
|
|
|
|
|
|
|
|
<el-upload
|
|
|
|
|
|
|
|
single
|
|
|
|
|
|
|
|
:action="uploadImgUrl"
|
|
|
|
|
|
|
|
list-type="picture-card"
|
|
|
|
|
|
|
|
:limit="limit"
|
|
|
|
|
|
|
|
:on-success="handleUploadSuccess"
|
|
|
|
|
|
|
|
:before-upload="handleBeforeUpload"
|
|
|
|
|
|
|
|
:on-error="handleUploadError"
|
|
|
|
|
|
|
|
:on-exceed="handleExceed"
|
|
|
|
|
|
|
|
ref="imageUpload"
|
|
|
|
|
|
|
|
:on-remove="handleDeletePicture"
|
|
|
|
|
|
|
|
:show-file-list="true"
|
|
|
|
|
|
|
|
:headers="headers"
|
|
|
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
|
|
|
:on-preview="handlePictureCardPreview"
|
|
|
|
|
|
|
|
:class="{hide: this.fileList.length >= 1}"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
|
|
|
</el-upload>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 上传提示 -->
|
|
|
|
|
|
|
|
<div class="el-upload__tip" slot="tip" v-if="showTip">
|
|
|
|
|
|
|
|
请上传
|
|
|
|
|
|
|
|
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
|
|
|
|
|
|
|
|
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b></template>
|
|
|
|
|
|
|
|
的文件
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
|
|
|
:visible.sync="dialogVisible"
|
|
|
|
|
|
|
|
title="预览"
|
|
|
|
|
|
|
|
width="800"
|
|
|
|
|
|
|
|
append-to-body
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<img
|
|
|
|
|
|
|
|
:src="dialogImageUrl"
|
|
|
|
|
|
|
|
style="display: block; max-width: 100%; margin: 0 auto"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-form>
|
|
|
|
</el-form>
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
@ -191,15 +200,42 @@
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
import { listMonitorUnit, getMonitorUnit, delMonitorUnit, addMonitorUnit, updateMonitorUnit } from "@/api/business/monitorUnit";
|
|
|
|
import {
|
|
|
|
|
|
|
|
listMonitorUnit, getMonitorUnit, delMonitorUnit, addMonitorUnit, updateMonitorUnit
|
|
|
|
|
|
|
|
, getMonitorUnitTypes, getEditedMonitorUnitTypes, getScenes, getEditedScenes,getEditedMonitorUnits
|
|
|
|
|
|
|
|
} from "@/api/business/monitorUnit";
|
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
|
|
|
|
|
import {getToken} from "@/utils/auth";
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
export default {
|
|
|
|
name: "MonitorUnit",
|
|
|
|
name: "MonitorUnit",
|
|
|
|
components: {
|
|
|
|
components: {
|
|
|
|
Treeselect
|
|
|
|
Treeselect
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
props: {
|
|
|
|
|
|
|
|
value: [String, Object, Array],
|
|
|
|
|
|
|
|
// 图片数量限制
|
|
|
|
|
|
|
|
limit: {
|
|
|
|
|
|
|
|
type: Number,
|
|
|
|
|
|
|
|
default: 1,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 大小限制(MB)
|
|
|
|
|
|
|
|
fileSize: {
|
|
|
|
|
|
|
|
type: Number,
|
|
|
|
|
|
|
|
default: 5,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
|
|
|
|
|
|
|
fileType: {
|
|
|
|
|
|
|
|
type: Array,
|
|
|
|
|
|
|
|
default: () => ["png", "jpg", "jpeg"],
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 是否显示提示
|
|
|
|
|
|
|
|
isShowTip: {
|
|
|
|
|
|
|
|
type: Boolean,
|
|
|
|
|
|
|
|
default: true
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
// 遮罩层
|
|
|
|
// 遮罩层
|
|
|
@ -210,6 +246,14 @@ export default {
|
|
|
|
monitorUnitList: [],
|
|
|
|
monitorUnitList: [],
|
|
|
|
// 监控单元树选项
|
|
|
|
// 监控单元树选项
|
|
|
|
monitorUnitOptions: [],
|
|
|
|
monitorUnitOptions: [],
|
|
|
|
|
|
|
|
//场景列表
|
|
|
|
|
|
|
|
scenes: [],
|
|
|
|
|
|
|
|
//编辑页面场景列表
|
|
|
|
|
|
|
|
editedScenes: [],
|
|
|
|
|
|
|
|
sceneDisable: true,
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
monitorUnitTypes: [],
|
|
|
|
|
|
|
|
editedMonitorUnitTypes: [],
|
|
|
|
// 弹出层标题
|
|
|
|
// 弹出层标题
|
|
|
|
title: "",
|
|
|
|
title: "",
|
|
|
|
// 是否显示弹出层
|
|
|
|
// 是否显示弹出层
|
|
|
@ -236,24 +280,58 @@ export default {
|
|
|
|
// 表单校验
|
|
|
|
// 表单校验
|
|
|
|
rules: {
|
|
|
|
rules: {
|
|
|
|
monitorUnitName: [
|
|
|
|
monitorUnitName: [
|
|
|
|
{ required: true, message: "监控单元名称不能为空", trigger: "blur" }
|
|
|
|
{required: true, message: "监控单元名称不能为空", trigger: "blur"}
|
|
|
|
],
|
|
|
|
],
|
|
|
|
sceneId: [
|
|
|
|
sceneId: [
|
|
|
|
{ required: true, message: "所属场景,关联hw_scene表的scene_id字段不能为空", trigger: "blur" }
|
|
|
|
{required: true, message: "所属场景不能为空", trigger: "change"}
|
|
|
|
],
|
|
|
|
],
|
|
|
|
monitorUnitTypeId: [
|
|
|
|
monitorUnitTypeId: [
|
|
|
|
{ required: true, message: "监控单元类型ID不能为空", trigger: "blur" }
|
|
|
|
{required: true, message: "监控单元类型不能为空", trigger: "change"}
|
|
|
|
],
|
|
|
|
]
|
|
|
|
monitorUnitStatus: [
|
|
|
|
},
|
|
|
|
{ required: true, message: "状态不能为空", trigger: "change" }
|
|
|
|
|
|
|
|
],
|
|
|
|
number: 0,
|
|
|
|
}
|
|
|
|
uploadList: [],
|
|
|
|
|
|
|
|
dialogImageUrl: "",
|
|
|
|
|
|
|
|
dialogVisible: false,
|
|
|
|
|
|
|
|
hideUpload: false,
|
|
|
|
|
|
|
|
uploadImgUrl: process.env.VUE_APP_BASE_API + "/file/upload", // 上传的图片服务器地址
|
|
|
|
|
|
|
|
headers: {
|
|
|
|
|
|
|
|
Authorization: "Bearer " + getToken(),
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
fileList: [],
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
created() {
|
|
|
|
this.getList();
|
|
|
|
this.getList();
|
|
|
|
|
|
|
|
this.getScenes();
|
|
|
|
|
|
|
|
this.getMonitorUnitTypes();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
|
|
|
|
getScenes() {
|
|
|
|
|
|
|
|
getScenes().then(response => {
|
|
|
|
|
|
|
|
this.scenes = response.data;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getEditedScenes() {
|
|
|
|
|
|
|
|
getEditedScenes().then(response => {
|
|
|
|
|
|
|
|
this.editedScenes = response.data;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getMonitorUnitTypes() {
|
|
|
|
|
|
|
|
getMonitorUnitTypes().then(response => {
|
|
|
|
|
|
|
|
this.monitorUnitTypes = response.data;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getEditedMonitorUnitTypes() {
|
|
|
|
|
|
|
|
getEditedMonitorUnitTypes().then(response => {
|
|
|
|
|
|
|
|
this.editedMonitorUnitTypes = response.data;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/** 查询监控单元列表 */
|
|
|
|
/** 查询监控单元列表 */
|
|
|
|
getList() {
|
|
|
|
getList() {
|
|
|
|
this.loading = true;
|
|
|
|
this.loading = true;
|
|
|
@ -273,11 +351,11 @@ export default {
|
|
|
|
children: node.children
|
|
|
|
children: node.children
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
/** 查询监控单元下拉树结构 */
|
|
|
|
/** 查询监控单元下拉树结构 */
|
|
|
|
getTreeselect() {
|
|
|
|
getTreeselect() {
|
|
|
|
listMonitorUnit().then(response => {
|
|
|
|
getEditedMonitorUnits().then(response => {
|
|
|
|
this.monitorUnitOptions = [];
|
|
|
|
this.monitorUnitOptions = [];
|
|
|
|
const data = { monitorUnitId: 0, monitorUnitName: '顶级节点', children: [] };
|
|
|
|
const data = {monitorUnitId: 0, monitorUnitName: '顶级节点', children: []};
|
|
|
|
data.children = this.handleTree(response.data, "monitorUnitId", "parentId");
|
|
|
|
data.children = this.handleTree(response.data, "monitorUnitId", "parentId");
|
|
|
|
this.monitorUnitOptions.push(data);
|
|
|
|
this.monitorUnitOptions.push(data);
|
|
|
|
});
|
|
|
|
});
|
|
|
@ -320,6 +398,9 @@ export default {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
/** 新增按钮操作 */
|
|
|
|
/** 新增按钮操作 */
|
|
|
|
handleAdd(row) {
|
|
|
|
handleAdd(row) {
|
|
|
|
|
|
|
|
this.sceneDisable= false;
|
|
|
|
|
|
|
|
this.getEditedScenes();
|
|
|
|
|
|
|
|
this.getEditedMonitorUnitTypes();
|
|
|
|
this.reset();
|
|
|
|
this.reset();
|
|
|
|
this.getTreeselect();
|
|
|
|
this.getTreeselect();
|
|
|
|
if (row != null && row.monitorUnitId) {
|
|
|
|
if (row != null && row.monitorUnitId) {
|
|
|
@ -340,6 +421,9 @@ export default {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
/** 修改按钮操作 */
|
|
|
|
/** 修改按钮操作 */
|
|
|
|
handleUpdate(row) {
|
|
|
|
handleUpdate(row) {
|
|
|
|
|
|
|
|
this.sceneDisable= true;
|
|
|
|
|
|
|
|
this.getEditedScenes();
|
|
|
|
|
|
|
|
this.getEditedMonitorUnitTypes();
|
|
|
|
this.reset();
|
|
|
|
this.reset();
|
|
|
|
this.getTreeselect();
|
|
|
|
this.getTreeselect();
|
|
|
|
if (row != null) {
|
|
|
|
if (row != null) {
|
|
|
@ -349,6 +433,11 @@ export default {
|
|
|
|
this.form = response.data;
|
|
|
|
this.form = response.data;
|
|
|
|
this.open = true;
|
|
|
|
this.open = true;
|
|
|
|
this.title = "修改监控单元";
|
|
|
|
this.title = "修改监控单元";
|
|
|
|
|
|
|
|
if (response.data.monitorPic != null) {
|
|
|
|
|
|
|
|
let previewFile = {};
|
|
|
|
|
|
|
|
previewFile.url = response.data.monitorPic
|
|
|
|
|
|
|
|
this.fileList.push(previewFile);
|
|
|
|
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
/** 提交按钮 */
|
|
|
|
/** 提交按钮 */
|
|
|
@ -373,13 +462,113 @@ export default {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
/** 删除按钮操作 */
|
|
|
|
/** 删除按钮操作 */
|
|
|
|
handleDelete(row) {
|
|
|
|
handleDelete(row) {
|
|
|
|
this.$modal.confirm('是否确认删除监控单元编号为"' + row.monitorUnitId + '"的数据项?').then(function() {
|
|
|
|
this.$modal.confirm('是否确认删除监控单元编号为"' + row.monitorUnitId + '"的数据项?').then(function () {
|
|
|
|
return delMonitorUnit(row.monitorUnitId);
|
|
|
|
return delMonitorUnit(row.monitorUnitId);
|
|
|
|
}).then(() => {
|
|
|
|
}).then(() => {
|
|
|
|
this.getList();
|
|
|
|
this.getList();
|
|
|
|
this.$modal.msgSuccess("删除成功");
|
|
|
|
this.$modal.msgSuccess("删除成功");
|
|
|
|
}).catch(() => {});
|
|
|
|
}).catch(() => {
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**上传图片处理*/
|
|
|
|
|
|
|
|
// 上传前loading加载
|
|
|
|
|
|
|
|
handleBeforeUpload(file) {
|
|
|
|
|
|
|
|
let isImg = false;
|
|
|
|
|
|
|
|
if (this.fileType.length) {
|
|
|
|
|
|
|
|
let fileExtension = "";
|
|
|
|
|
|
|
|
if (file.name.lastIndexOf(".") > -1) {
|
|
|
|
|
|
|
|
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
isImg = this.fileType.some(type => {
|
|
|
|
|
|
|
|
if (file.type.indexOf(type) > -1) return true;
|
|
|
|
|
|
|
|
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
|
|
|
|
|
|
|
|
return false;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
isImg = file.type.indexOf("image") > -1;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!isImg) {
|
|
|
|
|
|
|
|
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join("/")}图片格式文件!`);
|
|
|
|
|
|
|
|
return false;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.fileSize) {
|
|
|
|
|
|
|
|
const isLt = file.size / 1024 / 1024 < this.fileSize;
|
|
|
|
|
|
|
|
if (!isLt) {
|
|
|
|
|
|
|
|
this.$modal.msgError(`上传头像图片大小不能超过 ${this.fileSize} MB!`);
|
|
|
|
|
|
|
|
return false;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
this.$modal.loading("正在上传图片,请稍候...");
|
|
|
|
|
|
|
|
this.number++;
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
checkPicture(file) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 文件个数超出
|
|
|
|
|
|
|
|
handleExceed() {
|
|
|
|
|
|
|
|
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} !`);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 上传成功回调
|
|
|
|
|
|
|
|
handleUploadSuccess(res, file) {
|
|
|
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
|
|
|
this.uploadList.push(res.data.url);
|
|
|
|
|
|
|
|
this.uploadedSuccessfully();
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.number--;
|
|
|
|
|
|
|
|
this.$modal.closeLoading();
|
|
|
|
|
|
|
|
this.$modal.msgError(res.msg);
|
|
|
|
|
|
|
|
this.$refs.imageUpload.handleRemove(file);
|
|
|
|
|
|
|
|
this.uploadedSuccessfully();
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 上传结束处理
|
|
|
|
|
|
|
|
uploadedSuccessfully() {
|
|
|
|
|
|
|
|
if (this.number > 0 && this.uploadList.length === this.number) {
|
|
|
|
|
|
|
|
this.fileList = this.fileList.concat(this.uploadList);
|
|
|
|
|
|
|
|
this.uploadList = [];
|
|
|
|
|
|
|
|
this.number = 0;
|
|
|
|
|
|
|
|
this.form.monitorPic = this.fileList[0];
|
|
|
|
|
|
|
|
// this.$emit("input", this.listToString(this.fileList));
|
|
|
|
|
|
|
|
this.$modal.closeLoading();
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 删除图片
|
|
|
|
|
|
|
|
handleDeletePicture(file) {
|
|
|
|
|
|
|
|
const findex = this.fileList.map(f => f.name).indexOf(file.name);
|
|
|
|
|
|
|
|
if (findex > -1) {
|
|
|
|
|
|
|
|
this.fileList.splice(findex, 1);
|
|
|
|
|
|
|
|
// this.$emit("input", this.listToString(this.fileList));
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
this.form.monitorPic = '';
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 上传失败
|
|
|
|
|
|
|
|
handleUploadError() {
|
|
|
|
|
|
|
|
this.$modal.msgError("上传图片失败,请重试");
|
|
|
|
|
|
|
|
this.$modal.closeLoading();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 预览
|
|
|
|
|
|
|
|
handlePictureCardPreview(file) {
|
|
|
|
|
|
|
|
this.dialogImageUrl = file.url;
|
|
|
|
|
|
|
|
this.dialogVisible = true;
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 对象转成指定字符串分隔
|
|
|
|
|
|
|
|
listToString(list, separator) {
|
|
|
|
|
|
|
|
let strs = "";
|
|
|
|
|
|
|
|
separator = separator || ",";
|
|
|
|
|
|
|
|
for (let i in list) {
|
|
|
|
|
|
|
|
if (list[i].url) {
|
|
|
|
|
|
|
|
strs += list[i].url.replace(this.baseUrl, "") + separator;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
return strs != '' ? strs.substr(0, strs.length - 1) : '';
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|