Gestion d'Emploi du Temps
> Rapport de mission : Planification centralisée.
Développement d'une SPA (Single Page Application) permettant la création, l'attribution et la visualisation des cours par groupes d'étudiants. L'interface offre un calendrier interactif dynamique avec un système de profils publics/privés sécurisé par JWT.
Analyse Technique : Rendu dynamique des événements
Pour afficher les cours précisément sur la grille horaire, j'ai développé une logique de calcul de position en pixels (`top` et `height`) directement injectée dans le DOM via l'attribut de style de Vue.js :
const getEventPosition = (course: Course) => {
if (!course.startDatetime || !course.endDatetime) return {};
const start = new Date(course.startDatetime);
const end = new Date(course.endDatetime);
const hourHeight = 60; // 60px par heure
const startOffset = 8 * 60; // La grille commence à 8h00
const startMinutes = start.getHours() * 60 + start.getMinutes();
const endMinutes = end.getHours() * 60 + end.getMinutes();
const top = ((startMinutes - startOffset) / 60) * hourHeight;
const height = ((endMinutes - startMinutes) / 60) * hourHeight;
return { top: `${top}px`, height: `${height}px`, position: 'absolute' };
};