[UPDT] BASE: Add additional fields to sign up page

This commit is contained in:
Horilla
2024-09-18 15:49:21 +05:30
parent 3189a38ed7
commit a63ffc204d
4 changed files with 187 additions and 146 deletions

View File

@@ -19,6 +19,7 @@ from django.contrib.auth import authenticate, login, logout
from django.contrib.auth.models import Group, Permission, User from django.contrib.auth.models import Group, Permission, User
from django.contrib.auth.views import PasswordResetConfirmView, PasswordResetView from django.contrib.auth.views import PasswordResetConfirmView, PasswordResetView
from django.core.mail import EmailMultiAlternatives from django.core.mail import EmailMultiAlternatives
from django.core.management import call_command
from django.core.paginator import Paginator from django.core.paginator import Paginator
from django.db.models import ProtectedError, Q from django.db.models import ProtectedError, Q
from django.http import Http404, HttpResponse, HttpResponseRedirect, JsonResponse from django.http import Http404, HttpResponse, HttpResponseRedirect, JsonResponse
@@ -210,6 +211,36 @@ def initialize_database_condition():
return initialize_database return initialize_database
def load_demo_database(request):
# Core data files
data_files = [
"user_data.json",
"employee_info_data.json",
"base_data.json",
"work_info_data.json",
]
optional_apps = {
"attendance": "attendance_data.json",
"leave": "leave_data.json",
"asset_data": "asset_data.json",
"recruitment": "recruitment_data.json",
"pms": "pms_data.json",
}
# Add data files for installed apps
data_files += [
file for app, file in optional_apps.items() if apps.is_installed(app)
]
# Load all data files
for file in data_files:
file_path = path.join(settings.BASE_DIR, "load_data", file)
call_command("loaddata", file_path)
messages.success(request, _("Database loaded successfully."))
return redirect(home)
def initialize_database(request): def initialize_database(request):
""" """
Handles the database initialization process via a user interface. Handles the database initialization process via a user interface.
@@ -251,10 +282,14 @@ def initialize_database_user(request):
""" """
if request.method == "POST": if request.method == "POST":
form_data = request.__dict__.get("_post") form_data = request.__dict__.get("_post")
first_name = form_data.get("firstname")
last_name = form_data.get("lastname")
username = form_data.get("username") username = form_data.get("username")
password = form_data.get("password") password = form_data.get("password")
confirm_password = form_data.get("confirm_password")
if password != confirm_password:
return render(request, "initialize_database/horilla_user_signup.html")
first_name = form_data.get("firstname")
last_name = form_data.get("lastname")
badge_id = form_data.get("badge_id")
email = form_data.get("email") email = form_data.get("email")
phone = form_data.get("phone") phone = form_data.get("phone")
user = User.objects.filter(username=username).first() user = User.objects.filter(username=username).first()
@@ -265,6 +300,7 @@ def initialize_database_user(request):
) )
employee = Employee() employee = Employee()
employee.employee_user_id = user employee.employee_user_id = user
employee.badge_id = badge_id
employee.employee_first_name = first_name employee.employee_first_name = first_name
employee.employee_last_name = last_name employee.employee_last_name = last_name
employee.email = email employee.email = email

View File

@@ -190,6 +190,7 @@
{% if next != None %} {% if next != None %}
<a href="{% url 'employee-view-individual' next %}" title="{% trans "Next Employee" %}" <a href="{% url 'employee-view-individual' next %}" title="{% trans "Next Employee" %}"
data-action="next"
style="color:hsl(8, 77%, 56%);" class="ms-1 fw-bold"> style="color:hsl(8, 77%, 56%);" class="ms-1 fw-bold">
<ion-icon name="arrow-forward-circle-outline" style="font-size:35px;"></ion-icon> <ion-icon name="arrow-forward-circle-outline" style="font-size:35px;"></ion-icon>
</a> </a>
@@ -201,7 +202,7 @@
{% if previous != None %} {% if previous != None %}
<a href="{% url 'employee-view-individual' previous %}" title="{% trans "Previous Employee" %}" <a href="{% url 'employee-view-individual' previous %}" title="{% trans "Previous Employee" %}"
style="color:hsl(8, 77%, 56%);" class="ms-1 me-2 fw-bold"> data-action="previous" style="color:hsl(8, 77%, 56%);" class="ms-1 me-2 fw-bold">
<ion-icon name="arrow-back-circle-outline" style="font-size:35px;"></ion-icon> <ion-icon name="arrow-back-circle-outline" style="font-size:35px;"></ion-icon>
</a> </a>
{% else %} {% else %}

