218 lines
7.6 KiB
PHP
218 lines
7.6 KiB
PHP
{{--
|
|
========================================
|
|
SIDEBAR MENU PULITA NETGESCON
|
|
========================================
|
|
Sidebar semplice e funzionale senza duplicazioni.
|
|
--}}
|
|
|
|
@props([
|
|
'stabileAttivo' => 'Nessuno Stabile Selezionato',
|
|
'userRoles' => ['user'],
|
|
'mainMenu' => []
|
|
])
|
|
|
|
<div class="netgescon-sidebar d-flex flex-column h-100 bg-light border-end" id="netgesconSidebar">
|
|
|
|
{{-- Header Sidebar --}}
|
|
<div class="p-3 border-bottom">
|
|
<div class="d-flex align-items-center mb-2">
|
|
<i class="fas fa-building text-primary me-2"></i>
|
|
<small class="text-muted fw-bold">NETGESCON</small>
|
|
</div>
|
|
<div class="text-center">
|
|
<small class="text-muted" id="datetime-display">
|
|
{{ date('d/m/Y H:i') }}
|
|
</small>
|
|
</div>
|
|
<div class="mt-2 p-2 bg-primary text-white rounded text-center">
|
|
<small>{{ $stabileAttivo }}</small>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Menu Navigation --}}
|
|
<nav class="sidebar-nav flex-fill overflow-auto p-2" role="navigation">
|
|
<ul class="nav nav-pills flex-column">
|
|
|
|
{{-- Dashboard --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center text-dark" href="{{ route('dashboard') }}">
|
|
<i class="fas fa-tachometer-alt me-2"></i>
|
|
<span>Dashboard</span>
|
|
</a>
|
|
</li>
|
|
|
|
{{-- Stabili --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center justify-content-between text-dark"
|
|
data-bs-toggle="collapse" href="#stabiliMenu" role="button">
|
|
<div class="d-flex align-items-center">
|
|
<i class="fas fa-building me-2"></i>
|
|
<span>Stabili</span>
|
|
</div>
|
|
<i class="fas fa-chevron-down"></i>
|
|
</a>
|
|
<div class="collapse" id="stabiliMenu">
|
|
<ul class="nav nav-pills flex-column ms-3">
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-list me-2"></i>Elenco Stabili</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-plus me-2"></i>Nuovo Stabile</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-home me-2"></i>Unità Immobiliari</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
|
|
{{-- Condomini --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center justify-content-between text-dark"
|
|
data-bs-toggle="collapse" href="#condominiMenu" role="button">
|
|
<div class="d-flex align-items-center">
|
|
<i class="fas fa-users me-2"></i>
|
|
<span>Condomini</span>
|
|
</div>
|
|
<i class="fas fa-chevron-down"></i>
|
|
</a>
|
|
<div class="collapse" id="condominiMenu">
|
|
<ul class="nav nav-pills flex-column ms-3">
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-list me-2"></i>Elenco Condomini</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-user-plus me-2"></i>Nuovo Condomino</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
|
|
{{-- Contabilità --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center justify-content-between text-dark"
|
|
data-bs-toggle="collapse" href="#contabilitaMenu" role="button">
|
|
<div class="d-flex align-items-center">
|
|
<i class="fas fa-calculator me-2"></i>
|
|
<span>Contabilità</span>
|
|
</div>
|
|
<i class="fas fa-chevron-down"></i>
|
|
</a>
|
|
<div class="collapse" id="contabilitaMenu">
|
|
<ul class="nav nav-pills flex-column ms-3">
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-receipt me-2"></i>Rate</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link text-dark" href="#"><i class="fas fa-chart-line me-2"></i>Bilanci</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
|
|
{{-- Comunicazioni --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center text-dark" href="#">
|
|
<i class="fas fa-envelope me-2"></i>
|
|
<span>Comunicazioni</span>
|
|
</a>
|
|
</li>
|
|
|
|
{{-- Tickets --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center text-dark" href="#">
|
|
<i class="fas fa-ticket-simple me-2"></i>
|
|
<span>Tickets</span>
|
|
</a>
|
|
</li>
|
|
|
|
{{-- Impostazioni --}}
|
|
<li class="nav-item mb-1">
|
|
<a class="nav-link d-flex align-items-center text-dark" href="#">
|
|
<i class="fas fa-cog me-2"></i>
|
|
<span>Impostazioni</span>
|
|
</a>
|
|
</li>
|
|
|
|
</ul>
|
|
</nav>
|
|
|
|
{{-- Footer --}}
|
|
<div class="p-2 border-top text-center">
|
|
<small class="text-muted">
|
|
© 2025 NetGesCon v2.1.0
|
|
</small>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{{-- CSS per sidebar --}}
|
|
@push('styles')
|
|
<style>
|
|
/* Sidebar scrollbar */
|
|
.sidebar-nav {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: #6c757d #f8f9fa;
|
|
}
|
|
|
|
.sidebar-nav::-webkit-scrollbar {
|
|
width: 4px;
|
|
}
|
|
|
|
.sidebar-nav::-webkit-scrollbar-track {
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.sidebar-nav::-webkit-scrollbar-thumb {
|
|
background: #6c757d;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
/* Menu items */
|
|
.nav-pills .nav-link {
|
|
border-radius: 8px;
|
|
margin: 2px 0;
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.nav-pills .nav-link:hover {
|
|
background-color: #e9ecef;
|
|
transform: translateX(4px);
|
|
}
|
|
|
|
.nav-pills .nav-link.active {
|
|
background-color: #0d6efd;
|
|
color: white;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Aggiorna data e ora ogni minuto
|
|
function updateDateTime() {
|
|
const now = new Date();
|
|
const dateElement = document.getElementById('datetime-display');
|
|
if (dateElement) {
|
|
dateElement.textContent = now.toLocaleDateString('it-IT') + ' ' +
|
|
now.toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
|
|
}
|
|
}
|
|
|
|
updateDateTime();
|
|
setInterval(updateDateTime, 60000);
|
|
|
|
// Gestione toggle menu collassabili
|
|
const collapseElements = document.querySelectorAll('[data-bs-toggle="collapse"]');
|
|
collapseElements.forEach(element => {
|
|
element.addEventListener('click', function() {
|
|
const icon = this.querySelector('.fa-chevron-down, .fa-chevron-up');
|
|
if (icon) {
|
|
icon.classList.toggle('fa-chevron-down');
|
|
icon.classList.toggle('fa-chevron-up');
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|