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

Refactored the business settings page functionality and structure

Browse source
This commit is contained in:
Alex Tselegidis 2021-12-18 21:36:25 +01:00
parent f14643725d
commit 6017abea45
8 changed files with 305 additions and 368 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
application/controllers/Business_settings.php
View file

@ -54,15 +54,16 @@ class Business_settings extends EA_Controller {
$user_id = session('user_id');
$role_slug = session('role_slug');
script_vars([
'business_settings' => $this->settings_model->get(),
'first_weekday' => setting('first_weekday'),
'time_format' => setting('time_format'),
]);
html_vars([
'page_title' => lang('settings'),
'active_menu' => PRIV_SYSTEM_SETTINGS,
'user_display_name' => $this->accounts->get_user_display_name($user_id),
'timezones' => $this->timezones->to_array(),
'privileges' => $this->roles_model->get_permissions_by_slug($role_slug),
'system_settings' => $this->settings_model->get(),
]);
$this->load->view('pages/business_settings', html_vars());
@ -80,7 +81,7 @@ class Business_settings extends EA_Controller {
throw new Exception('You do not have the required permissions for this task.');
}
$settings = json_decode(request('settings', FALSE), TRUE);
$settings = request('business_settings', []);
foreach ($settings as $setting)
{
@ -101,4 +102,33 @@ class Business_settings extends EA_Controller {
json_exception($e);
}
}
/**
* Apply global working plan to all providers.
*/
public function apply_global_working_plan()
{
try
{
if (cannot('edit', PRIV_SYSTEM_SETTINGS))
{
throw new Exception('You do not have the required permissions for this task.');
}
$working_plan = request('working_plan');
$providers = $this->providers_model->get();
foreach ($providers as $provider)
{
$this->providers_model->set_setting($provider['id'], 'working_plan', $working_plan);
}
response();
}
catch (Throwable $e)
{
json_exception($e);
}
}
}

88
application/views/pages/business_settings.php
View file

@ -1,33 +1,24 @@
<?php
/**
* @var array $system_settings
* @var array $user_settings
* @var string $timezones
* @var array $privileges
*/
?>
<?php extend('layouts/backend_layout') ?>
<?php section('content') ?>
<div id="business-logic-page" class="container-fluid backend-page">
<div id="business-logic-page" class="container backend-page">
<div id="business-logic">
<div class="row">
<div class="col-lg-8 offset-lg-2">
<form>
<fieldset>
<legend class="border-bottom mb-4">
<?= lang('Business_settings') ?>
<?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') ?>">
<legend class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?= lang('business_logic') ?>
<?php if (can('edit', PRIV_SYSTEM_SETTINGS)): ?>
<button type="button" id="save-settings" class="btn btn-primary btn-sm">
<i class="fas fa-check-square me-2"></i>
<?= lang('save') ?>
</button>
<?php endif ?>
</legend>
<div class="row">
<div class="col-12 col-sm-7 working-plan-wrapper">
<h4><?= lang('working_plan') ?></h4>
<div class="form-text text-muted mb-4">
@ -52,21 +43,6 @@
</button>
</div>
<br>
<h4><?= lang('book_advance_timeout') ?></h4>
<div class="mb-3">
<label for="book-advance-timeout" class="form-label">
<?= lang('timeout_minutes') ?>
</label>
<input id="book-advance-timeout" data-field="book_advance_timeout" class="form-control"
type="number" min="15">
<div class="form-text text-muted">
<?= lang('book_advance_timeout_hint') ?>
</div>
</div>
</div>
<div class="col-12 col-sm-5 breaks-wrapper">
<h4><?= lang('breaks') ?></h4>
<span class="form-text text-muted">
@ -82,7 +58,7 @@
<br>
<table class="breaks table table-striped">
<table class="breaks table table-striped mb-4">
<thead>
<tr>
<th><?= lang('day') ?></th>
@ -93,46 +69,38 @@
</thead>
<tbody><!-- Dynamic Content --></tbody>
</table>
<h4><?= lang('book_advance_timeout') ?></h4>
<div class="mb-3">
<label for="book-advance-timeout" class="form-label">
<?= lang('timeout_minutes') ?>
</label>
<input id="book-advance-timeout" data-field="book_advance_timeout" class="form-control"
type="number" min="15">
<div class="form-text text-muted">
<small>
<?= lang('book_advance_timeout_hint') ?>
</small>
</div>
</div>
</fieldset>
</form>
</div>
</div>
</div>
</div>
<?php section('content') ?>
<?php section('scripts') ?>
<script src="<?= asset_url('assets/js/pages/backend_settings_business_logic_helper.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/backend_settings_business_logic.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/working_plan.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-jeditable/jquery.jeditable.min.js') ?>"></script>
<script>
var GlobalVariables = {
csrfToken: <?= json_encode($this->security->get_csrf_hash()) ?>,
baseUrl: <?= json_encode(config('base_url')) ?>,
dateFormat: <?= json_encode(setting('date_format')) ?>,
timeFormat: <?= json_encode(setting('time_format')) ?>,
firstWeekday: <?= json_encode(setting('first_weekday')) ?>,
timezones: <?= json_encode($timezones) ?>,
settings: {
system: <?= json_encode($system_settings) ?>,
},
user: {
id: <?= session('user_id') ?>,
email: <?= json_encode(session('user_email')) ?>,
timezone: <?= json_encode(session('timezone')) ?>,
role_slug: <?= json_encode(session('role_slug')) ?>,
privileges: <?= json_encode($privileges) ?>
}
};
$(function () {
BackendSettingsBusinessLogic.initialize(true);
});
</script>
<script src="<?= asset_url('assets/js/utils/url.js') ?>"></script>
<script src="<?= asset_url('assets/js/utils/working_plan.js') ?>"></script>
<script src="<?= asset_url('assets/js/http/business_settings_http_client.js') ?>"></script>
<script src="<?= asset_url('assets/js/pages/business_settings.js') ?>"></script>
<?php section('scripts') ?>

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