View File

@@ -424,14 +424,22 @@ $(document).on('keydown', function (event) {
} }
else if (event.keyCode === 39) { // Key code for the right arrow key else if (event.keyCode === 39) { // Key code for the right arrow key
if (!isInputFocused) { if (!isInputFocused) {
// Click on the next button in detail view modal var $modal = $('.oh-modal--show');
$('[data-action="next"]').click(); var $nextButton = $modal.length ? $modal.find('[data-action="next"]') : $('[data-action="next"]'); // Click on the next button in detail view modal
if ($nextButton.length) {
$nextButton[0].click()
}
} }
} }
else if (event.keyCode === 37) { // Key code for the left arrow key else if (event.keyCode === 37) { // Key code for the left arrow key
if (!isInputFocused) { if (!isInputFocused) {
// Click on the previous button in detail view modal // Click on the previous button in detail view modal
$('[data-action="previous"]').click(); var $modal = $('.oh-modal--show');
var $previousButton = $modal.length ? $modal.find('[data-action="previous"]') : $('[data-action="previous"]');
if ($previousButton.length) {
$previousButton[0].click();
}
} }
} }
}); });

View File

@@ -1,157 +1,153 @@
{% load i18n %} {% load i18n %}
<div class="oh-onboarding-card__header"> <div class="oh-onboarding-card__header">
<span class="oh-onboarding-card__company-name">Horilla HRMS</span> <span class="oh-onboarding-card__company-name">Horilla HRMS</span>
<ul class="oh-onboarding-card__step"> <ul class="oh-onboarding-card__step">
<li class="oh-onboarding-card__step"> <li class="oh-onboarding-card__step">
<div class="oh-onboarding-card__count">1</div> <div class="oh-onboarding-card__count">1</div>
<span class="oh-onboarding-card__text">Authentication</span> <span class="oh-onboarding-card__text">Authentication</span>
</li> </li>
<li class="oh-onboarding-card__step oh-onboarding-card__step--active"> <li class="oh-onboarding-card__step oh-onboarding-card__step--active">
<div class="oh-onboarding-card__count">2</div> <div class="oh-onboarding-card__count">2</div>
<span class="oh-onboarding-card__text">Sign Up</span> <span class="oh-onboarding-card__text">Sign Up</span>
</li> </li>
<li class="oh-onboarding-card__step"> <li class="oh-onboarding-card__step">
<div class="oh-onboarding-card__count">3</div> <div class="oh-onboarding-card__count">3</div>
<span class="oh-onboarding-card__text">Company</span> <span class="oh-onboarding-card__text">Company</span>
</li> </li>
<li class="oh-onboarding-card__step"> <li class="oh-onboarding-card__step">
<div class="oh-onboarding-card__count">4</div> <div class="oh-onboarding-card__count">4</div>
<span class="oh-onboarding-card__text">Department</span> <span class="oh-onboarding-card__text">Department</span>
</li> </li>
<li class="oh-onboarding-card__step oh-onboarding-card__step"> <li class="oh-onboarding-card__step oh-onboarding-card__step">
<div class="oh-onboarding-card__count">5</div> <div class="oh-onboarding-card__count">5</div>
<span class="oh-onboarding-card__text">Job Position</span> <span class="oh-onboarding-card__text">Job Position</span>
</li> </li>
</ul> </ul>
</div> </div>
<h1 <h1 class="oh-onboarding-card__title oh-onboarding-card__title--h2 text-center my-3">
class="oh-onboarding-card__title oh-onboarding-card__title--h2 text-center my-3" {% trans "Sign Up" %}
>
{% trans "Sign Up" %}
</h1> </h1>
<p class="text-muted text-center"> <p class="text-muted text-center">
{% trans "Please sign up to access the Horilla HRMS." %} {% trans "Please sign up to access the Horilla HRMS." %}
</p> </p>
<form <form hx-post="{% url 'initialize-database-user' %}" hx-target="#ohAuthCard" class="oh-form-group">
hx-post="{% url 'initialize-database-user' %}" {% csrf_token %}
hx-target="#ohAuthCard" <div class="row">
class="oh-form-group" <div class="col-12 col-sm-12 col-md-6 col-lg-6">
> <div class="oh-input-group">
{% csrf_token %} <label class="oh-label" for="firstname">{% trans "First Name" %}</label>
<div class="row"> <input type="text" id="firstname" name="firstname" class="oh-input w-100" placeholder="e.g. Adam"
<div class="col-12 col-sm-12 col-md-6 col-lg-6"> required />
<div class="oh-input-group"> </div>
<label class="oh-label" for="firstname">{% trans "First Name" %}</label> </div>
<input <div class="col-12 col-sm-12 col-md-6 col-lg-6">
type="text" <div class="oh-input-group">
id="firstname" <label class="oh-label" for="lastname">{% trans "Last Name" %}</label>
name="firstname" <input type="text" id="lastname" name="lastname" class="oh-input w-100" placeholder="e.g. Luis"
class="oh-input w-100" required />
placeholder="e.g. Adam" </div>
required
/>
</div>
</div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="oh-input-group">
<label class="oh-label" for="lastname">{% trans "Last Name" %}</label>
<input
type="text"
id="lastname"
name="lastname"
class="oh-input w-100"
placeholder="e.g. Luis"
required
/>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="oh-input-group">
<label class="oh-label" for="username">{% trans "Username" %}</label>
<input
type="text"
id="username"
name="username"
class="oh-input w-100"
placeholder="e.g. jane.doe@acme.com"
required
/>
</div>
</div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="oh-input-group">
<label class="oh-label" for="password">{% trans "Password" %}</label>
<div class="oh-password-input-container">
<input
type="password"
id="adminPassword"
name="password"
class="oh-input oh-input--password w-100"
placeholder="Use alphanumeric characters"
required
/>
<button
type="button"
class="oh-btn oh-btn--transparent oh-password-input--toggle"
>
<ion-icon
class="oh-passowrd-input__show-icon"
title="Show Password"
name="eye-outline"
></ion-icon>
<ion-icon
class="oh-passowrd-input__hide-icon d-none"
title="Hide Password"
name="eye-off-outline"
></ion-icon>
</button>
</div> </div>
</div>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="col-12 col-sm-12 col-md-6 col-lg-6"> <div class="oh-input-group">
<div class="oh-input-group"> <label class="oh-label" for="email">{% trans "Email" %}</label>
<label class="oh-label" for="email">{% trans "Email" %}</label> <input type="text" id="email" name="email" class="oh-input w-100" placeholder="e.g. adam.luis@horilla.com"
<input required />
type="text" </div>
id="email" </div>
name="email" <div class="col-12 col-sm-12 col-md-6 col-lg-6">
class="oh-input w-100" <div class="oh-input-group">
placeholder="e.g. jane.doe@acme.com" <label class="oh-label" for="phone">{% trans "Phone" %}</label>
required <input type="text" id="phone" name="phone" class="oh-input w-100" placeholder="e.g. 9865324512"
/> required />
</div> </div>
</div>
</div> </div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6"> <div class="row">
<div class="oh-input-group"> <div class="col-12 col-sm-12 col-md-6 col-lg-6">
<label class="oh-label" for="phone">{% trans "Phone" %}</label> <div class="oh-input-group">
<input <label class="oh-label" for="badge_id">{% trans "Badge ID" %}</label>
type="text" <input type="text" id="badge_id" name="badge_id" class="oh-input w-100" placeholder="e.g. PEP001"
id="phone" required />
name="phone" </div>
class="oh-input w-100" </div>
placeholder="e.g. 9865324512" <div class="col-12 col-sm-12 col-md-6 col-lg-6">
required <div class="oh-input-group">
/> <label class="oh-label" for="username">{% trans "Username" %}</label>
</div> <input type="text" id="username" name="username" class="oh-input w-100"
placeholder="e.g. adam.luis@horilla.com" required />
</div>
</div>
</div> </div>
</div> <div id="passwordError" class="mt-2" style="background-color: rgba(229, 79, 56, 0.17); border: 2px solid hsl(8, 77%, 56%); border-radius: 18px; padding: 10px; font-weight: bold; width: 35%; display: none;"></div>
<button <div class="row">
type="submit" <div class="col-12 col-sm-12 col-md-6 col-lg-6">
class="oh-btn oh-onboarding-card__button mt-4 oh-btn--secondary oh-btn--shadow w-100 mb-4" <div class="oh-input-group">
role="button" <label class="oh-label" for="adminPassword">{% trans "Password" %}</label>
> <div class="oh-password-input-container">
<ion-icon class="me-2" name="lock-closed-outline"></ion-icon> <input type="password" name="password" id="adminPassword" class="oh-input oh-input--password w-100"
{% trans "Secure Sign-up" %} placeholder="Use alphanumeric characters" required />
</button> <button type="button" class="oh-btn oh-btn--transparent oh-password-input--toggle">
<ion-icon class="oh-passowrd-input__show-icon" title="Show Password"
name="eye-outline"></ion-icon>
<ion-icon class="oh-passowrd-input__hide-icon d-none" title="Hide Password"
name="eye-off-outline"></ion-icon>
</button>
</div>
</div>
</div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="oh-input-group">
<label class="oh-label" for="confirmPassword">{% trans "Confirm Password" %}</label>
<div class="oh-password-input-container">
<input type="password" id="confirmPassword" name="confirm_password" class="oh-input oh-input--password w-100"
placeholder="Use alphanumeric characters" required />
<button type="button" class="oh-btn oh-btn--transparent oh-password-input--toggle">
<ion-icon class="oh-passowrd-input__show-icon" title="Show Password"
name="eye-outline"></ion-icon>
<ion-icon class="oh-passowrd-input__hide-icon d-none" title="Hide Password"
name="eye-off-outline"></ion-icon>
</button>
</div>
</div>
</div>
</div>
<button type="submit" class="oh-btn oh-onboarding-card__button mt-4 oh-btn--secondary oh-btn--shadow w-100 mb-4" id="formButton">
<ion-icon class="me-2" name="lock-closed-outline"></ion-icon>
{% trans "Secure Sign-up" %}
</button>
</form> </form>
<script> <script>
$(document).ready(function (e) { $(document).ready(function (e) {
function checkPasswordsMatch() {
const password = $("#adminPassword").val();
const confirmPassword = $("#confirmPassword").val();
if (password !== confirmPassword) {
$("#passwordError").text("Passwords do not match").show();
return false;
} else {
$("#passwordError").hide();
return true;
}
}
$("#adminPassword, #confirmPassword").on("keyup", function () {
checkPasswordsMatch();
});
$("#formButton").click(function (e) {
if (!checkPasswordsMatch()) {
e.preventDefault();
}
});
$(".oh-password-input--toggle").click(function () { $(".oh-password-input--toggle").click(function () {
var passwordInput = $("#adminPassword") var passwordInput = $(this).closest('div').find("input[type='password']");
if(passwordInput.length === 0){
passwordInput = $(this).closest('div').find("input[type='text']");
}
var showIcon = $(this).find(".oh-passowrd-input__show-icon"); var showIcon = $(this).find(".oh-passowrd-input__show-icon");
var hideIcon = $(this).find(".oh-passowrd-input__hide-icon"); var hideIcon = $(this).find(".oh-passowrd-input__hide-icon");
if (passwordInput.attr("type") === "password") { if (passwordInput.attr("type") === "password") {