fix: register flow
This commit is contained in:
Hasta Ragil Saputra
parent
2087b2d567
commit
8935bca9b0
|
|
@ -68,12 +68,12 @@ export default class ComponentName extends React.Component {
|
|||
.authStore
|
||||
.register(value)
|
||||
.then(res => {
|
||||
notification.open({
|
||||
message: 'Register Success',
|
||||
description: 'Please check your email to continue'
|
||||
});
|
||||
// notification.open({
|
||||
// message: 'Register Success',
|
||||
// description: 'Please check your email to continue'
|
||||
// });
|
||||
this.props.history.push({
|
||||
pathname:LINKS.LOGIN
|
||||
pathname:LINKS.REGISTER_COMPLETED
|
||||
});
|
||||
this.setState({isLoading: false, isSuccess: true})
|
||||
// this
|
||||
|
|
|
|||
112
src/common/pages/RegisterCompleted/index.js
Normal file
112
src/common/pages/RegisterCompleted/index.js
Normal file
|
|
@ -0,0 +1,112 @@
|
|||
import React from 'react';
|
||||
import withStyles from "@material-ui/core/styles/withStyles";
|
||||
import {styles} from '../Register/registerStyle';
|
||||
import {notification} from 'antd';
|
||||
|
||||
import Grid from '@material-ui/core/Grid';
|
||||
import Paper from '@material-ui/core/Paper';
|
||||
import Typography from '@material-ui/core/Typography';
|
||||
import TextField from '@material-ui/core/TextField';
|
||||
import Visibility from '@material-ui/icons/Visibility';
|
||||
import VisibilityOff from '@material-ui/icons/VisibilityOff';
|
||||
import Button from '@material-ui/core/Button';
|
||||
import Hidden from '@material-ui/core/Hidden';
|
||||
import Dialog from '@material-ui/core/Dialog';
|
||||
import DialogActions from '@material-ui/core/DialogActions';
|
||||
import DialogContent from '@material-ui/core/DialogContent';
|
||||
import DialogContentText from '@material-ui/core/DialogContentText';
|
||||
import DialogTitle from '@material-ui/core/DialogTitle';
|
||||
import InputAdornment from '@material-ui/core/InputAdornment';
|
||||
import IconButton from '@material-ui/core/IconButton';
|
||||
import CircularProgress from '@material-ui/core/CircularProgress';
|
||||
import Snackbar from '@material-ui/core/Snackbar';
|
||||
|
||||
import { Link } from 'react-router-dom';
|
||||
import {inject, observer} from 'mobx-react';
|
||||
import {LINKS} from "../../routes";
|
||||
|
||||
@withStyles(styles)
|
||||
@inject('appstate')
|
||||
@observer
|
||||
export default class RegisterCompletedComponent extends React.Component{
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props = props;
|
||||
this.state = {
|
||||
email: "",
|
||||
password: "",
|
||||
showPassword : false,
|
||||
isLoading: false,
|
||||
loginFailed: false,
|
||||
isNeedEmailVerification: false,
|
||||
};
|
||||
this.defaultState = Object.assign({}, this.state);
|
||||
this.authStore = props.appstate.auth;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
||||
}
|
||||
|
||||
handleChange = name => event => {
|
||||
this.setState({
|
||||
[name]: event.target.value,
|
||||
});
|
||||
};
|
||||
|
||||
viewPassword = ()=>{
|
||||
this.setState({
|
||||
showPassword : !this.state.showPassword
|
||||
})
|
||||
};
|
||||
|
||||
render(){
|
||||
const { classes } = this.props;
|
||||
return (
|
||||
<div className={classes.container}>
|
||||
<Grid container spacing={0} className={classes.gridContainer}>
|
||||
<Grid item xs={12} className={classes.logoContainer}>
|
||||
<img src={require('../../../../assets/images/login/logo_new.png')} className={classes.logo} />
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={12} md={10} lg={6} className={classes.registerContainer}>
|
||||
<Grid container spacing={24} className={classes.registerPaper}>
|
||||
<Hidden smDown>
|
||||
<Grid item xs={6}>
|
||||
<img src={require('../../../../assets/images/login/register_image_2.png')} width={"80%"}/>
|
||||
<Typography style={{color : '#FFF'}} variant={"h6"}>
|
||||
Welcome to BTN Points
|
||||
</Typography>
|
||||
<Typography style={{color : '#FFF'}} variant={"subtitle2"}>
|
||||
Sign in to get various voucher and items
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Hidden>
|
||||
<Grid item xs={12} sm={12} md={6} style={{paddingLeft : 50,paddingRight : 50}}>
|
||||
<Paper className={classes.formRegister}>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Registration Completed
|
||||
</Typography>
|
||||
<Typography variant="body1" gutterBottom>
|
||||
We have sent an email with a confirmation link to your email address. Please allow 5-10 minutes for this message to arrive.
|
||||
</Typography>
|
||||
|
||||
<div style={{padding : 5,marginTop : 20}}>
|
||||
|
||||
<Link
|
||||
to={LINKS.LOGIN}>
|
||||
<Button fullWidth variant="contained" style={{background:'#ffeb3b'}}>
|
||||
Back to Login
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</Paper>
|
||||
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -139,6 +139,7 @@ class RegisterPage extends React.Component {
|
|||
}
|
||||
|
||||
this.setState({ isLoading: true });
|
||||
|
||||
let data = {
|
||||
fullname: this.state.full_name,
|
||||
email: this.state.email,
|
||||
|
|
@ -157,10 +158,14 @@ class RegisterPage extends React.Component {
|
|||
additional_data: {}
|
||||
};
|
||||
this.authStore.register(data).then(res => {
|
||||
message.success("Please check your email to confirm your account");
|
||||
// message.success("Please check your email to confirm your account");
|
||||
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
this.setState({ isLoading: false });
|
||||
this.props.history.push(LINKS.LOGIN);
|
||||
this.props.history.push(LINKS.REGISTER_COMPLETED);
|
||||
// this.props.history.push(LINKS.LOGIN);
|
||||
}, 250);
|
||||
}).catch(err => {
|
||||
this.setState({ isLoading: false });
|
||||
|
|
@ -214,11 +219,11 @@ class RegisterPage extends React.Component {
|
|||
name: 'file',
|
||||
multiple: false,
|
||||
action: appConfig.apiUrl + 'upload',
|
||||
customRequest: ({file, onProgress}) => {
|
||||
customRequest: ({file, onProgress, onSuccess}) => {
|
||||
this.setState({
|
||||
uploading: true
|
||||
});
|
||||
return this.http.upload(file)
|
||||
this.http.upload(file)
|
||||
.then(res => {
|
||||
this.setState({
|
||||
[`upload_${key}`]: appConfig.apiUrl + res.path.slice(1,res.path.length)
|
||||
|
|
@ -236,7 +241,7 @@ class RegisterPage extends React.Component {
|
|||
|
||||
fileList[selectedIndex].status = "done";
|
||||
fileList[selectedIndex].path = res.path;
|
||||
|
||||
onSuccess(fileList[selectedIndex]);
|
||||
// form.setFieldsValue({path: res.path});
|
||||
|
||||
this.setState({
|
||||
|
|
@ -245,6 +250,10 @@ class RegisterPage extends React.Component {
|
|||
[`fileList_${key}`]: [fileList[selectedIndex]]
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
abort: () => {}
|
||||
}
|
||||
},
|
||||
fileList: this.state[`fileList_${key}`],
|
||||
onChange: (info) => this.uploadOnChange(key, info),
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ import InviteConfirmationComponent from './pages/InviteConfirmation';
|
|||
import InviteConfirmationLoginComponent from './pages/InviteConfirmationLogin/index';
|
||||
import AcceptInvite from "./pages/AcceptInvite/index";
|
||||
import OtpPage from "./pages/Otp";
|
||||
import RegisterCompletedComponent from "./pages/RegisterCompleted";
|
||||
|
||||
export const LINKS = {
|
||||
ROOT: '/',
|
||||
|
|
@ -78,6 +79,7 @@ export const LINKS = {
|
|||
ORDER_DETAIL_AIRLINES: '/app/order_detail_airline/:id',
|
||||
ORDER_DETAIL_AIRLINES_WO_ID: '/app/order_detail_airline',
|
||||
REGISTER: '/register',
|
||||
REGISTER_COMPLETED: '/register_completed',
|
||||
LOGIN: '/login',
|
||||
FORGOT_PASSWORD: '/forgot_password',
|
||||
ACCEPT_INVITE: '/register_store',
|
||||
|
|
@ -159,6 +161,7 @@ export default class Routes extends React.Component {
|
|||
pathname: this.authStore.isLoggedIn ? LINKS.DASHBOARD : LINKS.LOGIN
|
||||
}}/>)}/>
|
||||
<Route exact path={LINKS.REGISTER} component={RegisterComponent}/>
|
||||
<Route exact path={LINKS.REGISTER_COMPLETED} component={RegisterCompletedComponent}/>
|
||||
<Route exact path={LINKS.LOGIN} component={LoginBTNComponent}/>
|
||||
<Route exact path={LINKS.OTP} component={OtpPage}/>
|
||||
<Route exact path={LINKS.FORGOT_PASSWORD} component={ForgotPasswordComponent}/>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user