@ -835,14 +835,6 @@ body .form-horizontal .controls {
max-width: 1024px;
}
#settings-page .working-plan-wrapper {
max-width: 600px;
}
#settings-page .breaks-wrapper {
max-width: 500px;
}
#settings-page .personal-info-wrapper {
max-width: 450px;
margin-bottom: 20px;

53
assets/js/http/business_settings_http_client.js Normal file
View file

@ -0,0 +1,53 @@
/* ----------------------------------------------------------------------------
* Easy!Appointments - Open Source Web Scheduler
*
* @package EasyAppointments
* @author A.Tselegidis <alextselegidis@gmail.com>
* @copyright Copyright (c) Alex Tselegidis
* @license https://opensource.org/licenses/GPL-3.0 - GPLv3
* @link https://easyappointments.org
* @since v1.5.0
* ---------------------------------------------------------------------------- */
App.Http.BusinessSettings = (function () {
/**
* Save business settings.
*
* @param {Object} businessSettings
*
* @return {Object}
*/
function save(businessSettings) {
const url = App.Utils.Url.siteUrl('business_settings/save');
const data = {
csrf_token: App.Vars.csrf_token,
business_settings: businessSettings
};
return $.post(url, data);
}
/**
* Apply global working plan.
*
* @param {Object} workingPlan
*
* @return {Object}
*/
function applyGlobalWorkingPlan(workingPlan) {
const url = App.Utils.Url.siteUrl('business_settings/apply_global_working_plan');
const data = {
csrf_token: App.Vars.csrf_token,
working_plan: JSON.stringify(workingPlan)
};
return $.post(url, data);
}
return {
save,
applyGlobalWorkingPlan
};
})();

141
assets/js/pages/backend_settings_business_logic.js
View file

