Files
ludikevent_crm/assets/admin.js

125 lines
5.0 KiB
JavaScript
Raw Normal View History

import './admin.scss'
import * as Turbo from "@hotwired/turbo"
/**
* Initialise les composants de l'interface d'administration.
* Cette fonction est appelée à chaque chargement de page par Turbo.
*/
function initAdminLayout() {
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebar-overlay');
const toggleBtn = document.getElementById('sidebar-toggle');
const settingsToggle = document.getElementById('settings-toggle');
const settingsSubmenu = document.getElementById('settings-submenu');
// --- 1. GESTION DE LA SIDEBAR (MOBILE) ---
if (toggleBtn && sidebar && overlay) {
toggleBtn.onclick = () => {
sidebar.classList.toggle('-translate-x-full');
overlay.classList.toggle('hidden');
};
overlay.onclick = () => {
sidebar.classList.add('-translate-x-full');
overlay.classList.add('hidden');
};
}
// --- 2. GESTION DU DROPDOWN (PARAMÈTRES) ---
if (settingsToggle && settingsSubmenu) {
const settingsChevron = settingsToggle.querySelector('svg:last-child');
/**
* Alterne l'état du dropdown avec une animation de glissement.
* @param {boolean} show - Forcer l'ouverture ou la fermeture
* @param {boolean} animate - Activer ou non la transition CSS
*/
const toggleDropdown = (show, animate = true) => {
if (!animate) settingsSubmenu.style.transition = 'none';
if (show) {
settingsSubmenu.classList.remove('hidden');
// scrollHeight permet de calculer la hauteur réelle du contenu
settingsSubmenu.style.maxHeight = settingsSubmenu.scrollHeight + "px";
settingsChevron?.classList.add('rotate-180');
localStorage.setItem('admin_settings_open', 'true');
} else {
settingsSubmenu.style.maxHeight = "0px";
settingsChevron?.classList.remove('rotate-180');
localStorage.setItem('admin_settings_open', 'false');
// On cache l'élément après l'animation pour l'accessibilité
if (animate) {
setTimeout(() => {
if (settingsSubmenu.style.maxHeight === "0px") {
settingsSubmenu.classList.add('hidden');
}
}, 300);
} else {
settingsSubmenu.classList.add('hidden');
}
}
if (!animate) {
// Forcer un recalcul pour réactiver la transition proprement
settingsSubmenu.offsetHeight;
settingsSubmenu.style.transition = '';
}
};
// Événement de clic
settingsToggle.onclick = (e) => {
e.preventDefault();
const isClosed = settingsSubmenu.style.maxHeight === "0px" || settingsSubmenu.classList.contains('hidden');
toggleDropdown(isClosed);
};
// --- PERSISTANCE ---
// On vérifie si on est sur une page appartenant au menu ou si l'utilisateur l'avait laissé ouvert
const isSettingsRoute = window.location.pathname.includes('/crm/administrateur') ||
window.location.pathname.includes('/crm/logs');
const wasOpen = localStorage.getItem('admin_settings_open') === 'true';
if (isSettingsRoute || wasOpen) {
toggleDropdown(true, false); // Ouverture immédiate sans animation
}
// --- HIGHLIGHT DU LIEN ACTIF ---
settingsSubmenu.querySelectorAll('a').forEach(link => {
if (window.location.pathname === link.getAttribute('href')) {
link.classList.add('text-blue-600', 'dark:text-blue-400', 'font-semibold');
link.classList.remove('text-slate-500');
}
});
}
// --- 3. GESTION DES MESSAGES FLASH (Auto-suppression) ---
document.querySelectorAll('.flash-message').forEach((flash) => {
setTimeout(() => {
flash.classList.add('opacity-0', 'translate-x-10');
setTimeout(() => flash.remove(), 500);
}, 8000);
});
}
// --- CORRECTIF DATA-TURBO-CONFIRM ---
// Turbo 7+ intercepte les clics, on réimplémente une confirmation native simple
document.addEventListener("turbo:click", (event) => {
const message = event.target.closest("[data-turbo-confirm]")?.getAttribute("data-turbo-confirm");
if (message && !confirm(message)) {
event.preventDefault();
}
});
// Exécution au chargement initial et à chaque navigation Turbo
document.addEventListener('turbo:load', initAdminLayout);
// Nettoyage avant la mise en cache de Turbo (évite les bugs visuels au retour arrière)
document.addEventListener('turbo:before-cache', () => {
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebar-overlay');
if (sidebar) sidebar.classList.add('-translate-x-full');
if (overlay) overlay.classList.add('hidden');
});