jps/Crvi
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modifier popover

Browse Source
This commit is contained in:
Jean-Philippe Staelen 2026-01-20 15:45:03 +01:00
parent af6953bcb8
commit 3dffdc5649
1 changed files with 48 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
assets/js/modules/agenda-fullcalendar.js
View File

@ -685,7 +685,9 @@ export function initializeCalendar() {
// Déterminer la couleur pour le popover (utiliser la même logique que pour l'événement)
const popoverColor = bgColor || '#6c757d';
const popoverTextColor = txtColor || '#ffffff';
// Recalculer la couleur du texte en fonction de la luminosité du fond du popover
// pour éviter un texte blanc sur fond blanc pour les permanences non attribuées
const popoverTextColor = getTextColor(popoverColor);
console.log('🎨 [POPOVER] Couleurs déterminées:', {
eventId: event.id,
@ -725,6 +727,47 @@ export function initializeCalendar() {
return statutConfig ? statutConfig.couleur : '#6c757d';
}
// Fonction pour obtenir le statut et sa couleur avec gestion des cas spéciaux
function getStatutDisplay(statut, eventType) {
let displayText = statut;
let displayColor = '#6c757d'; // Gris par défaut
// Cas spécial : permanence non attribuée
if (!statut && eventType === 'permanence') {
displayText = 'Non attribué';
displayColor = '#6c757d'; // Gris
return { text: displayText, color: displayColor };
}
// Si pas de statut, retourner une valeur par défaut
if (!statut) {
displayText = 'Non défini';
return { text: displayText, color: displayColor };
}
// Normaliser le statut (enlever accents et mettre en minuscules pour comparaison)
const statutLower = statut.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "");
// Déterminer la couleur selon le statut
if (statutLower.includes('absent')) {
displayColor = '#ffb3ba'; // Rouge pastel
} else if (statutLower.includes('present')) {
displayColor = '#90ee90'; // Vert clair
} else if (statutLower.includes('prevu')) {
displayColor = '#add8e6'; // Bleu clair
} else {
// Essayer de récupérer depuis les données ACF
if (crviACFData && crviACFData.statuts) {
const statutConfig = crviACFData.statuts[statut];
if (statutConfig && statutConfig.couleur) {
displayColor = statutConfig.couleur;
}
}
}
return { text: displayText, color: displayColor };
}
// Fonction utilitaire pour extraire le nom complet d'une entité
function getEntityDisplayName(entity, entityType = '') {
if (!entity) return '';
@ -757,6 +800,9 @@ export function initializeCalendar() {
console.log('eventProps:', eventProps);
// Obtenir le statut formaté avec sa couleur
const statutDisplay = getStatutDisplay(eventProps.statut, eventProps.type);
// Créer le contenu du popover avec titre coloré
const popoverContent = `
<div class="event-popover">
@ -769,7 +815,7 @@ export function initializeCalendar() {
${eventProps.intervenant ? `<div class="mb-1"><strong>Intervenant:</strong> ${getEntityDisplayName(eventProps.intervenant, 'intervenant')}</div>` : ''}
${eventProps.local ? `<div class="mb-1"><strong>Local:</strong> ${getEntityDisplayName(eventProps.local, 'local')}</div>` : ''}
${eventProps.commentaire ? `<div class="mb-1"><strong>Commentaire:</strong> ${eventProps.commentaire}</div>` : ''}
<div class="mb-1"><strong>Statut:</strong> <span class="event-status" style="background-color: ${getStatutColor(eventProps.statut)};">${eventProps.statut}</span></div>
<div class="mb-1"><strong>Statut:</strong> <span class="event-status" style="background-color: ${statutDisplay.color}; color: ${getTextColor(statutDisplay.color)}; padding: 2px 8px; border-radius: 3px;">${statutDisplay.text}</span></div>
<div class="mt-2">
<small class="text-muted">Cliquez pour plus de détails</small>
</div>