@ -1,141 +0,0 @@
/* ----------------------------------------------------------------------------
* Easy!Appointments - Open Source Web Scheduler
*
* @package EasyAppointments
* @author A.Tselegidis <alextselegidis@gmail.com>
* @copyright Copyright (c) Alex Tselegidis
* @license https://opensource.org/licenses/GPL-3.0 - GPLv3
* @link https://easyappointments.org
* @since v1.0.0
* ---------------------------------------------------------------------------- */
window.BackendSettingsBusinessLogic = window.BackendSettingsBusinessLogic || {};
/**
* Backend Settings
*
* Contains the functionality of the backend settings page. Can either work for system or user settings,
* but the actions allowed to the user are restricted to his role (only admin has full privileges).
*
* @module BackendSettingsBusinessLogic
*/
(function (exports) {
'use strict';
// Constants
exports.SETTINGS_SYSTEM = 'SETTINGS_SYSTEM';
/**
* Use this WorkingPlan class instance to perform actions on the page's working plan tables.
*
* @type {WorkingPlan}
*/
exports.wp = {};
/**
* Tab settings object.
*
* @type {Object}
*/
var settings = {};
/**
* Initialize Page
*
* @param {bool} defaultEventHandlers Optional (true), determines whether to bind the default event handlers.
*/
exports.initialize = function (defaultEventHandlers) {
defaultEventHandlers = defaultEventHandlers || true;
// Apply setting values from database.
var workingPlan = {};
GlobalVariables.settings.system.forEach(function (setting) {
$('input[data-field="' + setting.name + '"]').val(setting.value);
$('select[data-field="' + setting.name + '"]').val(setting.value);
if (setting.name === 'company_working_plan') {
workingPlan = $.parseJSON(setting.value);
}
});
exports.wp = new WorkingPlan();
exports.wp.setup(workingPlan);
exports.wp.timepickers(false);
// Set default settings helper.
settings = new SystemSettingsBusinessLogicHelper();
if (defaultEventHandlers) {
bindEventHandlers();
var $link = $('#settings-page .nav li').not('.d-none').first().find('a');
$link.tab('show');
}
// Apply Privileges
if (GlobalVariables.user.privileges.system_settings.edit === false) {
$('#business-logic').find('select, input, textarea').prop('readonly', true);
$('#business-logic').find('button').prop('disabled', true);
}
Backend.placeFooterToBottom();
};
/**
* Bind the backend/settings default event handlers.
*
* This method depends on the backend/settings html, so do not use this method on a different page.
*/
function bindEventHandlers() {
exports.wp.bindEventHandlers();
/**
* Event: Save Settings Button "Click"
*
* Store the setting changes into the database.
*/
$('.save-settings').on('click', function () {
var data = settings.get();
settings.save(data);
});
/**
* Event: Apply Global Working Plan
*/
$('#apply-global-working-plan').on('click', function () {
var buttons = [
{
text: App.Lang.cancel,
click: function () {
$('#message-box').dialog('close');
}
},
{
text: 'OK',
click: function () {
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_apply_global_working_plan';
var data = {
csrf_token: GlobalVariables.csrfToken,
working_plan: JSON.stringify(exports.wp.get())
};
$.post(url, data)
.done(function () {
Backend.displayNotification(App.Lang.working_plans_got_updated);
})
.always(function () {
$('#message-box').dialog('close');
});
}
}
];
GeneralFunctions.displayMessageBox(
App.Lang.working_plan,
App.Lang.overwrite_existing_working_plans,
buttons
);
});
}
})(window.BackendSettingsBusinessLogic);

123
assets/js/pages/backend_settings_business_logic_helper.js
View file

