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

View file

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