This commit is contained in:
break60 2021-01-12 20:28:26 +08:00
parent 4e2f27dec2
commit e977f16f0d
11 changed files with 568 additions and 6 deletions

View File

@ -46,7 +46,9 @@ const useOpt = i18n.globalScope.LOCALE === 'en_US' ? { locale: locale } : {}
i18n.globalScope.LOCALE === 'en_US' ? Vue.use(ElementUI, { locale }) : Vue.use(ElementUI)
// Vue.use(ans)
Vue.use(useOpt, formCreate)
Vue.use(useOpt)
Vue.use(formCreate)
sync(store, router)
Vue.config.devtools = true

View File

@ -36,7 +36,7 @@
</template>
</m-list-box-f>
<m-list-box-f>
<template slot="name"><strong>*</strong>{{$t('Group Type')}}</template>
<template slot="name"><strong>*</strong>{{$t('Alarm plugin instance')}}</template>
<template slot="content">
<el-select v-model="groupType" size="small">
<el-option
@ -81,7 +81,8 @@
}
},
props: {
item: Object
item: Object,
allAlertPluginInstance: Array
},
methods: {
_ok () {

View File

@ -23,7 +23,7 @@
<el-dialog
:visible.sync="createWarningDialog"
width="auto">
<m-create-warning :item="item" @onUpdate="onUpdate" @close="close"></m-create-warning>
<m-create-warning :item="item" :allAlertPluginInstance="allAlertPluginInstance" @onUpdate="onUpdate" @close="close"></m-create-warning>
</el-dialog>
</template>
</m-conditions>
@ -83,13 +83,14 @@
isLeft: true,
isADMIN: store.state.user.userInfo.userType === 'ADMIN_USER',
createWarningDialog: false,
item: {}
item: {},
allAlertPluginInstance: []
}
},
mixins: [listUrlParamHandle],
props: {},
methods: {
...mapActions('security', ['getAlertgroupP']),
...mapActions('security', ['getAlertgroupP', 'queryAllAlertPluginInstance']),
/**
* Inquire
*/
@ -110,6 +111,11 @@
this._create(item)
},
_create (item) {
this.queryAllAlertPluginInstance().then(res => {
this.allAlertPluginInstance = res.data
}).catch(e => {
this.$message.error(e.msg)
})
this.item = item
this.createWarningDialog = true
},

View File

