465 lines
15 KiB
PHP
465 lines
15 KiB
PHP
<!-- Admin Sidebar -->
|
|
<aside class="admin-sidebar">
|
|
<div class="sidebar-body">
|
|
<ul class="sidebar-nav" id="sidebar-nav">
|
|
<!-- Dashboard -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs('admindash') ? 'active' : '' }}" href="{{ route('admindash') }}">
|
|
<i class="fas fa-tachometer-alt"></i>
|
|
<span>Dashboard</span>
|
|
</a>
|
|
</li>
|
|
|
|
<!-- User Management -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs('datauser') ? 'active' : '' }}" href="{{ route('datauser') }}">
|
|
<i class="fas fa-users"></i>
|
|
<span>User Management</span>
|
|
</a>
|
|
</li>
|
|
|
|
<!-- Food Management -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs(['kategori', 'jenismakanan', 'makanan', 'komponen', 'waktumakan', 'relasi.index']) ? 'active' : '' }}"
|
|
data-bs-target="#foods-nav"
|
|
data-bs-toggle="collapse"
|
|
href="#"
|
|
aria-expanded="{{ request()->routeIs(['kategori', 'jenismakanan', 'makanan', 'komponen', 'waktumakan', 'relasi.index']) ? 'true' : 'false' }}">
|
|
<i class="fas fa-utensils"></i>
|
|
<span>Food Management</span>
|
|
<i class="fas fa-chevron-down ms-auto"></i>
|
|
</a>
|
|
<ul id="foods-nav"
|
|
class="nav-content collapse {{ request()->routeIs(['kategori', 'jenismakanan', 'makanan', 'komponen', 'waktumakan', 'relasi.index']) ? 'show' : '' }}"
|
|
data-bs-parent="#sidebar-nav">
|
|
<li>
|
|
<a class="{{ request()->routeIs('kategori') ? 'active' : '' }}" href="{{ route('kategori') }}">
|
|
<i class="fas fa-tags"></i>
|
|
<span>Categories</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('jenismakanan') ? 'active' : '' }}" href="{{ route('jenismakanan') }}">
|
|
<i class="fas fa-cookie-bite"></i>
|
|
<span>Food Types</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('makanan') ? 'active' : '' }}" href="{{ route('makanan') }}">
|
|
<i class="fas fa-hamburger"></i>
|
|
<span>Food Items</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('komponen') ? 'active' : '' }}" href="{{ route('komponen') }}">
|
|
<i class="fas fa-puzzle-piece"></i>
|
|
<span>Components</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('waktumakan') ? 'active' : '' }}" href="{{ route('waktumakan') }}">
|
|
<i class="fas fa-clock"></i>
|
|
<span>Meal Times</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('relasi.index') ? 'active' : '' }}" href="{{ route('relasi.index') }}">
|
|
<i class="fas fa-project-diagram"></i>
|
|
<span>Relations</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<!-- Criteria Management -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs(['kriteria', 'perbandingan', 'hasil.normalisasi']) ? 'active' : '' }}"
|
|
data-bs-target="#criteria-nav"
|
|
data-bs-toggle="collapse"
|
|
href="#"
|
|
aria-expanded="{{ request()->routeIs(['kriteria', 'perbandingan', 'hasil.normalisasi']) ? 'true' : 'false' }}">
|
|
<i class="fas fa-clipboard-list"></i>
|
|
<span>Criteria</span>
|
|
<i class="fas fa-chevron-down ms-auto"></i>
|
|
</a>
|
|
<ul id="criteria-nav"
|
|
class="nav-content collapse {{ request()->routeIs(['kriteria', 'perbandingan', 'hasil.normalisasi']) ? 'show' : '' }}"
|
|
data-bs-parent="#sidebar-nav">
|
|
<li>
|
|
<a class="{{ request()->routeIs('kriteria') ? 'active' : '' }}" href="{{ route('kriteria') }}">
|
|
<i class="fas fa-list-ul"></i>
|
|
<span>Select Criteria</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('perbandingan') ? 'active' : '' }}" href="{{ route('perbandingan') }}">
|
|
<i class="fas fa-balance-scale"></i>
|
|
<span>Criteria Comparison</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('hasil.normalisasi') ? 'active' : '' }}" href="{{ route('hasil.normalisasi') }}">
|
|
<i class="fas fa-calculator"></i>
|
|
<span>Criteria Normalization</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<!-- Alternative Management -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs(['alternatif.pilih', 'alternatif.perbandingan']) ? 'active' : '' }}"
|
|
data-bs-target="#alternatives-nav"
|
|
data-bs-toggle="collapse"
|
|
href="#"
|
|
aria-expanded="{{ request()->routeIs(['alternatif.pilih', 'alternatif.perbandingan']) ? 'true' : 'false' }}">
|
|
<i class="fas fa-random"></i>
|
|
<span>Alternatives</span>
|
|
<i class="fas fa-chevron-down ms-auto"></i>
|
|
</a>
|
|
<ul id="alternatives-nav"
|
|
class="nav-content collapse {{ request()->routeIs(['alternatif.pilih', 'alternatif.perbandingan']) ? 'show' : '' }}"
|
|
data-bs-parent="#sidebar-nav">
|
|
<li>
|
|
<a class="{{ request()->routeIs('alternatif.pilih') ? 'active' : '' }}" href="{{ route('alternatif.pilih') }}">
|
|
<i class="fas fa-check-square"></i>
|
|
<span>Select Alternatives</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('alternatif.view') ? 'active' : '' }}" href="{{ route('alternatif.view') }}">
|
|
<i class="fas fa-balance-scale-right"></i>
|
|
<span>Alternative view</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('alternatif.perbandingan') ? 'active' : '' }}" href="{{ route('alternatif.perbandingan') }}">
|
|
<i class="fas fa-balance-scale-right"></i>
|
|
<span>Alternative Comparison</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<!-- Recommendations -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs(['rekomendasi.index', 'rekomendasi.hasil']) ? 'active' : '' }}"
|
|
data-bs-target="#recommendations-nav"
|
|
data-bs-toggle="collapse"
|
|
href="#"
|
|
aria-expanded="{{ request()->routeIs(['rekomendasi.index', 'rekomendasi.hasil']) ? 'true' : 'false' }}">
|
|
<i class="fas fa-star"></i>
|
|
<span>Recommendations</span>
|
|
<i class="fas fa-chevron-down ms-auto"></i>
|
|
</a>
|
|
<ul id="recommendations-nav"
|
|
class="nav-content collapse {{ request()->routeIs(['rekomendasi.index', 'rekomendasi.hasil']) ? 'show' : '' }}"
|
|
data-bs-parent="#sidebar-nav">
|
|
<li>
|
|
<a class="{{ request()->routeIs('rekomendasi.index') ? 'active' : '' }}" href="{{ route('rekomendasi.index') }}">
|
|
<i class="fas fa-list-ol"></i>
|
|
<span>Recommendation List</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="{{ request()->routeIs('rekomendasi_ahli.index') ? 'active' : '' }}" href="{{ route('rekomendasi_ahli.index') }}">
|
|
<i class="fas fa-chart-bar"></i>
|
|
<span>Recomendation form ahli</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<!-- Validasi Rekomendasi -->
|
|
<li class="nav-item">
|
|
<a class="nav-link {{ request()->routeIs('validasi.*') ? 'active' : '' }}" href="{{ route('validasi.index') }}">
|
|
<i class="fas fa-check-circle"></i>
|
|
<span>Validasi Rekomendasi</span>
|
|
</a>
|
|
</li>
|
|
|
|
<!-- AHP History -->
|
|
<!-- <li class="nav-item">
|
|
<a href="{{ route('history.ahp') }}" class="nav-link {{ Request::routeIs('history.ahp') ? 'active' : '' }}">
|
|
<i class="nav-icon fas fa-history"></i>
|
|
<p>History AHP</p>
|
|
</a>
|
|
</li> -->
|
|
</ul>
|
|
</div>
|
|
</aside>
|
|
|
|
@push('styles')
|
|
<style>
|
|
:root {
|
|
--sidebar-width: 280px;
|
|
--sidebar-bg: #1a1c23;
|
|
--sidebar-hover: #2d2f39;
|
|
--sidebar-active: #2196f3;
|
|
--sidebar-text: #e4e6f0;
|
|
--sidebar-text-muted: #9ca3af;
|
|
--transition-speed: 0.3s;
|
|
}
|
|
|
|
/* Sidebar Base Styles */
|
|
.admin-sidebar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
width: var(--sidebar-width);
|
|
background: var(--sidebar-bg);
|
|
transition: transform var(--transition-speed) ease;
|
|
z-index: 1000;
|
|
overflow-y: auto;
|
|
box-shadow: 4px 0 10px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
/* Header Styles */
|
|
.sidebar-header {
|
|
padding: 1.25rem;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background: linear-gradient(to right, var(--sidebar-bg), var(--sidebar-hover));
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.app-brand {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.brand-link {
|
|
display: flex;
|
|
align-items: center;
|
|
text-decoration: none;
|
|
color: var(--sidebar-text);
|
|
}
|
|
|
|
.brand-icon {
|
|
font-size: 1.75rem;
|
|
margin-right: 0.75rem;
|
|
color: var(--sidebar-active);
|
|
}
|
|
|
|
.brand-name {
|
|
font-size: 1.25rem;
|
|
font-weight: 600;
|
|
background: linear-gradient(45deg, var(--sidebar-active), #64b5f6);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
}
|
|
|
|
/* Navigation Styles */
|
|
.sidebar-body {
|
|
padding: 1rem 0;
|
|
}
|
|
|
|
.sidebar-nav {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.nav-item {
|
|
margin: 0.25rem 1rem;
|
|
}
|
|
|
|
.nav-link {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0.875rem 1.25rem;
|
|
color: var(--sidebar-text-muted);
|
|
text-decoration: none;
|
|
border-radius: 0.5rem;
|
|
transition: all var(--transition-speed) ease;
|
|
}
|
|
|
|
.nav-link:hover {
|
|
color: var(--sidebar-text);
|
|
background: var(--sidebar-hover);
|
|
transform: translateX(5px);
|
|
}
|
|
|
|
.nav-link.active {
|
|
color: var(--sidebar-text);
|
|
background: var(--sidebar-active);
|
|
box-shadow: 0 4px 12px rgba(33, 150, 243, 0.35);
|
|
}
|
|
|
|
.nav-link i:first-child {
|
|
font-size: 1.1rem;
|
|
width: 1.75rem;
|
|
margin-right: 0.75rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.nav-link i.ms-auto {
|
|
font-size: 0.875rem;
|
|
transition: transform var(--transition-speed) ease;
|
|
}
|
|
|
|
.nav-link[aria-expanded="true"] i.ms-auto {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
/* Submenu Styles */
|
|
.nav-content {
|
|
list-style: none;
|
|
padding: 0.5rem 0;
|
|
margin: 0 0 0 3.5rem;
|
|
border-left: 1px dashed rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.nav-content a {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0.625rem 1rem;
|
|
color: var(--sidebar-text-muted);
|
|
text-decoration: none;
|
|
border-radius: 0.375rem;
|
|
transition: all var(--transition-speed) ease;
|
|
font-size: 0.9375rem;
|
|
}
|
|
|
|
.nav-content a:hover {
|
|
color: var(--sidebar-text);
|
|
background: var(--sidebar-hover);
|
|
transform: translateX(5px);
|
|
}
|
|
|
|
.nav-content a.active {
|
|
color: var(--sidebar-active);
|
|
background: rgba(33, 150, 243, 0.1);
|
|
}
|
|
|
|
.nav-content a i {
|
|
font-size: 1.1rem;
|
|
width: 1.75rem;
|
|
margin-right: 0.75rem;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Animations */
|
|
@keyframes pulse {
|
|
0% { transform: scale(1); }
|
|
50% { transform: scale(1.1); }
|
|
100% { transform: scale(1); }
|
|
}
|
|
|
|
.brand-icon.pulse {
|
|
animation: pulse 2s infinite;
|
|
}
|
|
|
|
/* Mobile Responsiveness */
|
|
.mobile-toggle {
|
|
display: none;
|
|
background: transparent;
|
|
border: none;
|
|
color: var(--sidebar-text);
|
|
font-size: 1.25rem;
|
|
cursor: pointer;
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
@media (max-width: 991.98px) {
|
|
.admin-sidebar {
|
|
transform: translateX(-100%);
|
|
}
|
|
|
|
.admin-sidebar.show {
|
|
transform: translateX(0);
|
|
}
|
|
|
|
.mobile-toggle {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
/* Scrollbar Styles */
|
|
.admin-sidebar::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
|
|
.admin-sidebar::-webkit-scrollbar-track {
|
|
background: var(--sidebar-bg);
|
|
}
|
|
|
|
.admin-sidebar::-webkit-scrollbar-thumb {
|
|
background: var(--sidebar-hover);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.admin-sidebar::-webkit-scrollbar-thumb:hover {
|
|
background: var(--sidebar-active);
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
@push('scripts')
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Mobile sidebar toggle
|
|
const mobileToggle = document.querySelector('.mobile-toggle');
|
|
const sidebar = document.querySelector('.admin-sidebar');
|
|
|
|
if (mobileToggle) {
|
|
mobileToggle.addEventListener('click', function() {
|
|
sidebar.classList.toggle('show');
|
|
});
|
|
|
|
// Close sidebar when clicking outside
|
|
document.addEventListener('click', function(e) {
|
|
if (!sidebar.contains(e.target) && !mobileToggle.contains(e.target)) {
|
|
sidebar.classList.remove('show');
|
|
}
|
|
});
|
|
}
|
|
|
|
// Submenu animations
|
|
const navLinks = document.querySelectorAll('.nav-link[data-bs-toggle="collapse"]');
|
|
navLinks.forEach(link => {
|
|
link.addEventListener('click', function() {
|
|
const submenu = this.nextElementSibling;
|
|
if (submenu) {
|
|
submenu.style.height = submenu.scrollHeight + 'px';
|
|
}
|
|
});
|
|
});
|
|
|
|
// Active state management
|
|
const currentPath = window.location.pathname;
|
|
document.querySelectorAll('.nav-content a').forEach(link => {
|
|
if (link.getAttribute('href') === currentPath) {
|
|
link.classList.add('active');
|
|
const parentCollapse = link.closest('.collapse');
|
|
if (parentCollapse) {
|
|
parentCollapse.classList.add('show');
|
|
const parentNavLink = parentCollapse.previousElementSibling;
|
|
if (parentNavLink) {
|
|
parentNavLink.classList.add('active');
|
|
parentNavLink.setAttribute('aria-expanded', 'true');
|
|
}
|
|
}
|
|
|
|
}
|
|
});
|
|
|
|
// Smooth scrolling
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
const target = document.querySelector(this.getAttribute('href'));
|
|
if (target) {
|
|
target.scrollIntoView({
|
|
behavior: 'smooth',
|
|
block: 'start'
|
|
});
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
@endpush
|