Merge branch 'master' of gitlab.com:asacreative/redemption-point/new-frontend-customer-redemption-point
This commit is contained in:
commit
2836995c66
|
|
@ -95,7 +95,7 @@ class OtpPage extends React.Component{
|
|||
let data = {
|
||||
code : this.state.otpText,
|
||||
login_request_id : this.state.otpData.login_request_id
|
||||
}
|
||||
};
|
||||
console.log("data",data);
|
||||
this.setState({isLoading:true});
|
||||
// if(this.checkIsExpired){
|
||||
|
|
@ -105,19 +105,19 @@ class OtpPage extends React.Component{
|
|||
// },2000);
|
||||
// }
|
||||
// else{
|
||||
this.authStore.validateOtp(data).then(res=>{
|
||||
setTimeout(()=>{
|
||||
this.props.history.push(LINKS.DASHBOARD);
|
||||
this.setState({isLoading:false});
|
||||
},1000);
|
||||
}).catch(err=>{
|
||||
setTimeout(()=>{
|
||||
this.setState({isLoading:false,isOtpWrong:true});
|
||||
},2000);
|
||||
setTimeout(()=>{
|
||||
this.setState({isOtpWrong:false});
|
||||
},4000)
|
||||
});
|
||||
// this.authStore.validateOtp(data).then(res=>{
|
||||
// setTimeout(()=>{
|
||||
// this.props.history.push(LINKS.DASHBOARD);
|
||||
// this.setState({isLoading:false});
|
||||
// },1000);
|
||||
// }).catch(err=>{
|
||||
// setTimeout(()=>{
|
||||
// this.setState({isLoading:false,isOtpWrong:true});
|
||||
// },2000);
|
||||
// setTimeout(()=>{
|
||||
// this.setState({isOtpWrong:false});
|
||||
// },4000)
|
||||
// });
|
||||
// }
|
||||
|
||||
};
|
||||
|
|
@ -133,7 +133,7 @@ class OtpPage extends React.Component{
|
|||
ContentProps={{
|
||||
'aria-describedby': 'message-id',
|
||||
}}
|
||||
message={<span id="message-id">Wrong OTP code</span>}
|
||||
message={<span id="message-id">Kode OTP Salah</span>}
|
||||
/>
|
||||
<Snackbar
|
||||
anchorOrigin={{ vertical : 'top', horizontal: 'center' }}
|
||||
|
|
@ -142,7 +142,7 @@ class OtpPage extends React.Component{
|
|||
ContentProps={{
|
||||
'aria-describedby': 'message-id',
|
||||
}}
|
||||
message={<span id="message-id">Your OTP code has expired</span>}
|
||||
message={<span id="message-id">Kode OTP sudah tidak berlaku</span>}
|
||||
/>
|
||||
<Snackbar
|
||||
anchorOrigin={{ vertical : 'top', horizontal: 'center' }}
|
||||
|
|
@ -151,7 +151,7 @@ class OtpPage extends React.Component{
|
|||
ContentProps={{
|
||||
'aria-describedby': 'message-id',
|
||||
}}
|
||||
message={<span id="message-id">OTP Code Re-sended</span>}
|
||||
message={<span id="message-id">Kode OTP sudah di kirim ulang</span>}
|
||||
/>
|
||||
<Grid container spacing={0} className={classes.gridContainer}>
|
||||
<Grid item xs={12} className={classes.logoContainer}>
|
||||
|
|
@ -162,37 +162,48 @@ class OtpPage extends React.Component{
|
|||
<Grid item xs={12} sm={12} md={6} style={{paddingLeft : 50,paddingRight : 50}}>
|
||||
<Paper className={classes.formRegister}>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Input Your OTP Code
|
||||
</Typography>
|
||||
<Typography variant="subtitle2" gutterBottom>
|
||||
Still not received OTP Code? <a onClick={()=>this.resendCode()}>Resend Code</a>
|
||||
Masukkan Kode OTP Anda
|
||||
</Typography>
|
||||
{/*<Typography variant="subtitle2" gutterBottom>*/}
|
||||
{/*Still not received OTP Code? <a onClick={()=>this.resendCode()}>Resend Code</a>*/}
|
||||
{/*</Typography>*/}
|
||||
<Grid container justify="center" spacing={8}>
|
||||
{[0, 1, 2, 3, 4, 5].map(x => (
|
||||
<Grid item xs={1}>
|
||||
<Text onChange={event => {
|
||||
<Text
|
||||
onKeyDown={event => {
|
||||
if (event.keyCode === 8 && x > 0 && event.target.value.length === 0) {
|
||||
this.otp[x-1].focus();
|
||||
}
|
||||
}}
|
||||
onChange={event => {
|
||||
// console.log(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("")});
|
||||
}
|
||||
|
||||
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"/>
|
||||
}}
|
||||
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>
|
||||
<div style={{padding : 5,marginTop : 20}}>
|
||||
<Button onClick={() => this.login()} fullWidth variant="contained" style={{background:'#ffeb3b'}} disabled={this.state.otpText.length < 6}>
|
||||
{this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Sign In"}
|
||||
{this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Konfirmasi"}
|
||||
</Button>
|
||||
</div>
|
||||
</Paper>
|
||||
|
|
|
|||
|
|
@ -75,31 +75,32 @@ export default class RegisterCompletedComponent extends React.Component{
|
|||
<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
|
||||
Selamat Datang di BTN Point
|
||||
</Typography>
|
||||
<Typography style={{color : '#FFF'}} variant={"subtitle2"}>
|
||||
Sign in to get various voucher and items
|
||||
Daftar untuk mendapatkan berbagai macam manfaat dan keuntungan
|
||||
</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
|
||||
Pendaftaran Berhasil
|
||||
</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.
|
||||
Kami telah mengirim sebuah surat elektronik yang berisi tautan untuk konfirmasi pendaftaran ke email anda, harap menunggu 5 sampai 10 menit untuk surat sampai
|
||||
{/*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}}>
|
||||
{/*<div style={{padding : 5,marginTop : 20}}>*/}
|
||||
|
||||
<Link
|
||||
to={LINKS.LOGIN}>
|
||||
<Button fullWidth variant="contained" style={{background:'#ffeb3b'}}>
|
||||
Back to Login
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
{/*<Link*/}
|
||||
{/*to={LINKS.LOGIN}>*/}
|
||||
{/*<Button fullWidth variant="contained" style={{background:'#ffeb3b'}}>*/}
|
||||
{/*Back to Login*/}
|
||||
{/*</Button>*/}
|
||||
{/*</Link>*/}
|
||||
{/*</div>*/}
|
||||
</Paper>
|
||||
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -300,21 +300,21 @@ class RegisterPage extends React.Component {
|
|||
<Grid item xs={5}>
|
||||
<img src={require('../../../../assets/images/register_image_2.png')} width={"80%"} />
|
||||
<Typography style={{ color: '#FFF' }} variant={"h6"}>
|
||||
Redeem point, Get Your Item!
|
||||
Tukarkan point!
|
||||
</Typography>
|
||||
<Typography style={{ color: '#FFF' }} variant={"subtitle2"}>
|
||||
Get promo and benefits with BTN
|
||||
Dapatkan promo dan keuntungan dengan BTN
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Hidden>
|
||||
<Grid item xs={12} sm={12} md={7} style={{ paddingLeft: 50, paddingRight: 50 }}>
|
||||
<Paper className={classes.formRegister}>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Register Now
|
||||
</Typography>
|
||||
<Typography variant="subtitle2" gutterBottom>
|
||||
Already have an account? <Link to={"/login"} replace>Back to Login</Link>
|
||||
Daftar Sekarang
|
||||
</Typography>
|
||||
{/*<Typography variant="subtitle2" gutterBottom>*/}
|
||||
{/*Already have an account? <Link to={"/login"} replace>Back to Login</Link>*/}
|
||||
{/*</Typography>*/}
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'row'
|
||||
|
|
@ -323,7 +323,7 @@ class RegisterPage extends React.Component {
|
|||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||
<TextField
|
||||
id="name"
|
||||
label="Full name"
|
||||
label="Nama Lengkap"
|
||||
value={this.state.full_name}
|
||||
onChange={this.handleChange('full_name')}
|
||||
margin="normal"
|
||||
|
|
@ -335,7 +335,7 @@ class RegisterPage extends React.Component {
|
|||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||
<TextField
|
||||
id="phone"
|
||||
label="Phone Number"
|
||||
label="Nomer Telfon"
|
||||
value={this.state.phone_number}
|
||||
onChange={this.handleChange('phone_number')}
|
||||
margin="normal"
|
||||
|
|
@ -472,54 +472,54 @@ class RegisterPage extends React.Component {
|
|||
{/*/>*/}
|
||||
{/*</Grid>*/}
|
||||
|
||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||
<TextField
|
||||
id="password"
|
||||
label="Password"
|
||||
value={this.state.password}
|
||||
onChange={this.handleChange('password')}
|
||||
margin="normal"
|
||||
type={this.state.showPassword ? 'text' : 'password'}
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
InputProps={{
|
||||
endAdornment: (
|
||||
<InputAdornment position="end">
|
||||
<IconButton
|
||||
aria-label="Toggle password visibility"
|
||||
onClick={this.viewPassword}
|
||||
>
|
||||
{this.state.showPassword ? <VisibilityOff /> : <Visibility />}
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>
|
||||
<TextField
|
||||
id="confirmPassword"
|
||||
label="Re-type Password"
|
||||
value={this.state.confirmPassword}
|
||||
onChange={this.handleChange('confirmPassword')}
|
||||
margin="normal"
|
||||
type={this.state.showConfirmPassword ? 'text' : 'password'}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
InputProps={{
|
||||
endAdornment: (
|
||||
<InputAdornment position="end">
|
||||
<IconButton
|
||||
aria-label="Toggle password visibility"
|
||||
onClick={this.viewConfirmPassword}
|
||||
>
|
||||
{this.state.showConfirmPassword ? <VisibilityOff style={{ color: this.state.password == '' ? this.state.confirmPassword == '' : this.state.password != this.state.confirmPassword ? 'red' : 'green' }} /> : <Visibility style={{ color: this.state.password == '' ? this.state.confirmPassword == '' : this.state.password != this.state.confirmPassword ? 'red' : 'green' }} />}
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
{/*<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>*/}
|
||||
{/*<TextField*/}
|
||||
{/*id="password"*/}
|
||||
{/*label="Password"*/}
|
||||
{/*value={this.state.password}*/}
|
||||
{/*onChange={this.handleChange('password')}*/}
|
||||
{/*margin="normal"*/}
|
||||
{/*type={this.state.showPassword ? 'text' : 'password'}*/}
|
||||
{/*variant="outlined"*/}
|
||||
{/*fullWidth*/}
|
||||
{/*InputProps={{*/}
|
||||
{/*endAdornment: (*/}
|
||||
{/*<InputAdornment position="end">*/}
|
||||
{/*<IconButton*/}
|
||||
{/*aria-label="Toggle password visibility"*/}
|
||||
{/*onClick={this.viewPassword}*/}
|
||||
{/*>*/}
|
||||
{/*{this.state.showPassword ? <VisibilityOff /> : <Visibility />}*/}
|
||||
{/*</IconButton>*/}
|
||||
{/*</InputAdornment>*/}
|
||||
{/*),*/}
|
||||
{/*}}*/}
|
||||
{/*/>*/}
|
||||
{/*</Grid>*/}
|
||||
{/*<Grid item xs={12} sm={12} md={6} style={{ paddingLeft: 5, paddingRight: 5 }}>*/}
|
||||
{/*<TextField*/}
|
||||
{/*id="confirmPassword"*/}
|
||||
{/*label="Re-type Password"*/}
|
||||
{/*value={this.state.confirmPassword}*/}
|
||||
{/*onChange={this.handleChange('confirmPassword')}*/}
|
||||
{/*margin="normal"*/}
|
||||
{/*type={this.state.showConfirmPassword ? 'text' : 'password'}*/}
|
||||
{/*fullWidth*/}
|
||||
{/*variant="outlined"*/}
|
||||
{/*InputProps={{*/}
|
||||
{/*endAdornment: (*/}
|
||||
{/*<InputAdornment position="end">*/}
|
||||
{/*<IconButton*/}
|
||||
{/*aria-label="Toggle password visibility"*/}
|
||||
{/*onClick={this.viewConfirmPassword}*/}
|
||||
{/*>*/}
|
||||
{/*{this.state.showConfirmPassword ? <VisibilityOff style={{ color: this.state.password == '' ? this.state.confirmPassword == '' : this.state.password != this.state.confirmPassword ? 'red' : 'green' }} /> : <Visibility style={{ color: this.state.password == '' ? this.state.confirmPassword == '' : this.state.password != this.state.confirmPassword ? 'red' : 'green' }} />}*/}
|
||||
{/*</IconButton>*/}
|
||||
{/*</InputAdornment>*/}
|
||||
{/*),*/}
|
||||
{/*}}*/}
|
||||
{/*/>*/}
|
||||
{/*</Grid>*/}
|
||||
</Grid>
|
||||
</div>
|
||||
|
||||
|
|
@ -546,7 +546,7 @@ class RegisterPage extends React.Component {
|
|||
<Button
|
||||
fullWidth
|
||||
variant="contained" style={{ backgroundColor: '#ffeb3b' }} onClick={this.register}>
|
||||
{this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Sign Up"}
|
||||
{this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Daftar"}
|
||||
</Button>
|
||||
</div>
|
||||
</Paper>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user