@ -0,0 +1,192 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit alarm group') : $t('Create alarm group')"
@ok="_ok"
@close="close">
<template slot="content">
<div class="create-warning-model">
<m-list-box-f>
<template slot="name"><strong>*</strong>{{$t('Alarm instance name')}}</template>
<template slot="content">
<el-input
type="input"
v-model="groupName"
maxlength="60"
size="small"
:placeholder="$t('Please enter group name')">
</el-input>
</template>
</m-list-box-f>
<m-list-box-f>
<template slot="name"><strong>*</strong>{{$t('Select plugin')}}</template>
<template slot="content">
<el-select v-model="pluginDefineId" size="small" style="width: 100%" @change="changePlugin">
<el-option
v-for="items in pulginInstance"
:key="items.id"
:value="items.id"
:label="items.pluginName">
</el-option>
</el-select>
</template>
</m-list-box-f>
<div>
<template>
<div class="alertForm"><form-create v-model="$f" :rule="rule" :option="{submitBtn:false}" size="mini"></form-create></div>
</template>
</div>
</div>
</template>
</m-popup>
</template>
<script>
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
name: 'create-warning',
data () {
return {
store,
groupName: '',
pluginDefineId: null,
description: '',
options: [{ code: `${i18n.$t('Email')}`, id: 'EMAIL' }, { code: `${i18n.$t('SMS')}`, id: 'SMS' }],
$f: {},
rule: [
{
type: 'input',
field: 'dingTalkWebHook',
className: 'user-name-dom',
title: 'dingtalk.webhook',
value: null,
props: {
placeholder: '请输入用户名称!',
size: 'small',
disabled: false,
readonly: false,
clearable: true
},
validate: [
{
trigger: 'blur',
required: true,
message: '用户名称不能为空!'
}
]
}
]
}
},
props: {
item: Object,
pulginInstance: Array
},
methods: {
_ok () {
if (this._verification()) {
// The name is not verified
if (this.item && this.item.groupName === this.groupName) {
this._submit()
return
}
// Verify username
this.store.dispatch('security/verifyName', {
type: 'alertgroup',
groupName: this.groupName
}).then(res => {
this._submit()
}).catch(e => {
this.$message.error(e.msg || '')
})
}
},
_verification () {
// group name
if (!this.groupName.replace(/\s*/g, '')) {
this.$message.warning(`${i18n.$t('Please enter group name')}`)
return false
}
return true
},
changePlugin () {
console.log(this.rule)
console.log(this.pluginDefineId)
this.store.dispatch('security/getUiPluginsByID', {
pluginId: this.pluginDefineId
}).then(res => {
console.log(res)
}).catch(e => {
this.$message.error(e.msg || '')
})
},
_submit () {
let param = {
groupName: this.groupName,
groupType: this.groupType,
description: this.description
}
if (this.item) {
param.id = this.item.id
}
this.$refs.popup.spinnerLoading = true
this.store.dispatch(`security/${this.item ? 'updateAlertgrou' : 'createAlertgrou'}`, param).then(res => {
this.$emit('onUpdate')
this.$message.success(res.msg)
setTimeout(() => {
this.$refs.popup.spinnerLoading = false
}, 800)
}).catch(e => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
})
},
close () {
this.$emit('close')
}
},
watch: {},
created () {
if (this.item) {
this.groupName = this.item.groupName
this.groupType = this.item.groupType
this.description = this.item.description
}
},
mounted () {
},
components: { mPopup, mListBoxF }
}
</script>
<style lang="scss" rel="stylesheet/scss">
.alertForm {
.el-form-item__label {
width: 144px!important;
}
.el-form-item__content {
margin-left: 144px!important;
width: calc(100% - 162px);
}
}
</style>

View File

@ -0,0 +1,131 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
<template>
<div class="list-model">
<div class="table-box">
<el-table :data="list" size="mini" style="width: 100%">
<el-table-column type="index" :label="$t('#')" width="50"></el-table-column>
<el-table-column prop="groupName" :label="$t('Group Name')"></el-table-column>
<el-table-column :label="$t('Group Type')" width="100">
<template slot-scope="scope">
{{scope.row.groupType === 'EMAIL' ? `${$t('Email')}` : `${$t('SMS')}`}}
</template>
</el-table-column>
<el-table-column prop="description" :label="$t('Remarks')" width="200"></el-table-column>
<el-table-column :label="$t('Create Time')" width="140">
<template slot-scope="scope">
<span>{{scope.row.createTime | formatDate}}</span>
</template>
</el-table-column>
<el-table-column :label="$t('Update Time')" width="140">
<template slot-scope="scope">
<span>{{scope.row.updateTime | formatDate}}</span>
</template>
</el-table-column>
<el-table-column :label="$t('Operation')" width="130">
<template slot-scope="scope">
<el-tooltip :content="$t('Edit')" placement="top">
<span><el-button type="primary" size="mini" icon="el-icon-edit-outline" @click="_edit(scope.row)" circle></el-button></span>
</el-tooltip>
<el-tooltip :content="$t('delete')" placement="top">
<el-popconfirm
:confirmButtonText="$t('Confirm')"
:cancelButtonText="$t('Cancel')"
icon="el-icon-info"
iconColor="red"
:title="$t('Delete?')"
@onConfirm="_delete(scope.row,scope.row.id)"
>
<el-button type="danger" size="mini" icon="el-icon-delete" circle slot="reference" :disabled="scope.row.id==1?true: false"></el-button>
</el-popconfirm>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
</div>
</template>
<script>
import { mapActions } from 'vuex'
export default {
name: 'user-list',
data () {
return {
list: [],
transferDialog: false,
item: {}
}
},
props: {
alertgroupList: Array,
pageNo: Number,
pageSize: Number
},
methods: {
...mapActions('security', ['deleteAlertgrou', 'grantAuthorization']),
_delete (item, i) {
this.deleteAlertgrou({
id: item.id
}).then(res => {
this.$emit('on-update')
this.$message.success(res.msg)
}).catch(e => {
this.$message.error(e.msg || '')
})
},
_edit (item) {
this.$emit('on-edit', item)
},
onUpdate (userIds) {
this._grantAuthorization('alert-group/grant-user', {
userIds: userIds,
alertgroupId: this.item.id
})
this.transferDialog = false
},
close () {
this.transferDialog = false
},
_grantAuthorization (api, param) {
this.grantAuthorization({
api: api,
param: param
}).then(res => {
this.$message.success(res.msg)
}).catch(e => {
this.$message.error(e.msg || '')
})
}
},
watch: {
alertgroupList (a) {
this.list = []
setTimeout(() => {
this.list = a
})
}
},
created () {
this.list = this.alertgroupList
},
mounted () {
},
components: {}
}
</script>

