feat(sidebar): fleet sidebar standard (header row, user in sidebar, collapsible groups, mini mode, no-flash transitions)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
andreandClaude Sonnet 5.5 committed 2026-10-13 16:56:46 +01:00
1 parent b73c23bf55
commit aa55d44406
8 files changed
+654 -225

No files matched your search

+83 -13
View File
@@ -78,23 +78,93 @@ document.addEventListener('DOMContentLoaded', function () {
mq.addEventListener('change', function () { if (pref === 'auto') apply('auto'); });
})();
// Mobile off-canvas sidebar: hamburger toggles .sidebar.open + the backdrop;
// tapping the backdrop, a nav link, Escape, or resizing to desktop closes it.
// Barra lateral. Em ecrã grande o hamburger alterna entre completa e mini (so
// o texto das categorias, lembrado em localStorage); em telemovel abre/fecha a
// gaveta por cima do conteudo. Um so manipulador para os dois botoes. O CSS
// decide o que cada estado mostra; o estado inicial ja veio do <head>.
(function () {
var sb = document.getElementById('sidebar');
var tg = document.getElementById('menuToggle');
var bd = document.getElementById('sidebarBackdrop');
if (!sb || !tg) return;
var mq = window.matchMedia('(max-width: 991.98px)');
function open() { sb.classList.add('open'); if (bd) bd.classList.add('show'); document.body.style.overflow = 'hidden'; tg.setAttribute('aria-expanded', 'true'); }
function close() { sb.classList.remove('open'); if (bd) bd.classList.remove('show'); document.body.style.overflow = ''; tg.setAttribute('aria-expanded', 'false'); }
tg.addEventListener('click', function () { sb.classList.contains('open') ? close() : open(); });
if (bd) bd.addEventListener('click', close);
sb.querySelectorAll('.nav-link').forEach(function (a) {
a.addEventListener('click', function () { if (mq.matches) close(); });
var toggles = document.querySelectorAll('[data-sidebar-toggle]');
var root = document.documentElement;
var nav = sb && sb.querySelector('.bo-sidebar__nav');
if (!sb || !toggles.length) return;
var mq = window.matchMedia('(min-width: 992px)');
function store(k, v) { try { localStorage.setItem(k, v); } catch (e) {} }
function sync() {
var desktop = mq.matches;
var open = desktop ? !root.classList.contains('bo-mini') : sb.classList.contains('open');
toggles.forEach(function (t) {
t.setAttribute('aria-expanded', open ? 'true' : 'false');
t.setAttribute('aria-label', open ? (desktop ? 'Reduzir menu' : 'Fechar menu') : (desktop ? 'Expandir menu' : 'Abrir menu'));
});
if (bd) bd.classList.toggle('show', !desktop && open);
document.body.style.overflow = (!desktop && open) ? 'hidden' : '';
}
function setDrawer(open) { sb.classList.toggle('open', open); sync(); }
toggles.forEach(function (t) {
t.addEventListener('click', function () {
if (mq.matches) {
store('bo-sidebar-mini', root.classList.toggle('bo-mini') ? '1' : '0');
sync();
} else {
setDrawer(!sb.classList.contains('open'));
}
});
});
document.addEventListener('keydown', function (e) { if (e.key === 'Escape') close(); });
window.addEventListener('resize', function () { if (!mq.matches) close(); });
if (bd) bd.addEventListener('click', function () { setDrawer(false); });
sb.querySelectorAll('.bo-nav-item').forEach(function (a) {
a.addEventListener('click', function () { if (!mq.matches) setDrawer(false); });
});
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape' && sb.classList.contains('open')) {
setDrawer(false);
var o = document.querySelector('.menu-toggle');
if (o && o.offsetParent) o.focus();
}
});
if (mq.addEventListener) mq.addEventListener('change', function () { setDrawer(false); });
sync();
// Grupos recolhiveis. O estado inicial veio do <head> (atributo no <html>);
// aqui so se liga o clique e se mantem atributo, armazenamento e aria alinhados.
var saved = {};
try { saved = JSON.parse(localStorage.getItem('bo-nav-groups') || '{}'); } catch (e) {}
function groupOpen(g) {
if (g.classList.contains('has-active')) return !g.classList.contains('is-closed');
return !saved[g.getAttribute('data-group')];
}
function paint(g) {
g.querySelector('[data-group-toggle]').setAttribute('aria-expanded', groupOpen(g) ? 'true' : 'false');
}
var groups = sb.querySelectorAll('.bo-nav-group[data-group]');
groups.forEach(function (g) {
g.querySelector('[data-group-toggle]').addEventListener('click', function () {
var key = g.getAttribute('data-group');
var willClose = groupOpen(g);
if (g.classList.contains('has-active')) g.classList.toggle('is-closed', willClose);
if (willClose) saved[key] = true; else delete saved[key];
store('bo-nav-groups', JSON.stringify(saved));
root.setAttribute('data-bo-groups', Object.keys(saved).join(' '));
groups.forEach(paint);
});
});
groups.forEach(paint);
// A lista rola sozinha: lembrar a posicao entre paginas e mostrar o item ativo.
if (nav) {
try { nav.scrollTop = +sessionStorage.getItem('bo-nav-scroll') || 0; } catch (e) {}
var cur = nav.querySelector('[aria-current="page"]');
if (cur) {
var r = cur.getBoundingClientRect(), n = nav.getBoundingClientRect();
if (r.top < n.top || r.bottom > n.bottom) cur.scrollIntoView({ block: 'center' });
}
addEventListener('pagehide', function () {
try { sessionStorage.setItem('bo-nav-scroll', nav.scrollTop); } catch (e) {}
});
}
})();
</script>
<style>
+89 -193
View File
@@ -25,203 +25,105 @@ $app_name = defined('APP_NAME') ? APP_NAME : 'FitMe 3070';
document.documentElement.setAttribute('data-theme-pref', pref);
})();
</script>
<script>
// Estado da barra lateral antes da primeira pintura (senão cada página salta
// de 264 para 80px): modo mini no <html> e grupos fechados em data-bo-groups.
try{var d=document.documentElement;if(localStorage.getItem('bo-sidebar-mini')==='1')d.classList.add('bo-mini');
var g=JSON.parse(localStorage.getItem('bo-nav-groups')||'{}');d.setAttribute('data-bo-groups',Object.keys(g).filter(function(k){return g[k]}).join(' '));}catch(e){}
</script>
<link href="<?= base_url('assets/vendor/bootstrap5/css/bootstrap.min.css') ?>" rel="stylesheet">
<link href="<?= base_url('assets/vendor/bootstrap-icons/bootstrap-icons.css') ?>" rel="stylesheet">
<link href="<?= base_url('assets/vendor/summernote/summernote-bs5.min.css') ?>" rel="stylesheet">
<style>
:root {
--bo-accent: #C2D500;
--bo-accent-rgb: 194,213,0;
--bo-dark: #0a0a0a;
--bo-dark-2: #151515;
--bo-surface: #eef0f4;
}
[data-bs-theme="dark"] { --bo-surface: #121416; }
body { background: var(--bo-surface); font-size: .925rem; }
.sidebar { position: fixed; top: 0; bottom: 0; left: 0; z-index: 100;
padding: 68px 0 0; width: 240px; background: var(--bo-dark); overflow-y: auto; }
.sidebar .nav-link { color: rgba(255,255,255,.55); padding: .55rem 1.25rem; font-size: .875rem;
border-left: 3px solid transparent; transition: all .2s; }
.sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.06); border-left-color: rgba(255,255,255,.2); }
.sidebar .nav-link.active { color: #fff; background: rgba(var(--bo-accent-rgb),.12); border-left-color: var(--bo-accent); }
.sidebar .nav-link i { width: 20px; margin-right: .5rem; text-align: center; }
.sidebar .sidebar-brand { position: fixed; top: 0; left: 0; width: 240px; padding: 1rem 1.25rem;
color: #fff; font-weight: 700; font-size: 1.1rem; background: var(--bo-dark);
z-index: 101; letter-spacing: .5px; border-bottom: 1px solid rgba(255,255,255,.06); }
.sidebar .sidebar-brand i { color: var(--bo-accent); }
.sidebar .sidebar-section { color: rgba(255,255,255,.3); font-size: .65rem; text-transform: uppercase;
letter-spacing: 1.5px; padding: 1.25rem 1.25rem .35rem; }
main { margin-left: 240px; padding-top: 68px; }
.topbar { position: fixed; top: 0; left: 240px; right: 0; z-index: 99; height: 56px;
background: var(--bs-body-bg); border-bottom: 1px solid var(--bs-border-color); padding: 0 1.5rem;
display: flex; align-items: center; justify-content: space-between; }
.topbar .user-dropdown { display: flex; align-items: center; gap: .5rem; margin-left: auto; }
.badge-role-sysadmin { background: var(--bo-accent); color: var(--bo-dark); }
.badge-role-admin { background: var(--bo-accent); color: var(--bo-dark); opacity: .85; }
.badge-role-staff { background: #6f42c1; }
.badge-role-client { background: #adb5bd; color: #212529; }
.btn-outline-primary { color: var(--bo-accent); border-color: var(--bo-accent); }
.btn-outline-primary:hover { background: var(--bo-accent); border-color: var(--bo-accent); color: var(--bo-dark); }
.btn-primary { background: var(--bo-accent); border-color: var(--bo-accent); color: var(--bo-dark); }
.btn-primary:hover { background: #a8ba00; border-color: #a8ba00; color: var(--bo-dark); }
.card { border: none; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
[data-bs-theme="dark"] .table-light { --bs-table-bg: var(--bs-tertiary-bg); --bs-table-color: var(--bs-body-color); }
.theme-toggle { min-width: 44px; min-height: 44px; }
a { color: var(--bs-emphasis-color); }
/* Summernote (WYSIWYG) — align with the backoffice look */
.note-editor.note-frame { border-color: #ced4da; border-radius: .375rem; }
.note-editor .note-editing-area .note-editable { font-size: .95rem; }
.note-editor.note-frame.note-focused { border-color: var(--bo-accent); box-shadow: 0 0 0 .2rem rgba(var(--bo-accent-rgb), .25); }
.note-toolbar { background: var(--bs-tertiary-bg); }
.note-btn.btn-primary { background: var(--bo-accent); border-color: var(--bo-accent); color: var(--bo-dark); }
/* ── Mobile: off-canvas sidebar + hamburger ──────────────────────────── */
.sidebar { transition: transform .25s ease; }
.menu-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--bs-border-color);
background: var(--bs-body-bg); color: var(--bs-body-color); border-radius: 8px; font-size: 1.35rem;
line-height: 1; align-items: center; justify-content: center; }
.sidebar-backdrop { display: none; position: fixed; inset: 0; z-index: 1090; background: rgba(0,0,0,.45); }
.sidebar-backdrop.show { display: block; }
@media (max-width: 991.98px) {
.sidebar { transform: translateX(-100%); width: 264px; z-index: 1100;
box-shadow: 2px 0 18px rgba(0,0,0,.3); }
.sidebar .sidebar-brand { width: 264px; z-index: 1101; }
.sidebar.open { transform: translateX(0); }
main { margin-left: 0; }
.topbar { left: 0; padding: 0 .75rem; }
.menu-toggle { display: inline-flex; }
/* Wide tables scroll inside their card instead of overflowing the page */
main .card > .card-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 575.98px) {
.topbar .user-dropdown .badge,
.topbar .user-dropdown .u-name { display: none; }
/* Page-header rows (title + action buttons) stack instead of overflowing */
main .d-flex.justify-content-between.align-items-center { flex-wrap: wrap; gap: .5rem; }
/* 16px inputs stop iOS from auto-zooming on focus */
.form-control, .form-select { font-size: 16px; }
/* Comfortable content gutters on phones */
.p-3 { padding: .85rem !important; }
}
</style>
<link href="<?= htmlspecialchars(_asset_versioned('assets/css/backoffice.css'), ENT_QUOTES) ?>" rel="stylesheet">
<?php include __DIR__ . '/env_ribbon.php'; // moldura de aviso fora de produção ?>
</head>
<body>
<nav class="sidebar" id="sidebar">
<div class="sidebar-brand"><i class="bi bi-lightning-charge-fill me-2"></i><?= htmlspecialchars($app_name) ?></div>
<div class="sidebar-section">Principal</div>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link<?= ($_SERVER['SCRIPT_NAME'] ?? '') === '/views/admin/dashboard.php' ? ' active' : '' ?>"
href="<?= base_url('views/admin/dashboard.php') ?>"><i class="bi bi-speedometer2"></i>Painel</a>
</li>
<?php if (is_staff()): ?>
<li class="nav-item">
<a class="nav-link" href="<?= base_url('/') ?>" target="_blank" rel="noopener"><i class="bi bi-box-arrow-up-right"></i>Site público</a>
</li>
<?php require_once __DIR__ . '/nav_helpers.php'; $dash = bo_dashboard_path(); ?>
<aside class="sidebar" id="sidebar" aria-label="Menu principal">
<div class="bo-sidebar__head">
<button type="button" class="bo-sidebar__toggle" data-sidebar-toggle
aria-label="Reduzir menu" aria-expanded="true" aria-controls="sidebar">
<i class="bi bi-list" aria-hidden="true"></i>
</button>
<a class="bo-sidebar__brand" href="<?= base_url($dash) ?>"><i class="bi bi-lightning-charge me-2" aria-hidden="true"></i><?= htmlspecialchars($app_name) ?></a>
<?php // Único sítio que abre o site público (nova aba). ?>
<a class="bo-sidebar__site" href="<?= base_url('/') ?>" target="_blank" rel="noopener"
title="Ver site público" aria-label="Ver site público"><i class="bi bi-box-arrow-up-right" aria-hidden="true"></i></a>
</div>
<div class="dropdown bo-sidebar__user">
<button class="bo-user-menu dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false"
title="<?= htmlspecialchars($user['name']) ?>">
<span class="bo-user-menu__avatar" aria-hidden="true"><?= htmlspecialchars(bo_initials((string) $user['name'])) ?></span>
<span class="bo-user-menu__text">
<span class="bo-user-menu__name"><?= htmlspecialchars($user['name']) ?></span>
<span class="badge rounded-pill badge-role-<?= htmlspecialchars($user['role']) ?>"><?= htmlspecialchars(role_label($user['role'])) ?></span>
</span>
</button>
<ul class="dropdown-menu">
<li class="px-3 pt-2 pb-1"><div class="fw-semibold small lh-sm"><?= htmlspecialchars($user['name']) ?></div></li>
<li><hr class="dropdown-divider my-1"></li>
<li><a class="dropdown-item" href="<?= base_url('views/user/profile.php') ?>"><i class="bi bi-person me-2" aria-hidden="true"></i>Perfil</a></li>
<li><a class="dropdown-item text-danger" href="<?= base_url('views/auth/logout.php') ?>"><i class="bi bi-box-arrow-right me-2" aria-hidden="true"></i>Terminar sessão</a></li>
</ul>
</div>
<nav class="bo-sidebar__nav" aria-label="Navegação">
<?= bo_nav_link($dash, 'bi-speedometer2', 'Painel', ['mod' => 'primary']) ?>
<?php if (is_admin()): ?>
<?php bo_nav_group_start('gestao', 'Gestão', 'bi-briefcase'); ?>
<?php bo_nav_group_start('site', 'Site', 'bi-window', true); ?>
<?= bo_nav_link('views/admin/gyms/index.php', 'bi-buildings', 'Ginásios', ['mod' => 'sub2', 'match' => 'views/admin/gyms/']) ?>
<?= bo_nav_link('views/admin/modalidades/index.php', 'bi-grid-3x3-gap', 'Modalidades', ['mod' => 'sub2', 'match' => 'views/admin/modalidades/']) ?>
<?= bo_nav_link('views/admin/galerias/index.php', 'bi-images', 'Galerias', ['mod' => 'sub2', 'match' => 'views/admin/galerias/']) ?>
<?= bo_nav_link('views/admin/events/index.php', 'bi-megaphone', 'Eventos', ['mod' => 'sub2', 'match' => 'views/admin/events/']) ?>
<?= bo_nav_link('views/admin/info/edit.php', 'bi-telephone', 'Contactos', ['mod' => 'sub2', 'match' => 'views/admin/info/']) ?>
<?= bo_nav_link('views/admin/reviews/index.php', 'bi-star', 'Reviews Google', ['mod' => 'sub2', 'match' => 'views/admin/reviews/']) ?>
<?php bo_nav_group_end(); ?>
<?php bo_nav_group_start('horarios', 'Horários', 'bi-clock-history', true); ?>
<?= bo_nav_link('views/admin/work_hours/index.php', 'bi-clock', 'Horário de Funcionamento', ['mod' => 'sub2', 'match' => 'views/admin/work_hours/']) ?>
<?= bo_nav_link('views/admin/horario/index.php', 'bi-calendar-week', 'Horário de Aulas', ['mod' => 'sub2', 'match' => 'views/admin/horario/']) ?>
<?php bo_nav_group_end(); ?>
<?php bo_nav_group_start('comercial', 'Comercial', 'bi-cash-coin', true); ?>
<?= bo_nav_link('views/admin/memberships/index.php', 'bi-credit-card-2-front', 'Mensalidades', ['mod' => 'sub2', 'match' => 'views/admin/memberships/']) ?>
<?php $__tn = function_exists('db_trial_leads_count_new') ? db_trial_leads_count_new($pdo, admin_gym_id()) : 0; ?>
<?= bo_nav_link('views/admin/trials/index.php', 'bi-person-check', 'Aulas experimentais', ['mod' => 'sub2', 'match' => 'views/admin/trials/', 'badge' => $__tn]) ?>
<?= bo_nav_link('views/admin/team/index.php', 'bi-person-workspace', 'Equipa', ['mod' => 'sub2', 'match' => 'views/admin/team/']) ?>
<?php bo_nav_group_end(); ?>
<?php bo_nav_group_start('legal', 'Legal', 'bi-shield-check', true); ?>
<?= bo_nav_link('views/admin/rgpd/index.php', 'bi-file-earmark-lock', 'Pedidos RGPD', ['mod' => 'sub2', 'match' => 'views/admin/rgpd/']) ?>
<?= bo_nav_link('views/admin/trash/index.php', 'bi-trash3', 'Lixeira', ['mod' => 'sub2', 'match' => 'views/admin/trash/']) ?>
<?php bo_nav_group_end(); ?>
<?php bo_nav_group_end(); ?>
<?php bo_nav_group_start('utilizadores', 'Utilizadores', 'bi-people'); ?>
<?= bo_nav_link('views/user/index.php', 'bi-person-vcard', 'Utilizadores', ['mod' => 'sub', 'match' => ['views/user/index.php', 'views/user/edit.php']]) ?>
<?php bo_nav_group_end(); ?>
<?php endif; ?>
</ul>
<?php if (is_admin()): ?>
<div class="sidebar-section">Gestão</div>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/gyms/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/gyms/index.php') ?>"><i class="bi bi-buildings-fill"></i>Ginásios</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/team/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/team/index.php') ?>"><i class="bi bi-people-fill"></i>Equipa</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/modalidades/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/modalidades/index.php') ?>"><i class="bi bi-grid-3x3-gap-fill"></i>Modalidades</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/galerias/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/galerias/index.php') ?>"><i class="bi bi-images"></i>Galerias</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/events/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/events/index.php') ?>"><i class="bi bi-megaphone-fill"></i>Eventos</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/work_hours/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/work_hours/index.php') ?>"><i class="bi bi-clock-fill"></i>Horário de Funcionamento</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/horario/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/horario/index.php') ?>"><i class="bi bi-calendar-week-fill"></i>Horário de Aulas</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/memberships/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/memberships/index.php') ?>"><i class="bi bi-credit-card-2-front-fill"></i>Mensalidades</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/trials/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/trials/index.php') ?>"><i class="bi bi-person-check-fill"></i>Aulas experimentais<?php
$__tn = function_exists('db_trial_leads_count_new') ? db_trial_leads_count_new($pdo, admin_gym_id()) : 0;
if ($__tn): ?> <span class="badge bg-danger ms-1"><?= (int) $__tn ?></span><?php endif; ?></a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/reviews/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/reviews/index.php') ?>"><i class="bi bi-star-fill"></i>Reviews Google</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/info/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/info/edit.php') ?>"><i class="bi bi-telephone-fill"></i>Contactos</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/trash/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/trash/index.php') ?>"><i class="bi bi-trash3-fill"></i>Lixeira</a>
</li>
<li class="nav-item">
<a class="nav-link<?= (strpos($_SERVER['SCRIPT_NAME'] ?? '', '/views/admin/rgpd/') !== false) ? ' active' : '' ?>"
href="<?= base_url('views/admin/rgpd/index.php') ?>"><i class="bi bi-shield-lock-fill"></i>Pedidos RGPD</a>
</li>
</ul>
<?php endif; ?>
<?php if (is_admin()): ?>
<div class="sidebar-section">Utilizadores</div>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link<?= ($_SERVER['SCRIPT_NAME'] ?? '') === '/views/user/index.php' ? ' active' : '' ?>"
href="<?= base_url('views/user/index.php') ?>"><i class="bi bi-person-badge"></i>Utilizadores</a>
</li>
</ul>
<?php endif; ?>
<?php if (is_sysadmin()): ?>
<div class="sidebar-section">Sistema</div>
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link<?= ($_SERVER['SCRIPT_NAME'] ?? '') === '/views/sysadmin/system_settings.php' ? ' active' : '' ?>"
href="<?= base_url('views/sysadmin/system_settings.php') ?>"><i class="bi bi-sliders"></i>Definições</a>
</li>
<li class="nav-item">
<a class="nav-link<?= ($_SERVER['SCRIPT_NAME'] ?? '') === '/views/sysadmin/messages.php' ? ' active' : '' ?>"
href="<?= base_url('views/sysadmin/messages.php') ?>"><i class="bi bi-envelope-paper"></i>Mensagens</a>
</li>
<li class="nav-item">
<a class="nav-link<?= ($_SERVER['SCRIPT_NAME'] ?? '') === '/views/sysadmin/comms.php' ? ' active' : '' ?>"
href="<?= base_url('views/sysadmin/comms.php') ?>"><i class="bi bi-send"></i>Comunicações</a>
</li>
<?php // Backups/Auditoria/IP bans/Geo/Origem das visitas/Atualizações/Hub: um só
// link para o índice partilhado do platform-tools (como a fotografia/design/
// dance fazem), em vez de um por ferramenta — uma ferramenta nova no
// platform-tools passa a aparecer sozinha, sem precisar de link novo aqui. ?>
<li class="nav-item">
<a class="nav-link<?= (($_GET['tool'] ?? 'index') === 'index' && str_contains($_SERVER['REQUEST_URI'] ?? '', 'platform.php')) ? ' active' : '' ?>"
href="<?= base_url('platform.php?tool=index') ?>"><i class="bi bi-shield-lock"></i>Sistema</a>
</li>
</ul>
<?php endif; ?>
</nav>
<?php if (is_sysadmin()): ?>
<?php bo_nav_group_start('sistema', 'Sistema', 'bi-gear'); ?>
<?= bo_nav_link('views/sysadmin/system_settings.php', 'bi-sliders', 'Definições', ['mod' => 'sub']) ?>
<?= bo_nav_link('views/sysadmin/messages.php', 'bi-envelope-paper', 'Mensagens', ['mod' => 'sub']) ?>
<?= bo_nav_link('views/sysadmin/comms.php', 'bi-send', 'Comunicações', ['mod' => 'sub']) ?>
<?php // Backups/Auditoria/IP bans/Geo/Origem das visitas/Atualizações/Hub: um só
// link para o índice partilhado do platform-tools (como a fotografia/design/
// dance fazem), em vez de um por ferramenta — uma ferramenta nova no
// platform-tools passa a aparecer sozinha, sem precisar de link novo aqui. ?>
<?= bo_nav_link('platform.php?tool=index', 'bi-cpu', 'Sistema', ['mod' => 'sub',
'active' => (($_GET['tool'] ?? 'index') === 'index' && str_contains($_SERVER['REQUEST_URI'] ?? '', 'platform.php'))]) ?>
<?php bo_nav_group_end(); ?>
<?php endif; ?>
</nav>
</aside>
<div class="sidebar-backdrop" id="sidebarBackdrop" aria-hidden="true"></div>
<main>
<div class="topbar">
<button type="button" class="menu-toggle" id="menuToggle" aria-label="Abrir menu" aria-controls="sidebar">
<i class="bi bi-list"></i>
<?php // Só em telemóvel: abre a gaveta (a barra está fora do ecrã). ?>
<button type="button" class="menu-toggle" data-sidebar-toggle aria-label="Abrir menu" aria-expanded="false" aria-controls="sidebar">
<i class="bi bi-list" aria-hidden="true"></i>
</button>
<?php
// Which gym the content pages edit (functions_gyms.php). Switching goes back
@@ -244,7 +146,7 @@ $app_name = defined('APP_NAME') ? APP_NAME : 'FitMe 3070';
<noscript><button class="btn btn-sm btn-outline-secondary">Mudar</button></noscript>
</form>
<?php endif; ?>
<div class="user-dropdown">
<div class="bo-topbar__tools">
<div class="dropdown">
<button class="btn btn-sm btn-outline-secondary theme-toggle" type="button" data-bs-toggle="dropdown"
aria-expanded="false" aria-label="Tema: automático" id="themeToggle">
@@ -256,12 +158,6 @@ $app_name = defined('APP_NAME') ? APP_NAME : 'FitMe 3070';
<li><button type="button" class="dropdown-item" data-theme-set="auto"><i class="bi bi-circle-half me-2" aria-hidden="true"></i>Automático</button></li>
</ul>
</div>
<span class="badge rounded-pill badge-role-<?= htmlspecialchars($user['role']) ?>">
<?= htmlspecialchars(role_label($user['role'])) ?>
</span>
<span class="u-name"><?= htmlspecialchars($user['name']) ?></span>
<a href="<?= base_url('views/user/profile.php') ?>" class="btn btn-sm btn-outline-secondary"><i class="bi bi-person"></i></a>
<a href="<?= base_url('views/auth/logout.php') ?>" class="btn btn-sm btn-outline-danger"><i class="bi bi-box-arrow-right"></i></a>
</div>
</div>
<?php
+96
View File
@@ -0,0 +1,96 @@
<?php
// Auxiliares da barra lateral do backoffice (incluído por includes/header.php).
// Ficam aqui, e não no HTML, para o menu ser só uma lista de itens: o ativo,
// o aria-current, o title/aria-label (o modo mini só mostra o ícone) e a
// abertura dos grupos decidem-se num sítio.
/** Painel de cada papel: o admin tem o seu, o staff o dele, o cliente a área de sócio. */
function bo_dashboard_path(): string
{
if (is_admin()) return 'views/admin/dashboard.php';
if (is_staff()) return 'views/staff/dashboard.php';
return 'views/user/dashboard.php';
}
/**
* O pedido atual está nesta página? Compara pelo FIM do caminho (e não com ===):
* em dev o site vive num subcaminho do host (/GitTea/repos/fitme3070.pt/...).
* Um caminho terminado em «/» é uma pasta inteira (inclui edit.php, create.php...).
* Aceita uma lista: basta uma coincidir.
*
* @param string|string[] $paths
*/
function bo_nav_active($paths): bool
{
$script = str_replace('\\', '/', (string) ($_SERVER['SCRIPT_NAME'] ?? ''));
foreach ((array) $paths as $p) {
$p = '/' . ltrim($p, '/');
if (str_ends_with($p, '/') ? str_contains($script, $p) : str_ends_with($script, $p)) {
return true;
}
}
return false;
}
/**
* Uma ligação da barra lateral.
* Opções: match (caminho/s para o «ativo», por omissão o próprio href), mod
* ('sub' | 'sub2' | 'primary'), badge (inteiro; só aparece se > 0).
*/
function bo_nav_link(string $href, string $icon, string $label, array $o = []): string
{
$active = array_key_exists('active', $o) ? (bool) $o['active'] : bo_nav_active($o['match'] ?? strtok($href, '?'));
$mod = isset($o['mod']) ? ' bo-nav-item--' . $o['mod'] : '';
$l = htmlspecialchars($label, ENT_QUOTES, 'UTF-8');
$badge = (int) ($o['badge'] ?? 0);
return '<a class="nav-link bo-nav-item' . $mod . ($active ? ' active' : '') . '" href="' . htmlspecialchars(base_url($href), ENT_QUOTES, 'UTF-8') . '"'
. ' title="' . $l . '" aria-label="' . $l . '"' . ($active ? ' aria-current="page"' : '') . '>'
. '<i class="bi ' . htmlspecialchars($icon, ENT_QUOTES, 'UTF-8') . '" aria-hidden="true"></i>'
. '<span class="bo-nav-item__label">' . $l . '</span>'
. ($badge > 0 ? '<span class="badge bg-danger ms-auto bo-nav-item__badge">' . $badge . '</span>' : '')
. '</a>' . "\n";
}
/**
* Abre um grupo recolhível. O conteúdo fica em buffer até bo_nav_group_end(),
* que precisa de saber se algum item é o ativo (o grupo da página atual abre
* sempre). $sub = subcategoria dentro de outro grupo (recuada).
*/
function bo_nav_group_start(string $key, string $label, string $icon, bool $sub = false): void
{
$GLOBALS['bo_nav_group_stack'][] = [$key, $label, $icon, $sub];
ob_start();
}
/** Fecha o grupo aberto por bo_nav_group_start() e escreve o markup final. */
function bo_nav_group_end(): void
{
$items = (string) ob_get_clean();
[$key, $label, $icon, $sub] = array_pop($GLOBALS['bo_nav_group_stack']);
$hasActive = str_contains($items, 'aria-current="page"');
$id = 'bo-grp-' . $key;
$k = htmlspecialchars($key, ENT_QUOTES, 'UTF-8');
$l = htmlspecialchars($label, ENT_QUOTES, 'UTF-8');
$i = htmlspecialchars($icon, ENT_QUOTES, 'UTF-8');
$short = htmlspecialchars(mb_strtoupper(mb_substr($label, 0, 4)), ENT_QUOTES, 'UTF-8');
echo '<div class="bo-nav-group' . ($sub ? ' bo-nav-group--sub' : '') . ($hasActive ? ' has-active' : '') . '" data-group="' . $k . '">'
. '<button class="bo-nav-group__label" type="button" data-short="' . $short . '" aria-expanded="true"'
. ' aria-controls="' . $id . '" data-group-toggle="' . $k . '" title="' . $l . '" aria-label="' . $l . '">'
. '<i class="bi ' . $i . ' bo-nav-group__icon" aria-hidden="true"></i>'
. '<span class="bo-nav-group__text">' . $l . '</span>'
. '<i class="bi bi-chevron-down bo-nav-group__chevron" aria-hidden="true"></i></button>'
. '<div class="bo-nav-group__body" id="' . $id . '"><div class="bo-nav-group__inner">' . $items . '</div></div>'
. '</div>' . "\n";
}
/** Iniciais para o avatar (até duas letras: primeiro e último nome). */
function bo_initials(string $name): string
{
// Só palavras que começam por letra: «Staff (dev)» dá «SD»... não «S(».
preg_match_all('/\p{L}[\p{L}\p{M}-]*/u', $name, $m);
$parts = $m[0];
if (!$parts) return '?';
$first = mb_substr($parts[0], 0, 1);
$last = count($parts) > 1 ? mb_substr($parts[count($parts) - 1], 0, 1) : '';
return mb_strtoupper($first . $last);
}
-18
View File
@@ -1,18 +0,0 @@
<?php
// Standalone top navbar — only outputs when header.php hasn't been included yet.
// (system_settings.php includes both header.php + navbar.php, so this defers.)
if (defined('ADMIN_SHELL_OPENED') && ADMIN_SHELL_OPENED) return;
?>
<link href="<?= base_url('assets/vendor/bootstrap5/css/bootstrap.min.css') ?>" rel="stylesheet">
<link href="<?= base_url('assets/vendor/bootstrap-icons/bootstrap-icons.css') ?>" rel="stylesheet">
<nav class="navbar navbar-expand navbar-dark px-3 mb-0" style="position:sticky;top:0;z-index:99;background:var(--bo-accent, #C2D500);">
<a class="navbar-brand fw-bold text-dark" href="<?= base_url('views/admin/dashboard.php') ?>">
<i class="bi bi-lightning-charge-fill me-2"></i><?= htmlspecialchars(defined('APP_NAME') ? APP_NAME : 'FitMe 3070') ?>
</a>
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<span class="nav-link text-dark"><?= htmlspecialchars($user['name'] ?? '') ?></span>
</li>
<li class="nav-item"><a class="nav-link text-dark" href="<?= base_url('views/auth/logout.php') ?>"><i class="bi bi-box-arrow-right"></i></a></li>
</ul>
</nav>