feat:修改密码功能 & 其他修改

1.修改密码功能实现
2.取消dc cabinet 的修改链接、按钮
3.翻译内容修改
4.取消header - asset的复选显示效果
This commit is contained in:
wangwenrui
2020-02-21 17:14:46 +08:00
parent 3d82b5c83f
commit 6ad5f7c24d
6 changed files with 242 additions and 88 deletions

View File

@@ -57,15 +57,16 @@
</template>
<template v-for="(item, index) in assetData">
<el-menu-item :index="'3-' + index">
<div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" :class="{'menu-item-active' : (activeIndex == 'asset' && indOf(activeItemIndexes, item.id) > -1) }">
<!-- <div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" :class="{'menu-item-active' : (activeIndex == 'asset' && indOf(activeItemIndexes, item.id) > -1) }">-->
<div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" >
<span class="too-long-split" style="width: 130px;">{{item.name}}</span>
<idc-config-box :post-idc="item" ref="idcConfigBox" placement="left" @after="getIDCOptionData" :user-data="userDatas">
<template v-slot:optionZone>
<div v-show="hoverItemIndex == '3-' + index" @click="closeAllPop" class="menu-edit">
<i class="nz-icon nz-icon-edit" @click="getIDCOptionData(item.id)" style="color: inherit"></i>
</div>
</template>
</idc-config-box>
<!-- <idc-config-box :post-idc="item" ref="idcConfigBox" placement="left" @after="getIDCOptionData" :user-data="userDatas">-->
<!-- <template v-slot:optionZone>-->
<!-- <div v-show="hoverItemIndex == '3-' + index" @click="closeAllPop" class="menu-edit">-->
<!-- <i class="nz-icon nz-icon-edit" @click="getIDCOptionData(item.id)" style="color: inherit"></i>-->
<!-- </div>-->
<!-- </template>-->
<!-- </idc-config-box>-->
</div>
</el-menu-item>
</template>
@@ -106,6 +107,9 @@
<div style="height: 1px; width: 100%; background-color: #cccccc;"></div>
</el-menu-item>
<el-menu-item index="6-3">
<div @click="showPwdDialog">{{$t('overall.changePwd')}}</div>
</el-menu-item>
<el-menu-item index="6-4">
<div @click="logout">{{$t('overall.signOut')}}</div>
</el-menu-item>
</el-submenu>
@@ -121,13 +125,16 @@
<asset-add-unit :add-unit-show='addUnitShow' @refreshData="refreshAsset" ref="assetAddUnit"
@sendStateData="closeAsset"></asset-add-unit>
<alert-config-box :parentAlertRule="alertRule" @reload="" ref="alertConfigBox"></alert-config-box>
<change-password :cur-user="username" :show-dialog="showChangePwd" @click="showPwdDialog" @dialogClosed="dialogClosed"></change-password>
</div>
</template>
<script>
import bus from '../../libs/bus';
import changePwd from "../page/config/changePwd";
export default {
name: "Header",
components: {'change-password':changePwd},
data() {
return {
username: sessionStorage.getItem("nz-username"),
@@ -213,7 +220,8 @@
idcUserData: '',
IDCOptionData: [],
addUnitShow: false,
userDatas:[]
userDatas:[],
showChangePwd:false,
}
},
methods: {
@@ -418,6 +426,12 @@
refreshLang() {
this.language = localStorage.getItem("nz-language-" + this.username);
this.$i18n.locale = this.language;
},
showPwdDialog:function(){
this.showChangePwd=true;
},
dialogClosed:function(){
this.showChangePwd=false;
}
},
created() {

View File

@@ -34,7 +34,8 @@ const en = {
query: 'Query', //查询
back: 'Back', //返回
unavailable: 'Unavailable',
available: 'Available'
available: 'Available',
changePwd:'Change Password',//修改密码
},
dashboard:{
title:'Dashboard',
@@ -157,7 +158,7 @@ const en = {
refreshLater:'Refresh later'//'请稍后刷新'
},
asset:{
asset: 'Asset',//'资产'
asset: 'Assets',//'资产'
EditAsset:'Edit asset',//'编辑资产'
pingActive: 'active',//可ping通
pingInactive:'inactive',
@@ -340,7 +341,16 @@ const en = {
createAccount: 'New account',//"新增用户"
editAccount: 'Edit account',//"编辑用户"
notCurrentlySupport: 'Not available',//'暂不支持'
password: 'Password'//'密码'
password: 'Password',//'密码'
oldPwd:'Old Password',
inputOldPwd:'Please input old password',
newPwd:'New password',
inputNewPwd:'Please input new password',
confirmPwd:'Confirm Password',
inputConfirmPwd:'Please input confirm password',
invalidPwd:'invalide password,the length at least 6',
confirmPwdErr:'The two passwords are inconsistent',
reinputPwd:'Enter password again'
},
promServer: {
promServerList: 'Prometheus server',//"Prometheus Server"
@@ -353,10 +363,10 @@ const en = {
},
},
alert: {
alert: 'Alert',//"告警"
alert: 'Alerts',//"告警"
message: 'Message',//'信息'
rule: 'Rule',//'规则'
alertList: 'Alert information',//"告警信息"
alertList: 'Alert message',//"告警信息"
alertConfig: 'Alert rule',//"告警规则"
alertName: 'Alert name',//"告警名称"
severity: 'Level',//"等级"

View File

@@ -1,7 +1,7 @@
<template>
<div class="asset" ref="asset">
<div class="content-left">
<div class="sidebar-title">Asset</div>
<div class="sidebar-title">{{$t('asset.asset')}}</div>
<div class="sidebar-info">
<!--<div class="sidebar-info-header">ALL</div>-->
<el-checkbox :indeterminate="checkAllHandler" class="sidebar-info-item" v-model="checkAllFlag" @change="dcSelectAll" :true-label="1" :false-label="0">
@@ -17,13 +17,13 @@
<span v-else>{{item.name}}</span>
</div>
<idc-config-box ref="idcConfigBox" :post-idc="item" placement="left" @after="getIDCOptionData" :button-class="'checkbox-edit'" :user-data="idcUserData">
<template v-slot:optionZone>
<span @click="closeAllPop">
<i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit')"></i>
</span>
</template>
</idc-config-box>
<!-- <idc-config-box ref="idcConfigBox" :post-idc="item" placement="left" @after="getIDCOptionData" :button-class="'checkbox-edit'" :user-data="idcUserData">-->
<!-- <template v-slot:optionZone>-->
<!-- <span @click="closeAllPop">-->
<!-- <i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit')"></i>-->
<!-- </span>-->
<!-- </template>-->
<!-- </idc-config-box>-->
</el-checkbox>
</el-checkbox-group>
</div>
@@ -107,20 +107,22 @@
<span v-else class="unclickable">{{scope.row.alertNum}}</span>
</template>
<div v-if="item.prop=='dataCenter'">
<idc-config-box :post-idc="JSON.parse(JSON.stringify(scope.row.idc))" ref="idcConfigBox" :is-edit="false" placement="left" @after="getAssetData(null, true)" :button-class="'checkbox-edit'" :user-data="idcUserData">
<template v-slot:optionZone>
<!-- <span class="link" @click="closeAllPop">{{scope.row.idc.name}}</span>-->
<span class="clickable" @click="closeAllPop">{{scope.row.idc.name}}</span>
</template>
</idc-config-box>
<!-- <idc-config-box :post-idc="JSON.parse(JSON.stringify(scope.row.idc))" ref="idcConfigBox" :is-edit="false" placement="left" @after="getAssetData(null, true)" :button-class="'checkbox-edit'" :user-data="idcUserData">-->
<!-- <template v-slot:optionZone>-->
<!--&lt;!&ndash; <span class="link" @click="closeAllPop">{{scope.row.idc.name}}</span>&ndash;&gt;-->
<!-- <span class="clickable" @click="closeAllPop">{{scope.row.idc.name}}</span>-->
<!-- </template>-->
<!-- </idc-config-box>-->
<span >{{scope.row.idc.name}}</span>
</div>
<template v-if="item.prop=='cabinet'">
<cabinet-config-box v-if="scope.row.cabinet&&scope.row.cabinet!='--'" ref="cabinetConfigBox" placement="left" :is-edit="false" :post-cabinet="JSON.parse(JSON.stringify(scope.row.cabinet))" @after="getAssetData(null, true)" :post-idc-datas="IDCOptionData">
<!-- <span slot="optionZone" @click="closeAllPop" class="link">{{returnData(scope.row.cabinet)}}</span>-->
<span class="clickable" slot="optionZone" @click="closeAllPop" >{{returnData(scope.row.cabinet).name}}</span>
</cabinet-config-box>
<span v-else class="unclickable">{{returnData(scope.row.cabinet)}}</span>
<!-- <cabinet-config-box v-if="scope.row.cabinet&&scope.row.cabinet!='&#45;&#45;'" ref="cabinetConfigBox" placement="left" :is-edit="false" :post-cabinet="JSON.parse(JSON.stringify(scope.row.cabinet))" @after="getAssetData(null, true)" :post-idc-datas="IDCOptionData">-->
<!--&lt;!&ndash; <span slot="optionZone" @click="closeAllPop" class="link">{{returnData(scope.row.cabinet)}}</span>&ndash;&gt;-->
<!-- <span class="clickable" slot="optionZone" @click="closeAllPop" >{{returnData(scope.row.cabinet).name}}</span>-->
<!-- </cabinet-config-box>-->
<span v-if="scope.row.cabinet&&scope.row.cabinet!='--'">{{returnData(scope.row.cabinet).name}}</span>
<!-- <span v-else class="unclickable">{{returnData(scope.row.cabinet)}}</span>-->
<span v-else >{{returnData(scope.row.cabinet)}}</span>
</template>
<div v-if="item.prop=='model'">
<span>{{scope.row.model.name}}</span>

View File

@@ -256,7 +256,8 @@
<div class="line-100 asset-line"></div>
<!------------------------------------------IDC---------------------------------------------->
<el-form-item :label="$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">
<!-- <el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">-->
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" placeholder="">
<el-option
:id="'asset-add-idc-op'+item.key"
v-for="item in IDCOptionData"
@@ -265,22 +266,22 @@
:value="item.id"
>
<span class="config-dropdown-label-txt">{{ item.name }}</span>
<div class="config-dropdown-label-icons">
<span class="config-dropdown-btn config-dropdown-btn-delete"
@click.stop="deleteData('idc',item.id)" :id="'asset-add-idc-op-del-'+item.id"><i
class="el-icon-delete"></i></span>
<idc-config-box :post-idc="popIdcData" placement="left" @after="getIDCOptionData" :button-class="'config-dropdown-btn'">
<template v-slot:optionZone>
<i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit', item)"></i>
</template>
</idc-config-box>
</div>
<!-- <div class="config-dropdown-label-icons">-->
<!-- <span class="config-dropdown-btn config-dropdown-btn-delete"-->
<!-- @click.stop="deleteData('idc',item.id)" :id="'asset-add-idc-op-del-'+item.id"><i-->
<!-- class="el-icon-delete"></i></span>-->
<!-- <idc-config-box :post-idc="popIdcData" placement="left" @after="getIDCOptionData" :button-class="'config-dropdown-btn'">-->
<!-- <template v-slot:optionZone>-->
<!-- <i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit', item)"></i>-->
<!-- </template>-->
<!-- </idc-config-box>-->
<!-- </div>-->
</el-option>
</el-select>
<div class="right-box-row-btn right-box-row-btn-small">
<idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>
<!-- <div class="right-box-row-btn right-box-row-btn-small">-->
<!-- <idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>-->
</div>
<!-- </div>-->
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.location')">
<span>{{idcSelectedData.location}}</span>
@@ -294,7 +295,8 @@
<div class="line-100 asset-line"></div>
<!------------------------------------------cabinet---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.cabinet')" class="right-box-form-content">
<el-select v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"
<!-- <el-select v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"-->
<el-select v-model="assetData.cabinetId" clearable popper-class="asset-dropdown"
:disabled="assetData.idcId==''?true:false" size="mini" placeholder=""
@change="getSingleCabinetData">
<el-option
@@ -305,21 +307,21 @@
:value="item.id"
>
<span class="config-dropdown-label-txt">{{ item.name }}</span>
<div class="config-dropdown-label-icons">
<span class="config-dropdown-btn config-dropdown-btn-delete" :id="'asset-add-cabinet-op-del-'+item.id"
@click.stop="deleteData('cabinet',item.id)">
<i class="el-icon-delete"></i>
</span>
<cabinet-config-box placement="left" :post-cabinet="item" button-class="config-dropdown-btn" @after="getCabinetOptionData">
<i slot="optionZone" class="nz-icon nz-icon-edit"></i>
</cabinet-config-box>
</div>
<!-- <div class="config-dropdown-label-icons">-->
<!-- <span class="config-dropdown-btn config-dropdown-btn-delete" :id="'asset-add-cabinet-op-del-'+item.id"-->
<!-- @click.stop="deleteData('cabinet',item.id)">-->
<!-- <i class="el-icon-delete"></i>-->
<!-- </span>-->
<!-- <cabinet-config-box placement="left" :post-cabinet="item" button-class="config-dropdown-btn" @after="getCabinetOptionData">-->
<!-- <i slot="optionZone" class="nz-icon nz-icon-edit"></i>-->
<!-- </cabinet-config-box>-->
<!-- </div>-->
</el-option>
</el-select>
<div class="right-box-row-btn right-box-row-btn-small">
<cabinet-config-box placement="left" :post-cabinet="addCabinetData" @after="getCabinetOptionData"></cabinet-config-box>
</div>
<!-- <div class="right-box-row-btn right-box-row-btn-small">-->
<!-- <cabinet-config-box placement="left" :post-cabinet="addCabinetData" @after="getCabinetOptionData"></cabinet-config-box>-->
<!-- </div>-->
</el-form-item>
<el-form-item :label="this.$t('asset.createAssetTab.uSize')">
<span>{{cabinetSelectedData.uSize}}</span>

View File

@@ -297,7 +297,8 @@
<!------------------------------------------IDC---------------------------------------------->
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
<template v-if="!tabView">
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">
<!-- <el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" class="right-box-row-with-btn" placeholder="">-->
<el-select popper-class="asset-dropdown" size="mini" v-model="assetData.idcId" clearable @change="getSingleIDCData" placeholder="">
<el-option
:id="'asset-edit-idc-op-'+item.id"
v-for="item in IDCOptionData"
@@ -306,21 +307,21 @@
:value="item.id"
>
<span class="config-dropdown-label-txt">{{ item.name }}</span>
<div class="config-dropdown-label-icons">
<span class="config-dropdown-btn config-dropdown-btn-delete"
@click.stop="deleteData('idc',item.id)" :id="'asset-edit-idc-op-del-'+item.id"><i
class="el-icon-delete"></i></span>
<idc-config-box :post-idc="popIdcData" placement="left" @after="getIDCOptionData" :button-class="'config-dropdown-btn'">
<template v-slot:optionZone>
<i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit', item)"></i>
</template>
</idc-config-box>
</div>
<!-- <div class="config-dropdown-label-icons">-->
<!-- <span class="config-dropdown-btn config-dropdown-btn-delete"-->
<!-- @click.stop="deleteData('idc',item.id)" :id="'asset-edit-idc-op-del-'+item.id"><i-->
<!-- class="el-icon-delete"></i></span>-->
<!-- <idc-config-box :post-idc="popIdcData" placement="left" @after="getIDCOptionData" :button-class="'config-dropdown-btn'">-->
<!-- <template v-slot:optionZone>-->
<!-- <i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit', item)"></i>-->
<!-- </template>-->
<!-- </idc-config-box>-->
<!-- </div>-->
</el-option>
</el-select>
<div class="right-box-row-btn right-box-row-btn-small">
<idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>
</div>
<!-- <div class="right-box-row-btn right-box-row-btn-small">-->
<!-- <idc-config-box placement="left" @after="getIDCOptionData"></idc-config-box>-->
<!-- </div>-->
</template>
<span v-if="tabView">{{assetViewData.idcName}}</span>
</el-form-item>
@@ -339,7 +340,8 @@
<!------------------------------------------cabinet---------------------------------------------->
<el-form-item :label="$t('asset.createAssetTab.cabinet')" class="right-box-form-content">
<template v-if="!tabView">
<el-select clearable v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"
<!-- <el-select clearable v-model="assetData.cabinetId" clearable class="right-box-row-with-btn" popper-class="asset-dropdown"-->
<el-select clearable v-model="assetData.cabinetId" clearable popper-class="asset-dropdown"
:disabled="assetData.idcId==''?true:false" size="mini" placeholder=""
@change="getSingleCabinetData">
<el-option
@@ -350,21 +352,21 @@
:value="item.id"
>
<span class="config-dropdown-label-txt">{{ item.name }}</span>
<div class="config-dropdown-label-icons">
<span class="config-dropdown-btn config-dropdown-btn-delete"
@click.stop="deleteData('cabinet',item.id)" :id="'asset-edit-cabinet-op-del-'+item.id">
<i class="el-icon-delete"></i>
</span>
<cabinet-config-box placement="left" :post-cabinet="item" button-class="config-dropdown-btn" @after="getCabinetOptionData">
<i slot="optionZone" class="nz-icon nz-icon-edit"></i>
</cabinet-config-box>
</div>
<!-- <div class="config-dropdown-label-icons">-->
<!-- <span class="config-dropdown-btn config-dropdown-btn-delete"-->
<!-- @click.stop="deleteData('cabinet',item.id)" :id="'asset-edit-cabinet-op-del-'+item.id">-->
<!-- <i class="el-icon-delete"></i>-->
<!-- </span>-->
<!-- <cabinet-config-box placement="left" :post-cabinet="item" button-class="config-dropdown-btn" @after="getCabinetOptionData">-->
<!-- <i slot="optionZone" class="nz-icon nz-icon-edit"></i>-->
<!-- </cabinet-config-box>-->
<!-- </div>-->
</el-option>
</el-select>
<div class="right-box-row-btn right-box-row-btn-small">
<cabinet-config-box placement="left" :post-cabinet="addCabinetData" @after="getCabinetOptionData"></cabinet-config-box>
</div>
<!-- <div class="right-box-row-btn right-box-row-btn-small">-->
<!-- <cabinet-config-box placement="left" :post-cabinet="addCabinetData" @after="getCabinetOptionData"></cabinet-config-box>-->
<!-- </div>-->
</template>
<span v-if="tabView">{{assetViewData.cabinetName}}</span>
</el-form-item>

View File

@@ -0,0 +1,124 @@
<template>
<div>
<el-dialog :title="$t('overall.changePwd')" :visible.sync="visible" @open="dialogOpened" :modal-append-to-body='false' @closed="dialogClosed" width="600px" :show-close="false" >
<el-form :model="user" label-position="right" label-width="135px" :rules="rules" ref="changePwdForm" size="mini">
<el-form-item :label="$t('config.account.account')" prop="username">
<el-input type="text" autocomplete="false" v-model="user.username" disabled></el-input>
</el-form-item>
<el-form-item :label="$t('config.account.oldPwd')" prop="pwd">
<el-input type="password" autocomplete="false" :show-password="true" v-model="user.pwd" maxlength="20" :placeholder="$t('config.account.inputOldPwd')"></el-input>
</el-form-item>
<el-form-item :label="$t('config.account.newPwd')" prop="newPwd">
<el-input type="password" autocomplete="false" :show-password="true" v-model="user.newPwd" maxlength="20" :placeholder="$t('config.account.inputNewPwd')"></el-input>
</el-form-item>
<el-form-item :label="$t('config.account.confirmPwd')" prop="confirmPwd">
<el-input type="password" autocomplete="false" :show-password="true" v-model="user.confirmPwd" maxlength="20" :placeholder="$t('config.account.inputConfirmPwd')"></el-input>
</el-form-item>
</el-form>
<!--底部按钮-->
<template slot="footer">
<div class="right-box-bottom-btns" >
<button @click="close" id="account-esc"
class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click="changePwd" id="account-save"
class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>
</template>
</el-dialog>
</div>
</template>
<script>
export default {
name: "changePwd",
props:{
curUser:{type:String},
showDialog:{type:Boolean,default:false}
},
data(){
let temp=this;
var validatePass = (rule, value, callback) => {
if(value && value != '' && value.length >= 6){
callback();
}else{
callback(new Error(temp.$t('config.account.invalidPwd')))
}
};
var validateConfirmPass=(rule,value,callback) => {
if(value && value != '' && value == temp.user.newPwd){
callback();
}else{
callback(new Error(temp.$t('config.account.confirmPwdErr')))
}
}
return {
user:{
username:'',
pwd:'',
newPwd:'',
confirmPwd:''
},
rules:{
pwd:[{required:true,message: this.$t('validate.required'), trigger: 'blur'}],
newPwd:[{required:true,message: this.$t('validate.required'), trigger: 'blur'},{validator:validatePass,trigger: 'blur'}],
confirmPwd:[{required:true,message: this.$t('config.account.reinputPwd'), trigger: 'blur'},{validator:validateConfirmPass,trigger: 'blur'}]
},
visible:false,
}
},
created() {
this.user.username=this.curUser && this.curUser != ''?this.curUser:sessionStorage.getItem("nz-username");
},
methods:{
dialogOpened:function(){
if(this.$refs.changePwdForm){
this.$refs.changePwdForm.resetFields();
}
},
dialogClosed:function(){
this.$emit('dialogClosed')
},
close:function(){
this.visible=false;
},
changePwd:function(){
this.$refs.changePwdForm.validate((valid)=>{
if(valid){
let paramObj={
password:this.user.pwd,
newPassword:this.user.newPwd
}
this.$get('/sys/user/password?password='+paramObj.password+"&newPassword="+paramObj.newPassword).then(response=>{
if(response && response.code == 200){
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.close();
}else{
this.$message.error(response.msg);
}
})
}
})
}
},
watch:{
showDialog:function(n,o){
this.visible=n;
}
}
}
</script>
<style >
.el-dialog__footer {
margin-top: 30px;
padding: 10px 20px 20px;
text-align: right;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
</style>