[UPDT] LEAVE: Updated department chart and leave chart to change with selected month
This commit is contained in:
@@ -19,6 +19,8 @@ $(document).ready(function () {
|
||||
year = today.getFullYear();
|
||||
$(".month").val(`${year}-${month}`);
|
||||
$("#dash_month").val(`${year}-${month}`);
|
||||
$("#dash_department_month").val(`${year}-${month}`);
|
||||
$("#dash_leave_type_month").val(`${year}-${month}`);
|
||||
|
||||
function isChartEmpty(chartData) {
|
||||
if (!chartData) {
|
||||
@@ -189,7 +191,7 @@ $(document).ready(function () {
|
||||
$("#employee_leave_canvas").html(
|
||||
`<div style="height: 380px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/attendance.png" class="" alt=""/>
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/attendance.png" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">${response.message}</h3>
|
||||
</div>
|
||||
</div>`
|
||||
@@ -213,7 +215,7 @@ $(document).ready(function () {
|
||||
$("#availableLeaveContainer").html(
|
||||
`<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/sunbed outline.png" class="" alt=""/>
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/sunbed outline.png" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">${response.message}</h3>
|
||||
</div>
|
||||
</div>`
|
||||
@@ -280,7 +282,7 @@ $(document).ready(function () {
|
||||
$("#employee_leave_canvas").html(
|
||||
`<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/attendance.png" class="" alt=""/>
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/attendance.png" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">${response.message}</h3>
|
||||
</div>
|
||||
</div>`
|
||||
@@ -383,4 +385,68 @@ $(document).ready(function () {
|
||||
});
|
||||
});
|
||||
|
||||
$("#dash_department_month").on("change", function () {
|
||||
let month = $(this).val();
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "/leave/department-leave-chart",
|
||||
dataType: "json",
|
||||
data: {
|
||||
date: month,
|
||||
},
|
||||
success: function (response) {
|
||||
if (isChartEmpty(response.dataset)) {
|
||||
$("#department_leave_canvas").html(
|
||||
`<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/attendance.png" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">${response.message}</h3>
|
||||
</div>
|
||||
</div>`
|
||||
);
|
||||
} else {
|
||||
$("#department_leave_canvas").html(
|
||||
'<canvas id="departmentLeave" class="pointer"></canvas>'
|
||||
);
|
||||
department_leave_chart(response);
|
||||
}
|
||||
},
|
||||
error: (error) => {
|
||||
console.log("Error", error);
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
$("#dash_leave_type_month").on("change", function () {
|
||||
let month = $(this).val();
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "/leave/leave-type-chart",
|
||||
dataType: "json",
|
||||
data: {
|
||||
date: month,
|
||||
},
|
||||
success: function (response) {
|
||||
if (isChartEmpty(response.dataset)) {
|
||||
$("#leave_type_canvas").html(
|
||||
`<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="/static/images/ui/leave_types.png" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">${response.message}</h3>
|
||||
</div>
|
||||
</div>`
|
||||
);
|
||||
} else {
|
||||
$("#leave_type_canvas").html(
|
||||
'<canvas id="leaveType" class="pointer"></canvas>'
|
||||
);
|
||||
leave_type_chart(response);
|
||||
}
|
||||
},
|
||||
error: (error) => {
|
||||
console.log("Error", error);
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@@ -79,7 +79,9 @@
|
||||
<span class="oh-card-dashboard__title">{% trans "Employee Leaves" %}</span>
|
||||
<span class="oh-card-dashboard__title float-end pointer" id="employee-next" title="{% trans "next" %}"><ion-icon name="caret-forward"></ion-icon></span>
|
||||
</div>
|
||||
<input type="month" class="mb-2 float-end pointer" name="" id="dash_month" />
|
||||
<div class="d-flex flex-row-reverse">
|
||||
<input type="month" class="mb-2 float-end pointer" name="" id="dash_month" />
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body" id="employee_leave_canvas">
|
||||
<canvas id="employeeLeave" class="pointer"></canvas>
|
||||
</div>
|
||||
@@ -87,7 +89,6 @@
|
||||
</div>
|
||||
<div class="col-12 col-sm-12 col-md-12 col-lg-4 mt-2" style = "height:400px">
|
||||
<div class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent">
|
||||
|
||||
<div class="oh-card-dashboard__header oh-card-dashboard__header--divider">
|
||||
<span class="oh-card-dashboard__title">{% trans "On Leave" %}</span>
|
||||
</div>
|
||||
@@ -115,8 +116,7 @@
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">{% trans "Today is a holiday." %}</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
{% else %}
|
||||
<div style="height: 380px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style="display: block;width: 70px;margin: 10px auto ;" src="{% static 'images/ui/attendance.png' %}" class="" alt=""/>
|
||||
@@ -126,7 +126,6 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-dashboard__right col-12 col-sm-12 col-md-12 col-lg-3">
|
||||
@@ -154,7 +153,7 @@
|
||||
<span class="oh-dashboard__event-title">{% trans "Next Holiday" %}</span>
|
||||
<span class="oh-dashboard__event-main">{{next_holiday.name}}</span>
|
||||
<span class="dateformat_changer oh-dashboard__event-date">{{next_holiday.start_date}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -191,9 +190,7 @@
|
||||
<span class="oh-card-dashboard__title">{% trans "Department Leaves" %}</span>
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body">
|
||||
{% if leave_today_employees %}
|
||||
<canvas id="departmentLeave" class="pointer"></canvas>
|
||||
{% elif current_date == next_holiday.start_date|date:"Y-m-d" %}
|
||||
{% if current_date == next_holiday.start_date|date:"Y-m-d" %}
|
||||
<div style="height: 380px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 20px auto ;" src="{% static 'images/ui/sunbed outline.png' %}" class="" alt=""/>
|
||||
@@ -201,11 +198,11 @@
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 10px auto ;" src="{% static 'images/ui/attendance.png' %}" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">{% trans "No leave requests for today." %}</h3>
|
||||
</div>
|
||||
<div class="d-flex flex-row-reverse">
|
||||
<input type="month" class="mb-2 pointer" name="" id="dash_department_month" />
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body" id="department_leave_canvas">
|
||||
<canvas id="departmentLeave" class="pointer"></canvas>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@@ -214,19 +211,15 @@
|
||||
<div class="col-12 col-sm-12 col-md-12 col-lg-3 mt-3">
|
||||
<div class="oh-card-dashboard oh-card-dashboard--no-scale oh-card-dashboard--transparent">
|
||||
<div class="oh-card-dashboard__header oh-card-dashboard__header--divider">
|
||||
<span class="oh-card-dashboard__title">{% trans "Leave Type - Count of approved leaves" %}</span>
|
||||
<span class="oh-card-dashboard__title">{% trans "Leave Type - Count of leaves" %}</span>
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body">
|
||||
{% if leave_requests %}
|
||||
<canvas id="leaveType" class="pointer"></canvas>
|
||||
{% else %}
|
||||
<div style="height: 310px; display:flex;align-items: center;justify-content: center;" class="">
|
||||
<div style="" class="">
|
||||
<img style=" display: block;width: 70px;margin: 10px auto ;" src="{% static 'images/ui/leave_types.png' %}" class="" alt=""/>
|
||||
<h3 style="font-size:16px" class="oh-404__subtitle">{% trans "No leave requests for any leave type this month." %}</h3>
|
||||
</div>
|
||||
<div class="d-flex flex-row-reverse">
|
||||
<input type="month" class="mb-2 pointer" name="" id="dash_leave_type_month" />
|
||||
</div>
|
||||
<div class="oh-card-dashboard__body" id="leave_type_canvas">
|
||||
<canvas id="leaveType" class="pointer"></canvas>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -18,8 +18,8 @@
|
||||
</div>
|
||||
<div class="oh-sticky-table__tbody" id="leaveRequestTableBody">
|
||||
{% for leave_request in leave_requests %}
|
||||
<div class="oh-sticky-table__tr" draggable="true" data-toggle="oh-modal-toggle" data-target="#objectDetailsModalW25"
|
||||
hx-get="{% url 'one-request-view' leave_request.id %}?instances_ids={{requests_ids}}" hx-target="#objectDetailsModalW25Target">
|
||||
<div class="oh-sticky-table__tr {% if leave_request.status == 'cancelled' %} diff-cell{% endif %}" data-toggle="oh-modal-toggle" data-target="#objectDetailsModalW25"
|
||||
hx-get="{% url 'user-request-one' leave_request.id %}?instances_ids={{requests_ids}}" hx-target="#objectDetailsModalW25Target">
|
||||
|
||||
<div class="oh-sticky-table__sd">
|
||||
<div class="oh-profile oh-profile--md">
|
||||
@@ -30,11 +30,11 @@
|
||||
<span class="oh-profile__name oh-text--dark">{{leave_request.employee_id}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__td {% if leave_request.status == 'cancelled' %} diff-cell{% endif %}">{{leave_request.leave_type_id}}</div>
|
||||
<div class="oh-sticky-table__td {% if leave_request.status == 'cancelled' %} diff-cell{% endif %} dateformat_changer">{{leave_request.start_date}}</div>
|
||||
<div class="oh-sticky-table__td {% if leave_request.status == 'cancelled' %} diff-cell{% endif %} dateformat_changer">{{leave_request.end_date}}</div>
|
||||
<div class="oh-sticky-table__td {% if leave_request.status == 'cancelled' %} diff-cell{% endif %}">{{leave_request.requested_days}}</div>
|
||||
<div class="oh-sticky-table__td {% if leave_request.status == 'cancelled' %} diff-cell{% endif %}">
|
||||
<div class="oh-sticky-table__td">{{leave_request.leave_type_id}}</div>
|
||||
<div class="oh-sticky-table__td dateformat_changer">{{leave_request.start_date}}</div>
|
||||
<div class="oh-sticky-table__td dateformat_changer">{{leave_request.end_date}}</div>
|
||||
<div class="oh-sticky-table__td" align="center">{{leave_request.requested_days}}</div>
|
||||
<div class="oh-sticky-table__td">
|
||||
{% if leave_request.multiple_approvals and leave_request.status == "requested" %}
|
||||
<div class="oh-checkpoint-badge oh-checkpoint-badge--secondary" title="{% for manager in leave_request.multiple_approvals.managers %}{{ manager }}{% if not forloop.last %} , {% endif %}{% endfor %}">
|
||||
{{leave_request.multiple_approvals.approved|length}} / {{leave_request.multiple_approvals.managers|length}} {% trans "Approved" %}
|
||||
|
||||
Reference in New Issue
Block a user