TerminPlaner · JD

KI-gestützter Touren- und Terminplaner für einen Schweizer Schreinerbetrieb

---

Features

Feature	Beschreibung
🤖 AI-Analyse	Claude Sonnet 4 schätzt Arbeitsdauer, erkennt Priorität und empfiehlt Zeitraum
📍 PLZ-Zonen	6 Zonen (Zürich / Aargau) mit automatischer Adresserkennung und Cluster-Optimierung
⚡ Smart-Terminierung	Vollautomatische Verteilung aller Aufträge auf Werktage (Zone-Cluster, Priorität, 07–17 Uhr)
📅 Drag & Drop	Aufträge manuell auf Tages- oder Wochenplan-Slots ziehen
📆 Wochenansicht	7-Tage-Übersicht mit Auslastungsbalken und Zone-Cluster-Zusammenfassung
🕐 Tagesansicht	Stundenraster 07:00–17:00 mit 60-Minuten-Slots und 15 Minuten Puffer

---

Technologie-Stack

• Frontend: React 18 + Vite 5
• Styling: Inline-JS (kein CSS-Framework)
• KI: Anthropic Claude API (claude-sonnet-4)
• Deployment: Vercel / Netlify
• Persistenz: LocalStorage (geplant)

---

Setup

1. Repository klonen

git clone <repo-url>
cd terminplaner

2. Abhängigkeiten installieren

npm install

3. API-Key konfigurieren

cp .env.example .env
# .env öffnen und VITE_ANTHROPIC_API_KEY eintragen

⚠️ Sicherheit: Der API-Key liegt aktuell im Frontend (Entwicklungsstand).
Ein sicherer Backend-Proxy (Vercel API Route) folgt in Schritt 2.

4. Entwicklungsserver starten

npm run dev
# → http://localhost:3000

5. Produktions-Build

npm run build
npm run preview

---

Deployment (Vercel)

1. Repository auf GitHub pushen
2. Auf vercel.com importieren
3. Environment Variable ANTHROPIC_API_KEY in Vercel setzen
4. Deploy klicken

---

Projektstruktur

src/
├── constants.js          # PLZ-Zonen, Farben, Hilfsfunktionen, Demo-Daten
├── TerminPlaner.jsx      # Haupt-Orchestrator
├── components/
│   ├── ui.jsx            # ZBadge, SBadge, Btn, Inp, Modal, Toast, AICard
│   ├── Sidebar.jsx
│   ├── AuftraegeTabelle.jsx
│   ├── TagesplanGrid.jsx
│   ├── WochenplanGrid.jsx
│   ├── ZonenReferenz.jsx
│   ├── AuftragDetailModal.jsx
│   └── TerminModal.jsx
└── hooks/
    ├── useAuftraege.js   # State + AI-Analyse + Smart-Terminierung
    ├── useDragDrop.js    # Drag & Drop Handler
    └── useToast.js       # Toast-Benachrichtigungen
api/
└── analyse.js            # (geplant) Vercel API Route – sicherer AI-Proxy

---

Roadmap

• Schritt 1: Modularisierung (Hooks, Components, Constants)
• Schritt 2: Sicherer API-Proxy (Vercel API Route)
• Schritt 3: Datenpersistenz (localStorage)
• Schritt 4: UX & Fehlertoleranz (Error Boundary, Debounced Search)
• Schritt 5: Performance (Virtualisierung bei >50 Aufträgen)
• Schritt 6: Deployment-Readiness (Vercel Config finalisieren)

---

PLZ-Zonen Übersicht

Zone	Farbe	PLZ-Präfixe	Gebiete
BLAU	🔵	43xx, 50xx, 52xx, 53xx	Frick, Rheinfelden, Brugg
WEISS	⚪	48xx, 51xx, 55xx, 56xx	Aarau, Lenzburg, Wohlen
GELB	🟡	81xx, 83xx	Kloten, Bülach, Regensdorf
ROT	🔴	84xx, 85xx	Winterthur, Andelfingen
LILA	🟣	80xx, 89xx	Zürich City, Dietikon
ORANGE	🟠	86xx, 87xx, 88xx	Uster, Wetzikon, Meilen

⚠️ PLZ 8307 (Effretikon) → ROT (Ausnahme von GELB)