acasini/n3wt-school
1
0
Fork 0
mirror of https://git.v0id.ovh/n3wt-innov/n3wt-school.git synced 2026-01-29 07:53:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Gestion du planning [3]

Browse Source
This commit is contained in:
Luc SORIGNET
2025-05-03 15:12:17 +02:00
parent cb4fe74a9e
commit 58144ba0d0
39 changed files with 939 additions and 1864 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
Front-End/src/components/Calendar/WeekView.js
View File

@ -1,12 +1,6 @@
import React, { useEffect, useState, useRef } from 'react';
import { usePlanning } from '@/context/PlanningContext';
import {
format,
startOfWeek,
addDays,
differenceInMinutes,
isSameDay,
} from 'date-fns';
import { format, startOfWeek, addDays, isSameDay } from 'date-fns';
import { fr } from 'date-fns/locale';
import { getWeekEvents } from '@/utils/events';
import { isToday } from 'date-fns';
@ -49,7 +43,8 @@ const WeekView = ({ onDateClick, onEventClick, events }) => {
const getCurrentTimePosition = () => {
const hours = currentTime.getHours();
const minutes = currentTime.getMinutes();
return `${(hours + minutes / 60) * 5}rem`;
const rowHeight = 5; // Hauteur des lignes en rem (h-20 = 5rem)
return `${((hours + minutes / 60) * rowHeight)}rem`;
};
// Utiliser les événements déjà filtrés passés en props
@ -144,17 +139,17 @@ const WeekView = ({ onDateClick, onEventClick, events }) => {
};
return (
<div className="flex flex-col h-full overflow-hidden">
<div className="flex flex-col h-full overflow-y-auto">
{/* En-tête des jours */}
<div
className="grid gap-[1px] bg-gray-100 pr-[17px]"
className="grid gap-[1px] w-full bg-gray-100"
style={{ gridTemplateColumns: '2.5rem repeat(7, 1fr)' }}
>
<div className="bg-white h-14"></div>
{weekDays.map((day) => (
<div
key={day}
className={`p-2 text-center border-b
className={`h-14 p-2 text-center border-b
${isWeekend(day) ? 'bg-gray-50' : 'bg-white'}
${isToday(day) ? 'bg-emerald-100 border-x border-emerald-600' : ''}`}
>
@ -172,7 +167,7 @@ const WeekView = ({ onDateClick, onEventClick, events }) => {
</div>
{/* Grille horaire */}
<div ref={scrollContainerRef} className="flex-1 overflow-y-auto relative">
<div ref={scrollContainerRef} className="flex-1 relative">
{/* Ligne de temps actuelle */}
{isCurrentWeek && (
<div
@ -181,12 +176,12 @@ const WeekView = ({ onDateClick, onEventClick, events }) => {
top: getCurrentTimePosition(),
}}
>
<div className="absolute -left-2 -top-1 w-2 h-2 rounded-full bg-emerald-500" />
<div className="absolute -left-2 -top-2 w-2 h-2 rounded-full bg-emerald-500" />
</div>
)}
<div
className="grid gap-[1px] bg-gray-100"
className="grid gap-[1px] w-full bg-gray-100"
style={{ gridTemplateColumns: '2.5rem repeat(7, 1fr)' }}
>
{timeSlots.map((hour) => (
@ -209,9 +204,7 @@ const WeekView = ({ onDateClick, onEventClick, events }) => {
onDateClick(date);
}}
>
<div className="flex gap-1">
{' '}
{/* Ajout de gap-1 */}
<div className="grid gap-1">
{dayEvents
.filter((event) => {
const eventStart = new Date(event.start);