import React, {Component} from "react";
import VerifiedIcon from "../Images/verified.png";
import axios from "axios";
import * as configs from "../Config/config";

export default class AccountVerified extends Component{
    constructor(props) {
        super(props);

        this.state = {
            id : ''
        };


    }

    componentDidMount() {
        console.log(this.props.match.params.id)

        this.setState({
            id : this.props.match.params.id
        }, () => {

            axios.post(configs.BASE_URL + '/userAccount/update/' + this.state.id)

        })
    }


    render() {
        return (
            <div className="container" style={{padding:'10px'}}>
                <div style={{width:'50%', margin:'auto', marginTop:'7%', padding:'10px', paddingBottom: '30px', border:'solid', borderColor:'#216E9B'}} >
                   <div className="row" style={{display:'contents'}}>
                       <img src={VerifiedIcon} style={{width:'80px', height:'90px'}}/>
                   </div>
                    <div className="row" style={{marginTop:'10px',marginBottom:'0px',display: 'flex', justifyContent: 'center'}}>
                        <h2 style={{fontFamily: 'emoji', color: '#265077', margin:'0px', textAlign:'center'}}>Your Email is Verified</h2>
                    </div>
                    <div className="row" style={{marginTop:'5px',marginBottom:'0px',display: 'flex', justifyContent: 'center'}}>
                        <br/>
                        <span>Your Account has been successfully verified. Thank you for join with SmartCoach.
                            Now you can start tutoring in SmartCoach. </span>
                        <br/>
                        <span>You can login with your credentials.</span>
                    </div>
                    <div className="row" style={{marginTop:'20px',marginBottom:'0px',display: 'flex', justifyContent: 'center'}}>
                        <a href="/UserLogin" type="submit"
                           className="profile-edit-btn nav-link  btn btn-primary" name="btnAddMore"
                           style={{
                               marginTop: '20px', marginBottom: '30px', width:'50%',
                               backgroundColor: '#265077', borderColor: '#216E9B', fontSize: '12px'

                           }}>
                            Sign In
                        </a>
                    </div>

                </div>
            </div>

        )
    }
}