MS-FE-4: Formular UI umsetzen #104

Closed
opened 2026-06-23 23:03:56 +02:00 by niboer · 2 comments
Owner

Aufgaben

Backend-Endpunkte sind vollstaendig implementiert (MS-BE-API-3, #120-#122, geschlossen). Das Frontend baut auf dem bestehenden Event-Detail (MS-FE-1, #101) und der Self-Service-Seite (MS-FE-1) auf.

Umsetzungsplan (Stand 2026-06-28)

# Commit Inhalt Tests Status
1 chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert npm run generate:api, Typen auf Vollstaendigkeit prüfen Bestehende Tests gruen offen
2 feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab Neue FormEditor.svelte-Komponente, Tab "Formular" im Event-Detail, Felder-Hinzufuegen/Loeschen/Umordnen, "Aus Vorlage laden" Load: formDefinition+templates; Action: updateFormDefinition; Page: Editor-UI offen
3 feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe persons/[personId] erweitert: Draft laden/speichern (PUT form-draft), Final absenden (PUT form-final), Override-Indikator Load: formDraft; Action: saveDraft, submitFinal; Page: Draft-UI offen
4 feat(frontend): Formular-Antworten fuer Organisator anzeigen und ueberschreiben Tab "Antworten" im Event-Detail, dynamische Antwort-Tabelle, Override-Modal mit Aenderungsgrund, Override-Indikator ("!!") Load: guests+formFinal; Action: overrideForm; Page: Antworten-Tabelle offen
5 feat(frontend): Formular-Vorlagen CRUD-Seite (closes #104) /app/templates mit Liste, CRUD-Actions, wiederverwendet FormEditor-Komponente, Sidebar-Link Load: templates; Action: create/update/delete; Page: Template-Liste+Editor offen

Details im Umsetzungsplan-Kommentar.

Abhaengigkeiten und Entscheidungen

  • Kein neues DB-Schema oder API-Endpunkt: Alle benoetigten APIs sind in MS-BE-API-3 implementiert
  • i18n wird nicht in MS-FE-4 implementiert (gehoert zu MS-FE-6 #106)
  • Deutsche UI-Texte werden hartcodiert (analog bestehender Seiten)
  • Up/Down-Buttons statt Drag-and-Drop fuer Feld-Reihenfolge (siehe #132 fuer DnD-Enhancement in MS-REST)
  • Formular-Editor wird als wiederverwendbare Komponente in Commit 2 ausgelagert und in Commit 5 fuer Templates wiederverwendet
## Aufgaben Backend-Endpunkte sind vollstaendig implementiert (MS-BE-API-3, #120-#122, geschlossen). Das Frontend baut auf dem bestehenden Event-Detail (MS-FE-1, #101) und der Self-Service-Seite (MS-FE-1) auf. ### Umsetzungsplan (Stand 2026-06-28) | # | Commit | Inhalt | Tests | Status | |---|--------|--------|-------|--------| | 1 | `chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert` | `npm run generate:api`, Typen auf Vollstaendigkeit prüfen | Bestehende Tests gruen | offen | | 2 | `feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab` | Neue `FormEditor.svelte`-Komponente, Tab "Formular" im Event-Detail, Felder-Hinzufuegen/Loeschen/Umordnen, "Aus Vorlage laden" | Load: formDefinition+templates; Action: updateFormDefinition; Page: Editor-UI | offen | | 3 | `feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe` | persons/[personId] erweitert: Draft laden/speichern (PUT form-draft), Final absenden (PUT form-final), Override-Indikator | Load: formDraft; Action: saveDraft, submitFinal; Page: Draft-UI | offen | | 4 | `feat(frontend): Formular-Antworten fuer Organisator anzeigen und ueberschreiben` | Tab "Antworten" im Event-Detail, dynamische Antwort-Tabelle, Override-Modal mit Aenderungsgrund, Override-Indikator ("!!") | Load: guests+formFinal; Action: overrideForm; Page: Antworten-Tabelle | offen | | 5 | `feat(frontend): Formular-Vorlagen CRUD-Seite (closes #104)` | `/app/templates` mit Liste, CRUD-Actions, wiederverwendet FormEditor-Komponente, Sidebar-Link | Load: templates; Action: create/update/delete; Page: Template-Liste+Editor | offen | Details im [Umsetzungsplan-Kommentar](https://git.gs-woa.hopto.org/niboer/FamilienFeierPlaner/issues/104#issuecomment-1105). ### Abhaengigkeiten und Entscheidungen - **Kein neues DB-Schema oder API-Endpunkt:** Alle benoetigten APIs sind in MS-BE-API-3 implementiert - **i18n wird nicht in MS-FE-4 implementiert** (gehoert zu MS-FE-6 #106) - **Deutsche UI-Texte werden hartcodiert** (analog bestehender Seiten) - **Up/Down-Buttons statt Drag-and-Drop** fuer Feld-Reihenfolge (siehe #132 fuer DnD-Enhancement in MS-REST) - **Formular-Editor wird als wiederverwendbare Komponente** in Commit 2 ausgelagert und in Commit 5 fuer Templates wiederverwendet
Author
Owner

Umsetzungsplan (Stand 2026-06-28)

Backend-Voraussetzungen

Saemtliche Backend-Endpunkte sind bereits implementiert (MS-BE-API-3, #120-#122):

  • GET/PUT /api/v1/events/{id}/form — Formular-Definition lesen/schreiben
  • GET/PUT /api/v1/events/{id}/guests/{pid}/form-draft — Haushalts-Draft lesen/speichern
  • PUT /api/v1/events/{id}/guests/{pid}/form-final — Finale Antwort absenden
  • PUT /api/v1/events/{id}/guests/{pid}/form-override — Organisator-Override mit Grund
  • GET /api/v1/templates — Vorlagen-Liste
  • POST /api/v1/templates — Vorlage anlegen
  • GET/PUT/DELETE /api/v1/templates/{id} — Vorlagen-Detail

Kein neues DB-Schema oder API-Endpunkt noetig. Orval-Typen sind bereits vorhanden (FormDraftRequest, FormFinalRequest, FormOverrideRequest, FormDefinitionRequest, Template, CreateTemplate, UpdateTemplate).

Bereits erledigt (MS-FE-1 #101)

  • Event-Detail mit Tabs (Details, Gaesteliste, Zahlungsabgleich)
  • persons/[personId] Self-Service-Seite mit RSVP und einfacher Formular-Feld-Anzeige
  • Formular-Felder werden aus formDefinition gerendert (text/select/date)

Schritt-fuer-Schritt-Plan

Commit 1: chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert

  • npm run generate:api ausfuehren
  • generated.ts auf Vollstaendigkeit pruefen (FormDraftRequest, FormFinalRequest, FormOverrideRequest, FormDefinitionRequest, Template, CreateTemplate, UpdateTemplate, GetFormDraft200, GetFormDefinition200)
  • Existierende Tests: npm run test gruen
  • Keine neuen Tests (nur Regeneration)

Commit 2: feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab

Neue Komponente: $lib/components/form-editor.svelte

  • Props: formDefinition (initiales Array), templates (fuer "Aus Vorlage laden")
  • Events/Actions: onSave(formDefinition) — ruft PUT auf
  • Editor-UI:
    • Liste vorhandener Felder mit:
      • label (Text-Input, required)
      • type (Select: text, number, select, date)
      • required (Checkbox)
      • options (Textarea, nur bei type=select, komma-getrennt)
      • Up-Button (nach oben verschieben)
      • Down-Button (nach unten verschieben)
      • Loeschen-Button
    • "Feld hinzufuegen"-Button (haengt neues Feld an)
    • "Aus Vorlage laden"-Dropdown (listet templates, ersetzt formDefinition)
    • "Speichern"-Button (emittiert onSave)

+page.server.ts Aenderungen (events/[eventId]):

  • Load: zusaetzlich /api/v1/templates laden → templates: Template[]
  • Neue Action updateFormDefinition:
    • Validiert: formDefinition muss Array sein
    • Sendet PUT /api/v1/events/{eventId}/form mit { formDefinition }
    • Gibt 400 bei ungueltigen Daten zurueck

+page.svelte Aenderungen:

  • Neuer Tab "Formular" mit switchTab('form')
  • FormEditor-Komponente mit formDefinition und templates
  • Sichtbarkeit: nur im planning-Status oder fuer Organisator/Event-Admin

events.test.ts:

  • Load-Test: templates werden geladen
  • Load-Test: formDefinition in event wird geladen
  • Action-Test: updateFormDefinition mit gueltigen/ungueltigen Daten
  • Page-Test: "Formular"-Tab existiert, FormEditor-Komponente importiert, Felder-UI

Commit 3: feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe

+page.server.ts Aenderungen (persons/[personId]):

  • Load: invitations laden (bestehend), zusaetzlich pro Invitation pruefen ob formDefinition vorhanden
  • Zusaetzlicher API-Call: GET /api/v1/events/{eventId}/guests/{personId}/form-draft (fuer erste Invitation mit formDefinition)
  • Neue Actions:
    • saveDraft: Validiert formDraft-Objekt, sendet PUT /events/{id}/guests/{pid}/form-draft
    • submitFinal: Validiert formFinal-Objekt, sendet PUT /events/{id}/guests/{pid}/form-final

+page.svelte Aenderungen:

  • Wenn Invitation formDefinition enthaelt und Status invited:
    • Formular-Felder rendern (bestehender Code wird erweitert)
    • Feldwerte aus formDraft vorausfuellen (falls vorhanden)
    • "Zwischenspeichern"-Button (ruft saveDraft-Action auf)
    • "Endgueltig absenden"-Button (ruft submitFinal-Action auf)
  • Nach Absenden: Formular gesperrt, Status "Zugesagt am ..."
  • Wenn formOverride vorhanden: "!!"-Indikator neben geaenderten Feldern
  • Haushalts-Hinweis: "Dieser Draft wird mit Ihrem Haushalt geteilt"

self-service.test.ts:

  • Load-Test: formDraft wird geladen
  • Action-Test: saveDraft mit gueltigen Daten
  • Action-Test: submitFinal setzt respondedAt
  • Page-Test: Draft-Formular angezeigt, Save/Submit-Buttons, Override-Indikator

Commit 4: feat(frontend): Formular-Antworten fuer Organisator anzeigen und ueberschreiben

+page.server.ts Aenderungen (events/[eventId]):

  • Load im answers-Tab: Gaesteliste laden, zusaetzlich formFinal und formOverride pro Guest mitgeben
  • Neue Action overrideForm:
    • Validiert: personId, formOverride (object), overrideReason (string, min 3 Zeichen)
    • Sendet PUT /api/v1/events/{eventId}/guests/{personId}/form-override

+page.svelte Aenderungen:

  • Neuer Tab "Antworten" mit switchTab('answers')
  • DataTable: Name (aus persons), Antwort-Felder (dynamisch aus event.formDefinition)
  • Pro Zelle: wenn formOverride gesetzt, "!!"-Indikator (rot) mit Tooltip: "Ueberschrieben von [Organisator] am [Datum]: [Grund]"
  • Override-Button oeffnet Modal:
    • Formular mit allen Feldern (vorausgefuellt mit formFinal oder formOverride)
    • Pflichtfeld "Aenderungsgrund" (Textarea, min 10 Zeichen)
    • "Ueberschreiben"-Button (sendet PUT)
  • Filter: "Alle", "Nur mit Antwort", "Nur ohne Antwort", "Nur ueberschrieben"
  • Sichtbarkeit: nur fuer Organisator/Event-Admin

events.test.ts:

  • Load-Test: guests mit formFinal werden geladen
  • Action-Test: overrideForm mit/ohne Grund, ungueltigen personId
  • Page-Test: "Antworten"-Tab, DataTable mit dynamischen Spalten, Override-Indikator, Override-Modal

Commit 5: feat(frontend): Formular-Vorlagen CRUD-Seite (closes #104)

Neue Route: /app/templates

+page.server.ts (Liste):

  • Load: GET /api/v1/templatestemplates: Template[]
  • Action: deleteTemplateDELETE /api/v1/templates/{templateId}

+page.svelte (Liste):

  • PageHeader "Formular-Vorlagen" mit "Neu anlegen"-Button
  • DataTable: Name, Beschreibung, Anzahl Felder, Erstellt am
  • Loeschen-Button mit Confirm-Dialog

Neue Route: /app/templates/new

+page.server.ts:

  • Action createTemplate: Validiert name, description, formDefinition, sendet POST /api/v1/templates
  • Redirect zu /app/templates/{templateId} bei Erfolg

+page.svelte:

  • FormEditor-Komponente (wiederverwendet aus Commit 2)
  • Zusatzfelder: Name (Text-Input, required), Beschreibung (Textarea, optional)
  • "Speichern"-Button

Neue Route: /app/templates/[templateId]

+page.server.ts:

  • Load: GET /api/v1/templates/{templateId}template: Template
  • Actions: updateTemplate (PUT), deleteTemplate (DELETE, Redirect zu /app/templates)

+page.svelte:

  • FormEditor-Komponente mit vorhandenen Werten
  • Name/Beschreibung-Felder
  • "Speichern"- und "Loeschen"-Buttons

sidebar.svelte Aenderungen:

  • Neuer Eintrag: "Vorlagen" → /app/templates (nach "Mein Haushalt")

Neue Tests: templates.test.ts:

  • Load-Test: templates werden geladen
  • Action-Test: create, update, delete senden korrekte API-Calls
  • Page-Tests (Liste): DataTable mit Name, Beschreibung
  • Page-Tests (New/Edit): FormEditor, Name/Beschreibung-Input

closes #104 im Commit-Body

Detaillierte Commit-Beschreibungen (fuer Commit-Body)

Commit 1

chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert

refs #104

- npm run generate:api ausgefuehrt
- Types validiert: FormDraftRequest, FormFinalRequest,
  FormOverrideRequest, FormDefinitionRequest, Template,
  CreateTemplate, UpdateTemplate vorhanden
- Alle bestehenden Tests gruen

Commit 2

feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab

refs #104

+page.server.ts: templates laden, updateFormDefinition-Action
+ Neue Komponente form-editor.svelte mit Feld-CRUD (add/remove/reorder)
+ Neuer Tab "Formular" im Event-Detail
+ "Aus Vorlage laden"-Dropdown im Editor
+ Tests: Load, Action, Page-Komponente

Commit 3

feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe

refs #104

persons/[personId]:
+ Draft laden via GET form-draft
+ saveDraft-Action (PUT form-draft)
+ submitFinal-Action (PUT form-final)
+ Override-Indikator ("!!") bei formOverride
+ Haushalts-Draft-Hinweis
+ Tests: Load, Actions, Page

Commit 4

feat(frontend): Formular-Antworten fuer Organisator anzeigen

refs #104

events/[eventId]:
+ Neuer Tab "Antworten" mit dynamischer DataTable
+ Override-Modal mit Aenderungsgrund (Pflichtfeld)
+ Override-Indikator ("!!") mit Tooltip
+ Filter: nur mit/ohne Antwort, ueberschrieben
+ Tests: Load, Action, Page

Commit 5

feat(frontend): Formular-Vorlagen CRUD-Seite

refs #104
closes #104

+ /app/templates Liste + CRUD
+ /app/templates/new mit FormEditor
+ /app/templates/[id] mit FormEditor
+ sidebar: "Vorlagen"-Link
+ Tests: Load, Actions, Page
+ PROJECT_STATE.md aktualisiert

Ueberschneidungen

  • Keine Ueberschneidung mit anderen Issues: Formular-UI ist eigenstaendig
  • FormEditor-Komponente wird in Commit 2 definiert und in Commit 5 wiederverwendet
  • Drag-and-Drop wird nicht in MS-FE-4 implementiert; separater Issue in MS-REST
## Umsetzungsplan (Stand 2026-06-28) ### Backend-Voraussetzungen Saemtliche Backend-Endpunkte sind bereits implementiert (MS-BE-API-3, #120-#122): - `GET/PUT /api/v1/events/{id}/form` — Formular-Definition lesen/schreiben - `GET/PUT /api/v1/events/{id}/guests/{pid}/form-draft` — Haushalts-Draft lesen/speichern - `PUT /api/v1/events/{id}/guests/{pid}/form-final` — Finale Antwort absenden - `PUT /api/v1/events/{id}/guests/{pid}/form-override` — Organisator-Override mit Grund - `GET /api/v1/templates` — Vorlagen-Liste - `POST /api/v1/templates` — Vorlage anlegen - `GET/PUT/DELETE /api/v1/templates/{id}` — Vorlagen-Detail Kein neues DB-Schema oder API-Endpunkt noetig. Orval-Typen sind bereits vorhanden (FormDraftRequest, FormFinalRequest, FormOverrideRequest, FormDefinitionRequest, Template, CreateTemplate, UpdateTemplate). ### Bereits erledigt (MS-FE-1 #101) - Event-Detail mit Tabs (Details, Gaesteliste, Zahlungsabgleich) - persons/[personId] Self-Service-Seite mit RSVP und einfacher Formular-Feld-Anzeige - Formular-Felder werden aus `formDefinition` gerendert (text/select/date) ### Schritt-fuer-Schritt-Plan #### Commit 1: `chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert` - `npm run generate:api` ausfuehren - generated.ts auf Vollstaendigkeit pruefen (FormDraftRequest, FormFinalRequest, FormOverrideRequest, FormDefinitionRequest, Template, CreateTemplate, UpdateTemplate, GetFormDraft200, GetFormDefinition200) - Existierende Tests: `npm run test` gruen - Keine neuen Tests (nur Regeneration) #### Commit 2: `feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab` **Neue Komponente: `$lib/components/form-editor.svelte`** - Props: `formDefinition` (initiales Array), `templates` (fuer "Aus Vorlage laden") - Events/Actions: `onSave(formDefinition)` — ruft PUT auf - Editor-UI: - Liste vorhandener Felder mit: - `label` (Text-Input, required) - `type` (Select: text, number, select, date) - `required` (Checkbox) - `options` (Textarea, nur bei type=select, komma-getrennt) - Up-Button (nach oben verschieben) - Down-Button (nach unten verschieben) - Loeschen-Button - "Feld hinzufuegen"-Button (haengt neues Feld an) - "Aus Vorlage laden"-Dropdown (listet templates, ersetzt formDefinition) - "Speichern"-Button (emittiert onSave) **+page.server.ts Aenderungen (events/[eventId]):** - Load: zusaetzlich `/api/v1/templates` laden → `templates: Template[]` - Neue Action `updateFormDefinition`: - Validiert: `formDefinition` muss Array sein - Sendet `PUT /api/v1/events/{eventId}/form` mit `{ formDefinition }` - Gibt 400 bei ungueltigen Daten zurueck **+page.svelte Aenderungen:** - Neuer Tab "Formular" mit `switchTab('form')` - FormEditor-Komponente mit formDefinition und templates - Sichtbarkeit: nur im planning-Status oder fuer Organisator/Event-Admin **events.test.ts:** - Load-Test: templates werden geladen - Load-Test: formDefinition in event wird geladen - Action-Test: `updateFormDefinition` mit gueltigen/ungueltigen Daten - Page-Test: "Formular"-Tab existiert, FormEditor-Komponente importiert, Felder-UI #### Commit 3: `feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe` **+page.server.ts Aenderungen (persons/[personId]):** - Load: invitations laden (bestehend), zusaetzlich pro Invitation pruefen ob formDefinition vorhanden - Zusaetzlicher API-Call: `GET /api/v1/events/{eventId}/guests/{personId}/form-draft` (fuer erste Invitation mit formDefinition) - Neue Actions: - `saveDraft`: Validiert formDraft-Objekt, sendet `PUT /events/{id}/guests/{pid}/form-draft` - `submitFinal`: Validiert formFinal-Objekt, sendet `PUT /events/{id}/guests/{pid}/form-final` **+page.svelte Aenderungen:** - Wenn Invitation `formDefinition` enthaelt und Status `invited`: - Formular-Felder rendern (bestehender Code wird erweitert) - Feldwerte aus `formDraft` vorausfuellen (falls vorhanden) - "Zwischenspeichern"-Button (ruft `saveDraft`-Action auf) - "Endgueltig absenden"-Button (ruft `submitFinal`-Action auf) - Nach Absenden: Formular gesperrt, Status "Zugesagt am ..." - Wenn `formOverride` vorhanden: "!!"-Indikator neben geaenderten Feldern - Haushalts-Hinweis: "Dieser Draft wird mit Ihrem Haushalt geteilt" **self-service.test.ts:** - Load-Test: formDraft wird geladen - Action-Test: `saveDraft` mit gueltigen Daten - Action-Test: `submitFinal` setzt respondedAt - Page-Test: Draft-Formular angezeigt, Save/Submit-Buttons, Override-Indikator #### Commit 4: `feat(frontend): Formular-Antworten fuer Organisator anzeigen und ueberschreiben` **+page.server.ts Aenderungen (events/[eventId]):** - Load im answers-Tab: Gaesteliste laden, zusaetzlich `formFinal` und `formOverride` pro Guest mitgeben - Neue Action `overrideForm`: - Validiert: `personId`, `formOverride` (object), `overrideReason` (string, min 3 Zeichen) - Sendet `PUT /api/v1/events/{eventId}/guests/{personId}/form-override` **+page.svelte Aenderungen:** - Neuer Tab "Antworten" mit `switchTab('answers')` - DataTable: Name (aus persons), Antwort-Felder (dynamisch aus event.formDefinition) - Pro Zelle: wenn formOverride gesetzt, "!!"-Indikator (rot) mit Tooltip: "Ueberschrieben von [Organisator] am [Datum]: [Grund]" - Override-Button oeffnet Modal: - Formular mit allen Feldern (vorausgefuellt mit formFinal oder formOverride) - Pflichtfeld "Aenderungsgrund" (Textarea, min 10 Zeichen) - "Ueberschreiben"-Button (sendet PUT) - Filter: "Alle", "Nur mit Antwort", "Nur ohne Antwort", "Nur ueberschrieben" - Sichtbarkeit: nur fuer Organisator/Event-Admin **events.test.ts:** - Load-Test: guests mit formFinal werden geladen - Action-Test: `overrideForm` mit/ohne Grund, ungueltigen personId - Page-Test: "Antworten"-Tab, DataTable mit dynamischen Spalten, Override-Indikator, Override-Modal #### Commit 5: `feat(frontend): Formular-Vorlagen CRUD-Seite (closes #104)` **Neue Route: `/app/templates`** **+page.server.ts (Liste):** - Load: `GET /api/v1/templates` → `templates: Template[]` - Action: `deleteTemplate` → `DELETE /api/v1/templates/{templateId}` **+page.svelte (Liste):** - PageHeader "Formular-Vorlagen" mit "Neu anlegen"-Button - DataTable: Name, Beschreibung, Anzahl Felder, Erstellt am - Loeschen-Button mit Confirm-Dialog **Neue Route: `/app/templates/new`** **+page.server.ts:** - Action `createTemplate`: Validiert name, description, formDefinition, sendet `POST /api/v1/templates` - Redirect zu `/app/templates/{templateId}` bei Erfolg **+page.svelte:** - FormEditor-Komponente (wiederverwendet aus Commit 2) - Zusatzfelder: Name (Text-Input, required), Beschreibung (Textarea, optional) - "Speichern"-Button **Neue Route: `/app/templates/[templateId]`** **+page.server.ts:** - Load: `GET /api/v1/templates/{templateId}` → `template: Template` - Actions: `updateTemplate` (PUT), `deleteTemplate` (DELETE, Redirect zu /app/templates) **+page.svelte:** - FormEditor-Komponente mit vorhandenen Werten - Name/Beschreibung-Felder - "Speichern"- und "Loeschen"-Buttons **sidebar.svelte Aenderungen:** - Neuer Eintrag: "Vorlagen" → `/app/templates` (nach "Mein Haushalt") **Neue Tests: `templates.test.ts`:** - Load-Test: templates werden geladen - Action-Test: create, update, delete senden korrekte API-Calls - Page-Tests (Liste): DataTable mit Name, Beschreibung - Page-Tests (New/Edit): FormEditor, Name/Beschreibung-Input **closes #104** im Commit-Body ### Detaillierte Commit-Beschreibungen (fuer Commit-Body) #### Commit 1 ``` chore(frontend): Orval-Typen fuer MS-FE-4 regeneriert refs #104 - npm run generate:api ausgefuehrt - Types validiert: FormDraftRequest, FormFinalRequest, FormOverrideRequest, FormDefinitionRequest, Template, CreateTemplate, UpdateTemplate vorhanden - Alle bestehenden Tests gruen ``` #### Commit 2 ``` feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab refs #104 +page.server.ts: templates laden, updateFormDefinition-Action + Neue Komponente form-editor.svelte mit Feld-CRUD (add/remove/reorder) + Neuer Tab "Formular" im Event-Detail + "Aus Vorlage laden"-Dropdown im Editor + Tests: Load, Action, Page-Komponente ``` #### Commit 3 ``` feat(frontend): Haushaltsweiser Formular-Draft und finale Eingabe refs #104 persons/[personId]: + Draft laden via GET form-draft + saveDraft-Action (PUT form-draft) + submitFinal-Action (PUT form-final) + Override-Indikator ("!!") bei formOverride + Haushalts-Draft-Hinweis + Tests: Load, Actions, Page ``` #### Commit 4 ``` feat(frontend): Formular-Antworten fuer Organisator anzeigen refs #104 events/[eventId]: + Neuer Tab "Antworten" mit dynamischer DataTable + Override-Modal mit Aenderungsgrund (Pflichtfeld) + Override-Indikator ("!!") mit Tooltip + Filter: nur mit/ohne Antwort, ueberschrieben + Tests: Load, Action, Page ``` #### Commit 5 ``` feat(frontend): Formular-Vorlagen CRUD-Seite refs #104 closes #104 + /app/templates Liste + CRUD + /app/templates/new mit FormEditor + /app/templates/[id] mit FormEditor + sidebar: "Vorlagen"-Link + Tests: Load, Actions, Page + PROJECT_STATE.md aktualisiert ``` ### Ueberschneidungen - **Keine Ueberschneidung mit anderen Issues:** Formular-UI ist eigenstaendig - **FormEditor-Komponente wird in Commit 2 definiert** und in Commit 5 wiederverwendet - **Drag-and-Drop** wird nicht in MS-FE-4 implementiert; separater Issue in MS-REST
Author
Owner

Commits 1+2 abgeschlossen (20c7d46)

Commit 1: Orval-Typen regeneriert (bereits in vorheriger Session)
Commit 2: feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab

Enthaelt:

  • Neue FormEditor.svelte in $lib/components/ — Felder-CRUD (add/remove/move), Template-Load, onSave-Callback
  • +page.server.ts: Template-Import, Templates-Ladung im Form-Tab, updateFormDefinition-Action
  • +page.svelte: FormEditor-Import, Formular-Tab-Button, formSuccess/formError-Anzeige, Editor-UI
  • 87 Tests passed, svelte-check: 0 errors

Naechste Schritte: Commit 3 (Haushaltsweiser Draft & finale Eingabe)

**Commits 1+2 abgeschlossen** (20c7d46) Commit 1: Orval-Typen regeneriert (bereits in vorheriger Session) Commit 2: `feat(frontend): Formular-Editor-Komponente und Event-Detail-Tab` Enthaelt: - Neue `FormEditor.svelte` in `$lib/components/` — Felder-CRUD (add/remove/move), Template-Load, `onSave`-Callback - `+page.server.ts`: Template-Import, Templates-Ladung im Form-Tab, `updateFormDefinition`-Action - `+page.svelte`: FormEditor-Import, Formular-Tab-Button, formSuccess/formError-Anzeige, Editor-UI - 87 Tests passed, svelte-check: 0 errors Naechste Schritte: Commit 3 (Haushaltsweiser Draft & finale Eingabe)
Sign in to join this conversation.
No description provided.