106 lines
3.4 KiB
TypeScript
106 lines
3.4 KiB
TypeScript
import { useState, useEffect } from "react";
|
|
import { Session, User, Coach, Activite, Groupe } from "../classes";
|
|
import { useLocalData } from "../context/useLocalData";
|
|
|
|
|
|
export const CreateSession = () => {
|
|
const {user} = useLocalData()
|
|
const [name,setName] = useState("");
|
|
const [groupe, setGroupe] = useState<Groupe>("");
|
|
const [creneau, setCreneau] = useState("");
|
|
const [duree, setDuree] = useState<number>(0);
|
|
const [activities, setActivities] = useState<Activite[]>([]);
|
|
const [activiteNom, setActiviteNom] = useState("");
|
|
const [activiteTheme, setActiviteTheme] = useState("");
|
|
const [activiteDuree, setActiviteDuree] = useState(0);
|
|
const [isRecurent, setIsRecurent] = useState(false);
|
|
|
|
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);
|
|
}
|
|
|
|
async function handleCreateSession(){
|
|
const newSession = new Session();
|
|
newSession.name = name;
|
|
newSession.activites= activities;
|
|
newSession.groupe = groupe;
|
|
newSession.creneau = new Date(creneau);
|
|
newSession.duree= duree;
|
|
newSession.isRecurrent= isRecurent;
|
|
newSession.coach= user as Coach;
|
|
newSession.athletes= [];
|
|
newSession.activites= activities;
|
|
|
|
try{
|
|
//reset
|
|
setName("");
|
|
setGroupe("");
|
|
setCreneau("");
|
|
setDuree(0);
|
|
setIsRecurent(false);
|
|
setActivities([]);
|
|
}catch (err){
|
|
console.error(err)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="ent">
|
|
<h2>Activité</h2>
|
|
<label>
|
|
Name:
|
|
<input type="text" value={activiteNom} onChange={e => setActiviteNom(e.target.value)} />
|
|
</label>
|
|
<label>
|
|
Theme:
|
|
<input type="text" value={activiteTheme} onChange={e => setActiviteTheme(e.target.value)} />
|
|
</label>
|
|
<label>
|
|
Duree (minutes):
|
|
<input type="number" value={activiteDuree} onChange={e => setActiviteDuree(Number(e.target.value))} />
|
|
</label>
|
|
<button type="button" onClick={addAcitivte}>Add Activite</button>
|
|
|
|
<ul>
|
|
{activities.map((act, idx) => (
|
|
<li key={idx}>{act.nom} - {act.theme} ({act.duree} min)</li>
|
|
))}
|
|
</ul>
|
|
<h2>Create Session</h2>
|
|
<label>
|
|
Name:
|
|
<input type="text" value={name} onChange={e => setName(e.target.value)} />
|
|
</label>
|
|
<label>
|
|
Groupe:
|
|
</label>
|
|
<label>
|
|
Creneau:
|
|
<input type="datetime-local" value={creneau} onChange={e => setCreneau(e.target.value)} />
|
|
</label>
|
|
<label>
|
|
Duree (minutes):
|
|
<input type="number" value={duree} onChange={e => setDuree(Number(e.target.value))} />
|
|
</label>
|
|
<label>
|
|
Recurrent:
|
|
<input type="checkbox" checked={isRecurent} onChange={e => setIsRecurent(e.target.checked)} />
|
|
</label>
|
|
|
|
<button type="button" onClick={handleCreateSession}>Create Session</button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CreateSession; |