merge

front_end/src/components/ressourceList.tsx

@@ -1,25 +1,87 @@
+import React from "react";
 import { Athlete, Activite, Coach, Session, Ligne } from "../classes";
 import ObjectSession from "./object/session";
+import {calculStatsAthlete, niveauAlerte} from "../utils/athleteUtils";
+import {calculTempsDeJeuParLigne} from "../utils/ligneUtils";
 
-type AthleteListProps = { athletes: Athlete[] };
+
+type AthleteListProps = { athletes: Athlete[], sessions: Session[]};
 type ActiviteListProps = { activites: Activite[] };
 type CoachListProps = { coachs: Coach[] };
 type SessionListProps = { sessions: Session[]};
-type LigneListProps = { lignes: Ligne[]};
+type LigneListProps = { lignes: Ligne[], tempsDeJeuParLigne: Map<number, number> };
 
 
 
 
-function AthleteList({ athletes }: AthleteListProps) {
+function AthleteList({ athletes, sessions }: AthleteListProps) {
+    const [dateDebut, setDateDebut] = React.useState(new Date());
+    const [dateFin, setDateFin] = React.useState(new Date());
+    const [seuilCritique, setSeuilCritique] = React.useState(0);
+    const [seuilMax, setSeuilMax] = React.useState(0);
+
+    const dateToDatetimeLocal = (date: Date) => {
+        const pad = (n: number) => n.toString().padStart(2, "0");
+        return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
+    };
+
     return (
-        <ul className="AthleteList">
-            {athletes.map((athlete) => (
-                <li key={athlete.id}>
-                    <div><strong>Nom:</strong> {athlete.nom}</div>
-                    <div><strong>Groupe:</strong> {athlete.groupe}</div>
-                </li>
-            ))}
-        </ul>
+        <>
+            <div className="creneau-stats">
+                <label>
+                    Début :
+                    <input
+                        type="datetime-local"
+                        value={dateToDatetimeLocal(dateDebut)}
+                        onChange={e => setDateDebut(new Date(e.target.value))}
+                    />
+                </label>
+
+                <label>
+                    Fin :
+                    <input
+                        type="datetime-local"
+                        value={dateToDatetimeLocal(dateFin)}
+                        onChange={e => setDateFin(new Date(e.target.value))}
+                    />
+                </label>
+                <label>
+                    Seuil critique :
+                    <input
+                        type="number"
+                        value={seuilCritique}
+                        min={1}
+                        onChange={e => setSeuilCritique(Number(e.target.value))}
+                    />
+                </label>
+                <label>Seuil max :
+                    <input
+                        type="number"
+                        value={seuilMax}
+                        min={1}
+                        onChange={e => setSeuilMax(Number(e.target.value))}
+                    />
+                </label>
+            </div>
+
+            <ul className="AthleteList">
+                {athletes.map(a => {
+                    const stats = calculStatsAthlete(sessions, a, dateDebut, dateFin);
+                    const alerte = niveauAlerte(stats, seuilCritique, seuilMax);
+
+                    return (
+                        <li key={a.id}>
+                            <div><strong>Nom:</strong> {a.nom}</div>
+                            <div><strong>Groupe:</strong> {a.groupe}</div>
+                            <div><strong>Nombre de sessions:</strong> {stats.nbSessions}</div>
+                            <div><strong>Sessions/semaine:</strong> {stats.nbSessionsPerWeek.toFixed(2)}</div>
+                            <div><strong>Alerte:</strong> {alerte}</div>
+                            <div><strong>Distribuion des activités:</strong> {stats.distributions}</div>
+                        </li>
+                    );
+                })}
+            </ul>
+        </>
     );
 }
 
@@ -69,7 +131,7 @@ function SessionList({ sessions }: SessionListProps) {
     );
 }
 
-function LigneList({ lignes }: LigneListProps) {
+function LigneList({ lignes, tempsDeJeuParLigne }: LigneListProps) {
     return (
         <ul className="LigneList">
             {lignes.map((lignes) => (
@@ -90,7 +152,8 @@ function LigneList({ lignes }: LigneListProps) {
                     </div>
                     </div>
                     <div>
-                        <strong>Temps de jeu: {lignes.tempsDeJeu}</strong>
+                        <strong>Temps de jeu total :</strong>{" "}
+                        {tempsDeJeuParLigne.get(lignes.id) ?? 0} min
                     </div>
                 </li>
             ))}