[Improvement]Optimize the popover box title, create and edit instances are not cleared

This commit is contained in:
break60 2021-01-22 22:09:28 +08:00
parent 5c662f0a8e
commit f85d41e7b0
23 changed files with 185 additions and 76 deletions

View File

@ -18,7 +18,7 @@
<m-conditions>
<template slot="search-group">
<div class="list">
<el-button type="primary" size="small" @click="_ckQuery" icon="el-icon-search"></el-button>
<el-button size="mini" @click="_ckQuery" icon="el-icon-search"></el-button>
</div>
<div class="list">
<el-date-picker

View File

@ -453,7 +453,6 @@
_arrDelChange (v) {
let arr = []
arr = _.map(v, 'id')
console.log(arr)
this.strDelete = _.join(arr, ',')
},
_batchDelete () {

View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
<template>
<m-popup ref="popup" :nameText="item ? $t('Edit') : $t('Create Project')" :ok-text="item ? $t('Edit') : $t('Submit')"
<m-popover ref="popover" :nameText="item ? $t('Edit') : $t('Create Project')" :ok-text="item ? $t('Edit') : $t('Submit')"
@close="_close" @ok="_ok">
<template slot="content">
<div class="projects-create-model">
@ -44,13 +44,13 @@
</m-list-box-f>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -81,7 +81,7 @@
param.projectId = this.item.id
}
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch(`projects/${this.item ? 'updateProjects' : 'createProjects'}`, param).then(res => {
this.$emit('_onUpdate')
@ -90,12 +90,10 @@
type: 'success',
offset: 70
})
setTimeout(() => {
this.$refs.popup.spinnerLoading = false
}, 800)
this.$refs.popover.spinnerLoading = false
}).catch(e => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
})
},
_close () {
@ -118,6 +116,6 @@
},
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -21,6 +21,8 @@
<template slot="button-group">
<el-button size="mini" @click="_create('')">{{ $t('Create Project') }}</el-button>
<el-dialog
:title="item ? $t('Edit') : $t('Create Project')"
v-if="createProjectDialog"
:visible.sync="createProjectDialog"
width="auto">
<m-create-project :item="item" @_onUpdate="_onUpdate" @close="_close"></m-create-project>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit queue') : $t('Create queue')"
@ok="_ok"
@close="close">
<template slot="content">
@ -50,13 +49,13 @@
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -90,17 +89,17 @@
this.$emit('onUpdate')
this.$message.success(res.msg)
setTimeout(() => {
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
}, 800)
}
let $catch = (e) => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
}
if (this.item) {
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch('security/updateQueueQ', param).then(res => {
$then(res)
}).catch(e => {
@ -108,7 +107,7 @@
})
} else {
this._verifyName(param).then(() => {
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch('security/createQueueQ', param).then(res => {
$then(res)
}).catch(e => {
@ -154,6 +153,6 @@
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -21,6 +21,8 @@
<template slot="button-group" v-if="isADMIN">
<el-button size="mini" @click="_create('')">{{$t('Create queue')}}</el-button>
<el-dialog
:title="item ? $t('Edit queue') : $t('Create queue')"
:v-if="createQueueDialog"
:visible.sync="createQueueDialog"
width="auto">
<m-create-queue :item="item" @onUpdate="onUpdate" @close="close"></m-create-queue>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit Tenant') : $t('Create Tenant')"
@ok="_ok"
@close="close">
<template slot="content">
@ -62,13 +61,13 @@
</m-list-box-f>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
name: 'create-tenement',
@ -141,16 +140,16 @@
if (this.item) {
param.id = this.item.id
}
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch(`security/${this.item ? 'updateQueue' : 'createQueue'}`, param).then(res => {
this.$emit('onUpdate')
this.$message.success(res.msg)
setTimeout(() => {
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
}, 800)
}).catch(e => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
})
},
close () {
@ -172,6 +171,6 @@
},
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -21,6 +21,8 @@
<template slot="button-group" v-if="isADMIN">
<el-button size="mini" @click="_create('')">{{$t('Create Tenant')}}</el-button>
<el-dialog
:title="item ? $t('Edit Tenant') : $t('Create Tenant')"
v-if="createTenementDialog"
:visible.sync="createTenementDialog"
width="auto">
<m-create-tenement :item="item" @onUpdate="onUpdate" @close="close"></m-create-tenement>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit User') : $t('Create User')"
@ok="_ok"
@close="close">
<template slot="content">
@ -30,6 +29,7 @@
type="input"
v-model="userName"
maxlength="60"
size="small"
:placeholder="$t('Please enter user name')">
</el-input>
</template>
@ -40,6 +40,7 @@
<el-input
type="password"
v-model="userPassword"
size="small"
:placeholder="$t('Please enter your password')">
</el-input>
</template>
@ -80,6 +81,7 @@
<el-input
type="input"
v-model="email"
size="small"
:placeholder="$t('Please enter email')">
</el-input>
</template>
@ -90,6 +92,7 @@
<el-input
type="input"
v-model="phone"
size="small"
:placeholder="$t('Please enter phone number')">
</el-input>
</template>
@ -105,14 +108,14 @@
</m-list-box-f>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import router from '@/conf/home/router'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -243,7 +246,7 @@
})
},
_submit () {
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
let queueCode = ''
// get queue code
@ -266,13 +269,13 @@
this.store.dispatch(`security/${this.item ? 'updateUser' : 'createUser'}`, param).then(res => {
setTimeout(() => {
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
}, 800)
this.$emit('onUpdate', param)
this.$message.success(res.msg)
}).catch(e => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
})
},
close () {
@ -315,6 +318,6 @@
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -99,6 +99,7 @@
</el-dialog>
<el-dialog
v-if="resourceDialog"
:visible.sync="resourceDialog"
width="auto">
<m-resource :resourceData="resourceData" @onUpdateAuthResource="onUpdateAuthResource" @closeAuthResource="closeAuthResource"></m-resource>

View File

@ -21,6 +21,8 @@
<template slot="button-group" v-if="userList.length">
<el-button size="mini" @click="_create('')">{{$t('Create User')}}</el-button>
<el-dialog
:title="item ? $t('Edit User') : $t('Create User')"
v-if="createUserDialog"
:visible.sync="createUserDialog"
width="auto">
<m-create-user :item="item" @onUpdate="onUpdate" @close="close"></m-create-user>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit alarm group') : $t('Create alarm group')"
@ok="_ok"
@close="close">
<template slot="content">
@ -61,13 +60,13 @@
</m-list-box-f>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -121,14 +120,14 @@
if (this.item) {
param.id = this.item.id
}
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch(`security/${this.item ? 'updateAlertgrou' : 'createAlertgrou'}`, param).then(res => {
this.$emit('onUpdate')
this.$message.success(res.msg)
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
}).catch(e => {
this.$message.error(e.msg || '')
this.$refs.popup.spinnerLoading = false
this.$refs.popover.spinnerLoading = false
})
},
close () {
@ -148,6 +147,6 @@
},
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -21,6 +21,8 @@
<template slot="button-group" v-if="isADMIN">
<el-button size="mini" @click="_create('')">{{$t('Create alarm group')}}</el-button>
<el-dialog
:title="item ? $t('Edit alarm group') : $t('Create alarm group')"
v-if="createWarningDialog"
:visible.sync="createWarningDialog"
width="auto">
<m-create-warning :item="item" :allAlertPluginInstance="allAlertPluginInstance" @onUpdate="onUpdate" @close="close"></m-create-warning>

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit Alarm Instance') : $t('Create Alarm Instance')"
@ok="_ok"
@close="close">
<template slot="content">
@ -56,19 +55,19 @@
</el-select>
</template>
</m-list-box-f>
<div>
<div class="alertForm">
<template>
<div class="alertForm"><form-create v-model="$f" :rule="rule" :option="{submitBtn:false}" size="mini"></form-create></div>
<form-create v-model="$f" :rule="rule" :option="{submitBtn:false}" size="mini"></form-create>
</template>
</div>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -142,16 +141,14 @@
param.alertPluginInstanceId = this.item.id
param.pluginDefineId = null
}
this.$refs.popup.spinnerLoading = true
this.$refs.popover.spinnerLoading = true
this.store.dispatch(`security/${this.item ? 'updateAlertPluginInstance' : 'createAlertPluginInstance'}`, param).then(res => {
this.$refs.popover.spinnerLoading = false
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
this.$refs.popover.spinnerLoading = false
})
},
close () {
@ -175,7 +172,7 @@
},
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>
<style lang="scss" rel="stylesheet/scss">
@ -185,6 +182,9 @@
font-weight: 10!important;
}
}
.el-row {
width: 520px;
}
.el-form-item__label {
width: 144px!important;
color: #606266!important;

View File

@ -21,8 +21,10 @@
<template slot="button-group" v-if="isADMIN">
<el-button size="mini" @click="_create('')">{{$t('Create Alarm Instance')}}</el-button>
<el-dialog
:title="item ? $t('Edit Alarm Instance') : $t('Create Alarm Instance')"
v-if="createWarningDialog"
:visible.sync="createWarningDialog"
width="45%">
width="auto">
<m-create-warning-instance :item="item" :pulginInstance="pulginInstance" @onUpdate="onUpdate" @close="close"></m-create-warning-instance>
</el-dialog>
</template>

View File

@ -69,6 +69,8 @@
<template slot="content">
<el-button type="primary" size="small" round @click="_edit()" >{{$t('Edit')}}</el-button>
<el-dialog
:title="item ? $t('Edit User') : $t('Create User')"
v-if="createUserDialog"
:visible.sync="createUserDialog"
width="auto">
<m-create-user :item="item" @onUpdate="onUpdate" @close="close"></m-create-user>
@ -131,12 +133,10 @@
padding-top: 30px;
.list-box-f {
.text {
width: 200px;
font-size: 14px;
color: #888;
}
.cont {
width: calc(100% - 210px);
margin-left: 10px;
.sp1 {
font-size: 14px;

View File

@ -15,10 +15,9 @@
* limitations under the License.
*/
<template>
<m-popup
ref="popup"
<m-popover
ref="popover"
:ok-text="item ? $t('Edit') : $t('Submit')"
:nameText="item ? $t('Edit token') : $t('Create token')"
@ok="_ok"
@close="close">
<template slot="content">
@ -65,7 +64,7 @@
</m-list-box-f>
</div>
</template>
</m-popup>
</m-popover>
</template>
<script>
import _ from 'lodash'
@ -73,7 +72,7 @@
import i18n from '@/module/i18n'
import store from '@/conf/home/store'
import Permissions from '@/module/permissions'
import mPopup from '@/module/components/popup/popup'
import mPopover from '@/module/components/popup/popover'
import mListBoxF from '@/module/components/listBoxF/listBoxF'
export default {
@ -177,7 +176,7 @@
},
mounted () {
},
components: { mPopup, mListBoxF }
components: { mPopover, mListBoxF }
}
</script>

View File

@ -21,6 +21,8 @@
<template slot="button-group">
<el-button size="mini" @click="_create('')">{{$t('Create token')}}</el-button>
<el-dialog
:title="item ? $t('Edit token') : $t('Create token')"
v-if="createTokenDialog"
:visible.sync="createTokenDialog"
width="auto">
<m-create-token :item="item" @onUpdate="onUpdate" @close="close"></m-create-token>

View File

@ -388,7 +388,7 @@ const router = new Router({
component: resolve => require(['../pages/security/pages/users/index'], resolve),
meta: {
title: `${i18n.$t('User Manage')}`,
refresh_in_switched_tab: false
refresh_in_switched_tab: true
}
},
{

View File

@ -0,0 +1,97 @@
/*
* 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="popup-model">
<div class="content-p">
<slot name="content"></slot>
</div>
<div class="bottom-p">
<el-button type="text" size="mini" round @click="close()" :disabled="disabled"> {{$t('Cancel')}} </el-button>
<el-button type="primary" size="mini" round :loading="spinnerLoading" @click="ok()" :disabled="disabled || apDisabled">{{spinnerLoading ? 'Loading...' : okText}} </el-button>
</div>
</div>
</template>
<script>
import i18n from '@/module/i18n'
export default {
name: 'popup',
data () {
return {
spinnerLoading: false,
apDisabled: false
}
},
props: {
okText: {
type: String,
default: `${i18n.$t('Confirm')}`
},
disabled: {
type: Boolean,
default: false
},
asynLoading: {
type: Boolean,
default: false
}
},
methods: {
close () {
this.$emit('close')
},
ok () {
if (this.asynLoading) {
this.spinnerLoading = true
this.$emit('ok', () => {
this.spinnerLoading = false
})
} else {
this.$emit('ok')
}
}
},
components: {}
}
</script>
<style lang="scss" rel="stylesheet/scss">
.popup-model {
background: #fff;
border-radius: 3px;
.top-p {
height: 70px;
line-height: 70px;
border-radius: 3px 3px 0 0;
padding: 0 20px;
>span {
font-size: 20px;
}
}
.bottom-p {
text-align: right;
height: 72px;
line-height: 72px;
border-radius: 0 0 3px 3px;
padding: 0 20px;
}
.content-p {
min-width: 520px;
min-height: 100px;
}
}
</style>

View File

@ -71,7 +71,7 @@
}
}
},
components: { }
components: {}
}
</script>

View File

@ -74,8 +74,8 @@
resourceData: Object
},
created () {
let file = this.fileSourceList
let udf = this.udfSourceList
let file = this.resourceData.fileSourceList
let udf = this.resourceData.udfSourceList
this.diGuiTree(file)
this.diGuiTree(udf)
this.fileList = file
@ -218,7 +218,6 @@
delete item.children
},
close () {
console.log(888)
this.$emit('closeAuthResource')
}
},

View File

@ -359,7 +359,9 @@ body::-webkit-scrollbar-thumb {
max-height: 200px;
overflow: auto;
}
.el-dialog__body {
padding: 10px;
}