ajout d'activité

2026-01-07 18:00:39 +01:00
parent 7fdd9681dc
commit 153035cefa
9 changed files with 171 additions and 21 deletions
--- a/front_end/src/components/createActivite.tsx
+++ b/front_end/src/components/createActivite.tsx
@@ -0,0 +1,75 @@
+import { useState, useEffect } from "react";
+import { Session, User, Coach, Activite, Groupe } from "../classes";
+import { Modal } from "./Modal";
+
+type CreateActiciteProps = {
+    returnActivite: (activite:Activite|null) => void
+}
+
+
+export function CreateActivite({ returnActivite }: CreateActiciteProps){
+
+    const [activities, setActivities] = useState<Activite[]>([]);
+    const [activiteNom, setActiviteNom] = useState("");
+    const [activiteTheme, setActiviteTheme] = useState("");
+    const [activiteDuree, setActiviteDuree] = useState(0);
+
+    function addAcitivte(){
+        if (!activiteNom) return;
+
+        const newActivite = new Activite();
+        newActivite.nom= activiteNom;
+        newActivite.theme=activiteTheme;
+        newActivite.duree= activiteDuree;
+        newActivite.data= new Map<string,string>();
+        setActivities([...activities, newActivite]);
+
+        setActiviteNom("");
+        setActiviteTheme("");
+        setActiviteDuree(0);
+
+        returnActivite(newActivite);
+    }
+
+    function cancel(){
+        returnActivite(null);
+    }
+
+
+
+    return (
+        <Modal isOpen={true} onClose={() => cancel()}>
+            <div className="edt_activite_modal">
+                <h2>Nouvelle Activité :</h2>
+                <div>
+                    Nom de l'activité:
+                </div>
+                <div>
+                    <input type="text" value={activiteNom} onChange={e => setActiviteNom(e.target.value)} />
+                </div>
+                <div>
+                    Theme:
+                </div>
+                <div>
+                    <input type="text" value={activiteTheme} onChange={e => setActiviteTheme(e.target.value)} />
+                </div>
+                <div>
+                    Duree (minutes):
+                </div>
+                <div>
+                    <input type="number" value={activiteDuree} onChange={e => setActiviteDuree(Number(e.target.value))} />
+                </div>
+                <button type="button" onClick={()=>addAcitivte()}>Ajouter l'activite</button>
+                <button type="button" onClick={()=>cancel()}>Annuler</button>
+
+                <ul>
+                    {activities.map((act, idx) => (
+                        <li key={idx}>{act.nom} - {act.theme} ({act.duree} min)</li>
+                    ))}
+                </ul>
+            </div>
+        </Modal>
+    );
+};
+
+export default CreateActivite;