View File

@ -0,0 +1,169 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
<template>
<m-list-construction :title="$t('Warning group manage')">
<template slot="conditions">
<m-conditions @on-conditions="_onConditions">
<template slot="button-group" v-if="isADMIN">
<el-button size="mini" @click="_create('')">{{$t('Create alarm group')}}</el-button>
<el-dialog
:visible.sync="createWarningDialog"
width="auto">
<m-create-warning :item="item" :pulginInstance="pulginInstance" @onUpdate="onUpdate" @close="close"></m-create-warning>
</el-dialog>
</template>
</m-conditions>
</template>
<template slot="content">
<template v-if="alertgroupList.length || total>0">
<m-list @on-edit="_onEdit"
@on-update="_onUpdate"
:alertgroup-list="alertgroupList"
:page-no="searchParams.pageNo"
:page-size="searchParams.pageSize">
</m-list>
<div class="page-box">
<el-pagination
background
@current-change="_page"
@size-change="_pageSize"
:page-size="searchParams.pageSize"
:current-page.sync="searchParams.pageNo"
:page-sizes="[10, 30, 50]"
layout="sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</template>
<template v-if="!alertgroupList.length && total<=0">
<m-no-data></m-no-data>
</template>
<m-spin :is-spin="isLoading" :is-left="isLeft"></m-spin>
</template>
</m-list-construction>
</template>
<script>
import _ from 'lodash'
import { mapActions } from 'vuex'
import mList from './_source/list'
import store from '@/conf/home/store'
import mSpin from '@/module/components/spin/spin'
import mCreateWarning from './_source/createWarning'
import mNoData from '@/module/components/noData/noData'
import listUrlParamHandle from '@/module/mixin/listUrlParamHandle'
import mConditions from '@/module/components/conditions/conditions'
import mListConstruction from '@/module/components/listConstruction/listConstruction'
export default {
name: 'warning-groups-index',
data () {
return {
total: null,
isLoading: false,
alertgroupList: [],
searchParams: {
pageSize: 10,
pageNo: 1,
searchVal: ''
},
isLeft: true,
isADMIN: store.state.user.userInfo.userType === 'ADMIN_USER',
createWarningDialog: false,
item: {},
pulginInstance: []
}
},
mixins: [listUrlParamHandle],
props: {},
methods: {
...mapActions('security', ['getAlertgroupP', 'getPlugins']),
/**
* Inquire
*/
_onConditions (o) {
this.searchParams = _.assign(this.searchParams, o)
this.searchParams.pageNo = 1
},
_page (val) {
this.searchParams.pageNo = val
},
_pageSize (val) {
this.searchParams.pageSize = val
},
_onUpdate () {
this._debounceGET()
},
_onEdit (item) {
this._create(item)
},
_create (item) {
this.getPlugins({ pluginType: 'ALERT' }).then(res => {
this.pulginInstance = res
}).catch(e => {
this.$message.error(e.msg)
})
this.item = item
this.createWarningDialog = true
},
onUpdate () {
this._debounceGET('false')
this.createWarningDialog = false
},
close () {
this.createWarningDialog = false
},
_getList (flag) {
if (sessionStorage.getItem('isLeft') === 0) {
this.isLeft = false
} else {
this.isLeft = true
}
this.isLoading = !flag
this.getAlertgroupP(this.searchParams).then(res => {
if (this.searchParams.pageNo > 1 && res.totalList.length === 0) {
this.searchParams.pageNo = this.searchParams.pageNo - 1
} else {
this.alertgroupList = []
this.alertgroupList = res.totalList
this.total = res.total
this.isLoading = false
}
}).catch(e => {
this.isLoading = false
})
}
},
watch: {
// router
'$route' (a) {
// url no params get instance list
this.searchParams.pageNo = _.isEmpty(a.query) ? 1 : a.query.pageNo
}
},
created () {
},
mounted () {
},
beforeDestroy () {
sessionStorage.setItem('isLeft', 1)
},
components: { mList, mListConstruction, mConditions, mSpin, mNoData, mCreateWarning }
}
</script>

