vuminh224/hackathon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ajout d'activité

Browse Source
This commit is contained in:
trochas
2026-01-07 18:00:39 +01:00
parent 7fdd9681dc
commit 153035cefa
9 changed files with 171 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
front_end/src/classes.tsx
View File

@@ -4,6 +4,7 @@ export class User{
id!: number;
nom!: String;
sessions: Session[] = []; //nb: Admin liaison non symétrique /!\
email!: String;
}
export class Admin extends User{

75
front_end/src/components/createActivite.tsx Normal file
View File

@@ -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;

5
front_end/src/components/edt.tsx
View File

@@ -42,10 +42,7 @@ export const EDT =() =>{
var newWeek: Session[] = []
user.sessions.forEach(session => {
if( session.isRecurrent ){
newWeek.push(session);
}
if(session.creneau >= date && session.creneau <= maxDate && !session.isRecurrent){
if((session.creneau >= date && session.creneau <= maxDate && !session.isRecurrent) || session.isRecurrent){
newWeek.push(session);
}
});

43
front_end/src/components/edt_session.tsx
View File

@@ -5,6 +5,7 @@ import './style/edt.css';
import { Modal } from './Modal';
import Loading from './loading';
import {delay} from "../requetes";
import CreateActivite from './createActivite';
type Props = {
@@ -13,21 +14,22 @@ type Props = {
function EdtSession({session}:Props){
const [open, setOpen] = useState<boolean>(false)
const [open, setOpen] = useState<boolean>(false);
const [open2, setOpen2] = useState<boolean>(false);
const [loading,setLoading] = useState<boolean>(false);
const [activites,setActivites] = useState<Activite[]>([]);
function handleOpen(): void {
setOpen(!open);
}
function handleDeleteActivite(): void {
session.activites.pop(); //TODO
function handleDeleteActivite(activite:Activite): void {
session.activites.splice(session.activites.indexOf(activite), 1);
setActivites([...session.activites])
}
function handleAddActivite(): void {
const newActivite = new Activite();
//TODO
session.activites.push(newActivite);
setOpen2(true)
}
async function updateActivites(){
@@ -45,13 +47,30 @@ function EdtSession({session}:Props){
}
},[open])
useEffect(() => {
if(!loading){
setActivites([...session.activites])
}
},[loading])
const sDate = session.creneau;
function returnActivite(activite: Activite|null){
if(activite!==null){
session.activites.push(activite);
setActivites([...session.activites])
}
setOpen2(false);
}
return(
<div>
<div className="edt_session" onClick={() => handleOpen()}>
<div className="edt_session_header">
<div className="edt_date">{hoursToString(sDate)}</div>
{!session.isRecurrent && <div className="edt_date"> recurrent</div>}
{session.isRecurrent && <div className="edt_date"> recurrent</div>}
</div>
<div>{session.name}</div>
</div>
@@ -64,16 +83,20 @@ function EdtSession({session}:Props){
<div>
Activités :
<div className="ent_activite_list">
{session.activites.map((activite,index)=>(
{activites.map((activite,index)=>(
<div>
{activite.nom}
<button className="deleteButton" onClick={() => handleDeleteActivite}>x</button>
<button className="deleteButton" onClick={() => handleDeleteActivite(activite)}>x</button>
</div>
))}
<button className="addButton" onClick={() => handleAddActivite}>+</button>
<button className="addButton" onClick={() => handleAddActivite()}>+</button>
{loading && <div className='edt_loading'><Loading/></div>}
</div>
</div>
{open2 &&
<CreateActivite returnActivite={(activite) => returnActivite(activite)}/>
}
</div>
</Modal>
}

13
front_end/src/components/login.tsx
View File

@@ -29,8 +29,19 @@ export const Login =() =>{
return(
<div>
<div>
Authenticated : {keycloak.authenticated ? 'oui' : 'non'}
Etat : {keycloak.authenticated ? 'connecté' : 'non connecté'}
</div>
{keycloak.authenticated &&
<div>
<div>
Keycloak ID : { keycloak.tokenParsed?.sub}
</div>
<div>
User nom : { user.nom}
</div>
</div>
}
<button onClick={() => handleLogin()}>
Se connecter
</button>

7
front_end/src/components/style/edt.css
View File

@@ -118,4 +118,11 @@
.addButton{
background-color: var(--tint5);
border-radius: 10px;
}
.edt_activite_modal{
background-color: var(--tint3);
padding: 10px;
border-radius: 20px;
position: relative;
}

12
front_end/src/components/test_api.tsx
View File

@@ -1,5 +1,6 @@
import { useKeycloak } from "@react-keycloak/web"
import { getCoachsAPI, getUsersAPI } from "../requetes"
import { getCoachsAPI, getUsersAPI, postAdmin } from "../requetes"
import { Admin } from "../classes";
function TestAPI(){
@@ -9,9 +10,18 @@ function TestAPI(){
getCoachsAPI();
}
function handleSendAdmin(): void {
const admin = new Admin;
admin.nom = "admin";
admin.email = "admin@gmail.com";
postAdmin(admin);
}
return(
<div style={{padding:30, backgroundColor:"#000000"}}>
<button onClick={()=>handleGetUsers()}>getUsers</button>
<button onClick={()=>handleSendAdmin()}>sendAdmin</button>
</div>
)
}

7
front_end/src/index.css
View File

@@ -64,4 +64,11 @@ code {
to {
transform: rotate(360deg);
}
}
input{
background-color: var(--tint2);
color: var(--test);
border-color: var(--tint5);
border-radius: 8px;
}

29
front_end/src/requetes.tsx
View File

@@ -1,5 +1,5 @@
import api from "./api";
import { Activite, Athlete, Coach, Session, User } from "./classes";
import { Activite, Admin, Athlete, Coach, Session, User } from "./classes";
//debug:
export function delay(ms: number): Promise<void> {
@@ -53,7 +53,7 @@ export async function updateActivitiesOfSessionAPI(session:Session){
export async function subscribeSessionAPI(user:User, session:Session):Promise<boolean>{
try {
await api.post(`/sessions/${session.id}/subscribe`, { userId: user.id });
await api.post(`/sessions/${session.id}/subscribe`);
return true;
} catch (error) {
console.error("Error subscribing to session:", error);
@@ -63,7 +63,7 @@ export async function subscribeSessionAPI(user:User, session:Session):Promise<bo
export async function unsubscribeSessionAPI(user:User, session:Session):Promise<boolean>{
try {
await api.post(`/session/${session.id}/unsubscribe`, { userId: user.id });
await api.post(`/session/${session.id}/unsubscribe`);
return true;
} catch (error) {
console.error("Error unsubscribing from session:", error);
@@ -104,8 +104,26 @@ export async function postActivityAPI(session: Session, activity: Activite){
}
}
export async function postUser(user: User):Promise<boolean>{
return true;
export async function postAthlete(athlete: Athlete):Promise<Athlete>{
try {
const response = await api.post<Athlete>("/athlete/create/",athlete);
console.log(response);
return response.data;
} catch (error) {
console.error("Error fetching coachs:", error);
throw error;
}
}
export async function postAdmin(athlete: Admin):Promise<Admin>{
try {
const response = await api.post<Admin>("/admin/create/",athlete);
console.log(response);
return response.data;
} catch (error) {
console.error("Error fetching coachs:", error);
throw error;
}
}
// SET /////////////////////////////////////////////////////////
@@ -142,6 +160,7 @@ export async function getUsersAPI(): Promise<User[]> {
export async function getCoachsAPI(): Promise<Coach[]> {
try {
const response = await api.get<Coach[]>("/coach/all");
console.log(response);
return response.data;
} catch (error) {
console.error("Error fetching coachs:", error);