Add customer language and timezone fields to the appointments modal (#1094)

This commit is contained in:
Alex Tselegidis 2022-03-29 10:15:24 +02:00
parent c5ab2849cd
commit 669aa2f6c6
6 changed files with 54 additions and 8 deletions

View file

@ -137,6 +137,7 @@ class Calendar extends EA_Controller {
'user_display_name' => $this->accounts->get_user_display_name($user_id),
'timezone' => session('timezone'),
'timezones' => $this->timezones->to_array(),
'grouped_timezones' => $this->timezones->to_grouped_array(),
'privileges' => $privileges,
'calendar_view' => $calendar_view,
'available_providers' => $available_providers,

View file

@ -243,6 +243,20 @@
<input type="text" id="phone-number" maxlength="60"
class="<?= $require_phone_number ? 'required' : '' ?> form-control"/>
</div>
<div class="mb-3">
<label class="form-label" for="language">
<?= lang('language') ?>
<span class="text-danger" hidden>*</span>
</label>
<select id="language" class="form-control required">
<?php foreach (vars('available_languages') as $available_language): ?>
<option value="<?= $available_language ?>">
<?= ucfirst($available_language) ?>
</option>
<?php endforeach ?>
</select>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="mb-3">
@ -281,6 +295,17 @@
maxlength="120"/>
</div>
<div class="mb-3">
<label class="form-label" for="timezone">
<?= lang('timezone') ?>
<span class="text-danger" hidden>*</span>
</label>
<?php component('timezone_dropdown', [
'attributes' => 'id="timezone" class="form-control required"',
'grouped_timezones' => vars('grouped_timezones')
]) ?>
</div>
<div class="mb-3">
<label for="customer-notes" class="form-label">
<?= lang('notes') ?>

View file

@ -3,12 +3,12 @@
* Local variables.
*
* @var string $attributes
* @var array $timezones
* @var array $grouped_timezones
*/
?>
<select <?= $attributes ?>>
<?php foreach ($timezones as $continent => $entries): ?>
<?php foreach ($grouped_timezones as $continent => $entries): ?>
<optgroup label="<?= $continent ?>">
<?php foreach ($entries as $value => $name): ?>
<option value="<?= $value ?>"><?= $name ?></option>

View file

@ -29,6 +29,8 @@ App.Components.AppointmentsModal = (function () {
const $address = $('#address');
const $city = $('#city');
const $zipCode = $('#zip-code');
const $language = $('#language');
const $timezone = $('#timezone');
const $customerNotes = $('#customer-notes');
const $selectCustomer = $('#select-customer');
const $saveAppointment = $('#save-appointment');
@ -104,6 +106,8 @@ App.Components.AppointmentsModal = (function () {
address: $address.val(),
city: $city.val(),
zip_code: $zipCode.val(),
language: $language.val(),
timezone: $timezone.val(),
notes: $customerNotes.val()
};
@ -248,6 +252,8 @@ App.Components.AppointmentsModal = (function () {
$address.val(customer.address);
$city.val(customer.city);
$zipCode.val(customer.zip_code);
$language.val(customer.language);
$timezone.val(customer.timezone);
$customerNotes.val(customer.notes);
}
@ -378,12 +384,17 @@ App.Components.AppointmentsModal = (function () {
* Event: Enter New Customer Button "Click"
*/
$newCustomer.on('click', () => {
$appointmentsModal
.find(
'#customer-id, #first-name, #last-name, #email, ' +
'#phone-number, #address, #city, #zip-code, #customer-notes'
)
.val('');
$customerId.val('');
$firstName.val('');
$lastName.val('');
$email.val('');
$phoneNumber.val('');
$address.val('');
$city.val('');
$zipCode.val('');
$language.val('english');
$timezone.val('UTC');
$customerNotes.val('');
});
}
@ -397,6 +408,9 @@ App.Components.AppointmentsModal = (function () {
// Empty form fields.
$appointmentsModal.find('input, textarea').val('');
$appointmentsModal.find('.modal-message').fadeOut();
$language.val('english');
$timezone.val('UTC');
// Reset color.
$appointmentColor.find('.color-selection-option:first').trigger('click');

View file

@ -146,6 +146,8 @@ App.Utils.CalendarDefaultView = (function () {
$appointmentsModal.find('#address').val(customer.address);
$appointmentsModal.find('#city').val(customer.city);
$appointmentsModal.find('#zip-code').val(customer.zip_code);
$appointmentsModal.find('#language').val(customer.language);
$appointmentsModal.find('#timezone').val(customer.timezone);
$appointmentsModal.find('#appointment-location').val(appointment.location);
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);
@ -1666,6 +1668,8 @@ App.Utils.CalendarDefaultView = (function () {
$appointmentsModal.find('#address').val(customer.address);
$appointmentsModal.find('#city').val(customer.city);
$appointmentsModal.find('#zip-code').val(customer.zip_code);
$appointmentsModal.find('#language').val(customer.language);
$appointmentsModal.find('#timezone').val(customer.timezone);
$appointmentsModal.find('#appointment-location').val(appointment.location);
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);

View file

@ -217,6 +217,8 @@ App.Utils.CalendarTableView = (function () {
$appointmentsModal.find('#address').val(customer.address);
$appointmentsModal.find('#city').val(customer.city);
$appointmentsModal.find('#zip-code').val(customer.zip_code);
$appointmentsModal.find('#language').val(customer.language);
$appointmentsModal.find('#timezone').val(customer.timezone);
$appointmentsModal.find('#appointment-location').val(appointment.location);
$appointmentsModal.find('#appointment-notes').val(appointment.notes);
$appointmentsModal.find('#customer-notes').val(customer.notes);