fix: disable match filter on 1 zone cat + rename lice to zone

This commit is contained in:
Thibaut Valentin 2025-12-27 13:02:45 +01:00
parent 847674d62c
commit 2ccd2a9178
3 changed files with 18 additions and 14 deletions

View File

@ -98,7 +98,7 @@ function CategoryHeader({cat, setCatId}) {
<div className="col" style={{margin: "auto 0", textAlign: "center"}}> <div className="col" style={{margin: "auto 0", textAlign: "center"}}>
{cat && {cat &&
<div>Type: {(cat.type & 1) !== 0 ? "Poule" : ""}{cat.type === 3 ? " & " : ""}{(cat.type & 2) !== 0 ? "Tournois" : ""} | <div>Type: {(cat.type & 1) !== 0 ? "Poule" : ""}{cat.type === 3 ? " & " : ""}{(cat.type & 2) !== 0 ? "Tournois" : ""} |
Lice: {cat.liceName}</div>} Zone: {cat.liceName}</div>}
</div> </div>
<div className="col-auto"> <div className="col-auto">
<button className="btn btn-primary float-end" onClick={() => { <button className="btn btn-primary float-end" onClick={() => {
@ -128,7 +128,7 @@ function CategoryHeader({cat, setCatId}) {
function ModalContent({state, setCatId, setConfirm, confirmRef}) { function ModalContent({state, setCatId, setConfirm, confirmRef}) {
const [name, setName] = useState("") const [name, setName] = useState("")
const [lice, setLice] = useState("1") const [lice, setLice] = useState("A")
const [poule, setPoule] = useState(true) const [poule, setPoule] = useState(true)
const [tournoi, setTournoi] = useState(false) const [tournoi, setTournoi] = useState(false)
const [size, setSize] = useState(4) const [size, setSize] = useState(4)
@ -138,7 +138,7 @@ function ModalContent({state, setCatId, setConfirm, confirmRef}) {
useEffect(() => { useEffect(() => {
setName(state.name || ""); setName(state.name || "");
setLice(state.liceName || "1"); setLice(state.liceName || "A");
setPoule(((state.type || 1) & 1) !== 0); setPoule(((state.type || 1) & 1) !== 0);
setTournoi((state.type & 2) !== 0); setTournoi((state.type & 2) !== 0);
@ -164,7 +164,7 @@ function ModalContent({state, setCatId, setConfirm, confirmRef}) {
const regex = /^([^;]+;)*[^;]+$/; const regex = /^([^;]+;)*[^;]+$/;
if (regex.test(lice.trim()) === false) { if (regex.test(lice.trim()) === false) {
toast.error("Le format du nom des lices est invalide. Veuillez séparer les noms par des ';'."); toast.error("Le format du nom des zones de combat est invalide. Veuillez séparer les noms par des ';'.");
return; return;
} }
@ -311,8 +311,8 @@ function ModalContent({state, setCatId, setConfirm, confirmRef}) {
</div> </div>
<div className="mb-3"> <div className="mb-3">
<label htmlFor="liceInput1" className="form-label">Nom des lices <small>(séparée par des ';')</small></label> <label htmlFor="liceInput1" className="form-label">Nom des zones de combat <small>(séparée par des ';')</small></label>
<input type="text" className="form-control" id="liceInput1" placeholder="1;2" name="lice" value={lice} <input type="text" className="form-control" id="liceInput1" placeholder="A;B" name="zone de combat" value={lice}
onChange={e => setLice(e.target.value)}/> onChange={e => setLice(e.target.value)}/>
</div> </div>

View File

@ -173,6 +173,10 @@ function MatchList({matches, cat, menuActions}) {
.map(m => ({...m, win: win(m.scores)})) .map(m => ({...m, win: win(m.scores)}))
const firstIndex = marches2.findLastIndex(m => m.poule === '-') + 1; const firstIndex = marches2.findLastIndex(m => m.poule === '-') + 1;
const isActiveMatch = (index) => {
return liceName.length === 1 || (liceName[(index - firstIndex) % liceName.length] === lice)
}
const match = matches.find(m => m.id === activeMatch) const match = matches.find(m => m.id === activeMatch)
useEffect(() => { useEffect(() => {
if (!match) { if (!match) {
@ -183,7 +187,7 @@ function MatchList({matches, cat, menuActions}) {
payload: { payload: {
c1: match.c1, c1: match.c1,
c2: match.c2, c2: match.c2,
next: marches2.filter((m, index) => !m.end && liceName[(index - firstIndex) % liceName.length] === lice && m.id !== activeMatch).map(m => ({ next: marches2.filter((m, index) => !m.end && isActiveMatch(index) && m.id !== activeMatch).map(m => ({
c1: m.c1, c1: m.c1,
c2: m.c2 c2: m.c2
})) }))
@ -198,7 +202,7 @@ function MatchList({matches, cat, menuActions}) {
useEffect(() => { useEffect(() => {
if (match && match.poule !== lice) if (match && match.poule !== lice)
setActiveMatch(marches2.find((m, index) => !m.end && liceName[(index - firstIndex) % liceName.length] === lice)?.id) setActiveMatch(marches2.find((m, index) => !m.end && isActiveMatch(index))?.id)
}, [lice]); }, [lice]);
useEffect(() => { useEffect(() => {
@ -207,12 +211,12 @@ function MatchList({matches, cat, menuActions}) {
if (marches2.some(m => m.id === activeMatch)) if (marches2.some(m => m.id === activeMatch))
return; return;
setActiveMatch(marches2.find((m, index) => !m.end && liceName[(index - firstIndex) % liceName.length] === lice)?.id); setActiveMatch(marches2.find((m, index) => !m.end && isActiveMatch(index))?.id);
}, [matches]) }, [matches])
return <> return <>
{liceName.length > 1 && {liceName.length > 1 &&
<div className="input-group" style={{maxWidth: "10em", marginTop: "0.5em"}}> <div className="input-group" style={{maxWidth: "15em", marginTop: "0.5em"}}>
<label className="input-group-text" htmlFor="selectLice">Lice</label> <label className="input-group-text" htmlFor="selectLice">Zone de combat</label>
<select className="form-select" id="selectLice" value={lice} onChange={e => { <select className="form-select" id="selectLice" value={lice} onChange={e => {
setLice(e.target.value); setLice(e.target.value);
localStorage.setItem("cm_lice", e.target.value); localStorage.setItem("cm_lice", e.target.value);
@ -228,7 +232,7 @@ function MatchList({matches, cat, menuActions}) {
<table className="table table-striped table-hover"> <table className="table table-striped table-hover">
<thead> <thead>
<tr> <tr>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">L</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">Z</th>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">P</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">P</th>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">N°</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">N°</th>
<th style={{textAlign: "center"}} scope="col"></th> <th style={{textAlign: "center"}} scope="col"></th>
@ -240,7 +244,7 @@ function MatchList({matches, cat, menuActions}) {
<tbody className="table-group-divider"> <tbody className="table-group-divider">
{marches2.map((m, index) => ( {marches2.map((m, index) => (
<tr key={m.id} <tr key={m.id}
className={m.id === activeMatch ? "table-info" : (liceName[(index - firstIndex) % liceName.length] === lice ? "" : "table-warning")} className={m.id === activeMatch ? "table-info" : (isActiveMatch(index) ? "" : "table-warning")}
onClick={() => setActiveMatch(m.id)}> onClick={() => setActiveMatch(m.id)}>
<td style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}}> <td style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}}>
{liceName[(index - firstIndex) % liceName.length]}</td> {liceName[(index - firstIndex) % liceName.length]}</td>

View File

@ -554,7 +554,7 @@ function MatchList({matches, cat, groups, reducer}) {
<tr> <tr>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">N°</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">N°</th>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">Poule</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">Poule</th>
<th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">Lice</th> <th style={{textAlign: "center", paddingLeft: "0.2em", paddingRight: "0.2em"}} scope="col">Zone</th>
<th style={{textAlign: "center"}} scope="col"></th> <th style={{textAlign: "center"}} scope="col"></th>
<th style={{textAlign: "center"}} scope="col">Rouge</th> <th style={{textAlign: "center"}} scope="col">Rouge</th>
<th style={{textAlign: "center"}} scope="col">Blue</th> <th style={{textAlign: "center"}} scope="col">Blue</th>