feat(dashboard): Startansicht mit Bewerbungen, Wandlung und Gewinnen

Erster Menuepunkt und Startansicht; das Logo oben links fuehrt dorthin zurueck.

Vier Kennzahlen (Bewerbungen, daraus Opportunities samt Quote, gewonnene
Projekte, aktuell beim Kunden), ein Saeulendiagramm mit denselben drei Reihen
ueber der Zeit, die Bewerbungen je Berater, die naechsten Termine und alle
Opportunities in Kundenvorstellung bzw. Interview Kunde. Zeitraum ueber vier
Vorgaben oder frei, Einteilung nach Tag, Monat, Quartal oder Jahr.

Bewerbung heisst dabei: ein Eintrag in der Akquise - jeder Eintrag bedeutet, dass
ein Profil raus ist (so vom Nutzer festgelegt).

Zwei Dinge dafuer am Datenmodell:

- crm_opportunities.won_at haelt den Zeitpunkt des Wechsels nach "Beauftragt".
  Die Phase allein sagt nur, wie es jetzt steht, nicht wann es passiert ist.
  Beim Wechsel heraus wird das Datum geleert, sonst zaehlt das Dashboard einen
  Gewinn, den es nicht gibt.
- Die Akquise loescht nach 90 Tagen - damit waere jede Jahresauswertung falsch.
  Der Aufraeumlauf sichert deshalb vorher Tag, Berater und Anzahl in
  crm_acquisition_history, in derselben Transaktion wie das Loeschen. Gesichert
  wird nur, was verschwindet; die Auswertung addiert beide Quellen und kann sich
  damit nicht ueberschneiden. Projektdaten sind nach dem Loeschen weiterhin weg.

Termine und die Phasenlisten kommen nicht aus einem eigenen Endpunkt: Termine und
Opportunities laedt die App ohnehin komplett, das Dashboard filtert sie selbst.

