Rebrand Hub+Flux

dev/frontend/hub-flux/14-PHASE-4H-PRESS-RELEASES-MOCKUP.md

@@ -0,0 +1,171 @@
+# Phase 4H — Customer „Meine Pressemitteilungen" auf Mockup-Stil
+
+> Nachgelagertes Päckchen aus Phase 4. Hebelt das wichtigste
+> Customer-Arbeitstool auf das volle Mockup-Vokabular.
+
+**Status**: ✅ abgeschlossen · **Aufwand**: ~1 Tag · **Risiko**: niedrig
+
+---
+
+## Anlass
+
+`customer/press-releases/index.blade.php` ist heute auf
+~50 % Mockup-Match: Page-Header, Filter-Panel, Tabelle und
+Empty-State sind Hub-styled, aber alle hochwirksamen Patterns
+aus dem Mockup fehlen. Diese Seite ist die meistbesuchte des
+Customer-Bereichs (primäres Arbeitstool).
+
+## Vorlage
+
+`dev/frontend/tailwind_v3/User Pressemitteilungen presseportale.html`
+
+## Match-Ziel
+
+≥ 90 % zum Mockup, ohne Backend-API-Erweiterungen.
+
+---
+
+## Scope — was umgesetzt wird
+
+### 1. Counter-Strip im Header
+
+Statt langer Subzeile: Inline-Counter pro Status direkt
+unter H1.
+
+`24 Mitteilungen · 18 veröffentlicht · 1 in Prüfung · 4 Entwürfe · 1 abgelehnt`
+
+Zahlen kommen aus aggregiertem `withCount()` über die Status-Enum.
+
+### 2. Saved-Views-Tabs
+
+Tab-Leiste statt Status-Dropdown:
+
+`Alle (24) · Veröffentlicht (18) · Entwürfe (4) · In Prüfung (1) · Abgelehnt (1) · Archiv (0)`
+
+Aktive Tab unterstrichen mit Hub-Blau. Klick → `statusFilter`-Volt-Property.
+
+### 3. Filter-Chips mit Caret
+
+Status/Portal/Firma/Zeitraum als Chips mit Dropdown-Caret.
+Aktive Chip in Hub-Blau, inaktive auf weißem Background.
+
+**Hinweis**: Status-Chip ist im UI redundant mit Saved-Views-Tabs;
+wir lassen ihn weg. Bleiben: Portal, Firma, Zeitraum (`erstellt` ab Datum X).
+
+### 4. Active-Chips (entfernbare Filter)
+
+Unter den Filter-Chips: Sichtbarmachung aktiver Filter mit
+`×`-Button zum Entfernen.
+
+### 5. Bulk-Selection (nur UI-Vorbereitung)
+
+Checkbox in Header und pro Zeile. Header-Checkbox kann
+indeterminate-State haben. **Keine Bulk-Aktionen** im Scope —
+das wird erst später ein eigenes Päckchen (Bulk-Approve etc.).
+
+### 6. Portal-Pills mit farbigem Dot
+
+Pro Zeile in Spalte „Portal": je nach `portal`-Enum:
+- `presseecho` → grüner Dot
+- `businessportal24` → orangener Dot
+- `both` → beide Pills nebeneinander
+
+### 7. Inline-Actions neben Status
+
+Statusspalte bekommt **zusätzlich** zur Badge eine kleine
+Inline-Action je nach Status:
+
+| Status | Inline-Action |
+|---|---|
+| Draft | `Zur Prüfung →` |
+| Review | `Zurückziehen →` (nur wenn `withdrawFromReview` existiert, sonst weglassen) |
+| Published | — (keine Inline-Action, nur Hauptaktion „Vorschau") |
+| Rejected | `Grund ansehen →` (Modal/Tooltip mit `rejection_reason`) |
+| Archived | — |
+
+### 8. Row-Tinting
+
+Zeilen mit Status `review` bekommen `is-row-warn` (sehr
+dezent gelb beim Hover), `rejected` bekommen `is-row-err`
+(rot beim Hover).
+
+### 9. Reichere Zeilen-Sub
+
+Sub-Zeile unter Titel: `PM-Nummer · Datum · Hinweis`
+Wir nutzen vorhandene Felder: `id` (als „PM-{id}"), `published_at`,
+`rejection_reason`-Existenz.
+
+### 10. Datum mit Sub
+
+Datumsspalte zweizeilig: Datum (Mono-Font, tabular-nums) +
+Sub (Status-Kontext z.B. „veröffentlicht · 09:12").
+
+### 11. 3-fach Empty-State
+
+Drei Varianten je nach Kontext:
+
+- **`empty-filter`** — wenn Filter aktiv: „Keine Mitteilungen mit diesen Filtern" + Reset-Button
+- **`empty-search`** — wenn `search` gesetzt: „Keine Treffer für `…`" + Suche-Reset
+- **`empty-none`** — wenn gar keine PMs überhaupt: „Noch keine Pressemitteilungen" + 3-Schritt-Onboarding
+
+### 12. Status-Aktionen-Legende
+
+`panel-warm` unter der Tabelle: 5-Spalten-Grid mit allen
+Aktionen pro Status. Reduziert Support-Anfragen.
+
+### 13. Spalten-/Export-Buttons (rechts im Header)
+
+„Spalten" (jetzt non-functional als `bald`-Badge) und „Export"
+(`bald`-Badge) als sekundäre Buttons. Optional — können auch
+weggelassen werden, da wir keine Spalten-Konfiguration haben.
+
+→ **Entscheidung**: weglassen. Kein UX-Mehrwert ohne Backend.
+
+---
+
+## Was NICHT angefasst wird
+
+- Volt-Logik (`submitForReview`, `sort`, `with`) — nur erweitert
+  um Aggregate-Counts.
+- Backend-Endpoints / API.
+- Detail-/Show-Seite und Create/Edit-Forms.
+- Routen.
+
+## Neue / erweiterte CSS-Klassen in `hub-components.css`
+
+- `.counter-strip`, `.counter-strip .seg`, `.counter-strip .sep`
+- `.view-tab` (mit `.is-active`, `.cnt`)
+- `.filter-chip` (mit `.is-active`, `.caret`)
+- `.active-chip` (mit `.x`)
+- `.portal-pill` (mit `.pe`, `.bp`, `.pdot`)
+- `.inline-action` (mit `.warn`, `.err`)
+- `.is-row-warn`, `.is-row-err` (Row-Tinting)
+- `.empty-stage`, `.empty-ico`, `.empty-title`, `.empty-sub`
+- `.badge.muted` (für Draft / Archiv)
+- Optional: `.checkbox.indeterminate` (für Bulk-Header)
+
+## Volt-Erweiterungen
+
+- `statusCounts` (assoc-Array Status-Value → int) — aggregiert
+  über `withoutGlobalScopes()->where('user_id', …)->groupBy('status')`
+- `totalCount` (int) — Gesamt-Counter unabhängig vom Filter
+- Saved-View-Klick mappt auf `statusFilter` (kein eigener Property nötig)
+
+## Tests
+
+Keine bestehenden Tests für `customer/press-releases/index`
+gefunden. Akzeptanz:
+
+- `php artisan test --compact` läuft sauber (modulo
+  pre-existing `ApiDocumentationTest`)
+- Build (`npm run build:portal`) clean
+- Pint clean
+
+## Akzeptanzkriterien
+
+- [x] Plan
+- [x] CSS-Klassen ergänzt
+- [x] Volt-Counts ergänzt
+- [x] Markup auf Mockup-Stil
+- [x] Build + Pint + Tests grün
+- [x] PROGRESS.md + 03-WEITERE-PHASEN.md aktualisiert