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"}>
                                        Selamat Datang di BTN Point
                                    </Typography>
                                    <Typography style={{color : '#FFF'}} variant={"subtitle2"}>
                                        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>
                                  Selamat anda telah berhasil terdaftar
                                </Typography>
                                <Typography variant="body1" gutterBottom>
                                  Mohon cek email Anda untuk konfirmasi pendaftaran
                                  {/*Kami telah mengirim sebuah email 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}}>*/}

                                  {/*<Link*/}
                                    {/*to={LINKS.LOGIN}>*/}
                                    {/*<Button fullWidth variant="contained" style={{background:'#ffeb3b'}}>*/}
                                      {/*Back to Login*/}
                                    {/*</Button>*/}
                                  {/*</Link>*/}
                                {/*</div>*/}
                              </Paper>

                            </Grid>
                        </Grid>
                    </Grid>
                </Grid>
            </div>
        )
    }
}