[UPDT] OFFBOARDING: Changed modals to objectDetailsModal

This commit is contained in:
Horilla
2024-03-06 20:50:03 +05:30
parent 99edbd379e
commit a40fae1fee
9 changed files with 164 additions and 128 deletions

View File

@@ -1,3 +1,11 @@
<form id="offboardingEmployeeForm" hx-post="{% url 'add-employee' %}?stage_id={{ form.instance.stage_id.id }}&instance_id={{ form.instance.pk }}">
{{ form.as_p }}
</form>
<div class="oh-modal__dialog" style="max-width: 550px">
<div class="oh-modal__dialog-header">
<button type="button" class="oh-modal__close" aria-label="Close"><ion-icon name="close-outline"></ion-icon></button>
</div>
<div class="oh-modal__dialog-body">
<form id="offboardingEmployeeForm" hx-post="{% url 'add-employee' %}?stage_id={{ form.instance.stage_id.id }}&instance_id={{ form.instance.pk }}">
{{ form.as_p }}
</form>
</div>
</div>

View File

@@ -1,3 +1,11 @@
<form hx-post="{% url "create-offboarding" %}?instance_id={{form.instance.id}}">
{{form.as_p}}
</form>
<div class="oh-modal__dialog" style="max-width: 550px">
<div class="oh-modal__dialog-header">
<button type="button" class="oh-modal__close" aria-label="Close"><ion-icon name="close-outline"></ion-icon></button>
</div>
<div class="oh-modal__dialog-body">
<form hx-post="{% url "create-offboarding" %}?instance_id={{form.instance.id}}">
{{form.as_p}}
</form>
</div>
</div>

View File

