[1081] Made show booking form field settings functional
This commit is contained in:
parent
ea2cdeff70
commit
1bcbf9f71b
5 changed files with 219 additions and 56 deletions
|
@ -1444,6 +1444,24 @@ class Backend_api extends EA_Controller {
|
|||
|
||||
$settings = json_decode($this->input->post('settings', FALSE), TRUE);
|
||||
|
||||
//check if phone number settings are valid
|
||||
$phone_number_required = false;
|
||||
$phone_number_shown = false;
|
||||
foreach ($settings as $setting)
|
||||
{
|
||||
if ($setting['name'] == "require_phone_number"){
|
||||
$phone_number_required = $setting['value'];
|
||||
}
|
||||
|
||||
if ($setting['name'] == "show_phone_number"){
|
||||
$phone_number_shown = $setting['value'];
|
||||
}
|
||||
}
|
||||
|
||||
if ($phone_number_required && !$phone_number_shown){//we have settings that break the appointments field.
|
||||
throw new Exception("You cannot hide the phone number in the booking form while it's also required!");
|
||||
}
|
||||
|
||||
$this->settings_model->save_settings($settings);
|
||||
}
|
||||
else
|
||||
|
|
|
@ -168,6 +168,70 @@
|
|||
</span>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- CLIENT FORM TAB -->
|
||||
|
||||
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE) ? '' : 'd-none' ?>
|
||||
<div class="tab-pane <?= $hidden ?>" id="client-form">
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend class="border-bottom mb-4">
|
||||
<?= lang('client_form') ?>
|
||||
<?php if ($privileges[PRIV_SYSTEM_SETTINGS]['edit'] == TRUE): ?>
|
||||
<button type="button" class="save-settings btn btn-primary btn-sm mb-2"
|
||||
data-tippy-content="<?= lang('save') ?>">
|
||||
<i class="fas fa-check-square mr-2"></i>
|
||||
<?= lang('save') ?>
|
||||
</button>
|
||||
<?php endif ?>
|
||||
</legend>
|
||||
|
||||
<div class="wrapper row">
|
||||
<div class="col-12 col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="show-phone-number"><?= lang('phone_number') ?></label>
|
||||
<button id="show-phone-number" data-field="show_phone_number" type="button" class="hide-toggle form-control form-sub-button">
|
||||
<div class="hide-toggle-visible hidden"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></div>
|
||||
<div class="hide-toggle-hidden"><img src="<?= base_url('assets/img/eye-hidden.svg') ?>"/> <?= lang('hidden') ?></div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-address"><?= lang('address') ?></label>
|
||||
<button id="show-address" data-field="show_address" type="button" class="hide-toggle form-control form-sub-button">
|
||||
<div class="hide-toggle-visible hidden"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></div>
|
||||
<div class="hide-toggle-hidden"><img src="<?= base_url('assets/img/eye-hidden.svg') ?>"/> <?= lang('hidden') ?></div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-city"><?= lang('city') ?></label>
|
||||
<button id="show-city" data-field="show_city" type="button" class="hide-toggle form-control form-sub-button">
|
||||
<div class="hide-toggle-visible hidden"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></div>
|
||||
<div class="hide-toggle-hidden"><img src="<?= base_url('assets/img/eye-hidden.svg') ?>"/> <?= lang('hidden') ?></div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-zip-code"><?= lang('zip_code') ?></label>
|
||||
<button id="show-zip-code" data-field="show_zip_code" type="button" class="hide-toggle form-control form-sub-button">
|
||||
<div class="hide-toggle-visible hidden"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></div>
|
||||
<div class="hide-toggle-hidden"><img src="<?= base_url('assets/img/eye-hidden.svg') ?>"/> <?= lang('hidden') ?></div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-notes"><?= lang('notes') ?></label>
|
||||
<button id="show-notes" data-field="show_notes" type="button" class="hide-toggle form-control form-sub-button">
|
||||
<div class="hide-toggle-visible hidden"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></div>
|
||||
<div class="hide-toggle-hidden"><img src="<?= base_url('assets/img/eye-hidden.svg') ?>"/> <?= lang('hidden') ?></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-sm-6">
|
||||
<div class="form-group">
|
||||
<div class="custom-control custom-switch">
|
||||
<input type="checkbox" class="custom-control-input" id="customer-notifications">
|
||||
|
@ -214,61 +278,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- CLIENT FORM TAB -->
|
||||
|
||||
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE) ? '' : 'd-none' ?>
|
||||
<div class="tab-pane <?= $hidden ?>" id="client-form">
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend class="border-bottom mb-4">
|
||||
<?= lang('client_form') ?>
|
||||
<?php if ($privileges[PRIV_SYSTEM_SETTINGS]['edit'] == TRUE): ?>
|
||||
<button type="button" class="save-settings btn btn-primary btn-sm mb-2"
|
||||
data-tippy-content="<?= lang('save') ?>">
|
||||
<i class="fas fa-check-square mr-2"></i>
|
||||
<?= lang('save') ?>
|
||||
</button>
|
||||
<?php endif ?>
|
||||
</legend>
|
||||
|
||||
<div class="wrapper row">
|
||||
<div class="col-12 col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="show-phone-number"><?= lang('phone_number') ?></label>
|
||||
<button id="show-phone-number" data-field="show_phone_number" type="button" class="form-control form-sub-button"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-address"><?= lang('address') ?></label>
|
||||
<button id="show-address" data-field="show_address" type="button" class="form-control form-sub-button"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-city"><?= lang('city') ?></label>
|
||||
<button id="show-city" data-field="show_city" type="button" class="form-control form-sub-button"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-zip-code"><?= lang('zip_code') ?></label>
|
||||
<button id="show-zip-code" data-field="show_zip_code" type="button" class="form-control form-sub-button"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="show-notes"><?= lang('notes') ?></label>
|
||||
<button id="show-notes" data-field="show_notes" type="button" class="form-control form-sub-button"><img src="<?= base_url('assets/img/eye.svg') ?>"/> <?= lang('visible') ?></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="col-12 col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="company-name"><?= lang('company_name') ?> *</label>
|
||||
<input id="company-name" data-field="company_name" class="required form-control">
|
||||
<span class="form-text text-muted">
|
||||
<?= lang('company_name_hint') ?>
|
||||
</span>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
|
||||
</fieldset>
|
||||
|
|
|
@ -285,7 +285,16 @@ body legend {
|
|||
}
|
||||
|
||||
.form-sub-button img{
|
||||
margin-top: -.3rem;
|
||||
margin-top: -.25rem;
|
||||
}
|
||||
|
||||
.hidden{
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.hide-toggle div{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
|
|
|
@ -101,6 +101,26 @@ window.BackendSettings = window.BackendSettings || {};
|
|||
if (setting.name === 'privacy_policy_content') {
|
||||
$('#privacy-policy-content').trumbowyg('html', setting.value);
|
||||
}
|
||||
|
||||
if (setting.name === 'show_phone_number' && setting.value === "1") {
|
||||
$('#show-phone-number').find("div").toggleClass("hidden");
|
||||
}
|
||||
|
||||
if (setting.name === 'show_address' && setting.value === "1") {
|
||||
$('#show-address').find("div").toggleClass("hidden");
|
||||
}
|
||||
|
||||
if (setting.name === 'show_city' && setting.value === "1") {
|
||||
$('#show-city').find("div").toggleClass("hidden");
|
||||
}
|
||||
|
||||
if (setting.name === 'show_zip_code' && setting.value === "1") {
|
||||
$('#show-zip-code').find("div").toggleClass("hidden");
|
||||
}
|
||||
|
||||
if (setting.name === 'show_notes' && setting.value === "1") {
|
||||
$('#show-notes').find("div").toggleClass("hidden");
|
||||
}
|
||||
});
|
||||
|
||||
exports.wp = new WorkingPlan();
|
||||
|
@ -187,6 +207,63 @@ window.BackendSettings = window.BackendSettings || {};
|
|||
settings.save(data);
|
||||
});
|
||||
|
||||
/**
|
||||
* Event: Visible/Hidden button "Click"
|
||||
*
|
||||
* Change the state of the Visible/Hidden button
|
||||
*/
|
||||
$('.hide-toggle').on('click', function () {
|
||||
let $input = $(this);
|
||||
$input.find("div").toggleClass("hidden");
|
||||
});
|
||||
|
||||
/**
|
||||
* set a Visible/Hidden toggle button to a certain state
|
||||
*
|
||||
* @argument $element for which jquery element to set the state for
|
||||
* @argument isVisible a boolean which is true if the button should display 'visible' and false when the button should display 'hidden'
|
||||
*
|
||||
*/
|
||||
function setShowToggleValue($element, isVisible){
|
||||
if (getShowToggleValue($element) !== isVisible){
|
||||
$element.find("div").toggleClass("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* get the Visible/Hidden toggle button
|
||||
*
|
||||
* @argument $element for which jquery element to set the state for
|
||||
*
|
||||
* @return the state of the button. True for visible, false for hidden.
|
||||
*/
|
||||
function getShowToggleValue($element){
|
||||
let visiblePartArray = $element.find(".hide-toggle-visible");
|
||||
return !visiblePartArray.hasClass("hidden");
|
||||
}
|
||||
|
||||
/**
|
||||
* Event: require phone number switch "Click"
|
||||
*
|
||||
* make sure that our phone number is visible when it is required.
|
||||
*/
|
||||
$('#show-phone-number').on('click', function () {
|
||||
if (!getShowToggleValue($(this))){//if button is set to hidden
|
||||
$('#require-phone-number').prop('checked', false);
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Event: require phone number switch "Click"
|
||||
*
|
||||
* make sure that our phone number is visible when it is required.
|
||||
*/
|
||||
$('#require-phone-number').on('click', function () {
|
||||
if ($(this).prop('checked')){
|
||||
setShowToggleValue($('#show-phone-number'), true);
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Event: Username "Focusout"
|
||||
*
|
||||
|
|
|
@ -63,6 +63,29 @@
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the state of a visible/hidden toggle button
|
||||
*
|
||||
* This method uses the DOM elements of the backend/settings page, so it can't be used in another page.
|
||||
*
|
||||
* @argument the element jquery of a button object that is a visible/hidden toggle.
|
||||
*
|
||||
* @return '0' when the button shows 'invisible' and '1' when the button shows 'visible'. Will always return '0' on an error.
|
||||
*/
|
||||
function getToggleButtonState($element) {
|
||||
let visiblePartArray = $element.find(".hide-toggle-visible");
|
||||
let invisiblePartArray = $element.find(".hide-toggle-hidden");
|
||||
if (!(visiblePartArray.length === 0 || invisiblePartArray.length === 0)) {
|
||||
if (visiblePartArray.hasClass("hidden")){//our button is currently invisible
|
||||
return '0';//invisible
|
||||
}else{//our button is currently visible
|
||||
return '1';//visible
|
||||
}
|
||||
}else{
|
||||
return '0';//invisible
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Prepare the system settings array.
|
||||
*
|
||||
|
@ -102,6 +125,33 @@
|
|||
value: $('#display-any-provider').prop('checked') ? '1' : '0'
|
||||
});
|
||||
|
||||
//Client Form Tab
|
||||
|
||||
settings.push({
|
||||
name: 'show_phone_number',
|
||||
value: getToggleButtonState($('#show-phone-number'))
|
||||
});
|
||||
|
||||
settings.push({
|
||||
name: 'show_address',
|
||||
value: getToggleButtonState($('#show-address'))
|
||||
});
|
||||
|
||||
settings.push({
|
||||
name: 'show_city',
|
||||
value: getToggleButtonState($('#show-city'))
|
||||
});
|
||||
|
||||
settings.push({
|
||||
name: 'show_zip_code',
|
||||
value: getToggleButtonState($('#show-zip-code'))
|
||||
});
|
||||
|
||||
settings.push({
|
||||
name: 'show_notes',
|
||||
value: getToggleButtonState($('#show-notes'))
|
||||
});
|
||||
|
||||
|
||||
// Business Logic Tab
|
||||
|
||||
|
|
Loading…
Reference in a new issue