Diagramme von Hand (SVG-freie Balken plus Tailwind-Uebergaenge) statt einer
Bibliothek - drei Darstellungen rechtfertigen keine weitere Abhaengigkeit, und so
kommen die Farben aus denselben Tokens wie der Rest. Die Zahlen laufen hoch, die
Saeulen wachsen; wer Bewegung im System abgeschaltet hat, bekommt sofort den
Endwert.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Sascha Wolf
2026-08-18 15:02:35 +02:00
co-authored by Claude Opus 5
parent 42639c65fa
commit 6f57483f33
17 changed files with 1133 additions and 19 deletions
+2 -2
View File
@@ -90,8 +90,8 @@ sofort draußen, ohne auf den Ablauf des Tokens zu warten.
```mermaid
flowchart TD
L["Anmeldung"] --> R{"Rolle"}
R -->|admin| A["Akquise, Opportunities, Interviews, Kontakte, Mails, Scanner<br/>Einstellungen: Nutzerverwaltung, Mein Konto, Postfach, Scanner, Whisper"]
R -->|user| U["Akquise, Opportunities, Interviews, Kontakte, Mails, Scanner<br/>Einstellungen: Mein Konto, Whisper"]
R -->|admin| A["Dashboard, Akquise, Opportunities, Interviews, Kontakte, Mails, Scanner<br/>Einstellungen: Nutzerverwaltung, Mein Konto, Akquise, Postfach, Scanner, Whisper"]
R -->|user| U["Dashboard, Akquise, Opportunities, Interviews, Kontakte, Mails, Scanner<br/>Einstellungen: Mein Konto, Akquise, Whisper"]
```
Bei den Mails darf jede Rolle lesen und zuordnen - `crm@perinco.de` ist ein
+16 -1
View File
@@ -71,6 +71,7 @@ erDiagram
date last_interaction_at
varchar next_step
int owner_id FK
datetime won_at "Wechsel nach Beauftragt"
datetime deleted_at "Papierkorb; nach 90 Tagen weg"
}
crm_opportunity_contacts {
@@ -95,6 +96,11 @@ erDiagram
enum field "sender | channel | consultant"
varchar value "Inhalt des Dropdowns"
}
crm_acquisition_history {
date found_on PK
varchar consultant PK
int applications "verdichtet vor dem Loeschen"
}
crm_events {
int id PK
varchar title
@@ -110,7 +116,7 @@ erDiagram
}
```
Sieben Eigenheiten, die man kennen muss:
Acht Eigenheiten, die man kennen muss:
- **`crm_leads` führt zwei Bestände.** `mail_pool = 0` ist der gepflegte
Kontaktbestand, `mail_pool = 1` der Vorbereich „Aus Mails" mit den Funden des
@@ -127,6 +133,15 @@ Sieben Eigenheiten, die man kennen muss:
- **`avatar` ist eine Data-URL in der Datenbank.** Der Browser verkleinert jedes
Bild vor dem Upload auf 256 px (`src/lib/imageCompress.ts`), aus 2,9 MB werden
wenige Kilobyte.
- **Das Dashboard rechnet aus zwei Quellen.** Jeder Eintrag in
`crm_acquisitions` ist eine versendete Bewerbung. Weil die Akquise nach 90
Tagen löscht, sichert der Aufräumlauf vorher Tag, Berater und Anzahl in
`crm_acquisition_history` - in derselben Transaktion, sonst würde ein Abbruch
zwischen Sichern und Löschen denselben Tag doppelt zählen. Die Auswertung liest
beide Quellen und addiert sie; überschneiden können sie sich nicht, weil genau
das gesichert wird, was verschwindet. `crm_opportunities.won_at` hält den
Zeitpunkt des Wechsels nach *Beauftragt* - die Phase allein sagt nur, wie es
jetzt steht, nicht wann es passiert ist.
- **Gelöschte Opportunities bleiben stehen.** `crm_opportunities.deleted_at`
setzt sie in den Papierkorb; alle Abfragen blenden sie aus. An einer
Opportunity hängen Ansprechpartner, Verlauf und Mailzuordnungen - ein Fehlklick
+2 -1
View File
@@ -9,10 +9,11 @@ sitzt und keine tiefen Links braucht.
```mermaid
flowchart TD
SB["Seitenleiste"] --> K["Kategorien"]
K --> D["Dashboard<br/>(Startansicht, auch über das Logo)"]
K --> AQ["Akquise"]
AQ --> AQ1["Eingang<br/>Funde der letzten 14 Tage"]
AQ --> AQ2["Archiv<br/>älter; nach 90 Tagen gelöscht"]
K --> O["Opportunities<br/>(Startansicht)"]
K --> O["Opportunities"]
K --> C["Interviews"]
K --> L["Kontakte"]
L --> L1["Alle Kontakte"]
+46
View File
@@ -9,6 +9,7 @@ Ein CRM für die Projektvermittlung. Es beantwortet vier Fragen:
| Frage | Bereich |
| --- | --- |
| Wie läuft es gerade? | **Dashboard** |
| Welche Projekte haben wir gefunden? | **Akquise** |
| Welche Geschäfte sind in Arbeit und was sind sie wert? | **Opportunities** |
| Wer ist wann wo, und wer ist beteiligt? | **Interviews** |
@@ -32,6 +33,7 @@ die Scanner-Einstellungen. Alles andere ist für beide Rollen gleich.
```
┌──────────────┬───────────────────────────────────────────┐
│ Kategorien │ Titel der Ansicht [Hell/Dunkel] │
│ Dashboard │ │
│ Akquise ▾ │ │
│ Eingang │ │
│ Archiv 3│ │
@@ -57,6 +59,8 @@ die Scanner-Einstellungen. Alles andere ist für beide Rollen gleich.
└──────────────┴───────────────────────────────────────────┘
```
* Der Klick auf das **perinco-Logo** oben links führt zurück zum **Dashboard** -
das ist auch die Ansicht, mit der die Anwendung startet.
* Der Knopf mit den drei Strichen oben links klappt das Menü auf Symbolbreite
zusammen - hilfreich auf kleinen Bildschirmen.
* Rechts oben schaltet zwischen hellem und dunklem Design. Ein **Doppelklick**
@@ -78,6 +82,48 @@ die Scanner-Einstellungen. Alles andere ist für beide Rollen gleich.
> Alle Abbildungen in dieser Anleitung zeigen die Anwendung mit **erfundenen
> Beispieldaten**. Firmen, Personen und Zahlen darin gibt es nicht.
## Dashboard
Die Startansicht: wie der Vertrieb läuft, ohne dass man irgendwo hineinklicken
muss. Alle sehen dieselben Zahlen.
Oben steht der **Zeitraum**. Vier Vorgaben (30 Tage, 12 Monate, 8 Quartale,
5 Jahre) setzen Anfang, Ende und die passende Einteilung; *von* und *bis* lassen
sich frei setzen, und rechts wählt **Einteilung** aus, wie die Zeitachse
geschnitten wird - Tag, Monat, Quartal oder Jahr.
### Die vier Kennzahlen
| Kachel | Was gezählt wird |
| --- | --- |
| **Bewerbungen** | Einträge in der Akquise im Zeitraum. Jeder Eintrag ist eine versendete Bewerbung |
| **Zu Opportunity** | Bewerbungen, aus denen eine Opportunity geworden ist - dazu die Quote |
| **Gewonnen** | Opportunities, die in die Phase *Beauftragt* gekommen sind |
| **Beim Kunden** | Opportunities, die **jetzt** in *Kundenvorstellung* oder *Interview Kunde* stehen - unabhängig vom Zeitraum |
### Verlauf
Das Säulendiagramm zeigt dieselben drei Reihen über der Zeit: Bewerbungen, daraus
entstandene Opportunities und gewonnene Projekte. Leere Abschnitte bleiben
sichtbar - eine Woche ohne Bewerbung ist eine Aussage. Der Mauszeiger auf einer
Säule nennt Abschnitt, Reihe und Wert.
Rechts daneben steht **Bewerbungen je Berater** für denselben Zeitraum. Einträge
ohne hinterlegten Berater erscheinen als *Ohne Berater*.
### Anstehende Interviews und „Beim Kunden"
Unten links die nächsten acht Termine aus dem gemeinsamen Kalender mit Datum,
Uhrzeit, Ort, Teilnehmern und dem Abstand („morgen", „in 3 Tagen"). Unten rechts
alle Opportunities in *Kundenvorstellung* und *Interview Kunde* mit Firma,
Volumen und Zuständigem - also alles, wo gerade der Kunde am Zug ist.
> **Zur Genauigkeit der Zahlen:** Die Akquise löscht Einträge nach 90 Tagen.
> Damit die Auswertung über Monate und Jahre trotzdem stimmt, sichert das Backend
> vor dem Löschen Tag, Berater und Anzahl - die Projektdaten sind dann weg, die
> Zahl bleibt. „Gewonnen" wird ab dem 18.08.2026 mitgeschrieben (Zeitpunkt des
> Wechsels nach *Beauftragt*); für die Zeit davor gibt es diesen Zeitpunkt nicht.
## Akquise
Der Eingang für gefundene Projekte - alles, was per Mail, Telefon oder über ein
+3
View File
@@ -94,6 +94,7 @@ Alle unter `router.use(requireAuth)`.
| `opportunities.js` | `GET /?trash=true`, `POST /`, `PATCH /:id`, `DELETE /:id` (Papierkorb), `POST /:id/restore`, `POST /trash/empty` | ändern, löschen und wiederherstellen nur Ersteller, Zuständiger oder Admin; Leeren jeder Angemeldete |
| `acquisitions.js` | `GET /?view=eingang\|archiv\|alle`, `POST /`, `PATCH /:id`, `DELETE /:id`, `POST /:id/opportunity`; Auswahllisten: `GET/POST /options`, `PATCH/DELETE /options/:id` | Einträge ändern/löschen nur Ersteller oder Admin; Auswahllisten jeder Angemeldete |
| `badges.js` | `GET /` | Zahlen für die Seitenleiste: Akquise-Archiv, beide Papierkörbe, verworfene Scanner-Treffer. Der Scanner-Zähler ist `null`, wenn dessen Datenbank fehlt |
| `dashboard.js` | `GET /?from=&to=&bucket=tag\|monat\|quartal\|jahr` | drei Reihen über der Zeit plus Bewerbungen je Berater. Liest Akquise **und** `crm_acquisition_history`; Termine und Phasenlisten stehen bewusst nicht drin - die lädt die App ohnehin |
| `mail.js` | `GET /status`, `/messages`, `/messages/:id`, `/candidates`; `POST /messages/:id/links`, `/messages/:id/restore`, `/candidates/:id/adopt`, `/candidates/:id/reject`, `/trash/empty`; `DELETE /links/:id`, `/messages/:id`; `requireAdmin`: `GET/POST /settings`, `POST /test`, `POST /sync` | lesen, zuordnen und löschen jeder; einrichten Admin |
Wiederkehrende Muster in diesen Routern:
@@ -268,6 +269,8 @@ Warum genau diese Konstanten festgelegt sind, steht in
| --- | --- |
| `components/opportunities/OpportunityTrash.tsx` | Papierkorb der Opportunities: wiederherstellen, leeren, Restlaufzeit je Eintrag |
| `components/opportunities/opportunityUi.tsx` | `STAGE_LABELS` (Anzeige, mit Umlaut), `STAGE_HINTS` (Erläuterung als Titelhinweis), `STAGE_STYLES`, `STAGE_COLORS`, `StageBadge` |
| `components/dashboard/Dashboard.tsx` | Startansicht: Zeitraumwahl, vier Kennzahlen, Verlauf, Berater, Termine, „Beim Kunden". `buildAxis()` erzeugt auch leere Abschnitte |
| `components/dashboard/dashboardUi.tsx` | `useCountUp()` (Zahl läuft hoch, respektiert `prefers-reduced-motion`), `StatCard`, `SeriesChart`, `BarList`, `Panel` - von Hand statt Diagrammbibliothek |
| `components/acquisition/Acquisitions.tsx` | Akquise und Archiv (`view`); Suche, Sortierung, Übernahme, Löschen |
| `components/acquisition/AcquisitionForm.tsx` | Eingabe über der Liste; behält Datum, Anbieter, Kanal und Berater für den nächsten Eintrag |
| `components/acquisition/AcquisitionTable.tsx` | die Liste; `safeLink()` lässt nur http(s) zum Link werden |
+1
View File
@@ -22,6 +22,7 @@ Quelltext.
| **Match** / Treffer | Die Bewertung **eines** Projekts für **einen** Agenten: Prozentwert, Pro-Liste, Contra-Liste, Status. Tabelle `matches`. Ein Projekt erzeugt so viele Treffer, wie es aktive Agenten gibt. |
| **Opportunity** | Geschäft in Arbeit: Phase, Tagessatz und Laufzeit oder Projektpreis, Wahrscheinlichkeit, Ansprechpartner. Tabelle `crm_opportunities`. |
| **Akquise** | Eingang für gefundene Projekte, bevor daraus eine Opportunity wird. Tabelle `crm_acquisitions`. Nach 14 Tagen im **Archiv**, nach 90 Tagen gelöscht. |
| **Bewerbung** | Ein Eintrag in der Akquise. Jeder Eintrag bedeutet, dass ein Beraterprofil raus ist - so zählt es das Dashboard. |
| **Auswahllisten** (Akquise) | Inhalte der Dropdowns *Von*, *Kanal*, *Berater*. Tabelle `crm_acquisition_options`, gepflegt unter *Einstellungen → Akquise*. *Anbieter* ist Freitext mit Vorschlägen. |
| **Art** (eines Kontakts) | Recruiter, Partner oder Endkunde. Spalte `crm_leads.kind`; hieß bis 18.08.2026 „Status" mit den Werten Neu .. Verloren. |
| **Papierkorb** (Mails) | Im CRM gelöschte Mails. Umkehrbar, bis er geleert wird. Im Postfach crm@perinco.de bleiben die Mails in jedem Fall; der Abgleich holt gelöschte nicht wieder herein. |