Commit 4ea328df authored by 前端-许佳敏's avatar 前端-许佳敏

新增忘记密码

parent c86a0aec
......@@ -33,6 +33,10 @@ const router = [
path: '/user/policy',
component: '@/pages/user/policy'
},
{
path: '/user/forget',
component: '@/pages/user/forgetPwd'
}
]
},
{
......
......@@ -19,6 +19,7 @@ setup()
const userLoginLists = [
'/user/login',
'/user/register',
'/user/forget'
]
// let routeAuthUrls: any[] = []
// 路由白名单
......@@ -106,10 +107,10 @@ export function render(oldRender: Function) {
export function onRouteChange({ routes, matchedRoutes, location, action }) {
console.log('onRouteChange')
if (isDev) {
// if (isDev) {
return;
}
// return;
// }
// 是否登录
if (getAuth()) {
......
import React, { useState, useEffect } from 'react'
import { Form, Steps, Button, Row, Col, Radio, Divider, Tooltip, Upload, message, Input as AntdInput } from 'antd'
import {
UploadOutlined,
QuestionCircleOutlined
} from '@ant-design/icons';
import styles from './index.less'
import './index.less'
import globalStyles from '@/global/styles/global.less'
import cx from 'classnames'
import { Link, history } from 'umi'
import im_success from '../../../mockStatic/im_success.png'
import { createFormActions, FormEffectHooks } from '@formily/antd';
import useCountDown from '@/utils/hooks';
import { GlobalConfig } from '@/global/config';
import { omit, transFormSchema } from '@/utils';
import { PATTERN_MAPS } from '@/constants/regExp';
import { PublicApi } from '@/services/api';
import NiceForm from '@/components/NiceForm';
import schemas from './schema';
const { onFieldValueChange$ } = FormEffectHooks
let formCache: any = {}
const CustomInput = props => {
const { help, ...restProps } = props
return (
<AntdInput
{...restProps}
addonAfter={help ? <Tooltip title={help}><QuestionCircleOutlined style={{color: '#6B778C', marginLeft: 5}}/></Tooltip> : undefined}
/>
)
}
// 检验联动
const useLinkageValidateEffects = () => {
const { setFieldState, getFieldState } = createFormActions()
onFieldValueChange$('*(password,confirmPassword)').subscribe(fieldState => {
const selfName = fieldState.name
const selfValue = fieldState.value
const otherName = selfName == 'password' ? 'confirmPassword' : 'password'
const otherValue = getFieldState(otherName, state => state.value)
setFieldState(otherName, state => {
if (selfValue && otherValue && selfValue !== otherValue) {
state.errors = ['两次密码输入不一致']
} else {
state.errors = ['']
}
})
setFieldState(selfName, state => {
if (selfValue && otherValue && selfValue !== otherValue) {
state.errors = ['两次密码输入不一致']
} else {
state.errors = ['']
}
})
})
}
let timeChange: any; // 定时器
const actions = createFormActions()
const UserForgetPwd = () => {
const [current, setCurrent] = useState(0)
const [subStep, setSubStep] = useState(false)
const stepList = [
{ title: '填写信息', key: 'message', name: 'message' },
{ title: '完善资料', key: 'over', name: 'over' },
{ title: '等待审核', key: 'wait', name: 'wait' },
{ title: '注册成功', key: 'success', name: 'success' },
]
const [time, setTime] = useState(5); // timer
// useEffect(() => {
// clearInterval(timeChange)
// handleRegisterTypeList()
// }, [])
const [asyncSchema, setAsyncSchema] = useState(() => {
return schemas[`schema${current}`]
})
useEffect(() => {
setAsyncSchema(schemas[`schema${current}`])
if(current === 2) runTimerJump()
}, [current, actions])
useEffect(() => {
if(time === 0){
clearInterval(timeChange)
setTime(60)
history.push('/user/login')
console.log('执行登录跳转!')
}
}, [time])
const runTimerJump = () => {
timeChange = setInterval(() => setTime(t => --t), 1000)
}
const normFile = (e: any) => {
if (Array.isArray(e)) {
return e;
}
return e && e.fileList;
}
const checkoutFile = (rule: any, value: any) => {
if(value && value.length){
let length = value.length
let obj = value[length-1]
const isLt5M = obj.size / 1024 / 1024 < 5;
if (isLt5M) {
return Promise.resolve();
}else{
return Promise.reject('附件大小不能超过5M!');
}
}else{
return Promise.reject();
}
}
const beforeUpload = (file: any) => {
const isLt5M = file.size / 1024 / 1024 < 5;
if (!isLt5M) {
message.error('附件大小不能超过5M!');
}
console.log(isLt5M)
return isLt5M;
}
const {text, isActive, start} = useCountDown({
maxTime: 60,
minTime: 0,
initText: '获取验证码',
onEnd: () => {},
decayRate: 1,
delay: 1 * 1000
})
const handleActionBtn = () => {
// 校验后触发跳转
actions.submit(data => {
actions.dispatch('onFormStepNext', {})
formCache = Object.assign({}, formCache, data)
}).then(() => {
setCurrent(current + 1)
})
}
const nextStepAction = () => {
actions.submit().then(data => {
const { values } = data
formCache = Object.assign({}, values, formCache)
const { businessTypeId, typeId } = values
PublicApi.getMemberMenuRegisterDetail({
businessTypeId,
memberTypeId: typeId
}).then(res => {
const { data } = res
// 动态渲染第三步
setAsyncSchema(transFormSchema(data))
setSubStep(true)
})
})
}
// @todo 注册成功后 交互功能未完成
const submitForm = () => {
actions.submit().then(data => {
const { values } = data
formCache = Object.assign({}, values, formCache)
// 写死传入的区号
formCache.countryCode = '+86'
const params = omit(formCache, ['isRead', 'confirmPassword'])
PublicApi.postMemberRegister(params).then(() => {
actions.dispatch('onFormStepNext', {})
setCurrent(current + 1)
})
})
}
return (
<div className={cx(styles.register, globalStyles.lingxiBusinessContent1024)}>
<h3>找回密码</h3>
<div className={cx(styles.registerBox, globalStyles.lingxiBusinessMarginContent)}>
<NiceForm
id='registerForm'
schema={asyncSchema}
actions={actions}
components={{
CustomInput
}}
effects={() => {
useLinkageValidateEffects()
}}
expressionScope={{
current: false,
phoneBefore: <div className={styles.formBefore}>+86</div>,
smsCodeAfter: <Button disabled={isActive} style={{minWidth: 110, marginLeft: 8}} size='large' onClick={start}>{text}</Button>,
checkBoxChildren: <span style={{fontSize: 12}}>阅读并同意<span className='commonPickColor'>《会员服务协议》《法律条款》《隐私政策》</span></span>,
memberTypeTitle: <span className={styles.commonPanelTitle}>请选择您的身份</span>,
businessTypeTitle: <span className={styles.commonPanelTitle}>请选择您要开展的业务</span>,
}}
/>
</div>
</div>
)
}
export default UserForgetPwd
\ No newline at end of file
......@@ -13,6 +13,11 @@
padding: 141px 0 102px;
}
.readyLogin {
text-align: center;
margin-top: 24px;
}
.loginMain {
position: relative;
background: @white;
......
......@@ -235,6 +235,7 @@ const UserRegistry = () => {
</p>
</div>
}
<p className={styles.readyLogin}>已有平台账号? <Link to="/user/login">去登陆</Link></p>
</div>
</div>
)
......
......@@ -162,6 +162,38 @@ export const registerStep1Schema: ISchema = {
}
}
// 忘记密码 TODO
export const forgetPwdSchema: ISchema = {
type: 'object',
properties: {
FORGET_PWD: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
className: 'registerForm',
full: true
},
properties: {
email: {
type: 'string',
"x-rules": [
{
pattern: PATTERN_MAPS.email,
message: '请输入正确的邮箱'
}
],
"x-component-props": {
placeholder: '请输入你的邮箱(选填)',
size: 'large',
type: 'email'
}
},
}
}
}
}
export default {
schema0: registerStep0Schema,
schema1: registerStep1Schema
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment