Merge branch 'master' of https://gitlab.com/asacreative/redemption-point/new-frontend-customer-redemption-point
This commit is contained in:
		
							
								
								
									
										20
									
								
								package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										20
									
								
								package-lock.json
									
									
									
										generated
									
									
									
								
							| @@ -7894,6 +7894,7 @@ | |||||||
|         "brace-expansion": { |         "brace-expansion": { | ||||||
|           "version": "1.1.11", |           "version": "1.1.11", | ||||||
|           "bundled": true, |           "bundled": true, | ||||||
|  |           "optional": true, | ||||||
|           "requires": { |           "requires": { | ||||||
|             "balanced-match": "^1.0.0", |             "balanced-match": "^1.0.0", | ||||||
|             "concat-map": "0.0.1" |             "concat-map": "0.0.1" | ||||||
| @@ -7905,15 +7906,18 @@ | |||||||
|         }, |         }, | ||||||
|         "code-point-at": { |         "code-point-at": { | ||||||
|           "version": "1.1.0", |           "version": "1.1.0", | ||||||
|           "bundled": true |           "bundled": true, | ||||||
|  |           "optional": true | ||||||
|         }, |         }, | ||||||
|         "concat-map": { |         "concat-map": { | ||||||
|           "version": "0.0.1", |           "version": "0.0.1", | ||||||
|           "bundled": true |           "bundled": true, | ||||||
|  |           "optional": true | ||||||
|         }, |         }, | ||||||
|         "console-control-strings": { |         "console-control-strings": { | ||||||
|           "version": "1.1.0", |           "version": "1.1.0", | ||||||
|           "bundled": true |           "bundled": true, | ||||||
|  |           "optional": true | ||||||
|         }, |         }, | ||||||
|         "core-util-is": { |         "core-util-is": { | ||||||
|           "version": "1.0.2", |           "version": "1.0.2", | ||||||
| @@ -8003,7 +8007,8 @@ | |||||||
|         }, |         }, | ||||||
|         "inherits": { |         "inherits": { | ||||||
|           "version": "2.0.3", |           "version": "2.0.3", | ||||||
|           "bundled": true |           "bundled": true, | ||||||
|  |           "optional": true | ||||||
|         }, |         }, | ||||||
|         "ini": { |         "ini": { | ||||||
|           "version": "1.3.5", |           "version": "1.3.5", | ||||||
| @@ -8012,6 +8017,7 @@ | |||||||
|         "is-fullwidth-code-point": { |         "is-fullwidth-code-point": { | ||||||
|           "version": "1.0.0", |           "version": "1.0.0", | ||||||
|           "bundled": true, |           "bundled": true, | ||||||
|  |           "optional": true, | ||||||
|           "requires": { |           "requires": { | ||||||
|             "number-is-nan": "^1.0.0" |             "number-is-nan": "^1.0.0" | ||||||
|           } |           } | ||||||
| @@ -8034,6 +8040,7 @@ | |||||||
|         "minipass": { |         "minipass": { | ||||||
|           "version": "2.3.5", |           "version": "2.3.5", | ||||||
|           "bundled": true, |           "bundled": true, | ||||||
|  |           "optional": true, | ||||||
|           "requires": { |           "requires": { | ||||||
|             "safe-buffer": "^5.1.2", |             "safe-buffer": "^5.1.2", | ||||||
|             "yallist": "^3.0.0" |             "yallist": "^3.0.0" | ||||||
| @@ -8120,7 +8127,8 @@ | |||||||
|         }, |         }, | ||||||
|         "number-is-nan": { |         "number-is-nan": { | ||||||
|           "version": "1.0.1", |           "version": "1.0.1", | ||||||
|           "bundled": true |           "bundled": true, | ||||||
|  |           "optional": true | ||||||
|         }, |         }, | ||||||
|         "object-assign": { |         "object-assign": { | ||||||
|           "version": "4.1.1", |           "version": "4.1.1", | ||||||
| @@ -8129,6 +8137,7 @@ | |||||||
|         "once": { |         "once": { | ||||||
|           "version": "1.4.0", |           "version": "1.4.0", | ||||||
|           "bundled": true, |           "bundled": true, | ||||||
|  |           "optional": true, | ||||||
|           "requires": { |           "requires": { | ||||||
|             "wrappy": "1" |             "wrappy": "1" | ||||||
|           } |           } | ||||||
| @@ -8214,6 +8223,7 @@ | |||||||
|         "string-width": { |         "string-width": { | ||||||
|           "version": "1.0.2", |           "version": "1.0.2", | ||||||
|           "bundled": true, |           "bundled": true, | ||||||
|  |           "optional": true, | ||||||
|           "requires": { |           "requires": { | ||||||
|             "code-point-at": "^1.0.0", |             "code-point-at": "^1.0.0", | ||||||
|             "is-fullwidth-code-point": "^1.0.0", |             "is-fullwidth-code-point": "^1.0.0", | ||||||
|   | |||||||
| @@ -40,6 +40,8 @@ class RegisterPage extends React.Component { | |||||||
|         fileList_ktp: [], |         fileList_ktp: [], | ||||||
|         fileList_photo: [], |         fileList_photo: [], | ||||||
|  |  | ||||||
|  |         query: {}, | ||||||
|  |  | ||||||
|         // form |         // form | ||||||
|         confirmPassword: "", |         confirmPassword: "", | ||||||
|         phone_number: "", |         phone_number: "", | ||||||
| @@ -65,6 +67,18 @@ class RegisterPage extends React.Component { | |||||||
|     } |     } | ||||||
|  |  | ||||||
|     componentDidMount() { |     componentDidMount() { | ||||||
|  |       let {location:{search}} = this.props; | ||||||
|  |       search = search.substr(1); | ||||||
|  |  | ||||||
|  |       const query = search.split("&") | ||||||
|  |         .map(q => q.split('=')) | ||||||
|  |         .reduce((all, q) => { | ||||||
|  |           all[q[0]] = q[1]; | ||||||
|  |           return all; | ||||||
|  |         }, {}); | ||||||
|  |  | ||||||
|  |       this.setState({query}); | ||||||
|  |  | ||||||
|       this.place.getAllProvince(); |       this.place.getAllProvince(); | ||||||
|     } |     } | ||||||
|  |  | ||||||
| @@ -114,6 +128,15 @@ class RegisterPage extends React.Component { | |||||||
|     }; |     }; | ||||||
|  |  | ||||||
|     register = () => { |     register = () => { | ||||||
|  |  | ||||||
|  |         if (this.state.upload_photo === '') { | ||||||
|  |           return message.warning("please upload photo"); | ||||||
|  |         } | ||||||
|  |  | ||||||
|  |         if (this.state.upload_ktp === '') { | ||||||
|  |           return message.warning("please upload ktp"); | ||||||
|  |         } | ||||||
|  |  | ||||||
|         this.setState({ isLoading: true }); |         this.setState({ isLoading: true }); | ||||||
|         let data = { |         let data = { | ||||||
|             fullname: this.state.full_name, |             fullname: this.state.full_name, | ||||||
| @@ -129,11 +152,13 @@ class RegisterPage extends React.Component { | |||||||
|             district_id: this.state.district, |             district_id: this.state.district, | ||||||
|             subdistrict_id: this.state.subdistrict, |             subdistrict_id: this.state.subdistrict, | ||||||
|             zip_code: this.state.zip_code, |             zip_code: this.state.zip_code, | ||||||
|  |             referal: this.state.query.referal, | ||||||
|             additional_data: {} |             additional_data: {} | ||||||
|         }; |         }; | ||||||
|         this.authStore.register(data).then(res => { |         this.authStore.register(data).then(res => { | ||||||
|             setTimeout(() => { |             setTimeout(() => { | ||||||
|                 this.setState({ isLoading: false }); |                 this.setState({ isLoading: false }); | ||||||
|  |                 message.success("Please check your email to confirm your account"); | ||||||
|             }, 1000); |             }, 1000); | ||||||
|         }).catch(err => { |         }).catch(err => { | ||||||
|             this.setState({ isLoading: false }); |             this.setState({ isLoading: false }); | ||||||
| @@ -476,10 +501,31 @@ class RegisterPage extends React.Component { | |||||||
|                                         </Grid> |                                         </Grid> | ||||||
|                                     </div> |                                     </div> | ||||||
|  |  | ||||||
|  |                                     <Grid item xs={12} sm={12} md={12}> | ||||||
|  |                                       <TextField | ||||||
|  |                                         label="Referal" | ||||||
|  |                                         value={this.state.query.referal} | ||||||
|  |                                         onChange={event => { | ||||||
|  |                                           this.setState({ | ||||||
|  |                                             query: { | ||||||
|  |                                               ...this.state.query, | ||||||
|  |                                               referal: event.target.value | ||||||
|  |                                             } | ||||||
|  |                                           }) | ||||||
|  |                                         }} | ||||||
|  |                                         margin="normal" | ||||||
|  |                                         type={"text"} | ||||||
|  |                                         fullWidth | ||||||
|  |                                         variant="outlined" | ||||||
|  |                                       /> | ||||||
|  |                                     </Grid> | ||||||
|  |  | ||||||
|                                     <div style={{ padding: 5, marginTop: 20 }}> |                                     <div style={{ padding: 5, marginTop: 20 }}> | ||||||
|                                         <Button fullWidth variant="contained" style={{ backgroundColor: '#ffeb3b' }} onClick={this.register}> |                                         <Button | ||||||
|                                             {this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Sign Up"} |                                           disabled={!this.state.query.referal} | ||||||
|  |                                           fullWidth | ||||||
|  |                                           variant="contained" style={{ backgroundColor: '#ffeb3b' }} onClick={this.register}> | ||||||
|  |                                             {this.state.isLoading ? <CircularProgress className={classes.progress} /> : (this.state.query.referal ? "Sign Up" : "Please add Referal to continue")} | ||||||
|                                         </Button> |                                         </Button> | ||||||
|                                     </div> |                                     </div> | ||||||
|                                 </Paper> |                                 </Paper> | ||||||
|   | |||||||
| @@ -1,26 +1,40 @@ | |||||||
| import {inject, observer} from "mobx-react"; | import {inject, observer} from "mobx-react"; | ||||||
|  | import PropTypes from 'prop-types'; | ||||||
| import React from "react"; | import React from "react"; | ||||||
| import './style.scss'; | import './style.scss'; | ||||||
| import { | import Button from '@material-ui/core/Button'; | ||||||
|   Step, |  | ||||||
|   Stepper, |  | ||||||
|   StepLabel, |  | ||||||
| } from 'material-ui/Stepper'; |  | ||||||
| import RaisedButton from 'material-ui/RaisedButton'; | import RaisedButton from 'material-ui/RaisedButton'; | ||||||
| import FlatButton from 'material-ui/FlatButton'; | import FlatButton from 'material-ui/FlatButton'; | ||||||
| import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back'; | import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back'; | ||||||
| import {Divider} from "material-ui"; | import {Divider} from "@material-ui/core"; | ||||||
| import CheckoutVouchers from "../Checkout"; | import CheckoutVouchers from "../Checkout"; | ||||||
| import PaymentVouchers from "../Payment"; | import PaymentVouchers from "../Payment"; | ||||||
| import {LINKS} from "../../../routes"; | import {LINKS} from "../../../routes"; | ||||||
| import {notification, Modal} from "antd"; | import {notification, Modal} from "antd"; | ||||||
| import FinishVouchers from "../Finish"; | import FinishVouchers from "../Finish"; | ||||||
|  | import { withStyles } from '@material-ui/core/styles'; | ||||||
|  | import Stepper from '@material-ui/core/Stepper'; | ||||||
|  | import Step from '@material-ui/core/Step'; | ||||||
|  | import StepLabel from '@material-ui/core/StepLabel'; | ||||||
|  |  | ||||||
| const confirm = Modal.confirm; | const confirm = Modal.confirm; | ||||||
|  |  | ||||||
|  | const styles = theme => ({ | ||||||
|  |   button: { | ||||||
|  |     margin: theme.spacing.unit, | ||||||
|  |   }, | ||||||
|  |   input: { | ||||||
|  |     display: 'none', | ||||||
|  |   }, | ||||||
|  |   divider: { | ||||||
|  |     marginBottom: 10, | ||||||
|  |     marginTop: 10, | ||||||
|  |   } | ||||||
|  | }); | ||||||
|  |  | ||||||
| @inject('appstate') | @inject('appstate') | ||||||
| @observer | @observer | ||||||
| export default class VoucherStepperComponent extends React.Component { | export class VoucherStepper extends React.Component { | ||||||
|  |  | ||||||
|   constructor(props) { |   constructor(props) { | ||||||
|     super(props); |     super(props); | ||||||
| @@ -38,7 +52,7 @@ export default class VoucherStepperComponent extends React.Component { | |||||||
|   componentWillMount() { |   componentWillMount() { | ||||||
|     if(!this.vouchersStore.dataItems.name){ |     if(!this.vouchersStore.dataItems.name){ | ||||||
|       // alert('jalan') |       // alert('jalan') | ||||||
|       this.props.history.push(LINKS.VOUCHERS); |       this.props.history.push(LINKS.DASHBOARD); | ||||||
|     } |     } | ||||||
|     // alert('engga') |     // alert('engga') | ||||||
|   } |   } | ||||||
| @@ -94,19 +108,24 @@ export default class VoucherStepperComponent extends React.Component { | |||||||
|   }; |   }; | ||||||
|  |  | ||||||
|   renderButton = () => { |   renderButton = () => { | ||||||
|  |     const {classes} = this.props; | ||||||
|     return( |     return( | ||||||
|       <div style={{width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', marginTop: 12,}}> |       <div style={{width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', marginTop: 12,}}> | ||||||
|         <FlatButton |         {/*<FlatButton*/} | ||||||
|           label="Back" |           {/*label="Back"*/} | ||||||
|           disabled={this.state.stepIndex === 2} |           {/*disabled={this.state.stepIndex === 2}*/} | ||||||
|           onClick={(this.state.stepIndex === 0) ? () => this.props.history.goBack() : this.handlePrev} |           {/*onClick={(this.state.stepIndex === 0) ? () => this.props.history.goBack() : this.handlePrev}*/} | ||||||
|           style={{marginRight: 12}} |           {/*style={{marginRight: 12}}*/} | ||||||
|         /> |         {/*/>*/} | ||||||
|         <RaisedButton |         <Button disabled={this.state.stepIndex === 2} onClick={(this.state.stepIndex === 0) ? () => this.props.history.goBack() : this.handlePrev} className={classes.button}>Back</Button> | ||||||
|           label={this.state.stepIndex === 2 ? 'Finish' : 'Next'} |         <Button variant="contained" color="primary" className={classes.button} onClick={this.handleNext}> | ||||||
|           primary={true} |           {this.state.stepIndex === 2 ? 'Finish' : 'Next'} | ||||||
|           onClick={this.handleNext} |         </Button> | ||||||
|         /> |         {/*<RaisedButton*/} | ||||||
|  |           {/*label={this.state.stepIndex === 2 ? 'Finish' : 'Next'}*/} | ||||||
|  |           {/*primary={true}*/} | ||||||
|  |           {/*onClick={this.handleNext}*/} | ||||||
|  |         {/*/>*/} | ||||||
|       </div> |       </div> | ||||||
|     ); |     ); | ||||||
|   }; |   }; | ||||||
| @@ -126,6 +145,7 @@ export default class VoucherStepperComponent extends React.Component { | |||||||
|  |  | ||||||
|   render() { |   render() { | ||||||
|     const {finished, stepIndex} = this.state; |     const {finished, stepIndex} = this.state; | ||||||
|  |     const {classes} = this.props; | ||||||
|     const contentStyle = {margin: '0 16px'}; |     const contentStyle = {margin: '0 16px'}; | ||||||
|  |  | ||||||
|     if(!this.vouchersStore.dataItems.name){ |     if(!this.vouchersStore.dataItems.name){ | ||||||
| @@ -158,25 +178,10 @@ export default class VoucherStepperComponent extends React.Component { | |||||||
|               <StepLabel>Finish</StepLabel> |               <StepLabel>Finish</StepLabel> | ||||||
|             </Step> |             </Step> | ||||||
|           </Stepper> |           </Stepper> | ||||||
|           <Divider style={{marginBottom:10,marginTop:10}} /> |           <Divider component="div" className={classes.divider} /> | ||||||
|  |           {/*<Divider style={{marginBottom:10,marginTop:10}} />*/} | ||||||
|           <div style={contentStyle}> |           <div style={contentStyle}> | ||||||
|             {finished ? ( |             {this.getStepContent(stepIndex)} | ||||||
|               <p> |  | ||||||
|                 <a |  | ||||||
|                   href="#" |  | ||||||
|                   onClick={(event) => { |  | ||||||
|                     event.preventDefault(); |  | ||||||
|                     this.setState({stepIndex: 0, finished: false}); |  | ||||||
|                   }} |  | ||||||
|                 > |  | ||||||
|                   Click here |  | ||||||
|                 </a> to reset the example. |  | ||||||
|               </p> |  | ||||||
|             ) : ( |  | ||||||
|               <div> |  | ||||||
|                 <p>{this.getStepContent(stepIndex)}</p> |  | ||||||
|               </div> |  | ||||||
|             )} |  | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
| @@ -184,3 +189,9 @@ export default class VoucherStepperComponent extends React.Component { | |||||||
|   } |   } | ||||||
|  |  | ||||||
| } | } | ||||||
|  |  | ||||||
|  | VoucherStepper.propTypes = { | ||||||
|  |   classes: PropTypes.object.isRequired, | ||||||
|  | }; | ||||||
|  |  | ||||||
|  | export default withStyles(styles)(VoucherStepper); | ||||||
|   | |||||||
| @@ -1,9 +1,13 @@ | |||||||
| .stepper{ | .stepper{ | ||||||
|   margin-top: 5vh; |   margin-top: 5vh; | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: center; | ||||||
|  |   align-items: center; | ||||||
|  |   //background-color: #fff; | ||||||
|   .divider-container{ |   .divider-container{ | ||||||
|     max-width: 65vw; |     max-width: 75vw; | ||||||
|   } |   } | ||||||
|   .stepper-container{ |   .stepper-container{ | ||||||
|     max-width: 65vw; |     max-width: 75vw; | ||||||
|   } |   } | ||||||
| } | } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user