fixed Login and finished Registration with server

This commit is contained in:
britea 2020-03-04 16:12:58 +01:00
parent a3b88a7d87
commit 879a22606d
6 changed files with 50 additions and 24 deletions

View file

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Switch, Route, Link, Redirect } from "react-router-dom";
import React from "react";
import { Switch, Route, Redirect } from "react-router-dom";
import Home from "./views/Home";
import Dashboard from "./views/DashboardTest";
import Signup from "./views/Signup";
@ -8,7 +8,7 @@ import Login from "./views/Login";
import { call } from './client_server';
const ProtectedRoute = ({ component: Comp, loggedIn, logOut, path, ...rest }) => {
/*const ProtectedRoute = ({ component: Comp, loggedIn, logOut, path, ...rest }) => {
return (
<Route
path={path}
@ -30,7 +30,7 @@ const ProtectedRoute = ({ component: Comp, loggedIn, logOut, path, ...rest }) =>
}}
/>
);
};
};*/
class App extends React.Component {
constructor(props) {
@ -55,10 +55,10 @@ class App extends React.Component {
}
auth(data) {
call.login(data.params)
return call.login(data.params)
.then(res => {
console.log(res);
if (res.data && res.status == 200) {
if (res.data && res.status === 200) {
this.setState(
{
user: data.params.user,
@ -97,7 +97,7 @@ class App extends React.Component {
</Route>
<Route path="/signup" exact component={Signup} />
<Route path="/dashboard" >
{this.state.loggedIn ? <Dashboard logout={this.logout} /> : <Login auth={this.auth} />}
{this.state.loggedIn ? <Dashboard logout={this.logout} /> : <Redirect to="/login" />}
</Route>
</Switch>

View file

@ -11,4 +11,12 @@ export var call = {
console.error(err);
});
},
register: function(data, headers) {
return axios.post(config + 'register', data)
.then(res => {
return res;
}).catch(err => {
console.error(err);
});
},
};

View file

@ -1,12 +1,8 @@
import React, {Component} from 'react';
import {Button } from 'semantic-ui-react';
import { Link } from "react-router-dom";
export default class Dashboard extends Component {
constructor(props) {
super(props);
}
handleLogOut = (e) => {
console.log(this.props);

View file

@ -3,7 +3,6 @@ import React, { Component } from 'react';
import {
Button,
Container,
Divider,
Grid,
Header,
Icon,

View file

@ -1,5 +1,5 @@
import React, {Component} from 'react';
import {Button, Form, Grid, Header, Image, Message, Segment, Icon, Checkbox, Input} from 'semantic-ui-react';
import {Button, Form, Grid, Header, Image, Message, Icon, Checkbox, Input} from 'semantic-ui-react';
export default class Login extends Component {
constructor(props) {
@ -15,13 +15,21 @@ export default class Login extends Component {
e.preventDefault();
const params = {
username: this.state.user,
password: this.state.password,
"usernameOrEmail": this.state.user,
"password": this.state.password,
};
this.props.auth({
user: this.state.user,
params : params,
}).then(res => {
if (res === '400') {
console.log('error');
} else {
console.log("SUCCESS");
}
}).catch(err => {
console.log(err);
});
};

View file

@ -1,5 +1,6 @@
import React, {Component} from 'react';
import {Button, Form, Grid, Header, Image, Message, Segment, Icon, Checkbox, Input} from 'semantic-ui-react';
import {Button, Form, Grid, Header, Image, Icon, Input} from 'semantic-ui-react';
import { call } from '../client_server';
@ -7,17 +8,31 @@ export default class Signup extends Component{
constructor(props) {
super(props);
this.state = {
logged : false,
completeName: '',
username: '',
completeName: "",
username: "",
email: "",
password : ""
password : "",
};
}
handleLogin = (e) => {
// TODO Login should be handled here
console.log(this.state);
handleRegistration = (e) => {
e.preventDefault();
const params = {
"email": this.state.email,
"name": this.state.completeName,
"password": this.state.password,
"username": this.state.username,
};
call.register(params)
.then(res => {
if (res.data && res.status === 200) {
console.log(res.data);
}
}).catch(err => {
});
console.log(this.state);
};
onChangeHandler = (event) => {
@ -86,7 +101,7 @@ export default class Signup extends Component{
minLength={6}
required
/>
<Button color='blue' fluid size='large' onClick={this.handleLogin}>
<Button color='blue' fluid size='large' onClick={this.handleRegistration}>
Register
</Button>
</Form>