53 lines
1.8 KiB
TypeScript
53 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import { Team, ThirdPlaceRow } from "@/lib/types";
|
|
|
|
export default function ThirdPlace({
|
|
rows, teams,
|
|
}: { rows: ThirdPlaceRow[]; teams: Team[] }) {
|
|
const name = (id: string) => teams.find((t) => t.id === id)?.name ?? id;
|
|
|
|
return (
|
|
<div className="third-wrap">
|
|
<p className="notice" style={{ marginBottom: 16 }}>
|
|
Acht der zwölf Gruppendritten erreichen die Runde der letzten 32. Gewertet wird
|
|
gruppenübergreifend nach Punkten, Tordifferenz und Toren — der Direktvergleich
|
|
entfällt, weil diese Teams nie gegeneinander gespielt haben. Die Trennlinie markiert
|
|
den Schnitt zwischen Platz 8 und 9.
|
|
</p>
|
|
<table className="third-table">
|
|
<thead>
|
|
<tr>
|
|
<th>#</th><th>Gruppe</th><th>Team</th>
|
|
<th>Sp</th><th>Pkt</th><th>±</th><th>Tore</th><th>Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rows.map((r, i) => {
|
|
const isCut = i === 8; // erste nicht-qualifizierte Zeile
|
|
return (
|
|
<tr
|
|
key={r.teamId}
|
|
className={`third-row ${r.qualifies ? "qual" : ""} ${isCut ? "cut" : ""}`}
|
|
>
|
|
<td>{r.overallRank}</td>
|
|
<td>{r.group}</td>
|
|
<td style={{ fontWeight: 600 }}>{name(r.teamId)}</td>
|
|
<td>{r.played}</td>
|
|
<td className="pts">{r.points}</td>
|
|
<td>{r.goalDiff > 0 ? `+${r.goalDiff}` : r.goalDiff}</td>
|
|
<td>{r.goalsFor}:{r.goalsAgainst}</td>
|
|
<td>
|
|
<span className={`qual-badge ${r.qualifies ? "yes" : "no"}`}>
|
|
{r.qualifies ? "weiter" : "raus"}
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
}
|