|
|
|
@ -77,6 +77,14 @@
|
|
|
|
|
<el-table-column label="监控单元类型" align="center" prop="monitorUnitTypeName"/>
|
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-plus"
|
|
|
|
|
@click="addProp(scope.row)"
|
|
|
|
|
v-hasPermi="['business:monitorUnit:edit']"
|
|
|
|
|
>绑定属性
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
@ -112,7 +120,7 @@
|
|
|
|
|
<el-input v-model="form.monitorUnitName" placeholder="请输入监控单元名称"/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="所属场景" prop="sceneId">
|
|
|
|
|
<el-select v-model="form.sceneId" placeholder="请选择" @input="editedSceneChange" style="width: 100%">
|
|
|
|
|
<el-select v-model="form.sceneId" placeholder="请选择" @input="editedSceneChange" style="width: 100%">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="(scene, index) in editedScenes"
|
|
|
|
|
:key="index"
|
|
|
|
@ -128,7 +136,7 @@
|
|
|
|
|
placeholder="请选择父级监控单元"/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="监控单元类型" prop="monitorUnitTypeId">
|
|
|
|
|
<el-select v-model="form.monitorUnitTypeId" placeholder="请选择" style="width: 100%">
|
|
|
|
|
<el-select v-model="form.monitorUnitTypeId" placeholder="请选择" style="width: 100%">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="(monitorUnitType, index) in editedMonitorUnitTypes"
|
|
|
|
|
:key="index"
|
|
|
|
@ -199,13 +207,87 @@
|
|
|
|
|
<el-button @click="cancel">取 消</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog title="修改属性" :visible.sync="propDialog" width="500px" append-to-body>
|
|
|
|
|
|
|
|
|
|
<el-row :gutter="10" class="mb8">
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
plain
|
|
|
|
|
icon="el-icon-plus"
|
|
|
|
|
size="mini"
|
|
|
|
|
@click="propAdd"
|
|
|
|
|
>新增
|
|
|
|
|
</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
<el-table
|
|
|
|
|
:data="propList"
|
|
|
|
|
>
|
|
|
|
|
<el-table-column label="属性名称" prop="attributeName"/>
|
|
|
|
|
<el-table-column label="属性值" prop="attributeValue"/>
|
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-edit"
|
|
|
|
|
@click="propUpdate(scope.row)"
|
|
|
|
|
>修改
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-delete"
|
|
|
|
|
@click="propDelete(scope.row)"
|
|
|
|
|
>删除
|
|
|
|
|
</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="propDialog = false;propList = []">关 闭</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog :title="title1" :visible.sync="addPropDialog" width="500px" append-to-body>
|
|
|
|
|
<el-form ref="form" :model="propForm" :rules="rules" label-width="108px">
|
|
|
|
|
<el-form-item label="id" prop="attributeId" v-if="false">
|
|
|
|
|
<el-input v-model="propForm.attributeId"/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="属性名称" prop="attributeName">
|
|
|
|
|
<el-input v-model="propForm.attributeName" placeholder="请输入属性名称"/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="属性值" prop="attributeValue">
|
|
|
|
|
<el-input v-model="propForm.attributeValue" placeholder="请输入属性值"/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button type="primary" @click="propSubmitForm">确 定</el-button>
|
|
|
|
|
<el-button @click="propCancel">取 消</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import {
|
|
|
|
|
listMonitorUnit, getMonitorUnit, delMonitorUnit, addMonitorUnit, updateMonitorUnit
|
|
|
|
|
, getMonitorUnitTypes, getScenes, getEditedScenes,getEditedMonitorUnits
|
|
|
|
|
listMonitorUnit,
|
|
|
|
|
getMonitorUnit,
|
|
|
|
|
delMonitorUnit,
|
|
|
|
|
addMonitorUnit,
|
|
|
|
|
updateMonitorUnit,
|
|
|
|
|
getMonitorUnitTypes,
|
|
|
|
|
getScenes,
|
|
|
|
|
getEditedScenes,
|
|
|
|
|
getEditedMonitorUnits,
|
|
|
|
|
addUnitAttribute,
|
|
|
|
|
selectAttributeByUnitId,
|
|
|
|
|
updateAttributeByUniitId,
|
|
|
|
|
deleteAttributeByUniitId
|
|
|
|
|
} from "@/api/business/monitorUnit";
|
|
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
|
@ -241,6 +323,12 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
propDialog: false,
|
|
|
|
|
propList: [],
|
|
|
|
|
addPropDialog: false,
|
|
|
|
|
propForm: {},
|
|
|
|
|
title1: '',
|
|
|
|
|
propQuery:{},
|
|
|
|
|
// 遮罩层
|
|
|
|
|
loading: true,
|
|
|
|
|
// 显示搜索条件
|
|
|
|
@ -418,7 +506,7 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
/** 新增按钮操作 */
|
|
|
|
|
handleAdd(row) {
|
|
|
|
|
this.sceneDisable= false;
|
|
|
|
|
this.sceneDisable = false;
|
|
|
|
|
this.getEditedScenes();
|
|
|
|
|
this.reset();
|
|
|
|
|
if (row != null && row.monitorUnitId) {
|
|
|
|
@ -442,7 +530,7 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
/** 修改按钮操作 */
|
|
|
|
|
handleUpdate(row) {
|
|
|
|
|
this.sceneDisable= true;
|
|
|
|
|
this.sceneDisable = true;
|
|
|
|
|
this.getEditedScenes();
|
|
|
|
|
this.reset();
|
|
|
|
|
if (row != null) {
|
|
|
|
@ -589,6 +677,72 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
return strs != '' ? strs.substr(0, strs.length - 1) : '';
|
|
|
|
|
},
|
|
|
|
|
addProp(e) {
|
|
|
|
|
this.propQuery = e
|
|
|
|
|
this.propDialog = true
|
|
|
|
|
selectAttributeByUnitId({monitorUnitId: e.monitorUnitId}).then(res => {
|
|
|
|
|
this.propList = res.data
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
propAdd() {
|
|
|
|
|
this.addPropDialog = true
|
|
|
|
|
this.title1 = '添加属性'
|
|
|
|
|
},
|
|
|
|
|
propDelete(e){
|
|
|
|
|
this.$confirm('确认删除该属性?', '提示', {
|
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
|
type: 'warning'
|
|
|
|
|
}).then(() => {
|
|
|
|
|
deleteAttributeByUniitId(e.attributeId).then(v=>{
|
|
|
|
|
this.$message({
|
|
|
|
|
type: 'success',
|
|
|
|
|
message: '删除成功!'
|
|
|
|
|
});
|
|
|
|
|
selectAttributeByUnitId({monitorUnitId: this.propQuery.monitorUnitId}).then(res => {
|
|
|
|
|
this.propList = res.data
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
this.$message({
|
|
|
|
|
type: 'info',
|
|
|
|
|
message: '已取消删除'
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
propUpdate(e){
|
|
|
|
|
this.addPropDialog = true
|
|
|
|
|
this.title1 = '修改属性'
|
|
|
|
|
this.propForm = JSON.parse(JSON.stringify(e))
|
|
|
|
|
},
|
|
|
|
|
async propSubmitForm(){
|
|
|
|
|
if(this.propForm.attributeId){
|
|
|
|
|
await updateAttributeByUniitId({
|
|
|
|
|
...this.propForm,
|
|
|
|
|
monitorUnitId:this.propQuery.monitorUnitId
|
|
|
|
|
}).then(e=>{
|
|
|
|
|
this.$modal.msgSuccess("修改成功");
|
|
|
|
|
this.addPropDialog = false
|
|
|
|
|
this.propForm = {}
|
|
|
|
|
})
|
|
|
|
|
}else{
|
|
|
|
|
await addUnitAttribute({
|
|
|
|
|
...this.propForm,
|
|
|
|
|
monitorUnitId:this.propQuery.monitorUnitId
|
|
|
|
|
}).then(e=>{
|
|
|
|
|
this.$modal.msgSuccess("添加成功");
|
|
|
|
|
this.addPropDialog = false
|
|
|
|
|
this.propForm = {}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
selectAttributeByUnitId({monitorUnitId: this.propQuery.monitorUnitId}).then(res => {
|
|
|
|
|
this.propList = res.data
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
propCancel(){
|
|
|
|
|
this.addPropDialog = false
|
|
|
|
|
this.propForm = {}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|