[UPDT] LEAVE: Toggle column on assigned leave group by
This commit is contained in:
Horilla
@@ -1,8 +1,20 @@
|
||||
{% load i18n %} {% load static %} {% load basefilters %}
|
||||
<!-- Sticky Table -->
|
||||
{% include 'filter_tags.html' %}
|
||||
<div class="oh-sticky-table">
|
||||
<div class="oh-sticky-table__table oh-table--sortable">
|
||||
<div class="oh-table_sticky--wrapper" id="ot-table">
|
||||
<div class="oh-sticky-dropdown--header">
|
||||
<div class="oh-dropdown" x-data="{open: false}">
|
||||
<button class="oh-sticky-dropdown_btn " @click="open = !open"><ion-icon name="ellipsis-vertical-sharp"
|
||||
role="img" class="md hydrated" aria-label="ellipsis vertical sharp"></ion-icon></button>
|
||||
<div class="oh-dropdown__menu oh-sticky-table_dropdown" x-show="open" @click.outside="open = false">
|
||||
<ul class="oh-dropdown__items" id="fieldContainerTable">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: none;" id='overtime-table' data-table-name="attendance_account_table">
|
||||
<div class="oh-sticky-table">
|
||||
<div class="oh-sticky-table__table oh-table--sortable">
|
||||
<div class="oh-sticky-table__thead">
|
||||
<div class="oh-sticky-table__tr">
|
||||
<div class="oh-sticky-table__th" style="width: 10px">
|
||||
@@ -11,120 +23,121 @@
|
||||
class="oh-input oh-input__checkbox all-assigned-leaves" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'employee_id__employee_first_name' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=employee_id__employee_first_name" >{% trans "Employee" %}</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'leave_type_id' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=leave_type_id" >{% trans "Leave Type" %}</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'available_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=available_days" >{% trans "Available Days" %}</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'carryforward_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=carryforward_days" >{% trans "Carryforward Days" %}</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'total_leave_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=total_leave_days" >{% trans "Total Leave Days" %}</div>
|
||||
<div class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'assigned_date' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=assigned_date" >{% trans "Assigned Date" %}</div>
|
||||
<div data-cell-index="1" data-cell-title="{% trans "Employee" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'employee_id__employee_first_name' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=employee_id__employee_first_name" >{% trans "Employee" %}</div>
|
||||
<div data-cell-index="2" data-cell-title="{% trans "Leave Type" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'leave_type_id' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=leave_type_id" >{% trans "Leave Type" %}</div>
|
||||
<div data-cell-index="3" data-cell-title="{% trans "Available Days" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'available_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=available_days" >{% trans "Available Days" %}</div>
|
||||
<div data-cell-index="4" data-cell-title="{% trans "Carryforward Days" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'carryforward_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=carryforward_days" >{% trans "Carryforward Days" %}</div>
|
||||
<div data-cell-index="5" data-cell-title="{% trans "Leave Days" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'total_leave_days' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=total_leave_days" >{% trans "Total Leave Days" %}</div>
|
||||
<div data-cell-index="6" data-cell-title="{% trans "Assigned Date" %}" class="oh-sticky-table__th {% if request.sort_option.order == '-employee_id__employee_first_name' %}arrow-up {% elif request.sort_option.order == 'assigned_date' %}arrow-down {% else %}arrow-up-down {% endif %}" hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&sortby=assigned_date" >{% trans "Assigned Date" %}</div>
|
||||
{% if perms.leave.change_availableleave or perms.leave.delete_availableleave or request.user|is_reportingmanager %}
|
||||
<div class="oh-sticky-table__th">{% trans "Actions" %}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__tbody">
|
||||
{% for available_leave in available_leaves %}
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-sticky-table__sd">
|
||||
<div class="centered-div">
|
||||
<input type="checkbox" id="{{available_leave.id}}" onchange="highlightRow($(this))"
|
||||
class="oh-input assigned-leaves-checkbox oh-input__checkbox all-assigned-leaves-row" />
|
||||
</div>
|
||||
{% for available_leave in available_leaves %}
|
||||
<div class="oh-sticky-table__tr" draggable="true">
|
||||
<div class="oh-sticky-table__sd">
|
||||
<div class="centered-div">
|
||||
<input type="checkbox" id="{{available_leave.id}}" onchange="highlightRow($(this))"
|
||||
class="oh-input assigned-leaves-checkbox oh-input__checkbox all-assigned-leaves-row" />
|
||||
</div>
|
||||
<div class="oh-sticky-table__td">
|
||||
<div class="oh-profile oh-profile--md">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="{{available_leave.employee_id.get_avatar}}"
|
||||
class="oh-profile__image" alt="Mary Magdalene" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">{{available_leave.employee_id}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__td">{{available_leave.leave_type_id}}</div>
|
||||
<div class="oh-sticky-table__td">{{available_leave.available_days}}</div>
|
||||
<div class="oh-sticky-table__td">{{available_leave.carryforward_days}}</div>
|
||||
<div class="oh-sticky-table__td">{{available_leave.total_leave_days}}</div>
|
||||
<div class="oh-sticky-table__td dateformat_changer">{{available_leave.assigned_date}}</div>
|
||||
{% if perms.leave.change_availableleave or perms.leave.delete_availableleave or request.user|is_reportingmanager %}
|
||||
<div class="oh-sticky-table__td">
|
||||
<div class="oh-btn-group">
|
||||
{% if request.user|is_reportingmanager or perms.leave.change_availableleave %}
|
||||
<button class="oh-btn oh-btn--light-bkg w-100" title="{% trans 'Edit' %}" data-toggle="oh-modal-toggle"
|
||||
data-target="#editModal1" hx-get="{% url 'available-leave-update' available_leave.id %}"
|
||||
hx-target="#leaveForm"><ion-icon name="create-outline"></ion-icon></button>
|
||||
{% endif %}
|
||||
{% if request.user|is_reportingmanager or perms.leave.delete_availableleave %}
|
||||
<a class="oh-btn oh-btn--danger-outline oh-btn--light-bkg w-100" onclick="return confirm('{% trans "Are you sure you want to delete ?" %}');" id="delete-link"
|
||||
href="{% url 'assign-delete' available_leave.id %}" title="{% trans 'Delete' %}"><ion-icon
|
||||
name="trash-outline"></ion-icon></a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div data-cell-index="1" class="oh-sticky-table__td">
|
||||
<div class="oh-profile oh-profile--md">
|
||||
<div class="oh-profile__avatar mr-1">
|
||||
<img src="{{available_leave.employee_id.get_avatar}}"
|
||||
class="oh-profile__image" alt="Mary Magdalene" />
|
||||
</div>
|
||||
<span class="oh-profile__name oh-text--dark">{{available_leave.employee_id}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div data-cell-index="2" class="oh-sticky-table__td">{{available_leave.leave_type_id}}</div>
|
||||
<div data-cell-index="3" class="oh-sticky-table__td">{{available_leave.available_days}}</div>
|
||||
<div data-cell-index="4" class="oh-sticky-table__td">{{available_leave.carryforward_days}}</div>
|
||||
<div data-cell-index="5" class="oh-sticky-table__td">{{available_leave.total_leave_days}}</div>
|
||||
<div data-cell-index="6" class="oh-sticky-table__td dateformat_changer">{{available_leave.assigned_date}}</div>
|
||||
{% if perms.leave.change_availableleave or perms.leave.delete_availableleave or request.user|is_reportingmanager %}
|
||||
<div class="oh-sticky-table__td">
|
||||
<div class="oh-btn-group">
|
||||
{% if request.user|is_reportingmanager or perms.leave.change_availableleave %}
|
||||
<button class="oh-btn oh-btn--light-bkg w-100" title="{% trans 'Edit' %}" data-toggle="oh-modal-toggle"
|
||||
data-target="#editModal1" hx-get="{% url 'available-leave-update' available_leave.id %}"
|
||||
hx-target="#leaveForm"><ion-icon name="create-outline"></ion-icon></button>
|
||||
{% endif %}
|
||||
{% if request.user|is_reportingmanager or perms.leave.delete_availableleave %}
|
||||
<a class="oh-btn oh-btn--danger-outline oh-btn--light-bkg w-100" onclick="return confirm('{% trans "Are you sure you want to delete ?" %}');" id="delete-link"
|
||||
href="{% url 'assign-delete' available_leave.id %}" title="{% trans 'Delete' %}"><ion-icon
|
||||
name="trash-outline"></ion-icon></a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End of Sticky Table -->
|
||||
<div class="oh-pagination">
|
||||
<span class="oh-pagination__page">
|
||||
{% trans "Page" %} {{ available_leaves.number }} {% trans "of" %} {{ available_leaves.paginator.num_pages }}.
|
||||
</span>
|
||||
<nav class="oh-pagination__nav">
|
||||
<div class="oh-pagination__input-container me-3">
|
||||
<span class="oh-pagination__label me-1">{% trans "Page" %}</span>
|
||||
<input type="number" name="page" class="oh-pagination__input" value="{{available_leaves.number}}"
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}" hx-target="#assignedLeaves" min="1" />
|
||||
<span class="oh-pagination__label">{% trans "of" %} {{available_leaves.paginator.num_pages}}</span>
|
||||
</div>
|
||||
<ul class="oh-pagination__items">
|
||||
{% if available_leaves.has_previous %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&page=1"
|
||||
class="oh-pagination__link">{% trans "First" %}</a>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.previous_page_number }}"
|
||||
class="oh-pagination__link">{% trans "Previous" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if available_leaves.has_next %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.next_page_number }}"
|
||||
class="oh-pagination__link">{% trans "Next" %}</a>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.paginator.num_pages }}"
|
||||
class="oh-pagination__link">{% trans "Last" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
<div class="oh-pagination">
|
||||
<span class="oh-pagination__page">
|
||||
{% trans "Page" %} {{ available_leaves.number }} {% trans "of" %} {{ available_leaves.paginator.num_pages }}.
|
||||
</span>
|
||||
<nav class="oh-pagination__nav">
|
||||
<div class="oh-pagination__input-container me-3">
|
||||
<span class="oh-pagination__label me-1">{% trans "Page" %}</span>
|
||||
<input type="number" name="page" class="oh-pagination__input" value="{{available_leaves.number}}"
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}" hx-target="#assignedLeaves" min="1" />
|
||||
<span class="oh-pagination__label">{% trans "of" %} {{available_leaves.paginator.num_pages}}</span>
|
||||
</div>
|
||||
<ul class="oh-pagination__items">
|
||||
{% if available_leaves.has_previous %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves' hx-get="{% url 'assign-filter' %}?{{pd}}&page=1"
|
||||
class="oh-pagination__link">{% trans "First" %}</a>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.previous_page_number }}"
|
||||
class="oh-pagination__link">{% trans "Previous" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if available_leaves.has_next %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.next_page_number }}"
|
||||
class="oh-pagination__link">{% trans "Next" %}</a>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a hx-target='#assignedLeaves'
|
||||
hx-get="{% url 'assign-filter' %}?{{pd}}&page={{ available_leaves.paginator.num_pages }}"
|
||||
class="oh-pagination__link">{% trans "Last" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$(document).ready(function () {
|
||||
tickLeaveCheckboxes();
|
||||
toggleColumns("overtime-table","fieldContainerTable")
|
||||
|
||||
|
||||
$(".all-assigned-leaves-row").change(function () {
|
||||
addingAssignedLeaveIds();
|
||||
addingAssignedLeaveIds();
|
||||
});
|
||||
|
||||
$(".all-assigned-leaves").change(function () {
|
||||
var is_checked = $(this).is(":checked");
|
||||
if (is_checked) {
|
||||
var is_checked = $(this).is(":checked");
|
||||
if (is_checked) {
|
||||
$(".all-assigned-leaves-row").prop("checked", true).closest(".oh-sticky-table__tr").addClass("highlight-selected");
|
||||
} else {
|
||||
} else {
|
||||
$(".all-assigned-leaves-row").prop("checked", false).closest(".oh-sticky-table__tr").removeClass("highlight-selected");
|
||||
}
|
||||
addingAssignedLeaveIds();
|
||||
}
|
||||
addingAssignedLeaveIds();
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user