[PYTHON] Create a Django login screen
Last time, I felt like I couldn't register a new Staff because I didn't get the user information, so I will create a login screen.
By logging in to the staff, we will create it in the staff app. Make sure to load the login template into urls.py.
python:staff.urls.py
from django.urls import path, include
from .views import StaffCreate, loginfunc
urlpatterns = [
path('login/', loginfunc, name='login'),
path('create/', StaffCreate.as_view(), name = "staffcreate"),
]
Added loginfunc. Next, create a login funk in Views.
python:staff.views.py
def loginfunc(request):
if request.method == 'POST':
user_name = request.POST['username']
user_password = request.POST['password']
user = authenticate(request, username=user_name, password=user_password)
if user is not None:
login(request, user)
return redirect('staff:staffcreate')
else:
return render(request, 'staff/login.html', {'error':'Wrong employee name or password'})
return render(request, 'staff/login.html')
Is this all right? From the html login screen, enter the entered username and password in the variable user_name user_password and check if there is the same user. If it's not that there are no users (it's hard to understand (laughs)), log in and call the page named staffcreate with the staff app ursl. Should go like that
If the user is not found, return to the login screen, but then pass the message with an error.
templates/staff/login.html
{% extends 'staff/base.html' %}
{% load static %}
{% block customcss %}
<link rel='stylesheet' type='text/css' href="{% static 'style.css' %}">
{% endblock customcss %}
{% block header %}
{% endblock header %}
{% block content %}
<form class="form-signin" method="POST" action="">{% csrf_token %}
<img class="mb-4" src="/docs/4.5/assets/brand/bootstrap-solid.svg" alt="" width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal">Login page</h1>
{{ error }}
<label for="text" class="sr-only">Employee ID</label>
<input type="text" name="username" placeholder="username" required autofocus>
<label for="inputPassword" class="sr-only">Password</label>
<input type="password" name="password" placeholder="Password" required>
<button class="btn btn-lg btn-primary btn-block" type="submit">Login</button>
<p class="mt-5 mb-3 text-muted">©GK</p>
</form>
{% endblock content %}
I just made some modifications from the bootstrap template. Add settings to settings.py so that you can call in static files
config/settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
Create a static folder in the same hierarchy as templates In order to organize, create a staff folder, create loginstyle.css in it, and write css here. This is also a copy and paste from the bootstrap template, so it is still impossible to write from scratch by myself
static/staff/loginstylecss
html,
body {
height: 100%;
}
body {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
background-color: #f5f5f5;
}
.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: auto;
}
.form-signin .checkbox {
font-weight: 400;
}
.form-signin .form-control {
position: relative;
box-sizing: border-box;
height: auto;
padding: 10px;
font-size: 16px;
}
.form-signin .form-control:focus {
z-index: 2;
}
.form-signin input[type="email"] {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
I wonder if this can be done. Save and start the server.
It was no good staaff / login.html ??? What is this
Many a ... Fixed views
python:staff/login.views.py
def loginfunc(request):
if request.method == 'POST':
user_name = request.POST['username']
user_password = request.POST['password']
user = authenticate(request, username=user_name, password=user_password)
if user is not None:
login(request, user)
return redirect('staff:staffcreate')
else:
return render(request, 'staff/login.html', {'error':'Wrong employee name or password'})
return render(request, 'staff/login.html')
I will try again with this
What the hell! !! !! !!
The display is strange ... Isn't it safer not to touch it from bootstarp?
2 hours to make various corrections and cite what I created in the past ... After all, I still don't know ... It looks like the CSS file isn't being called in
The current state ...
python:config.settings.py
STATIC_URL = '/staic/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
In addition, urls
python:config.urls.py
from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
path('staff/',include('staff.urls') ),
path('admin/', admin.site.urls),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
I changed it to, created a static folder in the same hierarchy as templates, and created style.css directly under it.
static/style.css
html,
body {
height: 100%;
}
body {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
background-color: #f5f5f5;
}
.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: auto;
}
.form-signin .checkbox {
font-weight: 400;
}
.form-signin .form-control {
position: relative;
box-sizing: border-box;
height: auto;
padding: 10px;
font-size: 16px;
}
.form-signin .form-control:focus {
z-index: 2;
}
.form-signin input[type="email"] {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
Since this is not read, the width does not change at all ...
Let's give up a little and start doing the create function
Recommended Posts