7932830def
Die Beträge stehen am Balken im Tooltip und in der Kachel Kontostände – in der Legende kosteten sie nur Breite. Ohne sie kommen die Namen mit schmalen Spalten aus, und die Kachel greift im engeren Cockpit-Raster über zwei Spalten statt über zwei breite: 602 statt 808 Pixel. Dazu zwei Anpassungen an die schmalere Kachel: Der Kopftext gibt nach, damit der Schalter oben rechts stehen bleibt, und die Schrift im SVG wächst, weil sie mit dem viewBox schrumpft. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
78 lines
3.9 KiB
Markdown
78 lines
3.9 KiB
Markdown
# Cockpit
|
||
|
||
Die Startseite. Jede Kachel beantwortet eine Frage auf einen Blick; ausgebaut wird sie
|
||
Stück für Stück in Phase 4.
|
||
|
||
## Vermögensentwicklung
|
||
|
||
Ein gestapeltes Balkendiagramm der **Kontostände zum Monatsende** über die letzten zwölf
|
||
Monate – ein Balken je Monat, ein Farbton je Konto.
|
||
|
||
### Woher die Zahlen kommen
|
||
|
||
`Vermoegensentwicklung::reihe()` zählt dieselben Konten wie die Summe der Kontenübersicht:
|
||
die mit gesetztem Σ-Kennzeichen (`in_summe`). Der Stand eines Monats ist der Stand des
|
||
Vormonats plus dessen Bewegungen:
|
||
|
||
* `Buchung::saldenJeKonto()` liefert den Stand am Tag vor dem Zeitraum – alles Ältere
|
||
steckt damit im ersten Balken.
|
||
* `Buchung::bewegungenJeKontoUndMonat()` liefert die Bewegungen innerhalb des Zeitraums,
|
||
nach Monat getrennt.
|
||
|
||
Zwei Abfragen statt zwölf Stichtagsabfragen. Beide Methoden zählen dieselben drei Quellen:
|
||
die Buchungen des Kontos, die Gegenseiten fremder Umbuchungen und die Gegenseiten aus
|
||
Splitzeilen. Eine Umbuchung verschiebt deshalb zwischen zwei Balkenstücken, ohne die Summe
|
||
zu ändern.
|
||
|
||
Konten, die zwölf Monate lang auf null standen, fallen weg; sie zeichnen ohnehin keinen
|
||
Balken.
|
||
|
||
### Der Schalter „nur aktive“
|
||
|
||
Oben rechts an der Kachel sitzt ein Ein/Aus-Schalter. Eingeschaltet – der Standard – zählen
|
||
nur Konten, die noch geführt werden. Ausgeschaltet kommen stillgelegte dazu: Sonst fehlte im
|
||
Rückblick Vermögen, das damals auf einem inzwischen aufgelösten Konto lag.
|
||
|
||
Der Zustand liegt unter `cockpit_vermoegen_nur_aktive` in den Einstellungen und gilt bis zur
|
||
nächsten Umschaltung – auch über das Abmelden hinaus. Im Einstellungsdialog erscheint er
|
||
nicht: Er gehört an die Kachel, nicht in einen Reiter.
|
||
|
||
Umgeschaltet wird über einen abschickenden Knopf, nicht über ein Ankreuzfeld. Ein
|
||
Ankreuzfeld könnte sein Formular nur mit einem Inline-Skript selbst abschicken, und die
|
||
Content-Security-Policy verbietet Inline-Skripte.
|
||
|
||
### Stapel und Farben
|
||
|
||
Positive Stände stapeln sich über der Nulllinie, negative darunter – ein überzogenes
|
||
Girokonto oder eine Kreditkarte zieht den Balken nach unten.
|
||
|
||
Die Palette in `app.css` hat zwölf Töne (`.serie-1` bis `.serie-12`). Gibt es mehr Konten,
|
||
behalten die größten ihre eigene Farbe und der Rest wird zu **Übrige Konten (n)**
|
||
zusammengefasst – zwei Konten in derselben Farbe wären in der Legende nicht auseinander zu
|
||
halten. Jede Serie setzt `--farbe`; davon leben der Balken (`fill`) und der Legendenpunkt
|
||
(`background`) gleichermaßen, und beide folgen dem hellen wie dem dunklen Thema.
|
||
|
||
### SVG von Hand
|
||
|
||
Keine Diagrammbibliothek (siehe `PLAN.md`): `src/Views/cockpit/vermoegensdiagramm.php`
|
||
schreibt das SVG selbst. Farben stehen als Klasse am Element, nicht als `fill`-Attribut –
|
||
ein Attribut käme zwar an der Content-Security-Policy vorbei, könnte aber nicht auf die
|
||
Themenumschaltung reagieren. Ein `style`-Attribut verwürfe die CSP ohnehin.
|
||
|
||
Die Achse rundet über `Vermoegensentwicklung::skala()` auf Schritte von 1, 2, 2,5 oder 5
|
||
mal einer Zehnerpotenz und schließt die Null immer ein. Jedes Balkenstück trägt ein
|
||
`<title>` mit Konto, Monat und Betrag – das ist der Tooltip, ohne eine Zeile JavaScript.
|
||
|
||
Die Legende führt nur Farbe und Kontoname. Die Beträge stehen am Balken im Tooltip und in
|
||
der Kachel *Kontostände*; in der Legende kosteten sie nur Breite. Die Kachel greift über
|
||
zwei Spalten des Cockpit-Rasters (`.kachelraster.dicht`) – schmal genug, um die übrigen
|
||
Kacheln danebenstehen zu lassen, breit genug für zwölf Balken. Unterhalb von 820 px fällt
|
||
der Ausgriff weg, sonst erzwänge er im einspaltigen Raster einen waagerechten Rollbalken.
|
||
|
||
## Tests
|
||
|
||
* `tests/13_VermoegensentwicklungTest.php` – Zeitraum, Fortschreibung der Stände,
|
||
Umbuchungen, Σ-Kennzeichen, Schalter „nur aktive“, Zusammenfassen jenseits der Palette,
|
||
Skala
|
||
* `tests/e2e/specs/smoke.spec.js` – die Kachel zeichnet zwölf Balken, keine Farbe der
|
||
Legende kommt doppelt vor, und der Schalter behält seinen Zustand über den Neuaufruf
|