chore(repo): sync wireframe structure and references

This commit is contained in:
david committed 2026-08-08 03:09:06 +02:00
1 parent 05d2d5777f
commit d953a79e95
453 files changed
+36639 -621

No files matched your search

@@ -0,0 +1,39 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: M01
screen: Termin anlegen/bearbeiten
typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S01 (Slot-Klick / + Termin)"
subframe: ""
---
# M01 — Termin anlegen/bearbeiten
## Ziel
Einen Termin planen wie in Google Calendar — mit Teilnehmern, und ohne jemanden doppelt zu verplanen.
## Was das Tool können muss
- **Grunddaten:** Titel, Datum + Uhrzeit (von–bis), optional ganztägig, Ort, Beschreibung/Notiz
- **Teilnehmer-Feld** (ein Feld, drei Arten):
- **Team-Mitglieder** (@-Vorschläge) — sehen den Termin sofort in ihrem HiveGrid-Kalender
- **Kontakte** (aus dem CRM) — bekommen E-Mail mit Kalender-Datei (.ics)
- **freie E-Mail-Adressen** — ebenfalls Mail + .ics, ohne Kontakt-Anlage
- **Verfügbarkeits-Check:** beim Hinzufügen interner Teilnehmer zeigt der Dialog belegt/frei im gewählten Zeitraum (»Max ist 9–12 Uhr belegt«) — Warnung, kein Block; Link »Kalender einblenden« aktiviert das Overlay in S01
- Optionale **Projekt-Verknüpfung** (Termin erscheint dann auch in der Projekt-Akte)
- Bearbeiten nutzt denselben Dialog (nur bei eigenen Terminen); Änderung informiert Teilnehmer
- Speichern → zurück in S01, Termin sichtbar; bei Google-Sync geht der Termin auch extern raus
## Pattern / Archetyp
A5 Dialog + A4 Formular-Felder. Teilnehmer-Feld = @-Erwähnungs-Muster aus dem UI-Baukasten.
## Subframe
- (erst nach explizitem OK)
@@ -0,0 +1,35 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: M02
screen: Termin-Detail
typ: Popover
umsetzung: Bauen
status: Validiert
route: "Termin-Klick in S01"
subframe: ""
---
# M02 — Termin-Detail (Popover)
## Ziel
Schnell sehen, was das für ein Termin ist, wer kommt — und mit einem Klick zur Quelle springen.
## Was das Tool können muss
- Titel, Zeit, Ort, Beschreibung, **Quelle-Badge** (Google / Buchung / Plantafel / Projekt / eigener Termin)
- **Teilnehmer-Liste mit Zu-/Absage-Status** (zugesagt / abgesagt / offen); Bounce-Marker wenn Einladungs-Mail unzustellbar (+ erneut senden)
- **Absprung zur Quelle:** Buchung → Buchungs-Detail · Einsatz → Plantafel · Projekt-Termin → Projekt-Akte · Google-Termin → nur lesen (Hinweis »kommt aus Google«)
- **Aktionen je nach Quelle:** eigene Termine → Bearbeiten (M01) + Löschen (mit Teilnehmer-Info); fremde Quellen → nur Absprung
- Für eingeladene interne Nutzer: **Zusagen/Absagen** direkt im Popover
## Pattern / Archetyp
Popover (leichtgewichtig, kein volles Modal) — Muster: Termin-Klick wie in Google Calendar.
## Subframe
- (erst nach explizitem OK)
@@ -0,0 +1,40 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: S01
screen: Kalender
typ: BESPOKE Kalender-Grid
umsetzung: Bauen
status: Validiert
route: "/calendar"
subframe: ""
---
# S01 — Kalender (Monat/Woche) ⭐
## Ziel
Alle Termine an einem Ort — egal ob aus Google, einer Online-Buchung, der Plantafel, einem Projekt oder von Hand angelegt. Und: neue Termine direkt hier planen.
## Was das Tool können muss
- **Monats- und Wochen-Ansicht** mit Umschalter, Heute-Knopf, Zeitraum-Navigation (Pfeile)
- **Quell-Marker je Termin** (Farbe/Icon): Google · Buchung · Plantafel-Einsatz · Projekt-Termin · eigener Termin
- **Kollegen einblenden (Overlay):** Mitarbeiter-Auswahl (Avatare/Checkboxen) — deren HiveGrid-Termine erscheinen normal, private Google-Termine nur als **»belegt«** ohne Titel/Details
- **Termin anlegen:** Klick auf freien Slot oder »+ Termin«-Knopf → M01
- **Termin öffnen:** Klick auf Termin → M02 (Detail-Popover)
- **Verbinden-Hinweis** solange kein Google-Konto verbunden ist (dismissbar, mit »Verbinden«-Knopf → S02); Kalender ist auch ohne Verbindung voll nutzbar
- **Re-Connect-Banner** bei kaputter Verbindung (Klartext + Lösungs-Knopf)
- Dezenter Hinweis bei frischen Sync-Konflikten mit Link zum Konflikt-Verlauf (S02)
- Zahnrad → Kalender-Einstellungen (S02)
- Zustände: leer (CTA Termin anlegen / Google verbinden), laden, Fehler
## Pattern / Archetyp
BESPOKE (Kalender-Grid, mittlerer Aufwand laut Ticket). Zustands-Set A7.
## Subframe
- (erst nach explizitem OK)
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: S02
screen: Kalender-Einstellungen & Sync
typ: Settings (A6)
umsetzung: Bauen
status: Validiert
route: "/calendar/settings"
subframe: ""
---
# S02 — Kalender-Einstellungen & Sync
## Ziel
Sein eigenes Google-Konto verbinden und den Abgleich steuern — pro Mitarbeiter, ohne Admin-Umweg. Erreichbar direkt aus dem Kalender (Zahnrad / Verbinden-Hinweis).
## Was das Tool können muss
- **Provider-Auswahl:** Google (aktiv) · Outlook (**ausgegraut, »bald verfügbar«** — v2); UI bleibt provider-neutral
- **Verbinden:** startet den OAuth-Assistenten im WF-P5-Muster (M01) → danach Connect-Card mit Status-Ampel, verbundenem Konto (E-Mail), letzter Sync-Zeit
- **Kalender-Auswahl:** welche Google-Kalender abgeglichen werden (Checkbox-Liste)
- **Sync-Richtung:** beide Richtungen · nur HiveGrid → Google · nur Google → HiveGrid
- **Trennen** mit »auch extern entfernen?«-Wahl (Trennen-Modal aus WF-P5 M03, erweitert um die Extern-Wahl) — kein Hard-Delete
- **Re-Connect-Banner** bei kaputter Verbindung (Token abgelaufen o. ä.)
- **Konflikt-Verlauf-Sektion:** letzte 50 automatische Auflösungen in Klartext — »Termin ›Wartung Müller‹ wurde in Google auf 14:00 verschoben — HiveGrid hat übernommen« (Last-Write-Wins); jede Auflösung erzeugt zusätzlich eine Benachrichtigung
- Hinweis: Verbindung ist **pro Mitarbeiter** — jeder verwaltet hier nur sein eigenes Konto; fremde Termin-Inhalte bleiben privat (nur »belegt«)
## Pattern / Archetyp
A6 Settings/Connection — Connection-Card-Muster aus WF-P5 Integrationen; Konflikt-Verlauf analog Abgleich-Verlauf (WF-P5 S03), hier nur als Sektion.
## Subframe
- (erst nach explizitem OK)
@@ -0,0 +1,42 @@
{
"nodes":[
{"id":"md-paket","type":"file","file":"02 Wireframes/P16 Kalender/WF-P16 Kalender/WF-P16 Kalender.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-kalender","type":"group","x":-80,"y":-100,"width":1140,"height":380,"label":"Kalender (Desktop, Bespoke)"},
{"id":"group-dialoge","type":"group","x":-80,"y":460,"width":1140,"height":380,"label":"Termin-Dialoge"},
{"id":"group-sync","type":"group","x":1300,"y":-100,"width":1120,"height":380,"label":"Einstellungen & Sync (pro Nutzer)"},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nSidebar → Kalender.\n\nQuellen: Google · Buchung · Plantafel · Projekt · eigene Termine. Kollegen als Overlay einblendbar (fremde private Google-Termine nur »belegt«).","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P16 Kalender/WF-P16 Kalender/Screens/S01 Kalender.md","x":560,"y":0,"width":420,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P16 Kalender/WF-P16 Kalender/Screens/M01 Termin-Dialog.md","x":0,"y":560,"width":420,"height":200},
{"id":"m02","type":"file","file":"02 Wireframes/P16 Kalender/WF-P16 Kalender/Screens/M02 Termin-Detail.md","x":580,"y":560,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P16 Kalender/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md","x":1340,"y":0,"width":420,"height":200},
{"id":"note-sync","type":"text","text":"# Wiederverwendet aus WF-P5\n\nOAuth-Assistent (M01) + Trennen-Modal (M03, + »auch extern entfernen?«).\n\nOutlook als Teaser »bald verfügbar« (v2). Konflikt-Verlauf als Sektion hier.","x":1900,"y":0,"width":460,"height":200}
],
"edges":[
{
"id":"e-entry",
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"s01",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
},
{"id":"e-new","fromNode":"s01","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Slot-Klick / + Termin"},
{"id":"e-open","fromNode":"s01","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"Termin-Klick"},
{"id":"e-edit","fromNode":"m02","fromSide":"left","toNode":"m01","toSide":"right","toEnd":"arrow","label":"Bearbeiten"},
{"id":"e-settings","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Zahnrad / Verbinden"},
{
"id":"e-sync-note",
"fromNode":"note-sync",
"fromSide":"left",
"toNode":"s02",
"toSide":"right",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
@@ -0,0 +1,130 @@
---
kind: wireframe-package
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
typ: Flow
status: Validiert
subframe: ""
canvas: "WF-P16 Kalender.canvas"
---
# WF-P16 Kalender
Status: Validiert (Screen-Liste)
Subframe-Link: -
Canvas: [Canvas](<WF-P16 Kalender.canvas>)
Stand: 2026-07-09
---
## 1. Kurzfassung
Der HiveGrid-Kalender: Monats-/Wochen-Ansicht mit allen Terminen (Google-Sync, Buchungen, Plantafel, Projekt-Termine — je mit Herkunfts-Marker). **Davids Delta: ein vollwertiger Kalender**, nicht nur eine Lese-Sicht — Termine anlegen, Personen einladen (Team, Kontakte, freie E-Mails), Kollegen-Kalender als Verfügbarkeits-Overlay einblenden. Funktioniert eigenständig ohne Google; Google-Sync ist optional (Outlook → v2, in der UI als »bald verfügbar« sichtbar).
---
## 2. Intent Check
| Frage | Antwort |
|---|---|
| Ticket/Modul | D-BOOK (Kalender-View) + D-P16 (Kalender-Verbindungen), Dev-Pendant AK-P16a |
| Nutzer-Ziel | Alle Termine an einem Ort sehen, neue Termine planen ohne Doppelbelegung, Google bleibt synchron |
| Quellen geprüft | `ticket-docs/D-BOOK.md`, `ticket-docs/D-P16.md`, `designer-briefs/P16-…md`, HiveGrid Map |
| Sicher im Scope | Kalender-Grid (Monat/Woche), Termin anlegen/bearbeiten + Einladen, Termin-Detail, Sync-Einstellungen inkl. Konflikt-Verlauf |
| Sicher nicht im Scope | Buchungsseiten + Verfügbarkeits-Editor (WF-P16 Terminbuchung); Plantafel (WF-P9); Outlook-Sync (v2) |
| Unsichere Annahmen | Termin-Objekt + Einladungen sind NICHT im Dev-Ticket — Change-Request nötig (s. Offene Fragen) |
---
## 3. Scope
| Punkt | Inhalt |
|---|---|
| Startpunkt | Sidebar »Kalender« |
| Ziel | Termin geplant (mit Teilnehmern, ohne Kollision) · Google verbunden und synchron |
| Haupt-Archetyp | **BESPOKE** (Kalender-Grid) + A6 (Einstellungen) |
| Out of scope | Booking-Pages, Plantafel-Einsätze (nur als Quelle sichtbar), Outlook |
---
## 4. Entscheidungen (validiert 2026-07-09)
| Entscheidung | Status | Notiz |
|---|---|---|
| Vollwertiger Kalender statt reiner Lese-Sicht | genommen (Delta) | Termine anlegen/bearbeiten/löschen, »alles was man für einen Kalender braucht« — **Change-Request an Dev** (Ticket sah nur Grid + Marker vor) |
| Einladen: Team + Kontakte + freie E-Mails | genommen (Delta) | Interne sehen den Termin in ihrem HiveGrid-Kalender; Externe bekommen E-Mail mit Kalender-Datei (.ics); Zu-/Absagen sichtbar |
| Kollegen-Kalender einblendbar (Overlay) | genommen (Delta) | Vor dem Einladen prüfen, ob jemand Zeit hat; fremde private Google-Termine nur als »belegt« ohne Details |
| Eigener + fremde Kalender in einer Ansicht | genommen | Plantafel bleibt die Baustellen-/Einsatz-Sicht — der Kalender ist die Termin-Sicht |
| Verbinden-Einstieg direkt im Kalender | genommen | Hinweis-Karte solange nichts verbunden ist; danach über Zahnrad → Einstellungen. Kalender ist auch ohne Google voll nutzbar |
| Provider-Auswahl mit Outlook-Teaser | genommen | Google aktiv (v1), Outlook ausgegraut »bald verfügbar« — UI bleibt provider-neutral |
| Sync-Konflikt-Verlauf in den Einstellungen | genommen | Kleine Sektion (letzte 50, Klartext: was kollidierte, wie gelöst) — Muster wie Abgleich-Verlauf WF-P5; im Kalender nur dezenter Hinweis bei frischen Konflikten |
| OAuth-Assistent + Trennen-Modal aus WF-P5 wiederverwenden | genommen | Trennen mit »auch extern entfernen?«-Wahl |
### Happy Path
1. Mitarbeiter öffnet Kalender (Woche), sieht eigene Termine quell-farbig (Google / Buchung / Plantafel / Projekt / eigene).
2. Klick auf freien Slot → Termin-Dialog: Titel, Zeit, Teilnehmer (Kollege @Max, Kontakt Müller, freie E-Mail) — beim Hinzufügen zeigt der Dialog, wer belegt ist; optional Kollegen-Kalender als Overlay einblenden.
3. Speichern → Interne sehen den Termin sofort, Externe bekommen Mail mit .ics; Zu-/Absagen laufen am Termin auf.
4. Einmalig: »Google verbinden« → OAuth (P5-Muster) → Kalender auswählen, Sync-Richtung — ab da läuft alles synchron.
### Meldungs-/Error-States (validiert)
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|---|---|---|---|---|
| Kein Google verbunden | Hinweis-Karte in S01 (dismissbar) + Bereich in S02 | nein | Nur dokumentieren | »Verbinde deinen Google-Kalender …« — Kalender funktioniert trotzdem |
| Verbindung kaputt (Token abgelaufen) | Re-Connect-Banner in S01 + S02 | nein | Nur dokumentieren | Klartext + »Neu verbinden«-Knopf |
| Sync-Konflikt (beidseitige Änderung) | Benachrichtigung (Glocke) + Eintrag im Konflikt-Verlauf (S02) | nein | Nur dokumentieren | »Termin X wurde in Google auf 14:00 verschoben — HiveGrid hat übernommen« (Last-Write-Wins) |
| Teilnehmer belegt | Inline-Warnung im Termin-Dialog | nein (bewusst buchbar) | in M01 enthalten | »Max ist 9–12 Uhr belegt« — analog Plantafel-Konflikt, aber ohne Block |
| Fremder privater Google-Termin | nur »belegt«-Block ohne Titel/Details | nein | Nur dokumentieren | Datenschutz-Vorgabe aus dem Ticket |
| Einladungs-Mail unzustellbar | Hinweis am Teilnehmer in M02 | nein | Nur dokumentieren | Bounce-Marker + erneut senden |
| Leerer Kalender | Leer-Zustand + CTA (Termin anlegen / Google verbinden) | nein | Nur dokumentieren | — |
---
## 7. Validierte Screen-Liste
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | Kalender (Monat/Woche, Quell-Marker, Kollegen-Overlay) ⭐ | BESPOKE | Bauen | `/calendar` | Validiert |
| M01 | Termin anlegen/bearbeiten (Teilnehmer + Verfügbarkeits-Check) | Modal | Bauen | aus S01 (Slot-Klick / + Termin) | Validiert |
| M02 | Termin-Detail (Quelle + Absprung, Zu-/Absagen) | Popover | Bauen | Termin-Klick in S01 | Validiert |
| S02 | Kalender-Einstellungen & Sync (Provider, Kalender-Auswahl, Richtung, Konflikt-Verlauf) | Settings (A6) | Bauen | `/calendar/settings` | Validiert |
| D01 | OAuth-Assistent | Wiederverwenden | Wiederverwenden | WF-P5 M01 | Validiert |
| D02 | Trennen-Bestätigung (»auch extern entfernen?«) | Wiederverwenden | Wiederverwenden | WF-P5 M03 (+ Extern-Wahl) | Validiert |
| D03–D07 | Verbinden-Hinweis / Re-Connect / Konflikt / »belegt« / Leer (s. Tabelle) | Inline | Nur dokumentieren | — | Validiert |
---
## 8. Grid
```text
Sidebar -> S01 (Monat/Woche, Quellen: Google + Buchung + Plantafel + Projekt + eigene)
S01 -> M01 (Slot-Klick / »+ Termin«: anlegen mit Teilnehmern + Verfügbarkeits-Check)
S01 -> M02 (Termin-Klick: Detail-Popover, Quelle-Absprung, Zu-/Absagen)
M02 -> M01 (Bearbeiten, nur bei eigenen Terminen)
S01 -> S02 (Zahnrad / Verbinden-Hinweis: Provider, Kalender-Auswahl, Sync-Richtung, Konflikt-Verlauf)
S02 nutzt WF-P5: OAuth-Assistent (M01) + Trennen-Modal (M03)
Quell-Absprünge: Buchung -> WF-P16 Terminbuchung · Einsatz -> WF-P9 Plantafel · Projekt-Termin -> WF-P9 Projekt-Akte
```
---
## 9. Screen-Pakete
- [[S01 Kalender]] · [[M01 Termin-Dialog]] · [[M02 Termin-Detail]] · [[S02 Kalender-Einstellungen]]
---
## 10. Offene Fragen
- **Change-Request an Dev (groß):** Eigenes Termin-Objekt + Einladungen (Team/Kontakt/freie E-Mail, .ics-Versand, Zu-/Absage-Tracking) + Free/Busy-Overlay — Ticket AK-P16a sah nur Lese-Grid + Sync vor; ENTITY-MODEL Domäne 9 braucht Ergänzung
- Zu-/Absage-Tracking bei internen Teilnehmern: eigener Status oder reicht angenommen/abgelehnt wie extern? → Dev
- Erinnerungen vor Terminen (Push/Mail)? → v2-Kandidat, mit Benachrichtigungen (P3) klären
- Tages-Ansicht zusätzlich zu Monat/Woche? → beim Subframe-Bau entscheiden
## 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)*