2025-12-11 17:22:26 +01:00
|
|
|
import './admin.scss'
|
|
|
|
|
import * as Turbo from "@hotwired/turbo"
|
2026-01-15 18:51:17 +01:00
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
/**
|
|
|
|
|
* Initialise les composants de l'interface d'administration.
|
|
|
|
|
* Cette fonction est appelée à chaque chargement de page par Turbo.
|
|
|
|
|
*/
|
2026-01-15 18:51:17 +01:00
|
|
|
function initAdminLayout() {
|
|
|
|
|
const sidebar = document.getElementById('sidebar');
|
|
|
|
|
const overlay = document.getElementById('sidebar-overlay');
|
|
|
|
|
const toggleBtn = document.getElementById('sidebar-toggle');
|
2026-01-15 20:35:46 +01:00
|
|
|
|
2026-01-15 18:51:17 +01:00
|
|
|
const settingsToggle = document.getElementById('settings-toggle');
|
|
|
|
|
const settingsSubmenu = document.getElementById('settings-submenu');
|
|
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// --- 1. GESTION DE LA SIDEBAR (MOBILE) ---
|
2026-01-15 18:51:17 +01:00
|
|
|
if (toggleBtn && sidebar && overlay) {
|
2026-01-15 20:35:46 +01:00
|
|
|
toggleBtn.onclick = () => {
|
2026-01-15 18:51:17 +01:00
|
|
|
sidebar.classList.toggle('-translate-x-full');
|
|
|
|
|
overlay.classList.toggle('hidden');
|
2026-01-15 20:35:46 +01:00
|
|
|
};
|
2026-01-15 18:51:17 +01:00
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
overlay.onclick = () => {
|
2026-01-15 18:51:17 +01:00
|
|
|
sidebar.classList.add('-translate-x-full');
|
|
|
|
|
overlay.classList.add('hidden');
|
2026-01-15 20:35:46 +01:00
|
|
|
};
|
2026-01-15 18:51:17 +01:00
|
|
|
}
|
|
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// --- 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');
|
2026-01-15 18:51:17 +01:00
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// 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) => {
|
2026-01-15 18:51:17 +01:00
|
|
|
e.preventDefault();
|
2026-01-15 20:35:46 +01:00
|
|
|
const isClosed = settingsSubmenu.style.maxHeight === "0px" || settingsSubmenu.classList.contains('hidden');
|
|
|
|
|
toggleDropdown(isClosed);
|
|
|
|
|
};
|
2026-01-15 18:51:17 +01:00
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// --- 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
|
2026-01-15 18:51:17 +01:00
|
|
|
}
|
2026-01-15 20:35:46 +01:00
|
|
|
|
|
|
|
|
// --- 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');
|
|
|
|
|
}
|
|
|
|
|
});
|
2026-01-15 18:51:17 +01:00
|
|
|
}
|
|
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// --- 3. GESTION DES MESSAGES FLASH (Auto-suppression) ---
|
|
|
|
|
document.querySelectorAll('.flash-message').forEach((flash) => {
|
2026-01-15 18:51:17 +01:00
|
|
|
setTimeout(() => {
|
|
|
|
|
flash.classList.add('opacity-0', 'translate-x-10');
|
|
|
|
|
setTimeout(() => flash.remove(), 500);
|
2026-01-15 20:35:46 +01:00
|
|
|
}, 8000);
|
2026-01-15 18:51:17 +01:00
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// --- CORRECTIF DATA-TURBO-CONFIRM ---
|
2026-01-15 20:35:46 +01:00
|
|
|
// Turbo 7+ intercepte les clics, on réimplémente une confirmation native simple
|
2026-01-15 18:51:17 +01:00
|
|
|
document.addEventListener("turbo:click", (event) => {
|
2026-01-15 20:35:46 +01:00
|
|
|
const message = event.target.closest("[data-turbo-confirm]")?.getAttribute("data-turbo-confirm");
|
2026-01-15 18:51:17 +01:00
|
|
|
if (message && !confirm(message)) {
|
|
|
|
|
event.preventDefault();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// Exécution au chargement initial et à chaque navigation Turbo
|
2026-01-15 18:51:17 +01:00
|
|
|
document.addEventListener('turbo:load', initAdminLayout);
|
|
|
|
|
|
2026-01-15 20:35:46 +01:00
|
|
|
// Nettoyage avant la mise en cache de Turbo (évite les bugs visuels au retour arrière)
|
2026-01-15 18:51:17 +01:00
|
|
|
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');
|
|
|
|
|
});
|