diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M01 Aufgabe anlegen.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M01 Aufgabe anlegen.md index a02dd974..8db5f72a 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M01 Aufgabe anlegen.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M01 Aufgabe anlegen.md @@ -7,39 +7,148 @@ id: M01 screen: Aufgabe anlegen typ: Modal umsetzung: Bauen -status: Validiert -route: "aus S01/S03/Detailseiten" -subframe: "" +status: Fertig / Development-Handoff +route: "aus S01/S03/Detailseiten/V01" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 --- # M01 — Aufgabe anlegen -## Ziel +> [!info] Subframe ist UI-Quelle +> **Aktuelle Kontext-Basis:** [M01 V5 · Inhalt + Planung öffnen](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit) (`826b6837-a486-42c8-bbe6-d3745528993e`). Die unten beschriebenen V1/V2-Seiten sind nur noch Entscheidungshistorie. -Aufgabe in Sekunden anlegen — aus der Liste, dem Drawer oder direkt aus einer Detailseite (dann vorbefüllt). +## Finaler Stand · 2026-08-23 -## Pattern / Archetyp +- V5 bildet Status, Priorität inklusive `Kritisch`, Fälligkeit mit Uhrzeit, Erinnerung, genau eine verantwortliche Person/Gruppe, Tags, Beobachter, Beschreibung/Checkliste, eine primäre Verknüpfung und Anhänge in zwei klaren Spalten ab. +- Im Objektkontext bleibt die primäre Verknüpfung vorbefüllt. Beim globalen Einstieg aus S01/S03 startet dasselbe Formular mit leerer, durchsuchbarer Verknüpfung. +- Schließen oder Abbrechen mit geänderten Eingaben führt zu [[M02-M09 Interaktionsmodals#M05 · Änderungen verwerfen]]. Ohne Änderungen schließt M01 direkt. +- `Datei hinzufügen` verwendet den Normalzustand aus [[M02-M09 Interaktionsmodals#M08 · Datei hinzufügen]]. Uploadfortschritt, Datei-/Save-Fehler, Inline-Validierung und Erfolgsfeedback werden nur in [[Z01 Zustände und Feedback]] spezifiziert. +- Die Feldbezeichnung ist modulweit `Fälligkeit`; die V5-Kontextseite wurde am 2026-08-23 gezielt von `Deadline` auf `Fälligkeit` vereinheitlicht, ohne weitere Felder oder das Layout zu verändern. -A5 Dialog (echtes Modal: DialogLayout → Dialog → Dialog.Content). +### Finale M01-Seite -## Daten +| Seite | Zweck | UUID | Direktlink | +|---|---|---|---| +| M01 V5 · Inhalt + Planung | gemeinsames Formular für globale Anlage, Objektkontext und Duplizieren | `826b6837-a486-42c8-bbe6-d3745528993e` | [Subframe](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit) | -- Titel (Pflicht) · Beschreibung (Markdown) · Priorität · Frist (Date-Picker) -- Zuständig: Person ↔ Gruppe · Verknüpfung (Auto-Complete) · Beobachter -- Aus Detailseite geöffnet: Verknüpfung vorbefüllt +M01b und M01c sind nicht mehr Teil des finalen Live-Flows. Die Unterschiede werden in Development als Datenmodi derselben M01-Oberfläche umgesetzt: -## Aktionen +| Modus | Vorbelegung / Abschluss | +|---|---| +| Global anlegen | Verknüpfung leer; eigener Nutzer als Verantwortlicher; Abschluss `Aufgabe erstellen` | +| Aus Objektkontext | primäre Verknüpfung auf das auslösende Objekt vorbefüllt | +| Duplizieren | Werte als bearbeitbare Kopie vorbefüllt; Status `Offen`; Checklistenpunkte offen; kein alter Verlauf; Abschluss kontextuell `Aufgabe duplizieren` | -- »Anlegen« → Toast + Aufgabe erscheint in Liste/Drawer -- Abbrechen +### Duplikatvertrag -## Zustände +- Titel startet mit `Kopie von …`; Status wird auf `Offen` zurückgesetzt. +- Priorität, Fälligkeit/Uhrzeit, Erinnerung, Verantwortlich, Tags, Beobachter, Beschreibung, Verknüpfung und Anhänge sind vorausgefüllt und vor dem Anlegen änderbar. +- Checklistenpunkte werden inhaltlich kopiert, starten aber offen. +- Die Kopie erhält eine eigene Historie; der alte Verlauf wird nicht übernommen. +- Abschlussaktion heißt eindeutig `Aufgabe duplizieren`. -| Zustand | Beschreibung | Umsetzung | -|---|---|---| -| Titel fehlt | Inline-Validierung | Nur dokumentieren | -| Speichern fehlgeschlagen | Toast mit Klartext | Wiederverwenden | +## Ziel und validierte Planung -## Subframe +Eine Aufgabe in Sekunden anlegen — aus Liste, Drawer oder einer Detailseite; im Kontext ist die Verknüpfung vorbefüllt. -- (erst nach explizitem OK) +> [!note] Globaler Vertrag +> Dieses Formular setzt [[WF-P4 Aufgaben#Globaler Aufgaben-Feldvertrag · kanonische Quelle]] vollständig für den Erstellungsfall um. + +- Nur der Titel erfordert eine manuelle Eingabe. Verantwortlich ist als Datenfeld zwingend, wird aber mit dem eigenen Nutzer vorbelegt und kann nicht auf »unzugewiesen« geleert werden. +- Status ist beim Anlegen editierbar; Standard ist `Offen`, weitere Werte sind `In Bearbeitung` und `Erledigt`. +- Zuständigkeit ist genau eine Person **oder** eine Gruppe; Wechsel im Picker. +- Frist und ergänzende Uhrzeit sind optional. +- Verknüpfung ist ein suchbares Auto-Complete für Kontakt, Organisation, Lead oder Projekt. +- Beschreibung mit Markdown/Checkliste, Priorität, Beobachter, Tags und Erinnerung sind optional; Anhänge können direkt vor dem Erstellen hochgeladen werden. +- Herkunft bleibt als systemseitiges Aufgabenfeld erhalten. Beim manuellen Anlegen wird automatisch `Manuell` gesetzt; sie ist hier kein bearbeitbares Eingabefeld. +- Anlegen → Toast + Aufgabe erscheint in Liste/Drawer/Einbettung; Abbrechen/Schließen beendet ohne Mutation. +- Titel fehlt → Inline-Validierung; Save-Fehler → Klartext-Toast. + +### Validierter Feldvertrag · 2026-08-22 + +| Feld | Regel beim Anlegen | +|---|---| +| Titel | sichtbar, manuell verpflichtend | +| Status | sichtbar und bearbeitbar; Standard `Offen` | +| Verantwortlich | sichtbar; eigener Nutzer vorbelegt; Wechsel auf genau eine Person oder Gruppe; nie leer | +| Frist | optionales Datum mit optionaler Uhrzeit | +| Priorität | optional; `Niedrig`, `Mittel`, `Hoch`, `Kritisch` | +| Verknüpfung | optional; beim Anlegen genau eine primäre Verknüpfung, im Objektkontext vorbefüllt; weitere Kontext-Verknüpfungen werden später in S02 verwaltet | +| Beschreibung | optional; Markdown und Checkliste | +| Beobachter | optional | +| Tags | optional | +| Erinnerung | optional | +| Anhänge | optional; direkter Upload im Dialog | +| Systemfelder | Ersteller, Erstellzeit und Herkunft werden automatisch gesetzt; Herkunft ist beim manuellen Anlegen `Manuell` | + +## Historischer Subframe-Bestand + +### V1 — kompaktes Formular + +UUID: `b2bc1fc4-36a4-4381-8840-798a87c1cf54` · Datei: `M01AufgabeAnlegenV1.tsx` · 265 Zeilen + +![Subframe-Screenshot V1](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/b2bc1fc4-36a4-4381-8840-798a87c1cf54-1787355915516.png) + +Sichtbar: + +- Modal mit Titel »Aufgabe erstellen« und Kontext `Neue Aufgabe aus Projekt P-2026-0121 anlegen`. +- Felder: Titel, Markdown-Beschreibung, Priorität, Fällig am, Verantwortlich, Verknüpfung und Beobachter. +- Priorität und Verantwortlich sind visuell optional; Personen und Teams stehen in derselben Select-Liste. +- Projektverknüpfung ist vorbefüllt, wird in der zweispaltigen Zeile aber abgeschnitten. +- Beobachterin Sandra Koch ist als Chip vorbelegt. +- Footer: Abbrechen und Aufgabe erstellen. + +Komponenten: `DialogLayout`, `Dialog.Content`, `TextInput`, `TextArea`, `Select`, `DatePicker`, `Avatar`, `Button`, `IconButton`, `IconWithBackground`. + +Aktionen: Schließen, Abbrechen, Erstellen, Select-Änderungen und Eingaben haben ausschließlich leere Handler. Inline-Validierung, Loading/Disabled und Toast sind nicht dargestellt. + +### V2 — schnellere Kernfelder und weitere Details + +UUID: `c1f8050e-83b0-418e-bb73-19c36ca6123f` · Datei: `M01AufgabeAnlegenV2.tsx` · 269 Zeilen + +![Subframe-Screenshot V2](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/c1f8050e-83b0-418e-bb73-19c36ca6123f-1787355946832.png) + +Sichtbar: + +- Größeres Modal mit Projektname und Projekt-ID im Kopf. +- Kernfelder: Titel, Priorität/Fälligkeit, Verantwortlich und Verknüpfung. +- Blauer Kontext-Hinweis erklärt die Projektverknüpfung. +- Bereich »Weitere Details« mit Beschreibung und Beobachtern; im aktuellen Rendering geöffnet. +- Sticky Footer mit Abbrechen und Aufgabe erstellen. +- V2 ergänzt Priorität `Kritisch` und markiert `Verantwortlich *` als Pflicht. + +Komponenten: `DialogLayout`, `Dialog.Content`, `TextInput`, `TextArea`, `Select`, `DatePicker`, `Avatar`, `Button`, `IconButton`, `IconWithBackground`; der Detailbereich ist handgebaut und keine Accordion-Komponente. + +Aktionen: Schließen, Abbrechen, Erstellen, Select-Änderungen und Eingaben haben ausschließlich leere Handler. Save-Verlauf und Rückmeldung fehlen. + +## Historische Konflikte und fehlende Zustände vor V5 + +| Thema | Validierte Planung | Subframe | Bewertung | +|---|---|---|---| +| Dialog-Hierarchie | `DialogLayout -> Dialog -> Dialog.Content` | `DialogLayout -> Dialog.Content` in V1/V2 | muss korrigiert werden | +| Pflichtlogik | nur Titel manuell; Verantwortlich automatisch eigener Nutzer und nie leer | V1 lässt Verantwortlich optional; V2 markiert es als Pflicht, startet aber leer | Default- und Nicht-leer-Logik fehlen | +| Status | beim Anlegen editierbar; Standard `Offen` | kein Statusfeld | fehlt | +| Person/Gruppe | expliziter Wechsel, genau eines | gemeinsame Liste mit Personen und Teams | Logik/Verständlichkeit fehlt | +| Verknüpfung | suchbares Auto-Complete, mehrere Objekttypen | vorbefülltes Feld; Such-/Ergebniszustand nicht gezeigt | unvollständig | +| Priorität | Kritisch/Hoch/Mittel/Niedrig | V2 ergänzt Kritisch | V2-Katalog übernehmen | +| Frist/Uhrzeit | beide optional | nur DatePicker | optionale Uhrzeit fehlt | +| Weitere Details | Beschreibung/Checkliste, Beobachter, Tags, Erinnerung, Anhänge direkt | Beschreibung und Beobachter vorhanden | Tags, Erinnerung, Upload und Checklistenfunktion fehlen | +| Herkunft | systemseitig `Manuell`; kein Eingabefeld | nicht gezeigt | zielkonform, sofern der Wert beim Speichern automatisch gesetzt wird | +| Kontextloser Einstieg | aus S01/S03 ohne Vorbelegung | beide Beispiele sind projektvorbefüllt | leerer Kontextzustand fehlt | +| Titel fehlt | Inline-Fehler | fehlt | bauen/dokumentieren | +| Speichern | Loading, Disabled, Erfolg, Fehler | fehlt | Outcomes definieren | +| Abbrechen mit Eingaben | Verhalten nicht dargestellt | fehlt | Verwerfen-Regel klären | + +## Historische UX-/Produktbewertung + +Empfehlung: **zusammenführen + technisch korrigieren; V2 als Basis, noch nicht final**. + +- V2 hat die bessere Informationshierarchie: zuerst Titel, Frist, Verantwortlichkeit und Kontext; längere Beschreibung/Beobachter sind sekundär. +- V2 nutzt die Breite besser und verhindert das abgeschnittene Verknüpfungsfeld aus V1. +- V1 ist schneller vollständig erfassbar, bildet den jetzt validierten Feldumfang aber ebenso wenig vollständig ab. +- `Verantwortlich *` in V2 passt zum Datenmodell, darf jedoch nie leer starten: Standard ist immer die anlegende Person. +- Die gemeinsame Personen-/Team-Liste erfüllt funktional vielleicht „genau eines“, erklärt aber nicht den validierten Wechsel und skaliert bei vielen Einträgen schlecht. +- Beide Varianten brauchen zusätzlich Status, optionale Uhrzeit, Tags, Erinnerung, direkten Datei-Upload sowie die korrekte Dialog-Komponentenstruktur, Validierung, Saving, Fehler und Erfolgsoutcome. + +Empfohlene Zusammenführung: V2-Layout behalten; eigenen Nutzer als festen, wechselbaren Verantwortlich-Default einsetzen; Person/Gruppe im Picker explizit trennen; Status, optionale Uhrzeit, Tags, Erinnerung und direkten Upload ergänzen; projektlosen und vorbefüllten Einstieg abbilden; Auto-Complete-Zustände und Formularfeedback ergänzen; anschließend `Dialog`-Ebene einsetzen und erneut rendern. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M02-M09 Interaktionsmodals.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M02-M09 Interaktionsmodals.md new file mode 100644 index 00000000..77b96b21 --- /dev/null +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M02-M09 Interaktionsmodals.md @@ -0,0 +1,112 @@ +--- +kind: screen-family +project: HiveGrid Screen Project +ticket: D-P4 +package: WF-P4 Aufgaben +id: M02-M09 +screen: Interaktionsmodals +typ: Modal-Familie +umsetzung: Bauen +status: Fertig / Development-Handoff +route: "aus S01/S02/S03/M01/V01" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 +--- + +# M02–M09 — Interaktionsmodals + +Diese Familie schließt die bisher fehlenden entscheidungsrelevanten Zwischenschritte des Aufgabenmoduls. Sie enthält nur Zustände, in denen der Nutzer eine Auswahl treffen, Daten eingeben oder eine riskante Aktion ausdrücklich bestätigen muss. Reine Empty-, Error-, Loading-, Uploadfortschritts-, Erfolgs- und Undo-Zustände stehen ausschließlich in [[Z01 Zustände und Feedback]]. Mobile ist nicht Teil dieser Runde. + +## Subframe-Bestand + +| ID | Screen | Einstieg | UUID / Status | Direktlink | +|---|---|---|---|---| +| M02 | Aufgabe löschen | S01-Zeilenmenü, S02-Kopfmenü, S03/V01-Menü | `a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3/edit) | +| M02b | Mehrere Aufgaben löschen | S01 aktive Bulk-Leiste | `47e17c3e-aef5-449b-b042-1c9898d9f6cd` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/47e17c3e-aef5-449b-b042-1c9898d9f6cd/edit) | +| M03 | Verknüpfung hinzufügen | S02 `+ Verknüpfung` | `8020d4ea-9823-400f-b779-dbb78f3cef2e` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/8020d4ea-9823-400f-b779-dbb78f3cef2e/edit) | +| M04 | Verknüpfung lösen | S02 Verknüpfungszeile → Mehr-Menü | `c5c91314-ef9b-4434-b574-168b2ee99947` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/c5c91314-ef9b-4434-b574-168b2ee99947/edit) | +| M05 | Änderungen verwerfen | M01 schließen/abbrechen mit Änderungen | `ae739bed-4f12-47fc-9ea2-e3cfc410abc0` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/ae739bed-4f12-47fc-9ea2-e3cfc410abc0/edit) | +| M06 | Offene Punkte bestätigen | Erledigen bei offener Checkliste | `17e1ded0-3344-49ad-bfeb-698d52f730f6` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/17e1ded0-3344-49ad-bfeb-698d52f730f6/edit) | +| M07 | Notiz hinzufügen | S02 Verlauf | `ac3f4aec-4d41-4d96-af71-f77931e12437` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/ac3f4aec-4d41-4d96-af71-f77931e12437/edit) | +| M08 | Datei hinzufügen | S02 Anhänge/Editor | `41a74bd3-2bb1-4429-bd33-2cad30be2621` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/41a74bd3-2bb1-4429-bd33-2cad30be2621/edit) | +| M08b | Anhang entfernen | S02 Dateizeile → Mehr-Menü | `35ac0b6b-04d2-4319-af87-66941cd24f1a` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/35ac0b6b-04d2-4319-af87-66941cd24f1a/edit) | +| M09 | Filter-Preset speichern | S01 Filteraktionen | `4f427f0e-73f6-4c87-956b-26014939afa9` · gebaut | [Subframe](https://app.subframe.com/f023064a5ca0/design/4f427f0e-73f6-4c87-956b-26014939afa9/edit) | + +## M02 · Aufgabe löschen + +- Klartextfrage `Aufgabe löschen?` und konkreter Aufgabentitel. +- Der Dialog erklärt, dass die Aufgabe aus allen Aufgabenansichten entfernt wird und nicht wiederhergestellt werden kann. +- Footer-Aktionen in gleicher Größe: `Abbrechen`, blau `Lieber archivieren` und destruktiv `Aufgabe löschen`. +- `Lieber archivieren` startet den Archivieren-Pfad, ohne die Löschung auszuführen. +- Kein Undo nach erfolgreicher Löschung; siehe [[Z01 Zustände und Feedback#4. Speichern, Erfolg und Undo]]. + +## M02b · Mehrere Aufgaben löschen + +- Titel und destruktive Aktion nennen dieselbe Anzahl, zum Beispiel `3 Aufgaben löschen?` / `3 Aufgaben löschen`. +- Eine kompakte Titelliste macht den exakten Scope vor der Löschung prüfbar. +- Auch hier stehen drei gleich große Footer-Aktionen bereit: `Abbrechen`, blau `Lieber archivieren` und destruktiv die Löschung der ausgewählten Anzahl. +- Teilfehler und Retry werden ausschließlich dokumentiert; kein eigener Subframe-State. + +## M03 · Verknüpfung hinzufügen + +- Gemeinsame Suche über `Projekt`, `Kontakt`, `Organisation` und `Lead`. +- Typfilter begrenzen die Treffer, ändern aber nicht die Suchphrase. +- Jede Zeile zeigt Typ, Namen und optionale Objekt-ID. Es wird pro Öffnung genau ein Ziel gewählt. +- Bereits verknüpfte Ziele bleiben sichtbar deaktiviert und sind als `bereits verknüpft` markiert. +- Aktionen: `Abbrechen`, `Verknüpfen`; die Primäraktion ist ohne Auswahl deaktiviert. + +## M04 · Verknüpfung lösen + +- Zeigt Typ, Namen und ID der betroffenen Verknüpfung. +- Entfernt ausschließlich die Beziehung. Aufgabe, Ziel-Datensatz, Notizen, Dateien und Verlauf bleiben erhalten. +- Aktionen: `Abbrechen`, destruktiv `Verknüpfung lösen`. + +## M05 · Änderungen verwerfen + +- Erscheint nur, wenn M01 gegenüber dem Startzustand geändert wurde. +- Der M01-Dialog bleibt als zweite, gedimmte Ebene sichtbar; der Bestätigungsdialog übernimmt Fokus und Escape. +- Aktionen: `Weiter bearbeiten`, destruktiv `Änderungen verwerfen`. +- Bei unverändertem Formular schließen `X` und `Abbrechen` M01 direkt ohne M05. + +## M06 · Offene Punkte bestätigen + +- Erscheint bei `Erledigen`, wenn mindestens ein Checklistenpunkt offen ist — unabhängig davon, ob der Einstieg aus S01, S02, S03 oder V01 erfolgt. +- Nennt Verhältnis und Anzahl, zum Beispiel `2 von 4 Checklistenpunkten sind noch offen`, und zeigt eine kompakte Vorschau der offenen Punkte. +- Aktionen: `Zurück zur Aufgabe`, `Trotzdem erledigen`. +- Offene Checklistenpunkte werden nicht automatisch geschlossen. + +## M07 · Notiz hinzufügen + +- Einstieg als kompakte Aktion im Kopf des S02-Verlaufs. +- Ein mehrzeiliges Textfeld; die Notiz erscheint anschließend als eigener Verlaufs-Eintrag mit Autor und Zeitstempel. +- Kein Rich-Text-Editor, keine Anhänge und kein eigener Sichtbarkeitsmodus in diesem Dialog. +- Aktionen: `Abbrechen`, `Notiz hinzufügen`. + +## M08 · Datei hinzufügen + +- Gemeinsamer Einstieg für `Datei hinzufügen`, Drag-and-drop und die Anhang-Aktion des Beschreibungseditors. +- Initialzustand mit Dropzone, Dateiauswahl, unterstützten Typen und Maximalgröße. +- Aktionen: `Abbrechen`, `Hinzufügen`; bis zur Auswahl bleibt `Hinzufügen` deaktiviert. +- Fortschritt, Abbrechen, Retry, Typ-/Größenfehler und Erfolgsfeedback stehen nur in [[Z01 Zustände und Feedback#6. Datei-Upload-Zustandsmaschine]]. + +## M08b · Anhang entfernen + +- Nennt Dateiname und ruhige Metadaten, damit der genaue Anhang vor der Aktion prüfbar bleibt. +- Entfernt nur die Verbindung zur Aufgabe. Originaldatei und andere Verknüpfungen bleiben unverändert bestehen. +- Aktionen: `Abbrechen`, destruktiv `Anhang entfernen`. +- Der Dialog ist bewusst leichter als die permanente Aufgabenlöschung; Erfolgsfeedback steht nur in [[Z01 Zustände und Feedback#4. Speichern, Erfolg und Undo]]. + +## M09 · Filter-Preset speichern + +- Zeigt den aktuellen Filterumfang als nicht editierbare Zusammenfassung. +- Pflichtfeld `Name`; optional `Als Standard verwenden`, sofern das Produkt diese Einstellung unterstützt. +- Preset ist zunächst privat. Geteilte Presets benötigen eine eigene Berechtigungsentscheidung und werden nicht still vorausgesetzt. +- Aktionen: `Abbrechen`, `Preset speichern`. + +## Dialog-Regeln + +- Escape, `X` und `Abbrechen` sind gleichwertige sichere Ausgänge, außer ein Dirty-State leitet in M05 um. +- Destruktive Primäraktionen sind rot; Warnentscheidungen wie M06 bleiben im neutralen/gelben Warnmuster. +- Fokus startet im ersten sinnvollen Eingabefeld oder auf der sicheren Aktion; nach dem Schließen kehrt er zum Auslöser zurück. +- Hintergrundinhalt ist inert und für Screenreader verborgen, solange ein Modal aktiv ist. +- Kein Dialog wird in dieser Runde als Mobile-Variante gebaut. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S01 Aufgaben-Liste.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S01 Aufgaben-Liste.md index 0d876b6b..5ff28560 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S01 Aufgaben-Liste.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S01 Aufgaben-Liste.md @@ -7,46 +7,243 @@ id: S01 screen: Aufgaben-Liste typ: Liste umsetzung: Bauen -status: Validiert +status: Fertig / Development-Handoff route: "/tasks" -subframe: "" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 --- # S01 — Aufgaben-Liste -## Ziel +> [!info] Subframe ist UI-Quelle +> **Aktueller S01-Screen:** [S01 B3 · Kompakter Statuspunkt öffnen](https://app.subframe.com/f023064a5ca0/design/7dcb65c5-ba2c-490a-ad06-8758e8e6e913/edit) (`7dcb65c5-ba2c-490a-ad06-8758e8e6e913`). Er ersetzt den unten historisch dokumentierten Kandidaten B als sichtbare Flow-Basis. + +> [!note] Ergänzte Interaktionswege · 2026-08-23 +> Einzelnes Löschen führt zu [[M02-M09 Interaktionsmodals#M02 · Aufgabe löschen]], Bulk-Löschen zu [[M02-M09 Interaktionsmodals#M02b · Mehrere Aufgaben löschen]], `Als Preset speichern` zu [[M02-M09 Interaktionsmodals#M09 · Filter-Preset speichern]] und `Duplizieren` zu [[M01 Aufgabe anlegen]] mit vorausgefüllten Kopiedaten. Ein Erledigen mit offenen Checklistenpunkten führt zu [[M02-M09 Interaktionsmodals#M06 · Offene Punkte bestätigen]]. Empty-, Loading-, Error- und Erfolgszustände werden ausschließlich über [[Z01 Zustände und Feedback]] spezifiziert. + +## Ziel und validierte Planung Alle Aufgaben im Griff: meine zuerst, überfällige sofort sichtbar, schnell abhaken. -## Pattern / Archetyp +> [!note] Globaler Vertrag +> Feldbedeutung und Bearbeitungsregeln folgen verbindlich [[WF-P4 Aufgaben#Globaler Aufgaben-Feldvertrag · kanonische Quelle]]. S01 zeigt davon eine scanbare Teilmenge. -A2 Liste — **wiederverwendbare Komponente** (Kompakt-Variante: [[V01 Eingebettete Kompakt-Variante]]). +- Wiederverwendbare A2-Liste; V01 ist die objektbezogene Kompakt-Ausführung. +- Zeile: Titel, Tags, Priorität, Frist, Verknüpfung, Person **oder** Gruppe und Status. Herkunft bleibt im Aufgabenmodell, erscheint in S01 als Filter und in S02 als Detailinformation. +- Presets: Meine / Von mir erstellt / Alle; »Alle« nur mit `tasks.read_all`. +- Suche; sichtbare Standardfilter für Status, Priorität, Fälligkeit, Verantwortlich, Verknüpfung, Tags und Herkunft; Archiviert-Schalter. +- Zeile öffnen → [[S02 Aufgaben-Detail]]; Neue Aufgabe → [[M01 Aufgabe anlegen]]. +- Ein grüner Icon-Button erledigt eine offene Aufgabe direkt; alle weiteren Zeilenaktionen liegen im Mehr-Menü. Bulk-Aktionen bleiben Teil der validierten Produktentscheidung. -## Daten +### Validierte Zusammenführung · 2026-08-22 -- Zeile: Titel · Prioritäts-Marker · Frist (relativ ≤ 7 Tage, überfällig rot) · verknüpfte Entität · Zuständig (Person/Gruppe) · Status · Herkunfts-Marker (manuell/Chat/Formular/Automation) -- Presets: **Meine / Von mir erstellt / Alle** (»Alle« nur mit `tasks.read_all`) -- Suche · Filter: Status, Priorität, Frist-Zeitraum, Verknüpfungs-Typ, Herkunft · Archiviert-Schalter +- **Basis:** Tabellenkörper und aktive Bulk-Auswahl aus V1. +- **Header:** kompakter V2-Header mit Titel, Segmenten `Meine / Von mir erstellt / Alle` und vollständig sichtbarem Button `Neue Aufgabe`. +- Herkunft bleibt global, ist aber keine S01-Standardspalte; sie wird in S01 gefiltert und in S02 Detail gezeigt. Priorität `Kritisch` bleibt. +- Keine Gruppierung nach Fälligkeit und damit keine eigene Gruppe `Ohne Frist`; eine fehlende Frist wird in der Tabelle neutral dargestellt. +- Validierte Standardspalten: Auswahl, Aufgabe, Priorität, Fälligkeit, Verknüpfung, Verantwortlich, Status, Tags und Aktionen. +- Tags stehen am Tabellenende direkt nach `Status` und vor `Aktionen`. +- Pro Zeile sind maximal zwei Tags sichtbar; weitere werden als `+N` zusammengefasst. Tags brechen nicht um; ohne Tags erscheint `–`. +- S01 wird in Subframe bewusst als **Maximalansicht** gestaltet: Filterleiste, mindestens zwei ausgewählte Zeilen, Auswahlzähler und vollständige aktive Bulk-Leiste sind gleichzeitig sichtbar. +- Das spätere bedingte Verhalten gehört ins Development: Im Produkt erscheint die Bulk-Leiste erst nach einer Auswahl. Der statische Subframe-Screen dokumentiert absichtlich den informationsreicheren aktiven Zustand. +- Validierte Filterleiste: `Suche | Status | Priorität | Fälligkeit | Verantwortlich | Verknüpfung | Tags | Herkunft | Archiviert`. +- Herkunft bleibt dabei reine Filterdimension und Detailinformation; sie wird weiterhin nicht als Tabellenspalte angezeigt. +- Validierte Bulk-Aktionen: `Status | Priorität | Fälligkeit | Zuweisen | Tags | Löschen`. +- `Status` ersetzt die engere Einzelaktion `Erledigen` und erlaubt gesammelt `Offen`, `In Bearbeitung` oder `Erledigt`. `Zuweisen` folgt dem globalen Person-oder-Gruppe-Vertrag; die Tag-Aktion kann Tags hinzufügen oder entfernen. +- Validiertes Zeilenverhalten: Klick auf die freie Zeilenfläche oder den Aufgabentitel öffnet S02; die Checkbox selektiert nur; die Verknüpfung öffnet das verknüpfte Objekt; interaktive Zellen und Controls bearbeiten ausschließlich ihren Wert und lösen keine Zeilennavigation aus. +- Validierte Inline-Bearbeitung: Priorität, Fälligkeit, Verantwortlich, Status und Tags sind direkt in der Tabelle bearbeitbar. Titel und Verknüpfung bleiben Navigationsziele und werden nicht inline bearbeitet. +- Validierte Zeilenaktionen: Nur `Als erledigt markieren` steht bei offenen und in Bearbeitung befindlichen Aufgaben als sichtbarer grüner Icon-Button mit Häkchen, Tooltip und zugänglicher Beschriftung in der Zeile. Das Mehr-Menü enthält ausschließlich `Öffnen`, `Duplizieren` und `Löschen`; `Details öffnen` und `Wieder öffnen` werden nicht als Menüaktionen verwendet. Ein erledigter Status kann über die direkt editierbare Statuszelle geändert werden. +- Validierte Überfällig-Darstellung: kein großes rotes Banner und keine Fälligkeitsgruppen. Überfällige Datumswerte bleiben rot; der kompakte Zähler `3 überfällig` in der Listen-Zusammenfassung ist anklickbar und aktiviert direkt den Filter `Fälligkeit: Überfällig`. -## Aktionen +### Validierter Standardspaltenvertrag · 2026-08-22 -- Zeile öffnen → [[S02 Aufgaben-Detail]] -- Schnell-Aktionen in der Zeile: erledigt · Priorität · Frist -- Mehrfach-Auswahl + Bulk-Aktionen -- »Neue Aufgabe« → [[M01 Aufgabe anlegen]] +| Spalte | Standardinhalt | +|---|---| +| Auswahl | Checkbox für Bulk-Aktionen | +| Aufgabe | Titel; erledigte Aufgabe durchgestrichen | +| Priorität | Kritisch, Hoch, Mittel oder Niedrig | +| Fälligkeit | Datum und optionale Uhrzeit; überfällig rot; ohne Frist `–` | +| Verknüpfung | Objekttyp, Name und ID; öffnet das verknüpfte Objekt | +| Verantwortlich | Avatar oder Gruppensymbol plus Name | +| Status | Offen, In Bearbeitung oder Erledigt; direkt bearbeitbar | +| Tags | direkt nach Status; maximal zwei sichtbar, weitere als `+N`; kein Umbruch; leer als `–` | +| Aktionen | grüner Icon-Button `Als erledigt markieren`; alle weiteren Aktionen im Mehr-Menü | -## Zustände +Nicht als Standardspalten: Herkunft, Beschreibung, Beobachter, Erinnerung, Anhänge, Ersteller und Erstellzeit. Herkunft erscheint verbindlich in [[S02 Aufgaben-Detail]]. -| Zustand | Beschreibung | Umsetzung | +### Validierter Bulk-Vertrag · 2026-08-22 + +| Aktion | Ergebnis | +|---|---| +| Status | ausgewählte Aufgaben auf Offen, In Bearbeitung oder Erledigt setzen | +| Priorität | Kritisch, Hoch, Mittel oder Niedrig setzen | +| Fälligkeit | Datum und optionale Uhrzeit setzen oder entfernen | +| Zuweisen | genau eine Person oder Gruppe für alle ausgewählten Aufgaben setzen | +| Tags | Tags gesammelt hinzufügen oder entfernen | +| Löschen | ausgewählte Aufgaben nach Klartext-Bestätigung löschen | + +### Validiertes Zeilenverhalten · 2026-08-22 + +| Ziel | Outcome | +|---|---| +| freie Zeilenfläche / Aufgabentitel | [[S02 Aufgaben-Detail]] öffnen | +| Auswahl-Checkbox | Aufgabe nur für Bulk-Aktionen auswählen/abwählen | +| Verknüpfung | verknüpften Kontakt, Organisation, Lead oder Projekt öffnen | +| Status oder anderes interaktives Control | Wert bearbeiten; keine Navigation auslösen | + +### Validierte Inline-Bearbeitung und Zeilenaktionen · 2026-08-22 + +| Element | Outcome | +|---|---| +| Priorität | direkt in der Tabelle ändern | +| Fälligkeit | Datum und optionale Uhrzeit direkt ändern oder entfernen | +| Verantwortlich | direkt auf genau eine Person oder Gruppe ändern; nicht leeren | +| Status | direkt zwischen Offen, In Bearbeitung und Erledigt wechseln | +| Tags | direkt hinzufügen oder entfernen | +| Titel | nicht inline bearbeiten; S02 öffnen | +| Verknüpfung | nicht inline bearbeiten; verknüpftes Objekt öffnen | +| grüner Häkchen-Icon-Button | offene oder in Bearbeitung befindliche Aufgabe als erledigt markieren; Tooltip und zugänglicher Name `Als erledigt markieren` | +| Mehr-Menü | ausschließlich `Öffnen`, `Duplizieren`, `Löschen` | + +`Löschen` bleibt destruktiv und erfordert die bereits festgelegte Klartext-Bestätigung. Erledigte Aufgaben zeigen keinen sichtbaren Schnellaktions-Button. Zum erneuten Öffnen wird der direkt editierbare Status verwendet; eine eigene Aktion `Wieder öffnen` gibt es nicht. + +### Validierte Überfällig-Darstellung · 2026-08-22 + +- Das große rote V1-Banner entfällt. +- Die V2-Gruppierung nach Fälligkeit bleibt ebenfalls entfernt. +- Überfällige Datumswerte werden in der Spalte `Fälligkeit` rot dargestellt. +- Die kompakte Listen-Zusammenfassung zeigt den anklickbaren Zähler `3 überfällig`. +- Klick auf den Zähler aktiviert `Fälligkeit: Überfällig`; es entsteht kein separates Navigationsziel. + +> [!note] Development-Default · kein zusätzlicher Designzustand +> Die Standardsortierung wird erst in der Entwicklung umgesetzt: aktive Aufgaben vor erledigten; innerhalb der aktiven Aufgaben überfällige vor kommenden Fristen und Aufgaben ohne Frist zuletzt; erledigte Aufgaben unten, zuletzt erledigte zuerst. Subframe muss dafür keine zusätzliche Sortierlogik oder Variante darstellen. + +### Validierter Tabellenfooter · 2026-08-22 + +- Der Tabellenfooter aus V1 bleibt als sichtbarer Bestandteil der Maximalansicht. +- Links stehen Gesamtzahl, anklickbarer Überfällig-Zähler und Erledigt-Zahl. +- Der Überfällig-Zähler verwendet die bereits validierte Direktfilter-Aktion. +- Rechts steht die normale Pagination. + +> [!important] 80/20-Scope +> Empty, Loading und Error werden in der aktuellen S01-Designrunde nicht weiter ausgearbeitet und erhalten keine eigenen Subframe-Seiten. Die bekannten Standardzustände bleiben ein späteres Development-Thema und blockieren den finalen S01-Kandidaten nicht. + +## Historischer Subframe-Bestand und Löschhistorie vor B3 + +Die folgenden V1-/V2-Abschnitte sowie A-/B-/C-Screenshots bleiben nur als nachvollziehbare Entscheidungshistorie erhalten. Der aktuelle Screen ist B3 und steht im Kopf dieser Datei. + +### V1 — Tabelle und aktive Bulk-Auswahl · gelöscht + +Ehemalige UUID: `3a886e29-2dcb-46cd-a7ac-7bfb229b3b2a` · Datei: `S01AufgabenListeV1.tsx` · 1.607 Zeilen · von David am 2026-08-22 gelöscht + +![Subframe-Screenshot V1](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/3a886e29-2dcb-46cd-a7ac-7bfb229b3b2a-1787355852071.png) + +Sichtbar: + +- Kopf mit Beschreibung, »Neue Aufgabe« und rotem Banner »3 Aufgaben überfällig«. +- Tabs Meine / Von mir erstellt / Alle. +- Suche und Filter für Status, Priorität, Fälligkeit, Verantwortlich und Ursprung; Presets und Reset. +- Aktiver Auswahlzustand »2 ausgewählt« / »Alle 247 auswählen« mit Erledigen, Priorität, Fälligkeit, Zuweisen und Löschen. +- Tabelle mit zehn Beispielaufgaben und Spalten Aufgabe, Priorität, Fälligkeit, Verknüpfung, Verantwortlich, Status, Ursprung und Zeilenaktionen. +- Herkunftswerte: Manuell, Automation und Vorlage. Statuswerte: Offen, In Bearbeitung, Erledigt. +- Footer: `10 Aufgaben · 3 überfällig · 1 erledigt` und deaktivierte Pagination. + +Komponenten: `Table`, `BulkActionBar`, `Tabs`, `FilterBar`, `DropdownMenuMultiSelect`, `DropdownMenuSelect`, `Checkbox`, `Button`, `IconButton`, `BadgeFeedback`, `Avatar` und Subframe-Dropdown-Menüs. + +Aktionen im JSX: 37 leere Click-/Checkbox-Handler. Sichtbare Outcomes sind Bearbeiten, Priorität/Fälligkeit ändern, Zuweisen, Erledigen/Wieder öffnen, Löschen, Preset speichern und Filter zurücksetzen; Navigation und Mutationen sind nicht verdrahtet. + +### V2 — nach Fälligkeit gruppierte Liste · gelöscht + +Ehemalige UUID: `d90cc3a4-46d2-4def-a78e-b73214ef5b2a` · Datei: `S01AufgabenListeV2.tsx` · 1.286 Zeilen · von David am 2026-08-22 gelöscht + +![Subframe-Screenshot V2](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/d90cc3a4-46d2-4def-a78e-b73214ef5b2a-1787355868503.png) + +Sichtbar: + +- Kompakter Kopf mit Segmenten Meine / Von mir erstellt / Alle und »Neue Aufgabe«. +- Suche und Filter für Priorität, Status, Verantwortlich, Ursprung und Fälligkeit. +- Permanente Aktionsleiste: Alle auswählen, Erledigen, Priorität, Fälligkeit und Zuweisen. +- Gruppen Überfällig, Heute, Diese Woche und Später; zehn Beispielaufgaben als breite Zeilen. +- Zeile: Auswahl, Prioritätsmarker, Titel + Objekt, Frist, Status, Ursprung, Avatar und Mehr-Menü. +- V2 ergänzt Priorität `Kritisch`; Herkunftswerte sind Manuell, Automation und Projekt. + +Komponenten: `ToggleGroup`, `FilterBar`, `DropdownMenuMultiSelect`, `DropdownMenuSelect`, `Checkbox`, `Button`, `IconButton`, `BadgeFeedback`, `Tag_Label` und `Avatar`. + +Aktionen im JSX: 28 leere Handler. Sichtbar sind Bearbeiten, Erledigen, Fälligkeit ändern und Löschen; ein aktiver Auswahlzähler und die destruktive Bulk-Aktion fehlen. + +### Auswahlrunde und Löschhistorie · 2026-08-22 + +Auf Basis der damaligen validierten Zusammenführung wurden drei **neue** Versuche angelegt. Die bestehenden Seiten V1 und V2 wurden dabei weder bearbeitet noch umbenannt. Alle drei Kandidaten wurden vollständig gelesen und als komplette Desktop-Seite (`1440 × 900`) gerendert. David wählte anschließend **Kandidat B als damaligen finalen S01-Screen**; A und C wurden am selben Tag ohne bestehende Referenzen aus Subframe gelöscht. Dieser historische Zwischenbestand umfasste V1, V2 und B; heute gilt B3 aus dem Kopf dieser Datei. + +Gemeinsamer Stand aller drei Versuche: + +- Kompakter V2-Header mit `Meine / Von mir erstellt / Alle` und vollständig sichtbarer Primäraktion `Neue Aufgabe`. +- Maximalansicht mit Filterzeile, zwei ausgewählten Aufgaben, vollständiger Bulk-Leiste, Tabelle und Footer. +- Spaltenfolge `Auswahl | Aufgabe | Priorität | Fälligkeit | Verknüpfung | Verantwortlich | Status | Tags | Aktionen`; keine Herkunftsspalte. +- Beispielinhalte decken `Kritisch`, rote überfällige Fristen, Verknüpfungstyp + Name + ID, Personen, Status, maximal zwei Tags, `+N` und `–` ab. +- Mehr-Menü ausschließlich `Öffnen`, `Duplizieren`, `Löschen`; keine Aktion `Wieder öffnen` und keine Fälligkeitsgruppen oder großes Warnbanner. +- Filter-, Tabellen-, Auswahl-, Dropdown-, Badge-, Avatar-, IconButton-, BulkActionBar- und Pagination-Komponenten sind sichtbar; alle Outcomes bleiben statische Designzustände ohne verdrahtete Produktlogik. +- Beziehungen bleiben dieselben: Zeile/Titel → S02, `Neue Aufgabe` → M01, Verknüpfung → ihr Objekt; im JSX sind diese Ziele noch nicht verdrahtet. +- Dokumentierter Development-Abgleich: Herkunftsfilter exakt `Manuell / Chat / Formular / Automation`; `Ohne Zuordnung` aus Verantwortlich entfernen; mindestens ein Gruppenbeispiel ergänzen; grünen Häkchen-Button mit echtem Tooltip und zugänglichem Namen versehen; rechte Aktionsspalte responsiv im Desktop-Viewport halten. Diese Punkte blockieren Davids 80/20-Freigabe von B nicht. + +#### Kandidat A — Ausgewogen · gelöscht + +Ehemalige UUID: `ab60b95d-dab5-47d9-b94c-6ba2f3898dfb` · Datei: `S01KandidatAAusgewogen.tsx` · 2.442 Zeilen · gelöscht am 2026-08-22 · Wiederherstellung nur über die Subframe-Projektversionshistorie + +![Subframe-Screenshot Kandidat A](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/ab60b95d-dab5-47d9-b94c-6ba2f3898dfb-1787418552287.png) + +- Ruhige, ausgewogene Dichte und die beste Auswahlrückmeldung: selektierte Zeilen sind zusätzlich blau hinterlegt. +- Footer und Seite-1-Pagination sind plausibel; `Zurück` ist deaktiviert. +- Inline-Bearbeitbarkeit ist visuell zu schwach erkennbar; editierbare Werte wirken überwiegend wie statische Badges oder Text. +- Die Aktionsspalte liegt rechts vollständig außerhalb des sichtbaren Desktop-Bereichs. + +#### Kandidat B — Kompakt · final gewählt + +UUID: `2f04954a-ff39-40ca-ac16-1f1771c7d9e7` · Datei: `S01KandidatBKompakt.tsx` · 1.780 Zeilen beim finalen Readback · [Subframe öffnen](https://app.subframe.com/f023064a5ca0/design/2f04954a-ff39-40ca-ac16-1f1771c7d9e7/edit) + +![Finaler Subframe-Readback Kandidat B](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/2f04954a-ff39-40ca-ac16-1f1771c7d9e7-1787419996433.png) + +- Kompakteste Power-User-Richtung und deutlich beste Inline-Affordances: Priorität, Fälligkeit, Verantwortlich, Status und Tags signalisieren ihre Bearbeitbarkeit. +- Der Filterbereich zeigt die Standardsuche und zusätzlich einen redundanten Filterchip `Suche`; einer davon muss entfallen. +- Ausgewählte Zeilen sind nur an ihren Checkboxen erkennbar; die klare blaue Auswahlfläche aus A fehlt. +- Tags und Aktionsspalte clippen rechts; außerdem ist `Zurück` auf Seite `1 / 25` fälschlich aktiv. + +#### Kandidat C — Klar gegliedert · gelöscht + +Ehemalige UUID: `372adea7-3069-451e-b66a-c86aba1a1241` · Datei: `S01KandidatCKlarGegliedert.tsx` · 2.315 Zeilen · gelöscht am 2026-08-22 · Wiederherstellung nur über die Subframe-Projektversionshistorie + +![Subframe-Screenshot Kandidat C](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/372adea7-3069-451e-b66a-c86aba1a1241-1787418574848.png) + +- Ruhigste Gliederung und großzügigste Lesbarkeit; Seite-1-Pagination ist korrekt deaktiviert. +- Auswahlrückmeldung bleibt auf die Checkboxen beschränkt und Inline-Bearbeitbarkeit ist kaum sichtbar. +- Die grünen Erledigt-Buttons sind am rechten Rand sichtbar, die zugehörigen Mehr-Menüs werden jedoch abgeschnitten. +- Die zusätzliche Luft verbessert die Hierarchie, liefert gegenüber A und B aber keinen entsprechend großen Bedienvorteil. + +## Zustände und Rollen + +| Thema | Subframe-Stand | Abgleich | |---|---|---| -| Leer | »Keine offenen Aufgaben — schöne Sache« | Nur dokumentieren | -| Laden | Skeleton (A7) | Wiederverwenden | -| Fehler | A7-Fehlerzustand | Wiederverwenden | +| Befüllte Liste | ausschließlich B aktuell in Subframe | final; A/C und V1/V2 gelöscht | +| Bulk-Auswahl | B zeigt zwei ausgewählte Zeilen, Auswahlzähler und vollständige aktive Bulk-Leiste | finaler Maximalzustand | +| Empty State | V1 hat nur `emptyText="Keine Aufgaben gefunden"`; V2 keinen sichtbaren Empty State | bewusst zurückgestellt; kein eigener Screen im 80/20-Scope | +| Loading / Error | nicht vorhanden | bewusst zurückgestellt; kein eigener Screen im 80/20-Scope | +| Überfällig | B zeigt rote Fristen plus kompakten Zähler ohne Banner oder Gruppen | finaler 80/20-Zustand; Filterlogik im Development | +| Archiviert | B zeigt den Filter `Archiviert` | vorhanden; Verhalten im Development | +| Rechte | »Alle« und Aktionen erscheinen ohne Gate | `tasks.read_all` und `tasks.*` fehlen | +| Herkunft | B zeigt Herkunft als Filter, nicht als Spalte | Struktur final; exakter Wertkatalog im Development | +| Tags | B zeigt die Standardspalte direkt nach Status | finaler Tabellenaufbau; maximal zwei Tags plus `+N`/`–` | -## Permissions / Gates +## UX-/Produktbewertung -`tasks.*` — Aktions-Knöpfe rechte-abhängig; Preset »Alle« gegated. +Historische Richtung: Kandidat B (`2f04954a-ff39-40ca-ac16-1f1771c7d9e7`) war die damalige Auswahl und wurde später durch den heute finalen B3-Screen aus dem Kopf dieser Datei ersetzt. -## Subframe +- V1 ist als Tabellenbasis vollständiger für tägliche Bearbeitung und Bulk-Arbeit: klare Spalten, aktiver Auswahlzustand und Verknüpfungsdetails sind direkt prüfbar. +- V2 liefert den ruhigeren, kompakteren Header und ordnet Bereichswechsel und Primäraktion überzeugender an. +- Der vom Screenshot bestätigte Button `Neue Aufgabe` ist vollständig sichtbar; der frühere Abschneide-Befund war falsch und ist zurückgezogen. +- V2 verliert im Vergleich zu V1 die klare Auswahlrückmeldung und die destruktive Bulk-Aktion. +- V1 ist sehr kontroll-lastig und zeigt gleichzeitig Banner, Tabs, Filter, Bulk-Bar und Tabelle; die Hierarchie wirkt dadurch schwerer. +- Kandidat B setzt die validierte Zusammenführung am überzeugendsten für die tägliche Tabellenarbeit um, weil die fünf editierbaren Spalten als Controls erkennbar sind. David hat diese Richtung am 2026-08-22 final bestätigt. +- Kandidat A und C sowie die alten Seiten V1/V2 werden nicht weitergeführt und wurden gelöscht. +- Rollen-/Permission-Verhalten und Archiv bleiben bekannte Development-Themen. Empty/Loading/Error sind für S01 bewusst aus dem aktuellen 80/20-Designscope genommen; die Button-Outcomes sind dagegen validiert. -- (erst nach explizitem OK) +Der aktuelle B-Screen ist als 80/20-Designstand akzeptiert und wird nicht ohne neue konkrete Freigabe bearbeitet. Der globale Feld- und Aktionsvertrag bleibt für die Entwicklung verbindlich; insbesondere korrekte Herkunftswerte, Nie-unzugewiesen-Regel, Gruppenbeispiel, Tooltip und responsive Einpassung der rechten Aktionen werden im Development umgesetzt, sofern David keine weitere Designrunde verlangt. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S02 Aufgaben-Detail.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S02 Aufgaben-Detail.md index 3adcecdf..29a0d0b6 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S02 Aufgaben-Detail.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S02 Aufgaben-Detail.md @@ -5,50 +5,183 @@ ticket: D-P4 package: WF-P4 Aufgaben id: S02 screen: Aufgaben-Detail -typ: Detail +typ: Route-gebundenes Vollbild-Modal umsetzung: Bauen -status: Validiert +status: Fertig / Development-Handoff route: "/tasks/:id" -subframe: "" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 --- # S02 — Aufgaben-Detail -## Ziel +> [!info] Subframe ist UI-Quelle +> [Versuch 4 · Verlauf im Fokus](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit) (`b4e91d35-0d28-43d1-941e-e67a7ec3d834`) ist seit 2026-08-23 die **finale S02-Basis**. Die Seite wurde nicht umbenannt. Ergänzende Interaktionsmodals liegen als eigene Seiten im selben Flow `WF-P16 Aufgaben`. + +> [!note] Ergänzte Interaktionswege · 2026-08-23 +> Kopfmenü `Löschen` → [[M02-M09 Interaktionsmodals#M02 · Aufgabe löschen]]; `Erledigen` bei offenen Punkten → [[M02-M09 Interaktionsmodals#M06 · Offene Punkte bestätigen]]; `+ Verknüpfung` → [[M02-M09 Interaktionsmodals#M03 · Verknüpfung hinzufügen]]; Zeilenaktion `Verknüpfung auflösen` → [[M02-M09 Interaktionsmodals#M04 · Verknüpfung lösen]]; `Notiz hinzufügen` → [[M02-M09 Interaktionsmodals#M07 · Notiz hinzufügen]]; beide Datei-Einstiege → [[M02-M09 Interaktionsmodals#M08 · Datei hinzufügen]]; Dateizeilenaktion `Entfernen` → [[M02-M09 Interaktionsmodals#M08b · Anhang entfernen]]. Empty-, Error-, Uploadfortschritts-, Autosave-, Erfolgs- und Undo-Zustände stehen ausschließlich in [[Z01 Zustände und Feedback]]. + +## Ziel und validierte Planung Eine Aufgabe komplett verstehen und direkt bearbeiten. -## Pattern / Archetyp +> [!success] Finale S02-Basis · 2026-08-23 +> **Versuch 4 · Verlauf im Fokus ist final bestätigt.** Das manuell verfeinerte Grunddesign, der vollständige Beispieldatensatz, die Spaltenaufteilung und die Reihenfolge der Bereiche blieben erhalten. Geändert wurden ausschließlich die betroffenen Dropdown-/Menü-Nodes. S02 bleibt ein route-gebundenes Vollbild-Modal über dem Ausgangskontext; die URL bleibt `/tasks/:id`, damit Direktlink, Zurück-Navigation und Neuladen funktionieren. -A3 Detail. +> [!note] Globaler Vertrag +> Feldbedeutung und Bearbeitungsregeln folgen verbindlich [[WF-P4 Aufgaben#Globaler Aufgaben-Feldvertrag · kanonische Quelle]]. S02 stellt den vollständigen Vertrag dar. -## Daten +- Titel, Markdown-Beschreibung, Status, Priorität und Frist direkt änderbar. +- Zuständigkeit: Person **oder** Gruppe, genau eines; expliziter Wechsel im Picker. +- Verknüpfung zu Kontakt, Organisation, Lead oder Projekt; Beobachter, Tags, Erinnerungen und Anhänge; systemseitige Herkunft mit Link zur konkreten Quelle. +- Verlauf als Activity Stream. +- Aktionen: `Erledigen` als direkte grüne Kopfaktion; Wiederöffnen über das editierbare Statusfeld; Duplizieren und Löschen im Mehr-Menü, Löschen mit Klartext-Warnung. +- Fremde Aufgabe führt auch bei fehlendem Recht bewusst auf 404. -- Titel · Beschreibung (Markdown) · Status/Priorität/Frist direkt änderbar -- Zuständig: Umschalter **Person ↔ Gruppe** (genau eines) -- Verknüpfung (Auto-Complete: Kontakt/Organisation/Lead/Projekt) · Beobachter -- Herkunft mit Link zur Quelle (Chat-Nachricht, Formular, Automation) -- Verlauf (Activity-Stream) +## Validiertes Zielbild für die Überarbeitung -## Aktionen +### Modal, Route und Grundaufbau -- Erledigen / Wieder öffnen · Duplizieren · Löschen (mit Klartext-Warnung) +- Für S02 gilt die von David freigegebene Fullscreen-Ausnahme: Die vorhandene Projektkomponente `Dialog Fullscreen` ist in der finalen Basis die direkte äußere Wurzel; kein zusätzliches `DialogLayout`, `Dialog` oder `Dialog.Content` wird darum verschachtelt. +- Route bleibt `/tasks/:id`; Öffnen aus Liste, Drawer oder Einbettung legt das Modal über den Ausgangskontext. Schließen führt dorthin zurück. +- Kopf und Banner laufen über die volle Modalbreite; darunter ist der Inhalt zweigeteilt. +- **Links** steht die schmalere, beim Scrollen sichtbare Eigenschaftsspalte: Status, Priorität, Frist + Uhrzeit, Verantwortlich, Tags, Beobachter, Erinnerung, Herkunft sowie Ersteller/Erstellzeit. Alle nutzeränderbaren Werte sind dort direkt bedienbare Controls; nur Systemfelder bleiben lesend. +- **Rechts** steht die breitere Arbeitsfläche: Beschreibung/Checkliste, Anhänge, Verknüpfungen und Verlauf. -## Banner / Hinweise +> [!note] Korrigierte Spaltenzuordnung · 2026-08-22 +> Der zuvor dokumentierte Zwischenstand `Inhalt links / Eigenschaften rechts` ist ersetzt. David hat ausdrücklich `Eigenschaften links / Beschreibung, Verknüpfungen und Verlauf rechts` festgelegt. -- Überfällig · Zuständiger deaktiviert (+ »neu zuweisen«) · »wird in 30 Tagen archiviert« · Verknüpfung gelöscht +### Direkte Bearbeitung der linken Eigenschaften -## Zustände +- Es gibt keinen globalen `Bearbeiten`-Modus. Der aktuelle Wert selbst ist das Control und wird direkt in seiner Zeile geändert. +- Dropdowns und Picker müssen als solche erkennbar sein, etwa durch Chevron, Hover-/Focus-Zustand und eine ausreichend große anklickbare Fläche. +- Leere optionale Werte zeigen eine klare Aktion wie `Auswählen` oder `Hinzufügen` statt eines nicht bedienbar wirkenden Gedankenstrichs. -| Zustand | Beschreibung | Umsetzung | +| Eigenschaft | Control in S02 | +|---|---| +| Status | Dropdown: `Offen`, `In Bearbeitung`, `Erledigt` | +| Priorität | Dropdown: `Niedrig` grün, `Mittel` gelb, `Hoch` rot, `Kritisch` violett — jeweils links der Vier-Strich-`ProjectCard.PriorityIndicator`, rechts der `ProjectCard.PriorityBadge` | +| Frist + Uhrzeit | DatePicker plus optionaler TimePicker | +| Verantwortlich | durchsuchbarer Picker für genau eine Person oder Gruppe; nie leer | +| Tags | Multi-Select zum Hinzufügen und Entfernen | +| Beobachter | Multi-Select für Personen | +| Erinnerung | Dropdown/Picker für Zeitpunkt beziehungsweise `Keine` | +| Herkunft | systemseitig und nicht editierbar; außer `Manuell` als Link zur Quelle | +| Ersteller / Erstellzeit | systemseitig und nicht editierbar | + +Freie Texte bleiben ebenfalls direkt bearbeitbar: Titel im Inline-Edit-Stack, Beschreibung im Editor rechts. Falls später weitere textbasierte Eigenschaften hinzukommen, erhalten auch sie ein Inline-Textfeld statt eines separaten Bearbeiten-Modus. + +Der in Subframe umgesetzte Dropdown-Vertrag: + +- Status: Trigger und Optionen als passende Badges — `Offen` warning, `In Bearbeitung` information, `Erledigt` positive. +- Priorität: Trigger, alle vier Optionen und Prioritätswechsel im Verlauf verwenden die vorhandenen `ProjectCard.PriorityBadge`-Varianten — `Niedrig` grün (`low`), `Mittel` gelb (`medium`), `Hoch` rot (`high`), `Kritisch` violett (`critical`). Links vor jedem Badge steht zusätzlich die passende Vier-Strich-Subkomponente `ProjectCard.PriorityIndicator`. +- Verantwortlich: genau eine Person oder Gruppe, nie leer; aktuell bleibt Markus Weber gewählt. Personen zeigen Avatar und Rolle, Gruppenoptionen enthalten mindestens `Projektteam` und `Anlagenbau`. +- Fälligkeit: klares Datums-Dropdown; `Uhrzeit hinzufügen` bleibt separat erhalten. +- Tags und Beobachter: echte durchsuchbare Checkbox-Multi-Selects; Beobachter zeigen Avatar und Rolle. +- Erinnerung: übliche Zeitpunkte plus `Keine Erinnerung`. +- `Text` in der Editorleiste und `Neueste zuerst` im Verlauf: echte Dropdowns. + +### Kopf, editierbarer Titel und Banner + +- Kopf mit Schließen, editierbarem Titel, grünem `Erledigen` und Mehr-Menü. +- Der Titel liegt in einem kompakten, dezent umrandeten Inline-Edit-Stack mit Stift-Icon; die gesamte Fläche ist anklickbar. Damit ist die Bearbeitbarkeit erkennbar, ohne dauerhaft wie ein schweres Formularfeld zu wirken. +- Das V1-Überfällig-Banner wandert direkt **unter Titel/Kopf** und vor den Arbeitsinhalt. Der generische Link `Aktion` entfällt; ein CTA wird nur gezeigt, wenn er ein konkretes Outcome besitzt. + +### Beschreibungseditor + +- Direkt über der Schreibfläche liegt eine kompakte Editorleiste nach dem visuellen Muster von P7 [M07 E-Mail schreiben](<../../../P7 Leads/WF-P7 Leads/Screens/M07 E-Mail schreiben.md>) / [V07 E-Mail Vollbild](<../../../P7 Leads/WF-P7 Leads/Screens/V07 E-Mail Vollbild.md>). +- Für Aufgaben enthält sie die relevanten Werkzeuge: Textstil, Fett, Kursiv, Durchgestrichen, Aufzählung, nummerierte Liste, Checkliste, Ein-/Ausrücken, Link und Anhang. +- Mail-spezifische Werkzeuge wie Schriftfamilie/-größe, Textfarbe, Ausrichtung, Bild, Kalender, Variablen, Tabelle und Vorschau werden nicht übernommen. +- Beschreibung und Checkliste bleiben ein gemeinsamer Markdown-Inhalt. Autosave, Dirty State und Save-Fehler sind Development-Logik und benötigen für den 80/20-Review keinen separaten Subframe-State. + +### Anhänge + +- Der Abschnitt `Anhänge` steht rechts direkt unter der Beschreibung und vor den Verknüpfungen. +- Rechts im Abschnittskopf steht der kleine Button `+ Datei hinzufügen`. Zusätzlich dient der gesamte Anhangsbereich als klar erkennbare Drag-and-drop-Zone. +- Vorhandene Dateien erscheinen als kompakte Zeilen in einem stabilen Raster: `Dateityp-Icon + Dateiname | Größe | Hochgeladen von | Datum · Uhrzeit | Mehr-Menü`. +- Dateiname und Icon bilden die primäre Information; Größe, hochladende Person sowie Datum und Uhrzeit bleiben als ruhige Metadaten an festen Positionen vergleichbar. +- Das Drei-Punkte-Menü enthält die eindeutigen Aktionen `Öffnen`, `Herunterladen` und `Entfernen`. Entfernen löst nur den Anhang von dieser Aufgabe. +- Die Anhang-Schaltfläche im Beschreibungseditor und `+ Datei hinzufügen` führen in denselben Upload-Ablauf. Uploadfortschritt und Fehlerbehandlung werden im Development umgesetzt und benötigen im 80/20-Review keinen eigenen Subframe-State. + +### Verknüpfungszeilen + +- Die Abschnittsüberschrift `Verknüpfungen` erhält rechts den kleinen Button `+ Verknüpfung`. +- Der Button öffnet eine gemeinsame durchsuchbare Auswahl für `Projekt`, `Kontakt`, `Organisation` und `Lead`; die Auswahl wird anschließend als neue Zeile im selben Muster ergänzt. +- Das kompakte Zeilenmuster aus V1 bleibt erhalten; die Verknüpfungen werden **nicht** zu einer zusammengefassten Hauptkarte und nicht zu den großen V2-Karten umgebaut. +- Jede Zeile folgt derselben Struktur: `Icon + Art | verlinkter Name | optionale Objekt-ID | Mehr-Menü`. +- Die linke Spalte für `Projekt`, `Kontakt`, `Organisation` oder `Lead` hat in allen Zeilen dieselbe feste Breite. Dadurch beginnen alle verlinkten Namen auf derselben Achse und die Arten lassen sich schneller unterscheiden. +- Der Datensatzname ist ein Link und öffnet den jeweiligen Datensatz. Eine vorhandene Objekt-ID bleibt rechts davon dezent sichtbar. +- Ganz rechts steht pro Zeile ein Drei-Punkte-Menü. Es enthält die eindeutige Aktion `Verknüpfung auflösen`; sie entfernt nur diese Verbindung, nicht die Aufgabe und nicht den verknüpften Datensatz. +- Beim Anlegen bleibt genau eine primäre Verknüpfung auswählbar und aus dem Objektkontext vorbefüllt. S02 darf daneben weitere Kontext-Verknüpfungen als eigene Zeilen zeigen und verwalten. + +### Verlauf als aufsteigende Timeline + +- Der Verlauf bleibt rechts unter den Verknüpfungen direkt sichtbar und wird nicht standardmäßig in einem Accordion versteckt. +- Die zeitliche Richtung ist ausdrücklich **von unten nach oben**: ältere Ereignisse stehen unten, das neueste Ereignis oben. Im Abschnittskopf ist `Neueste zuerst` ein Sortier-Dropdown mit `Älteste zuerst` als Alternative; `Ältere Einträge anzeigen` steht am unteren Ende. +- Datumstrenner wie `Heute`, `Gestern` oder `21.08.2026` gliedern längere Verläufe. Innerhalb eines Datums steht die neueste Uhrzeit zuerst. +- Jeder Eintrag nutzt dasselbe feste Raster: `Profilbild/System-Icon | Akteur + Ereignis | Datum + Uhrzeit`. +- Menschen werden immer mit Profilbild dargestellt; falls keines vorhanden ist, mit Initialen-Avatar. Automationen und Systemaktionen erhalten ein eindeutig unterscheidbares Icon. +- Neben dem Avatar stehen der Akteursname und die konkrete Aktion, zum Beispiel `David Bertram hat den Status geändert`; bei Feldänderungen folgt darunter der verständliche Vergleich `Offen → In Bearbeitung`. +- Datum und Uhrzeit stehen bei jedem Eintrag in einer festen, rechtsbündigen Spalte im Format `22.08.2026 · 14:32`. Dadurch springen Zeitangaben auch bei unterschiedlich langen Namen und Texten nicht. + +> [!success] Feinschliff abgeschlossen · 2026-08-23 +> Die vier doppelten Datumzeilen wurden gezielt entfernt. Pro Ereignis bleibt genau die feste Zeitangabe `Datum · Uhrzeit`; Datumstrenner und Sortierung blieben unverändert. + +## Vollständiger Subframe-Bestand + +### Finale Basis + +| Seite | UUID | Status | Direktlink | +|---|---|---|---| +| S02 Fullscreen Versuch 4 · Verlauf im Fokus | `b4e91d35-0d28-43d1-941e-e67a7ec3d834` | **finale S02-Basis 2026-08-23** | [Subframe öffnen](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit) | + +Versuch 4 verwendet weiterhin `Dialog Fullscreen` als direkte Wurzel. Titel, Beschreibung, vierteilige Checkliste, drei Anhänge, drei Verknüpfungen, vier Verlaufsereignisse und die gesamte Spalten-/Bereichsstruktur blieben unverändert. Der erneute Gesamt-Render war vollständig; Anhänge, Verknüpfungen und Verlauf wurden zusätzlich über Node-Captures und den vollständigen JSX-Readback geprüft. + +### Gelöschte S02-Seiten + +Alle sechs Löschungen erfolgten am 2026-08-23 mit `force:false`; Subframe meldete jeweils keine Referenzen. Gelöschte Seiten bleiben nur als UUID-Protokoll erhalten und sind nicht mehr verlinkt. + +| Seite | UUID | +|---|---| +| S02 Fullscreen Versuch 1 · Ausgewogen | `edaa3c80-5661-4941-bee6-720d6e82311b` | +| S02 Fullscreen Versuch 2 · Kompakt | `4f50b0da-ed0d-4efd-8fb4-c6268288a162` | +| S02 Fullscreen Versuch 3 · Ruhige Sektionen | `6d371a0c-dad1-464b-9f53-a014a82870df` | +| S02 Fullscreen Versuch 5 · Editorial | `06bf95c5-b004-4c8e-9056-92cfda59698d` | +| S02 Aufgaben-Detail V1 | `04618fe2-bf23-4cd5-b83e-ac9cb176581a` | +| S02 Aufgaben-Detail V2 | `1f2a06d4-88bc-4374-ba1f-0b1a35179c91` | + +Die fünf älteren technischen Zwischenentwürfe (`41d0c5b6-5841-49c3-a76b-35e2ffaf46f2`, `ae5f65a2-e001-4f1d-8532-560d54478f23`, `ef0c4006-5241-48b2-b7b5-9251c557c6c6`, `62a89897-29a2-4c12-bdae-d12b65fdff2d`, `15ce9185-ddcc-43ba-b0e6-43bc3680e135`) waren bereits vor dem 14-Seiten-Ausgangsbestand nicht mehr im Flow. + +## Zustände, Rollen und fehlende Arbeitsschritte + +| Thema | Subframe-Stand | Abgleich | |---|---|---| -| Nicht gefunden | 404 auch bei fehlendem Recht (Dev-Vorgabe) | Wiederverwenden | -| Laden / Fehler | A7 | Wiederverwenden | +| Container/Route | finale Basis mit direkter `Dialog Fullscreen`-Wurzel | Route und Zurück-Navigation bleiben Development-Logik | +| Editierbarer Titel | in Versuch 4 als umrandeter Stack mit Stift gebaut | erfüllt | +| Überfällig | Banner direkt unter dem Kopf und ohne `Aktion` | erfüllt | +| Anhänge | drei vollständige Dateizeilen, Button, Dropzone und funktionale Zeilenmenüs mit Öffnen/Herunterladen/Entfernen | erfüllt; Uploadlogik im Development | +| Verknüpfungen | kompakte Zeilen mit fester Art-Spalte, Link, ID und Zeilenmenü mit Öffnen/Auflösen | erfüllt; Such-/Auflöse-Logik im Development | +| Verlauf | rechts sichtbar, neueste oben, mit Avataren/Systemicon, vollständigen Zeitstempeln und Sortier-Dropdown | erfüllt; doppeltes Datum bereinigt | +| Zuständiger deaktiviert | fehlt | Banner + »neu zuweisen« bauen/dokumentieren | +| Archiv in 30 Tagen | fehlt | Banner fehlt | +| Verknüpfung gelöscht | fehlt | Banner fehlt | +| 404 / Permission | fehlt | wiederverwendbaren 404-State verknüpfen | +| Loading / Error | fehlt | A7 verknüpfen | +| Status/Priorität/Frist bearbeiten | Badge-Optionen und Datums-Dropdown in Versuch 4 umgesetzt; Prioritätsfarben und Vier-Strich-Indikatoren folgen exakt den beiden ProjectCard-Subkomponenten | Mutation im Development | +| Person/Gruppe | Markus Weber bleibt gewählt; Personen mit Avatar/Rolle sowie Projektteam und Anlagenbau als Gruppenoptionen | Person-oder-Gruppe-Regel erfüllt; Mutation im Development | +| Herkunft | `Automation` mit Link `Vorlage Förderzusage` gebaut | erfüllt | +| Löschen | Menüeintrag | Klartext-Warnung / Bestätigung fehlt | +| Tags / Beobachter / Erinnerung | durchsuchbare Checkbox-Multi-Selects beziehungsweise Erinnerungs-Dropdown inklusive `Keine Erinnerung` | Mutation im Development | +| Beschreibungseditor | reduzierte Aufgaben-Toolbar mit echtem Format-Dropdown | Persistenzlogik im Development | -## Permissions / Gates +## UX-/Produktbewertung -Aktions-Knöpfe rechte-abhängig; fremde Aufgaben → 404. +Entscheidung: **Versuch 4 · Verlauf im Fokus bleibt die finale S02-Basis.** -## Subframe - -- (erst nach explizitem OK) +- Das bestätigte manuelle Grunddesign wurde nicht neu aufgebaut; ausschließlich betroffene Node-Subtrees wurden mit `edit_page` ersetzt. +- Statusoptionen nutzen konsistente Feedback-Badges; Priorität nutzt in Trigger, Optionen und Verlauf dieselben `ProjectCard.PriorityBadge`- und `ProjectCard.PriorityIndicator`-Varianten wie die Projektkarte. +- Verantwortlich erfüllt die Nie-leer-/Person-oder-Gruppe-Regel und enthält sichtbare Gruppenoptionen. +- Fälligkeit, Tags, Beobachter, Erinnerung, Editorformat und Verlaufssortierung sind als echte Dropdown-/Multi-Select-Strukturen hinterlegt. +- Kopf-, Anhang- und Verknüpfungsmenüs enthalten weiterhin die vereinbarten Aktionen. +- Sämtliche Parser-Warnungslisten waren leer. Der Live-Klicktest konnte in dieser Sitzung mangels verbundenem Browser nicht automatisiert werden; Struktur und geschlossene Trigger wurden über Readback/Render geprüft. +- Zeitspalte bereinigt: pro Eintrag nur noch `Datum · Uhrzeit`, ohne zusätzliche doppelte Datumzeile. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S03 Aufgaben-Drawer.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S03 Aufgaben-Drawer.md index 357e74c6..a3782204 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S03 Aufgaben-Drawer.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/S03 Aufgaben-Drawer.md @@ -7,49 +7,98 @@ id: S03 screen: Aufgaben-Drawer typ: Drawer umsetzung: Bauen -status: Validiert +status: Fertig / Development-Handoff route: "Topbar, global" -subframe: "" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 --- # S03 — Aufgaben-Drawer -## Ziel +> [!info] Subframe ist UI-Quelle +> **Aktueller und abgeschlossener Drawer:** [S03 öffnen](https://app.subframe.com/f023064a5ca0/design/c7978061-8467-49d9-adf3-614301843bb2/edit) (`c7978061-8467-49d9-adf3-614301843bb2`). Die unten beschriebenen V1/V2-Seiten sind nur noch Entscheidungshistorie und nicht mehr Teil des aktuellen Flows. -Schnellzugriff auf die eigenen Aufgaben von überall — ohne die aktuelle Seite zu verlassen. **Davids Ergänzung über das Ticket hinaus (Delta).** +## Finaler Stand · 2026-08-23 -## Pattern / Archetyp +- Der Kopf zeigt `Meine Aufgaben`; darunter macht ein kompakter roter Hinweis die zwei überfälligen Aufgaben sichtbar. Der finale Drawer verwendet keine Tabs. +- Aufgaben sind nach `Überfällig`, `Heute` und `Diese Woche` farbig getrennt; weitere Gruppen folgen demselben kompakten Muster. +- Ein Klick auf die Aufgabe öffnet das Accordion ohne seitlichen Chevron und ohne graue Accordion-Fläche. +- Die Kreisaktion zum Erledigen bleibt links. Die Navigation in die große Aufgabenansicht sitzt im festen Footer und heißt `Vollansicht` statt `Alle Aufgaben`. +- Verknüpfung steht unter dem Titel im klaren S03A2B-Muster. Datum und Priorität stehen rechts untereinander; `Kritisch` gehört zum Prioritätskatalog. +- Erledigen mit offenen Punkten verwendet [[M02-M09 Interaktionsmodals#M06 · Offene Punkte bestätigen]]. Feedback, Undo, Empty und Fehler stehen nur in [[Z01 Zustände und Feedback]]. -Drawer rechts, geöffnet über einen Topbar-Button (analog Glocken-Drawer aus WF-P3 — gleiches Drawer-Muster). +## Ziel und validierte Planung -## Daten +> [!note] Globaler Vertrag +> Feldbedeutung und Bearbeitungsregeln folgen verbindlich [[WF-P4 Aufgaben#Globaler Aufgaben-Feldvertrag · kanonische Quelle]]. S03 zeigt davon nur die für den Schnellzugriff nötige Teilmenge. -- Meine offenen Aufgaben, überfällige oben (rot) -- Zeile kompakt: Titel · Frist · Prioritäts-Marker · verknüpfte Entität +Schnellzugriff auf die eigenen offenen Aufgaben von überall, ohne die aktuelle Seite zu verlassen. Der Topbar-Button plus Drawer ist Davids validiertes Delta über das Ticket hinaus. -## Aktionen +- Rechter Drawer nach dem Muster des Glocken-Drawers. +- Eigene offene Aufgaben; überfällige zuerst. +- Kompakte Zeile: Titel, Frist, Priorität und verknüpfte Entität. +- Eintrag → [[S02 Aufgaben-Detail]]; Haken → erledigt; Neue Aufgabe → [[M01 Aufgabe anlegen]]; Alle Aufgaben → [[S01 Aufgaben-Liste]]. +- Keine zusätzlichen Rollen-Gates, weil nur eigene Aufgaben sichtbar sind. -- Tipp auf Eintrag → [[S02 Aufgaben-Detail]] -- Erledigt-Haken direkt in der Zeile -- »Neue Aufgabe« → [[M01 Aufgabe anlegen]] -- »Alle Aufgaben« → [[S01 Aufgaben-Liste]] +## Historischer Subframe-Bestand -## Zustände +### V1 — breiter Drawer mit Warnbanner -| Zustand | Beschreibung | Umsetzung | +UUID: `8adb0de5-e41d-4900-98c5-c93aef859dbd` · Datei: `S03AufgabenDrawerV1.tsx` · 357 Zeilen + +![Subframe-Screenshot V1](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/8adb0de5-e41d-4900-98c5-c93aef859dbd-1787355877715.png) + +Sichtbar: + +- Breiter rechter Drawer mit Overlay, Kopf »Meine Aufgaben« und Schließen. +- Rotes Warnbanner »2 Aufgaben überfällig«. +- Gruppen Überfällig, Heute, Diese Woche und Später mit insgesamt acht offenen Aufgaben. +- Zweizeilige Karten; Beziehung links, Priorität und Datum rechts; Kreisaktion zum Erledigen. +- Footer `8 offene Aufgaben · 2 überfällig` und zwei gleichgewichtige Buttons »Neue Aufgabe« / »Alle Aufgaben«. + +Komponenten: `DrawerLayout`, `Button`, `IconButton` und Feather-Icons. Prioritätsmarker sind handgebaut, nicht `BadgeFeedback`. + +Aktionen im JSX: `onOpenChange` plus elf leere Click-Handler. Sichtbare Outcomes sind Schließen, Erledigen, Eintrag öffnen, Aufgabe anlegen und alle Aufgaben öffnen; sie sind nicht verdrahtet. + +### V2 — schmaler, konsistenter Schnellzugriff + +UUID: `23926d56-61b4-4798-8734-1557e0cb0160` · Datei: `S03AufgabenDrawerV2.tsx` · 365 Zeilen + +![Subframe-Screenshot V2](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/23926d56-61b4-4798-8734-1557e0cb0160-1787355929210.png) + +Sichtbar: + +- Schmalerer rechter Drawer; Kopf mit `7 offen · 2 überfällig` und Schließen. +- Gruppen Überfällig, Heute, Diese Woche und Später; insgesamt sieben Aufgaben. +- Drei Informationsebenen je Eintrag: Titel, Fälligkeit + Priorität, verknüpftes Objekt + ID. +- Überfällige Gruppe rot umrandet; kein separates Warnbanner. +- Fester Footer mit primärem »Neue Aufgabe« und Link »Alle Aufgaben öffnen«. + +Komponenten: `DrawerLayout`, `BadgeFeedback`, `Button`, `IconButton`, `LinkButton` und Feather-Icons. + +Aktionen im JSX: `onOpenChange` plus zehn leere Click-Handler. Die Beziehung zu S01/S02/M01 ist sichtbar, aber nicht verdrahtet. + +## Historische Zustände und offene Produktpunkte vor dem finalen S03 + +| Thema | Subframe-Stand | Abgleich | |---|---|---| -| Leer | »Keine offenen Aufgaben — schöne Sache« | Nur dokumentieren | -| Laden / Fehler | A7 | Wiederverwenden | +| Befüllt | V1 und V2 gebaut | vorhanden | +| Empty | fehlt | »Keine offenen Aufgaben — schöne Sache« + Anlegen-CTA | +| Loading / Error | fehlt | A7 wiederverwenden | +| Topbar-Button | nicht Teil der Seiten | Icon, Zähler und Überfällig-Badge separat validieren | +| Überfällig | V1 Banner, V2 Gruppierung | gemeinsames Muster festlegen | +| Liste lang | interner Scrollbereich vorhanden | Footer bleibt fix; Fokus-/Scrollverhalten prüfen | +| Direkter Haken | Kreis-Icon ohne Text | Ergebnis, Undo und Fehlerrückmeldung definieren | -## Permissions / Gates +## Historische UX-/Produktbewertung -Keine — zeigt nur eigene Aufgaben. +Empfehlung: **V2 behalten und gezielt überarbeiten; V1 später entfernen, noch nicht freigegeben**. -## Subframe +- V2 passt als globaler Schnellzugriff besser: schmaler, kompakter Kopf, klarer Primär-/Sekundärabschluss und standardisierte `BadgeFeedback`-Komponenten. +- V1 nutzt deutlich mehr Bildschirmbreite und lässt Footer-Aktionen gleich wichtig wirken, obwohl »Neue Aufgabe« die primäre Aktion ist. +- V2 braucht pro Eintrag drei Zeilen und wird bei langen Listen schneller hoch; Titel/Frist müssen beim Scannen trotzdem dominant bleiben. +- V1s separates Überfällig-Banner ist sehr deutlich, aber im Drawer wahrscheinlich redundant, wenn Gruppe, Farbe und Kopfzähler sauber zusammenarbeiten. +- Beide Varianten zeigen den auslösenden Topbar-Button und dessen Badge-Zustand nicht. Dieser fehlende Arbeitsschritt gehört zur Familie und muss vor Handoff ergänzt werden. +- Empty, Loading, Error, Erfolgs-Undo und Mutationsfehler fehlen. -- (erst nach explizitem OK) - -## Notizen - -- Offen: Zähler-Badge am Topbar-Button (offene/überfällige)? → Subframe-Bau -- Delta in `ticket-docs/D-P4.md` (»Davids Delta«) beim Handoff nachtragen +Empfohlene Überarbeitung auf V2: Topbar-Triggerzustände ergänzen, leeren/laden/fehlerhaften Drawer dokumentieren, Haken-Outcome mit Undo definieren und testen, ob zwei statt drei Textzeilen je Aufgabe für die häufigste Nutzung reichen. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/V01 Eingebettete Kompakt-Variante.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/V01 Eingebettete Kompakt-Variante.md index 0d6fda96..4f123c47 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/V01 Eingebettete Kompakt-Variante.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/V01 Eingebettete Kompakt-Variante.md @@ -7,42 +7,101 @@ id: V01 screen: Eingebettete Kompakt-Variante typ: Variante (wiederverwendbar) umsetzung: Bauen -status: Validiert +status: Fertig / Development-Handoff route: "Reiter in jeder Detailseite" -subframe: "" +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" +source_checked: 2026-08-23 --- # V01 — Eingebettete Kompakt-Variante -## Ziel +> [!success] Finaler Subframe-Bestand +> V01 besitzt zwei finale Repräsentationen: [A · Kompakte Tabelle](https://app.subframe.com/f023064a5ca0/design/7dd5df56-7cea-445b-91f2-29b9f1fbb407/edit) (`7dd5df56-7cea-445b-91f2-29b9f1fbb407`) und [Minimal · Sidebar-Liste](https://app.subframe.com/f023064a5ca0/design/841f9e3f-ca13-4fed-aac6-6977cea19a03/edit) (`841f9e3f-ca13-4fed-aac6-6977cea19a03`). Beide wurden im Abschlusslauf als Desktop gerendert. -Der Aufgaben-Reiter, der später in **jeder** Detailseite steckt (Kontakt, Organisation, Lead, Projekt) — vorgefiltert auf das Objekt. **Das Einbett-Muster für alle Features.** +## Finale Varianten -## Pattern / Archetyp - -Kompakte Ausführung von [[S01 Aufgaben-Liste]]: weniger Spalten, keine Presets (immer objektbezogen), gleiche Zeilen-Optik. - -## Daten - -- Aufgaben des Objekts: Titel · Frist · Prioritäts-Marker · Zuständig · Status - -## Aktionen - -- »Aufgabe anlegen« → [[M01 Aufgabe anlegen]] (Verknüpfung vorbefüllt) -- Zeile öffnen → [[S02 Aufgaben-Detail]] -- Erledigt-Haken in der Zeile - -## Zustände - -| Zustand | Beschreibung | Umsetzung | +| Seite | Einsatz | Kerneigenschaften | |---|---|---| -| Leer | »Noch keine Aufgaben zu diesem Eintrag« + Anlegen-Knopf | Nur dokumentieren | -| Laden / Fehler | A7 | Wiederverwenden | +| V01 A · Kompakte Tabelle | breite Detail-Reiter und datenreiche Einbettungen | Auswahl, Bulk-Leiste, Inline-Priorität/Fälligkeit/Verantwortlich/Status/Tags, Zeilenmenü | +| V01 Minimal · Sidebar-Liste | reduzierte Einbettungen mit geringerem Informationsbedarf | Gruppen Überfällig/Heute/Diese Woche/Erledigt, kompakte Accordion-Zeilen, aufklappbarer Aufgabentext, Priorität und Datum rechts | -## Subframe +Beide Varianten sind auf das aktuelle Objekt vorgefiltert. Empty/Error/Feedback bleibt auch für V01 ausschließlich in [[Z01 Zustände und Feedback]]. -- (erst nach explizitem OK) +## Ziel und validierte Planung -## Notizen +> [!note] Globaler Vertrag +> Feldbedeutung und Bearbeitungsregeln folgen verbindlich [[WF-P4 Aufgaben#Globaler Aufgaben-Feldvertrag · kanonische Quelle]]. V01 zeigt davon eine objektbezogene Teilmenge. -- Wird von den Feature-Paketen (D-CRM, D-P8 …) referenziert, nicht neu gebaut. +Der Aufgaben-Reiter, der in Kontakt-, Organisations-, Lead- und Projekt-Details wiederverwendet wird — immer auf das aktuelle Objekt vorgefiltert. + +- Kompakte Ausführung von [[S01 Aufgaben-Liste]], ohne globale Presets. +- Zeile: Titel, Frist, Priorität, Zuständig und Status. +- Aufgabe anlegen → [[M01 Aufgabe anlegen]] mit vorbefüllter Verknüpfung. +- Zeile öffnen → [[S02 Aufgaben-Detail]]; Haken → erledigt/wieder öffnen. +- Empty: »Noch keine Aufgaben zu diesem Eintrag« + Anlegen; Loading/Error über A7. + +## Historischer Subframe-Bestand vor den finalen Varianten + +### V1 — Einbettung im vollständigen Projektkontext + +UUID: `601d0110-9828-4eaa-8223-f36c2ce9acc4` · Datei: `V01EingebetteteAufgabenV1.tsx` · 876 Zeilen + +![Subframe-Screenshot V1](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/601d0110-9828-4eaa-8223-f36c2ce9acc4-1787355959112.png) + +Sichtbar: + +- Vollständiger Projektkopf `PV + Speicher Familie Wagner`, Projekt-ID, Status, Wert und Verantwortlicher. +- Tabs Details, Aufgaben, Aktivität und Dokumente; Aufgaben ist aktiv. +- Kopf `7 Aufgaben` und »Aufgabe hinzufügen«. +- Tabelle mit Aufgabe, Priorität, Fälligkeit, Verantwortlich, Status und Zeilenaktionen. +- Sieben Aufgaben; zwei überfällig, eine erledigt; Statuswerte Offen, In Bearbeitung und Erledigt. +- Direkter Haken und Mehr-Menü mit Detail öffnen, Bearbeiten, Fälligkeit ändern, Zuweisen, Löschen bzw. Wieder öffnen. +- `emptyText="Keine Aufgaben vorhanden"` ist im Table-Prop vorhanden, aber nicht sichtbar gerendert. + +Komponenten: `Table`, `Tabs`, `Checkbox`, `Button`, `IconButton`, `BadgeFeedback`, `Avatar`, `DropdownMenuSelect` und Subframe-Dropdown-Menüs. + +Aktionen im JSX: 14 leere Click- und sieben leere Checkbox-Handler. Der Screen beweist den Host-Kontext, ist aber als wiederverwendbarer Aufgaben-Body zu groß und dupliziert Projektkopf/Tabs. + +### V2 — objektneutraler kompakter Aufgaben-Body + +UUID: `8e57da9d-592b-4cd3-9e6f-a8f55ec31448` · Datei: `V01EingebetteteAufgabenV2.tsx` · 640 Zeilen + +![Subframe-Screenshot V2](https://egniatlvhajtqurt.public.blob.vercel-storage.com/prod/39410/screenshots/8e57da9d-592b-4cd3-9e6f-a8f55ec31448-1787355976175.png) + +Sichtbar: + +- Objektneutraler Kopf »Aufgaben« mit »Aufgabe hinzufügen«. +- Gruppen Offen (`5`) und Erledigt (`2`). +- Kompakte Zeilen: Checkbox, Titel, Frist, Priorität, Avatar und Mehr-Menü. +- Überfällige Fristen rot, heutige Frist orange, erledigte Titel durchgestrichen. +- Footer `7 Aufgaben · 2 überfällig · 2 erledigt`. +- Mehr-Menü: Detail öffnen, Erledigen/Wieder öffnen, Fälligkeit ändern, Priorität ändern und Löschen. + +Komponenten: `Checkbox`, `Button`, `IconButton`, `BadgeFeedback`, `Avatar`, `DropdownMenuSelect` und Subframe-Dropdown-Menüs. + +Aktionen im JSX: acht leere Click- und sieben leere Checkbox-Handler. Die Variante ist leichter wiederverwendbar, zeigt aber keinen Status `In Bearbeitung` und keinen Host-/Tab-Kontext. + +## Historische Zustände und Einbettungsanforderungen vor den finalen Varianten + +| Thema | Subframe-Stand | Abgleich | +|---|---|---| +| Projekt-Host | nur V1 | als Integrationsbeispiel wertvoll, nicht Teil des wiederverwendbaren Bodys | +| Objektneutraler Body | V2 | bessere Wiederverwendung | +| Status `In Bearbeitung` | V1 vorhanden, V2 verloren | in V2 ergänzen oder Statusmodell vereinfachen lassen | +| Empty | V1 nur `emptyText`; V2 fehlt | echter State mit kontextbezogenem CTA fehlt | +| Loading / Error | fehlt | A7 wiederverwenden | +| Rechte | nicht sichtbar | Zeilen-/Anlageaktionen nach `tasks.*` gaten | +| Kontextübergabe | Beispielprojekt nur in V1 | M01 muss Objekt-ID/Typ zuverlässig erhalten | +| Lange Titel / schmale Host-Spalte | nicht separat geprüft | responsive Einbettung in Zwei-Spalter nötig | + +## Historische UX-/Produktbewertung + +Empfehlung: **zusammenführen + als wiederverwendbaren Body schneiden; V2 als Basis, noch nicht final**. + +- V2 ist näher am eigentlichen Produktartefakt: ein objektneutraler Aufgaben-Body, der in verschiedene Detailseiten eingesetzt werden kann. +- V1 belegt die Einbettung im Projektkontext und hat mit Statusspalte und Tabellenkopf die vollständigere Semantik. +- V1 sollte nicht als einzige Implementierung dienen, weil Projektkopf und Tabs sonst in jedem Feature dupliziert würden. +- V2 gruppiert nur Offen und Erledigt und verschluckt damit `In Bearbeitung`; das widerspricht S01/S02 und erzeugt einen inkonsistenten Statuswechsel. +- Beide Varianten brauchen den leeren, ladenden und fehlerhaften Zustand sowie eine klare Permission-Strategie. + +Empfohlene Zusammenführung: V2 als wiederverwendbare Komponente/Body, ergänzt um einen konsistenten Status `In Bearbeitung` und optional klarere Spaltenlabels; V1 als Kontext-/Integrationstest behalten, bis die Einbettung in mindestens Projekt und Kontakt validiert ist. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/Z01 Zustände und Feedback.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/Z01 Zustände und Feedback.md new file mode 100644 index 00000000..a80277c0 --- /dev/null +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/Z01 Zustände und Feedback.md @@ -0,0 +1,124 @@ +--- +kind: screen-contract +project: HiveGrid Screen Project +ticket: D-P4 +package: WF-P4 Aufgaben +id: Z01 +screen: Zustände und Feedback +typ: Development-Vertrag +umsetzung: Nur dokumentieren +status: Fertig / Development-Handoff +subframe: "" +source_checked: 2026-08-23 +--- + +# Z01 — Zustände und Feedback + +> [!important] Bewusster Design-Scope · 2026-08-23 +> Die folgenden Empty-, Loading-, Error-, Upload-, Autosave-, Erfolgs- und Undo-Zustände erhalten **keine eigenen Subframe-Seiten**. Sie sind ein verbindlicher Development- und QA-Vertrag. Mobile ist für diese Validierungsrunde vollständig außerhalb des Scopes. + +Die bestätigten Normalzustände sowie entscheidungsrelevante Dialoge stehen in Subframe. Zustände, die ausschließlich Rückmeldung geben oder einen technischen Ausnahmefall abbilden, werden mit vorhandenen Standardkomponenten umgesetzt: `Empty State`, `Skeleton`, `Toast`, `Form save Retry`, `File Upload` und gegebenenfalls ein bestehender Offline-/Hinweisbanner. + +## 1. Empty States + +| Kontext | Auslöser | Inhalt / CTA | +|---|---|---| +| S01 · noch keine Aufgaben | Konto/Scope enthält keine Aufgabe | Titel `Noch keine Aufgaben`; Kurztext; primär `Neue Aufgabe` | +| S01 · Filter ohne Treffer | Suche oder Filter liefert 0 Treffer | Titel `Keine Aufgaben gefunden`; aktive Filter benennen; primär `Filter zurücksetzen`, Suche beibehalten | +| S03 · keine offenen eigenen Aufgaben | Drawer-Abfrage liefert 0 aktive Aufgaben | Titel `Alles erledigt`; Text `Du hast aktuell keine offenen Aufgaben.`; sekundär `Vollansicht`, primär `Neue Aufgabe` | +| V01 · keine Aufgabe am Datensatz | Objekt besitzt keine verknüpfte Aufgabe | Titel `Noch keine Aufgaben zu diesem Eintrag`; primär `Aufgabe hinzufügen` mit vorbefüllter Verknüpfung | +| S02 · keine Anhänge | Aufgabe hat keine Dateien | kompakte Inline-Zeile `Noch keine Dateien`; Aktion `Datei hinzufügen`; kein großflächiger Empty State | +| S02 · keine Verknüpfungen | Aufgabe besitzt keine Kontext-Verknüpfung | kompakte Inline-Zeile `Noch keine Verknüpfungen`; Aktion `Verknüpfung hinzufügen` | +| S02 · kein Verlauf außer Erstellung | keine weiteren Ereignisse | Erstellung als erster Eintrag sichtbar lassen; keinen separaten Empty State zeigen | +| M03 · Suche ohne Treffer | Relationensuche liefert 0 Treffer | `Keine passenden Einträge gefunden`; Suchbegriff sichtbar lassen; keine Anlage fremder Datensätze aus diesem Dialog | +| Auswahlfelder | Verantwortliche, Beobachter, Tags oder Verknüpfungen ohne Treffer | kompakter `Keine Treffer`-Eintrag im geöffneten Menü; keine eigene Seite | + +## 2. Loading und Aktualisierung + +| Kontext | Verhalten | +|---|---| +| S01 / V01 | Tabellen-/Zeilenskeleton mit stabilen Spaltenbreiten; Kopf, Filter und Primäraktion bleiben stehen | +| S02 | Struktur-Skeleton für Kopf, Eigenschaften und Inhaltsbereiche; keine springenden Spalten | +| S03 | Drawer-Kopf und Footer bleiben stehen; 4–5 kompakte Zeilenskeletons im Scrollbereich | +| Suchauswahl M03 / Picker | Spinner im Suchfeld beziehungsweise am Listenende; bestehende Treffer nicht sofort leeren | +| Pagination / Filterwechsel | vorhandenen Inhalt bis zum Ergebnis gedimmt stehen lassen; Mehrfachauslösung verhindern | +| Mutation eines Einzelwerts | nur das betroffene Control sperren; restliche Aufgabe bleibt bedienbar | + +## 3. Fehler und Validierung + +| Fall | Rückmeldung | Recovery | +|---|---|---| +| Aufgabe nicht vorhanden / kein Recht | neutraler 404-State `Aufgabe nicht gefunden`; keine Information über fremde Aufgaben preisgeben | `Zur Aufgabenübersicht` | +| S01/S03/V01 kann nicht geladen werden | Error-Variante der Standardkomponente mit Klartext | `Erneut versuchen`; Navigation bleibt verfügbar | +| S02 kann nicht geladen werden | seitenweiter Error-State innerhalb der Vollansicht | `Erneut versuchen` und `Zurück` | +| Inline-Mutation fehlgeschlagen | alten Wert wiederherstellen; Fehler-Toast mit betroffenen Feld | `Erneut versuchen`, sofern idempotent | +| Gleichzeitige Änderung / Versionskonflikt | lokale Eingabe nicht still überschreiben | Hinweis `Aufgabe wurde zwischenzeitlich geändert`; `Neu laden` | +| Offline | keine erfolgreiche Speicherung vortäuschen | Offline-Banner; ausstehende lokale Eingabe erhalten; nach Verbindung erneut senden | +| M01 · Titel leer | Inline-Text `Titel ist erforderlich`; Fokus auf Titel | Dialog bleibt offen | +| M01 · Verantwortlich leer | technisch verhindern, weil eigener Nutzer Default ist; bei fehlerhaften Daten Inline-Hinweis | eigenen Nutzer erneut setzen oder Picker öffnen | +| M01 · Uhrzeit ohne Fälligkeit | Uhrzeit deaktivieren oder Inline-Hinweis `Bitte zuerst ein Datum wählen` | Datum wählen / Uhrzeit entfernen | +| M01 · Speichern fehlgeschlagen | Eingaben und Upload-Auswahl vollständig erhalten; Fehler-Toast | `Erneut versuchen`; kein doppeltes Anlegen | +| M03 · Ziel inzwischen gelöscht / kein Recht | Dialog offen lassen; betroffene Zeile entfernen oder deaktivieren; Klartext-Hinweis | anderes Ziel wählen | +| Datei · Typ nicht unterstützt | Fehler direkt an der Datei | Datei entfernen/ersetzen | +| Datei · zu groß | erlaubte Maximalgröße nennen | Datei entfernen/ersetzen | +| Datei · Netzwerk-/Serverfehler | fehlerhafte Datei in der Liste erhalten | `Erneut versuchen` oder entfernen | +| Datei · Sicherheitsprüfung abgelehnt | neutraler Klartext ohne technische Interna | Datei entfernen; Supportweg nur falls nötig | +| Bulk-Aktion teilweise fehlgeschlagen | Erfolgs- und Fehleranzahl nennen; fehlgeschlagene Zeilen markiert/selektiert lassen | Aktion für Rest erneut ausführen | + +## 4. Speichern, Erfolg und Undo + +### Feedback-Prinzip + +- Direkte Feldänderungen in S01/S02 verwenden optimistische Aktualisierung. Ein Erfolg erzeugt normalerweise **keinen Toast**; bei längeren Schreibvorgängen erscheint lokal `Speichert …`, danach kurz `Gespeichert`. +- Abgeschlossene, vom Nutzer bewusst ausgelöste Vorgänge erhalten genau einen kompakten Toast. Gleichartige Bulk-Ereignisse werden zusammengefasst. +- Ein Toast verschwindet nicht, solange der Nutzer zum Verständnis oder zur Wiederherstellung handeln muss. +- Destruktive Vorgänge, die im Bestätigungsdialog ausdrücklich als nicht wiederherstellbar bezeichnet sind, bieten anschließend **kein Undo**. + +| Vorgang | Erfolgsfeedback | Undo / Folgeaktion | +|---|---|---| +| Aufgabe erstellt | `Aufgabe wurde erstellt` | optional `Öffnen`; kein Undo | +| Aufgabe dupliziert | `Aufgabe wurde dupliziert` | `Öffnen`; kein Undo | +| Aufgabe erledigt | `Aufgabe als erledigt markiert` | `Rückgängig` setzt vorherigen Status | +| Aufgabe wieder geöffnet | `Aufgabe wieder geöffnet` | `Rückgängig` | +| Status/Priorität/Fälligkeit/Zuständigkeit/Tags geändert | lokal `Gespeichert`; bei Bulk ein zusammengefasster Toast | bei Bulk optional `Rückgängig`, sofern atomar möglich | +| Notiz hinzugefügt | `Notiz wurde hinzugefügt` | kein Undo; Eintrag im Verlauf sichtbar | +| Datei hinzugefügt | `Datei wurde hinzugefügt` beziehungsweise Anzahl | kein Toast pro Datei bei Mehrfachupload; kein Undo | +| Anhang entfernt | `Anhang wurde von der Aufgabe entfernt` | kein Undo; die Entscheidung wurde zuvor in M08b bestätigt, Originaldatei bleibt erhalten | +| Verknüpfung hinzugefügt | `Verknüpfung wurde hinzugefügt` | `Rückgängig` darf die gerade erzeugte Verbindung lösen | +| Verknüpfung gelöst | `Verknüpfung wurde gelöst` | kein Undo, wenn M04 dies als endgültige Entscheidung bestätigt; sonst M04-Wording anpassen | +| Aufgabe gelöscht | `Aufgabe wurde gelöscht` | kein Undo | +| mehrere Aufgaben gelöscht | `3 Aufgaben wurden gelöscht` | kein Undo | +| Filter-Preset gespeichert | `Preset wurde gespeichert` | optional `Preset öffnen`; kein Undo | + +## 5. Fachliche Hinweisbanner + +Diese Hinweise sind ebenfalls nur dokumentiert und werden nicht als zusätzliche Subframe-Screens gebaut. + +| Hinweis | Ort | Verhalten | +|---|---|---| +| Zuständiger deaktiviert | S02 unter dem Kopf; optional kompakt in S01 | Warnung ohne Blockade; primär `Neu zuweisen`; Aufgabe bleibt sichtbar | +| Archivierung in 30 Tagen | S02 unter dem Kopf | Datum der Archivierung nennen; Aktion `Archivierung verhindern`, sofern Rolle berechtigt | +| Verknüpfter Datensatz gelöscht | S02 bei Verknüpfungen und einmalig als Hinweis | gelöschtes Ziel nicht verlinken; Aktion `Verknüpfung entfernen` oder `Neu verknüpfen` | +| Überfällig | bestehende Darstellung verwenden | S01 rote Fälligkeit + Zähler; S02 bestehender Banner; keine zusätzliche Toast-Flut | +| Berechtigung während offener Ansicht entzogen | betroffene Ansicht | Eingaben stoppen, neutral informieren, sichere Navigation anbieten | + +## 6. Datei-Upload-Zustandsmaschine + +```text +Ausgewählt -> Wird hochgeladen -> Sicherheitsprüfung -> Hinzugefügt + | | | + +-> Typ/Größe +-> Netzwerkfehler +-> abgelehnt +``` + +- Fortschritt, Abbrechen, Retry und Dateifehler werden mit der vorhandenen `File Upload`-Komponente umgesetzt. +- Schließen während eines aktiven Uploads benötigt eine Warnung, falls der Upload dadurch tatsächlich abgebrochen wird; läuft er im Hintergrund weiter, genügt ein neutraler Hinweis. +- Doppelte Dateinamen sind erlaubt, sofern die Produktlogik nicht eindeutig dieselbe Datei erkennt; im Konfliktfall nicht still überschreiben. + +## 7. QA-Abnahmekriterien + +- Jede Mutation hat genau einen erkennbaren Ausgang: gespeichert, rückgängig gemacht oder fehlgeschlagen. +- Fehler verlieren keine Texteingabe, Auswahl oder noch nicht übertragene Datei. +- Retry erzeugt keine Duplikate. +- Tastaturfokus springt bei Inline-Fehlern zum ersten fehlerhaften Feld und kehrt nach einem Dialog zur auslösenden Aktion zurück. +- Screenreader-Text nennt Objekt und Wirkung destruktiver Aktionen; Farbe ist nie der einzige Indikator. +- Mobile bleibt ausdrücklich ungetestet und ist kein Abnahmekriterium dieser Runde. diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas index 6aec8317..bd65270c 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas @@ -27,6 +27,16 @@ "height": 400, "label": "Schnellzugriff (Davids Delta)" }, + { + "id": "7e2a1c4b9d6f8031", + "type": "group", + "x": -80, + "y": 1040, + "width": 3640, + "height": 720, + "label": "Finales Subframe-Inventar · 16 Seiten · Development-Handoff", + "color": "4" + }, { "id": "note-entry", "type": "text", @@ -98,6 +108,96 @@ "y": 580, "width": 420, "height": 200 + }, + { + "id": "c41e8a206bd9537f", + "type": "text", + "text": "# Subframe-Quelle · final\n\n[Flow öffnen](https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit)\n\nProjekt `Basedesign` · Flow-ID `192a194e-bb51-4f4c-9f02-7c05d26584e8`\n\n⚠️ Flow heißt weiterhin `WF-P16 Aufgaben`; Paket/Ticket bleiben `WF-P4` / `D-P4`.\n\nStand: 2026-08-23 · finaler Live-Readback **16 Seiten**: S01, S02, S03, M01, zwei V01-Repräsentationen und zehn Interaktionsmodals. Mobile und reine Zustandsseiten sind nicht Teil von Subframe; ihr Vertrag steht in Z01.", + "x": 0, + "y": 1100, + "width": 480, + "height": 500, + "color": "3" + }, + { + "id": "b7d30f1a68c2459e", + "type": "text", + "text": "# S01 Liste · aktuelle Basis\n\n[S01 B3 · Kompakter Statuspunkt](https://app.subframe.com/f023064a5ca0/design/7dcb65c5-ba2c-490a-ad06-8758e8e6e913/edit)\n`7dcb65c5-ba2c-490a-ad06-8758e8e6e913`\n\nB3 ersetzt den früheren B-Screen als sichtbare Flow-Basis.\n\nErgänzte Wege: einzelnes Löschen, Bulk-Löschen, offene Checklistenpunkte, Duplizieren und Filter-Preset. Empty/Error/Feedback nur in Z01.", + "x": 560, + "y": 1100, + "width": 520, + "height": 440, + "color": "3" + }, + { + "id": "f192bc804da63e71", + "type": "text", + "text": "# S02 Detail · Versuch 4 final\n\n[Verlauf im Fokus](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit)\n`b4e91d35-0d28-43d1-941e-e67a7ec3d834`\n\n`Dialog Fullscreen` bleibt direkte Wurzel. Route `/tasks/:id`; Kopf/Banner voll; Eigenschaften links, Arbeitsinhalt rechts.\n\n**Dropdown-Vertrag:** Statusbadges · ProjectCard-Priorität: Niedrig grün, Mittel gelb, Hoch rot, Kritisch violett; jeweils Vier-Strich-Indikator links + Badge rechts · Markus Weber + Personen/Gruppen · Date-/Multi-Selects · Erinnerung · Format · Sortierung. Kopf-, Anhang- und Verknüpfungsmenüs bleiben vollständig.\n\n**Ergänzt 23.08.:** `Notiz hinzufügen` im Verlaufskopf; pro Ereignis nur noch einmal `Datum · Uhrzeit` statt doppelter Datumzeile.\n\n**Gelöscht 23.08.:** 1/2/3/5 und Legacy V1/V2; sechs UUIDs ohne Referenzen im Paketprotokoll. Fünf technische Entwürfe waren bereits nicht mehr im Flow.", + "x": 1160, + "y": 1100, + "width": 520, + "height": 620, + "color": "3" + }, + { + "id": "2a6e9c13b5d8407f", + "type": "text", + "text": "# S03 Drawer · final\n\n[S03 öffnen](https://app.subframe.com/f023064a5ca0/design/c7978061-8467-49d9-adf3-614301843bb2/edit)\n`c7978061-8467-49d9-adf3-614301843bb2`\n\nKopf `Meine Aufgaben` ohne Tabs; kompakter Überfällig-Hinweis; farbige Zeitgruppen; klickbares Accordion ohne graue Fläche; Verknüpfung unter Titel; Datum/Priorität rechts untereinander; Footer-Aktionen `Neue Aufgabe` und `Vollansicht`.", + "x": 1760, + "y": 1100, + "width": 520, + "height": 440, + "color": "3" + }, + { + "id": "8c5f137ad024e69b", + "type": "text", + "text": "# M01 Anlegen · final\n\n[M01 V5 · Inhalt + Planung](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit)\n`826b6837-a486-42c8-bbe6-d3745528993e`\n\nEine Oberfläche, drei Datenmodi: global mit leerer Verknüpfung, aus Objektkontext vorbefüllt und Duplizieren als bearbeitbare Kopie.\n\nTerminologie verbindlich `Fälligkeit`; M05 schützt Dirty-Close. M01b/M01c sind nicht mehr im Live-Flow.", + "x": 2360, + "y": 1100, + "width": 520, + "height": 500, + "color": "3" + }, + { + "id": "de903a17c6b5428f", + "type": "text", + "text": "# V01 Einbettung · final\n\n[A · Kompakte Tabelle](https://app.subframe.com/f023064a5ca0/design/7dd5df56-7cea-445b-91f2-29b9f1fbb407/edit)\n`7dd5df56-7cea-445b-91f2-29b9f1fbb407`\n\n[Minimal · Sidebar-Liste](https://app.subframe.com/f023064a5ca0/design/841f9e3f-ca13-4fed-aac6-6977cea19a03/edit)\n`841f9e3f-ca13-4fed-aac6-6977cea19a03`\n\nA ist die datenreiche Tabelle mit Bulk-Aktionen. Minimal ist die reduzierte, nach Fälligkeit gruppierte Accordion-Liste. Beide sind objektbezogen vorgefiltert.", + "x": 2960, + "y": 1100, + "width": 520, + "height": 440, + "color": "3" + }, + { + "id": "a91f2c7e4b6d8035", + "type": "group", + "x": -80, + "y": 1880, + "width": 1840, + "height": 620, + "label": "Finale Interaktionen und Development-Zustände", + "color": "4" + }, + { + "id": "b23e7d91a4c6508f", + "type": "file", + "file": "02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/M02-M09 Interaktionsmodals.md", + "x": 0, + "y": 1980, + "width": 700, + "height": 400, + "color": "5" + }, + { + "id": "c47a1f93d6e5208b", + "type": "file", + "file": "02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/Screens/Z01 Zustände und Feedback.md", + "x": 900, + "y": 1980, + "width": 700, + "height": 400, + "color": "6" } ], "edges": [ @@ -145,7 +245,7 @@ "fromSide": "bottom", "toNode": "m01", "toSide": "top", - "label": "Neue Aufgabe (auch aus S03 + Detailseiten, vorbefüllt)" + "label": "M01 · global, Objektkontext oder Duplikatmodus" }, { "id": "e-variant", @@ -157,10 +257,45 @@ "toNode": "s01", "toSide": "bottom", "label": "kompakte Ausführung von S01" + }, + { + "id": "d58c1a7e3f9062b4", + "fromNode": "s01", + "fromSide": "bottom", + "toNode": "b23e7d91a4c6508f", + "toSide": "top", + "label": "Löschen · Bulk · Preset · Duplizieren" + }, + { + "id": "e69d2b8f4a0173c5", + "fromNode": "s02", + "fromSide": "bottom", + "toNode": "b23e7d91a4c6508f", + "toSide": "top", + "label": "Löschen · Erledigen · Verknüpfen · Notiz · Datei" + }, + { + "id": "f70e3c9a5b1284d6", + "fromNode": "m01", + "fromSide": "bottom", + "toNode": "b23e7d91a4c6508f", + "toSide": "left", + "label": "Dirty-Close" + }, + { + "id": "a81f4d0b6c2395e7", + "styleAttributes": { + "path": "dotted" + }, + "fromNode": "b23e7d91a4c6508f", + "fromSide": "right", + "toNode": "c47a1f93d6e5208b", + "toSide": "left", + "label": "Empty · Error · Upload · Save · Toast · Undo nur dokumentiert" } ], "metadata": { "version": "1.0-1.0", "frontmatter": {} } -} \ No newline at end of file +} diff --git a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.md b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.md index f91dbd83..7da76f3a 100644 --- a/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.md +++ b/02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/WF-P4 Aufgaben.md @@ -4,128 +4,167 @@ project: HiveGrid Screen Project ticket: D-P4 package: WF-P4 Aufgaben typ: Flow -status: Validiert -subframe: "" +status: Fertig / Development-Handoff +subframe: "https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit" canvas: "WF-P4 Aufgaben.canvas" +source_checked: 2026-08-23 --- # WF-P4 Aufgaben -Status: Validiert (Screen-Liste) -Subframe-Link: - -Canvas: [Canvas]() -Stand: 2026-07-08 +Status: **Fertig / Development-Handoff** ---- +Subframe: [WF-P16 Aufgaben öffnen](https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit) -## 1. Kurzfassung +Canvas: [WF-P4 Aufgaben.canvas]() -Das Aufgaben-Modul: Liste, Detail, Anlegen-Modal, Topbar-Drawer für den Schnellzugriff und die eingebettete Kompakt-Variante, die später in jeder Detailseite (Kontakt, Projekt, …) steckt. **Einmal bauen, überall einbetten.** +Stand: 2026-08-23 ---- +## Abschlussstand -## 2. Intent Check +Subframe ist die Single Source of Truth für den sichtbaren UI-Bestand. Der finale Live-Flow enthält **16 Seiten**: -| Frage | Antwort | -|---|---| -| Welches Ticket/Modul ist betroffen? | D-P4 (Teil Aufgaben), Dev-Pendant AK-P4b | -| Was soll der Nutzer am Ende schaffen? | Aufgaben sehen (meine zuerst), schnell anlegen, abhaken, nichts verpassen (Fristen) | -| Flow, Screen, Zustand oder Doku? | Screens + Modal + Drawer + wiederverwendbare Kompakt-Variante | -| Welche Planning-Quellen wurden geprüft? | `ticket-docs/D-P4.md`, SCREEN-MAP §2, HiveGrid Map | -| Was ist sicher im Scope? | Liste, Detail, Anlegen, Drawer, Kompakt-Variante, Banner-Zustände | -| Was ist sicher nicht im Scope? | Unteraufgaben, Boards für Aufgaben, wiederkehrende Aufgaben (nicht im Ticket) | -| Admin/Normalrolle-Unterschiede? | Preset »Alle« nur mit Recht `tasks.read_all`; fremde Aufgaben → 404 | -| Unsichere Annahmen? | Feinverhalten Drawer (z. B. Anzahl-Badge am Topbar-Button) — beim Subframe-Bau | +- 4 Kernseiten: S01, S02, S03 und M01. +- 2 finale V01-Einbettungsvarianten. +- 10 entscheidungsrelevante Interaktionsmodals M02 bis M09 inklusive M02b und M08b. +- Keine eigenen Mobile-, Empty-, Loading-, Error-, Save-, Success- oder Undo-Seiten; ihr verbindlicher Development-Vertrag steht in [[Z01 Zustände und Feedback]]. ---- +Der Live-Bestand wurde am 2026-08-23 erneut per MCP gelesen. S03, M01 und beide V01-Seiten wurden im Abschlusslauf zusätzlich als Desktop gerendert; M02 und M02b wurden nach der finalen Archivieren-Anpassung ebenfalls gelesen und gerendert. -## 3. Scope +> [!note] Bekannter Namensunterschied +> Der Subframe-Flow heißt weiterhin `WF-P16 Aufgaben`. Das lokale Paket und der Ticket-Handoff heißen `WF-P4 Aufgaben` / `D-P4`. Die Abweichung ist dokumentiert und blockiert das Development-Handoff nicht. -| Punkt | Inhalt | -|---|---| -| Ticket/Modul | D-P4 · Aufgaben | -| Nutzerrolle | Alle (Maximalansicht Admin) | -| Startpunkt | Sidebar »Aufgaben« oder Topbar-Button | -| Ziel | Aufgabe angelegt / erledigt / gefunden | -| Haupt-Archetyp | A2 Liste · A3 Detail · A5 Modal | -| Bespoke-Anteil | Keiner | -| Out of scope | Wiederkehrende Aufgaben, Unteraufgaben (nicht beauftragt) | +## Vollständiges Subframe-Inventar ---- +| # | Familie | Live-Name | UUID | Repo | Subframe | +|---:|---|---|---|---|---| +| 1 | S01 | S01 B3 · Kompakter Statuspunkt | `7dcb65c5-ba2c-490a-ad06-8758e8e6e913` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/7dcb65c5-ba2c-490a-ad06-8758e8e6e913/edit) | +| 2 | S02 | S02 Fullscreen Versuch 4 · Verlauf im Fokus | `b4e91d35-0d28-43d1-941e-e67a7ec3d834` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit) | +| 3 | S03 | S03 | `c7978061-8467-49d9-adf3-614301843bb2` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/c7978061-8467-49d9-adf3-614301843bb2/edit) | +| 4 | V01 | V01 A · Kompakte Tabelle | `7dd5df56-7cea-445b-91f2-29b9f1fbb407` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/7dd5df56-7cea-445b-91f2-29b9f1fbb407/edit) | +| 5 | V01 | V01 Minimal · Sidebar-Liste | `841f9e3f-ca13-4fed-aac6-6977cea19a03` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/841f9e3f-ca13-4fed-aac6-6977cea19a03/edit) | +| 6 | M01 | M01 V5 · Inhalt + Planung | `826b6837-a486-42c8-bbe6-d3745528993e` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit) | +| 7 | M02 | M02 Aufgabe löschen | `a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3/edit) | +| 8 | M02b | M02b Mehrere Aufgaben löschen | `47e17c3e-aef5-449b-b042-1c9898d9f6cd` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/47e17c3e-aef5-449b-b042-1c9898d9f6cd/edit) | +| 9 | M04 | M04 Verknüpfung lösen | `c5c91314-ef9b-4434-b574-168b2ee99947` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/c5c91314-ef9b-4434-b574-168b2ee99947/edit) | +| 10 | M03 | M03 Verknüpfung hinzufügen | `8020d4ea-9823-400f-b779-dbb78f3cef2e` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/8020d4ea-9823-400f-b779-dbb78f3cef2e/edit) | +| 11 | M05 | M05 Änderungen verwerfen | `ae739bed-4f12-47fc-9ea2-e3cfc410abc0` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/ae739bed-4f12-47fc-9ea2-e3cfc410abc0/edit) | +| 12 | M06 | M06 Offene Punkte bestätigen | `17e1ded0-3344-49ad-bfeb-698d52f730f6` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/17e1ded0-3344-49ad-bfeb-698d52f730f6/edit) | +| 13 | M07 | M07 Notiz hinzufügen | `ac3f4aec-4d41-4d96-af71-f77931e12437` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/ac3f4aec-4d41-4d96-af71-f77931e12437/edit) | +| 14 | M08 | M08 Datei hinzufügen | `41a74bd3-2bb1-4429-bd33-2cad30be2621` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/41a74bd3-2bb1-4429-bd33-2cad30be2621/edit) | +| 15 | M08b | M08b Anhang entfernen | `35ac0b6b-04d2-4319-af87-66941cd24f1a` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/35ac0b6b-04d2-4319-af87-66941cd24f1a/edit) | +| 16 | M09 | M09 Filter-Preset speichern | `4f427f0e-73f6-4c87-956b-26014939afa9` | [MD]() | [Öffnen](https://app.subframe.com/f023064a5ca0/design/4f427f0e-73f6-4c87-956b-26014939afa9/edit) | -## 4. Entscheidungen (validiert 2026-07-08) - -| Entscheidung | Status | Notiz | -|---|---|---| -| Detail als eigene Seite, Anlegen als Modal (vorbefüllbar) | genommen | Ticket-treu | -| Eingebettete Kompakt-Variante als eigener Frame (V01) | genommen | Einbett-Muster steht, bevor D-CRM es braucht | -| **Topbar-Button »Meine Aufgaben« + Aufgaben-Drawer rechts** | genommen | **Davids Ergänzung (Delta über Ticket hinaus)** — Schnellzugriff analog Glocken-Drawer; in »Davids Delta« der Ticket-Doc nachtragen | -| Zuweisung an Person ODER Gruppe (genau eines) | genommen | Ticket-Vorgabe, Umschalter im Picker | -| Herkunfts-Marker (manuell/Chat/Formular/Automation) mit Link | genommen | Ticket-Vorgabe | -| Banner nur dokumentieren | genommen | überfällig / Zuständiger deaktiviert / 30-Tage-Archiv / Verknüpfung gelöscht | - -### Happy Path - -1. Sidebar »Aufgaben« → Liste, Preset »Meine«, überfällige rot oben. -2. Schnell-Aktionen direkt in der Zeile: erledigt, Priorität, Frist. -3. »Neue Aufgabe« → Modal (aus einer Detailseite geöffnet: Verknüpfung vorbefüllt). -4. Zwischendurch überall: Topbar-Button → Drawer rechts mit meinen offenen Aufgaben, Tipp auf Eintrag → Detail. - -### Meldungs-/Error-States (validiert) - -| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz | -|---|---|---|---|---| -| Fremde Aufgabe aufgerufen | 404 »nicht gefunden« | ja | Wiederverwenden | bewusst nicht »verboten« (Dev-Vorgabe) | -| Zuständiger deaktiviert | Banner + »neu zuweisen« | nein | Nur dokumentieren | im Detail | -| Überfällig | Banner/rote Frist | nein | Nur dokumentieren | Liste + Detail | -| Wird in 30 Tagen archiviert | Banner | nein | Nur dokumentieren | erledigte Aufgaben | -| Verknüpfung gelöscht | Banner | nein | Nur dokumentieren | »Verknüpftes Objekt existiert nicht mehr« | -| Leere Liste | Leer-Zustand | nein | Nur dokumentieren | »Keine offenen Aufgaben — schöne Sache« | - ---- - -## 7. Validierte Screen-Liste - -| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status | -|---|---|---|---|---|---| -| S01 | Aufgaben-Liste | Screen | Bauen | `/tasks` | Validiert | -| S02 | Aufgaben-Detail | Screen | Bauen | `/tasks/:id` | Validiert | -| S03 | Aufgaben-Drawer (Topbar) | Drawer | Bauen | Topbar, global | Validiert | -| M01 | Aufgabe anlegen | Modal | Bauen | aus S01/S03/Detailseiten | Validiert | -| V01 | Eingebettete Kompakt-Variante | Variante | Bauen | Reiter in Detailseiten | Validiert | -| D01–D05 | Banner-Zustände (s. Tabelle oben) | Banner/Inline | Nur dokumentieren | in S01/S02 | Validiert | - ---- - -## 8. Grid +## Finaler Hauptfluss ```text -Sidebar -> S01 -> S02 -Topbar-Button -> S03 (Drawer) -> S02 -S01/S03/Detailseiten -> M01 (Anlegen, vorbefuellt) -V01 = kompakte S01 als Reiter in jeder Detailseite +Sidebar Aufgaben -> S01 -> S02 als route-gebundene Vollansicht +Topbar Meine Aufgaben -> S03 -> S02 +S03 -> S01 über Vollansicht +Detail-Reiter -> V01 A oder V01 Minimal -> S02 + +S01 / S03 / Detailseite / V01 -> M01 + global: Verknüpfung leer + Objektkontext: primäre Verknüpfung vorbefüllt + Duplizieren: bestehende Werte als bearbeitbare Kopie vorbefüllt + +S01 / S02 / S03 / M01 / V01 -> M02–M09 +M02–M09 -> Z01 für ausschließlich dokumentierte Zustände und Rückmeldungen ``` ---- +Die Kanten beschreiben Produktlogik. Die statischen Subframe-Exporte enthalten keine fertig verdrahtete Navigation oder Business-Handler. -## 9. Screen-Pakete +## Finale Produktentscheidungen + +### S01 Aufgaben-Liste + +- B3 ist die finale Listenbasis. +- Priorität, Fälligkeit, Verantwortlich, Status und Tags sind inline editierbar; Titel und Verknüpfung bleiben Navigationsziele. +- Bulk-Aktionen: Status, Priorität, Fälligkeit, Zuweisen, Tags und Löschen. +- Überfälligkeit wird über rote Fristen und einen kompakten Direktfilter-Zähler kommuniziert. +- Einzel- und Mehrfachlöschung führen in M02 beziehungsweise M02b; beide bieten als sichere Alternative den blauen Button `Lieber archivieren`. + +### S02 Aufgaben-Detail + +- Route-gebundenes Vollbild-Modal unter `/tasks/:id`; `Dialog Fullscreen` ist die direkte äußere Komponente. +- Eigenschaften links, Beschreibung/Checkliste, Anhänge, Verknüpfungen und Verlauf rechts. +- Status, Priorität, Fälligkeit/Uhrzeit, Verantwortlich, Tags, Beobachter und Erinnerung sind direkt bearbeitbar. +- `Notiz hinzufügen` sitzt im Kopf des Verlaufs und öffnet M07. +- Pro Verlaufsereignis erscheint genau einmal `Datum · Uhrzeit`. + +### S03 Aufgaben-Drawer + +- Globaler Schnellzugriff aus der Topbar; 540 px breit. +- Farbige Zeitgruppen, kompakte Accordion-Aufgaben ohne seitlichen Chevron und ohne graue Accordion-Fläche. +- Verknüpfung unter dem Titel; Priorität und Datum rechts untereinander. +- Footer-Aktionen: `Neue Aufgabe` und `Vollansicht`. + +### M01 Aufgabe anlegen + +- Eine finale Subframe-Seite deckt die datengetriebenen Modi global, Objektkontext und Duplizieren ab. +- Global startet die primäre Verknüpfung leer; im Objektkontext wird sie vorbefüllt. +- Duplizieren befüllt die editierbaren Werte vor, setzt den Status auf `Offen`, öffnet Checklistenpunkte und übernimmt keinen alten Verlauf. +- Modulweit gilt die Bezeichnung `Fälligkeit`. +- Dirty-Close führt zu M05. + +### V01 Einbettung + +- `V01 A · Kompakte Tabelle` ist die datenreiche Einbettung mit Auswahl, Bulk-Aktionen und Inline-Feldern. +- `V01 Minimal · Sidebar-Liste` ist die reduzierte, nach Fälligkeit gruppierte Einbettung mit aufklappbarem Aufgabentext. +- Beide Varianten werden auf den aktuellen Kontakt, die Organisation, den Lead oder das Projekt vorgefiltert. + +### Interaktionsmodals + +- M02/M02b: Löschen bestätigen oder über den gleich großen blauen Button `Lieber archivieren` in den Archivieren-Pfad wechseln. +- M03/M04: Verknüpfung hinzufügen beziehungsweise gezielt lösen. +- M05: geänderte M01-Eingaben vor dem Verwerfen schützen. +- M06: Erledigen trotz offener Checklistenpunkte bestätigen. +- M07: Notiz aus dem S02-Verlauf hinzufügen. +- M08/M08b: Datei hinzufügen beziehungsweise nur den Anhang von der Aufgabe lösen. +- M09: persönliches Filter-Preset speichern. + +## Globaler Aufgaben-Feldvertrag + +| Feld | Verbindliche Regel | +|---|---| +| Titel | bearbeitbar; beim Anlegen die einzige manuell zwingende Eingabe | +| Status | `Offen`, `In Bearbeitung`, `Erledigt`; Standard beim Anlegen `Offen` | +| Verantwortlich | genau eine Person oder Gruppe; nie leer; eigener Nutzer als Standard | +| Fälligkeit | optionales Datum mit optionaler Uhrzeit | +| Priorität | `Niedrig`, `Mittel`, `Hoch`, `Kritisch` | +| Verknüpfungen | optional zu Kontakt, Organisation, Lead oder Projekt; M01 setzt den Primärbezug, S02 verwaltet weitere Bezüge | +| Beschreibung | optional; Markdown und Checkliste | +| Zusammenarbeit | Beobachter, Tags und Erinnerung optional | +| Anhänge | beim Anlegen und später im Detail verfügbar | +| Herkunft | systemseitig `Manuell`, `Chat`, `Formular` oder `Automation`; außer `Manuell` mit Deep Link zur Quelle | +| Systemfelder | Ersteller, Zeiten, Verlauf und Archivlogik automatisch | + +## Zustände und Development-Vertrag + +Empty-, Loading-, Error-, Permission-, Uploadfortschritts-, Autosave-, Erfolgs-, Toast- und Undo-Zustände sind bewusst keine eigenen Subframe-Seiten. Texte, Recovery-Regeln und QA-Kriterien stehen vollständig in [[Z01 Zustände und Feedback]]. Mobile war nicht Teil der Abnahme. + +## Bereinigter Variantenstand + +- M01b und M01c sind nicht mehr im finalen Live-Flow. Die Unterschiede werden als Datenmodus derselben M01-Oberfläche umgesetzt. +- Von den parallel entstandenen V01-Zwischenvarianten bleibt A erhalten; zusätzlich ist die finale Minimal-Liste im Flow. B, D und ihre Duplikate sind nicht mehr aktiv. +- Frühere S01-/S02-/S03-/M01-/V01-Varianten bleiben ausschließlich als Entscheidungshistorie in den jeweiligen Screen-Dateien dokumentiert. + +## Screen-Dateien - [[S01 Aufgaben-Liste]] - [[S02 Aufgaben-Detail]] - [[S03 Aufgaben-Drawer]] - [[M01 Aufgabe anlegen]] - [[V01 Eingebettete Kompakt-Variante]] - ---- - -## 10. Offene Fragen - -- Topbar-Button: mit Zähler-Badge (offene/überfällige)? → beim Subframe-Bau -- Drawer-Umfang: nur »Meine offen« oder mit Tabs? → beim Subframe-Bau schlank starten -- Davids Delta (Topbar-Button + Drawer) in `ticket-docs/D-P4.md` »Davids Delta« nachtragen → beim Handoff +- [[M02-M09 Interaktionsmodals]] +- [[Z01 Zustände und Feedback]] ## Handoff-Check -- [x] Jeder Screen ist mit Umsetzung markiert. -- [x] Meldungs-/Error-State-Matrix ist ausgefüllt. -- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)* +- [x] 16 Live-Seiten aus Subframe gelesen und mit UUIDs/Direktlinks inventarisiert. +- [x] S01, S02, S03, M01 und beide V01-Repräsentationen final dokumentiert. +- [x] Zehn Interaktionsmodals inklusive finaler Archivieren-Alternative dokumentiert. +- [x] M01-Modi ohne zusätzliche Live-Seiten als Development-Vertrag festgehalten. +- [x] Empty/Error/Save/Undo/Upload ausschließlich in Z01 dokumentiert. +- [x] Mobile ausdrücklich aus Scope und Abnahme entfernt. +- [x] Canvas, Tracker, HiveGrid Map und Ticket-Handoff auf den finalen Stand synchronisiert. diff --git a/02 Wireframes/Screen Paket Tracker.md b/02 Wireframes/Screen Paket Tracker.md index cd44afa1..41ab5aaa 100644 --- a/02 Wireframes/Screen Paket Tracker.md +++ b/02 Wireframes/Screen Paket Tracker.md @@ -37,7 +37,7 @@ Diese Datei ist der erste Ort, um zu sehen: | WF-P2 Workspace loeschen | D-P2 | Auth/Settings | Backlog | [MD]() | [Canvas]() | - | Backlog | Eigener Workflow; erst planen, wenn Workspace Settings gebaut/validiert sind | | WF-P3 Benachrichtigungen | D-P3 | Querschnitt | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; Drawer wird Muster fuer Topbar-Drawer | | WF-P3 Audit Log | D-P3 | Querschnitt | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; Export als Reiter; M03 = wiederverwendbares Verlauf-Muster | -| WF-P4 Aufgaben | D-P4 | Aufgaben & Dateien | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; inkl. Davids Delta: Topbar-Button + Aufgaben-Drawer | +| WF-P4 Aufgaben | D-P4 | Aufgaben & Dateien | Fertig / Development-Handoff | [MD]() | [Canvas]() | [Subframe]() | Übergabe abgeschlossen | 16/16 Live-Seiten synchron: S01/S02/S03/M01, zwei finale V01-Repräsentationen und zehn Interaktionsmodals; Zustände in Z01; Flow-Name `WF-P16 Aufgaben` als nicht blockierende Abweichung dokumentiert | | WF-P4 Dateien | D-P4 | Aufgaben & Dateien | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; Teilen/Ordner/Versionen sichtbar als Backlog v2 | | WF-P5 Integrationen | D-P5 | Integrationen | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; Sync-Verlauf als eigene Seiten; Connection-Card = Muster fuer P14/P15/P16 | | WF-P6 Kontakte und Organisationen | D-CRM | Kontakte | Validiert | [MD]() | [Canvas]() | - | Subframe nach explizitem OK | Screens validiert 2026-07-08; Karteikarte = Muster-Vorlage fuer alle Detailseiten (Zweispalter + Reiter) | @@ -127,11 +127,13 @@ Diese Datei ist der erste Ort, um zu sehen: | M01 | Detail-Drawer (Vorher/Nachher) | WF-P3 Audit Log | Drawer | Bauen | Validiert | aus S01 | [MD]() | - | [Canvas]() | | M02 | Export anlegen | WF-P3 Audit Log | Modal | Bauen | Validiert | aus S01/S02 | [MD]() | - | [Canvas]() | | M03 | Objekt-Verlauf-Drawer (wiederverwendbar) | WF-P3 Audit Log | Drawer | Bauen | Validiert | in jeder Detailseite | [MD]() | - | [Canvas]() | -| S01 | Aufgaben-Liste | WF-P4 Aufgaben | Liste | Bauen | Validiert | `/tasks` | [MD]() | - | [Canvas]() | -| S02 | Aufgaben-Detail | WF-P4 Aufgaben | Detail | Bauen | Validiert | `/tasks/:id` | [MD]() | - | [Canvas]() | -| S03 | Aufgaben-Drawer (Topbar) | WF-P4 Aufgaben | Drawer | Bauen | Validiert | Topbar, global | [MD]() | - | [Canvas]() | -| M01 | Aufgabe anlegen | WF-P4 Aufgaben | Modal | Bauen | Validiert | aus S01/S03/Detailseiten | [MD]() | - | [Canvas]() | -| V01 | Eingebettete Kompakt-Variante | WF-P4 Aufgaben | Variante | Bauen | Validiert | Reiter in Detailseiten | [MD]() | - | [Canvas]() | +| S01 | Aufgaben-Liste | WF-P4 Aufgaben | Liste | Bauen | Fertig / Development-Handoff | `/tasks` | [MD]() | [B3]() | [Canvas]() | +| S02 | Aufgaben-Detail | WF-P4 Aufgaben | Route-geb. Vollbild-Modal | Bauen | Fertig / Development-Handoff | `/tasks/:id` | [MD]() | [Versuch 4]() | [Canvas]() | +| S03 | Aufgaben-Drawer (Topbar) | WF-P4 Aufgaben | Drawer | Bauen | Fertig / Development-Handoff | Topbar, global | [MD]() | [S03]() | [Canvas]() | +| M01 | Aufgabe anlegen | WF-P4 Aufgaben | Modal | Bauen | Fertig / Development-Handoff | aus S01/S03/Detailseiten/V01 | [MD]() | [V5]() | [Canvas]() | +| V01 | Eingebettete Aufgaben | WF-P4 Aufgaben | Zwei finale Varianten | Bauen | Fertig / Development-Handoff | Reiter in Detailseiten | [MD]() | [Tabelle]() · [Minimal]() | [Canvas]() | +| M02–M09 | Interaktionsmodals | WF-P4 Aufgaben | 10 Modals | Bauen | Fertig / Development-Handoff | aus S01/S02/S03/M01/V01 | [MD]() | [Flow]() | [Canvas]() | +| Z01 | Zustände und Feedback | WF-P4 Aufgaben | Development-Vertrag | Nur dokumentieren | Fertig / Development-Handoff | modulweit | [MD]() | - | [Canvas]() | | S01 | Datei-Uebersicht | WF-P4 Dateien | Liste | Bauen | Validiert | `/files` | [MD]() | - | [Canvas]() | | S02 | Upload | WF-P4 Dateien | Form/Dropzone | Bauen | Validiert | `/files/upload` | [MD]() | - | [Canvas]() | | S03 | Datei-Detail | WF-P4 Dateien | Detail | Bauen | Validiert | `/files/:id` | [MD]() | - | [Canvas]() | @@ -393,6 +395,40 @@ Diese Datei ist der erste Ort, um zu sehen: | WF-P3 Audit Log | Drawer-Komponente geteilt? | Offen | Teilen Detail-Drawer (M01) und Objekt-Verlauf (M03) eine Komponente? | Beim Subframe-Bau klaeren | | WF-P4 Aufgaben | Topbar-Button + Aufgaben-Drawer | Genommen | Schnellzugriff auf eigene Aufgaben von ueberall; Davids Delta ueber das Ticket hinaus. | In D-P4 Davids Delta nachtragen | | WF-P4 Aufgaben | Kompakt-Variante als eigener Frame | Genommen | Einbett-Muster steht, bevor D-CRM es braucht. | V01 | +| WF-P4 Aufgaben | Subframe-Live-Bestand | Geltend / final | 16 Seiten: S01, S02, S03, M01, V01 Tabelle, V01 Minimal sowie zehn Interaktionsmodals M02–M09 inklusive M02b/M08b. M01b/M01c und die verworfenen V01-Zwischenvarianten sind nicht mehr aktiv. | Finaler MCP-Readback 2026-08-23 | +| WF-P4 Aufgaben | Flow-Name `WF-P16 Aufgaben` | Dokumentiert / nicht blockierend | Subframe-Name weicht von `D-P4` / `WF-P4 Aufgaben` ab; UUID, Links und Paketzuordnung sind eindeutig. | Beim Development-Handoff akzeptiert; nicht eigenmächtig umbenennen | +| WF-P4 Aufgaben | Zuständigkeit | Genommen / final | Genau eine Person oder Gruppe; ohne bewusste Auswahl wird automatisch der eigene Nutzer gesetzt, unzugewiesen ist nicht erlaubt. M01 zeigt Markus Weber als vorbelegten Wert. | Präzisiert durch David 2026-08-22; final gerendert 2026-08-23 | +| WF-P4 Aufgaben | Herkunft entfernen | Ersetzter Zwischenstand | Herkunft sollte kurzzeitig entfallen; diese Aussage wurde am selben Tag zurückgenommen. | Entscheidungshistorie sichtbar halten | +| WF-P4 Aufgaben | Herkunft | Genommen / wieder aufgenommen | Manuell, Chat, Formular oder Automation; systemseitig gesetzt und außer bei Manuell mit Deep Link zur konkreten Quelle. | Aktuell gültige Entscheidung von David 2026-08-22 | +| WF-P4 Aufgaben | Globaler Aufgaben-Feldvertrag | Genommen | Gilt für Liste, Detail, Drawer, Anlegen/Bearbeiten, Einbettung und künftige Aufgabenflächen: Titel, editierbarer Status, Verantwortlich, optionale Frist + Uhrzeit, Priorität, Verknüpfung, Markdown/Checkliste, Beobachter, Tags, Erinnerung und Anhänge. | Kanonisch im Paket; als global innerhalb des Aufgabenmoduls präzisiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S02 als eigene Seite | Ersetzt | Die frühere Entscheidung wird sichtbar historisiert; S02 ist kein normaler Seitenwechsel mehr. | Durch route-gebundenes Vollbild-Modal ersetzt; David 2026-08-22 | +| WF-P4 Aufgaben | S02 alte Spaltenzuordnung | Ersetzt | Der Zwischenstand `Inhalt links / Eigenschaften rechts` gilt nicht mehr. | Sichtbar korrigiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S02 Basis und Darstellungsform | Genommen / final | Versuch 4 (`b4e91d35-0d28-43d1-941e-e67a7ec3d834`) ist die finale Basis für `/tasks/:id`. `Dialog Fullscreen` bleibt direkte Wurzel; kein zusätzliches `DialogLayout`, `Dialog` oder `Dialog.Content`. Kopf/Banner volle Breite; Eigenschaften links, Beschreibung/Anhänge/Verknüpfungen/Verlauf rechts. | David + MCP-Readback/Render 2026-08-23 | +| WF-P4 Aufgaben | S02 Eigenschaften bearbeiten | Genommen | Nutzeränderbare Werte stehen links als direkt bedienbare Dropdowns/Picker: Status, Priorität, Frist/Uhrzeit, Verantwortlich, Tags, Beobachter und Erinnerung. Kein globaler Bearbeiten-Modus; Herkunft, Ersteller und Erstellzeit bleiben lesend. Titel und Beschreibung sind direkt editierbare Texte. | David 2026-08-22 | +| WF-P4 Aufgaben | S02 Titel, Banner und Editor | Genommen | Titel als klar erkennbarer, kompakt umrandeter Inline-Edit-Stack mit Stift; V1-Banner direkt unter den Titel und ohne generisches `Aktion`; Beschreibung mit kompakter, auf Aufgaben reduzierter Editorleiste nach P7 M07/V07. | Mail-spezifische Tools entfallen; Persistenzlogik erst im Development; David 2026-08-22 | +| WF-P4 Aufgaben | S02 Anhänge | Genommen / sichtbar umgesetzt | Rechts direkt unter der Beschreibung: kompakte Dateizeilen mit Icon/Name, Größe, hochladender Person und festem `Datum · Uhrzeit`; `+ Datei hinzufügen` plus Drag-and-drop. Alle drei Drei-Punkte-Menüs enthalten `Öffnen`, `Herunterladen`, `Entfernen`. | Finaler Versuch 4; Uploadfortschritt/Fehler im Development; 2026-08-23 | +| WF-P4 Aufgaben | S02 Verknüpfungszeilen | Genommen | V1-Muster behalten: links Icon + Art in einer festen, für alle Arten identischen Spaltenbreite; rechts der Datensatzname als Link, optional die Objekt-ID und ganz rechts ein Drei-Punkte-Menü mit `Verknüpfung auflösen`. | Auflösen entfernt nur die einzelne Verbindung; David 2026-08-22 | +| WF-P4 Aufgaben | S02 Verknüpfung hinzufügen | Genommen | Kleiner Button `+ Verknüpfung` rechts im Abschnittskopf öffnet eine gemeinsame Suche für Projekt, Kontakt, Organisation und Lead; die Auswahl erscheint als weitere kompakte Zeile. | David 2026-08-22 | +| WF-P4 Aufgaben | S02 Verlauf | Genommen / final | Rechts sichtbare Timeline, zeitlich von unten nach oben: ältere Ereignisse unten, neueste oben. `Neueste zuerst` ist ein Sortier-Dropdown mit `Älteste zuerst`. Jeder Eintrag zeigt Profilbild beziehungsweise System-Icon, Akteursname, konkrete Aktion und genau einmal `Datum · Uhrzeit` in einer festen rechtsbündigen Spalte; Datumstrenner gliedern den Verlauf. | Doppelte Datumzeilen entfernt; 2026-08-23 | +| WF-P4 Aufgaben | S02 Dropdown-Vertrag | Genommen / umgesetzt | Statusoptionen tragen passende Warning-/Information-/Positive-Badges. Priorität verwendet in Trigger, Optionen und Verlauf die bestehenden `ProjectCard.PriorityBadge`-Varianten: `Niedrig` grün, `Mittel` gelb, `Hoch` rot, `Kritisch` violett. Links vor dem Text steht jeweils der passende Vier-Strich-`ProjectCard.PriorityIndicator`. Verantwortlich bleibt Markus Weber und bietet Personen mit Avatar/Rolle sowie Projektteam/Anlagenbau als Gruppen. Fälligkeit, Erinnerung, Editorformat und Verlaufssortierung sind Dropdowns; Tags/Beobachter sind Multi-Selects. | Alle `edit_page`-Aufrufe ohne Parser-Warnung; Readback und Render 2026-08-23 | +| WF-P4 Aufgaben | S02 gelöschte Varianten | Erledigt | Gelöscht: `edaa3c80-5661-4941-bee6-720d6e82311b`, `4f50b0da-ed0d-4efd-8fb4-c6268288a162`, `6d371a0c-dad1-464b-9f53-a014a82870df`, `06bf95c5-b004-4c8e-9056-92cfda59698d`, `04618fe2-bf23-4cd5-b83e-ac9cb176581a`, `1f2a06d4-88bc-4374-ba1f-0b1a35179c91`. | Alle sechs mit `force:false`, keine Referenzen; 2026-08-23 | +| WF-P4 Aufgaben | Verknüpfungsumfang | Präzisiert | M01 setzt eine initiale primäre Verknüpfung; S02 kann zusätzliche Kontext-Verknüpfungen zu Projekt, Kontakt, Organisation oder Lead getrennt anzeigen und verwalten. | Früherer reiner Ein-Link-Stand sichtbar erweitert; David 2026-08-22 | +| WF-P4 Aufgaben | M01 Datenmodi und Felder | Genommen / final | Eine finale M01-Oberfläche deckt globale Anlage, Objektkontext und Duplizieren datengetrieben ab. Status, Fälligkeit/Uhrzeit, Priorität, Erinnerung, Verantwortlich, Tags, Beobachter, Beschreibung/Checkliste, Verknüpfung und Anhänge folgen dem globalen Vertrag. | M01 V5; Abschluss-Readback/Render 2026-08-23 | +| WF-P4 Aufgaben | S01 Grundrichtung | Genommen | V1-Tabelle und Bulk-Logik als Basis, V2-Header übernehmen; Priorität Kritisch bleibt; keine Fälligkeitsgruppen. | Validiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S01 Standardspalten | Genommen | Auswahl, Aufgabe, Priorität, Fälligkeit, Verknüpfung, Verantwortlich, Status, Tags und Aktionen. Tags stehen nach Status; maximal zwei sichtbar, weitere als `+N`, kein Umbruch. Herkunft bleibt im Modell, ist S01-Filter und wird im Detail gezeigt. | Validiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S01 Designzustand | Genommen | Subframe zeigt die Maximalansicht: Filter, mindestens zwei ausgewählte Zeilen, Auswahlzähler und vollständige aktive Bulk-Leiste gleichzeitig. | Konditionales Einblenden ist Development-Logik; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Standardfilter | Genommen | Suche, Status, Priorität, Fälligkeit, Verantwortlich, Verknüpfung, Tags, Herkunft und Archiviert sind sichtbar. | Herkunft ist Filter und Detailfeld, aber keine Tabellenspalte; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Bulk-Aktionen | Genommen | Status, Priorität, Fälligkeit, Zuweisen, Tags und Löschen. Status deckt Offen/In Bearbeitung/Erledigt ab. | Als aktive Maximalansicht sichtbar; Logik im Development; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Zeilenverhalten | Genommen | Freie Zeile/Titel öffnet S02; Checkbox selektiert nur; Verknüpfung öffnet ihr Objekt; interaktive Controls navigieren nicht. | Validiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S01 Inline und Zeilenaktionen | Genommen / korrigiert | Priorität, Fälligkeit, Verantwortlich, Status und Tags sind inline editierbar; Titel und Verknüpfung nicht. Nur Erledigen ist als grüner Häkchen-Icon-Button mit Tooltip sichtbar. Mehr-Menü ausschließlich Öffnen, Duplizieren, Löschen; Wieder öffnen entfällt und läuft über Status. | `Details öffnen` heißt nur `Öffnen`; korrigiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S01 Überfälligkeit | Genommen | Kein großes rotes Banner und keine Fälligkeitsgruppen; überfällige Fristen rot, kompakter Zähler `3 überfällig` als Direktfilter. | Klick setzt `Fälligkeit: Überfällig`; validiert durch David 2026-08-22 | +| WF-P4 Aufgaben | S01 Standardsortierung | Development-Default | Aktiv vor erledigt; aktiv in der Reihenfolge überfällig, kommende Fristen, ohne Frist; erledigt unten und zuletzt erledigte zuerst. | In Obsidian festhalten, aber nicht tiefer im Screendesign ausarbeiten; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Tabellenfooter | Genommen | V1-Footer behalten: Gesamtzahl, anklickbarer Überfällig-Zähler und Erledigt-Zahl links; normale Pagination rechts. | Sichtbarer Bestandteil der Maximalansicht; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Empty/Loading/Error | Zurückgestellt / 80-20 | Keine weitere Designausarbeitung und keine eigenen Subframe-Seiten; spätere Development-Standards. | Kein Blocker für den finalen S01-Kandidaten; David 2026-08-22 | +| WF-P4 Aufgaben | S01 Auswahlkandidaten und Altvarianten | Erledigt / final | B3 (`7dcb65c5-ba2c-490a-ad06-8758e8e6e913`) ist der finale S01-Screen. Frühere B-/A-/C-/V1-/V2-Stände bleiben nur in der Entscheidungshistorie. | Finaler MCP-Readback 2026-08-23 | +| WF-P4 Aufgaben | M01 Dialog-Komposition | Akzeptiert / final | M01 V5 verwendet die im Subframe-Projekt exportierte Dialog-Komposition. Die frühere abstrakte Hierarchiefrage ist kein Screen-Handoff-Blocker. | Final gerendert 2026-08-23 | +| WF-P4 Aufgaben | Zustände und Feedback | Dokumentiert / final | Empty/Loading/Error, 404/Permissions, Archivhinweise, deaktivierter Zuständiger, gelöschte Verknüpfung, Upload, Save, Success und Undo sind verbindlich in Z01 beschrieben und erhalten auf Wunsch keine eigenen Subframe-Seiten. | Nutzerentscheidung 2026-08-23 | +| WF-P4 Aufgaben | Löschen oder archivieren | Genommen / final | M02 und M02b zeigen drei gleich große Footer-Buttons: Abbrechen, blau `Lieber archivieren`, rot Löschen. Die sichere Alternative führt in den Archivieren-Pfad. | Beide Dialoge gelesen und gerendert 2026-08-23 | | WF-P4 Dateien | Presets Meine/Alle Dateien | Genommen | Davids "meine Ablage" ueber den Verantwortlicher-Filter. | Kein neues Datenmodell | | WF-P4 Dateien | Teilen/Freigeben einzelner Dateien | Genommen (v1) | Davids Entscheidung 2026-07-08; Umfang: intern (Personen/Gruppen, ansehen/bearbeiten) + oeffentlicher Link; Preset "Mit mir geteilt". | Change-Request an Dev noetig; Screen M01 | | WF-P4 Dateien | Ordner, Versionen | Backlog | Bleiben v2. | - | diff --git a/05 HiveGrid Map/HiveGrid Map.canvas b/05 HiveGrid Map/HiveGrid Map.canvas index fdcd3ca7..12116015 100644 --- a/05 HiveGrid Map/HiveGrid Map.canvas +++ b/05 HiveGrid Map/HiveGrid Map.canvas @@ -35,7 +35,7 @@ {"id":"903e3384b0a5e623","type":"text","text":"**Detail-Flows:** 9 Wireframe-Pakete mit eigenen Canvases in eigenständigen `02 Wireframes/P2 …/`-Toolordnern (Login, Signup, Reset, Set Password, 2FA, RBAC …) — siehe Tracker","x":2777,"y":480,"width":460,"height":220}, {"id":"3e27875daca5713d","type":"text","text":"## Login, Registrierung & Workspace\n**Ticket:** `D-P2` · **Status:** ✅ validiert / in Subframe\n**Wo:** Login-Seiten + Einstellungen\n\n**Was drin ist:** Registrierung, Login + 2FA, Passwort vergessen/ändern, Workspace-Auswahl + neuer Workspace, Profil & Sicherheit, Mitarbeiter & Rollen (Admin)\n\n**Stand:** 9 Wireframe-Pakete fertig gebaut. Konto/Workspace löschen bewusst geparkt. → eigenständige `02 Wireframes/P2 …/`-Toolordner","x":2777,"y":80,"width":460,"height":360,"color":"4"}, {"id":"ce5632682989a6ca","type":"text","text":"## Website (Landing & Demo-Anfrage)\n**Ticket:** `D-WEB` · **Status:** ⬜ offen\n**Wo:** 🌐 hivegrid.de\n\n**Was drin ist:** Startseite, Features-Seite, Preise-Teaser, Demo-Anfrage-Formular\n\n**Warum wichtig:** Der erste Eindruck nach außen. Farben/Schriften sind dieselben wie in der App. Demo-Anfragen landen im Lead-Eingang.","x":2007,"y":80,"width":460,"height":360,"color":"2"}, - {"id":"e21930b7073823f8","type":"text","text":"## Aufgaben\n**Ticket:** `D-P4` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/tasks` + überall als Reiter\n\n**Was drin ist:** Aufgaben-Liste (Meine / von mir erstellt / Alle), Aufgabe mit Frist, Priorität, Zuständigem (Person oder Gruppe), Beobachtern und Verknüpfung (Kontakt/Projekt/…)\n\n**So funktioniert's:** Einmal gebaut, überall eingebettet — jede Detailseite hat einen Aufgaben-Reiter. Aufgaben können auch aus Chat, Formularen oder Automationen entstehen (Herkunft sichtbar). Erinnerung vor/nach Frist.","x":800,"y":3100,"width":460,"height":360,"color":"5"}, + {"id":"e21930b7073823f8","type":"text","text":"## Aufgaben\n**Ticket:** `D-P4` (Teil) · **Status:** ✅ Development-Handoff\n**Wo:** `/tasks` + überall als Reiter\n\n**Bestand:** 16 Live-Seiten. [Flow öffnen](https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit)\n\n**Final:** S01 B3, S02 Versuch 4, S03 Drawer, M01, V01 Tabelle + Minimal sowie zehn Interaktionsmodals.\n\n**Abgesichert:** Notiz-, Datei-, Verknüpfungs-, Dirty-Close- und Löschpfade; M02/M02b mit blauem `Lieber archivieren`. Zustände/Feedback stehen in Z01. Mobile ist nicht Teil der Abnahme.\n\n**Hinweis:** Flow heißt weiter `WF-P16 Aufgaben`; eindeutig dokumentiert und nicht blockierend.","x":800,"y":3100,"width":460,"height":400,"color":"4"}, {"id":"036e2a807223753d","type":"text","text":"## Dateien\n**Ticket:** `D-P4` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/files` + überall als Reiter\n\n**Was drin ist:** Datei-Übersicht (Tabelle oder Kacheln, Filter, Mehrfach-Aktionen inkl. ZIP), Upload per Drag&Drop (mehrere gleichzeitig, mit Fortschritt), Datei-Detail mit Vorschau\n\n**So funktioniert's:** Dateien hängen an Kontakten/Projekten/… mit Rolle (z. B. »Angebot«). iPhone-Fotos (HEIC) werden automatisch zu JPG. Versionen kommen in v2.","x":1450,"y":3100,"width":460,"height":360,"color":"5"}, {"id":"d48196ed3e229be5","type":"text","text":"**Standards:** `04 Standards/Subframe UI Standards/` — validierte Layout-Regeln","x":690,"y":480,"width":460,"height":220}, {"id":"c02969250252a3ab","type":"text","text":"## Feinschliff vor Launch\n**Ticket:** `D-POLISH` · **Status:** ⬜ offen\n**Wo:** 🌐 alles öffentlich Sichtbare\n\n**Was drin ist:** Letzter Polier-Durchgang: Terminbuchungs-Seite, öffentliche Formulare, Marketing-Mails · danach Screenshots als »So muss es aussehen«-Referenz einfrieren\n\n**Warum wichtig:** Kommt ganz am Ende, direkt vor dem Launch. Braucht Terminbuchung + Dashboard fertig.","x":1190,"y":80,"width":460,"height":360,"color":"3"}, diff --git a/05 HiveGrid Map/HiveGrid Map.md b/05 HiveGrid Map/HiveGrid Map.md index f14fe889..1bd3c2a6 100644 --- a/05 HiveGrid Map/HiveGrid Map.md +++ b/05 HiveGrid Map/HiveGrid Map.md @@ -3,7 +3,7 @@ kind: map project: HiveGrid Screen Project area: HiveGrid Map status: active -stand: 2026-08-04 +stand: 2026-08-23 --- # HiveGrid Map @@ -58,7 +58,7 @@ Gesamtkarte aller HiveGrid-v1-Features. Eine Karte = **ein Feature** (so benannt | Team-Chat 📱 | Kommunikation | D-CHAT | 🟠 | ⬜ offen | | Telefonie (Anrufe) | Kommunikation | D-P15 | 🔵 | ⬜ offen | | Benachrichtigungen | Kommunikation | D-P3 (Teil) | 🔵 | 🟡 vorgeplant | -| Aufgaben | Aufgaben & Dateien | D-P4 (Teil) | 🔵 | 🟡 vorgeplant | +| Aufgaben | Aufgaben & Dateien | D-P4 (Teil) | 🔵 | ✅ validiert / Development-Handoff | | Dateien | Aufgaben & Dateien | D-P4 (Teil) | 🔵 | 🟡 vorgeplant | | Automations-Baukasten (Flow-Editor) | Automationen | D-FLOW | 🔴 schwerste UI | ✅ validiert | | Automationen: Übersicht & Verläufe | Automationen | D-P12 | 🟠 | ✅ validiert | @@ -357,16 +357,24 @@ Abhaken = in der groben Planung berücksichtigt (Screens/Flow verortet). Quelle: ### Aufgaben & Dateien -#### Aufgaben — `D-P4` (Teil) — 🟡 vorgeplant (2026-07-08) -- [x] Aufgaben-Liste (Meine / von mir erstellt / Alle, Filter, Mehrfach-Aktionen, Schnell-Aktionen in der Zeile) -- [x] Aufgabe: Frist (überfällig = rot), Priorität, zuständig Person ODER Gruppe, Beobachter, Verknüpfung zu Kontakt/Projekt/… -- [x] Herkunft sichtbar: von Hand / aus Chat / aus Formular / aus Automation — mit Link zur Quelle -- [x] Neue Aufgabe als Dialog (auch vorbefüllt aus einer Detailseite heraus) -- [x] Als Reiter in jeder Detailseite eingebettet — als eigener Frame V01 (Einbett-Muster) -- [x] Erinnerungs-Hinweise (vor / bei / nach Frist), Auto-Archiv nach 30 Tagen -- Davids Ergänzung (Delta): Topbar-Button »Meine Aufgaben« + Aufgaben-Drawer rechts (Schnellzugriff) -- Paket: `02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/` (Screens validiert; Subframe steht aus) - +#### Aufgaben — `D-P4` (Teil) — ✅ validiert / Development-Handoff (2026-08-23) +- [x] Aufgaben-Liste mit Filtern, Inline-Feldern, Schnell- und Mehrfachaktionen. +- [x] Aufgabe mit Status, Fälligkeit plus optionaler Uhrzeit, Priorität, genau einer verantwortlichen Person oder Gruppe, Beobachtern, Tags, Erinnerung, Anhängen und typisierten Verknüpfungen. +- [x] Verantwortlich ist nie leer; der eigene Nutzer ist Standard und kann auf eine andere Person oder Gruppe gewechselt werden. +- [x] M01 deckt globale Anlage, Objektkontext und Duplizieren datengetrieben in einer Oberfläche ab. +- [x] Herkunft bleibt systemseitig Manuell, Chat, Formular oder Automation; außer bei Manuell mit Link zur konkreten Quelle. +- [x] Zwei finale V01-Repräsentationen für die Einbettung in Detailseiten. +- [x] Globaler Topbar-Button `Meine Aufgaben` mit rechtem Drawer und `Vollansicht`. +- [x] Zehn entscheidungsrelevante Interaktionsmodals; M02/M02b bieten zusätzlich den gleich großen blauen Button `Lieber archivieren`. +- Finaler Live-Bestand: **16 Seiten** — S01, S02, S03, M01, zwei V01-Einbettungen und zehn Interaktionsmodals. [Subframe-Flow](https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit) +- S01 final: [B3 · Kompakter Statuspunkt](https://app.subframe.com/f023064a5ca0/design/7dcb65c5-ba2c-490a-ad06-8758e8e6e913/edit). +- S02 final: [Versuch 4 · Verlauf im Fokus](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit) als route-gebundenes Vollbild-Modal; Eigenschaften links, Arbeitsinhalt rechts; Notiz-Einstieg und bereinigte Zeitspalte enthalten. +- S03 final: [Aufgaben-Drawer](https://app.subframe.com/f023064a5ca0/design/c7978061-8467-49d9-adf3-614301843bb2/edit) mit farbigen Fälligkeitsgruppen, Accordion-Text und Footer `Vollansicht`. +- M01 final: [Inhalt + Planung](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit). +- V01 final: [Kompakte Tabelle](https://app.subframe.com/f023064a5ca0/design/7dd5df56-7cea-445b-91f2-29b9f1fbb407/edit) und [Minimal-Liste](https://app.subframe.com/f023064a5ca0/design/841f9e3f-ca13-4fed-aac6-6977cea19a03/edit). +- Empty/Loading/Error, Permission, Upload, Save, Success und Undo sind verbindlich in `Screens/Z01 Zustände und Feedback.md` dokumentiert und bewusst nicht als eigene Subframe-Seiten gebaut. Mobile war nicht Teil der Abnahme. +- Der technische Flow-Name `WF-P16 Aufgaben` weicht weiterhin vom Paketnamen ab, ist aber eindeutig dokumentiert und kein Handoff-Blocker. +- Paket: `02 Wireframes/P4 Aufgaben/WF-P4 Aufgaben/` · [Ticket-Handoff](../Tickets/Fertige%20Tickets/D-P4%20Aufgaben.md) #### Dateien — `D-P4` (Teil) — 🟡 vorgeplant (2026-07-08) - [x] Datei-Übersicht (Tabelle/Kacheln, Filter nach Verknüpfung/Typ/Tags, Mehrfach-Aktionen inkl. ZIP-Download) + Presets »Meine Dateien / Alle« - [x] Upload per Drag&Drop (mehrere gleichzeitig, Fortschritt je Datei, Fehler + erneut versuchen) diff --git a/Tickets/Fertige Tickets/D-P4 Aufgaben.md b/Tickets/Fertige Tickets/D-P4 Aufgaben.md new file mode 100644 index 00000000..8ecdd159 --- /dev/null +++ b/Tickets/Fertige Tickets/D-P4 Aufgaben.md @@ -0,0 +1,105 @@ +--- +kind: ticket-handoff +project: HiveGrid Screen Project +ticket: D-P4 +area: Aufgaben +status: Fertig / Development-Handoff +repo: https://git.tool-ctrl.de/toolctrl-labs/HiveGrid-Wireframes +stand: 2026-08-23 +--- + +# D-P4 Aufgaben + +Repo: https://git.tool-ctrl.de/toolctrl-labs/HiveGrid-Wireframes + +Zentrale Tracker-Datei: [Screen Paket Tracker](../../02%20Wireframes/Screen%20Paket%20Tracker.md) + +Flow-Paket: [WF-P4 Aufgaben](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/WF-P4%20Aufgaben.md) + +Canvas: [WF-P4 Aufgaben.canvas](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/WF-P4%20Aufgaben.canvas) + +Subframe: [WF-P16 Aufgaben](https://app.subframe.com/f023064a5ca0/flow/192a194e-bb51-4f4c-9f02-7c05d26584e8/edit) + +## Kurzfassung + +Der gemeinsam validierte Aufgaben-Flow ist als Development-Handoff abgeschlossen. Der finale Live-Stand umfasst **16 Seiten in einem Subframe-Flow**: S01, S02, S03, M01, zwei V01-Einbettungsvarianten und zehn entscheidungsrelevante Interaktionsmodals. + +Der Bestand wurde am 2026-08-23 erneut aus Subframe gelesen. S03, M01 und beide V01-Seiten wurden im Abschlusslauf zusätzlich als Desktop gerendert; M02 und M02b wurden nach der finalen Archivieren-Anpassung ebenfalls gelesen und gerendert. UUIDs, Direktlinks, Paket-MD, Screen-Dateien, Canvas, Tracker und HiveGrid Map sind synchron. + +Der Subframe-Flow heißt technisch weiterhin `WF-P16 Aufgaben`. Die Zuordnung zu `D-P4` / `WF-P4 Aufgaben` ist eindeutig dokumentiert und blockiert die Übergabe nicht. + +## Gemacht + +- Finale Aufgaben-Liste B3, Vollbild-Detail, Topbar-Drawer und Erstellungsdialog validiert. +- Zwei Einbettungsdarstellungen abgeschlossen: datenreiche Tabelle und reduzierte gruppierte Liste. +- Löschen einzeln und gesammelt, Verknüpfen/Lösen, Dirty-Close, offene Checklistenpunkte, Verlaufsnotiz, Datei hinzufügen/entfernen und Filter-Preset als eigene Modals abgesichert. +- M02 und M02b um den gleich großen blauen Button `Lieber archivieren` ergänzt. +- S02-Verlauf um `Notiz hinzufügen` ergänzt und doppelte Datumzeilen entfernt. +- M01-Terminologie auf `Fälligkeit` vereinheitlicht und globale Anlage, Objektkontext sowie Duplizieren als Datenmodi derselben Oberfläche festgelegt. +- Empty-, Loading-, Error-, Permission-, Upload-, Save-, Success- und Undo-Verträge vollständig in Z01 dokumentiert; keine zusätzlichen Subframe-Seiten gebaut. +- Mobile ausdrücklich aus Scope und Abnahme entfernt. +- Frühere M01b/M01c- und V01-Zwischenvarianten aus dem aktiven Inventar entfernt; Historie bleibt in den Screen-Dateien nachvollziehbar. + +## Finale Produktentscheidungen + +- **S01:** B3 ist die finale Liste. Priorität, Fälligkeit, Verantwortlich, Status und Tags sind inline editierbar; Titel und Verknüpfung navigieren. Bulk-Aktionen decken Status, Priorität, Fälligkeit, Zuweisen, Tags und Löschen ab. +- **S02:** Route-gebundenes Vollbild-Modal unter `/tasks/:id`; Eigenschaften links, Beschreibung/Checkliste, Anhänge, Verknüpfungen und Verlauf rechts. +- **S03:** 540-px-Drawer mit farbigen Fälligkeitsgruppen, Accordion-Aufgabentext, klarer Verknüpfung und Footer `Neue Aufgabe` / `Vollansicht`. +- **M01:** Eine Oberfläche für globale Anlage, Objektkontext und Duplizieren. Verantwortlich ist nie leer; im Objektkontext wird die primäre Verknüpfung vorbelegt. +- **V01:** Tabelle für breite datenreiche Einbettungen, Minimal-Liste für reduzierte Kontexte; beide sind auf das aktuelle Objekt vorgefiltert. +- **Löschen:** M02/M02b zeigen Abbrechen, blau `Lieber archivieren` und rot Löschen als gleich große Footer-Aktionen. +- **Zustände:** Reine Rückmeldung und technische Ausnahmefälle werden in Development über bestehende Standardkomponenten gemäß Z01 umgesetzt. + +## Hauptfluss + +```text +Sidebar Aufgaben -> S01 -> S02 +Topbar Meine Aufgaben -> S03 -> S02 oder S01 Vollansicht +Detail-Reiter -> V01 Tabelle / Minimal -> S02 + +S01 / S03 / Detail / V01 -> M01 +S01 / S02 / S03 / M01 / V01 -> M02–M09 +M02–M09 -> Z01 für dokumentierte Zustände und Rückmeldungen +``` + +## Vollständiges Subframe-Inventar + +| # | Live-Name | UUID | Repo | Subframe | +|---:|---|---|---|---| +| 1 | S01 B3 · Kompakter Statuspunkt | `7dcb65c5-ba2c-490a-ad06-8758e8e6e913` | [S01](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/S01%20Aufgaben-Liste.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/7dcb65c5-ba2c-490a-ad06-8758e8e6e913/edit) | +| 2 | S02 Fullscreen Versuch 4 · Verlauf im Fokus | `b4e91d35-0d28-43d1-941e-e67a7ec3d834` | [S02](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/S02%20Aufgaben-Detail.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/b4e91d35-0d28-43d1-941e-e67a7ec3d834/edit) | +| 3 | S03 | `c7978061-8467-49d9-adf3-614301843bb2` | [S03](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/S03%20Aufgaben-Drawer.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/c7978061-8467-49d9-adf3-614301843bb2/edit) | +| 4 | V01 A · Kompakte Tabelle | `7dd5df56-7cea-445b-91f2-29b9f1fbb407` | [V01](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/V01%20Eingebettete%20Kompakt-Variante.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/7dd5df56-7cea-445b-91f2-29b9f1fbb407/edit) | +| 5 | V01 Minimal · Sidebar-Liste | `841f9e3f-ca13-4fed-aac6-6977cea19a03` | [V01](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/V01%20Eingebettete%20Kompakt-Variante.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/841f9e3f-ca13-4fed-aac6-6977cea19a03/edit) | +| 6 | M01 V5 · Inhalt + Planung | `826b6837-a486-42c8-bbe6-d3745528993e` | [M01](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M01%20Aufgabe%20anlegen.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/826b6837-a486-42c8-bbe6-d3745528993e/edit) | +| 7 | M02 Aufgabe löschen | `a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/a5d5de83-f8a6-4270-abe3-3e11d3f7bdb3/edit) | +| 8 | M02b Mehrere Aufgaben löschen | `47e17c3e-aef5-449b-b042-1c9898d9f6cd` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/47e17c3e-aef5-449b-b042-1c9898d9f6cd/edit) | +| 9 | M04 Verknüpfung lösen | `c5c91314-ef9b-4434-b574-168b2ee99947` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/c5c91314-ef9b-4434-b574-168b2ee99947/edit) | +| 10 | M03 Verknüpfung hinzufügen | `8020d4ea-9823-400f-b779-dbb78f3cef2e` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/8020d4ea-9823-400f-b779-dbb78f3cef2e/edit) | +| 11 | M05 Änderungen verwerfen | `ae739bed-4f12-47fc-9ea2-e3cfc410abc0` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/ae739bed-4f12-47fc-9ea2-e3cfc410abc0/edit) | +| 12 | M06 Offene Punkte bestätigen | `17e1ded0-3344-49ad-bfeb-698d52f730f6` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/17e1ded0-3344-49ad-bfeb-698d52f730f6/edit) | +| 13 | M07 Notiz hinzufügen | `ac3f4aec-4d41-4d96-af71-f77931e12437` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/ac3f4aec-4d41-4d96-af71-f77931e12437/edit) | +| 14 | M08 Datei hinzufügen | `41a74bd3-2bb1-4429-bd33-2cad30be2621` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/41a74bd3-2bb1-4429-bd33-2cad30be2621/edit) | +| 15 | M08b Anhang entfernen | `35ac0b6b-04d2-4319-af87-66941cd24f1a` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/35ac0b6b-04d2-4319-af87-66941cd24f1a/edit) | +| 16 | M09 Filter-Preset speichern | `4f427f0e-73f6-4c87-956b-26014939afa9` | [Modals](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/M02-M09%20Interaktionsmodals.md) | [Öffnen](https://app.subframe.com/f023064a5ca0/design/4f427f0e-73f6-4c87-956b-26014939afa9/edit) | + +## Development-Hinweise + +- Subframe ist die visuelle Quelle; die exportierten Handler sind statisch und werden im Produkt verdrahtet. +- S02 benötigt route-gebundenes Overlay-Verhalten mit stabiler URL `/tasks/:id`. +- M01 wird nicht in drei Komponenten dupliziert. Einstiegskontext und Duplikatdaten steuern Vorbelegung und Abschlusslabel. +- M02/M02b archivieren beim blauen Alternativbutton die betroffene Aufgabe beziehungsweise Auswahl und führen keine Löschung aus. +- Zustands-, Recovery- und Feedbacklogik folgt [Z01](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/Screens/Z01%20Zust%C3%A4nde%20und%20Feedback.md). +- Das separate Paket `WF-P4 Dateien` bleibt ein eigener D-P4-Teil und ist nicht Bestandteil des 16-Seiten-Aufgaben-Flows. + +## Abschlussprüfung + +- 16 Subframe-Seiten = 16 eindeutige UUIDs und Direktlinks im Paket und in diesem Handoff. +- Alle sieben aktiven Aufgaben-Dokumente stehen auf `Fertig / Development-Handoff`. +- Paket-Canvas ist JSON-valide; IDs sind eindeutig und alle Kanten referenzieren vorhandene Nodes. +- Screen Paket Tracker, HiveGrid Map und Master-Canvas spiegeln den finalen Aufgabenstand. +- Mobile und reine technische Zustandsseiten sind bewusst nicht Teil des Subframe-Inventars. + +## Hinweis für das Ticket-System + +Diese Datei ist der kompakte fertige Handoff für den Aufgaben-Teil von `D-P4`. Die Detailwahrheit liegt im [Flow-Paket](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/WF-P4%20Aufgaben.md), den verknüpften Screen-Dateien, dem [Canvas](../../02%20Wireframes/P4%20Aufgaben/WF-P4%20Aufgaben/WF-P4%20Aufgaben.canvas) und dem [Screen Paket Tracker](../../02%20Wireframes/Screen%20Paket%20Tracker.md). diff --git a/Tickets/README.md b/Tickets/README.md index 72ea1be3..469203a2 100644 --- a/Tickets/README.md +++ b/Tickets/README.md @@ -24,3 +24,4 @@ Die Detailwahrheit bleibt in den Wireframe-Paketen und im `Screen Paket Tracker` | D-P8 + D-KANBAN | [D-P8 Pipelines Wireframes]() | | D-FLOW + D-P12 | [D-FLOW Workflow Engine]() | | D-CHAT + AK-P15b | [D-CHAT Team-Chat]() | +| D-P4 (Aufgaben) | [D-P4 Aufgaben]() |