修改登录密码
This commit is contained in:
78
src/pages/lgpwd/index.tsx
Normal file
78
src/pages/lgpwd/index.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
/**
|
||||
* Title: 邀请新人
|
||||
* Routes:
|
||||
* - ./src/pages/routes
|
||||
*/
|
||||
import React, { useEffect } from 'react';
|
||||
import { connect, DispatchProp } from 'dva';
|
||||
import { Button, Input } from 'antd';
|
||||
import { formatMessage } from 'umi-plugin-locale';
|
||||
import { LgpwdModelState } from './model';
|
||||
import Header from '@/components/Header';
|
||||
|
||||
import styles from './style.less';
|
||||
import { UserModelState } from '@/models/user';
|
||||
|
||||
const LgpwdPage: React.FC<DispatchProp & LgpwdModelState & UserModelState> = ({
|
||||
dispatch,
|
||||
origin,
|
||||
newPwd,
|
||||
confirm,
|
||||
submitting,
|
||||
}) => {
|
||||
useEffect(() => {
|
||||
dispatch({ type: 'lgpwd/load' });
|
||||
}, []);
|
||||
let body = (
|
||||
<>
|
||||
<Input
|
||||
className={styles.input}
|
||||
value={origin}
|
||||
onChange={e => dispatch({ type: 'lgpwd/onUpdateState', origin: e.target.value })}
|
||||
placeholder={formatMessage({ id: 'lgpwd.origin' })}
|
||||
type="password"
|
||||
size="large"
|
||||
/>
|
||||
<Input
|
||||
className={styles.input}
|
||||
value={newPwd}
|
||||
onChange={e => dispatch({ type: 'lgpwd/onUpdateState', newPwd: e.target.value })}
|
||||
placeholder={formatMessage({ id: 'lgpwd.new' })}
|
||||
type="password"
|
||||
size="large"
|
||||
/>
|
||||
<Input
|
||||
className={styles.input}
|
||||
value={confirm}
|
||||
onChange={e => dispatch({ type: 'lgpwd/onUpdateState', confirm: e.target.value })}
|
||||
placeholder={formatMessage({ id: 'lgpwd.confirm' })}
|
||||
type="password"
|
||||
size="large"
|
||||
/>
|
||||
<Button
|
||||
className={styles.input}
|
||||
type="primary"
|
||||
size="large"
|
||||
loading={submitting}
|
||||
onClick={() => dispatch({ type: 'lgpwd/submit' })}
|
||||
>{formatMessage({ id: 'lgpwd.btn' })}</Button>
|
||||
</>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<Header
|
||||
className="header"
|
||||
title={formatMessage({ id: 'lgpwd.title' })}
|
||||
/>
|
||||
|
||||
<div className={styles.body}>
|
||||
{body}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default connect(
|
||||
({ lgpwd }: any) => ({ ...lgpwd }),
|
||||
)(LgpwdPage);
|
||||
72
src/pages/lgpwd/model.ts
Normal file
72
src/pages/lgpwd/model.ts
Normal file
@@ -0,0 +1,72 @@
|
||||
import { Model, routerRedux } from "dva";
|
||||
import _ from 'lodash';
|
||||
import { PageState } from '@/types/common';
|
||||
import { message } from 'antd';
|
||||
import { formatMessage } from 'umi-plugin-locale';
|
||||
import { validPwd } from '@/utils/validate';
|
||||
import { changeLgpwd } from './service';
|
||||
|
||||
export interface LgpwdModelState {
|
||||
origin: string;
|
||||
newPwd: string;
|
||||
confirm: string;
|
||||
submitting: boolean;
|
||||
}
|
||||
|
||||
const initState: LgpwdModelState = {
|
||||
origin: '',
|
||||
newPwd: '',
|
||||
confirm: '',
|
||||
submitting: false,
|
||||
};
|
||||
|
||||
const model: Model = {
|
||||
namespace: 'lgpwd',
|
||||
|
||||
state: initState,
|
||||
|
||||
effects: {
|
||||
*load(_, { put, call }) {
|
||||
yield put({
|
||||
type: 'onUpdateState',
|
||||
origin: '',
|
||||
newPwd: '',
|
||||
confirm: '',
|
||||
submitting: false,
|
||||
});
|
||||
},
|
||||
|
||||
*submit(_, { put, call, select }) {
|
||||
const {
|
||||
origin,
|
||||
newPwd,
|
||||
confirm,
|
||||
submitting,
|
||||
} = (yield select((state: any) => state.lgpwd)) as LgpwdModelState;
|
||||
if (submitting) return;
|
||||
if (!validPwd(newPwd)) return message.warn(formatMessage({ id: 'check.msgPwd' }));
|
||||
if (confirm !== newPwd) return message.warn(formatMessage({ id: 'check.msgConfirm' }));
|
||||
yield put({ type: 'onUpdateState', submitting: true });
|
||||
try {
|
||||
yield call(changeLgpwd, newPwd, origin);
|
||||
yield put(routerRedux.goBack());
|
||||
message.success(formatMessage({ id: 'lgpwd.success' }));
|
||||
} catch (e) {
|
||||
message.error(e.message);
|
||||
} finally {
|
||||
yield put({ type: 'onUpdateState', submitting: false })
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
reducers: {
|
||||
onUpdateState(state, payload) {
|
||||
return {
|
||||
...state,
|
||||
...payload,
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export default model;
|
||||
10
src/pages/lgpwd/service.ts
Normal file
10
src/pages/lgpwd/service.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import http from '@/utils/http';
|
||||
|
||||
export async function changeLgpwd(newPassword: string, password?: string) {
|
||||
const { ok, msg } = await http.post('/user/chpasswd', {
|
||||
password,
|
||||
newPassword,
|
||||
});
|
||||
if (ok) return;
|
||||
throw Error(msg);
|
||||
}
|
||||
30
src/pages/lgpwd/style.less
Normal file
30
src/pages/lgpwd/style.less
Normal file
@@ -0,0 +1,30 @@
|
||||
|
||||
@import '../../global.less';
|
||||
|
||||
.container {
|
||||
height: 100%;
|
||||
background: white;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.body {
|
||||
flex-grow: 1;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.none {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
padding-top: 40%;
|
||||
}
|
||||
|
||||
.input {
|
||||
margin: 10px 20px;
|
||||
width: auto;
|
||||
}
|
||||
Reference in New Issue
Block a user