@@ -1,93 +1,107 @@
{% load i18n %} {% load offboarding_filter %}
{% if request.GET.requests_ids %}
<div class="oh-modal__dialog oh-modal__dialog--navigation m-0 p-0">
<button hx-get="{% url "offboarding-individual-view" previous %}?requests_ids={{requests_ids}}" hx-target = "#singleView" class="oh-modal__diaglog-nav oh-modal__nav-prev">
<ion-icon name="chevron-back-outline" class="md hydrated" role="img"
aria-label="chevron back outline"></ion-icon>
</button>
<button hx-get="{% url "offboarding-individual-view" next %}?requests_ids={{requests_ids}}" hx-target = "#singleView" class="oh-modal__diaglog-nav oh-modal__nav-next">
<ion-icon name="chevron-forward-outline" class="md hydrated" role="img"
aria-label="chevron forward outline"></ion-icon>
</button>
</div>
{% endif %}
<div class="oh-modal__dialog-body oh-timeoff-modal__body">
<div class="oh-timeoff-modal__profile-content">
<div class="oh-profile">
<div class="oh-profile-section__edit-photo me-3" style="width: 80px; height: 80px;" >
<img src="{{employee.employee_id.get_avatar}}"
class="oh-profile-section__modal-image" alt="" />
<div class="oh-modal__dialog ">
<div class="oh-modal__dialog-header">
<h2 class="oh-modal__dialog-title" id="">
{% trans "Details" %}
</h2>
<button class="oh-modal__close" aria-label="Close">
<ion-icon name="close-outline"></ion-icon>
</button>
</div>
<div class="oh-modal__dialog-relative">
{% if request.GET.requests_ids %}
<div class="oh-modal__dialog oh-modal__dialog--navigation m-0 p-0">
<button hx-get="{% url "offboarding-individual-view" previous %}?requests_ids={{requests_ids}}" hx-target = "#objectDetailsModalTarget" class="oh-modal__diaglog-nav oh-modal__nav-prev">
<ion-icon name="chevron-back-outline" class="md hydrated" role="img"
aria-label="chevron back outline"></ion-icon>
</button>
<button hx-get="{% url "offboarding-individual-view" next %}?requests_ids={{requests_ids}}" hx-target = "#objectDetailsModalTarget" class="oh-modal__diaglog-nav oh-modal__nav-next">
<ion-icon name="chevron-forward-outline" class="md hydrated" role="img"
aria-label="chevron forward outline"></ion-icon>
</button>
</div>
<div >
<a class="oh-timeoff-modal__profile-content" style="text-decoration:none;"
href ="{% url 'employee-view-individual' employee.employee_id.id %}">
<div class="oh-timeoff-modal__profile-info mb-2">
<span class="oh-timeoff-modal__user fw-bold">{{employee.employee_id}}</span>
<span class="oh-timeoff-modal__position">{{employee.employee_id.employee_work_info.department_id}} / {{employee.employee_id.employee_work_info.job_position_id}}</span>
{% endif %}
<div class="oh-modal__dialog-body oh-timeoff-modal__body">
<div class="oh-timeoff-modal__profile-content">
<div class="oh-profile">
<div class="oh-profile-section__edit-photo me-3" style="width: 80px; height: 80px;" >
<img src="{{employee.employee_id.get_avatar}}"
class="oh-profile-section__modal-image" alt="" />
</div>
</a>
</div>
</div>
</div>
<div class="oh-timeoff-modal__stats-container">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Email" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.email}}</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Job Position" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.get_job_position}}</span>
</div>
</div>
<div class="oh-timeoff-modal__stats-container mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Contact" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.employee_work_info.mobile}}</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Notice Period start Date" %}</span>
<span class="oh-timeoff-modal__stat-count dateformat_changer">{{employee.notice_period_starts}}</span>
</div>
</div>
<div class="oh-timeoff-modal__stats-container mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Notice Period end Date" %}</span>
<span class="oh-timeoff-modal__stat-count dateformat_changer">
{{employee.notice_period_ends}}
</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Stage" %}</span>
<span class="oh-timeoff-modal__stat-count">
<form id="vla" hx-get="{% url "offboarding-change-stage" %}?employee_ids={{employee.id}}"
hx-target="#offboardingBody{{employee.stage_id.offboarding_id.id}}">
{{ stage_forms|individual_view_stages:employee.stage_id }}
<input type="submit" hidden />
</form>
</span>
</div>
</div>
{% if employee.employeetask_set.all %}
<div class="oh-timeoff-modal__stats w-100 mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-count">{% trans "Tasks" %}</span>
<div class="row ms-2">
{% for task in employee.employeetask_set.all %}
<div class="col-6 ps-0 pb-1">
<div class="oh-timeoff-modal__stat-title mb-1 "><span class="oh-dot oh-dot--small me-1 oh-dot--color-{{task.status}}"></span>{{task.task_id.title}} </div>
<div class="" id="task{{task.id}}{{employee.id}}">
{% include 'offboarding/pipeline/employee_task.html' %}
</div>
<div >
<a class="oh-timeoff-modal__profile-content" style="text-decoration:none;"
href ="{% url 'employee-view-individual' employee.employee_id.id %}">
<div class="oh-timeoff-modal__profile-info mb-2">
<span class="oh-timeoff-modal__user fw-bold">{{employee.employee_id}}</span>
<span class="oh-timeoff-modal__position">{{employee.employee_id.employee_work_info.department_id}} / {{employee.employee_id.employee_work_info.job_position_id}}</span>
</div>
</a>
</div>
{% endfor %}
</div>
</div>
<div class="oh-timeoff-modal__stats-container">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Email" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.email}}</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Job Position" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.get_job_position}}</span>
</div>
</div>
<div class="oh-timeoff-modal__stats-container mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Contact" %}</span>
<span class="oh-timeoff-modal__stat-count">{{employee.employee_id.employee_work_info.mobile}}</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Notice Period start Date" %}</span>
<span class="oh-timeoff-modal__stat-count dateformat_changer">{{employee.notice_period_starts}}</span>
</div>
</div>
<div class="oh-timeoff-modal__stats-container mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Notice Period end Date" %}</span>
<span class="oh-timeoff-modal__stat-count dateformat_changer">
{{employee.notice_period_ends}}
</span>
</div>
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-title">{% trans "Stage" %}</span>
<span class="oh-timeoff-modal__stat-count">
<form id="vla" hx-get="{% url "offboarding-change-stage" %}?employee_ids={{employee.id}}"
hx-target="#offboardingBody{{employee.stage_id.offboarding_id.id}}">
{{ stage_forms|individual_view_stages:employee.stage_id }}
<input type="submit" hidden />
</form>
</span>
</div>
</div>
{% if employee.employeetask_set.all %}
<div class="oh-timeoff-modal__stats w-100 mt-3">
<div class="oh-timeoff-modal__stat">
<span class="oh-timeoff-modal__stat-count">{% trans "Tasks" %}</span>
<div class="row ms-2">
{% for task in employee.employeetask_set.all %}
<div class="col-6 ps-0 pb-1">
<div class="oh-timeoff-modal__stat-title mb-1 "><span class="oh-dot oh-dot--small me-1 oh-dot--color-{{task.status}}"></span>{{task.task_id.title}} </div>
<div class="" id="task{{task.id}}{{employee.id}}">
{% include 'offboarding/pipeline/employee_task.html' %}
</div>
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
</div>
</div>
{% endif %}
</div>
<script>

