feat: fix otp

This commit is contained in:
ahmadzuhdi 2019-01-31 21:57:08 +07:00
parent 67bbcba5e2
commit 12e7f13c1a
2 changed files with 26 additions and 20 deletions

View File

@ -54,7 +54,7 @@ class OtpPage extends React.Component{
} }
componentDidMount(){ componentDidMount(){
this.otp[0].focus(); setTimeout(() => this.otp[0].focus(), 500);
if(this.urlParams.has('login_request_id') && this.urlParams.has('expired_at')) { if(this.urlParams.has('login_request_id') && this.urlParams.has('expired_at')) {
console.log(this.urlParams); console.log(this.urlParams);
this.setState({ this.setState({
@ -159,17 +159,6 @@ class OtpPage extends React.Component{
</Grid> </Grid>
<Grid item xs={12} sm={12} md={10} lg={6} className={classes.registerContainer}> <Grid item xs={12} sm={12} md={10} lg={6} className={classes.registerContainer}>
<Grid container spacing={24} className={classes.registerPaper}> <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}}> <Grid item xs={12} sm={12} md={6} style={{paddingLeft : 50,paddingRight : 50}}>
<Paper className={classes.formRegister}> <Paper className={classes.formRegister}>
<Typography variant="h6" gutterBottom> <Typography variant="h6" gutterBottom>
@ -181,7 +170,23 @@ class OtpPage extends React.Component{
<Grid container justify="center" spacing={8}> <Grid container justify="center" spacing={8}>
{[0, 1, 2, 3, 4, 5].map(x => ( {[0, 1, 2, 3, 4, 5].map(x => (
<Grid item xs={1}> <Grid item xs={1}>
<Text onChange={event=>this.setState({otpText:this.state.otpText+event.target.value})} autoFocus={true} ref={(input) => { this.otp[x] = input; }} key={x} id={x} inputStyle={{textAlign:'center'}} style={{width:'100%'}} type="tel" maxLength="1"/> <Text onChange={event => {
if (event.target.value !== '') {
this.setState({otpText:this.state.otpText+event.target.value}, () => {
if (x < 5) {
this.otp[x+1].focus();
} else {
this.login();
}
});
} else {
const otpText = this.state.otpText.split("");
otpText[x] = "";
this.setState({otpText:otpText.join("")});
}
}} autoFocus={x === 0} ref={(input) => { this.otp[x] = input; }} key={x} id={x} inputStyle={{textAlign:'center'}} style={{width:'100%'}} type="tel" maxLength="1"/>
</Grid> </Grid>
))} ))}
</Grid> </Grid>

View File

@ -135,13 +135,14 @@ class RegisterPage extends React.Component {
if (this.state.password.length < 8) { if (this.state.password.length < 8) {
return message.warning("password need atleast 8 characters"); return message.warning("password need atleast 8 characters");
} }
// if (this.state.upload_photo === '') { // if (this.state.upload_photo === '') {
// return message.warning("please upload photo"); // return message.warning("please upload photo");
// } //}
// //
// if (this.state.upload_ktp === '') { //if (this.state.upload_ktp === '') {
// return message.warning("please upload ktp"); // return message.warning("please upload ktp");
// } //}
this.setState({ isLoading: true }); this.setState({ isLoading: true });