Code refactoring and improvements for the working plan utilities page.
This commit is contained in:
parent
b13fb1c574
commit
89c91fbf8b
1 changed files with 707 additions and 713 deletions
|
@ -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;
|
||||
})();
|
||||
|
|
Loading…
Reference in a new issue