1
0
mirror of https://github.com/franjsco/tick3t synced 2025-01-01 04:07:28 +01:00

feat: implement login

This commit is contained in:
frab1t 2019-07-03 10:27:41 +02:00
parent ed94230f79
commit ee13b24293

View File

@ -1,4 +1,5 @@
import React, { Component } from 'react';
import { Link, Redirect } from 'react-router-dom';
import {
Row,
Col,
@ -8,6 +9,8 @@ import {
Input
} from 'reactstrap';
import { config } from '../../config';
import Card from '../../components/Card';
import Button from '../../components/Button';
@ -16,20 +19,21 @@ class Login extends Component {
super(props);
this.state = {
email: '',
password: '',
err: ''
email: null,
password: null,
error: null,
success: false
};
this.handleInputChange = this.handleInputChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.resetLogin = this.resetLogin.bind(this);
}
handleInputChange(event) {
const target = event.target;
const name = target.name;
const value = target.type === 'checkbox' ? target.checked : target.value;
this.setState({
[name]: value
});
@ -37,18 +41,78 @@ class Login extends Component {
handleSubmit(event) {
event.preventDefault();
const { email, password } = this.state;
const body = {
email,
password
}
fetch(`${config.baseURL}users/login`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(body)
})
.then(res => {
return res.json();
})
.then((json) => {
if (!json.success) {
this.setState({
error: json.message
});
} else {
localStorage.setItem('token', json.token);
this.setState({
success: true
});
}
})
.catch((err) => {
if (err === 'AuthErr'){
this.setState({
err: 'auth error'
});
} else {
this.setState({
err: err.message
});
}
});
}
resetLogin(event) {
event.preventDefault();
this.setState({
email: null,
password: null,
error: null
});
}
render() {
if (this.state.err) {
if (this.state.error) {
return (
<Card title="Error">
<p>{this.state.err}</p>
<p>{this.state.error}</p>
<a href="" onClick={this.resetLogin}>Back to login</a>
</Card>
);
}
if (this.state.success) {
return (
<Redirect to="/admin/" />
)
}
return (
<Card
align="left"