[UPDT] PMS: Employee keyresult redirect view from dashboard
This commit is contained in:
Horilla
@@ -302,6 +302,7 @@ class EmployeeObjectiveFilter(FilterSet):
|
||||
'start_date',
|
||||
'end_date',
|
||||
'employee_id',
|
||||
'status',
|
||||
]
|
||||
|
||||
def search_method(self, queryset, _, value: str):
|
||||
|
||||
@@ -30,20 +30,20 @@ if (objectiveChart != null) {
|
||||
let label = e.chart.data.labels[dataIndex];
|
||||
let params = "?status=" + label + "&archive=false" + "&dashboard=True";
|
||||
|
||||
// $.ajax({
|
||||
// url: "/pms/objective-list-search" + params,
|
||||
// type: "GET",
|
||||
// headers: {
|
||||
// "X-Requested-With": "XMLHttpRequest",
|
||||
// },
|
||||
// success: (response) => {
|
||||
// $("#dashboard").html(response);
|
||||
// },
|
||||
// error: (error) => {
|
||||
// console.log("Error", error);
|
||||
// },
|
||||
// });
|
||||
// $("#back_button").removeClass("d-none");
|
||||
$.ajax({
|
||||
url: "/pms/objective-dashboard-view" + params,
|
||||
type: "GET",
|
||||
headers: {
|
||||
"X-Requested-With": "XMLHttpRequest",
|
||||
},
|
||||
success: (response) => {
|
||||
$("#dashboard").html(response);
|
||||
},
|
||||
error: (error) => {
|
||||
console.log("Error", error);
|
||||
},
|
||||
});
|
||||
$("#back_button").removeClass("d-none");
|
||||
},
|
||||
},
|
||||
plugins: [{
|
||||
|
||||
@@ -0,0 +1,239 @@
|
||||
{% load static i18n %}
|
||||
{% load i18n %}
|
||||
{% load widget_tweaks %} {% load basefilters %} {% load pmsfilters %}
|
||||
{% comment %} <section class="oh-wrapper oh-main__topbar" x-data="{searchShow: false}"> {% endcomment %}
|
||||
<div class="oh-main__titlebar oh-main__titlebar--left">
|
||||
<h1 class="oh-main__titlebar-title fw-bold">
|
||||
{% trans "Employee Objectives" %}
|
||||
</h1>
|
||||
</div>
|
||||
{% comment %} </section> {% endcomment %}
|
||||
{% comment %} <main :class="sidebarOpen ? 'oh-main__sidebar-visible' : ''"> {% endcomment %}
|
||||
{% comment %} <div class="oh-wrapper" style="margin-top: 5px;"> {% endcomment %}
|
||||
<div class="oh-card">
|
||||
{% for emp_objective in emp_objectives %}
|
||||
{% if perms.pms.view_employeeobjective or emp_objective|is_manager_or_owner:request.user %}
|
||||
<div class="oh-accordion-meta">
|
||||
<div class="oh-accordion-meta__item">
|
||||
<div class="oh-accordion-meta__header"
|
||||
{% if perms.payroll.view_keyresult or emp_objective|is_manager_or_owner:request.user %}
|
||||
data-target="#krBody{{emp_objective.id}}"
|
||||
hx-get="{% url 'kr-table-view' emp_objective.id %}?{{request.GET.urlencode}}&objective_id={{emp_objective.objective_id.id}}"
|
||||
hx-target="#krData{{emp_objective.id}}"
|
||||
{% endif %}
|
||||
>
|
||||
<div class="oh-accordion-meta__title d-flex align-items-center justify-content-between w-100 ">
|
||||
<div class="d-flex align-items-center justify-content-between" style="width:60%">
|
||||
<div class="oh-tabs__input-badge-container">
|
||||
<span
|
||||
class="oh-badge oh-badge--secondary oh-badge--small oh-badge--round mr-1"
|
||||
>
|
||||
{{emp_objective.employee_key_result.all|length}}
|
||||
</span>
|
||||
{{emp_objective}}
|
||||
</div>
|
||||
{% if emp_objective.employee_key_result.first %}
|
||||
<div class="oh-progress-container progress_barmm" style="width:50%">
|
||||
<div class="oh-progress" role="progressbar">
|
||||
<div class="oh-progress__bar oh-progress__bar--secondary" style="width: calc( {{ emp_objective.progress_percentage }}%)"></div>
|
||||
</div>
|
||||
<div class="oh-progress-container__percentage" style="width:50px" name= "key_result_percentage">{{emp_objective.progress_percentage}} %</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div>
|
||||
{% comment %} <div class="d-flex" onclick="event.stopPropagation()"> {% endcomment %}
|
||||
|
||||
<div class="oh-btn-group">
|
||||
{% comment %} {% if request.user|is_reportingmanager or perms.pms.view_employeekeyresult %} {% endcomment %}
|
||||
<a
|
||||
hx-get='{% url "view-employee-objective" emp_objective.id %}'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal"
|
||||
type="button" title="{% trans 'View' %}"
|
||||
class="oh-btn oh-btn--light-bkg p-3 w-100" onclick="event.stopPropagation()"
|
||||
>
|
||||
<ion-icon name="eye-outline"></ion-icon>
|
||||
</a>
|
||||
{% comment %} {% endif %} {% endcomment %}
|
||||
{% if request.user|is_reportingmanager or perms.pms.view_employeekeyresult %}
|
||||
<a
|
||||
hx-get='{% url "objective-detailed-view-activity" emp_objective.id %}'
|
||||
hx-target="#activityContainer"
|
||||
data-target="#OKRactivitySidebar"
|
||||
type="button" title="{% trans 'Activites' %}"
|
||||
class="oh-btn oh-btn--light-bkg p-3 w-50 oh-activity-sidebar__open" onclick="event.stopPropagation()"
|
||||
>
|
||||
<ion-icon name="newspaper-outline"></ion-icon>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if request.user|is_reportingmanager or perms.pms.add_employeekeyresult %}
|
||||
<button style="border-right:1px solid hsl(8, 77%, 56%)"
|
||||
class="oh-btn oh-btn--secondary-outline float-end"
|
||||
hx-get='{% url "employee-key-result-creation" emp_objective.id %}'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal"
|
||||
title="Add Key Result"
|
||||
onclick="event.stopPropagation()"
|
||||
>
|
||||
<ion-icon name="add-outline" class="m-0 md hydrated" role="img" aria-label="add outline"></ion-icon>
|
||||
</button>
|
||||
{% endif %}
|
||||
{% if request.user|is_reportingmanager or perms.pms.add_employeeobjective %}
|
||||
|
||||
<div class="" onclick="event.stopPropagation()">
|
||||
<div class="oh-dropdown" x-data="{show: false}">
|
||||
<button class="oh-btn oh-btn--transparent text-muted p-3" @click="show = !show" title={% trans "Actions" %}>
|
||||
<ion-icon name="ellipsis-vertical-sharp" title="{% trans 'Options' %}" role="img" class="md hydrated" aria-label="ellipsis vertical sharp"></ion-icon>
|
||||
</button>
|
||||
<div class="oh-dropdown__menu oh-dropdown__menu--dark-border oh-dropdown__menu--right" x-show="show" @click.outside="show = false" style="display: none;">
|
||||
<ul class="oh-dropdown__items">
|
||||
{% if perms.pms.change_employeeobjective or request.user|is_reportingmanager %}
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal"
|
||||
hx-get='{% url "update-employee-objective" emp_objective.id %}'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>{% trans "Edit" %}</a>
|
||||
</li>
|
||||
{% if emp_objective.archive %}
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
{% comment %} data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal" {% endcomment %}
|
||||
hx-confirm="{% trans 'Do you want to un-archive this employee objective?' %}"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>{% trans "Unarchive" %}</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
{% comment %} data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal" {% endcomment %}
|
||||
hx-confirm="{% trans 'Do you want to archive this employee objective?' %}"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>{% trans "Archive" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% endif %}
|
||||
{% if perms.pms.delete_employeeobjective or request.user|is_reportingmanager %}
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
{% comment %} data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal" {% endcomment %}
|
||||
hx-confirm="{% trans 'Do you want to delete this employee objective?' %}"
|
||||
hx-get='{% url "delete-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>{% trans "Delete" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="oh-accordion-meta__body d-none"
|
||||
id="krBody{{emp_objective.id}}"
|
||||
>
|
||||
<!-- htmx tax bracket loading here -->
|
||||
<div
|
||||
class="oh-sticky-table oh-sticky-table--no-overflow mb-5"
|
||||
id="krData{{emp_objective.id}}"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% comment %} </div> {% endcomment %}
|
||||
<div class="oh-activity-sidebar" id="OKRactivitySidebar">
|
||||
<div class="oh-activity-sidebar__body" id="activityContainer">
|
||||
</div>
|
||||
</div>
|
||||
{% comment %} </main> {% endcomment %}
|
||||
<script src="{% static 'htmx/htmx.min.js' %}"></script>
|
||||
<script src="{% static 'build/js/web.frontend.min.js' %}"></script>
|
||||
<script>
|
||||
function progress (element) {
|
||||
var currentValue = $(element).val()
|
||||
keyResultTable = $(element).closest('.oh-sticky-table__tbody');
|
||||
keyResultRow = $(element).closest('.oh-sticky-table__tr');
|
||||
empKeyResultId = keyResultRow.attr("data-kr-id")
|
||||
var targetValue = keyResultRow.find('[data-value]').attr("data-value")
|
||||
|
||||
// Extract only the numeric part using a regular expression
|
||||
var numericValue = parseFloat(targetValue.replace(/[^\d.]/g, ''));
|
||||
var prgressPercentage = parseInt( currentValue*100/numericValue )
|
||||
// Ensure totalProgress doesn't exceed 100
|
||||
if (prgressPercentage > 100) {
|
||||
prgressPercentage = 100;
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'Oops...',
|
||||
text: 'Current Value cannot exceed target value!',
|
||||
timer: 3000, // Display the alert for 3 seconds
|
||||
timerProgressBar: true, // Show the progress bar
|
||||
showConfirmButton: false // Hide the "OK" button
|
||||
});
|
||||
}
|
||||
else{
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "{% url 'key-result-current-value-update' %}",
|
||||
data: {
|
||||
csrfmiddlewaretoken: getCookie("csrftoken"),
|
||||
"current_value":currentValue,
|
||||
"emp_key_result_id":empKeyResultId
|
||||
|
||||
},
|
||||
success: function (response) {
|
||||
if (response.type != 'error'){
|
||||
keyResultRow.find('.p-percentage').text(prgressPercentage+'%');
|
||||
|
||||
// Iterate over each span and get its text content
|
||||
var total_percentage = 0
|
||||
var total_kr = 0
|
||||
keyResultTable.find('.p-percentage').each(function() {
|
||||
strPercentage = $(this).text();
|
||||
numPercentage = parseFloat(strPercentage.replace(/[^\d.]/g, ''));
|
||||
total_percentage += numPercentage
|
||||
total_kr += 1
|
||||
});
|
||||
totalProgress = parseInt( total_percentage/total_kr)
|
||||
// Ensure totalProgress doesn't exceed 100
|
||||
if (totalProgress > 100) {
|
||||
totalProgress = 100;
|
||||
}
|
||||
objectiveProgressContainer = $(element).closest('.oh-accordion-meta__item').find('.progress_barmm');
|
||||
objectiveProgressContainer.html(
|
||||
'<div class="oh-progress" role="progressbar">'+
|
||||
'<div class="oh-progress__bar oh-progress__bar--secondary" style="width: calc('+ totalProgress + '%)"></div>' +
|
||||
'</div>' +
|
||||
'<div class="oh-progress-container__percentage" style="width:50px" name= "key_result_percentage">'+ totalProgress +' %</div>'
|
||||
|
||||
)
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -2,6 +2,15 @@
|
||||
{% load i18n %}
|
||||
{% load widget_tweaks %} {% load basefilters %} {% load pmsfilters %}
|
||||
{% include "filter_tags.html" %}
|
||||
{% if messages %}
|
||||
<div class="oh-alert-container">
|
||||
{% for message in messages %}
|
||||
<div class="oh-alert oh-alert--animated {{message.tags}}">
|
||||
{{ message }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% for emp_objective in emp_objectives %}
|
||||
{% if perms.pms.view_employeeobjective or emp_objective|is_manager_or_owner:request.user %}
|
||||
<div class="oh-accordion-meta">
|
||||
@@ -91,7 +100,7 @@
|
||||
<a
|
||||
class="fw-light"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectivesModal"
|
||||
data-target="#objectDetailsModal"
|
||||
hx-get='{% url "update-employee-objective" emp_objective.id %}'
|
||||
hx-target="#objectivesTarget"
|
||||
>{% trans "Edit" %}</a>
|
||||
@@ -100,22 +109,18 @@
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectivesModal"
|
||||
hx-confirm="{% trans 'Do you want to un-archive this employee objective?' %}"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectivesTarget"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view=False'
|
||||
hx-target="#emp_objective_card"
|
||||
>{% trans "Unarchive" %}</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="oh-dropdown__item">
|
||||
<a
|
||||
class="fw-light"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectivesModal"
|
||||
hx-confirm="{% trans 'Do you want to archive this employee objective?' %}"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectivesTarget"
|
||||
hx-get='{% url "archive-employee-objective" emp_objective.id %}?single_view=False'
|
||||
hx-target="#emp_objective_card"
|
||||
>{% trans "Archive" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
@@ -126,10 +131,10 @@
|
||||
<a
|
||||
class="fw-light"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectivesModal"
|
||||
data-target="#objectDetailsModal"
|
||||
hx-confirm="{% trans 'Do you want to delete this employee objective?' %}"
|
||||
hx-get='{% url "delete-employee-objective" emp_objective.id %}?single_view="False"'
|
||||
hx-target="#objectivesTarget"
|
||||
hx-get='{% url "delete-employee-objective" emp_objective.id %}?single_view="False'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>{% trans "Delete" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
@@ -102,6 +102,10 @@
|
||||
<label class="oh-label" for="">{% trans "End Date Till" %}</label>
|
||||
{{emp_obj_form.form.end_date_till}}
|
||||
</div>
|
||||
<div class="oh-input-group">
|
||||
<label class="oh-label" for="">{% trans "Status" %}</label>
|
||||
{{emp_obj_form.form.status}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<h2 class="oh-modal__dialog-title" >
|
||||
{% trans "Update Employee Objective" %}
|
||||
</h2>
|
||||
<button type="button" class="oh-modal__close--custom" onclick="$('#objectivesModal').removeClass('oh-modal--show');">
|
||||
<button type="button" class="oh-modal__close--custom" onclick="$('#objectDetailsModal').removeClass('oh-modal--show');">
|
||||
<ion-icon name="close-outline" role="img" aria-label="close outline"></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
301
pms/templates/okr/key_result/kr_dashboard_view.html
Normal file
301
pms/templates/okr/key_result/kr_dashboard_view.html
Normal file
@@ -0,0 +1,301 @@
|
||||
{% load static i18n %}
|
||||
{% load i18n %}
|
||||
{% load widget_tweaks %} {% load basefilters %} {% load pmsfilters %}
|
||||
{% comment %} <section class="oh-wrapper oh-main__topbar" x-data="{searchShow: false}"> {% endcomment %}
|
||||
<div class="oh-main__titlebar oh-main__titlebar--left">
|
||||
<h1 class="oh-main__titlebar-title fw-bold">
|
||||
{% trans "Employee Key Results" %}
|
||||
</h1>
|
||||
</div>
|
||||
{% comment %} </section> {% endcomment %}
|
||||
{% comment %} <main :class="sidebarOpen ? 'oh-main__sidebar-visible' : ''">
|
||||
<div class="oh-wrapper" style="margin-top: 5px;"> {% endcomment %}
|
||||
<div class="oh-card">
|
||||
{% for krs_list in krs %}
|
||||
<div class="oh-accordion-meta">
|
||||
<div class="oh-accordion-meta__item">
|
||||
<div class="oh-accordion-meta__header">
|
||||
<span class="oh-accordion-meta__title pt-3 pb-3">
|
||||
<div class="oh-tabs__input-badge-container">
|
||||
<span
|
||||
class="oh-badge oh-badge--secondary oh-badge--small oh-badge--round mr-1"
|
||||
>
|
||||
{{krs_list.list.paginator.count}}
|
||||
</span>
|
||||
{{krs_list.grouper}}
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
<div class="oh-accordion-meta__body d-none">
|
||||
<div class="oh-sticky-table oh-sticky-table--no-overflow mb-5">
|
||||
<div class="oh-sticky-table__table">
|
||||
<div class="oh-sticky-table__thead">
|
||||
<div class="oh-sticky-table__tr">
|
||||
<div class="oh-sticky-table__th" style="width: 10px">
|
||||
<div class="centered-div">
|
||||
<input
|
||||
type="checkbox"
|
||||
title='{% trans "Select All" %}'
|
||||
class="oh-input oh-input__checkbox myTicketsAll"
|
||||
onchange="$(this).closest('.oh-sticky-table').find('.my-tickets-row').prop('checked',$(this).is(':checked')).change();addingTicketsIds()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Title" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Start Value" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Current Value" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Target Value" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Progress Percentage" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Start Date" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "End Date" %}</div>
|
||||
<div class="oh-sticky-table__th">{% trans "Status" %}</div>
|
||||
{% if perms.pms.change_employeeobjective or emp_objective|is_manager:request.user %}
|
||||
<div class="oh-sticky-table__th oh-sticky-table__right">{% trans "Actions" %}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__tbody">
|
||||
{% for kr in krs_list.list %}
|
||||
<div class="oh-sticky-table__tr" data-kr-id="{{kr.id}}"
|
||||
{% comment %} onclick="window.location.href = `{% url 'ticket-detail' ticket.id %}`" {% endcomment %}
|
||||
>
|
||||
<div class="oh-sticky-table__sd
|
||||
{% if ticket.priority == 'high' %}row-status--red
|
||||
{% elif ticket.priority == 'medium' %}row-status--orange
|
||||
{% elif ticket.priority == 'low' %}row-status--blue{% endif %}"
|
||||
onclick="event.stopPropagation()"
|
||||
|
||||
>
|
||||
<div class="centered-div">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="{{kr.id}}"
|
||||
onchange="highlightRow($(this));
|
||||
if (!$(this).is(':checked')) {
|
||||
$(this).closest('.oh-sticky-table').find('.myTicketsAll').prop('checked',false)
|
||||
};addingTicketsIds()"
|
||||
class="oh-input holiday-checkbox oh-input__checkbox my-tickets-row"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="oh-sticky-table__td">
|
||||
<span class='d-flex justify-content-between align-items-center'
|
||||
>
|
||||
{{kr.key_result_id}}
|
||||
{% comment %} <span title = 'due {% if ticket.deadline == today %} today {% else %}in {{ticket.deadline|sub:today}}{% endif %}'> {% endcomment %}
|
||||
<ion-icon
|
||||
class="text-{% if ticket.deadline < today %}danger {% elif ticket.deadline == today %}warning {% else %}success{% endif %}"
|
||||
name="time-sharp"
|
||||
>
|
||||
</ion-icon>
|
||||
{% comment %} </span> {% endcomment %}
|
||||
</span>
|
||||
</div>
|
||||
<div class="oh-sticky-table__td">{{kr.start_value}}</div>
|
||||
<div class="oh-sticky-table__td">
|
||||
<input
|
||||
id = {{kr.id}}
|
||||
type="number" class="oh-input p-1" min="0"
|
||||
max="{{kr.target_value}}"
|
||||
value="{{kr.current_value}}"
|
||||
{% comment %} hx-post="{%url 'employee-keyresult-update-current_value' kr.id %}"
|
||||
hx-trigger="change"
|
||||
hx-target="#emp_objective_card" {% endcomment %}
|
||||
name="current_value"
|
||||
onchange="progress(this)"
|
||||
/>
|
||||
</div>
|
||||
<div class="oh-sticky-table__td " data-value="{{kr.target_value}}" >{{kr.target_value}}</div>
|
||||
<div class="oh-sticky-table__td p-percentage" >{{kr.progress_percentage}}% </div>
|
||||
<div class="oh-sticky-table__td">{{kr.start_date}}</div>
|
||||
<div class="oh-sticky-table__td">{{kr.end_date}}</div>
|
||||
<div class="oh-sticky-table__td">{{kr.get_status_display}}
|
||||
{% comment %} <select
|
||||
id="keyResultStatus" name="key_result_status"
|
||||
hx-post="{% url 'employee-keyresult-update-status' kr.id %}"
|
||||
hx-trigger="change" class="oh-table__editable-input w-100"
|
||||
hx-target="#krData{{kr.employee_objective_id.id}}">
|
||||
{% for value,label in key_result_status %}
|
||||
{% if kr.status != value %}
|
||||
<option value="{{value}}">{{label}}</option>
|
||||
{% else %}
|
||||
<option value="{{value}}" selected>{{label}}</option>
|
||||
{% endif%}
|
||||
{% endfor %}
|
||||
</select> {% endcomment %}
|
||||
</div>
|
||||
{% if perms.pms.change_employeeobjective or emp_objective|is_manager:request.user %}
|
||||
<div class="oh-sticky-table__td oh-sticky-table__right" onclick="event.stopPropagation()">
|
||||
<div class="oh-btn-group">
|
||||
<button
|
||||
class="oh-btn oh-btn--light-bkg w-50"
|
||||
title="{% trans 'Edit' %}"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectDetailsModal"
|
||||
hx-get='{% url "employee-key-result-update" kr.id %}'
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
>
|
||||
<ion-icon name="create-outline"></ion-icon>
|
||||
</button>
|
||||
<form
|
||||
action='{% url "delete-employee-keyresult" kr.id %}?dashboard=True'
|
||||
class="w-50"
|
||||
onsubmit="return confirm('{% trans 'Are you sure you want to delete this Key result?' %}');"
|
||||
method='post' onclick="event.stopPropagation()" >
|
||||
<input type="hidden" name="dashboard" value="True">
|
||||
{% csrf_token %}
|
||||
<button
|
||||
type="submit"
|
||||
class="oh-btn oh-btn--light-bkg w-100"
|
||||
title="{% trans 'Delete' %}"
|
||||
>
|
||||
<ion-icon
|
||||
class="me-1 md hydrated"
|
||||
name="trash-outline"
|
||||
role="img"
|
||||
aria-label="trash outline"
|
||||
></ion-icon>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% comment %} <div class="oh-pagination">
|
||||
<span class="oh-pagination__page">
|
||||
{% trans "Page" %} {{ krs_list.list.number }} {% trans "of" %} {{ krs_list.list.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="{{krs_list.dynamic_name}}"
|
||||
class="oh-pagination__input"
|
||||
value="{{krs_list.list.number}}"
|
||||
hx-get="{% url 'attendance-ot-search' %}?{{pd}}"
|
||||
hx-target="#ot-table"
|
||||
min="1"
|
||||
/>
|
||||
<span class="oh-pagination__label"
|
||||
>{% trans "of" %} {{krs_list.list.paginator.num_pages}}</span
|
||||
>
|
||||
</div>
|
||||
<ul class="oh-pagination__items">
|
||||
{% if krs_list.list.has_previous %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a
|
||||
hx-target="#ot-table"
|
||||
hx-get="{% url 'attendance-ot-search' %}?{{pd}}&{{krs_list.dynamic_name}}=1"
|
||||
class="oh-pagination__link"
|
||||
>{% trans "First" %}</a
|
||||
>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a
|
||||
hx-target="#ot-table"
|
||||
hx-get="{% url 'attendance-ot-search' %}?{{pd}}&{{krs_list.dynamic_name}}={{ krs_list.list.previous_page_number }}"
|
||||
class="oh-pagination__link"
|
||||
>{% trans "Previous" %}</a
|
||||
>
|
||||
</li>
|
||||
{% endif %} {% if krs_list.list.has_next %}
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a
|
||||
hx-target="#ot-table"
|
||||
hx-get="{% url 'attendance-ot-search' %}?{{pd}}&{{krs_list.dynamic_name}}={{ krs_list.list.next_page_number }}"
|
||||
class="oh-pagination__link"
|
||||
>{% trans "Next" %}</a
|
||||
>
|
||||
</li>
|
||||
<li class="oh-pagination__item oh-pagination__item--wide">
|
||||
<a
|
||||
hx-target="#ot-table"
|
||||
hx-get="{% url 'attendance-ot-search' %}?{{pd}}&{{krs_list.dynamic_name}}={{ krs_list.list.paginator.num_pages }}"
|
||||
class="oh-pagination__link"
|
||||
>{% trans "Last" %}</a
|
||||
>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div> {% endcomment %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% comment %} </div> {% endcomment %}
|
||||
{% comment %} </main> {% endcomment %}
|
||||
<script src="{% static 'htmx/htmx.min.js' %}"></script>
|
||||
<script src="{% static 'build/js/web.frontend.min.js' %}"></script>
|
||||
<script>
|
||||
function progress (element) {
|
||||
console.log('progress')
|
||||
var currentValue = $(element).val()
|
||||
keyResultTable = $(element).closest('.oh-sticky-table__tbody');
|
||||
keyResultRow = $(element).closest('.oh-sticky-table__tr');
|
||||
empKeyResultId = keyResultRow.attr("data-kr-id")
|
||||
var targetValue = keyResultRow.find('[data-value]').attr("data-value")
|
||||
|
||||
// Extract only the numeric part using a regular expression
|
||||
var numericValue = parseFloat(targetValue.replace(/[^\d.]/g, ''));
|
||||
var prgressPercentage = parseInt( currentValue*100/numericValue )
|
||||
// Ensure totalProgress doesn't exceed 100
|
||||
if (prgressPercentage > 100) {
|
||||
prgressPercentage = 100;
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'Oops...',
|
||||
text: 'Current Value cannot exceed target value!',
|
||||
timer: 3000, // Display the alert for 3 seconds
|
||||
timerProgressBar: true, // Show the progress bar
|
||||
showConfirmButton: false // Hide the "OK" button
|
||||
});
|
||||
}
|
||||
else{
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "{% url 'key-result-current-value-update' %}",
|
||||
data: {
|
||||
csrfmiddlewaretoken: getCookie("csrftoken"),
|
||||
"current_value":currentValue,
|
||||
"emp_key_result_id":empKeyResultId
|
||||
|
||||
},
|
||||
success: function (response) {
|
||||
if (response.type != 'error'){
|
||||
keyResultRow.find('.p-percentage').text(prgressPercentage+'%');
|
||||
|
||||
// Iterate over each span and get its text content
|
||||
var total_percentage = 0
|
||||
var total_kr = 0
|
||||
keyResultTable.find('.p-percentage').each(function() {
|
||||
strPercentage = $(this).text();
|
||||
numPercentage = parseFloat(strPercentage.replace(/[^\d.]/g, ''));
|
||||
total_percentage += numPercentage
|
||||
total_kr += 1
|
||||
});
|
||||
totalProgress = parseInt( total_percentage/total_kr)
|
||||
// Ensure totalProgress doesn't exceed 100
|
||||
if (totalProgress > 100) {
|
||||
totalProgress = 100;
|
||||
}
|
||||
objectiveProgressContainer = $(element).closest('.oh-accordion-meta__item').find('.progress_barmm');
|
||||
objectiveProgressContainer.html(
|
||||
'<div class="oh-progress" role="progressbar">'+
|
||||
'<div class="oh-progress__bar oh-progress__bar--secondary" style="width: calc('+ totalProgress + '%)"></div>' +
|
||||
'</div>' +
|
||||
'<div class="oh-progress-container__percentage" style="width:50px" name= "key_result_percentage">'+ totalProgress +' %</div>'
|
||||
|
||||
)
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -44,7 +44,7 @@
|
||||
</h2>
|
||||
{% endif %}
|
||||
|
||||
<button type="button" class="oh-modal__close--custom" onclick="$('#objectivesModal').removeClass('oh-modal--show');">
|
||||
<button type="button" class="oh-modal__close--custom" onclick="$('#objectDetailsModalTarget').removeClass('oh-modal--show');">
|
||||
<ion-icon name="close-outline" role="img" aria-label="close outline"></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
@@ -52,13 +52,13 @@
|
||||
{% if update %}
|
||||
<form
|
||||
hx-post="{%url 'objective-update' objective_form.instance.id %}"
|
||||
hx-target="#objectivesTarget"
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
id="objectiveForm"
|
||||
>
|
||||
{% else %}
|
||||
<form
|
||||
hx-post="{%url 'objective-creation' %}"
|
||||
hx-target="#objectivesTarget"
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
id="objectiveForm"
|
||||
>
|
||||
{% endif %}
|
||||
|
||||
@@ -91,7 +91,7 @@
|
||||
{% if perms.pms.change_objective %}
|
||||
<a
|
||||
onclick="event.preventDefault();event.stopPropagation()"
|
||||
hx-get="{% url 'objective-update' objective.id %}" hx-target='#objectivesTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectivesModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
hx-get="{% url 'objective-update' objective.id %}" hx-target='#objectDetailsModalTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectDetailsModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
><ion-icon name="create-outline"></ion-icon></a>
|
||||
{% endif %}
|
||||
{% if perms.pms.add_employeeobjective %}
|
||||
|
||||
@@ -251,7 +251,7 @@
|
||||
{% if perms.pms.change_objective %}
|
||||
<a
|
||||
onclick="event.preventDefault();event.stopPropagation()"
|
||||
hx-get="{% url 'objective-update' objective.id %}" hx-target='#objectivesTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectivesModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
hx-get="{% url 'objective-update' objective.id %}" hx-target='#objectDetailsModalTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectDetailsModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
><ion-icon name="create-outline"></ion-icon></a>
|
||||
{% endif %}
|
||||
{% comment %} <a hx-get="" hx-target='#duplicateFormContainer' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#duplicateRecruitmentModal' class="oh-btn oh-btn--light-bkg w-100" title="{% trans 'Duplicate' %}"><ion-icon name="copy-outline"></ion-icon></a> {% endcomment %}
|
||||
@@ -487,7 +487,7 @@
|
||||
{% if perms.pms.change_objective %}
|
||||
<a
|
||||
onclick="event.preventDefault();event.stopPropagation()"
|
||||
hx-get="{% url 'update-employee-objective' objective.id %}" hx-target='#objectivesTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectivesModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
hx-get="{% url 'update-employee-objective' objective.id %}" hx-target='#objectDetailsModalTarget' hx-swap='innerHTML' data-toggle='oh-modal-toggle' data-target='#objectDetailsModal' class="oh-btn oh-btn--light-bkg w-100" title="Edit"
|
||||
><ion-icon name="create-outline"></ion-icon></a>
|
||||
{% endif %}
|
||||
{% if perms.pms.delete_objective %}
|
||||
|
||||
@@ -217,9 +217,9 @@
|
||||
<button
|
||||
class="oh-btn oh-btn--secondary ml-2"
|
||||
data-toggle="oh-modal-toggle"
|
||||
data-target="#objectivesModal"
|
||||
data-target="#objectDetailsModal"
|
||||
hx-get="{%url 'objective-creation' %}"
|
||||
hx-target="#objectivesTarget"
|
||||
hx-target="#objectDetailsModalTarget"
|
||||
onclick="event.preventDefault()"
|
||||
>
|
||||
<ion-icon name="add-sharp" class="mr-1"></ion-icon>{% trans "Create" %}
|
||||
|
||||
@@ -38,6 +38,11 @@ urlpatterns = [
|
||||
views.objective_list_search,
|
||||
name="objective-list-search",
|
||||
),
|
||||
path(
|
||||
"objective-dashboard-view",
|
||||
views.objective_dashboard_view,
|
||||
name="objective-dashboard-view",
|
||||
),
|
||||
|
||||
path(
|
||||
"objective-delete/<int:obj_id>", views.objective_delete, name="objective-delete"
|
||||
|
||||
Reference in New Issue
Block a user