enggar_ganteng 2019-01-29 15:48:56 +07:00
commit 8839560fbd
4 changed files with 117 additions and 46 deletions

20
package-lock.json generated
View File

@ -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",

View File

@ -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>

View File

@ -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);

View File

@ -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;
} }
} }