767 lines
26 KiB
Vue
767 lines
26 KiB
Vue
<template>
|
|
<el-dialog
|
|
v-loading="loading"
|
|
width="90%"
|
|
:visible.sync="dialogTableVisible"
|
|
class="ems-dialog"
|
|
title="保护方案"
|
|
:close-on-click-modal="false"
|
|
:show-close="false"
|
|
>
|
|
<el-form
|
|
v-loading="loading > 0"
|
|
ref="addTempForm"
|
|
:model="formData"
|
|
:rules="rules"
|
|
size="medium"
|
|
label-width="140px"
|
|
>
|
|
<el-form-item label="站点" prop="siteId">
|
|
<el-select
|
|
v-model="formData.siteId"
|
|
placeholder="请选择"
|
|
:style="{ width: '50%' }"
|
|
@change="changeType"
|
|
>
|
|
<el-option
|
|
:label="item.siteName"
|
|
:value="item.siteId"
|
|
v-for="(item, index) in siteList"
|
|
:key="index + 'siteOptions'"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="设备保护名称" prop="faultName">
|
|
<el-input
|
|
v-model="formData.faultName"
|
|
placeholder="请输入"
|
|
clearable
|
|
:style="{ width: '50%' }"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="处理方案描述" prop="description">
|
|
<el-input
|
|
v-model="formData.description"
|
|
type="textarea"
|
|
:rows="2"
|
|
placeholder="请输入"
|
|
clearable
|
|
:style="{ width: '50%' }"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="是否告警" prop="isAlert">
|
|
<el-checkbox
|
|
v-model="formData.isAlert"
|
|
:true-label="1"
|
|
:false-label="0"
|
|
></el-checkbox>
|
|
</el-form-item>
|
|
<el-form-item label="告警等级" prop="faultLevel">
|
|
<el-radio-group v-model="formData.faultLevel" :style="{ width: '50%' }" :disabled="mode === 'edit'">
|
|
<el-radio :label="1">等级1</el-radio>
|
|
<el-radio :label="2">等级2</el-radio>
|
|
<el-radio :label="3">等级3</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<div class="items-container">
|
|
<div class="item-title">
|
|
保护前提:
|
|
<div style="display: inline-block; margin-left: 20px">
|
|
<el-form-item label="延时" prop="faultDelaySeconds">
|
|
<el-input
|
|
v-model="formData.faultDelaySeconds"
|
|
placeholder="请输入"
|
|
clearable
|
|
:style="{ width: '200px', display: 'inline-block' }"
|
|
></el-input>
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<el-button
|
|
@click.native.prevent="addRow('protectionSettings')"
|
|
block
|
|
type="primary"
|
|
size="mini"
|
|
style="margin-bottom: 20px"
|
|
>
|
|
新增保护前提
|
|
</el-button>
|
|
</div>
|
|
<div class="item-content">
|
|
<div class="time-lists-container">
|
|
<div class="time-lists time-lists-title">
|
|
<div>设备类型</div>
|
|
<div>点位</div>
|
|
<div>故障值比较符号</div>
|
|
<div>故障值</div>
|
|
<div>释放值比较符号</div>
|
|
<div>释放值</div>
|
|
<div>关系</div>
|
|
<div>操作</div>
|
|
</div>
|
|
<div
|
|
class="time-lists"
|
|
v-for="(item, index) in protectionSettings"
|
|
:key="'protectionSettings' + index"
|
|
>
|
|
<div>
|
|
<el-cascader
|
|
v-model="item.deviceId"
|
|
:options="childOptions"
|
|
:show-all-levels="false"
|
|
@change="(v)=>handleChange(v,'protectionSettings',index)"
|
|
></el-cascader>
|
|
</div>
|
|
<div>
|
|
<el-autocomplete
|
|
v-model="item.point"
|
|
placeholder="请输入点位"
|
|
clearable
|
|
:fetch-suggestions="
|
|
(q, c) =>
|
|
querySearchAsync(q, c, index, 'protectionSettings')
|
|
"
|
|
@select="(v) => handleSelect(v, index, 'protectionSettings')"
|
|
></el-autocomplete>
|
|
</div>
|
|
|
|
<div>
|
|
<el-select v-model="item.faultOperator" placeholder="请选择">
|
|
<el-option
|
|
v-for="(value, key) in comparisonOperatorOptions"
|
|
:key="key + 'faultOperator'"
|
|
:label="key"
|
|
:value="value"
|
|
></el-option>
|
|
</el-select>
|
|
</div>
|
|
<div>
|
|
<el-input placeholder="请输入故障值" v-model="item.faultValue">
|
|
</el-input>
|
|
</div>
|
|
<div>
|
|
<el-select v-model="item.releaseOperator" placeholder="请选择">
|
|
<el-option
|
|
v-for="(value, key) in comparisonOperatorOptions"
|
|
:key="key + 'releaseOperator'"
|
|
:label="key"
|
|
:value="value"
|
|
></el-option>
|
|
</el-select>
|
|
</div>
|
|
<div>
|
|
<el-input
|
|
placeholder="请输入释放值"
|
|
v-model="item.releaseValue"
|
|
>
|
|
</el-input>
|
|
</div>
|
|
<div>
|
|
<el-select v-model="item.relationNext" placeholder="请选择">
|
|
<el-option
|
|
v-for="(value, key) in relationWithPoint"
|
|
:key="key + 'relation'"
|
|
:label="key"
|
|
:value="value"
|
|
></el-option>
|
|
</el-select>
|
|
</div>
|
|
<div>
|
|
<el-button
|
|
@click.native.prevent="deleteRow(index,'protectionSettings')"
|
|
type="warning"
|
|
size="mini"
|
|
>
|
|
删除
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="items-container">
|
|
<div class="item-title">
|
|
保护方案:
|
|
<div style="display: inline-block; margin-left: 20px">
|
|
<el-form-item label="延时" prop="releaseDelaySeconds">
|
|
<el-input
|
|
v-model="formData.releaseDelaySeconds"
|
|
placeholder="请输入"
|
|
clearable
|
|
:style="{ width: '200px', display: 'inline-block' }"
|
|
></el-input>
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<el-button
|
|
@click.native.prevent="addRow('protectionPlan')"
|
|
block
|
|
type="primary"
|
|
size="mini"
|
|
style="margin-bottom: 20px"
|
|
>
|
|
新增保护方案
|
|
</el-button>
|
|
</div>
|
|
<div class="item-content">
|
|
<div class="time-lists-container">
|
|
<div class="time-lists time-lists-title">
|
|
<div>设备类型</div>
|
|
<div>点位</div>
|
|
<div>故障值比较符号</div>
|
|
<div>故障值</div>
|
|
<div>操作</div>
|
|
</div>
|
|
<div
|
|
class="time-lists"
|
|
v-for="(item, index) in protectionPlan"
|
|
:key="'protectionPlan' + index"
|
|
>
|
|
<div>
|
|
<el-cascader
|
|
v-model="item.deviceId"
|
|
:show-all-levels="false"
|
|
:options="childOptions"
|
|
@change="(v)=>handleChange(v,'protectionPlan',index)"
|
|
></el-cascader>
|
|
</div>
|
|
<div>
|
|
<el-autocomplete
|
|
v-model="item.point"
|
|
placeholder="请输入点位"
|
|
clearable
|
|
:fetch-suggestions="
|
|
(q, c) => querySearchAsync(q, c, index, 'protectionPlan')
|
|
"
|
|
@select="(v) => handleSelect(v, index, 'protectionPlan')"
|
|
></el-autocomplete>
|
|
</div>
|
|
|
|
<div>=</div>
|
|
<div>
|
|
<el-input placeholder="请输入故障值" v-model="item.value">
|
|
</el-input>
|
|
</div>
|
|
<div>
|
|
<el-button
|
|
@click.native.prevent="deleteRow(index,'protectionPlan')"
|
|
type="warning"
|
|
size="mini"
|
|
>
|
|
删除
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
<div slot="footer">
|
|
<el-button @click="closeDialog">取消</el-button>
|
|
<el-button type="primary" @click="saveDialog">确定</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
<script>
|
|
import { mapState } from "vuex";
|
|
import { getAllSites } from "@/api/ems/zddt";
|
|
import { validText } from "@/utils/validate";
|
|
import {
|
|
updateProtectPlan,
|
|
addProtectPlan,
|
|
getProtectPlan,
|
|
getDeviceListBySiteAndCategory
|
|
} from "@/api/ems/site";
|
|
import { getAllDeviceCategory, pointFuzzyQuery } from "@/api/ems/search";
|
|
export default {
|
|
data() {
|
|
const validateText = (rule, value, callback) => {
|
|
if (value !== "" && !validText(value)) {
|
|
callback(new Error("只能输入中文、英文、数字和特殊字符!"));
|
|
} else {
|
|
callback();
|
|
}
|
|
};
|
|
return {
|
|
mode:'',
|
|
loading: 0,
|
|
childOptions:[],
|
|
protectionSettings: [],
|
|
protectionPlan: [],
|
|
dialogTableVisible: false,
|
|
siteList: [], //站点列表 从接口获取数据
|
|
formData: {
|
|
id: "", //设备唯一标识
|
|
siteId: "", //站点ID
|
|
faultName: "", //设备保护名称
|
|
isAlert: 0, //是否告警
|
|
faultLevel: 1, //告警等级
|
|
faultDelaySeconds: "", //故障延时
|
|
releaseDelaySeconds: "", //释放延时
|
|
description:'',//方案描述
|
|
},
|
|
rules: {
|
|
siteId: [
|
|
{
|
|
required: true,
|
|
message: "请选择站点",
|
|
trigger: ["blur", "change"],
|
|
},
|
|
],
|
|
faultName: [
|
|
{ required: true, message: "请输入设备保护名称", trigger: "blur" },
|
|
],
|
|
isAlert: [
|
|
{ required: true, message: "请选择是否告警", trigger: "blur" },
|
|
],
|
|
description: [
|
|
{ required: true, message: "请输入设备描述", trigger: "blur" },
|
|
{ validator: validateText, trigger: "blur" },
|
|
],
|
|
faultDelaySeconds: [
|
|
{ required: true, message: "请输入保护前提延时", trigger: "blur" },
|
|
{ validator: validateText, trigger: "blur" },
|
|
],
|
|
releaseDelaySeconds: [
|
|
{ required: true, message: "请输入保护方案延时", trigger: "blur" },
|
|
{ validator: validateText, trigger: "blur" },
|
|
],
|
|
},
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState({
|
|
communicationStatusOptions: (state) =>
|
|
state?.ems?.communicationStatusOptions || {},
|
|
deviceTypeOptions: (state) => state?.ems?.deviceTypeOptions || {},
|
|
comparisonOperatorOptions: (state) =>
|
|
state?.ems?.comparisonOperatorOptions || {},
|
|
relationWithPoint: (state) => state?.ems?.relationWithPoint || {},
|
|
}),
|
|
},
|
|
methods: {
|
|
open(id,siteId){
|
|
this.dialogTableVisible=true
|
|
this.getZdList();
|
|
this.getDeviceCategoryList().then(()=>{
|
|
if(id && siteId) {
|
|
this.getDeviceList('PCS',siteId)
|
|
this.getDeviceList('STACK',siteId)
|
|
}
|
|
});
|
|
if(id){
|
|
this.formData.id = id
|
|
this.mode = 'edit'
|
|
getProtectPlan(id).then(response => {
|
|
const data = response?.data || {}
|
|
this.formData = {
|
|
id,
|
|
siteId: data?.siteId || '', //站点ID
|
|
faultName: data?.faultName || '', //设备保护名称
|
|
isAlert: data?.isAlert || 0, //是否告警
|
|
faultLevel: data?.faultLevel || 1, //告警等级
|
|
faultDelaySeconds: data?.faultDelaySeconds || "", //故障延时
|
|
releaseDelaySeconds: data?.releaseDelaySeconds ||"", //释放延时
|
|
description: data?.description ||'',//方案描述
|
|
}
|
|
const plan =(JSON.parse(data?.protectionPlan || [])).map(item=>{
|
|
return Object.assign({},item,{
|
|
deviceId:[item.deviceCategory || '',item.deviceId || ''],
|
|
})
|
|
})
|
|
const settings =(JSON.parse(data?.protectionSettings || [])).map(item=>{
|
|
return Object.assign({},item,{
|
|
deviceId:[item.deviceCategory || '',item.deviceId || ''],
|
|
})
|
|
})
|
|
this.$nextTick(()=>{
|
|
this.protectionPlan.splice(0,0,...plan)
|
|
this.protectionSettings.splice(0,0,...settings)
|
|
})
|
|
console.log('获取设备保护详情并初始化',this.formData,this.protectionPlan,this.protectionSettings)
|
|
})
|
|
}else{
|
|
this.mode = 'add'
|
|
}
|
|
},
|
|
// 新增设备保护前提、设备保护方案
|
|
addRow(type) {
|
|
const item = type === 'protectionSettings' ? {
|
|
deviceId:[],//设备ID
|
|
deviceCategory: "",//设备类型 英文
|
|
categoryName:'',//设备类型名称 中文
|
|
point: "",//点位 英文
|
|
pointName:"",//点位 中文
|
|
faultValue: "",//故障值
|
|
releaseValue: "",//释放值
|
|
faultOperator: "",//故障值比较关系
|
|
releaseOperator: "",//释放值比较关系
|
|
relationNext: "",//与下一个点位的关系
|
|
} : {
|
|
deviceId:[],
|
|
deviceCategory: "",//设备类型 英文
|
|
categoryName:'',//设备类型名称 中文
|
|
point: "",
|
|
pointName:"",
|
|
value: "",//设置值
|
|
}
|
|
// this.$set(this[type], this[type].length, item);
|
|
this[type].splice(this[type].length,0,item)
|
|
console.log('新增设备保护前提、方案',type,this[type])
|
|
},
|
|
// 删除设备保护前提、设备保护方案
|
|
deleteRow(index, type) {
|
|
this[type].splice(index, 1);
|
|
},
|
|
|
|
// 设备保护前提、设备保护方案点位选择
|
|
querySearchAsync(query, cb, index, type) {
|
|
console.log("查询数据", query, index);
|
|
if (!this.formData.siteId || !this[type][index].deviceCategory) {
|
|
this.$message({
|
|
type: "warning",
|
|
message: "请先选择站点和设备",
|
|
});
|
|
return cb([]);
|
|
}
|
|
pointFuzzyQuery({
|
|
siteIds: [this.formData.siteId],
|
|
deviceCategory: this[type][index].deviceCategory,
|
|
pointName: query,
|
|
}).then((response) => {
|
|
const data = response?.data || [];
|
|
cb(
|
|
data.map((item) => {
|
|
return { name: item, value: item };
|
|
})
|
|
);
|
|
});
|
|
},
|
|
// 点位选择
|
|
handleSelect(data, index, type) {
|
|
console.log('选择点位',data,index,type)
|
|
// this.$set(this[type], index, Object.assign({},this[type][index],{
|
|
// point:data.value,
|
|
// pointName:data.value,
|
|
// }));
|
|
let line = Object.assign({},this[type][index],{
|
|
point:data.value,
|
|
pointName:data.value,
|
|
})
|
|
this[type].splice(index,1,line);
|
|
console.log('选择点位配置完成',this[type][index])
|
|
},
|
|
|
|
// 获取设备类别-不区分站点
|
|
getDeviceCategoryList() {
|
|
this.loading += 1;
|
|
return getAllDeviceCategory()
|
|
.then((response) => {
|
|
const data = (response?.data || []).filter(item => ['PCS','STACK'].includes(item.code));
|
|
// this.childOptions=[]
|
|
this.$set(this,'childOptions',[])
|
|
let arr =[]
|
|
data.forEach((item) => {
|
|
arr.push({
|
|
value: item.code,
|
|
label: item.name,
|
|
children:[]
|
|
})
|
|
})
|
|
this.childOptions.splice(0,0,...arr)
|
|
console.log('获取设备类型',data,this.childOptions)
|
|
})
|
|
.finally(() => {
|
|
this.loading -= 1;
|
|
});
|
|
},
|
|
//获取设备列表-区分站点
|
|
getDeviceList(deviceCategory,siteId){
|
|
this.$nextTick(()=>{
|
|
getDeviceListBySiteAndCategory({siteId:siteId || this.formData.siteId,deviceCategory}).then((response) => {
|
|
const data = (response?.data || []).map(item => {
|
|
return {
|
|
label: item.deviceName,
|
|
value: item.id,
|
|
}
|
|
})
|
|
const index = this.childOptions.findIndex(item=>item.value === deviceCategory)
|
|
if(index>-1){
|
|
const length = this.childOptions[index].children.length
|
|
this.childOptions[index].children.splice(0,length,...data)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
//更新站点下面的设备列表
|
|
updateSiteDeviceList(){
|
|
this.childOptions.forEach(item => {
|
|
const length = item.children.length
|
|
item.children.splice(0,length)
|
|
})
|
|
this.getDeviceList('PCS')
|
|
this.getDeviceList('STACK')
|
|
},
|
|
//选中设备类型、设备
|
|
handleChange(data,type,index){
|
|
const deviceCategory = data[0],deviceId=data[1]
|
|
console.log('设置选中设备类型、设备',deviceCategory,deviceId,type,index)
|
|
const item = Object.assign({},this[type][index],{
|
|
deviceId:data,
|
|
deviceCategory,
|
|
categoryName : this.childOptions.find(i=>i.value === deviceCategory).label,
|
|
pointName:'',
|
|
point:''
|
|
})
|
|
this.$nextTick(()=>{
|
|
// this.$set(this[type], index, item);
|
|
this[type].splice(index,1,item);
|
|
})
|
|
console.log('设置选中设备类型、设备配置完成',this[type][index])
|
|
},
|
|
|
|
//获取站点列表
|
|
getZdList() {
|
|
this.loading += 1;
|
|
getAllSites()
|
|
.then((response) => {
|
|
this.siteList = response?.data || [];
|
|
})
|
|
.finally(() => {
|
|
this.loading -= 1;
|
|
});
|
|
},
|
|
// 切换站点
|
|
// 重新获取设备列表
|
|
// 清空选中的设备、点位信息
|
|
changeType() {
|
|
//获取当前站点下的pcs和bms
|
|
this.updateSiteDeviceList()
|
|
if(this.protectionSettings.length>0){
|
|
const list =this.protectionSettings
|
|
list.forEach((item) => {
|
|
item.point = ""
|
|
item.pointName = ""
|
|
item.deviceId=[]
|
|
item.categoryName=''
|
|
item.deviceCategory=''
|
|
});
|
|
// this.$set(this,'protectionSettings',list)
|
|
this.$nextTick(()=>{
|
|
this.protectionSettings.splice(0,this.protectionSettings.length,...list)
|
|
})
|
|
}
|
|
if(this.protectionPlan.length>0){
|
|
const list =this.protectionPlan
|
|
list.forEach((item) => {
|
|
item.point = ""
|
|
item.pointName = ""
|
|
item.deviceId=[]
|
|
item.categoryName=''
|
|
item.deviceCategory=''
|
|
});
|
|
// this.$set(this,'protectionPlan',list)
|
|
this.$nextTick(()=>{
|
|
this.protectionPlan.splice(0,this.protectionPlan.length,...list)
|
|
})
|
|
}
|
|
},
|
|
|
|
|
|
saveDialog() {
|
|
function getToastMsg(name,type,index){
|
|
return {
|
|
protectionSettings:{
|
|
deviceId:`请选择保护前提第${index}行的设备`,//设备ID
|
|
deviceCategory: `请选择保护前提第${index}行的设备类型`,//设备类型 英文
|
|
categoryName:`请选择保护前提第${index}行的设备类型`,//设备类型名称 中文
|
|
point: `请选择保护前提第${index}行的点位`,//点位 英文
|
|
pointName:`请选择保护前提第${index}行的点位`,//点位 中文
|
|
faultValue: `请输入保护前提第${index}行的故障值`,//故障值
|
|
releaseValue: `请输入保护前提第${index}行的释放值`,//释放值
|
|
faultOperator: `请选择保护前提第${index}行的故障值比较关系`,//故障值比较关系
|
|
releaseOperator: `请选择保护前提第${index}行的释放值比较关系`,//释放值比较关系
|
|
relationNext: `请选择保护前提第${index}行与下一个点位的关系`,//与下一个点位的关系
|
|
},
|
|
protectionPlan :{
|
|
deviceId:`请选择保护方案第${index}行的设备`,
|
|
deviceCategory: `请选择保护方案第${index}行的设备类型`,//设备类型 英文
|
|
categoryName:`请选择保护方案第${index}行的设备类型`,//设备类型名称 中文
|
|
point: `请选择保护方案第${index}行的点位`,
|
|
pointName:`请选择保护方案第${index}行的点位`,
|
|
value: `请输入保护方案第${index}行的故障值`,//设置值
|
|
}
|
|
}[type][name]
|
|
}
|
|
this.$refs.addTempForm.validate((valid) => {
|
|
if (!valid) return;
|
|
const {
|
|
id = "", //设备唯一标识
|
|
siteId = "", //站点ID
|
|
faultName = "", //设备保护名称
|
|
isAlert = 0, //是否告警
|
|
faultLevel = 1, //告警等级
|
|
faultDelaySeconds = "", //故障延时
|
|
releaseDelaySeconds = "", //释放延时
|
|
description="",//方案描述
|
|
} = this.formData;
|
|
const {protectionSettings,protectionPlan} = this
|
|
let protectionSettingsValidateStatus= true , protectionPlanValidateStatus= true
|
|
for(let i = 0;i<protectionSettings.length;i++){
|
|
let valueMap = Object.entries(protectionSettings[i]);
|
|
for(let inner = 0;inner < valueMap.length;inner++){
|
|
const key =valueMap[inner][0],value =valueMap[inner][1]
|
|
if(key === 'relationNext'){
|
|
if(protectionSettings[i+1] && !value){//有下一个点位
|
|
this.$message.error(getToastMsg(key,'protectionSettings',i+1))
|
|
protectionSettingsValidateStatus=false
|
|
break
|
|
}
|
|
}else{
|
|
if(![0,'0'].includes(value) && !value){
|
|
this.$message.error(getToastMsg(key,'protectionSettings',i+1))
|
|
protectionSettingsValidateStatus=false
|
|
break
|
|
}
|
|
}
|
|
}
|
|
if(!protectionSettingsValidateStatus) break
|
|
}
|
|
|
|
for(let i = 0;i<protectionPlan.length;i++){
|
|
let valueMap = Object.entries(protectionPlan[i]);
|
|
for(let inner = 0;inner < valueMap.length;inner++){
|
|
const key =valueMap[inner][0],value =valueMap[inner][1]
|
|
if(key === 'relationNext'){
|
|
if(protectionPlan[i+1] && !value){//有下一个点位
|
|
this.$message.error(getToastMsg(key,'protectionPlan',i+1))
|
|
protectionPlanValidateStatus=false
|
|
break
|
|
}else{
|
|
// protectionPlan[i][key] = ''//清空选择的关系
|
|
}
|
|
}else{
|
|
if(![0,'0'].includes(value) && !value){
|
|
this.$message.error(getToastMsg(key,'protectionPlan',i+1))
|
|
protectionPlanValidateStatus=false
|
|
break
|
|
}
|
|
}
|
|
}
|
|
if(!protectionPlanValidateStatus) break
|
|
}
|
|
|
|
if(!protectionSettingsValidateStatus || !protectionPlanValidateStatus) return
|
|
const settings = protectionSettings.map(item=>{
|
|
return Object.assign({},item,{
|
|
deviceId:item.deviceId[1],
|
|
})
|
|
})
|
|
const plan = protectionPlan.map(item=>{
|
|
return Object.assign({},item,{
|
|
deviceId:item.deviceId[1],
|
|
})
|
|
})
|
|
this.loading += 1;
|
|
const params= {
|
|
siteId,
|
|
faultName,
|
|
isAlert,
|
|
faultLevel,
|
|
faultDelaySeconds,
|
|
releaseDelaySeconds,
|
|
description,
|
|
protectionSettings:JSON.stringify(settings),
|
|
protectionPlan:JSON.stringify(plan),
|
|
}
|
|
if (this.mode === "add") {
|
|
addProtectPlan(params)
|
|
.then((response) => {
|
|
if (response.code === 200) {
|
|
//新增成功
|
|
// 关闭弹窗 更新表格
|
|
this.$emit("update");
|
|
this.closeDialog();
|
|
}
|
|
})
|
|
.finally(() => {
|
|
this.loading -= 1;
|
|
});
|
|
} else {
|
|
params.id = id
|
|
updateProtectPlan(params)
|
|
.then((response) => {
|
|
if (response.code === 200) {
|
|
//新增成功
|
|
// 关闭弹窗 更新表格
|
|
this.$emit("update");
|
|
this.closeDialog();
|
|
}
|
|
})
|
|
.finally(() => {
|
|
this.loading -= 1;
|
|
});
|
|
}
|
|
});
|
|
},
|
|
closeDialog() {
|
|
this.$emit("clear");
|
|
// 清空所有数据
|
|
for(let key in this.formData) {
|
|
this.formData[key] = key === 'isAlert' ? 0 : key === 'faultLevel' ? 1 : ''
|
|
}
|
|
this.$refs.addTempForm.resetFields();
|
|
this.$set(this,'protectionSettings',[])
|
|
this.$set(this,'protectionPlan',[])
|
|
this.$set(this,'childOptions',[])
|
|
this.dialogTableVisible = false;
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.items-container {
|
|
margin-top: 40px;
|
|
margin-bottom: 20px;
|
|
.item-title {
|
|
line-height: 16px;
|
|
padding: 10px 0;
|
|
color: #000;
|
|
}
|
|
}
|
|
.time-lists-container {
|
|
width: 100%;
|
|
border: 1px solid #eee;
|
|
.time-lists {
|
|
&:not(:last-child) {
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
display: flex;
|
|
& > div {
|
|
width: 16%;
|
|
box-sizing: border-box;
|
|
text-align: center;
|
|
padding: 10px 15px;
|
|
&:not(:last-child) {
|
|
width: 28%;
|
|
border-right: 1px solid #eee;
|
|
}
|
|
.el-date-editor.el-input,
|
|
.el-date-editor.el-input__inner {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
.time-lists-title {
|
|
color: #000;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
</style>
|