Files

T

Andrej Spielmann 3fefc550fe Initial commit: WrestleDesk full project

- Django backend with DRF (clubs, wrestlers, trainers, exercises, templates, trainings, homework, locations, leistungstest)
- Next.js 16 frontend with React, Shadcn UI, Tailwind
- JWT authentication
- Full CRUD for all entities
- Calendar view for trainings
- Homework management system
- Leistungstest tracking

2026-03-26 13:24:57 +01:00

2.3 KiB

Raw Blame History

Leistungstest Ergebnisse — Neue Ansicht

Overview

Der "ergebnisse" Tab im Leistungstest zeigt ab sofort Ergebnisse in einer modernen Karten-Ansicht mit Toggle-Option zwischen Karten und Tabelle.

Design

Karten-Ansicht (Default)

Pro Ergebnis eine übersichtliche Karte
Header: Ringer-Avatar (initialbasiert), Name, Datum, Vorlage
Header-Right: Score (%) in groß (farbcodiert: grün ≥100%, gelb ≥80%, rot <80%), Gesamtzeit
Body: Liste aller Übungen mit Soll/Reps, elapsed_seconds, Done-Check
Footer: Bewertung (Sterne), Bearbeiten/Löschen Buttons

Toggle

Toggle-Button-Leiste oben rechts: "⊞ Tabelle" | "📋 Karten"
Aktive Ansicht ist hervorgehoben (weißer Hintergrund, Schatten)
Auswahl wird in User-Preferences gespeichert (optional, falls bereits Preferences-System existiert)

Farbcodierung

Score ≥100%: Grün (#16a34a)
Score ≥80%: Gelb (#ca8a04)
Score <80%: Rot (#dc2626)

Filter

Vorlage-Dropdown (alle Vorlagen oder spezifische)
Ringer-Dropdown (optional)
Sortierung: Neueste zuerst (default)

Detail-Ansicht pro Ergebnis

Alle Übungen mit:
- Übungsname
- Soll: targetReps (z.B. "3×10")
- Zeit: elapsedSeconds formatiert als m:ss
- Status: ✓ wenn done

Komponenten

ResultsCardsView

Rendering aller Ergebnis-Karten
Filter-Logik
Toggle-State

ResultCard

Einzelne Ergebniskarte
Avatar mit Initial des Ringers
Farbcodierter Score
Übungsliste mit Zeiten
Aktions-Buttons

API

Ergebnisse werden via apiFetch("/leistungstest/results/") geladen (existierendes API).

Response-Shape:

{
  id: number
  template: number
  template_name: string
  wrestler: number
  wrestler_name: string
  total_time_seconds: number
  rating: number
  score_percent: number
  completed_at: string
  items: Array<{
    id: number
    exercise: number
    exercise_name: string
    target_reps: number
    actual_reps: number
    elapsed_seconds: number
    order: number
  }>
}

Backend

Keine Änderungen notwendig — bestehendes API wird verwendet.

Implementierung

Neuer State resultViewMode: "cards" | "table" (default: "cards")
ResultsCardsView Component mit Karten-Logic
Toggle-Buttons im CardHeader
Ergebnis-Karten mit allen Details
Filter funktionieren wie bisher
Pagination bleibt bestehen

2.3 KiB Raw Blame History Unescape Escape