2.2 KiB
Technischer Stand – Terminbuchungskalender (Mockup)
Komponentenform
Der Kalender ist eine browsernative JavaScript-Komponente als ES-Modul. Sie wird an einem Element mit dem Attribut data-sufw-booking initialisiert. Das Attribut data-project legt das Projekt fest; ein anderer oder fehlender Wert wird derzeit als perspektivwerk behandelt.
Die Darstellung ist mit eigenem CSS umgesetzt. Die Klassen beginnen mit sufw-booking, damit die Stile möglichst wenig mit ihrer Umgebung kollidieren.
Zustandsverwaltung
Der Zustand existiert ausschließlich im Arbeitsspeicher des Browsers:
- ausgewähltes Projekt,
- aktuell dargestellter Monat,
- ausgewählter Tag,
- lokal geöffneter Dialog und dessen Formulareingaben.
Eine erneute Initialisierung oder ein Neuladen der Seite setzt diesen Zustand zurück.
Datenquelle
Slots sind als statisches JavaScript-Array im Mockup hinterlegt. Jeder Slot enthält eine Kennung, ein Projekt, ein Datum, eine Startzeit, einen Titel und einen Status. Die Komponente filtert diese Daten nach Projekt und Datum.
Es gibt keine Netzwerkanfrage, keine Datenbankverbindung und keine serverseitige Geschäftslogik.
Eingabeverarbeitung
Die Formularvalidierung findet vollständig im Browser statt. Sie prüft insbesondere Pflichtangaben, ein einfaches E-Mail-Format, optionale Telefon- und Altersangaben sowie Längenbegrenzungen. Die Slotdaten werden bei der HTML-Ausgabe maskiert. Die Formulareingaben werden nicht gespeichert oder weitergegeben.
Zugänglichkeit und Browserverhalten
Die Komponente verwendet semantische Schaltflächen, Beschriftungen, aria-live-Bereiche, Statusinformationen und einen Dialog. Browser ohne Unterstützung für dialog.showModal() erhalten eine einfache offene Dialogvariante. Eine vollständige Prüfung mit Hilfstechnologien ist noch nicht erfolgt.
Checkpoints
- Die künftige Datenquelle für Slots ist entschieden.
- Die serverseitigen Zustände und Regeln für Reservierung und Buchung sind definiert.
- Die Schnittstelle zwischen Oberfläche und Backend ist dokumentiert.
- Die Barrierefreiheit ist mit Tastatur, Screenreader und mobilen Geräten geprüft.
- Die Browserunterstützung des Endprodukts ist festgelegt.