Fix working plan handling and refactor to arrow functions

This commit is contained in:
Alex Tselegidis 2023-02-20 08:01:27 +01:00
parent b8f4354363
commit 9ec281640e
1 changed files with 46 additions and 39 deletions

View File

@ -95,7 +95,7 @@ App.Utils.WorkingPlan = (function () {
'html': [
$('<input/>', {
'id': index + '-end',
'class': 'work-start form-control form-control-sm'
'class': 'work-end form-control form-control-sm'
})
]
})
@ -356,11 +356,13 @@ App.Utils.WorkingPlan = (function () {
* Event: Day Checkbox "Click"
*
* Enable or disable the time selection for each day.
*
* @param {jQuery.Event} event
*/
$('.working-plan tbody').on('click', 'input:checkbox', function () {
const id = $(this).attr('id');
$('.working-plan tbody').on('click', 'input:checkbox', (event) => {
const id = $(event.currentTarget).attr('id');
if ($(this).prop('checked') === true) {
if ($(event.currentTarget).prop('checked') === true) {
$('#' + id + '-start')
.prop('disabled', false)
.val('9:00 AM');
@ -385,7 +387,7 @@ App.Utils.WorkingPlan = (function () {
*/
$('.add-break').on(
'click',
function () {
() => {
const timeFormat = vars('time_format') === 'regular' ? 'h:mm a' : 'HH:mm';
const $newBreak = $('<tr/>', {
@ -453,17 +455,19 @@ App.Utils.WorkingPlan = (function () {
this.editableDayCell($newBreak.find('.break-day'));
this.editableTimeCell($newBreak.find('.break-start, .break-end'));
$newBreak.find('.edit-break').trigger('click');
}.bind(this)
}
);
/**
* Event: Edit Break Button "Click"
*
* Enables the row editing for the "Breaks" table rows.
*
* @param {jQuery.Event} event
*/
$(document).on('click', '.edit-break', function () {
$(document).on('click', '.edit-break', (event) => {
// Reset previous editable table cells.
const $previousEdits = $(this).closest('table').find('.editable');
const $previousEdits = $(event.currentTarget).closest('table').find('.editable');
$previousEdits.each(function (index, editable) {
if (editable.reset) {
@ -472,19 +476,18 @@ App.Utils.WorkingPlan = (function () {
});
// Make all cells in current row editable.
$(this).parent().parent().children().trigger('edit');
const $tr = $(event.currentTarget).closest('tr');
$tr.children().trigger('edit');
App.Utils.UI.initializeTimepicker(
$(this)
.parent()
.parent()
$tr
.find('.break-start input, .break-end input')
);
$(this).parent().parent().find('.break-day select').focus();
$tr.find('.break-day select').focus();
// Show save - cancel buttons.
const $tr = $(this).closest('tr');
$tr.find('.edit-break, .delete-break').addClass('d-none');
$tr.find('.save-break, .cancel-break').removeClass('d-none');
$tr.find('select,input:text').addClass('form-control form-control-sm');
@ -494,9 +497,11 @@ App.Utils.WorkingPlan = (function () {
* Event: Delete Break Button "Click"
*
* Removes the current line from the "Breaks" table.
*
* @param {jQuery.Event} event
*/
$(document).on('click', '.delete-break', function () {
$(this).parent().parent().remove();
$(document).on('click', '.delete-break', (event) => {
$(event.currentTarget).closest('tr').remove();
});
/**
@ -509,7 +514,7 @@ App.Utils.WorkingPlan = (function () {
$(document).on(
'click',
'.cancel-break',
function (event) {
(event) => {
const element = event.target;
const $modifiedRow = $(element).closest('tr');
this.enableCancel = true;
@ -518,7 +523,7 @@ App.Utils.WorkingPlan = (function () {
$modifiedRow.find('.edit-break, .delete-break').removeClass('d-none');
$modifiedRow.find('.save-break, .cancel-break').addClass('d-none');
}.bind(this)
}
);
/**
@ -531,7 +536,7 @@ App.Utils.WorkingPlan = (function () {
$(document).on(
'click',
'.save-break',
function (event) {
(event) => {
// Break's start time must always be prior to break's end.
const element = event.target;
@ -556,7 +561,7 @@ App.Utils.WorkingPlan = (function () {
$modifiedRow.find('.save-break, .cancel-break').addClass('d-none');
$modifiedRow.find('.edit-break, .delete-break').removeClass('d-none');
}.bind(this)
}
);
/**
@ -567,12 +572,12 @@ App.Utils.WorkingPlan = (function () {
$(document).on(
'click',
'.add-working-plan-exception',
function () {
() =>{
App.Components.WorkingPlanExceptionsModal.add().done(
function (date, workingPlanException) {
(date, workingPlanException) => {
let $tr = null;
$('.working-plan-exceptions tbody tr').each(function (index, tr) {
$('.working-plan-exceptions tbody tr').each((index, tr) => {
if (date === $(tr).data('date')) {
$tr = $(tr);
return false;
@ -586,9 +591,9 @@ App.Utils.WorkingPlan = (function () {
} else {
$newTr.appendTo('.working-plan-exceptions tbody');
}
}.bind(this)
}
);
}.bind(this)
}
);
/**
@ -601,26 +606,28 @@ App.Utils.WorkingPlan = (function () {
$(document).on(
'click',
'.edit-working-plan-exception',
function (event) {
(event) => {
const $tr = $(event.target).closest('tr');
const date = $tr.data('date');
const workingPlanException = $tr.data('workingPlanException');
App.Components.WorkingPlanExceptionsModal.edit(date, workingPlanException).done(
function (date, workingPlanException) {
(date, workingPlanException) => {
$tr.replaceWith(this.renderWorkingPlanExceptionRow(date, workingPlanException));
}.bind(this)
}
);
}.bind(this)
}
);
/**
* Event: Delete working plan exception Button "Click"
*
* Removes the current line from the "working plan exceptions" table.
*
* @param {jQuery.Event} event
*/
$(document).on('click', '.delete-working-plan-exception', function () {
$(this).closest('tr').remove();
$(document).on('click', '.delete-working-plan-exception', (event) => {
$(event.currentTarget).closest('tr').remove();
});
}
@ -635,7 +642,7 @@ App.Utils.WorkingPlan = (function () {
const timeFormat = vars('time_format') === 'regular' ? 'h:mm a' : 'HH:mm';
$('.working-plan input:checkbox').each(
function (index, checkbox) {
(index, checkbox) => {
const id = $(checkbox).attr('id');
if ($(checkbox).prop('checked') === true) {
workingPlan[id] = {
@ -645,7 +652,7 @@ App.Utils.WorkingPlan = (function () {
};
$('.breaks tr').each(
function (index, tr) {
(index, tr) => {
const day = this.convertDayToValue($(tr).find('.break-day').text());
if (day === id) {
@ -662,18 +669,18 @@ App.Utils.WorkingPlan = (function () {
)
});
}
}.bind(this)
}
);
// Sort breaks increasingly by hour within day
workingPlan[id].breaks.sort(function (break1, break2) {
workingPlan[id].breaks.sort((break1, break2) => {
// We can do a direct string comparison since we have time based on 24 hours clock.
return break1.start.localeCompare(break2.start);
});
} else {
workingPlan[id] = null;
}
}.bind(this)
}
);
return workingPlan;
@ -687,7 +694,7 @@ App.Utils.WorkingPlan = (function () {
getWorkingPlanExceptions() {
const workingPlanExceptions = {};
$('.working-plan-exceptions tbody tr').each(function (index, tr) {
$('.working-plan-exceptions tbody tr').each((index, tr) => {
const $tr = $(tr);
const date = $tr.data('date');
workingPlanExceptions[date] = $tr.data('workingPlanException');
@ -708,10 +715,10 @@ App.Utils.WorkingPlan = (function () {
App.Utils.UI.initializeTimepicker(
$('.working-plan input:text'),
{
onChange: (selectedDates) => {
onChange: (selectedDates, dateStr, instance) => {
const startMoment = moment(selectedDates[0]);
const $workEnd = $(this).parent().parent().find('.work-end');
const $workEnd = $(instance.input).closest('tr').find('.work-end');
const endMoment = moment($workEnd[0]._flatpickr.selectedDates[0])