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

Replace the old time pickers in the working plan handling

Browse source
This commit is contained in:
Alex Tselegidis 2023-02-07 07:31:12 +01:00
parent 94570a3fdc
commit 0b444cc8ed
2 changed files with 36 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
assets/css/layouts/backend_layout.scss
View file

@ -706,6 +706,7 @@ body .form-horizontal .controls {
#providers-page #providers .working-plan-view .work-start, #providers-page #providers .working-plan-view .work-start,
#providers-page #providers .working-plan-view .work-end { #providers-page #providers .working-plan-view .work-end {
width: 100px;
max-width: 100px; max-width: 100px;
} }

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

@ -189,6 +189,7 @@ App.Utils.WorkingPlan = (function () {
this.editableDayCell($('.breaks .break-day')); this.editableDayCell($('.breaks .break-day'));
this.editableTimeCell($('.breaks').find('.break-start, .break-end')); this.editableTimeCell($('.breaks').find('.break-start, .break-end'));
} }
/** /**
* Setup the dom elements of a given working plan exception. * Setup the dom elements of a given working plan exception.
* *
@ -203,6 +204,7 @@ App.Utils.WorkingPlan = (function () {
); );
} }
} }
/** /**
* Enable editable break day. * Enable editable break day.
* *
@ -228,6 +230,7 @@ App.Utils.WorkingPlan = (function () {
type: 'select', type: 'select',
data: weekDays, data: weekDays,
event: 'edit', event: 'edit',
width: '100px',
height: '30px', height: '30px',
submit: '<button type="button" class="d-none submit-editable">Submit</button>', submit: '<button type="button" class="d-none submit-editable">Submit</button>',
cancel: '<button type="button" class="d-none cancel-editable">Cancel</button>', cancel: '<button type="button" class="d-none cancel-editable">Cancel</button>',
@ -245,6 +248,7 @@ App.Utils.WorkingPlan = (function () {
} }
); );
} }
/** /**
* Enable editable break time. * Enable editable break time.
* *
@ -260,6 +264,7 @@ App.Utils.WorkingPlan = (function () {
}, },
{ {
event: 'edit', event: 'edit',
width: '100px',
height: '30px', height: '30px',
submit: $('<button/>', { submit: $('<button/>', {
'type': 'button', 'type': 'button',
@ -285,8 +290,9 @@ App.Utils.WorkingPlan = (function () {
} }
); );
} }
/** /**
* Render a working plan exception row. * Render a working plan exception row.
* *
* This method makes editable the break time cells. * This method makes editable the break time cells.
* *
@ -341,6 +347,7 @@ App.Utils.WorkingPlan = (function () {
] ]
}); });
} }
/** /**
* Add the utility event listeners. * Add the utility event listeners.
*/ */
@ -466,19 +473,14 @@ App.Utils.WorkingPlan = (function () {
// Make all cells in current row editable. // Make all cells in current row editable.
$(this).parent().parent().children().trigger('edit'); $(this).parent().parent().children().trigger('edit');
$(this)
.parent() App.Utils.UI.initializeTimepicker(
.parent() $(this)
.find('.break-start input, .break-end input') .parent()
.timepicker({ .parent()
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm', .find('.break-start input, .break-end input')
currentText: lang('now'), );
closeText: lang('close'),
timeOnlyTitle: lang('select_time'),
timeText: lang('time'),
hourText: lang('hour'),
minuteText: lang('minutes')
});
$(this).parent().parent().find('.break-day select').focus(); $(this).parent().parent().find('.break-day select').focus();
// Show save - cancel buttons. // Show save - cancel buttons.
@ -621,6 +623,7 @@ App.Utils.WorkingPlan = (function () {
$(this).closest('tr').remove(); $(this).closest('tr').remove();
}); });
} }
/** /**
* Get the working plan settings. * Get the working plan settings.
* *
@ -675,6 +678,7 @@ App.Utils.WorkingPlan = (function () {
return workingPlan; return workingPlan;
} }
/** /**
* Get the working plan exceptions settings. * Get the working plan exceptions settings.
* *
@ -691,6 +695,7 @@ App.Utils.WorkingPlan = (function () {
return workingPlanExceptions; return workingPlanExceptions;
} }
/** /**
* Enables or disables the timepicker functionality from the working plan input text fields. * Enables or disables the timepicker functionality from the working plan input text fields.
* *
@ -700,44 +705,31 @@ App.Utils.WorkingPlan = (function () {
disabled = disabled || false; disabled = disabled || false;
if (disabled === false) { if (disabled === false) {
// Set timepickers where needed. App.Utils.UI.initializeTimepicker(
$('.working-plan input:text').timepicker({ $('.working-plan input:text'),
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm', {
currentText: lang('now'), onChange: (selectedDates) => {
closeText: lang('close'), const startMoment = moment(selectedDates[0]);
timeOnlyTitle: lang('select_time'),
timeText: lang('time'),
hourText: lang('hour'),
minuteText: lang('minutes'),
onSelect: function () { const $workEnd = $(this).parent().parent().find('.work-end');
// Start time must be earlier than end time.
const startMoment = moment($(this).parent().parent().find('.work-start').val(), 'HH:mm');
const endMoment = moment($(this).parent().parent().find('.work-end').val(), 'HH:mm'); const endMoment = moment($workEnd[0]._flatpickr.selectedDates[0])
if (startMoment > endMoment) { if (startMoment > endMoment) {
$(this) $workEnd[0]._flatpickr.setDate(startMoment.add(1, 'hour').toDate());
.parent() }
.parent()
.find('.work-end')
.val(
startMoment
.add(1, 'hour')
.format(vars('time_format') === 'regular' ? 'h:mm a' : 'HH:mm')
.toLowerCase()
);
} }
} }
}); )
} else {
$('.working-plan input').timepicker('destroy');
} }
} }
/** /**
* Reset the current plan back to the company's default working plan. * Reset the current plan back to the company's default working plan.
*/ */
reset() {} reset() {
}
/** /**
* This is necessary for translated days. * This is necessary for translated days.
* *
@ -761,6 +753,7 @@ App.Utils.WorkingPlan = (function () {
return lang('saturday'); return lang('saturday');
} }
} }
/** /**
* This is necessary for translated days. * This is necessary for translated days.
* *