View File

@ -398,6 +398,14 @@ const router = new Router({
title: `${i18n.$t('Warning group manage')}`
}
},
{
path: '/security/warning-Instance',
name: 'warning-instance-manage',
component: resolve => require(['../pages/security/pages/warningInstance/index'], resolve),
meta: {
title: `${i18n.$t('Warning instance manage')}`
}
},
{
path: '/security/queue',
name: 'queue-manage',

View File

@ -351,6 +351,42 @@ export default {
})
})
},
/**
* queryUiPlugins
*/
getPlugins ({ state }, payload) {
return new Promise((resolve, reject) => {
io.post('ui-plugins/queryUiPluginsByType', payload, res => {
resolve(res.data)
}).catch(e => {
reject(e)
})
})
},
/**
* queryUiPluginsByID
*/
getUiPluginsByID ({ state }, payload) {
return new Promise((resolve, reject) => {
io.post('ui-plugins/queryUiPluginsByID', payload, res => {
resolve(res.data)
}).catch(e => {
reject(e)
})
})
},
/**
* queryAll alert-plugin-instance
*/
queryAllAlertPluginInstance ({ state }, payload) {
return new Promise((resolve, reject) => {
io.post('alert-plugin-instance/queryAll', payload, res => {
resolve(res.data)
}).catch(e => {
reject(e)
})
})
},
/**
* Alarm group list
*/

View File

@ -109,6 +109,15 @@ const menu = {
icon: 'el-icon-warning',
children: []
},
{
name: `${i18n.$t('Warning instance manage')}`,
id: 2,
path: 'warning-instance-manage',
isOpen: true,
enabled: true,
icon: 'ri-spam-fill',
children: []
},
{
name: `${i18n.$t('Worker group manage')}`,
id: 4,

View File

@ -210,8 +210,11 @@ export default {
'Edit alarm group': 'Edit alarm group',
'Create alarm group': 'Create alarm group',
'Group Name': 'Group Name',
'Alarm instance name': 'Alarm instance name',
'Select plugin': 'Select plugin',
'Please enter group name': 'Please enter group name',
'Group Type': 'Group Type',
'Alarm plugin instance': 'Alarm plugin instance',
Remarks: 'Remarks',
SMS: 'SMS',
'Managing Users': 'Managing Users',
@ -369,6 +372,7 @@ export default {
'Process definition': 'Process definition',
'Task record': 'Task record',
'Warning group manage': 'Warning group manage',
'Warning instance manage': 'Warning instance manage',
'Servers manage': 'Servers manage',
'UDF manage': 'UDF manage',
'Resource manage': 'Resource manage',

View File

@ -209,8 +209,11 @@ export default {
'Edit alarm group': '编辑告警组',
'Create alarm group': '创建告警组',
'Group Name': '组名称',
'Alarm instance name': '告警实例名称',
'Select plugin': '选择插件',
'Please enter group name': '请输入组名称',
'Group Type': '组类型',
'Alarm plugin instance': '告警插件实例',
Remarks: '备注',
SMS: '短信',
'Managing Users': '管理用户',
@ -368,6 +371,7 @@ export default {
'Process definition': '工作流定义',
'Task record': '任务记录',
'Warning group manage': '告警组管理',
'Warning instance manage': '告警实例管理',
'Servers manage': '服务管理',
'UDF manage': 'UDF管理',
'Resource manage': '资源管理',