# Projektübersicht — README ## Übersicht Dieses Projekt ist eine lokale Single-Page-Webanwendung zur Verwaltung elektrotechnischer Projekte und Sitzungsübersichten. Die Anwendung besteht aus: - einem Frontend in `Test.html`, `styles.css` und den JS-Modulen unter `public/js/` - einem einfachen Node.js-Server in `server.js` - einem Datenspeicher in CSV-Dateien unter `sessions/` - einem Docker-Setup unter `Docker/` ## Datei- und Komponentenübersicht ### Wichtige Laufzeit-Dateien - `server.js` - Node.js/Express-Server - dient als API für das Frontend - stellt statische Dateien (`Test.html`, die Module unter `js/`, `styles.css`, etc.) bereit - implementiert Endpunkte: - `GET /` → liefert `Test.html` - `GET /load-all` → lädt alle CSV-Dateien aus dem aktiven `sessions//`-Ordner inkl. `_people.csv` - `POST /save-csv` → speichert eine CSV-Datei (Dateiname wird validiert) - `POST /delete-csv` → löscht eine CSV-Datei - `GET /health` → Gesundheitscheck - legt das `sessions`-Verzeichnis beim Start an, falls es nicht existiert - beendet sich mit aussagekräftiger Fehlermeldung, wenn der Port belegt ist - `package.json` - definiert den Node.js-Startbefehl `npm start` - enthält Produktionsabhängigkeiten `express` und `cors` - `package-lock.json` - wird für reproduzierbare Docker-Builds verwendet (`npm ci`) - `public/js/` (Module) - Die Client-Logik ist in kleine klassische Script-Dateien aufgeteilt (alle Funktionen global auf `window`): `globals.js`, `utils.js`, `ui.js`, `date-picker.js`, `csv.js`, `server.js`, `store.js`, `weeks.js`, `board.js`, `people.js`, `projects.js`, `load.js`, `gantt.js`, `showmode.js`, `tabs-auth.js`, `pdf.js`, `init.js` sowie die Plan-Module unter `js/plan/` (`plan-state`, `plan-build-gantt`, `plan-gantt`, `plan-drag`, `plan-modals`, `plan-schedule`). - rendert das Projektboard, die Projekt- und Personenverwaltung sowie die Auslastungsansicht - lädt Daten über den Server und speichert Änderungen zurück als CSV - verwendet `currentDepartment` zur Trennung von Abteilungen (`ELT`, `HLS`, `ARCH`) - speichert: - `sessions//.csv` - `sessions//_people.csv` (globale Personenliste pro Abteilung) - sortiert Sitzungen nach Kalenderwoche, nicht alphabetisch - sperrt historische Sitzungen automatisch (bis auf die chronologisch letzte) - Personen sind global pro Abteilung verwaltet; historische Sitzungen behalten ihre lokalen Personenkopien - `Test.html` - die Benutzeroberfläche der Anwendung - lädt `styles.css` und die JS-Module aus `js/` in fester Reihenfolge (siehe `AGENTS.md`) - enthält die Abteilungsauswahl, Sitzungsnavigation, Tab-Navigation und das Passwort-Modal - `project-plan.html` - die Planungsansicht (GANTT/TODOs/Meilensteine) pro Projekt - öffnet sich in einem neuen Tab über `openProjectPlan()` (`js/gantt.js`) - lädt nur die gemeinsamen Helfermodule plus `js/plan/*` - `styles.css` - Layout und Styling der Oberfläche ### Docker-bezogene Dateien - `Docker/Dockerfile` - Basis-Image: `node:20-alpine` - kopiert `package.json` und `package-lock.json`, installiert Produktionsabhängigkeiten mit `npm ci` - kopiert den Rest des Projekts in `/app` - legt sicherheitshalber `/app/sessions` an - läuft als nicht-root-User `node` - enthält einen `HEALTHCHECK` auf `/health` - startet `node server.js` - `docker-compose.yml` - definiert den Service `projektuebersicht` - baut das Image aus dem Projektstamm mit `Docker/Dockerfile` - mappt Port `3003:3003` - bindet das Host-Verzeichnis `./sessions` in den Container nach `/app/sessions` - setzt `restart: unless-stopped` - definiert einen `healthcheck` - `.dockerignore` - schließt unnötige Dateien aus dem Docker-Build aus: `Docker/`, `node_modules/`, `npm-debug.log`, `.git`, `.gitignore` ### Sonstige Dateien - `dein_bild.ico` - optionales Icon, wird vom Server statisch ausgeliefert, wenn angefragt - `AGENTS.md` - Projektnotizen / Dokumentation, aber nicht Teil des Anwendungslaufs ## Speicherorte und Datenfluss ### Speicherung - Alle persistierten Daten werden als CSV-Dateien in `sessions/` gespeichert. - Innerhalb von `sessions/` existieren Abteilungsordner: - `sessions/ELT/` - `sessions/HLS/` - `sessions/ARCH/` - Jede Abteilung enthält mindestens: - `_people.csv` → globale Personenliste mit Rollen und vollständigem Namen - `KW_XX___YYYY.csv` oder vergleichbare Sitzungsdateien → Sitzungsdaten mit Projekten, Zuordnungen und Anwesenheit ### Wo wird der Server erstellt? - Der Server wird in `server.js` erstellt. - `server.js` startet einen Express-Server auf Port `3003` oder dem Wert von `process.env.PORT`. - Das Frontend ruft diesen Server über `window.location.origin` an. ### Wo werden die Dateien gespeichert? - Das Frontend schreibt über den Server in das Dateisystem. - In `js/store.js` ruft die Anwendung beim Speichern `/save-csv` auf. - Der Server legt CSV-Dateien unter `sessions//` ab. - Beispiel: - `sessions/ELT/KW_32___2026.csv` - `sessions/ELT/_people.csv` ## Betrieb ### Lokal mit Node.js ```bash npm install npm start ``` Danach ist die Anwendung erreichbar unter `http://localhost:3003`. Falls der Port belegt ist: ```bash PORT=3004 npm start ``` ### Mit Docker Im Projektstamm ausführen: ```bash docker compose -f Docker/docker-compose.yml up --build ``` Danach ist die Anwendung erreichbar unter: ``` http://localhost:3003 ``` ## Wichtige Hinweise - Der Server benötigt Lese-/Schreibzugriff auf `sessions/`. - Die Docker-Compose-Konfiguration mountet `./sessions` in den Container. Achte darauf, dass der relative Pfad im Kontext korrekt ist, wenn du `docker compose` aus einem anderen Verzeichnis startest. - `js/store.js` und `js/server.js` arbeiten mit Abteilungsparametern und speichern Daten abteilungsweise in separaten Unterordnern. - Die Passwortfunktion ist nur ein einfacher Client-Mechanismus im Frontend und kein echter Sicherheitsmechanismus. - Globale Personen werden in `_people.csv` verwaltet. Wird eine Person global gelöscht, bleibt sie in bereits existierenden Sitzungen sichtbar.