240 lines
9.9 KiB
PHP
240 lines
9.9 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="id">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>@yield('title', 'Admin Panel') - SMK Muhammadiyah 1 Berbek</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700&display=swap"
|
|
rel="stylesheet">
|
|
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
|
|
<link rel="shortcut icon" href="{{ asset('images/logo-single.png') }}" type="image/x-icon">
|
|
|
|
@stack('styles')
|
|
</head>
|
|
|
|
<body>
|
|
<div class="admin-wrapper">
|
|
@include('partials.sidebar')
|
|
<div class="main-content" id="mainContent">
|
|
@include('partials.header')
|
|
<div class="content-wrapper">
|
|
@yield('content')
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.all.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const sidebar = document.querySelector('.sidebar');
|
|
const mainContent = document.querySelector('.main-content');
|
|
const mobileOverlay = document.querySelector('.mobile-overlay');
|
|
|
|
function isMobile() {
|
|
return window.innerWidth <= 991.98;
|
|
}
|
|
|
|
const mobileToggle = document.querySelector('.mobile-toggle');
|
|
if (mobileToggle) {
|
|
mobileToggle.addEventListener('click', function() {
|
|
if (isMobile()) {
|
|
sidebar.classList.toggle('mobile-open');
|
|
mobileOverlay.classList.toggle('show');
|
|
}
|
|
});
|
|
}
|
|
|
|
if (mobileOverlay) {
|
|
mobileOverlay.addEventListener('click', function() {
|
|
if (isMobile()) {
|
|
sidebar.classList.remove('mobile-open');
|
|
mobileOverlay.classList.remove('show');
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener('click', function(e) {
|
|
if (isMobile() && sidebar.classList.contains('mobile-open')) {
|
|
if (!sidebar.contains(e.target) && !mobileToggle.contains(e.target)) {
|
|
sidebar.classList.remove('mobile-open');
|
|
mobileOverlay.classList.remove('show');
|
|
}
|
|
}
|
|
});
|
|
|
|
window.addEventListener('resize', function() {
|
|
if (!isMobile()) {
|
|
sidebar.classList.remove('mobile-open');
|
|
mobileOverlay.classList.remove('show');
|
|
}
|
|
});
|
|
|
|
// Dropdown functionality for sidebar
|
|
const dropdownToggles = document.querySelectorAll('.sidebar-link.dropdown-toggle');
|
|
|
|
dropdownToggles.forEach(toggle => {
|
|
toggle.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
const parentItem = this.parentElement;
|
|
const dropdown = this.nextElementSibling;
|
|
const arrow = this.querySelector('.dropdown-arrow');
|
|
|
|
// Close other dropdowns
|
|
document.querySelectorAll('.sidebar-item.has-dropdown').forEach(item => {
|
|
if (item !== parentItem) {
|
|
item.classList.remove('active');
|
|
item.querySelector('.sidebar-dropdown').classList.remove(
|
|
'show');
|
|
const otherArrow = item.querySelector('.dropdown-arrow');
|
|
if (otherArrow) {
|
|
otherArrow.style.transform = 'rotate(0deg)';
|
|
}
|
|
}
|
|
});
|
|
|
|
// Toggle current dropdown
|
|
parentItem.classList.toggle('active');
|
|
dropdown.classList.toggle('show');
|
|
|
|
if (arrow) {
|
|
arrow.style.transform = parentItem.classList.contains('active') ?
|
|
'rotate(180deg)' :
|
|
'rotate(0deg)';
|
|
}
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll('.sidebar-dropdown .sidebar-link.active').forEach(activeLink => {
|
|
const dropdown = activeLink.closest('.sidebar-dropdown');
|
|
const parentItem = dropdown?.parentElement;
|
|
|
|
if (dropdown && parentItem) {
|
|
parentItem.classList.add('active');
|
|
dropdown.classList.add('show');
|
|
const arrow = parentItem.querySelector('.dropdown-arrow');
|
|
if (arrow) {
|
|
arrow.style.transform = 'rotate(180deg)';
|
|
}
|
|
}
|
|
});
|
|
|
|
// Close dropdowns when clicking outside on mobile
|
|
document.addEventListener('click', function(e) {
|
|
if (window.innerWidth <= 991.98) {
|
|
if (!e.target.closest('.sidebar')) {
|
|
document.querySelectorAll('.sidebar-item.has-dropdown').forEach(item => {
|
|
item.classList.remove('active');
|
|
item.querySelector('.sidebar-dropdown').classList.remove('show');
|
|
const arrow = item.querySelector('.dropdown-arrow');
|
|
if (arrow) {
|
|
arrow.style.transform = 'rotate(0deg)';
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
const profileBtn = document.querySelector('.profile-btn');
|
|
const profileMenu = document.querySelector('.profile-menu');
|
|
|
|
if (profileBtn && profileMenu) {
|
|
profileBtn.addEventListener('click', function() {
|
|
profileMenu.classList.toggle('show');
|
|
});
|
|
|
|
document.addEventListener('click', function(e) {
|
|
if (!profileBtn.contains(e.target) && !profileMenu.contains(e.target)) {
|
|
profileMenu.classList.remove('show');
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
loadAdminData();
|
|
|
|
function loadAdminData() {
|
|
fetch('{{ route('admin.current') }}', {
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest',
|
|
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
const admin = data.admin;
|
|
document.getElementById('adminName').textContent = admin.nama_lengkap;
|
|
document.getElementById('adminNameShort').textContent = admin.nama_lengkap;
|
|
document.getElementById('dropdownAdminName').textContent = admin.nama_lengkap;
|
|
|
|
const profileBtn = document.querySelector('.profile-btn');
|
|
if (admin.foto_profil) {
|
|
const existingAvatar = profileBtn.querySelector('.profile-avatar');
|
|
if (existingAvatar) {
|
|
existingAvatar.src = admin.foto_profil;
|
|
} else {
|
|
const avatar = document.createElement('img');
|
|
avatar.src = admin.foto_profil;
|
|
avatar.alt = 'Profile';
|
|
avatar.className = 'profile-avatar';
|
|
profileBtn.insertBefore(avatar, profileBtn.firstChild);
|
|
}
|
|
}
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error loading admin data:', error);
|
|
});
|
|
}
|
|
|
|
function confirmLogout() {
|
|
Swal.fire({
|
|
title: 'Konfirmasi Logout',
|
|
text: 'Apakah Anda yakin ingin logout?',
|
|
icon: 'warning',
|
|
colorIcon: '#dd3333',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#dd3333',
|
|
confirmButtonText: 'Ya, Logout!',
|
|
cancelButtonText: 'Batal',
|
|
reverseButtons: true,
|
|
customClass: {
|
|
icon: 'text-danger border-danger'
|
|
}
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
const form = document.createElement('form');
|
|
form.method = 'POST';
|
|
form.action = '{{ route('auth.logout') }}';
|
|
|
|
const csrfToken = document.createElement('input');
|
|
csrfToken.type = 'hidden';
|
|
csrfToken.name = '_token';
|
|
csrfToken.value = '{{ csrf_token() }}';
|
|
|
|
form.appendChild(csrfToken);
|
|
document.body.appendChild(form);
|
|
form.submit();
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener('click', function(e) {
|
|
if (e.target.classList.contains('logout-link')) {
|
|
e.preventDefault();
|
|
confirmLogout();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
@stack('scripts')
|
|
</body>
|
|
|
|
</html>
|