feat: add category registration system to club and user

This commit is contained in:
2026-01-20 21:49:10 +01:00
parent a5d3973394
commit b419e2f58d
6 changed files with 64 additions and 36 deletions

View File

@@ -1,14 +0,0 @@
import Keycloak from "keycloak-js";
const vite_url = import.meta.env.VITE_URL;
const client_id = import.meta.env.VITE_CLIENT_ID;
const keycloak = new Keycloak({
url: `${vite_url}/auth-api`,
realm: "safca",
clientId: client_id,
});
export default keycloak;

View File

@@ -132,7 +132,8 @@ function QuickAdd({sendRegister, source, data2, error2}) {
<label htmlFor="inputState2" className="form-label align-self-center" style={{margin: "0 0.5em 0 0"}}>
{t('catégorieàAjouter')}<br/> <small>({t('siDisponiblePourLaCatégorieDages')})</small>
</label>
<CategoriesList error2={error2} availableCats={data2} categories={categories} setCategories={setCategories_}/>
<CategoriesList error2={error2} availableCats={data2.sort((a, b) => a.name.localeCompare(b.name))} categories={categories}
setCategories={setCategories_}/>
</div>
<div className="row">

View File

@@ -3,9 +3,9 @@ import {useLoadingSwitcher} from "../../hooks/useLoading.jsx";
import {useFetch} from "../../hooks/useFetch.js";
import {AxiosError} from "../../components/AxiosError.jsx";
import {useAuth} from "../../hooks/useAuth.jsx";
import {apiAxios, getToastMessage, isClubAdmin} from "../../utils/Tools.js";
import {apiAxios, applyOverCategory, getCatName, getToastMessage, isClubAdmin} from "../../utils/Tools.js";
import {ThreeDots} from "react-loader-spinner";
import {useEffect, useState} from "react";
import React, {useEffect, useState} from "react";
import {toast} from "react-toastify";
import {useTranslation} from "react-i18next";
import i18n from "i18next";
@@ -97,15 +97,18 @@ function SelfRegister({data2}) {
const {id} = useParams()
const setLoading = useLoadingSwitcher()
const {data, refresh, error} = useFetch(`/competition/${id}/register/user`, setLoading, 1)
const {data: data3, error: error2} = useFetch(`/competition/${id}/categories`, setLoading, 1)
const {t} = useTranslation();
const [weight, setWeight] = useState("")
const [cat, setCat] = useState(0)
const [categories, setCategories] = useState([])
useEffect(() => {
if (data && data.length > 0) {
setWeight(data[0].weight || "")
setCat(data[0].overCategory || 0)
setCategories(data[0].categoriesInscrites || [])
}
}, [data]);
@@ -129,14 +132,27 @@ function SelfRegister({data2}) {
const handleSubmit = () => {
sendSubmit({
licence: 0, fname: "", lname: "", weight: weight, overCategory: cat, lockEdit: false, id: null
licence: 0, fname: "", lname: "", weight: weight, overCategory: cat, lockEdit: false, id: null, categoriesInscrites: categories
})
}
const setCategories_ = (e, catId) => {
if (e.target.checked) {
if (!categories.includes(catId)) {
setCategories([...categories, catId])
}
} else {
setCategories(categories.filter(c => c !== catId))
}
}
const currenCat = data?.length > 0 && data[0]?.categorie !== "" ? applyOverCategory(data[0]?.categorie, cat) : "";
const availableCats = data3 ? (currenCat !== "" ? data3.filter(c => c.categories.includes(currenCat)) : data3).sort((a, b) => a.name.localeCompare(b.name)) : []
return <>
{data
? data.length > 0
? <div style={{textAlign: "right", maxWidth: "20em"}}>
? <div style={{textAlign: "right", maxWidth: "30em"}}>
<h4 style={{textAlign: "left"}}>{t('comp.monInscription')}</h4>
<div className="input-group mb-3">
<span className="input-group-text" id="weight">{t("comp.modal.poids")}</span>
@@ -144,7 +160,7 @@ function SelfRegister({data2}) {
name="weight" aria-describedby="weight" value={weight} onChange={e => setWeight(e.target.value)}/>
</div>
<div style={{textAlign: "left"}}>{t('comp.catégorieNormalisée')}: {data[0].categorie}</div>
<div style={{textAlign: "left"}}>{t('comp.catégorieNormalisée')}: {getCatName(data[0].categorie)}</div>
<div className="input-group mb-3">
<span className="input-group-text" id="categorie">{t("comp.modal.surclassement")}</span>
<select className="form-select" aria-label="categorie" name="categorie" value={cat} disabled={disabled}
@@ -155,6 +171,25 @@ function SelfRegister({data2}) {
</select>
</div>
<div className="d-flex flex-wrap mb-3">
<label htmlFor="inputState2" className="form-label align-self-center" style={{margin: "0 0.5em 0 0"}}>
{t('catégorie')} :
</label>
{error2 ? <AxiosError error={error2}/> : <>
{availableCats && availableCats.length === 0 && <div>{t('aucuneCatégorieDisponible')}</div>}
{availableCats && availableCats.map((cat, index) =>
<div key={cat.id} className="input-group"
style={{display: "contents"}}>
<div className="input-group-text">
<input className="form-check-input mt-0" type="checkbox"
id={"categoriesInput" + index} checked={categories.includes(cat.id)} aria-label={cat.name}
onChange={e => setCategories_(e, cat.id)}/>
<label style={{marginLeft: "0.5em"}} htmlFor={"categoriesInput" + index}>{cat.name}</label>
</div>
</div>)}
</>}
</div>
<div>
<button type="button" className="btn btn-danger" disabled={disabled} style={{marginRight: "0.5em"}}
onClick={handleUnregister}>{t('button.seDésinscrire')}