Register account functionality
This commit is contained in:
parent
3b02adbf5c
commit
fa5a40c973
|
@ -1,5 +1,6 @@
|
|||
from rest_framework.decorators import api_view
|
||||
from django.contrib.auth import get_user_model
|
||||
from django.contrib.auth.forms import UserCreationForm
|
||||
from django.http import JsonResponse
|
||||
import jwt
|
||||
|
||||
|
@ -29,4 +30,24 @@ def login(request):
|
|||
else:
|
||||
return JsonResponse({'error': 'Wrong credentials'})
|
||||
except User.DoesNotExist:
|
||||
return JsonResponse({'error': 'User does not exist'})
|
||||
return JsonResponse({'error': 'User does not exist'})
|
||||
|
||||
@api_view(['POST'])
|
||||
def register(request):
|
||||
try:
|
||||
email = request.POST.get('email')
|
||||
username = request.POST.get('username')
|
||||
password = request.POST.get('password')
|
||||
|
||||
payload = {
|
||||
"email": email,
|
||||
"username": username,
|
||||
"password": password
|
||||
}
|
||||
|
||||
user = get_user_model().objects.create_user(**payload)
|
||||
print(user)
|
||||
|
||||
return JsonResponse({'code': 'OK'}, safe=False)
|
||||
except Exception as e:
|
||||
return JsonResponse({'error': 'Error while loading the data: ' + e}, safe=False)
|
|
@ -21,6 +21,7 @@ urlpatterns = [
|
|||
path('books/ratings/count', countRatings),
|
||||
# path('books/countries', books_per_country),
|
||||
path('auth/login', csrf_exempt(login)),
|
||||
path('auth/register', csrf_exempt(register)),
|
||||
|
||||
path('books/challenge', getChallengeOfYear),
|
||||
path('books/challenges', getAllChallenges),
|
||||
|
|
|
@ -5,6 +5,7 @@ import Login from "./views/login";
|
|||
import Books from "./views/bookslist";
|
||||
import BooksList from "./views/bookslist";
|
||||
import Challenges from "./views/challenges";
|
||||
import { Register } from "./views/register";
|
||||
|
||||
const Dashboard = lazy(() => import("./views/dashboard"));
|
||||
|
||||
|
@ -28,6 +29,7 @@ function App() {
|
|||
</div>}>
|
||||
<Routes>
|
||||
<Route exact path="/" element={localStorage.getItem('token') ? <Dashboard /> : <Login />} />
|
||||
<Route exact path="/register" element={<Register />} />
|
||||
<Route exact path="/books" element={<BooksList />} />
|
||||
<Route exact path="/challenges" element={<Challenges />} />
|
||||
{/* <Route exact path="/login" element={<Login />} /> */}
|
||||
|
|
|
@ -1,5 +1,16 @@
|
|||
import { readCookie } from "../Functions";
|
||||
|
||||
export const registerUser = (formData) => {
|
||||
return fetch(`/api/auth/register`, {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
return data;
|
||||
})
|
||||
}
|
||||
|
||||
export const getAllBooks = () => {
|
||||
return fetch('/api/books/all', {
|
||||
"method": "GET",
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import React, { useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
const Login = (props) => {
|
||||
const [username, setUsername] = useState('');
|
||||
|
@ -116,6 +117,7 @@ const Login = (props) => {
|
|||
<button type="submit" className="btn btn-primary">Inloggen</button>
|
||||
<div id='err_msg'></div>
|
||||
</form>
|
||||
<Link className="btn" to="/register" style={{ width: '100%', marginTop: '15px' }}>Maak een account aan</Link>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,55 @@
|
|||
import React, { useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
export const Register = (props) => {
|
||||
const [isRegistered, setIsRegistered] = useState(false);
|
||||
|
||||
const handleFormSubmit = async (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
var email = event.target.email.value;
|
||||
var username = event.target.username.value;
|
||||
var password = event.target.password.value;
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append('email', email);
|
||||
formData.append('username', username);
|
||||
formData.append('password', password);
|
||||
|
||||
const data = await import("../components/Data.js");
|
||||
const register = await data.registerUser(formData);
|
||||
|
||||
if(register.code && register.code === 'OK'){
|
||||
setIsRegistered(true);
|
||||
}
|
||||
}
|
||||
|
||||
return(
|
||||
<React.Fragment>
|
||||
<div className='login_overlay'></div>
|
||||
<div className='login register'>
|
||||
<img className="logo_text" src="/static/images/logo.png" />
|
||||
|
||||
{isRegistered &&(
|
||||
<div id="ok_msg" class="alert alert-success" style={{ marginTop: '20px' }}>Account aangemaakt! Klik <Link to="/">hier</Link> om in te loggen.</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={(event) => handleFormSubmit(event)}>
|
||||
<p style={{ textAlign: 'center', marginBottom: '25px' }}>Leuk dat je een account aan gaat maken op NovelMetrix! Vul hieronder de gegevens in en na het aanmaken kun je gelijk inloggen op je nieuwe account.</p>
|
||||
<div className="mb-3">
|
||||
<input type="text" className="form-control" name="email" id="email" placeholder="E-mailadres" required/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<input type="text" className="form-control" name="username" id="username" placeholder="Gebruikersnaam" required/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<input type="password" className="form-control" name="password" id="password" placeholder="Wachtwoord" required/>
|
||||
</div>
|
||||
<button type="submit" className="btn btn-primary">Registreer</button>
|
||||
<div id='err_msg'></div>
|
||||
</form>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
|
@ -590,8 +590,11 @@ html, body{
|
|||
-ms-transform: translateX(-50%) translateY(-50%);
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
border-radius: 5px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.login.register{
|
||||
width:450px;
|
||||
}
|
||||
|
||||
.login form{
|
||||
background:#ffffff;
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -10,6 +10,10 @@
|
|||
!*** ./src/views/login.js ***!
|
||||
\****************************/
|
||||
|
||||
/*!*******************************!*\
|
||||
!*** ./src/views/register.js ***!
|
||||
\*******************************/
|
||||
|
||||
/*!********************************!*\
|
||||
!*** ./src/views/bookslist.js ***!
|
||||
\********************************/
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -23,6 +23,7 @@ urlpatterns = [
|
|||
path('books/', include('frontend.urls')),
|
||||
path('challenges/', include('frontend.urls')),
|
||||
path('login/', include('frontend.urls')),
|
||||
path('register/', include('frontend.urls')),
|
||||
path('manage/', include('frontend.urls')),
|
||||
path('manage/challenges', include('frontend.urls'))
|
||||
]
|
||||
|
|
Loading…
Reference in New Issue