Anpassungsrunde 6. Die Kartendarstellung aus Runde 5 ist ersetzt: die Startseite zeigt oben einen räumlichen Meetingraum aus der Sicht des Betrachters, der selbst am Kopfende des Tisches sitzt. **3D statt Kulisse.** Zwei Versuche mit CSS-Flächen sind daran gescheitert, dass gezeichnete Wände neben fotografierten Porträts erkennbar gezeichnet bleiben. Diese Runde nutzt three.js — die einzige neue Abhängigkeit, und §19 lässt sie ausdrücklich zu, wenn eine schlanke 3D-Lösung die Anforderung trägt. Keine Engine darüber hinaus: kein React-Three-Fiber, keine Physik, keine Shader, keine Post-Processing-Kette, keine Orbit-Steuerung. Der Raum: Boden, Decke, rechts eine geschlossene Wand mit Eichenpaneel und einem schmalen Streifen im Markenblau, links und gegenüber bodentiefe Glasfassaden mit Pfosten. Draussen tragen die beiden Referenzfotos aus dem Auftrag die Basler Aussicht — vorne Rhein, Altstadt und Münster, links der Rheinverlauf mit der Wettsteinbrücke. Die Wasserlinie beider Kulissen liegt auf derselben Welthöhe, damit der Blick nach vorne und nach links zusammengehört und nicht wie zwei zusammengesetzte Bilder wirkt (§4). Am Tisch sitzen alle fünf bestehenden Agenten mit ihren bestehenden Porträts, Namen, Funktionen und Zielseiten — alles aus `AGENT_WORKSPACES`, damit nichts doppelt gepflegt wird (§24, Schritt 7). Neu ist Thomas, Personalverwalter, vis-à-vis am gegenüberliegenden Kopfende; sein Klick führt in die bestehende Ansicht «Meine Agenten». Gerendert wird nur bei Anlass — Grösse, Maus, Hover. Ein Dauerloop wäre für eine feste Szene verschwendete Rechenzeit (§21). Die Kamera folgt der Maus um wenige Zentimeter, mehr nicht (§20). Die Beschriftungen sind HTML über dem Bild, nicht Textur in der Szene: als Textur wären sie bei Tiefe unlesbar. Ein Entzerrungsdurchgang nach der Projektion hebt Plaketten so weit an, bis keine mehr überlappt — gerechnet und nicht handverlesen, damit es auf jeder Fenstergrösse hält. Bei Hover kommt eine Zeile mit der aktuellen Auslastung dazu; ruhend bleiben es Name und Funktion. **Navigation.** Die linke Seitenleiste ist gelöscht, nicht ausgeblendet: samt Breitenreservierung, Einklapplogik und mobilem Drawer. Der Inhalt beginnt überall bei x=0. An der Stelle des früheren Profilsymbols steht neben der Glocke ein Menüsymbol; das Klappmenü öffnet rechts an der Kopfzeile nach unten und führt Startseite, Meine Agenten samt aller Agenten als eingerückte, rechtsbündige Unterpunkte, und Profil mit Profil, Einstellungen, Produkttour und Abmelden. Alle Aktionen und Routen sind die bestehenden. Entfallen sind die Kartenkomponenten aus Runde 5 samt Präsenzschicht. Geprüft (§25): 422 Tests, Typecheck, Build, ESLint, Token-Schwelle (884/925). Im Browser 430–2560 px: keine alte Sidebar, kein leerer Streifen links, sechs Beschriftungen ohne Überlappung, alle sechs Agenten per Maus und per Tastatur erreichbar und auf der richtigen Subpage, Menü öffnet und schliesst per Klick und Escape, alle Menürouten korrekt, alle bestehenden Seiten laden, kein horizontaler Overflow, keine Konsolenfehler. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
54 lines
2.2 KiB
TypeScript
54 lines
2.2 KiB
TypeScript
/**
|
|
* Property On — die fünf Agentenseiten unter «Meine Agenten».
|
|
*
|
|
* Eine einzige Liste für Sidebar, Seitenköpfe und Chat-Einstieg. Sie trägt
|
|
* bewusst nur Identität, Funktionsbezeichnung und Route — das Porträt hängt in
|
|
* `components/team/agentPhotos.ts`, weil ein Bild-Import diese Datei an den
|
|
* Bundler koppeln würde, und das vollständige Personaldossier liegt in
|
|
* `mock-data/agents/`.
|
|
*
|
|
* Die Reihenfolge ist verbindlich (Runde 4, §2.2): Ferdi, Bruno, Livia, Nora,
|
|
* Sina. Sie folgt dem Arbeitsablauf, nicht dem Alphabet.
|
|
*/
|
|
|
|
import { ROUTES } from './constants'
|
|
|
|
export interface AgentWorkspace {
|
|
/** Identisch mit der Agenten-ID in `mock-data/agents/` und `AGENT_PHOTOS`. */
|
|
id: string
|
|
name: string
|
|
/** Funktionsbezeichnung — steht im Menü und im Chat-Einstieg unter dem Namen. */
|
|
role: string
|
|
path: string
|
|
}
|
|
|
|
export const AGENT_WORKSPACES: AgentWorkspace[] = [
|
|
{ id: 'ferdi', name: 'Ferdi', role: 'Fristen-Wächter', path: ROUTES.SUPPLY.AGENT_FERDI },
|
|
{ id: 'bruno', name: 'Bruno', role: 'Besichtigungsassistent', path: ROUTES.SUPPLY.AGENT_BRUNO },
|
|
{ id: 'livia', name: 'Livia', role: 'Exposé Master', path: ROUTES.SUPPLY.AGENT_LIVIA },
|
|
{ id: 'nora', name: 'Nora', role: 'Marktchancen / Leads', path: ROUTES.SUPPLY.AGENT_NORA },
|
|
{ id: 'sina', name: 'Sina', role: 'Datenpflege', path: ROUTES.SUPPLY.AGENT_SINA },
|
|
]
|
|
|
|
export function agentWorkspaceById(id: string): AgentWorkspace | undefined {
|
|
return AGENT_WORKSPACES.find(a => a.id === id)
|
|
}
|
|
|
|
/**
|
|
* Thomas — Personalverwalter und Vorgesetzter der fünf Agenten (Runde 6, §7).
|
|
*
|
|
* Bewusst nicht Teil von `AGENT_WORKSPACES`: Thomas hat keine eigene
|
|
* Arbeitsseite, sondern steht für die Adminfläche selbst. Sein Ziel ist «Meine
|
|
* Agenten» mit den Bereichen Personalverwaltung, Kanäle & Systeme und
|
|
* Bearbeitungsverlauf. Stünde er in derselben Liste, erschiene er als sechster
|
|
* Eintrag im Menü und als sechster Mitarbeitender in der Belegschaft — beides
|
|
* wäre falsch (§13: «Thomas muss nicht zwingend nochmals als normaler
|
|
* Unteragent dargestellt werden»).
|
|
*/
|
|
export const AGENT_SUPERVISOR: AgentWorkspace = {
|
|
id: 'thomas',
|
|
name: 'Thomas',
|
|
role: 'Personalverwalter',
|
|
path: ROUTES.SUPPLY.TEAM,
|
|
}
|