- Add icanhazstring/composer-unused as dev dependency for dependency hygiene checks - Add German documentation (docs/) covering architecture, conventions, workflows, and developer checklists - Add API layer (ApiAuth, ApiBootstrap, ApiResponse), audit, scheduler, custom fields, and SSO services - Add Microsoft OIDC SSO, API token management, and user lifecycle features - Add swagger-ui vendor integration and OpenAPI spec - Add production Docker setup and bin/ scripts - Update composer dependencies, config, templates, and frontend assets throughout Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2.3 KiB
2.3 KiB
Frontend JavaScript
Letzte Aktualisierung: 2026-02-21
Ordnerstruktur
/web/js/core- technische Basismodule (DOM/Factories)
/web/js/components- wiederverwendbare UI-Features
/web/js/pages- seitenspezifische Hilfen (z. B. Listeninitialisierung)
Initialisierung
/web/js/app-boot.js- wird im
<head>geladen - setzt früh UI-States (no-js/js, Sidebar-/Contrast-LocalStorage)
- wird im
/web/js/app-init.js- Modul-Entrypoint für Standardseiten
- importiert Komponenten zentral
/web/js/app-login-init.js- reduzierter Entrypoint für Loginseiten
Modulkonvention (components/pages)
Empfohlenes Muster:
init...()Funktion exportieren- Früher Guard auf fehlende Elemente
- Keine stillen Fehler verschlucken
- Nur DOM/UI-Verhalten, keine Fachlogik
Template für neue Komponenten:
/web/js/components/_template.js
Defensive DOM-Nutzung
Nicht jede Seite hat jedes Element.
- Vor Zugriff immer Element-Existenz prüfen.
- Optional zentrale Helper (
app-dom.js) verwenden. - Module sollen auf nicht-passenden Seiten sauber no-op sein.
Grid.js-Integration
- Gemeinsame Initialisierung über Core/Page-Utilities.
- Vendor-spezifische CSS-Anpassungen in:
/web/css/vendor-overrides/gridjs.css
- Bei dynamischen Rows mit Lightbox/Tooltips: nach Render Refresh triggern.
Grid URL State Sync
createServerGrid(...) synchronisiert bei urlSync: true den Grid-Zustand zentral in die URL.
- Search + Filter (bestehendes Verhalten)
- Sortierung über
order+dir - Pagination über
page(1-basiert)
Optionale Konfiguration:
createServerGrid({
// ...
urlSync: true,
urlState: {
pageParam: 'page',
sortOrderParam: 'order',
sortDirParam: 'dir',
cleanFirstPage: true,
syncPage: true,
syncSort: true
}
});
Hinweise:
page=1wird beicleanFirstPage: truenicht in der URL gehalten.- Übernommene URL-Werte werden validiert:
page >= 1dirnurasc|descordernur bekannte Sort-Key-Spalten
- Bei Search-/Filter-Änderung wird auf Seite 1 zurückgesetzt.
Linting
Prüfen mit:
npx eslint web/js
Auto-fix (nur für sichere Rule-Fixes):
npx eslint web/js --fix
Hinweis: --fix behebt format-/syntaxnahe Themen (z. B. fehlende Klammern), aber nicht automatisch alle Logikprobleme.