<template>
|
<div class="params-container">
|
<el-form
|
ref="ruleForm"
|
size="mini"
|
:model="params"
|
:rules="rules"
|
class="params-dialog">
|
<el-col :span="12">
|
<el-form-item label="短信内容：" prop="smsAlarmText" label-width="120px">
|
<el-input type="text" v-model="params.smsAlarmText"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="告警设备IP：" prop="alarmDevIP" label-width="120px">
|
<el-input type="text" v-model="params.alarmDevIP"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="短信告警端口：" prop="smsAlarmIpport" label-width="120px">
|
<el-input type="text" v-model="params.smsAlarmIpport"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="声光告警端口：" prop="beeperAlarmIpport" label-width="120px">
|
<el-input type="text" v-model="params.beeperAlarmIpport"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="短信告警开关：" label-width="120px">
|
<el-select v-model="params.smsAlarmEn">
|
<el-option label="关" :value="0"></el-option>
|
<el-option label="开" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="声光告警开关：" label-width="120px">
|
<el-select v-model="params.beeperAlarmEn">
|
<el-option label="关" :value="0"></el-option>
|
<el-option label="开" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="声光告警消音：" label-width="120px">
|
<el-select v-model="params.beeperSoundOff">
|
<el-option label="不消音" :value="0"></el-option>
|
<el-option label="消音" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<div class="clear"></div>
|
<div class="form-footer">
|
<three-btn @click="submitForm">确定</three-btn>
|
<three-btn @click="close">取消</three-btn>
|
</div>
|
</el-form>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "alarmAlert",
|
props: {
|
visible: {
|
type: Boolean,
|
default: false
|
}
|
},
|
data() {
|
return {
|
params: {
|
smsAlarmText:"",
|
smsAlarmEn:1,
|
beeperAlarmEn:1,
|
beeperSoundOff:1,
|
alarmDevIP:"",
|
smsAlarmIpport:"", // 短信告警端口
|
beeperAlarmIpport:""
|
},
|
rules: {
|
smsAlarmText: [
|
{ required: true, message: '短信内容不能为空', trigger: 'blur' },
|
],
|
alarmDevIP: [
|
{ required: true, message: '告警设备IP不能为空', trigger: 'blur' },
|
],
|
smsAlarmIpport: [
|
{ required: true, message: '短信告警端口不能为空', trigger: 'blur' },
|
],
|
beeperAlarmIpport: [
|
{ required: true, message: '声光告警端口不能为空', trigger: 'blur' },
|
],
|
},
|
}
|
},
|
mounted() {
|
this.intQuery();
|
},
|
methods: {
|
// 初始化查询数据
|
intQuery(){
|
let self = this;
|
self.$axios({
|
method:"GET",
|
url:"powerAlarmConfig/getInfo",
|
}).then(res=>{
|
console.log(res);
|
let rs = res.data;
|
if(rs.code == 1) {
|
let data = rs.data;
|
for(let key in this.params) {
|
console.log(key);
|
this.params[key] = data[key];
|
}
|
}else {
|
|
}
|
|
})
|
},
|
// 提交表单
|
submitForm() {
|
this.$refs.ruleForm.validate((valid) => {
|
// 校验通过
|
if (valid) {
|
// 修改配置
|
this.confirmChangeDeploy();
|
}else {
|
// this.$layer.msg('存在校验未通过的数据！');
|
return false;
|
}
|
});
|
},
|
// 确认修改配置
|
confirmChangeDeploy() {
|
this.$confirm("确认修改配置", '系统提示', {
|
type: 'warning',
|
}).then(()=>{
|
this.updateDeploy();
|
}).catch(()=>{});
|
},
|
updateDeploy(){
|
let self = this;
|
let loading = this.$layer.loading();
|
self.$axios({
|
method:"POST",
|
url:"powerAlarmConfig/update",
|
data: self.params
|
}).then(res=>{
|
this.$layer.close(loading);
|
let rs = res.data;
|
if(rs.code == 1) {
|
this.$emit("update:visible", false);
|
this.$layer.msg("修改成功");
|
this.$store.dispatch("user/changeNoSpeak", self.params.beeperSoundOff?true:false);
|
}else {
|
this.$layer.msg("修改失败");
|
}
|
}).catch(err=>{
|
this.$layer.close(loading);
|
this.$layer.msg("网络连接失败");
|
})
|
},
|
close() {
|
this.$emit("update:visible", false);
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.claer{
|
clear: both;
|
}
|
.params-container {
|
padding: 8px;
|
background-color: #ececec;
|
}
|
.form-footer {
|
margin-top: 16px;
|
margin-bottom: 16px;
|
text-align: right;
|
}
|
|
.form-footer .three-btn {
|
margin-left: 12px;
|
}
|
/deep/.el-input__inner,/deep/.el-input{
|
width: 160px;
|
}
|
/deep/.el-form-item{
|
margin-bottom:16px !important;
|
}
|
.three-btn{
|
margin-top: 30px;
|
}
|
</style>
|