View File

@@ -14,7 +14,7 @@
{% if perms.offboarding.add_offboarding %}
<div class="oh-main__titlebar-button-container">
<div class="oh-main__titlebar-button-container">
<a hx-get="{% url 'create-offboarding' %}" hx-target="#offboardingModalBody" data-toggle="oh-modal-toggle" data-target="#offboardingModal" class="oh-btn oh-btn--secondary">
<a hx-get="{% url 'create-offboarding' %}" hx-target="#objectDetailsModalTarget" data-toggle="oh-modal-toggle" data-target="#objectDetailsModal" class="oh-btn oh-btn--secondary">
<ion-icon name="add-outline"></ion-icon>
{% trans 'Create' %}
</a>

View File

@@ -56,7 +56,6 @@
}
</script>
<div id="managerIn"></div>
<div id="messages" class="oh-alert-container"></div>
<div class="oh-wrapper">
<div class="oh-tabs" onclick="switchTab(event)">
@@ -79,7 +78,7 @@
<ul class="oh-dropdown__items">
{% if perms.offboarding.change_offboarding or request.user.employee_get|is_offboarding_manager %}
<li class="oh-dropdown__item">
<a hx-get="{% url "create-offboarding" %}?instance_id={{offboarding.offboarding.id}}" hx-target="#offboardingModalBody" data-toggle="oh-modal-toggle" data-target="#offboardingModal" class="oh-dropdown__link">{% trans "Edit" %}</a>
<a hx-get="{% url "create-offboarding" %}?instance_id={{offboarding.offboarding.id}}" hx-target="#objectDetailsModalTarget" data-toggle="oh-modal-toggle" data-target="#objectDetailsModal" class="oh-dropdown__link">{% trans "Edit" %}</a>
</li>
{% endif %}
{% if perms.offboarding.delete_offboarding %}
@@ -105,7 +104,7 @@
{% if perms.offboarding.view_offboarding or request.user.employee_get|is_in_offboarding:offboarding %}
<div class="oh-tabs__content" id="Offboarding{{ offboarding.offboarding.id }}">
{% if perms.offboarding.add_offboardingstage or request.user.employee_get|any_manager %}
<a hx-get="{% url 'create-offboarding-stage' %}?offboarding_id={{offboarding.offboarding.id}}" style="width: 100px;" hx-target="#offboardingModalBody" data-toggle="oh-modal-toggle" data-target="#offboardingModal" class="mb-3 oh-btn oh-btn--secondary">
<a hx-get="{% url 'create-offboarding-stage' %}?offboarding_id={{offboarding.offboarding.id}}" style="width: 100px;" hx-target="#objectDetailsModalTarget" data-toggle="oh-modal-toggle" data-target="#objectDetailsModal" class="mb-3 oh-btn oh-btn--secondary">
<ion-icon name="add-outline"></ion-icon>
{% trans 'Stage' %}
</a>
@@ -118,24 +117,6 @@
</div>
</div>
<div class="oh-modal" id="singleModal" role="dialog" aria-labelledby="singleModalModal" aria-hidden="true">
<div class="oh-modal__dialog ">
<div class="oh-modal__dialog-header">
<h2 class="oh-modal__dialog-title" id="">
{% trans "Details" %}
</h2>
<button class="oh-modal__close" aria-label="Close">
<ion-icon name="close-outline"></ion-icon>
</button>
</div>
<div class="oh-modal__dialog-relative" id="singleView">
</div>
</div>
</div>
<script>
let activeTab = localStorage.getItem("activeTabOffboarding")
if (activeTab) {

View File

@@ -1,3 +1,11 @@
<form hx-post="{% url 'create-offboarding-stage' %}?offboarding_id={{ form.instance.offboarding_id.id }}&instance_id={{ form.instance.pk }}">
{{ form.as_p }}
</form>
<div class="oh-modal__dialog" style="max-width: 550px">
<div class="oh-modal__dialog-header">
<button type="button" class="oh-modal__close" aria-label="Close"><ion-icon name="close-outline"></ion-icon></button>
</div>
<div class="oh-modal__dialog-body">
<form hx-post="{% url 'create-offboarding-stage' %}?offboarding_id={{ form.instance.offboarding_id.id }}&instance_id={{ form.instance.pk }}">
{{ form.as_p }}
</form>
</div>
</div>

View File

@@ -1,4 +1,9 @@
{% load i18n offboarding_filter %}
<style>
.oh-dropdown__menu {
z-index:20
}
</style>
{% for stage in offboarding.offboarding.stages %}
<div class="oh-accordion-meta" id="accordion{{stage.id}}">
<div class="oh-accordion-meta__item">
@@ -23,8 +28,8 @@
<ul class="oh-dropdown__items">
{% if perms.offboarding.add_offboardingemployee or request.user.employee_get|any_manager %}
<li class="oh-dropdown__item">
<a hx-get="{% url "add-employee" %}?stage_id={{stage.grouper.id}}" data-target="#offboardingModal"
data-toggle="oh-modal-toggle" hx-target="#offboardingModalBody" class="oh-dropdown__link">
<a hx-get="{% url "add-employee" %}?stage_id={{stage.grouper.id}}" data-target="#objectDetailsModal"
data-toggle="oh-modal-toggle" hx-target="#objectDetailsModalTarget" class="oh-dropdown__link">
{% trans "Add Employee" %}</a>
</li>
{% endif %}
@@ -32,8 +37,8 @@
<li class="oh-dropdown__item">
<a
hx-get="{% url "create-offboarding-stage" %}?offboarding_id={{offboarding.offboarding.id}}&instance_id={{stage.grouper.id}}"
data-target="#offboardingModal"
data-toggle="oh-modal-toggle" hx-target="#offboardingModalBody" class="oh-dropdown__link">{% trans "Edit" %}</a>
data-target="#objectDetailsModal"
data-toggle="oh-modal-toggle" hx-target="#objectDetailsModalTarget" class="oh-dropdown__link">{% trans "Edit" %}</a>
</li>
{% endif %}
{% if perms.offboarding.delete_offboarding %}
@@ -76,7 +81,7 @@
<div class="oh-dropdown__menu oh-dropdown__menu--right" x-show="open" style="text-align: left !important; display: none;">
<ul class="oh-dropdown__items">
<li class="oh-dropdown__item">
<a class="oh-dropdown__link" hx-get="{% url "offboarding-add-task" %}?stage_id={{stage.grouper.id}}&instance_id={{task.id}}" hx-target="#offboardingModalBody" data-toggle="oh-modal-toggle" data-target="#offboardingModal">{% trans "Edit" %}
<a class="oh-dropdown__link" hx-get="{% url "offboarding-add-task" %}?stage_id={{stage.grouper.id}}&instance_id={{task.id}}" hx-target="#objectDetailsModalTarget" data-toggle="oh-modal-toggle" data-target="#objectDetailsModal">{% trans "Edit" %}
</a>
</li> <li class="oh-dropdown__item">
<a class="oh-dropdown__link oh-dropdown__link--danger" href="{% url 'delete-offboarding-task' %}?task_ids={{task.id}}" title="{% trans "Delete" %}" onclick="event.stopPropagation();return confirm('Do you want to delete task?')">Delete</a>
@@ -90,7 +95,7 @@
{% endfor %}
<div class="oh-sticky-table__th" style="width: 120px;">
{% if perms.offboarding.add_offboardingtask or request.user.employee_get|any_manager %}
<button class="oh-checkpoint-badge text-success" data-toggle="oh-modal-toggle" data-target="#offboardingModal" hx-get="{% url "offboarding-add-task" %}?stage_id={{stage.grouper.id}}" hx-target="#offboardingModalBody">
<button class="oh-checkpoint-badge text-success" data-toggle="oh-modal-toggle" data-target="#objectDetailsModal" hx-get="{% url "offboarding-add-task" %}?stage_id={{stage.grouper.id}}" hx-target="#objectDetailsModalTarget">
{% trans "Add Task" %}
</button>
{% endif %}

View File

@@ -1,6 +1,14 @@
<form hx-post="{% url "offboarding-add-task" %}?instance_id={{form.instance.pk}}&stage_id={{form.initial.stage_id}}" hx-target="#offboardingModalBody">
{{form.as_p}}
</form>
<div class="oh-modal__dialog" style="max-width: 550px">
<div class="oh-modal__dialog-header">
<button type="button" class="oh-modal__close" aria-label="Close"><ion-icon name="close-outline"></ion-icon></button>
</div>
<div class="oh-modal__dialog-body">
<form hx-post="{% url "offboarding-add-task" %}?instance_id={{form.instance.pk}}&stage_id={{form.initial.stage_id}}" hx-target="#objectDetailsModalTarget">
{{form.as_p}}
</form>
</div>
</div>
<script>
$(".col-md-6").removeClass("col-md-6");

View File

@@ -11,9 +11,9 @@
data-employee="{{employee.employee_id.get_full_name}}"
data-employee-id="{{ employee.id }}"
hx-get='{% url "offboarding-individual-view" employee.id %}?requests_ids={{offboarding.employee_ids}}'
hx-target='#singleView'
hx-target='#objectDetailsModalTarget'
data-toggle = 'oh-modal-toggle'
data-target="#singleModal"
data-target="#objectDetailsModal"
>
<div class="oh-sticky-table__sd">
<div class="oh-profile oh-profile--md">
@@ -78,7 +78,9 @@
<a
type="button"
hx-get="{% url 'employee-archive' employee.employee_id.id %}"
hx-target="#managerIn"
hx-target="#objectDetailsModalTarget"
data-toggle="oh-modal-toggle"
data-target="#objectDetailsModal"
title="{% if not employee.employee_id.is_active %}{% trans 'Un Archive' %} {% else %} {% trans 'Archive' %}{% endif %}"
class="oh-btn oh-btn--light tex-primary"
style="flex: 1 0 auto; width: 20px; height: 40.68px; padding: 0"
@@ -89,9 +91,9 @@
<a
type="button"
hx-get="{% url "add-employee" %}?instance_id={{employee.id}}&stage_id={{stage.grouper.id}}"
hx-target="#offboardingModalBody"
hx-target="#objectDetailsModalTarget"
data-toggle="oh-modal-toggle"
data-target="#offboardingModal"
data-target="#objectDetailsModal"
title="{% trans 'Edit' %}"
class="oh-btn oh-btn--light tex-primary"
style="flex: 1 0 auto; width: 20px; height: 40.68px; padding: 0"
@@ -104,7 +106,9 @@
type="button"
title="{% trans 'Show managing records' %}"
hx-get="{% url 'get-manager-in' %}?employee_id={{employee.employee_id.id}}"
hx-target="#managerIn"
hx-target="#objectDetailsModalTarget"
data-toggle="oh-modal-toggle"
data-target="#objectDetailsModal"
class="oh-btn oh-btn--light tex-primary"
style="flex: 1 0 auto; width: 20px; height: 40.68px; padding: 0"
onclick="event.stopPropagation()"