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

Apply the new color selection component to the appointments modal.

Browse source
This commit is contained in:
Alex Tselegidis 2022-01-18 19:01:26 +01:00
parent 73a6c791ec
commit 0f0b3c114e
4 changed files with 22 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
application/views/components/appointments_modal.php
View file

@ -119,6 +119,10 @@
<select id="select-provider" class="required form-control"></select>
</div>
<div class="mb-3">
<?php component('color_selection', ['attributes' => 'id="appointment-color"']) ?>
</div>
<div class="mb-3">
<label for="appointment-location" class="form-label">
<?= lang('location') ?>

5
assets/js/components/appointments_modal.js
View file

@ -34,6 +34,7 @@ App.Components.AppointmentsModal = (function () {
const $saveAppointment = $('#save-appointment');
const $appointmentId = $('#appointment-id');
const $appointmentLocation = $('#appointment-location');
const $appointmentColor = $('#appointment-color');
const $appointmentNotes = $('#appointment-notes');
const $reloadAppointments = $('#reload-appointments');
const $selectFilterItem = $('#select-filter-item');
@ -85,6 +86,7 @@ App.Components.AppointmentsModal = (function () {
start_datetime: startDatetime,
end_datetime: endDatetime,
location: $appointmentLocation.val(),
color: App.Components.ColorSelection.getColor($appointmentColor),
notes: $appointmentNotes.val(),
is_unavailability: Number(false)
};
@ -396,6 +398,9 @@ App.Components.AppointmentsModal = (function () {
$appointmentsModal.find('input, textarea').val('');
$appointmentsModal.find('.modal-message').fadeOut();
// Reset color.
$appointmentColor.find('.color-selection-option:first').trigger('click');
// Prepare service and provider select boxes.
$selectService.val($selectService.eq(0).attr('value'));

8
assets/js/utils/calendar_default_view.js
View file

@ -143,6 +143,12 @@ App.Utils.CalendarDefaultView = (function () {
$appointmentsModal.find('#appointment-location').val(appointment.location);
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);
App.Components.ColorSelection.setColor(
$appointmentsModal.find('#appointment-color'),
appointment.color
);
$appointmentsModal.modal('show');
} else {
const unavailability = lastFocusedEventData.extendedProps.data;
@ -1631,6 +1637,8 @@ App.Utils.CalendarDefaultView = (function () {
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);
App.Components.ColorSelection.setColor($appointmentsModal.find('#appointment-color'), appointment.color);
$appointmentsModal.modal('show');
fullCalendar.gotoDate(moment(appointment.start_datetime).toDate());

5
assets/js/utils/calendar_table_view.js
View file

@ -221,6 +221,11 @@ App.Utils.CalendarTableView = (function () {
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);
App.Components.ColorSelection.setColor(
$appointmentsModal.find('#appointment-color'),
appointment.color
);
$appointmentsModal.modal('show');
} else {
const unavailability = lastFocusedEventData.extendedProps.data;