Das Dashboard ist ein eigenes Feature neben Analytics: der Begruessungsbildschirm, nicht ein zweiter Analysebereich. Es zeigt heute nur Auswertungen, ist aber so gebaut, dass die spaeteren Bereiche als weitere Kacheln dazukommen und nicht als Umbau. Aufbau: Begruessung, vier Kennzahlen (je ein Link in die Analyse), Handlungsbedarf, vier Diagramme, drei reservierte Plaetze. Drei Entscheidungen, die dabei getroffen wurden: - Kein seitenweiter Filter. Jede Kachel traegt ihren eigenen Zeitraum und schreibt ihn in den Kopf. Das ist das Bedienmodell der Software (P11) und war die unbequemere Variante; eine Filterleiste haette beim Einbau alle Kacheln wieder auseinandergenommen. - Das Raster ist aus DashboardPage.tsx der Software uebernommen, nicht erfunden: dieselben Klassen, dieselbe Ableitung aus size.w und position.x. Der Software fehlt dafuer eine Zeile (position.x === 9); vermerkt in WidgetRaster.tsx. - Die reservierten Plaetze zeigen keine erfundenen Zahlen. "2 neue Antraege" aus dem Nichts liest sich in einer Abnahme wie eine fertige Funktion. Absichtliche Doppelung: Der Handlungsbedarf steht jetzt auf dem Dashboard und weiterhin auf der Analytics-Uebersicht. Ihn dort zu entfernen haette die offene Frage 5.1 mitentschieden. Dokumentiert in Abschnitt 3a des Scope-Papiers, aufzuloesen vor dem Port. Nebenbei zwei Fehler behoben, die auch Analytics betrafen: - Die Beschriftungen der Zeitachse liefen in schmalen Karten ineinander (fuenf Kalenderwochen brauchen 200px, eine halbe Kachel bei 768px hat 150). Recharts duennt sie jetzt selbst aus und haelt Anfang und Ende. - Das Zeitraum-Etikett im Kachelkopf schaltete per Viewport-Breakpoint, die Kachelbreite haengt aber am Raster. Bei 1024px blieben dem Untertitel 77px, und er lief ins Diagramm. Jetzt Container-Query. Die Wurzel leitet auf /dashboard statt /analytics — wie in der Software, wo nach der Anmeldung der Begruessungsbildschirm steht. tsc, lint, build, verify:carbon und verify:layout (7 Seiten x 9 Breiten) laufen sauber. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX
134 lines
4.2 KiB
TypeScript
134 lines
4.2 KiB
TypeScript
import type { SeitenId } from "../../data/filtering";
|
|
|
|
/**
|
|
* Navigationsstruktur des Prototyps.
|
|
*
|
|
* Hier stehen **nur unsere beiden Features**: Dashboard und Analytics. Alles
|
|
* andere — Kontakte, Leads, Pipelines, Postfach, Termine, Einstellungen — ist
|
|
* in der Seitenleiste der Software bereits vorhanden und wird hier nicht
|
|
* verdoppelt. Der Prototyp zeigt, was dazukommt, nicht was schon da ist.
|
|
*
|
|
* Gerendert wird mit derselben Komponente wie in der Software
|
|
* (`ui/components/SidebarWithSections`, aus der Cloud-Fassung portiert), damit
|
|
* Aussehen und Verhalten übereinstimmen.
|
|
*
|
|
* „Dashboard" und „Analytics" sind zwei Features mit zwei Zuschnitten: Das
|
|
* Dashboard ist eine einzelne Seite aus Kacheln, Analytics ein Bereich mit
|
|
* fünf Seiten und innerer Leiste (siehe `docs/SCOPE-ANALYTICS-DASHBOARD.md`).
|
|
*/
|
|
|
|
export type NavZiel = { art: "route"; href: string };
|
|
|
|
export interface NavEintrag {
|
|
id: string;
|
|
label: string;
|
|
/** Icon-Name aus @subframe/core (ohne das Präfix "Feather"). */
|
|
icon: string;
|
|
ziel: NavZiel;
|
|
}
|
|
|
|
export interface NavGruppe {
|
|
id: string;
|
|
/** Leerer Titel = Startgruppe ohne Überschrift, wie in der Software. */
|
|
titel: string;
|
|
eintraege: NavEintrag[];
|
|
}
|
|
|
|
/** Einstieg des Analytics-Bereichs. */
|
|
export const ANALYTICS_START = "/analytics";
|
|
|
|
/** Der Begrüßungsbildschirm — Ziel der Weiterleitung von „/", wie in der Software. */
|
|
export const DASHBOARD_START = "/dashboard";
|
|
|
|
export const NAV_GRUPPEN: NavGruppe[] = [
|
|
{
|
|
id: "start",
|
|
titel: "",
|
|
eintraege: [
|
|
{
|
|
// Der Begrüßungsbildschirm — eine einzelne Seite, deshalb ohne innere
|
|
// Leiste. Er ist das Ziel der Weiterleitung von „/".
|
|
id: "dashboard",
|
|
label: "Dashboard",
|
|
icon: "LayoutDashboard",
|
|
ziel: { art: "route", href: DASHBOARD_START },
|
|
},
|
|
{
|
|
// Der neue Menüpunkt. Die fünf Analyse-Seiten sind ausschließlich hier
|
|
// drin über Reiter navigierbar, nicht als Unterpunkte in der Leiste.
|
|
id: "analytics",
|
|
label: "Analytics",
|
|
icon: "BarChart",
|
|
ziel: { art: "route", href: ANALYTICS_START },
|
|
},
|
|
],
|
|
},
|
|
];
|
|
|
|
/**
|
|
* Unterer Bereich, durch einen Trenner abgesetzt — wie in der Software.
|
|
* Hier steht nur, was zum Prototyp gehört: die Bausteingalerie für die
|
|
* Entwicklung. Sie ist kein Produktfeature und wandert beim Einbau nicht mit.
|
|
*/
|
|
export const NAV_SEKUNDAER: NavEintrag[] = [
|
|
{
|
|
id: "komponenten",
|
|
label: "Komponenten",
|
|
icon: "Component",
|
|
ziel: { art: "route", href: "/komponenten" },
|
|
},
|
|
];
|
|
|
|
/**
|
|
* Die fünf Analyse-Seiten. Sie erscheinen **nicht** in der Seitenleiste,
|
|
* sondern als Reiter innerhalb des Menüpunkts „Analytics" — dem Hausmuster
|
|
* für Unter-Navigation in HiveGrid (`SettingsHubShell.tsx`: ein `Link` um ein
|
|
* `Tabs.Item`, damit jeder Reiter eine echte Navigation ist).
|
|
*/
|
|
export interface AnalyseSeite {
|
|
id: SeitenId;
|
|
label: string;
|
|
href: string;
|
|
beschreibung: string;
|
|
/** Icon-Name aus @subframe/core (ohne das Präfix "Feather"). */
|
|
icon: string;
|
|
}
|
|
|
|
export const ANALYSE_SEITEN: AnalyseSeite[] = [
|
|
{
|
|
id: "uebersicht",
|
|
icon: "LayoutDashboard",
|
|
label: "Übersicht",
|
|
href: "/analytics",
|
|
beschreibung: "Die Kennzahlen, nach denen der Betrieb gesteuert wird — Umsatz, Auslastung, offene Posten und Handlungsbedarf.",
|
|
},
|
|
{
|
|
id: "finanzen",
|
|
icon: "Euro",
|
|
label: "Finanzen",
|
|
href: "/analytics/finanzen",
|
|
beschreibung: "Umsatz, Zahlungseingang und offene Forderungen — die Sicht der Buchhaltung auf den Betrieb.",
|
|
},
|
|
{
|
|
id: "auftraege",
|
|
icon: "ClipboardList",
|
|
label: "Aufträge",
|
|
href: "/analytics/auftraege",
|
|
beschreibung: "Von der Anfrage bis zur Abnahme — wo die Vorgänge stehen, was gebunden ist und was über Termin läuft.",
|
|
},
|
|
{
|
|
id: "kunden",
|
|
icon: "Users",
|
|
label: "Kunden",
|
|
href: "/analytics/kunden",
|
|
beschreibung: "Woher Kunden kommen, wie viel sie bringen und wo Nachfassen lohnt.",
|
|
},
|
|
{
|
|
id: "team",
|
|
icon: "HardHat",
|
|
label: "Team",
|
|
href: "/analytics/team",
|
|
beschreibung: "Auslastung, produktive Stunden und Abschlüsse der Monteure — die Kennzahl hinter der Terminplanung.",
|
|
},
|
|
];
|