新增个人修改密码
This commit is contained in:
parent
770846f67b
commit
d05a266b85
|
@ -633,9 +633,10 @@ export const getVerify = (params) => {
|
||||||
export const getUserinfo= (params) => {
|
export const getUserinfo= (params) => {
|
||||||
return req('get', baseurl + "/auth/admin/userinfo",params)
|
return req('get', baseurl + "/auth/admin/userinfo",params)
|
||||||
}
|
}
|
||||||
|
//设置登录密码
|
||||||
|
export const putmodifySelf = (data) => {
|
||||||
|
return req('put', baseurl + "/auth/admin/setPassword",data)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-label {
|
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-label {
|
||||||
flex-basis: 110px!important;
|
flex-basis: 118px!important;
|
||||||
justify-content: flex-start!important;
|
justify-content: flex-start!important;
|
||||||
}
|
}
|
||||||
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-control-content{
|
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-control-content{
|
||||||
|
|
|
@ -0,0 +1,115 @@
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
|
import React, { Component } from 'react';
|
||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormStrategy,
|
||||||
|
Notify,
|
||||||
|
Validators,
|
||||||
|
FormInputField,
|
||||||
|
Button,
|
||||||
|
Icon
|
||||||
|
} from 'zent';
|
||||||
|
import {putmodifySelf,handelResponse} from "../../assets/api.js"
|
||||||
|
import "../../assets/comm.css"
|
||||||
|
import './modifySelf.less'
|
||||||
|
import _ from "lodash"
|
||||||
|
function equalsPassword(value, ctx) {
|
||||||
|
if (value !== ctx.getSectionValue('password').password) {
|
||||||
|
return {
|
||||||
|
name: 'passwordEqual',
|
||||||
|
message: '两次填写的密码不一致',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const Modifypwd=(props)=>{
|
||||||
|
const form = Form.useForm(FormStrategy.View);
|
||||||
|
const [pwdType, setPwdType] = React.useState('password')
|
||||||
|
const [repwdType, setRePwdType] = React.useState('password')
|
||||||
|
|
||||||
|
const onSubmit = React.useCallback(form => {
|
||||||
|
const value = form.getValue();
|
||||||
|
if(value){
|
||||||
|
let data=_.cloneDeep(value);
|
||||||
|
let parmas={
|
||||||
|
password:data.password
|
||||||
|
}
|
||||||
|
putmodifySelf(parmas).then(res=>{
|
||||||
|
handelResponse(res,(response,msg)=>{
|
||||||
|
Notify.clear();
|
||||||
|
Notify.success(msg);
|
||||||
|
setTimeout(()=>{
|
||||||
|
window.location.href='/login';
|
||||||
|
sessionStorage.clear();
|
||||||
|
},2000);
|
||||||
|
},err=>{
|
||||||
|
Notify.clear();
|
||||||
|
Notify.error(res.data.message);
|
||||||
|
});
|
||||||
|
}).catch(err=>{
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
const cancelFn=()=>{
|
||||||
|
props.visibleShow(false);
|
||||||
|
}
|
||||||
|
const changepwdType=()=>{
|
||||||
|
if(pwdType=='password'){
|
||||||
|
setPwdType('text');
|
||||||
|
}else{
|
||||||
|
setPwdType('password');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const rechangepwdType=()=>{
|
||||||
|
if(repwdType=='password'){
|
||||||
|
setRePwdType('text');
|
||||||
|
}else{
|
||||||
|
setRePwdType('password');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Form
|
||||||
|
form={form}
|
||||||
|
layout="horizontal"
|
||||||
|
scrollToError
|
||||||
|
onSubmit={onSubmit}
|
||||||
|
>
|
||||||
|
<FormInputField
|
||||||
|
name="password"
|
||||||
|
label="新密码"
|
||||||
|
className="selfpwd"
|
||||||
|
required
|
||||||
|
after={<Icon type={pwdType=='password'?'eye-o':'closed-eye'} onClick={changepwdType}/>}
|
||||||
|
helpDesc=''
|
||||||
|
validators={[
|
||||||
|
Validators.required('请输入新密码'),
|
||||||
|
Validators.pattern(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/, '6-16位字符,数字+字母组成,(字母区分大小写)'),
|
||||||
|
]}
|
||||||
|
notice="6-16位字符,数字+字母组成,字母(区分大小写)"
|
||||||
|
props={{
|
||||||
|
type: pwdType=='password'?'password':'text',maxLength:16,autoComplete:'new-password'
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<FormInputField
|
||||||
|
name="old_password"
|
||||||
|
label="再次输入新密码"
|
||||||
|
required
|
||||||
|
className="selfpwd"
|
||||||
|
notice="必须与新密码输入一致"
|
||||||
|
after={<Icon type={repwdType=='password'?'eye-o':'closed-eye'} onClick={rechangepwdType}/>}
|
||||||
|
validators={[ Validators.required('请确认密码'),equalsPassword]}
|
||||||
|
props={{
|
||||||
|
type:repwdType=='password'?'password':'text',maxLength:16,autoComplete:'new-password'
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<p className="dflexajce">
|
||||||
|
<Button type="primary" htmlType="submit">确定</Button>,
|
||||||
|
<Button onClick={cancelFn} >取消</Button>
|
||||||
|
</p>
|
||||||
|
</Form>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
export default Modifypwd;
|
|
@ -18,9 +18,12 @@ import {
|
||||||
Avatar,
|
Avatar,
|
||||||
Pop,
|
Pop,
|
||||||
Sweetalert,
|
Sweetalert,
|
||||||
|
Dialog,
|
||||||
Icon,
|
Icon,
|
||||||
Notify
|
Notify,
|
||||||
|
Button
|
||||||
} from 'zent';
|
} from 'zent';
|
||||||
|
import ModifySelfpwd from './ModifySelfpwd'
|
||||||
import extension from '../extension/main/main';
|
import extension from '../extension/main/main';
|
||||||
import overview from '../overview/main/main';
|
import overview from '../overview/main/main';
|
||||||
import newplan from '../newplan/main';
|
import newplan from '../newplan/main';
|
||||||
|
@ -82,6 +85,7 @@ export default class App extends Component {
|
||||||
|
|
||||||
}
|
}
|
||||||
state = {
|
state = {
|
||||||
|
visible:false,
|
||||||
isShowSub:true,
|
isShowSub:true,
|
||||||
noShowSubMenu:["/home/extension","/home/overview","/home/plan-create","/home/mytempMould","/home/edittemplate"],
|
noShowSubMenu:["/home/extension","/home/overview","/home/plan-create","/home/mytempMould","/home/edittemplate"],
|
||||||
pathname:'',
|
pathname:'',
|
||||||
|
@ -163,6 +167,15 @@ export default class App extends Component {
|
||||||
})
|
})
|
||||||
}).catch(err=>{
|
}).catch(err=>{
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
//修改密码
|
||||||
|
modifyFn(){
|
||||||
|
this.setState({visible:true});
|
||||||
|
|
||||||
|
}
|
||||||
|
//修改密码
|
||||||
|
modifyPwdFn(){
|
||||||
|
|
||||||
}
|
}
|
||||||
//退出登录
|
//退出登录
|
||||||
exitFn(){
|
exitFn(){
|
||||||
|
@ -193,7 +206,9 @@ export default class App extends Component {
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
setVisible = visible => {
|
||||||
|
this.setState({ visible });
|
||||||
|
};
|
||||||
componentWillMount(e){
|
componentWillMount(e){
|
||||||
let activeMenuList=JSON.parse(sessionStorage.getItem('activeMenu'));
|
let activeMenuList=JSON.parse(sessionStorage.getItem('activeMenu'));
|
||||||
this.setState({'navlist':activeMenuList});
|
this.setState({'navlist':activeMenuList});
|
||||||
|
@ -298,13 +313,28 @@ export default class App extends Component {
|
||||||
|
|
||||||
</p>
|
</p>
|
||||||
</p>
|
</p>
|
||||||
<p onClick={()=>{this.exitFn()}} className="exit-btn">退出</p>
|
<p className="dflexaj">
|
||||||
|
<span onClick={()=>{this.exitFn()}} className="exit-btn">退出</span>
|
||||||
|
<span onClick={()=>{this.modifyFn()}} className="modify-btn">修改密码</span>
|
||||||
|
</p>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>}>
|
</div>}>
|
||||||
{/* */}
|
{/* */}
|
||||||
<div className="nameItem">{this.state.userInfo.real_name} <Icon type="down" className="exitIcon" /></div>
|
<div className="nameItem">{this.state.userInfo.real_name} <Icon type="down" className="exitIcon" /></div>
|
||||||
</Pop>
|
</Pop>
|
||||||
</div>
|
</div>
|
||||||
|
<Dialog
|
||||||
|
visible={this.state.visible}
|
||||||
|
className="questModal"
|
||||||
|
onClose={() => this.setVisible(false)}
|
||||||
|
title="修改密码"
|
||||||
|
>
|
||||||
|
<ModifySelfpwd visibleShow={(visible)=>this.setVisible(visible) }/>
|
||||||
|
<div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</Dialog>
|
||||||
<aside className="mainbody" >
|
<aside className="mainbody" >
|
||||||
|
|
||||||
{
|
{
|
||||||
|
|
|
@ -86,7 +86,8 @@
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
}
|
}
|
||||||
.exit-btn{
|
.exit-btn,.modify-btn{
|
||||||
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding:10px;
|
padding:10px;
|
||||||
|
@ -95,6 +96,12 @@
|
||||||
color: #939599;
|
color: #939599;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.exit-btn:hover,.modify-btn:hover{
|
||||||
|
color: #296bef;
|
||||||
|
}
|
||||||
|
.modify-btn{
|
||||||
|
border-left: 1px solid #e0e0e0;
|
||||||
|
}
|
||||||
.userImg{
|
.userImg{
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,7 @@
|
||||||
|
.selfpwd{
|
||||||
|
.zenticon{
|
||||||
|
font-size: 22px;
|
||||||
|
line-height: 32px!important;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-label {
|
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-label {
|
||||||
flex-basis: 110px!important;
|
flex-basis: 118px!important;
|
||||||
justify-content: flex-start!important;
|
justify-content: flex-start!important;
|
||||||
}
|
}
|
||||||
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-control-content{
|
.zent-form-horizontal[data-zv="9.11.0"] .zent-form-control-content{
|
||||||
|
|
|
@ -36,7 +36,6 @@ const Modifypwd=(props)=>{
|
||||||
},err=>{
|
},err=>{
|
||||||
Notify.clear();
|
Notify.clear();
|
||||||
Notify.error(res.data.message);
|
Notify.error(res.data.message);
|
||||||
return false;
|
|
||||||
});
|
});
|
||||||
}).catch(err=>{
|
}).catch(err=>{
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue