fix:alert account promSever 添加修改页面调整
This commit is contained in:
wangwenrui
@@ -41,6 +41,7 @@ const en = {
|
||||
validate: { //校验规则
|
||||
required: 'Required',
|
||||
number: 'Must be a number',
|
||||
email:'E-mail is invalide',
|
||||
config: {
|
||||
account: {
|
||||
|
||||
|
||||
@@ -3,26 +3,19 @@
|
||||
<div class="right-box right-box-alert-config" v-if="rightBox.show">
|
||||
<!-- begin--顶部按钮-->
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="esc">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="saveOrToEdit">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-edit-outline"></i>
|
||||
</div>
|
||||
<span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
|
||||
<span v-else>{{$t('overall.edit')}}</span>
|
||||
</div>
|
||||
<div @click="del" class="right-box-top-btn" v-if="rightBox.isEdit && alertRule.id != ''">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-delete"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.delete')}}</span>
|
||||
</div>
|
||||
<button type="button" v-if="alertRule.id != ''" @click="del" class="nz-btn nz-btn-size-normal nz-btn-style-light">
|
||||
<span class="top-tool-btn-txt">{{$t('overall.delete')}}</span>
|
||||
</button>
|
||||
<button type="button" @click="save" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
|
||||
<span v-if="rightBox.isEdit" class="top-tool-btn-txt">{{$t('overall.save')}}</span>
|
||||
<span v-else class="top-tool-btn-txt">{{$t('overall.edit')}}</span>
|
||||
</button>
|
||||
|
||||
<button type="button" @click="esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-style-square">
|
||||
<span class="top-tool-btn-txt"><i class="el-icon-close"></i></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- end--顶部按钮-->
|
||||
|
||||
<!-- begin--标题-->
|
||||
@@ -30,152 +23,68 @@
|
||||
<!-- end--标题-->
|
||||
|
||||
<!-- begin--表单-->
|
||||
<div class="right-box-form">
|
||||
<!--name-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.config.name')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
v-if="rightBox.isEdit"
|
||||
type="text"
|
||||
placeholder=""
|
||||
v-model="alertRule.alertName"
|
||||
maxlength="64"
|
||||
show-word-limit
|
||||
size="small"
|
||||
></el-input>
|
||||
<el-scrollbar class="right-box-form-box">
|
||||
<el-form class="right-box-form" :model="alertRule" label-position="top" :rules="rules" ref="alertRuleForm">
|
||||
<!--alertName-->
|
||||
<el-form-item :label='$t("alert.config.name")' prop="alertName">
|
||||
<el-input v-if="rightBox.isEdit" placeholder="" maxlength="64" show-word-limit v-model="alertRule.alertName" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.alertName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--type-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.list.type')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-select @change="(val) => {changeType(val);}" popper-class="config-dropdown" v-model="alertRule.type" placeholder="" v-if="rightBox.isEdit" size="small" >
|
||||
<el-option
|
||||
v-for="item in typeData"
|
||||
:key="item.key"
|
||||
:label="item.value"
|
||||
:value="item.key">
|
||||
</el-option>
|
||||
<el-form-item :label="$t('alert.list.type')" prop="type">
|
||||
<el-select v-if="rightBox.isEdit" @change="(val) => {changeType(val);}" popper-class="config-dropdown" v-model="alertRule.type" placeholder="" size="small" >
|
||||
<el-option v-for="item in typeData" :key="item.key" :label="item.value" :value="item.key"></el-option>
|
||||
</el-select>
|
||||
<div v-for="item in typeData" v-if="!rightBox.isEdit && item.key == alertRule.type" class="right-box-form-content-txt">{{item.value}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--linkedId-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.config.link')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.linkObject ? alertRule.linkObject.name : ''}}</div>
|
||||
<el-select v-model="alertRule.linkId" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
v-for="item in linkObjList"
|
||||
:key="item.id"
|
||||
:label="alertRule.type == 3 ? item.host : item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
<el-form-item :label="$t('alert.config.link')" prop="linkId">
|
||||
<el-select v-if="rightBox.isEdit" v-model="alertRule.linkId" placeholder="" size="small">
|
||||
<el-option v-for="item in linkObjList" :key="item.id" :label="alertRule.type == 3 ? item.host : item.name" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.linkObject ? alertRule.linkObject.name : ''}}</div>
|
||||
</el-form-item>
|
||||
<!--expr-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.config.expr')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="alertRule.expr"
|
||||
size="small"
|
||||
></el-input>
|
||||
<el-form-item :label="$t('alert.config.expr')" prop="expr">
|
||||
<el-input v-if="rightBox.isEdit" type="textarea" placeholder="" v-model="alertRule.expr" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.expr}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--for-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.config.for')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="alertRule.last"
|
||||
size="small"
|
||||
>
|
||||
</el-form-item>
|
||||
<!--last-->
|
||||
<el-form-item :label="$t('alert.config.for')" prop="last">
|
||||
<el-input v-if="rightBox.isEdit" type="text" placeholder="" v-model.number="alertRule.last" size="small">
|
||||
<template slot="append">second</template>
|
||||
</el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.last}}s</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--severity-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.severity')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-select popper-class="config-dropdown" v-model="alertRule.severity" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
v-for="item in severityData"
|
||||
:key="item.key"
|
||||
:label="item.value"
|
||||
:value="item.key">
|
||||
<el-form-item :label="$t('alert.severity')" prop="severity">
|
||||
<el-select v-if="rightBox.isEdit" popper-class="config-dropdown" v-model="alertRule.severity" placeholder="" size="small">
|
||||
<el-option v-for="item in severityData" :key="item.key" :label="item.value" :value="item.key">
|
||||
<span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.value}}</span>
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
|
||||
<el-input
|
||||
type="text"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
></el-input>
|
||||
<el-input type="text" v-model="item.name" size="mini"></el-input>
|
||||
</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.severity}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--summary-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.summary')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="alertRule.summary"
|
||||
size="small"
|
||||
></el-input>
|
||||
<el-form-item :label="$t('alert.summary')" prop="summary">
|
||||
<el-input v-if="rightBox.isEdit" type="text" placeholder="" v-model="alertRule.summary" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.summary}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--description-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('alert.description')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="alertRule.description"
|
||||
size="small"
|
||||
></el-input>
|
||||
<el-form-item :label="$t('alert.description')" prop="description">
|
||||
<el-input v-if="rightBox.isEdit" type="textarea" placeholder="" v-model="alertRule.description" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.description}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!--receiver-->
|
||||
<!--<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.account.receiver')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<!--<el-form-item :label="$t('config.account.receiver')" prop="receiver">
|
||||
<el-select class="right-box-row-with-btn" value-key="id" popper-class="config-dropdown" v-model="alertRule.receiver" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
@click.native="blurEditReceiver()"
|
||||
v-for="item in receiverData"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item">
|
||||
<el-option @click.native="blurEditReceiver()" v-for="item in receiverData" :key="item.id" :label="item.name" :value="item">
|
||||
<span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.name}}</span>
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
|
||||
<el-input
|
||||
type="text"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
></el-input>
|
||||
<el-input type="text" v-model="item.name" size="mini"></el-input>
|
||||
</span>
|
||||
<span class="config-dropdown-error-message">{{item.errorMessage}}</span>
|
||||
<span class="config-dropdown-btn" @click.stop="toEditReceiver(item)">
|
||||
@@ -185,21 +94,11 @@
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="toDelReceiver(item)"><i class="el-icon-delete"></i></span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="right-box-row-btn" v-if="rightBox.isEdit">
|
||||
<span class="el-icon-plus"></span>
|
||||
</div>
|
||||
<div class="right-box-form-content-txt" v-if="!rightBox.isEdit">{{alertRule.receiver}}</div>
|
||||
</div>
|
||||
</div>-->
|
||||
</div>
|
||||
</el-form-item>-->
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<!-- end--表单-->
|
||||
|
||||
<!-- begin--底部按钮-->
|
||||
<div class="right-box-bottom-btns">
|
||||
<div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div @click="save" v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{alertRule.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
|
||||
</div>
|
||||
<!-- end--底部按钮-->
|
||||
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
@@ -214,6 +113,36 @@
|
||||
return {
|
||||
alertRule: {id: ''},
|
||||
rightBox: {show: false, isEdit: false, title: ''},
|
||||
rules:{
|
||||
alertName:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'}
|
||||
],
|
||||
type:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'change'}
|
||||
],
|
||||
linkId:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:"change"}
|
||||
],
|
||||
expr:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'}
|
||||
],
|
||||
last:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'},
|
||||
{type:'number',message:this.$t('validate.number')}
|
||||
],
|
||||
severity:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'change'},
|
||||
],
|
||||
summary:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'},
|
||||
],
|
||||
// description:[
|
||||
// {required:true,message:this.$t('validate.required'),trigger:'blur'},
|
||||
// ],
|
||||
// receiver:[
|
||||
// {required:true,message:this.$t('validate.required'),trigger:'change'},
|
||||
// ]
|
||||
},
|
||||
severityData: [
|
||||
{
|
||||
key: 'medium',
|
||||
@@ -276,6 +205,8 @@
|
||||
this.rightBox.isEdit = isEdit;
|
||||
},
|
||||
save: function() {
|
||||
this.$refs.alertRuleForm.validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.alertRule.id) {
|
||||
this.$put('alert/rule', this.alertRule).then(response => {
|
||||
if (response.code === 200) {
|
||||
@@ -297,6 +228,10 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
changeType(type) {
|
||||
this.alertRule.linkId = '';
|
||||
|
||||
@@ -100,25 +100,17 @@
|
||||
<div class="right-box right-box-account" v-if="rightBox.show">
|
||||
<!-- begin--顶部按钮-->
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="esc()">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="saveOrToEdit">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-edit-outline"></i>
|
||||
</div>
|
||||
<span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
|
||||
<span v-else>{{$t('overall.edit')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn" v-if="rightBox.isEdit && user.userId != ''" @click="del(user)">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-delete"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.delete')}}</span>
|
||||
</div>
|
||||
<button type="button" v-if="user.userId != ''" @click="del(user)" class="nz-btn nz-btn-size-normal nz-btn-style-light">
|
||||
<span class="top-tool-btn-txt">{{$t('overall.delete')}}</span>
|
||||
</button>
|
||||
<button type="button" @click="saveOrToEdit" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
|
||||
<span v-if="rightBox.isEdit" class="top-tool-btn-txt">{{$t('overall.save')}}</span>
|
||||
<span v-else class="top-tool-btn-txt">{{$t('overall.edit')}}</span>
|
||||
</button>
|
||||
|
||||
<button type="button" @click="esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-style-square">
|
||||
<span class="top-tool-btn-txt"><i class="el-icon-close"></i></span>
|
||||
</button>
|
||||
</div>
|
||||
<!-- end--顶部按钮-->
|
||||
|
||||
@@ -127,116 +119,39 @@
|
||||
<!-- end--标题-->
|
||||
|
||||
<!-- begin--表单-->
|
||||
<div class="right-box-form">
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.account.account')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
v-if="rightBox.isEdit"
|
||||
type="text"
|
||||
placeholder=""
|
||||
v-model="user.username"
|
||||
maxlength="64"
|
||||
show-word-limit
|
||||
size="small"
|
||||
></el-input>
|
||||
<el-scrollbar class="right-box-form-box">
|
||||
<el-form class="right-box-form" :model="user" label-position="top" :rules="rules" ref="accountForm">
|
||||
<!--username-->
|
||||
<el-form-item :label="$t('config.account.account')" prop="username">
|
||||
<el-input v-if="rightBox.isEdit" type="text" placeholder="" v-model="user.username" maxlength="64" show-word-limit size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{user.username}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row" v-if="rightBox.isEdit && !user.userId">
|
||||
<div class="right-box-form-label">{{$t('config.account.password')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
placeholder=""
|
||||
v-model="user.password"
|
||||
maxlength="16"
|
||||
show-word-limit
|
||||
size="small"
|
||||
></el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">E-mail</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="user.email"
|
||||
size="small"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!--password-->
|
||||
<el-form-item :label="$t('config.account.password')" prop="password" v-if="rightBox.isEdit &&!user.userId">
|
||||
<el-input type="password" placeholder="" v-model="user.password" maxlength="16" show-word-limit size="small"></el-input>
|
||||
</el-form-item>
|
||||
<!--email-->
|
||||
<el-form-item label="E-mail" prop="email">
|
||||
<el-input v-if="rightBox.isEdit" type="text" placeholder="" v-model="user.email" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{user.email}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.account.receiver')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-select class="right-box-row-with-btn" value-key="id" popper-class="config-dropdown" multiple v-model="user.receiver" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
@click.native="blurEditReceiver()"
|
||||
v-for="item in receiverData"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item">
|
||||
<span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.name}}</span>
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
|
||||
<el-input
|
||||
type="text"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
></el-input>
|
||||
</span>
|
||||
<span class="config-dropdown-error-message">{{item.errorMessage}}</span>
|
||||
<span class="config-dropdown-btn" @click.stop="toEditReceiver(item)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="toDelReceiver(item)"><i class="el-icon-delete"></i></span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="right-box-row-btn" v-if="rightBox.isEdit">
|
||||
<span class="el-icon-plus"></span>
|
||||
</div>
|
||||
<div class="right-box-form-content-txt" v-if="!rightBox.isEdit">
|
||||
<template v-for="rec in user.receiver">{{rec.name}}</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<!--<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.account.language')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-radio v-model="user.lang" label="en" :disabled="!rightBox.isEdit && user.lang != 'en'">English</el-radio>
|
||||
<el-radio v-model="user.lang" label="zh" :disabled="!rightBox.isEdit && user.lang != 'zh'">中文</el-radio>
|
||||
</el-form-item>
|
||||
<!--language-->
|
||||
<!--<el-form-item :label="$t('config.account.language')" prop="language">
|
||||
<el-radio v-model="user.lang" label="en" :disabled="user.lang != 'en'">English</el-radio>
|
||||
<el-radio v-model="user.lang" label="zh" :disabled="user.lang != 'zh'">中文</el-radio>
|
||||
<el-radio v-model="user.lang" label="ru" disabled>русский（{{$t('config.account.notCurrentlySupport')}}）</el-radio>
|
||||
</div>
|
||||
</div>-->
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.account.enable')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-switch
|
||||
v-model="user.status"
|
||||
:disabled="!rightBox.isEdit"
|
||||
active-value="1"
|
||||
inactive-value="0">
|
||||
</el-form-item>-->
|
||||
<!--enable-->
|
||||
<el-form-item :label="$t('config.account.enable')">
|
||||
<el-switch v-model="user.status" :disabled="!rightBox.isEdit" active-value="1" inactive-value="0">
|
||||
</el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row" v-if="!rightBox.isEdit">
|
||||
<div class="right-box-form-label">{{$t('config.account.createTime')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('config.account.createTime')" v-if="!rightBox.isEdit">
|
||||
<div class="right-box-form-content-txt">{{user.createTime}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<!-- end--表单-->
|
||||
|
||||
<!-- begin--底部按钮-->
|
||||
<div class="right-box-bottom-btns">
|
||||
<div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div @click="save" v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{user.userId == '' ? $t('overall.create') : $t('overall.save')}}</div>
|
||||
</div>
|
||||
<!-- end--底部按钮-->
|
||||
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
@@ -305,6 +220,18 @@ export default {
|
||||
width: 100
|
||||
}
|
||||
],
|
||||
rules:{
|
||||
username:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'}
|
||||
],
|
||||
password:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'}
|
||||
],
|
||||
email:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'},
|
||||
{type:'email',message:this.$t('validate.email')}
|
||||
]
|
||||
},
|
||||
tableData: [],
|
||||
receiverData: [{
|
||||
id: '1',
|
||||
@@ -395,6 +322,8 @@ export default {
|
||||
this.rightBox.show = true;
|
||||
},
|
||||
save: function() {
|
||||
this.$refs.accountForm.validate((valid) => {
|
||||
if(valid){
|
||||
if (this.user.userId) {
|
||||
this.$put('sys/user/update', this.user).then(response => {
|
||||
if (response.code === 200) {
|
||||
@@ -416,6 +345,10 @@ export default {
|
||||
}
|
||||
});
|
||||
}
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
saveOrToEdit: function() {
|
||||
if (!this.rightBox.isEdit) {
|
||||
|
||||
@@ -115,25 +115,17 @@
|
||||
<div class="right-box right-box-prom" v-if="rightBox.show">
|
||||
<!-- begin--顶部按钮-->
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="esc()">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="saveOrToEdit">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-edit-outline"></i>
|
||||
</div>
|
||||
<span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
|
||||
<span v-else>{{$t('overall.edit')}}</span>
|
||||
</div>
|
||||
<div @click="del(promServer)" class="right-box-top-btn" v-if="rightBox.isEdit && promServer.id != ''">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-delete"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.delete')}}</span>
|
||||
</div>
|
||||
<button type="button" v-if="rightBox.isEdit && promServer.id != ''" @click="del(promServer)" class="nz-btn nz-btn-size-normal nz-btn-style-light">
|
||||
<span class="top-tool-btn-txt">{{$t('overall.delete')}}</span>
|
||||
</button>
|
||||
<button type="button" @click="saveOrToEdit" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
|
||||
<span v-if="rightBox.isEdit" class="top-tool-btn-txt">{{$t('overall.save')}}</span>
|
||||
<span v-else class="top-tool-btn-txt">{{$t('overall.edit')}}</span>
|
||||
</button>
|
||||
|
||||
<button type="button" @click="esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-style-square">
|
||||
<span class="top-tool-btn-txt"><i class="el-icon-close"></i></span>
|
||||
</button>
|
||||
</div>
|
||||
<!-- end--顶部按钮-->
|
||||
|
||||
@@ -142,82 +134,55 @@
|
||||
<!-- end--标题-->
|
||||
|
||||
<!-- begin--表单-->
|
||||
<div class="right-box-form">
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">DC</div>
|
||||
<el-scrollbar class="right-box-form-box">
|
||||
<el-form class="right-box-form" :model="promServer" label-position="top" :rules="rules" ref="promServerForm">
|
||||
<!--DC start-->
|
||||
<el-form-item label="DC" prop="idc.name">
|
||||
<div class="right-box-form-content">
|
||||
<el-select class="right-box-row-with-btn" value-key="id" popper-class="config-dropdown" v-model="promServer.idc" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
@click.native="blurEditIdc()"
|
||||
v-for="item in idcData"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item">
|
||||
<el-option @click.native="blurEditIdc()" v-for="item in idcData" :key="item.id" :label="item.name" :value="item">
|
||||
<span class="config-dropdown-label-txt">{{item.name}}</span>
|
||||
<el-popover
|
||||
placement="left"
|
||||
v-model="item[item.name]"
|
||||
>
|
||||
<el-popover placement="left" v-model="item[item.name]">
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@click="item[item.name] = false">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="item[item.name] = false">
|
||||
<div class="right-box-btn-icon"><i class="el-icon-close"></i></div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.editIdcTab.title')}}</span>
|
||||
<el-input v-model="popIdcData.name"/>
|
||||
<el-input v-model="popIdcData.location"/>
|
||||
<el-select v-model="popIdcData.principal" clearable>
|
||||
<el-option
|
||||
v-for="item in idcUserData"
|
||||
:key="item.key"
|
||||
:label="item.username"
|
||||
:value="item.userId"
|
||||
>
|
||||
</el-option>
|
||||
<el-option v-for="item in idcUserData" :key="item.key" :label="item.username" :value="item.userId"></el-option>
|
||||
</el-select>
|
||||
<el-input v-model="popIdcData.tel"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-bottom-btns">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel"
|
||||
@click.stop="item[item.name]= false">
|
||||
{{$t('overall.cancel')}}
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel" @click.stop="item[item.name]= false">{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="editData('idc', item.id, popIdcData)">
|
||||
{{$t('overall.save')}}
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50" @click="editData('idc', item.id, popIdcData)">{{$t('overall.save')}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click.stop="getSingleIDCData(item.id,'edit')"><i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
<span class="config-dropdown-btn" slot="reference" @click.stop="getSingleIDCData(item.id,'edit')"><i class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="toDelIdc(item)"><i class="el-icon-delete"></i></span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
|
||||
<div class="right-box-row-btn" v-if="rightBox.isEdit">
|
||||
<el-popover
|
||||
placement="left"
|
||||
v-model="visible"
|
||||
>
|
||||
<el-popover placement="left" v-model="visible">
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@click="visible = false">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click="visible = false">
|
||||
<div class="right-box-btn-icon"><i class="el-icon-close"></i></div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.AddIdcTab.title')}}</span>
|
||||
<div style="padding-top: 10px;padding-left: 20px">
|
||||
<div>
|
||||
<label style="font-size: 12px">DN name</label>
|
||||
@@ -229,17 +194,8 @@
|
||||
</div>
|
||||
<div style="padding-top: 40px">
|
||||
<label style="font-size: 12px;padding-right: 20px">负责人</label>
|
||||
<select class='sidebar-pop-input-select'
|
||||
style="margin-left:-40px "
|
||||
v-model="addIdcData.principal"
|
||||
clearable>
|
||||
<option
|
||||
v-for="item in idcUserData"
|
||||
:key="item.key"
|
||||
:label="item.username"
|
||||
:value="item.userId"
|
||||
>
|
||||
</option>
|
||||
<select class='sidebar-pop-input-select' style="margin-left:-40px " v-model="addIdcData.principal" clearable>
|
||||
<option v-for="item in idcUserData" :key="item.key" :label="item.username" :value="item.userId"></option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="padding-top: 40px">
|
||||
@@ -249,73 +205,34 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-bottom-btns">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel"
|
||||
@click.stop="visible= false">
|
||||
{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="addNewData('IDC')">
|
||||
{{$t('overall.save')}}
|
||||
</div>
|
||||
</div>
|
||||
<span slot="reference"
|
||||
@click.prevent=''><i
|
||||
class="el-icon-plus"></i></span>
|
||||
<span slot="reference" @click.prevent=''><i class="el-icon-plus"></i></span>
|
||||
</el-popover>
|
||||
</div>
|
||||
<div class="right-box-form-content-txt" v-if="!rightBox.isEdit">{{promServer.idc.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">Host</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="promServer.host"
|
||||
size="small"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!--DC end-->
|
||||
|
||||
<!--host-->
|
||||
<el-form-item label="Host" prop="host">
|
||||
<el-input type="text" v-if="rightBox.isEdit" placeholder="" v-model="promServer.host" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{promServer.host}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">Port</div>
|
||||
<div class="right-box-form-content">
|
||||
<el-input
|
||||
type="text"
|
||||
v-if="rightBox.isEdit"
|
||||
placeholder=""
|
||||
v-model="promServer.port"
|
||||
size="small"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!--Port-->
|
||||
<el-form-item label="Port" prop="port">
|
||||
<el-input type="text" v-if="rightBox.isEdit" placeholder="" v-model.number="promServer.port" size="small"></el-input>
|
||||
<div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{promServer.port}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-form-row">
|
||||
<div class="right-box-form-label">{{$t('config.promServer.type')}}</div>
|
||||
<div class="right-box-form-content">
|
||||
</el-form-item>
|
||||
<!--type-->
|
||||
<el-form-item :label="$t('config.promServer.type')" prop="type">
|
||||
<el-select popper-class="config-dropdown" v-model="promServer.type" placeholder="" v-if="rightBox.isEdit" size="small">
|
||||
<el-option
|
||||
v-for="item in typeData"
|
||||
:key="item.key"
|
||||
:label="item.value"
|
||||
:value="item.key">
|
||||
</el-option>
|
||||
<el-option v-for="item in typeData" :key="item.key" :label="item.value" :value="item.key"></el-option>
|
||||
</el-select>
|
||||
<div v-for="item in typeData" v-if="!rightBox.isEdit && item.key == promServer.type" class="right-box-form-content-txt">{{item.value}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<!-- end--表单-->
|
||||
|
||||
<!-- begin--底部按钮-->
|
||||
<div class="right-box-bottom-btns">
|
||||
<div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div @click="save()" v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{promServer.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
|
||||
</div>
|
||||
<!-- end--底部按钮-->
|
||||
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
@@ -337,6 +254,21 @@ export default {
|
||||
host: '',
|
||||
idc: {id: '', name: '', location: ''}
|
||||
},
|
||||
rules:{
|
||||
'idc.name':[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'change'}
|
||||
],
|
||||
host:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'}
|
||||
],
|
||||
port:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'blur'},
|
||||
{type:'number',message: this.$t('validate.number')}
|
||||
],
|
||||
type:[
|
||||
{required:true,message:this.$t('validate.required'),trigger:'change'},
|
||||
]
|
||||
},
|
||||
pageObj: {
|
||||
pageNo: 1,
|
||||
pageSize: 20,
|
||||
@@ -473,6 +405,8 @@ export default {
|
||||
this.rightBox.show = true;
|
||||
},
|
||||
save: function() {
|
||||
this.$refs.promServerForm.validate((valid => {
|
||||
if(valid){
|
||||
if (this.promServer.id) {
|
||||
this.$put('promServer', this.promServer).then(response => {
|
||||
if (response.code === 200) {
|
||||
@@ -496,6 +430,10 @@ export default {
|
||||
}
|
||||
});
|
||||
}
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
}))
|
||||
},
|
||||
saveOrToEdit: function() {
|
||||
if (!this.rightBox.isEdit) {
|
||||
|
||||
Reference in New Issue
Block a user