maket/MaketRandevu
1
1
Fork 0
Code Issues 15 Pull requests Projects Releases 4 Packages Wiki Activity

Fix working plan handling and refactor to arrow functions

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

85
assets/js/utils/working_plan.js
View file

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