import React, {Component} from 'react';
import axios from 'axios';
import { BrowserRouter as Router ,Redirect } from 'react-router-dom';
import { withRouter } from "react-router-dom";
import Route from 'react-router-dom/Route';
import Product from '../Dashboard/Product';

class Login extends Component {

    constructor() {
        super();
        this.state = {
            email: '',
            password: '',
            token: null
        }
    }

    handleEmailChange = (e) => {
        this.setState({
            email: e.target.value
        });
    }

    handlePasswordChange = (e) => {
        this.setState({
            password: e.target.value
        });
    }

    handleSubmit = (e) => {
        e.preventDefault();
        var data = {
            email: this.state.email,
            password: this.state.password
        };

        axios.post('http://127.0.0.1:8000/api/login', data).then(response => {
            console.log(response.data.success.token);
            this.setState({
                token: response.data.success.token
            });
            this.props.history.push("/dashboard/products");
        }).catch(error => console.log(error));
    }

    render() {

        return (
            <div>
                <form onSubmit={this.handleSubmit}>
                    <br/>
                    <br/>
                    <hr/>
                    <label>Email</label>
                    <br/>
                    <input type="text" name="email" value={this.state.email} onChange={this.handleEmailChange.bind(this)}/>
                    <br/>
                    <label>Password</label>
                    <br/>
                    <input type="password" name="password" value={this.state.password} onChange={this.handlePasswordChange.bind(this)} />
                    <hr/>
                    <button type="submit">Login</button>
                </form>
            </div>
        )
    }
}

export default Login;