feat(ui): introduce PferdReiterEingabe, NennungenTabelle, and NennungsMaske components

- Added `PferdReiterEingabe` for horse and rider selection with search functionality and keyboard navigation. - Implemented `NennungenTabelle` to display filtered registrations based on selected horse or rider. - Introduced `NennungsMaske` to combine search, table, and competition views for streamlined user interaction. - Extended types with `Veranstalter` interface and mock data for better context and integration. - Documented ÖTO-compliant tournament structure for frontend reference. Signed-off-by: Stefan Mogeritsch <stefan.mo.co@gmail.com>
2026-03-24 13:49:21 +01:00
parent 5a545182f2
commit 7702574904
105 changed files with 23088 additions and 0 deletions
@@ -0,0 +1,308 @@
+# Turnierverwaltungs-Anwendung - Projekt-Dokumentation
+
+## 📋 Projekt-Übersicht
+
+Eine professionelle Desktop-Turnierverwaltungs-Anwendung für den Pferdesport, entwickelt mit React, TypeScript und
+Material Design 3 (Material-UI).
+
+### Hauptziel
+
+Verwaltung der kompletten Hierarchie: **Veranstalter (Vereine)** → **Veranstaltungen** → **Turniere** → **Bewerbe**
+
+---
+
+## 🎯 Zielgruppe
+
+- Turnier-Veranstalter
+- Turnier-Organisatoren
+- Turnier-Sekretariat
+- Rechnungsstellen
+
+---
+
+## 🏗️ Projekt-Status
+
+**Version:** Prototyp v1.0  
+**Status:** Entwicklungsphase  
+**Letztes Update:** 2026-03-24
+
+### Implementierte Features ✅
+
+#### 1. **Authentication System**
+
+- Login-Maske mit Demo-Credentials
+  - User: `admin`
+  - Passwort: `Admin#1234`
+
+#### 2. **Veranstalter-Verwaltung**
+
+- Vollständige CRUD-Operationen
+- Veranstalter-Übersicht mit Tabelle
+- Veranstalter-Auswahl bei Veranstaltungs-Erstellung
+
+#### 3. **Veranstaltungs-Verwaltung**
+
+- Veranstaltung - Übersicht mit Turnieren
+- Turnier-Karten mit Status-Badges
+- "Neues Turnier anlegen"-Workflow
+
+#### 4. **Turnier-Verwaltung (8 Tabs)**
+
+- **Tab 1: Stammdaten**
+  - Turnier-Konfiguration (ZNS-Import, ÖTO/FEI-Typ)
+  - Turnier-Beschreibung (Titel/Sub-Titel)
+  - Sponsoren-Verwaltung (Name + Logo)
+
+- **Tab 2: Organisation**
+  - Zeitplan
+  - Kontakte & Verantwortliche
+  - Organisatorische Details
+
+- **Tab 3: Bewerbe**
+  - Bewerbs-Übersicht mit Tabelle
+  - CRUD-Operationen für Bewerbe
+  - Wichtigste Konfigurationsseite
+
+- **Tab 4: Artikel**
+  - Nennungs- und Startgebühren
+  - Stallungen & Boxen
+  - Zusatzleistungen
+  - Diverse Gebühren
+
+- **Tab 5: Abrechnung** ⭐
+  - Buchungstabelle (Soll/Haben/Saldo)
+  - Teilnehmer-Auswahl (Reiter/Pferd)
+  - Zahlungsarten (Bar, Scheck, Bankomat, Kreditkarte)
+  - Direktdruck (Saldo, Rechnung)
+  - Gebührenverwaltung
+
+- **Tab 6: Nennungen** ⭐
+  - Pferd & Reiter Suche mit Cross-Reference
+  - Nennungen-Tabelle (Reiter/Pferd/Bewerbe)
+  - Verkauf/Buchungen
+  - Bewerbsliste zum Nennen
+
+- **Tab 7: Startlisten**
+  - Platzhalter für Startlisten-Generierung
+
+- **Tab 8: Ergebnislisten**
+  - Platzhalter für Ergebnis-Erfassung
+
+---
+
+## 🛠️ Technologie-Stack
+
+### Frontend
+
+- **React** 18+ (Function Components, Hooks)
+- **TypeScript** (Type-Safety)
+- **React Router** v7 (Data Mode Pattern)
+- **Material-UI** v6 (Material Design 3)
+- **Tailwind CSS** v4 (Utility-First CSS)
+
+### Design System
+
+- **Primärfarbe:** Indigo (#3F51B5)
+- **Design-Sprache:** Material Design 3
+- **Layout:** Desktop-optimiert (1440px+)
+- **Schriftgrößen:** 10px - 13px (kompakt)
+
+### Build Tools
+
+- **Vite** (Build Tool)
+- **PNPM** (Package Manager)
+
+---
+
+## 📁 Projekt-Struktur
+
+```
+/src
+├── /app
+│   ├── App.tsx                    # Haupt-Komponente mit Router
+│   ├── routes.tsx                 # React Router Konfiguration
+│   │
+│   └── /components
+│       ├── Login.tsx              # Login-Maske
+│       ├── Dashboard.tsx          # Admin-Übersicht mit Veranstaltungen
+│       ├── VeranstalterVerwaltung.tsx
+│       ├── VeranstalterAuswahl.tsx
+│       ├── TurnierErstellen.tsx   # Veranstaltungs-Übersicht
+│       ├── TurnierAnsicht.tsx     # Turnier-Tabs
+│       │
+│       ├── NennungsMaske.tsx      # Desktop Nennungs-Maske
+│       ├── PferdReiterEingabe.tsx
+│       ├── NennungenTabelle.tsx
+│       ├── VerkaufBuchungen.tsx
+│       ├── Bewerbsliste.tsx
+│       │
+│       └── /turnier
+│           ├── StammdatenTab.tsx
+│           ├── OrganisationTab.tsx
+│           ├── BewerbeTab.tsx
+│           ├── ArtikelTab.tsx
+│           ├── AbrechnungTab.tsx      # NEU: Bar-Zahlungen
+│           ├── NennungenTab.tsx       # NEU: Wrapper
+│           ├── StartlistenTab.tsx
+│           └── ErgebnislistenTab.tsx
+│
+├── /styles
+│   ├── theme.css              # Tailwind Theme + CSS Variables
+│   └── fonts.css              # Font Imports
+│
+└── /imports                   # Figma-Assets (falls vorhanden)
+```
+
+---
+
+## 🔄 Daten-Hierarchie
+
+```
+Veranstalter (Verein)
+└── Veranstaltung (Event)
+    └── Turnier
+        ├── Stammdaten
+        ├── Organisation
+        ├── Bewerbe
+        │   └── Einzelne Bewerbe
+        ├── Artikel/Preisliste
+        ├── Abrechnung
+        │   └── Buchungen pro Teilnehmer
+        ├── Nennungen
+        │   ├── Reiter
+        │   ├── Pferd
+        │   └── Bewerbs-Nennungen
+        ├── Startlisten
+        └── Ergebnislisten
+```
+
+---
+
+## 🎨 Design-Prinzipien
+
+1. **Desktop-First:** Optimiert für 1440px+ Displays
+2. **Kompakt:** Kleine Schriftgrößen (10-11px), hohe Informationsdichte
+3. **Tastatur-optimiert:** Tab-Navigation, Shortcuts
+4. **Material Design 3:** Konsistente MUI-Komponenten
+5. **Indigo-Farbschema:** Primärfarbe #3F51B5
+6. **Responsive Tabs:** Flexible Tab-Struktur für verschiedene Workflows
+
+---
+
+## 🚀 Quick Start
+
+### Installation
+
+```bash
+pnpm install
+```
+
+### Entwicklung
+
+```bash
+pnpm dev
+```
+
+### Login
+
+- **Username:** admin
+- **Passwort:** Admin#1234
+
+---
+
+## 📖 Dokumentations-Übersicht
+
+Für jedes Team gibt es spezifische Dokumentationen:
+
+1. **[ARCHITECTURE.md](./ARCHITECTURE.md)** - Lead-Architekt
+2. **[BACKEND.md](./BACKEND.md)** - Backend Developer
+3. **[FRONTEND.md](./FRONTEND.md)** - Frontend Developer
+4. **[UI-UX.md](./UI-UX.md)** - UI/UX Designer
+
+---
+
+## 📝 Development Log
+
+### Session 2026-03-24: Abrechnung & Nennungen-Integration
+
+#### Implementiert:
+
+1. **Abrechnung-Tab (Tab 5)**
+  - Buchungstabelle mit Soll/Haben/Saldo
+  - Teilnehmer-Auswahl (Reiter/Pferd Dropdown)
+  - Zahlungsarten: Bar, Scheck (+30€), Bankomat, Kreditkarte
+  - Direkt-Druck: Saldo & Rechnung
+  - Aktions-Buttons: Aktualisieren, Übersicht, Tabelle Leeren
+  - Summenzeile mit Gesamt-Saldo
+  - Info-Box mit Hinweisen
+
+2. **Nennungen-Tab (Tab 6)**
+  - Integration der Desktop-Nennungs-Maske
+  - Pferd & Reiter Eingabe mit Cross-Reference
+  - Nennungen-Tabelle mit drei Tabs (Reiter/Pferd/Bewerbe)
+  - Verkauf/Buchungen Panel
+  - Bewerbsliste mit Doppelklick-Nennung
+  - Navigation Buttons: Startliste, Ergebnisse, Abrechnung
+
+3. **Tab-Struktur finalisiert:**
+  - Stammdaten → Organisation → Bewerbe → Artikel → **Abrechnung** → **Nennungen** → Startlisten → Ergebnislisten
+
+#### Workflow:
+
+```
+Admin - Verwaltung
+  → Neue Veranstaltung
+    → Veranstalter Auswahl
+      → Veranstalter-Übersicht
+        → Veranstaltung
+          → Turnier-Stammdaten
+            → 8 Turnier-Tabs
+```
+
+---
+
+## 🔮 Nächste Schritte
+
+### Backend-Integration
+
+- [ ] Supabase oder REST API Integration
+- [ ] Datenbank-Schema implementieren
+- [ ] CRUD-Operationen für alle Entitäten
+- [ ] Echtzeit-Updates für Nennungen
+- [ ] Zahlungs-Transaktionen persistieren
+
+### Frontend-Erweiterungen
+
+- [ ] Startlisten-Generierung implementieren
+- [ ] Ergebnislisten-Erfassung implementieren
+- [ ] Druck-Funktionen (PDF-Export)
+- [ ] Filter & Such-Funktionen optimieren
+- [ ] Excel-Export für Übersichten
+
+### UI/UX Verbesserungen
+
+- [ ] Drag & Drop für Startlisten
+- [ ] Keyboard Shortcuts dokumentieren
+- [ ] Loading States & Error Handling
+- [ ] Toast Notifications
+- [ ] Confirmation Dialogs
+
+---
+
+## 👥 Team-Kontakte
+
+- **Lead-Architekt:** [Name]
+- **Backend Developer:** [Name]
+- **Frontend Developer:** [Name]
+- **UI/UX Designer:** [Name]
+
+---
+
+## 📄 Lizenz
+
+[Lizenz-Information]
+
+---
+
+**Erstellt am:** 2026-03-24  
+**Zuletzt aktualisiert:** 2026-03-24