Integrated tab component to settings page.

This commit is contained in:
alext 2017-09-21 14:49:13 +02:00
parent 36e507adc0
commit 355ddaeda4
2 changed files with 325 additions and 324 deletions

View file

@ -28,26 +28,33 @@
</script>
<div id="settings-page" class="container-fluid">
<ul class="nav nav-tabs">
<ul class="nav nav-tabs" role="tablist">
<?php if ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE): ?>
<li role="representation" class="general-tab tab"><a><?= lang('general') ?></a></li>
<li role="presentation" class="active">
<a href="#general" aria-controls="general" role="tab" data-toggle="tab"><?= lang('general') ?></a>
</li>
<?php endif ?>
<?php if ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE): ?>
<li role="representation" class="business-logic-tab tab"><a><?= lang('business_logic') ?></a></li>
<li role="presentation">
<a href="#business-logic" aria-controls="business-logic" role="tab" data-toggle="tab"><?= lang('business_logic') ?></a>
</li>
<?php endif ?>
<?php if ($privileges[PRIV_USER_SETTINGS]['view'] == TRUE): ?>
<li role="representation" class="user-tab tab"><a><?= lang('current_user') ?></a></li>
<li role="presentation">
<a href="#current-user" aria-controls="current-user" role="tab" data-toggle="tab"><?= lang('current_user') ?></a>
</li>
<?php endif ?>
<li role="representation" class="about-tab tab"><a><?= lang('about_ea') ?></a></li>
<li role="presentation">
<a href="#about-ea" aria-controls="about-ea" role="tab" data-toggle="tab"><?= lang('about_ea') ?></a>
</li>
</ul>
<div class="tab-content">
<!-- GENERAL TAB -->
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE) ? '' : 'hidden' ?>
<div id="general" class="tab-content <?= $hidden ?>">
<div role="tabpanel" class="tab-pane active <?= $hidden ?>" id="general">
<form>
<fieldset>
<legend>
@ -143,7 +150,7 @@
<!-- BUSINESS LOGIC TAB -->
<?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE) ? '' : 'hidden' ?>
<div id="business-logic" class="tab-content <?= $hidden ?>">
<div role="tabpanel" class="tab-pane <?= $hidden ?>" id="business-logic">
<form>
<fieldset>
<legend>
@ -305,11 +312,12 @@
</form>
</div>
<!-- USER TAB -->
<!-- CURRENT USER TAB -->
<?php $hidden = ($privileges[PRIV_USER_SETTINGS]['view'] == TRUE) ? '' : 'hidden' ?>
<div id="user" class="tab-content <?= $hidden ?>">
<form class="row">
<div role="tabpanel" class="tab-pane <?= $hidden ?>" id="current-user">
<form>
<div class="row">
<fieldset class="col-xs-12 col-sm-6 personal-info-wrapper">
<legend>
<?= lang('personal_information') ?>
@ -406,12 +414,13 @@
<?= lang('receive_notifications') ?>
</button>
</fieldset>
</div>
</form>
</div>
<!-- ABOUT TAB -->
<!-- ABOUT E!A TAB -->
<div id="about" class="tab-content">
<div role="tabpanel" class="tab-pane" id="about-ea">
<h3>Easy!Appointments</h3>
<p>
<?= lang('about_ea_info') ?>
@ -420,14 +429,11 @@
<br>
<div class="current-version">
<?php
echo lang('current_version') . ' ';
echo $this->config->item('version');
$release_title = $this->config->item('release_label');
if ($release_title != '') {
echo ' - ' . $release_title;
}
?>
<?= lang('current_version') ?>
<?= $this->config->item('version') ?>
<?php if ($this->config->item('release_label')): ?>
- <?= $this->config->item('release_label') ?>
<?php endif ?>
</div>
<br>
@ -435,7 +441,9 @@
<h3><?= lang('support') ?></h3>
<p>
<?= lang('about_ea_support') ?>
<br><br>
<a href="http://easyappointments.org">
<?= lang('official_website') ?>
</a>
@ -477,4 +485,6 @@
<a href="http://www.gnu.org/copyleft/gpl.html">http://www.gnu.org/copyleft/gpl.html</a>
</p>
</div>
</div>
</div>

View file

@ -138,25 +138,18 @@ window.BackendSettings = window.BackendSettings || {};
*
* Change the visible tab contents.
*/
$('.tab').click(function() {
// Bootstrap has a bug with toggle buttons. Their toggle state is lost when the
// button is hidden or shown. Show before anything else we need to store the toggle
// and apply it whenever the user tab is clicked..
$('a[data-toggle="tab"]').on('shown.bs.tab', function (event) {
// Bootstrap has a bug with toggle buttons. Their toggle state is lost when the button is hidden or shown.
// Show before anything else we need to store the toggle and apply it whenever the user tab is clicked.
var areNotificationsActive = $('#user-notifications').hasClass('active');
$(this).parent().find('.active').removeClass('active');
$(this).addClass('active');
$('.tab-content').hide();
var href = $(this).attr('href');
if ($(this).hasClass('general-tab')) {
$('#general').show();
if (href === '#general') {
settings = new SystemSettings();
} else if ($(this).hasClass('business-logic-tab')) {
$('#business-logic').show();
} else if (href === '#business-logic') {
settings = new SystemSettings();
} else if ($(this).hasClass('user-tab')) {
$('#user').show();
} else if (href === '#current-user') {
settings = new UserSettings();
// Apply toggle state to user notifications button.
@ -165,8 +158,6 @@ window.BackendSettings = window.BackendSettings || {};
} else {
$('#user-notifications').removeClass('active');
}
} else if ($(this).hasClass('about-tab')) {
$('#about').show();
}
Backend.placeFooterToBottom();