@ -1,123 +0,0 @@
/* ----------------------------------------------------------------------------
* Easy!Appointments - Open Source Web Scheduler
*
* @package EasyAppointments
* @author A.Tselegidis <alextselegidis@gmail.com>
* @copyright Copyright (c) Alex Tselegidis
* @license https://opensource.org/licenses/GPL-3.0 - GPLv3
* @link https://easyappointments.org
* @since v1.0.0
* ---------------------------------------------------------------------------- */
(function () {
'use strict';
/**
* "System Settings" Tab Helper Class
*
* @class SystemSettingsBusinessLogicHelper
*/
var SystemSettingsBusinessLogicHelper = function () {};
/**
* Save the system settings.
*
* This method is run after changes are detected on the tab input fields.
*
* @param {Array} settings Contains the system settings data.
*/
SystemSettingsBusinessLogicHelper.prototype.save = function (settings) {
if (!this.validate()) {
return; // Validation failed, do not proceed.
}
var url = GlobalVariables.baseUrl + '/index.php/backend_api/ajax_save_settings';
var data = {
csrf_token: GlobalVariables.csrfToken,
settings: JSON.stringify(settings),
type: BackendSettingsBusinessLogic.SETTINGS_SYSTEM
};
$.post(url, data).done(function () {
Backend.displayNotification(App.Lang.settings_saved);
// Update the logo title on the header.
$('#header-logo span').text($('#company-name').val());
// Update book_advance_timeout preview
var totalMinutes = $('#book-advance-timeout').val();
var hours = Math.floor(totalMinutes / 60);
var minutes = totalMinutes % 60;
$('#book-advance-timeout-helper').text(
App.Lang.book_advance_timeout_hint.replace(
'{$limit}',
('0' + hours).slice(-2) + ':' + ('0' + minutes).slice(-2)
)
);
// We need to refresh the working plan.
var workingPlan = BackendSettingsBusinessLogic.wp.get();
BackendSettingsBusinessLogic.wp.setup(workingPlan);
BackendSettingsBusinessLogic.wp.timepickers(false);
});
};
/**
* Prepare the system settings array.
*
* This method uses the DOM elements of the backend/settings page, so it can't be used in another page.
*
* @return {Array} Returns the system settings array.
*/
SystemSettingsBusinessLogicHelper.prototype.get = function () {
var settings = [];
// Business Logic Tab
settings.push({
name: 'company_working_plan',
value: JSON.stringify(BackendSettingsBusinessLogic.wp.get())
});
settings.push({
name: 'book_advance_timeout',
value: $('#book-advance-timeout').val()
});
return settings;
};
/**
* Validate the settings data.
*
* If the validation fails then display a message to the user.
*
* @return {Boolean} Returns the validation result.
*/
SystemSettingsBusinessLogicHelper.prototype.validate = function () {
$('#business-logic .is-invalid').removeClass('is-invalid');
try {
// Validate required fields.
var missingRequired = false;
$('#business-logic .required').each(function (index, requiredField) {
if (!$(requiredField).val()) {
$(requiredField).addClass('is-invalid');
missingRequired = true;
}
});
if (missingRequired) {
throw new Error(App.Lang.fields_are_required);
}
return true;
} catch (error) {
Backend.displayNotification(error.message);
return false;
}
};
window.SystemSettingsBusinessLogicHelper = SystemSettingsBusinessLogicHelper;
})();

159
assets/js/pages/business_settings.js Normal file
View file

@ -0,0 +1,159 @@
/* ----------------------------------------------------------------------------
* Easy!Appointments - Open Source Web Scheduler
*
* @package EasyAppointments
* @author A.Tselegidis <alextselegidis@gmail.com>
* @copyright Copyright (c) Alex Tselegidis
* @license https://opensource.org/licenses/GPL-3.0 - GPLv3
* @link https://easyappointments.org
* @since v1.5.0
* ---------------------------------------------------------------------------- */
/**
* Business Settings
*
* Contains the functionality of the business settings page.
*/
App.Pages.BusinessSettings = (function () {
const $saveSettings = $('#save-settings');
const $applyGlobalWorkingPlan = $('#apply-global-working-plan');
let workingPlanManager = null;
/**
* Check if the form has invalid values.
*
* @return {Boolean}
*/
function isInvalid() {
try {
$('#business-settings .is-invalid').removeClass('is-invalid');
// Validate required fields.
let missingRequiredFields = false;
$('#business-settings .required').each((index, requiredField) => {
const $requiredField = $(requiredField);
if (!$requiredField.val()) {
$requiredField.addClass('is-invalid');
missingRequiredFields = true;
}
});
if (missingRequiredFields) {
throw new Error(App.Lang.fields_are_required);
}
return false;
} catch (error) {
Backend.displayNotification(error.message);
return true;
}
}
function serialize(businessSettings) {
businessSettings.forEach((businessSetting) => {
$('[data-field="' + businessSetting.name + '"]').val(businessSetting.value);
});
}
function deserialize() {
const businessSettings = [];
$('[data-field]').each((index, field) => {
const $field = $(field);
businessSettings.push({
name: $field.data('field'),
value: $field.val()
});
});
const workingPlan = workingPlanManager.get();
businessSettings.push({
name: 'company_working_plan',
value: JSON.stringify(workingPlan)
});
return businessSettings;
}
/**
* Save the account information.
*/
function onSaveSettingsClick() {
if (isInvalid()) {
Backend.displayNotification(App.Lang.settings_are_invalid);
return;
}
const businessSettings = deserialize();
App.Http.BusinessSettings.save(businessSettings).done(() => {
Backend.displayNotification(App.Lang.settings_saved);
});
}
/**
* Save the global working plan information.
*/
function onApplyGlobalWorkingPlan() {
var buttons = [
{
text: App.Lang.cancel,
click: function () {
$('#message-box').dialog('close');
}
},
{
text: 'OK',
click: function () {
const workingPlan = workingPlanManager.get();
App.Http.BusinessSettings.applyGlobalWorkingPlan(workingPlan)
.done(() => {
Backend.displayNotification(App.Lang.working_plans_got_updated);
})
.always(function () {
$('#message-box').dialog('close');
});
}
}
];
GeneralFunctions.displayMessageBox(App.Lang.working_plan, App.Lang.overwrite_existing_working_plans, buttons);
}
function init() {
const businessSettings = App.Vars.business_settings;
serialize(businessSettings);
let workingPlan = {};
App.Vars.business_settings.forEach((generalSetting) => {
if (generalSetting.name === 'company_working_plan') {
workingPlan = JSON.parse(generalSetting.value);
}
});
workingPlanManager = new WorkingPlan();
workingPlanManager.setup(workingPlan);
workingPlanManager.timepickers(false);
workingPlanManager.bindEventHandlers();
$saveSettings.on('click', onSaveSettingsClick);
$applyGlobalWorkingPlan.on('click', onApplyGlobalWorkingPlan);
Backend.placeFooterToBottom();
}
document.addEventListener('DOMContentLoaded', init);
return {};
})();

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

