372 lines
10 KiB
JavaScript
372 lines
10 KiB
JavaScript
|
import { ElMessageBox } from 'element-plus'
|
|||
|
|
import i18n from '@/i18n'
|
|||
|
|
|
|||
|
|
export const tableSort = {
|
|||
|
|
// 是否需要排序
|
|||
|
|
sortableShow (prop, from) {
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'state': {
|
|||
|
|
if (from === 'operationlog' || from === 'alertSilence') {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
case 'startAt': {
|
|||
|
|
if (from === 'alertSilence') {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
case 'id':
|
|||
|
|
case 'alertRule':
|
|||
|
|
case 'severity':
|
|||
|
|
case 'endAt':
|
|||
|
|
case 'ID':
|
|||
|
|
case 'HOST':
|
|||
|
|
case 'SN':
|
|||
|
|
case 'assetType':
|
|||
|
|
case 'purchaseDate':
|
|||
|
|
case 'pingStatus':
|
|||
|
|
case 'dataCenter':
|
|||
|
|
case 'cabinet':
|
|||
|
|
case 'model':
|
|||
|
|
case 'principal':
|
|||
|
|
case 'asset':
|
|||
|
|
case 'port':
|
|||
|
|
case 'project':
|
|||
|
|
case 'module':
|
|||
|
|
case 'type':
|
|||
|
|
case 'name':
|
|||
|
|
case 'area':
|
|||
|
|
case 'vendor':
|
|||
|
|
case 'filename':
|
|||
|
|
case 'updateAt':
|
|||
|
|
case 'username':
|
|||
|
|
case 'ip':
|
|||
|
|
case 'operation':
|
|||
|
|
case 'createDate':
|
|||
|
|
case 'time':
|
|||
|
|
case 'host':
|
|||
|
|
case 'protocol':
|
|||
|
|
case 'user':
|
|||
|
|
case 'cmd':
|
|||
|
|
case 'alertName':
|
|||
|
|
case 'threshold':
|
|||
|
|
case 'idc':
|
|||
|
|
case 'alertNum':
|
|||
|
|
case 'gname':
|
|||
|
|
return 'custom'
|
|||
|
|
default : return false
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// prop字段
|
|||
|
|
propTitle (prop, from) {
|
|||
|
|
switch (from) {
|
|||
|
|
case 'asset':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'ID': return 'ass.id'
|
|||
|
|
case 'HOST': return 'ass.host'
|
|||
|
|
case 'SN': return 'ass.sn'
|
|||
|
|
case 'assetType': return 'sdtt.value'
|
|||
|
|
case 'purchaseDate': return 'ass.purchase_date'
|
|||
|
|
case 'state': return 'ass.state'
|
|||
|
|
case 'pingStatus': return 'assp.rtt'
|
|||
|
|
case 'dataCenter': return 'idc.name'
|
|||
|
|
case 'cabinet': return 'cab.name'
|
|||
|
|
case 'model': return 'mo.name'
|
|||
|
|
case 'vendor': return 'sdt.value'
|
|||
|
|
case 'principal': return 'su.username'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
case 'alertMessage':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'am.id'
|
|||
|
|
case 'state': return 'am.state'
|
|||
|
|
case 'alertRule': return 'ar.alert_name'
|
|||
|
|
case 'severity': return 'am.severity'
|
|||
|
|
case 'startAt': return 'am.start_at'
|
|||
|
|
case 'endAt': return 'am.end_at'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
case 'project':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'e.id'
|
|||
|
|
case 'asset': return 'a.host'
|
|||
|
|
case 'port': return 'e.port'
|
|||
|
|
case 'project': return 'p.name'
|
|||
|
|
case 'module': return 'm.name'
|
|||
|
|
case 'type': return 'm.type'
|
|||
|
|
case 'state' :return 'es.state'
|
|||
|
|
// case 'path': return'e.path';
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
case 'dc':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'i.id'
|
|||
|
|
case 'name': return 'i.name'
|
|||
|
|
case 'area': return 'sa.name'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
case 'endpointTab':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'e.id'
|
|||
|
|
case 'asset': return 'a.host'
|
|||
|
|
case 'port': return 'e.port'
|
|||
|
|
case 'project': return 'p.name'
|
|||
|
|
case 'module': return 'm.name'
|
|||
|
|
case 'type': return 'm.type'
|
|||
|
|
case 'state' :return 'es.state'
|
|||
|
|
// case 'path': return'e.path';
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'model':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'mo.id'
|
|||
|
|
case 'name': return 'mo.name'
|
|||
|
|
case 'type': return 'dictt.value'
|
|||
|
|
case 'vendor': return 'dict.value'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'promServer':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'id'
|
|||
|
|
case 'idc': return 'idc_id'
|
|||
|
|
case 'host': return 'host'
|
|||
|
|
case 'port': return 'port'
|
|||
|
|
case 'type': return 'type'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'mib':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'sm.id'
|
|||
|
|
case 'name': return 'sm.name'
|
|||
|
|
case 'filename': return 'sm.file_name'
|
|||
|
|
case 'updateAt': return 'sm.update_at'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'operationlog':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'sl.id'
|
|||
|
|
case 'username': return 'su.username'
|
|||
|
|
case 'ip': return 'sl.ip'
|
|||
|
|
case 'operation': return 'sl.operation'
|
|||
|
|
case 'type': return 'sl.type'
|
|||
|
|
case 'createDate': return 'sl.create_date'
|
|||
|
|
case 'time': return 'sl.time'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'temrminallog':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'protocol': return 'protocol'
|
|||
|
|
case 'startTime': return 'startTime'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'alertRules':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'ar.id'
|
|||
|
|
case 'alertName': return 'ar.alert_name'
|
|||
|
|
case 'threshold': return 'ar.threshold'
|
|||
|
|
case 'severity': return 'ar.severity'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
case 'exprTemp':
|
|||
|
|
switch (prop) {
|
|||
|
|
case 'id': return 'id'
|
|||
|
|
case 'name': return 'name'
|
|||
|
|
case 'gname': return 'gname'
|
|||
|
|
default : return prop
|
|||
|
|
}
|
|||
|
|
default: return prop
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 本地正序
|
|||
|
|
asce (prop) {
|
|||
|
|
return function (obj1, obj2) {
|
|||
|
|
const { val1, val2 } = this.format(prop, obj1, obj2)
|
|||
|
|
if (val1 < val2) {
|
|||
|
|
return -1
|
|||
|
|
} else if (val1 > val2) {
|
|||
|
|
return 1
|
|||
|
|
} else {
|
|||
|
|
return 0
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 本地倒序
|
|||
|
|
desc (prop) {
|
|||
|
|
return function (obj1, obj2) {
|
|||
|
|
const { val1, val2 } = this.format(prop, obj1, obj2)
|
|||
|
|
if (val1 < val2) {
|
|||
|
|
return 1
|
|||
|
|
} else if (val1 > val2) {
|
|||
|
|
return -1
|
|||
|
|
} else {
|
|||
|
|
return 0
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
format (prop, obj1, obj2) {
|
|||
|
|
let val1 = obj1[prop]
|
|||
|
|
let val2 = obj2[prop]
|
|||
|
|
if (!isNaN(Number(val1)) && !isNaN(Number(val2)) && prop !== 'time') {
|
|||
|
|
val1 = Number(val1)
|
|||
|
|
val2 = Number(val2)
|
|||
|
|
}
|
|||
|
|
if (prop === 'time') {
|
|||
|
|
val1 = tableSort.strTodate(val1)
|
|||
|
|
val2 = tableSort.strTodate(val2)
|
|||
|
|
}
|
|||
|
|
if (prop === 'element') {
|
|||
|
|
if (val1.alias) {
|
|||
|
|
val1 = JSON.stringify(obj1[prop].alias).replace(/\s*/g, '')
|
|||
|
|
} else {
|
|||
|
|
val1 = JSON.stringify(obj1[prop].element).replace(/\s*/g, '')
|
|||
|
|
}
|
|||
|
|
if (val2.alias) {
|
|||
|
|
val2 = JSON.stringify(obj2[prop].alias).replace(/\s*/g, '')
|
|||
|
|
} else {
|
|||
|
|
val2 = JSON.stringify(obj2[prop].element).replace(/\s*/g, '')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return { val1, val2 }
|
|||
|
|
},
|
|||
|
|
// 转化时间字符串为时间戳
|
|||
|
|
strToDate (str) {
|
|||
|
|
let date = str.trim()
|
|||
|
|
date = date.substring(0, 19)
|
|||
|
|
date = date.replace(/-/g, '/') // 必须把日期'-'转为'/'
|
|||
|
|
return new Date(date).getTime()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/* cancel提醒保存指令 */
|
|||
|
|
export const cancelWithChange = {
|
|||
|
|
mounted (el, binding) {
|
|||
|
|
if (!binding.value || !binding.value.object) return
|
|||
|
|
const unsavedChange = localStorage.getItem('nz-unsaved-change')
|
|||
|
|
const oldValue = JSON.parse(JSON.stringify(binding.value.object))
|
|||
|
|
function domClick (e) {
|
|||
|
|
const newValue = JSON.parse(JSON.stringify(binding.value.object))
|
|||
|
|
if (unsavedChange === 'on' && !isEqual(oldValue, newValue)) {
|
|||
|
|
ElMessageBox.confirm(i18n.t('tip.confirmCancel'), {
|
|||
|
|
confirmButtonText: i18n.t('tip.yes'),
|
|||
|
|
cancelButtonText: i18n.t('tip.no'),
|
|||
|
|
type: 'warning'
|
|||
|
|
}).then(() => {
|
|||
|
|
if (binding.value.func) {
|
|||
|
|
binding.value.func()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
binding.value.func()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
el.__vueDomClick__ = domClick
|
|||
|
|
el.addEventListener('click', domClick)
|
|||
|
|
},
|
|||
|
|
unmounted (el, binding) {
|
|||
|
|
// 解除事件监听
|
|||
|
|
document.removeEventListener('click', el.__vueDomClick__)
|
|||
|
|
delete el.__vueDomClick__
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/* clickOutside指令 */
|
|||
|
|
const exceptClassName = ['prevent-click-outside'] // clickOutside排除的class(白名单)
|
|||
|
|
export const clickOutside = {
|
|||
|
|
// 初始化指令
|
|||
|
|
mounted (el, binding) {
|
|||
|
|
if (!binding.expression) return
|
|||
|
|
const unsavedChange = localStorage.getItem('cn-unsaved-change')
|
|||
|
|
let oldValue
|
|||
|
|
try {
|
|||
|
|
oldValue = JSON.parse(JSON.stringify(binding.value.object))
|
|||
|
|
} catch (e) {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
function documentHandler (e) {
|
|||
|
|
if (el.contains(e.target)) {
|
|||
|
|
return false
|
|||
|
|
} else {
|
|||
|
|
let flag = true
|
|||
|
|
const path = e.path || (e.composedPath && e.composedPath())
|
|||
|
|
// eslint-disable-next-line no-labels
|
|||
|
|
top: for (let i = 0; i < path.length; i++) {
|
|||
|
|
for (let j = 0; j < exceptClassName.length; j++) {
|
|||
|
|
if (path[i].className && path[i].className.indexOf && path[i].className.indexOf(exceptClassName[j]) !== -1) {
|
|||
|
|
flag = false
|
|||
|
|
// eslint-disable-next-line no-labels
|
|||
|
|
break top
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!flag) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
if (oldValue) {
|
|||
|
|
const newValue = JSON.parse(JSON.stringify(binding.value.oldValue))
|
|||
|
|
if (unsavedChange === 'on' && !isEqual(oldValue, newValue)) {
|
|||
|
|
ElMessageBox.confirm('Confirm？', { // TODO 国际化
|
|||
|
|
confirmButtonText: 'Yes', // TODO 国际化
|
|||
|
|
cancelButtonText: 'No', // TODO 国际化
|
|||
|
|
type: 'warning'
|
|||
|
|
}).then(() => {
|
|||
|
|
if (binding.value.func) {
|
|||
|
|
binding.value.func()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
binding.value.func()
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (binding.arg) {
|
|||
|
|
binding.value(e, binding.arg)
|
|||
|
|
} else {
|
|||
|
|
if (binding.value) {
|
|||
|
|
binding.value(e)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 给当前元素绑定个私有变量，方便在unbind中可以解除事件监听
|
|||
|
|
el.__vueClickOutside__ = documentHandler
|
|||
|
|
document.addEventListener('mousedown', documentHandler)
|
|||
|
|
},
|
|||
|
|
unmounted (el, binding) {
|
|||
|
|
// 解除事件监听
|
|||
|
|
document.removeEventListener('mousedown', el.__vueClickOutside__)
|
|||
|
|
delete el.__vueClickOutside__
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export function isEqual (o1, o2) {
|
|||
|
|
const isEqualForInner = function (obj1, obj2) {
|
|||
|
|
const o1 = obj1 instanceof Object
|
|||
|
|
const o2 = obj2 instanceof Object
|
|||
|
|
if (!o1 || !o2) {
|
|||
|
|
return obj1 === obj2
|
|||
|
|
}
|
|||
|
|
if (Object.keys(obj1).length !== Object.keys(obj2).length) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
for (const attr of Object.keys(obj1)) {
|
|||
|
|
const t1 = obj1[attr] instanceof Object
|
|||
|
|
const t2 = obj2[attr] instanceof Object
|
|||
|
|
if (t1 && t2) {
|
|||
|
|
if (!isEqualForInner(obj1[attr], obj2[attr])) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
} else if (obj1[attr] !== obj2[attr]) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
return isEqualForInner(o1, o2)
|
|||
|
|
}
|