Code refactoring and improvements for the working plan utilities page.

This commit is contained in:
Alex Tselegidis 2022-01-17 15:31:04 +01:00
parent b13fb1c574
commit 89c91fbf8b
1 changed files with 707 additions and 713 deletions

View File

@ -23,14 +23,14 @@ App.Utils.WorkingPlan = (function () {
*
* @class WorkingPlan
*/
const WorkingPlan = function () {
class WorkingPlan {
/**
* This flag is used when trying to cancel row editing. It is
* true only whenever the user presses the cancel button.
*
* @type {Boolean}
*/
this.enableCancel = false;
enableCancel = false;
/**
* This flag determines whether the jeditables are allowed to submit. It is
@ -38,15 +38,14 @@ App.Utils.WorkingPlan = (function () {
*
* @type {Boolean}
*/
this.enableSubmit = false;
};
enableSubmit = false;
/**
* Setup the dom elements of a given working plan.
*
* @param {Object} workingPlan Contains the working hours and breaks for each day of the week.
*/
WorkingPlan.prototype.setup = function (workingPlan) {
setup(workingPlan) {
const weekDayId = App.Utils.Date.getWeekdayId(App.Vars.first_weekday);
const workingPlanSorted = App.Utils.Date.sortWeekDictionary(workingPlan, weekDayId);
@ -105,7 +104,9 @@ App.Utils.WorkingPlan = (function () {
if (workingDay) {
$('#' + index).prop('checked', true);
$('#' + index + '-start').val(moment(workingDay.start, 'HH:mm').format(timeFormat).toLowerCase());
$('#' + index + '-start').val(
moment(workingDay.start, 'HH:mm').format(timeFormat).toLowerCase()
);
$('#' + index + '-end').val(moment(workingDay.end, 'HH:mm').format(timeFormat).toLowerCase());
// Sort day's breaks according to the starting hour
@ -187,21 +188,21 @@ App.Utils.WorkingPlan = (function () {
// Make break cells editable.
this.editableDayCell($('.breaks .break-day'));
this.editableTimeCell($('.breaks').find('.break-start, .break-end'));
};
}
/**
* Setup the dom elements of a given working plan exception.
*
* @param {Object} workingPlanExceptions Contains the working plan exception.
*/
WorkingPlan.prototype.setupWorkingPlanExceptions = function (workingPlanExceptions) {
setupWorkingPlanExceptions(workingPlanExceptions) {
for (const date in workingPlanExceptions) {
const workingPlanException = workingPlanExceptions[date];
this.renderWorkingPlanExceptionRow(date, workingPlanException).appendTo('.working-plan-exceptions tbody');
this.renderWorkingPlanExceptionRow(date, workingPlanException).appendTo(
'.working-plan-exceptions tbody'
);
}
}
};
/**
* Enable editable break day.
*
@ -209,7 +210,7 @@ App.Utils.WorkingPlan = (function () {
*
* @param {Object} $selector The jquery selector ready for use.
*/
WorkingPlan.prototype.editableDayCell = function ($selector) {
editableDayCell($selector) {
const weekDays = {};
weekDays[App.Lang.sunday] = App.Lang.sunday; //'Sunday';
weekDays[App.Lang.monday] = App.Lang.monday; //'Monday';
@ -220,7 +221,7 @@ App.Utils.WorkingPlan = (function () {
weekDays[App.Lang.saturday] = App.Lang.saturday; //'Saturday';
$selector.editable(
function (value, settings) {
function (value) {
return value;
},
{
@ -231,20 +232,19 @@ App.Utils.WorkingPlan = (function () {
submit: '<button type="button" class="d-none submit-editable">Submit</button>',
cancel: '<button type="button" class="d-none cancel-editable">Cancel</button>',
onblur: 'ignore',
onreset: function (settings, td) {
onreset: function () {
if (!this.enableCancel) {
return false; // disable ESC button
}
}.bind(this),
onsubmit: function (settings, td) {
onsubmit: function () {
if (!this.enableSubmit) {
return false; // disable Enter button
}
}.bind(this)
}
);
};
}
/**
* Enable editable break time.
*
@ -252,9 +252,9 @@ App.Utils.WorkingPlan = (function () {
*
* @param {Object} $selector The jquery selector ready for use.
*/
WorkingPlan.prototype.editableTimeCell = function ($selector) {
editableTimeCell($selector) {
$selector.editable(
function (value, settings) {
function (value) {
// Do not return the value because the user needs to press the "Save" button.
return value;
},
@ -272,20 +272,19 @@ App.Utils.WorkingPlan = (function () {
'text': App.Lang.cancel
}).get(0).outerHTML,
onblur: 'ignore',
onreset: function (settings, td) {
onreset: function () {
if (!this.enableCancel) {
return false; // disable ESC button
}
}.bind(this),
onsubmit: function (settings, td) {
onsubmit: function () {
if (!this.enableSubmit) {
return false; // disable Enter button
}
}.bind(this)
}
);
};
}
/**
* Enable editable break time.
*
@ -294,7 +293,7 @@ App.Utils.WorkingPlan = (function () {
* @param {String} date In "Y-m-d" format.
* @param {Object} workingPlanException Contains exception information.
*/
WorkingPlan.prototype.renderWorkingPlanExceptionRow = function (date, workingPlanException) {
renderWorkingPlanExceptionRow(date, workingPlanException) {
const timeFormat = App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm';
return $('<tr/>', {
@ -341,12 +340,11 @@ App.Utils.WorkingPlan = (function () {
})
]
});
};
}
/**
* Bind the event handlers.
*/
WorkingPlan.prototype.bindEventHandlers = function () {
bindEventHandlers() {
/**
* Event: Day Checkbox "Click"
*
@ -570,7 +568,7 @@ App.Utils.WorkingPlan = (function () {
function () {
App.Components.WorkingPlanExceptionsModal.add().done(
function (date, workingPlanException) {
const $tr = null;
let $tr = null;
$('.working-plan-exceptions tbody tr').each(function (index, tr) {
if (date === $(tr).data('date')) {
@ -622,14 +620,13 @@ App.Utils.WorkingPlan = (function () {
$(document).on('click', '.delete-working-plan-exception', function () {
$(this).closest('tr').remove();
});
};
}
/**
* Get the working plan settings.
*
* @return {Object} Returns the working plan settings object.
*/
WorkingPlan.prototype.get = function () {
get() {
const workingPlan = {};
$('.working-plan input:checkbox').each(
@ -655,9 +652,10 @@ App.Utils.WorkingPlan = (function () {
start,
App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm'
).format('HH:mm'),
end: moment(end, App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm').format(
'HH:mm'
)
end: moment(
end,
App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm'
).format('HH:mm')
});
}
}.bind(this)
@ -675,14 +673,13 @@ App.Utils.WorkingPlan = (function () {
);
return workingPlan;
};
}
/**
* Get the working plan exceptions settings.
*
* @return {Object} Returns the working plan exceptions settings object.
*/
WorkingPlan.prototype.getWorkingPlanExceptions = function () {
getWorkingPlanExceptions() {
const workingPlanExceptions = {};
$('.working-plan-exceptions tbody tr').each(function (index, tr) {
@ -692,14 +689,13 @@ App.Utils.WorkingPlan = (function () {
});
return workingPlanExceptions;
};
}
/**
* Enables or disables the timepicker functionality from the working plan input text fields.
*
* @param {Boolean} [disabled] If true then the timepickers will be disabled.
*/
WorkingPlan.prototype.timepickers = function (disabled) {
timepickers(disabled) {
disabled = disabled || false;
if (disabled === false) {
@ -713,7 +709,7 @@ App.Utils.WorkingPlan = (function () {
hourText: App.Lang.hour,
minuteText: App.Lang.minutes,
onSelect: function (datetime, inst) {
onSelect: function () {
// Start time must be earlier than end time.
const startMoment = moment($(this).parent().parent().find('.work-start').val(), 'HH:mm');
@ -736,19 +732,17 @@ App.Utils.WorkingPlan = (function () {
} else {
$('.working-plan input').timepicker('destroy');
}
};
}
/**
* Reset the current plan back to the company's default working plan.
*/
WorkingPlan.prototype.reset = function () {};
reset() {}
/**
* This is necessary for translated days.
*
* @param {String} value Day value could be like "monday", "tuesday" etc.
*/
WorkingPlan.prototype.convertValueToDay = function (value) {
convertValueToDay(value) {
switch (value) {
case 'sunday':
return App.Lang.sunday;
@ -765,14 +759,13 @@ App.Utils.WorkingPlan = (function () {
case 'saturday':
return App.Lang.saturday;
}
};
}
/**
* This is necessary for translated days.
*
* @param {String} day Day value could be like "Monday", "Tuesday" etc.
*/
WorkingPlan.prototype.convertDayToValue = function (day) {
convertDayToValue(day) {
switch (day) {
case App.Lang.sunday:
return 'sunday';
@ -789,7 +782,8 @@ App.Utils.WorkingPlan = (function () {
case App.Lang.saturday:
return 'saturday';
}
};
}
}
return WorkingPlan;
})();