@ -44,14 +44,14 @@
* @param {Object} workingPlan Contains the working hours and breaks for each day of the week.
*/
WorkingPlan.prototype.setup = function (workingPlan) {
var weekDayId = GeneralFunctions.getWeekDayId(GlobalVariables.firstWeekday);
var weekDayId = GeneralFunctions.getWeekDayId(App.Vars.first_weekday);
var workingPlanSorted = GeneralFunctions.sortWeekDictionary(workingPlan, weekDayId);
$('.working-plan tbody').empty();
$('.breaks tbody').empty();
// Build working plan day list starting with the first weekday as set in the General settings
var timeFormat = GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm';
var timeFormat = App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm';
$.each(
workingPlanSorted,
@ -292,7 +292,7 @@
* @param {Object} workingPlanException Contains exception information.
*/
WorkingPlan.prototype.renderWorkingPlanExceptionRow = function (date, workingPlanException) {
var timeFormat = GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm';
var timeFormat = App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm';
return $('<tr/>', {
'data': {
@ -302,7 +302,7 @@
'html': [
$('<td/>', {
'class': 'working-plan-exception-date',
'text': GeneralFunctions.formatDate(date, GlobalVariables.dateFormat, false)
'text': GeneralFunctions.formatDate(date, App.Vars.dateFormat, false)
}),
$('<td/>', {
'class': 'working-plan-exception--start',
@ -378,7 +378,7 @@
$('.add-break').on(
'click',
function () {
var timeFormat = GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm';
var timeFormat = App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm';
var $newBreak = $('<tr/>', {
'html': [
@ -470,7 +470,7 @@
.parent()
.find('.break-start input, .break-end input')
.timepicker({
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
currentText: App.Lang.now,
closeText: App.Lang.close,
timeOnlyTitle: App.Lang.select_time,
@ -542,7 +542,7 @@
$modifiedRow.find('.break-end input').val(
startMoment
.add(1, 'hour')
.format(GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm')
.format(App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm')
.toLowerCase()
);
}
@ -650,12 +650,11 @@
workingPlan[id].breaks.push({
start: moment(
start,
GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm'
App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm'
).format('HH:mm'),
end: moment(
end,
GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm'
).format('HH:mm')
end: moment(end, App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm').format(
'HH:mm'
)
});
}
}.bind(this)
@ -703,7 +702,7 @@
if (disabled === false) {
// Set timepickers where needed.
$('.working-plan input:text').timepicker({
timeFormat: GlobalVariables.timeFormat === 'regular' ? 'h:mm tt' : 'HH:mm',
timeFormat: App.Vars.time_format === 'regular' ? 'h:mm tt' : 'HH:mm',
currentText: App.Lang.now,
closeText: App.Lang.close,
timeOnlyTitle: App.Lang.select_time,
@ -725,7 +724,7 @@
.val(
startMoment
.add(1, 'hour')
.format(GlobalVariables.timeFormat === 'regular' ? 'h:mm a' : 'HH:mm')
.format(App.Vars.time_format === 'regular' ? 'h:mm a' : 'HH:mm')
.toLowerCase()
);
}