Update the default view so that it works with FullCalendar 5
This commit is contained in:
parent
a762a37d7b
commit
387ac5bc19
5 changed files with 255 additions and 298 deletions
|
@ -415,9 +415,7 @@ class Calendar extends EA_Controller {
|
||||||
{
|
{
|
||||||
try
|
try
|
||||||
{
|
{
|
||||||
$required_permissions = can('edit', PRIV_USERS);
|
if (cannot('edit', PRIV_USERS))
|
||||||
|
|
||||||
if ( ! $required_permissions)
|
|
||||||
{
|
{
|
||||||
throw new Exception('You do not have the required permissions for this task.');
|
throw new Exception('You do not have the required permissions for this task.');
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
<?php section('styles') ?>
|
<?php section('styles') ?>
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="<?= asset_url('/assets/vendor/fullcalendar/fullcalendar.min.css') ?>">
|
<link rel="stylesheet" type="text/css" href="<?= asset_url('/assets/vendor/fullcalendar/main.min.css') ?>">
|
||||||
|
|
||||||
<?php section('styles') ?>
|
<?php section('styles') ?>
|
||||||
|
|
||||||
|
@ -119,10 +119,10 @@
|
||||||
|
|
||||||
<?php section('scripts') ?>
|
<?php section('scripts') ?>
|
||||||
|
|
||||||
<script src="<?= asset_url('assets/vendor/fullcalendar/fullcalendar.min.js') ?>"></script>
|
<script src="<?= asset_url('assets/vendor/fullcalendar/main.min.js') ?>"></script>
|
||||||
|
<script src="<?= asset_url('assets/vendor/fullcalendar-moment/main.global.min.js') ?>"></script>
|
||||||
<script src="<?= asset_url('assets/vendor/jquery-jeditable/jquery.jeditable.min.js') ?>"></script>
|
<script src="<?= asset_url('assets/vendor/jquery-jeditable/jquery.jeditable.min.js') ?>"></script>
|
||||||
<script src="<?= asset_url('assets/vendor/jquery-ui-timepicker-addon/jquery-ui-timepicker-addon.min.js') ?>"></script>
|
<script src="<?= asset_url('assets/vendor/jquery-ui-timepicker-addon/jquery-ui-timepicker-addon.min.js') ?>"></script>
|
||||||
<script src="<?= asset_url('assets/js/components/working_plan_exceptions_modal.js') ?>"></script>
|
|
||||||
<script src="<?= asset_url('assets/js/utils/date.js') ?>"></script>
|
<script src="<?= asset_url('assets/js/utils/date.js') ?>"></script>
|
||||||
<script src="<?= asset_url('assets/js/utils/message.js') ?>"></script>
|
<script src="<?= asset_url('assets/js/utils/message.js') ?>"></script>
|
||||||
<script src="<?= asset_url('assets/js/utils/validation.js') ?>"></script>
|
<script src="<?= asset_url('assets/js/utils/validation.js') ?>"></script>
|
||||||
|
|
|
@ -35,6 +35,7 @@ App.Components.AppointmentsModal = (function () {
|
||||||
const $appointmentId = $('#appointment-id');
|
const $appointmentId = $('#appointment-id');
|
||||||
const $appointmentLocation = $('#appointment-location');
|
const $appointmentLocation = $('#appointment-location');
|
||||||
const $appointmentNotes = $('#appointment-notes');
|
const $appointmentNotes = $('#appointment-notes');
|
||||||
|
const $reloadAppointments = $('#reload-appointments');
|
||||||
const $selectFilterItem = $('#select-filter-item');
|
const $selectFilterItem = $('#select-filter-item');
|
||||||
const $selectService = $('#select-service');
|
const $selectService = $('#select-service');
|
||||||
const $selectProvider = $('#select-provider');
|
const $selectProvider = $('#select-provider');
|
||||||
|
@ -118,7 +119,7 @@ App.Components.AppointmentsModal = (function () {
|
||||||
// Close the modal dialog and refresh the calendar appointments.
|
// Close the modal dialog and refresh the calendar appointments.
|
||||||
$appointmentsModal.find('.alert').addClass('d-none');
|
$appointmentsModal.find('.alert').addClass('d-none');
|
||||||
$appointmentsModal.modal('hide');
|
$appointmentsModal.modal('hide');
|
||||||
$selectFilterItem.trigger('change');
|
$reloadAppointments.trigger('click');
|
||||||
};
|
};
|
||||||
|
|
||||||
// Define error callback.
|
// Define error callback.
|
||||||
|
|
|
@ -18,14 +18,15 @@
|
||||||
*/
|
*/
|
||||||
App.Components.UnavailabilitiesModal = (function () {
|
App.Components.UnavailabilitiesModal = (function () {
|
||||||
const $unavailabilitiesModal = $('#unavailabilities-modal');
|
const $unavailabilitiesModal = $('#unavailabilities-modal');
|
||||||
const $unavailabilityId = $('#unavailability-id');
|
const $id = $('#unavailability-id');
|
||||||
const $unavailabilityStart = $('#unavailability-start');
|
const $startDatetime = $('#unavailability-start');
|
||||||
const $unavailabilityEnd = $('#unavailability-end');
|
const $endDatetime = $('#unavailability-end');
|
||||||
const $unavailabilityProvider = $('#unavailability-provider');
|
const $selectProvider = $('#unavailability-provider');
|
||||||
const $unavailabilityNotes = $('#unavailability-notes');
|
const $notes = $('#unavailability-notes');
|
||||||
const $saveUnavailability = $('#save-unavailability');
|
const $saveUnavailability = $('#save-unavailability');
|
||||||
const $insertUnavailability = $('#insert-unavailability');
|
const $insertUnavailability = $('#insert-unavailability');
|
||||||
const $selectFilterItem = $('#select-filter-item');
|
const $selectFilterItem = $('#select-filter-item');
|
||||||
|
const $reloadAppointments = $('#reload-appointments');
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Add the component event listeners.
|
* Add the component event listeners.
|
||||||
|
@ -40,17 +41,17 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
$unavailabilitiesModal.find('.modal-message').addClass('d-none');
|
$unavailabilitiesModal.find('.modal-message').addClass('d-none');
|
||||||
$unavailabilitiesModal.find('.is-invalid').removeClass('is-invalid');
|
$unavailabilitiesModal.find('.is-invalid').removeClass('is-invalid');
|
||||||
|
|
||||||
const startMoment = moment($unavailabilityStart.datetimepicker('getDate'));
|
const startMoment = moment($startDatetime.datetimepicker('getDate'));
|
||||||
|
|
||||||
if (!startMoment.isValid()) {
|
if (!startMoment.isValid()) {
|
||||||
$unavailabilityStart.addClass('is-invalid');
|
$startDatetime.addClass('is-invalid');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const endMoment = moment($unavailabilityEnd.datetimepicker('getDate'));
|
const endMoment = moment($endDatetime.datetimepicker('getDate'));
|
||||||
|
|
||||||
if (!endMoment.isValid()) {
|
if (!endMoment.isValid()) {
|
||||||
$unavailabilityEnd.addClass('is-invalid');
|
$endDatetime.addClass('is-invalid');
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -63,9 +64,9 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
.addClass('alert-danger')
|
.addClass('alert-danger')
|
||||||
.removeClass('d-none');
|
.removeClass('d-none');
|
||||||
|
|
||||||
$unavailabilityStart.addClass('is-invalid');
|
$startDatetime.addClass('is-invalid');
|
||||||
|
|
||||||
$unavailabilityEnd.addClass('is-invalid');
|
$endDatetime.addClass('is-invalid');
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -78,9 +79,9 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
id_users_provider: $('#unavailability-provider').val()
|
id_users_provider: $('#unavailability-provider').val()
|
||||||
};
|
};
|
||||||
|
|
||||||
if ($unavailabilityId.val() !== '') {
|
if ($id.val() !== '') {
|
||||||
// Set the id value, only if we are editing an appointment.
|
// Set the id value, only if we are editing an appointment.
|
||||||
unavailability.id = $unavailabilityId.val();
|
unavailability.id = $id.val();
|
||||||
}
|
}
|
||||||
|
|
||||||
const successCallback = () => {
|
const successCallback = () => {
|
||||||
|
@ -92,7 +93,7 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
|
|
||||||
$unavailabilitiesModal.modal('hide');
|
$unavailabilitiesModal.modal('hide');
|
||||||
|
|
||||||
$selectFilterItem.trigger('change');
|
$reloadAppointments.trigger('change');
|
||||||
};
|
};
|
||||||
|
|
||||||
App.Http.Calendar.saveUnavailability(unavailability, successCallback, null);
|
App.Http.Calendar.saveUnavailability(unavailability, successCallback, null);
|
||||||
|
@ -125,13 +126,13 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($('.calendar-view').length === 0) {
|
if ($('.calendar-view').length === 0) {
|
||||||
$unavailabilityProvider.val($selectFilterItem.val()).closest('.form-group').hide();
|
$selectProvider.val($selectFilterItem.val()).closest('.form-group').hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
$unavailabilityStart.val(
|
$startDatetime.val(
|
||||||
App.Utils.Date.format(startMoment.toDate(), vars('date_format'), vars('time_format'), true)
|
App.Utils.Date.format(startMoment.toDate(), vars('date_format'), vars('time_format'), true)
|
||||||
);
|
);
|
||||||
$unavailabilityEnd.val(
|
$endDatetime.val(
|
||||||
App.Utils.Date.format(
|
App.Utils.Date.format(
|
||||||
startMoment.add(1, 'hour').toDate(),
|
startMoment.add(1, 'hour').toDate(),
|
||||||
vars('date_format'),
|
vars('date_format'),
|
||||||
|
@ -151,7 +152,7 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
* before it becomes visible to the user.
|
* before it becomes visible to the user.
|
||||||
*/
|
*/
|
||||||
function resetModal() {
|
function resetModal() {
|
||||||
$unavailabilityId.val('');
|
$id.val('');
|
||||||
|
|
||||||
// Set default time values
|
// Set default time values
|
||||||
const start = App.Utils.Date.format(moment().toDate(), vars('date_format'), vars('time_format'), true);
|
const start = App.Utils.Date.format(moment().toDate(), vars('date_format'), vars('time_format'), true);
|
||||||
|
@ -181,7 +182,7 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
|
|
||||||
const firstWeekdayId = App.Utils.Date.getWeekdayId(firstWeekday);
|
const firstWeekdayId = App.Utils.Date.getWeekdayId(firstWeekday);
|
||||||
|
|
||||||
$unavailabilityStart.datetimepicker({
|
$startDatetime.datetimepicker({
|
||||||
dateFormat: dateFormat,
|
dateFormat: dateFormat,
|
||||||
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm',
|
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm',
|
||||||
|
|
||||||
|
@ -237,9 +238,9 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
minuteText: lang('minutes'),
|
minuteText: lang('minutes'),
|
||||||
firstDay: firstWeekdayId
|
firstDay: firstWeekdayId
|
||||||
});
|
});
|
||||||
$unavailabilityStart.val(start);
|
$startDatetime.val(start);
|
||||||
|
|
||||||
$unavailabilityEnd.datetimepicker({
|
$endDatetime.datetimepicker({
|
||||||
dateFormat: dateFormat,
|
dateFormat: dateFormat,
|
||||||
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm',
|
timeFormat: vars('time_format') === 'regular' ? 'h:mm tt' : 'HH:mm',
|
||||||
|
|
||||||
|
@ -295,10 +296,10 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
minuteText: lang('minutes'),
|
minuteText: lang('minutes'),
|
||||||
firstDay: firstWeekdayId
|
firstDay: firstWeekdayId
|
||||||
});
|
});
|
||||||
$unavailabilityEnd.val(end);
|
$endDatetime.val(end);
|
||||||
|
|
||||||
// Clear the unavailability notes field.
|
// Clear the unavailability notes field.
|
||||||
$unavailabilityNotes.val('');
|
$notes.val('');
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -308,7 +309,7 @@ App.Components.UnavailabilitiesModal = (function () {
|
||||||
for (const index in vars('available_providers')) {
|
for (const index in vars('available_providers')) {
|
||||||
const provider = vars('available_providers')[index];
|
const provider = vars('available_providers')[index];
|
||||||
|
|
||||||
$unavailabilityProvider.append(new Option(provider.first_name + ' ' + provider.last_name, provider.id));
|
$selectProvider.append(new Option(provider.first_name + ' ' + provider.last_name, provider.id));
|
||||||
}
|
}
|
||||||
|
|
||||||
addEventListeners();
|
addEventListeners();
|
||||||
|
|
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue