<template>
|
<div class="controlList" style="min-width: 1000px">
|
<Card>
|
<div class="customTitle">
|
<Icon custom="custom custom-liebiao"></Icon>
|
<span style="margin-left: 6px;">监控列表</span>
|
</div>
|
</Card>
|
<div style="margin-top: 12px;position: relative">
|
|
<Card class="controlClass">
|
<Tabs v-model="tabchildren" @on-click="changeTabchildren" type="card" style="margin-top: 12px;">
|
<TabPane label="邮件提醒" name="tab1"></TabPane>
|
<TabPane label="微信提醒" name="tab2"></TabPane>
|
</Tabs>
|
<div v-show="tabchildren==='tab1'">
|
<Form ref="formInline" :model="alarmInfoemail" :rules="emailRemindrule">
|
<FormItem prop="emailRemind" label="邮件提醒">
|
<i-switch v-model="alarmInfoemail.AlarmEmailRZFlag" size="large" @on-change="emailSwitch">
|
<span slot="open"></span>
|
<span slot="close"></span>
|
</i-switch>
|
</FormItem>
|
<FormItem prop="emailConfig" label="邮件配置">
|
<Row class="emailConfigclass">
|
<Col span="10">
|
<Input size="large" v-model="alarmInfoemail.AlarmEmailRZ"
|
:disabled="!alarmInfoemail.AlarmEmailRZFlag"></Input>
|
</Col>
|
</Row>
|
</FormItem>
|
<FormItem>
|
<div style="text-align: right;margin-top: 0px">
|
<Button size="large" custom-icon="custom custom-queding" type="primary"
|
@click="saveEmailRemind">保存
|
</Button>
|
</div>
|
</FormItem>
|
</Form>
|
</div>
|
<div v-show="tabchildren==='tab2'">
|
<Form ref="formInline" :model="alarmInfowx" :rules="wechatRemindrule">
|
<FormItem prop="emailRemind" label="微信提醒">
|
<i-switch v-model="alarmInfowx.AlarmWXRZFlag" size="large" @on-change="wechatSwitch">
|
<span slot="open"></span>
|
<span slot="close"></span>
|
</i-switch>
|
</FormItem>
|
<FormItem prop="emailConfig" label="微信配置">
|
<Row class="emailConfigclass">
|
<Col span="10">
|
<img :src="erWeiMaUrl" style="width: 120px;height: 120px;">
|
<p style="width: 600px;">请先扫码关注”维优智能监控”服务号，然后进入公众号选择“监控绑定”菜单关联系统账号。</p>
|
</Col>
|
</Row>
|
</FormItem>
|
<FormItem>
|
<div style="text-align: right;margin-top: 0px">
|
<Button size="large" custom-icon="custom custom-queding" type="primary"
|
@click="savewechatRemind">保存
|
</Button>
|
</div>
|
</FormItem>
|
</Form>
|
</div>
|
|
</Card>
|
</div>
|
</div>
|
</template>
|
<script>
|
import axios from '@/libs/api.request'
|
import $ from 'jquery'
|
|
export default {
|
name: 'controlList',
|
data() {
|
return {
|
emailReminddisabled: true,
|
emailRemindModel: {
|
emailRemind: false,
|
emailConfig: '',
|
},
|
wechatReminddisabled: true,
|
wechatRemindModel: {
|
wechatRemind: false,
|
wechatConfig: '',
|
},
|
wechatRemindrule: {
|
emailRemind: [
|
{required: false, trigger: 'blur'}
|
],
|
},
|
emailRemindrule: {
|
emailRemind: [
|
{trigger: 'blur'}
|
],
|
},
|
pageIndex: 1, // 当前页
|
TotalItems: 0, // 总条数
|
controlList: [], // 定义获取企业监控table的List
|
tab: 'tab1', // 企业监控tab的切换
|
CompanyId: 0, //
|
defaultassetsmode: false,
|
loading2: false,
|
addControlModal: false,
|
selectListOp: [], // 下拉数据
|
deleteDocuControl: false,
|
addControlForm: {
|
CompanyName: ''
|
},
|
addControlFormValid: {
|
CompanyName: [
|
{required: true, trigger: 'blur'}
|
]
|
},
|
loadingsele: false,
|
emaileventarr: [],
|
PId: 0,
|
emailevent: '',
|
deleteZhuti: '',
|
tabchildren: 'tab1',
|
//预警信息
|
erWeiMaUrl: require('../../assets/images/erWeiMa.jpg'),
|
alarmInfoBase: {
|
AlarmEmailRZ: '',//邮箱地址
|
AlarmEmailRZFlag: false,//邮箱开关
|
AlarmWXRZId: "",//微信id
|
},//预警信息(存档)
|
alarmInfoemail: {
|
id: localStorage.getItem('userId'),
|
AlarmEmailRZ: '',//邮箱地址
|
AlarmEmailRZFlag: false,//邮箱开关
|
},
|
alarmInfowx: {
|
id: localStorage.getItem('userId'),
|
AlarmWXRZId: "",//微信id
|
AlarmWXRZFlag: false,//微信预警等级
|
}
|
//预警信息
|
}
|
},
|
mounted() {
|
this.CompanyId = localStorage.getItem('RiskCompanyId')
|
|
this.getAlarmInfo()
|
},
|
methods: {
|
|
|
editwechatConfig() {
|
|
},
|
|
editEmailConfig() {
|
|
},
|
changeTabchildren() {
|
|
},
|
|
addRemindEmailfun() {
|
let b
|
if (this.emaileventarr.length === 0) {
|
let email = this.emailevent.trim()
|
let a = email.split(';')
|
let reg = /^[\w\-]+@[a-zA-Z\d\-]+(\.[a-zA-Z]{2,8}){1,2}$/
|
reg.test(a[0])
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null && reg.test(a[0]) != false) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else if (a[0].trim() === '') {
|
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
// this.addRemindEmail=false
|
}
|
} else if (this.emaileventarr.length > 0) {
|
let email = this.emailevent.trim()
|
let a = email.split(';')
|
let reg = /^[\w\-]+@[a-zA-Z\d\-]+(\.[a-zA-Z]{2,8}){1,2}$/
|
reg.test(a[0])
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null && reg.test(a[0]) != false) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else if (a[0].trim() === '') {
|
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
// this.addRemindEmail=false
|
}
|
}
|
if (this.emaileventarr.length === 0) {
|
b = ''
|
} else {
|
b = this.emaileventarr.join(',')
|
}
|
let data = {
|
Id: 0,
|
PId: this.pid,
|
MonRemindName: b,
|
CpType: true
|
}
|
axios.request({
|
url: '/MonRemindEmail/AddOrUpdMonRemindEmail',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
|
} else {
|
|
}
|
}, res => {
|
|
})
|
},
|
/**
|
* email的change事件
|
**/
|
emailChange(event) {
|
let email = this.emailevent.trim()
|
if (event.keyCode === 186) {
|
if (email.indexOf(';') >= 0) {
|
let a = email.split(';')
|
let reg = /^[\w\-]+@[a-zA-Z\d\-]+(\.[a-zA-Z]{2,8}){1,2}$/
|
reg.test(a[0])
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null && reg.test(a[0]) != false) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else if (a[0].trim() === '') {
|
this.emailevent = ''
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
}
|
} else if (email.indexOf('；') >= 0) {
|
let a = email.split('；')
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else if (a[0].trim() === '') {
|
this.emailevent = ''
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
return false
|
}
|
}
|
} else if (event.keyCode === 188) {
|
if (email.indexOf(',') >= 0) {
|
let a = email.split(',')
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
}
|
} else if (email.indexOf('，') >= 0) {
|
let a = email.split('，')
|
if (a[0].trim() != '' && a[0].trim() != undefined && a[0].trim() != null) {
|
this.emaileventarr.push(a[0])
|
this.emailevent = ''
|
} else {
|
this.emailevent = this.emailevent.trim()
|
this.$Message.error('请输入正确的邮箱地址')
|
}
|
}
|
}
|
},
|
clickdivremindemail() {
|
$('.divarrclass04add input').focus()
|
},
|
getEmailList() {
|
let data = {
|
CpType: true,
|
PId: this.PId
|
}
|
axios.request({
|
url: '/MonRemindEmail/GetMonRemindEmailList',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
this.emaileventarr = res.data.Data
|
} else {
|
|
}
|
}, res => {
|
|
})
|
},
|
closeTag(event, name) {
|
const index = this.emaileventarr.indexOf(name)
|
this.emaileventarr.splice(index, 1)
|
},
|
/**
|
* table删除确认
|
**/
|
|
mergeRequest() {
|
this.controlChange()
|
},
|
select_li_click(params) {
|
this.addControlForm.CompanyName = params
|
},
|
/**
|
* 监控添加时change事件
|
**/
|
controlChange() {
|
this.selectListOp = []
|
this.loadingsele = true
|
let data = {
|
name: this.addControlForm.CompanyName
|
}
|
axios.request({
|
url: '/QiChaCha/GetTycSearch2',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
console.log(res.data.Data);
|
this.selectListOp = JSON.parse(JSON.stringify(res.data.Data.Items))
|
this.loadingsele = false
|
} else {
|
this.loadingsele = false
|
}
|
}, res => {
|
this.loadingsele = false
|
})
|
},
|
|
//推送部分
|
/**
|
* 获取推送基本信息
|
*/
|
getAlarmInfo() {
|
let id = localStorage.getItem('userId')
|
if (!id) {
|
return false
|
}
|
let data = {
|
id: id
|
}
|
axios.request({
|
url: '/User/GetAlarmInfo',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
this.alarmInfoBase = res.data.Data
|
this.alarmInfoBase.id = id
|
this.alarmInfoemail.AlarmEmailRZFlag = res.data.Data.AlarmEmailRZFlag
|
this.alarmInfoemail.AlarmEmailRZ = res.data.Data.AlarmEmailRZ
|
this.alarmInfowx.AlarmWXRZFlag = res.data.Data.AlarmWXRZFlag
|
this.alarmInfowx.AlarmWXRZId = res.data.Data.AlarmWXId
|
} else {
|
this.alarmInfoBase = {}
|
}
|
}, res => {
|
this.alarmInfoBase = {}
|
})
|
},
|
/**
|
* 切换邮件预警状态
|
*/
|
emailSwitch() {
|
if (this.alarmInfoemail.AlarmEmailRZFlag) {
|
this.alarmInfoemail.AlarmEmailRZ = this.alarmInfoBase.AlarmEmailRZ
|
} else {
|
this.alarmInfoemail.AlarmEmailRZ = ''
|
}
|
},
|
/**
|
* 切换微信预警状态
|
*/
|
wechatSwitch() {
|
if (this.alarmInfowx.AlarmWXRZFlag) {
|
this.alarmInfowx.AlarmWXRZId = this.alarmInfoBase.AlarmWXRZId
|
} else {
|
this.alarmInfowx.AlarmWXRZId = ''
|
}
|
},
|
/**
|
* 保存邮件预警
|
*/
|
saveEmailRemind() {
|
if (this.alarmInfoemail.AlarmEmailRZFlag) {
|
if (!/^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/.test(this.alarmInfoemail.AlarmEmailRZ)) {
|
this.$Message.error('请输入正确的邮箱!')
|
return false
|
}
|
}
|
let data = JSON.parse(JSON.stringify(this.alarmInfoemail))
|
axios.request({
|
url: '/User/UpdateAlarmRZEmail',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
this.getAlarmInfo()
|
} else {
|
this.alarmInfoBase = {}
|
}
|
}, res => {
|
this.alarmInfoBase = {}
|
})
|
},
|
/**
|
* 保存微信预警
|
*/
|
savewechatRemind() {
|
// if (this.alarmInfowx.AlarmWXRZFlag) {
|
|
// }
|
let data = JSON.parse(JSON.stringify(this.alarmInfowx))
|
console.log(data);
|
axios.request({
|
url: '/User/UpdateAlarmRZWX',
|
data,
|
method: 'post'
|
}).then(res => {
|
if (res.data.Check) {
|
this.getAlarmInfo()
|
} else {
|
this.alarmInfoBase = {}
|
}
|
}, res => {
|
this.alarmInfoBase = {}
|
})
|
},
|
//推送部分
|
},
|
computed: {
|
controlListColumns() {
|
let columns = []
|
columns.push({
|
title: '序号',
|
key: 'index',
|
width: 80,
|
render: (h, params) => {
|
return h('span', params.index + 1)
|
},
|
align: 'center'
|
})
|
columns.push({
|
title: '监控企业',
|
key: 'CompanyName',
|
minWidth: 500,
|
align: 'center'
|
})
|
columns.push({
|
title: '添加时间',
|
key: 'CreateDate',
|
minWidth: 150,
|
align: 'center'
|
})
|
columns.push({
|
title: '操作',
|
key: 'action',
|
slot: 'action',
|
width: 150,
|
align: 'center'
|
})
|
return columns
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.emailConfigclass .ivu-input[disabled], fieldset[disabled] .ivu-input {
|
cursor: not-allowed;
|
}
|
|
.copyclass .ivu-poptip-body-content-word-wrap {
|
white-space: unset;
|
}
|
|
.divarrclass04add .ivu-tag .ivu-icon-ios-close {
|
top: 0
|
}
|
|
.divarrclass04add .ivu-input:focus {
|
box-shadow: none;
|
}
|
|
.divarrclass04add .ivu-input {
|
border: none
|
}
|
|
.divarrclass04add span {
|
background: #f3f3f3;
|
padding: 5px;
|
margin: 0 5px 0 0;
|
}
|
|
.divarrclass04add {
|
display: inline-block;
|
width: 100%;
|
height: 32px;
|
line-height: 1.5;
|
font-size: 14px;
|
border: 1px solid #dcdee2;
|
border-radius: 4px;
|
color: #515a6e;
|
background-color: #fff;
|
background-image: none;
|
position: relative;
|
cursor: text;
|
padding: 9px 7px;
|
height: 40px;
|
}
|
|
.copyclass .ivu-poptip {
|
width: 100% !important;
|
}
|
|
.copyclass .ivu-poptip-rel {
|
width: 100%;
|
}
|
|
.ul_class_add {
|
background: #fff;
|
border-color: #e8eaec;
|
/*box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);*/
|
border-radius: 5px;
|
padding: 0 12px;
|
}
|
|
/*.ul_class_add li:hover{*/
|
/*color: #2D8CF0;*/
|
/*cursor: pointer;*/
|
/*}*/
|
.controlClass .ipt_width {
|
width: 100%;
|
}
|
|
.controlClass .ivu-form-item {
|
margin-bottom: 12px;
|
}
|
</style>
|
|
