theoludwig/FunctionProject
Archived
1
1
Fork 0
Code Pull Requests Actions Releases Activity

frontend et backend: Connexion d'un utilisateur

Browse Source
This commit is contained in:
Divlo
2020-04-06 16:46:03 +02:00
parent 8c37dbaaf4
commit 76298b6087
11 changed files with 184 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
website/pages/404.js
View File

@ -16,13 +16,6 @@ const Error404 = () => (
Cette page n'existe pas! <Link href={"/"}><a>Revenir à la page d'accueil ?</a></Link>
</p>
</div>
<style>
{`
#__next {
padding-top: 0;
}
`}
</style>
</Fragment>
);

8
website/pages/_app.js
View File

@ -1,5 +1,4 @@
/* Libraries Imports */
import { Fragment } from 'react';
import Router from 'next/router'
import NProgress from 'nprogress';
@ -7,6 +6,9 @@ import NProgress from 'nprogress';
import Header from '../components/Header/Header';
import Footer from '../components/Footer/Footer';
/* Contexts Imports */
import UserContextProvider from '../contexts/UserContext';
/* CSS Imports */
import '../public/fonts/Montserrat/Montserrat.css';
import '../public/css/normalize.css';
@ -19,13 +21,13 @@ Router.events.on('routeChangeComplete', () => NProgress.done());
Router.events.on('routeChangeError', () => NProgress.done());
const App = ({ Component, pageProps }) => (
<Fragment>
<UserContextProvider>
<Header />
<div className="content container-fluid">
<Component {...pageProps} />
</div>
<Footer />
</Fragment>
</UserContextProvider>
);
export default App;

48
website/pages/login.js
View File

@ -1,9 +1,29 @@
import { Fragment } from 'react';
import { Fragment, useContext, useState } from 'react';
import { useRouter } from 'next/router';
import Link from 'next/link';
import htmlParser from 'html-react-parser';
import Loader from '../components/Loader';
import HeadTag from '../components/HeadTag';
import { UserContext } from '../contexts/UserContext';
import '../public/css/pages/register-login.css';
const Login = () => {
const router = useRouter();
const [inputState, setInputState] = useState({});
const { loginUser, messageLogin, loginLoading } = useContext(UserContext);
const handleChange = () => {
const inputStateNew = { ...inputState };
inputStateNew[event.target.name] = event.target.value;
setInputState(inputStateNew);
}
const handleSubmit = (event) => {
event.preventDefault();
loginUser(inputState);
}
return (
<Fragment>
<HeadTag
@ -14,26 +34,40 @@ const Login = () => {
<div className="row Register-Login__row justify-content-center">
<div className="col-20">
<h1 className="Register-Login__title">Se connecter</h1>
<form>
<form onSubmit={handleSubmit}>
<div className="form-group">
<label className="form-label" htmlFor="name">Email :</label>
<input type="email" name="email" id="email" className="form-control" placeholder="email@gmail.com" />
<label className="form-label" htmlFor="email">Email :</label>
<input onChange={handleChange} type="email" name="email" id="email" className="form-control" placeholder="email@gmail.com" />
</div>
<div className="form-group">
<label className="form-label" htmlFor="name">Mot de passe :</label>
<input type="password" name="password" id="password" className="form-control" placeholder="******" />
<label className="form-label" htmlFor="password">Mot de passe :</label>
<input onChange={handleChange} type="password" name="password" id="password" className="form-control" placeholder="******" />
<p>
<Link href={"/register"}>
<a className="Register-Login__Forgot-password">Mot de passe oublié ?</a>
</Link>
</p>
</div>
<div className="form-group text-center">
<button type="submit" className="btn btn-dark">Envoyer</button>
</div>
</form>
<div className="form-result text-center"></div>
<div className="form-result text-center">
{(router.query.isConfirmed !== undefined) && <p className="form-success"><b>Succès:</b> Votre compte a bien été confirmé, vous pouvez maintenant vous connectez!</p>}
{
(loginLoading) ?
<Loader />
:
htmlParser(messageLogin)
}
</div>
</div>
</div>
</div>
</Fragment>
);
}
export default Login;