initial feature/react-migration commit

dashboard-dash-backup/pages/appointments.py

@@ -0,0 +1,63 @@
+# dashboard/pages/appointments.py
+from dash import html, dcc
+import dash
+from dash_using_fullcalendar import DashUsingFullcalendar
+import dash_bootstrap_components as dbc
+from dashboard.components.appointment_modal import get_appointment_modal
+
+dash.register_page(__name__, path="/appointments", name="Termine")
+
+layout = dbc.Container([
+    dbc.Row([
+        dbc.Col(html.H2("Dash FullCalendar"))
+    ]),
+    # Button zum Öffnen der Modalbox
+    dbc.Row([
+        dbc.Col(
+            dbc.Button(
+                "Neuen Termin anlegen",
+                id="open-appointment-modal-btn",
+                color="primary",
+                className="mb-3"
+            )
+        )
+    ]),
+    dbc.Row([
+        dbc.Col(
+            DashUsingFullcalendar(
+                id='calendar',
+                events=[],
+                initialView="timeGridWeek",
+                headerToolbar={
+                    "left": "prev,next today",
+                    "center": "title",
+                    # "right": "dayGridMonth,timeGridWeek,timeGridDay"
+                },
+                height=600,
+                locale="de",
+                slotDuration="00:30:00",
+                slotMinTime="00:00:00",
+                slotMaxTime="24:00:00",
+                scrollTime="07:00:00",
+                weekends=True,
+                allDaySlot=False,
+                firstDay=1,
+                # themeSystem kann auf "bootstrap5" gesetzt werden, wenn das Plugin eingebunden ist
+                # themeSystem="bootstrap5"
+            )
+        )
+    ]),
+    dbc.Row([
+        dbc.Col(html.Div(id='output'))
+    ]),
+    dbc.Row([
+        dbc.Col(html.Div(id='event-output'))
+    ]),
+    dbc.Row([
+        dbc.Col(html.Div(id='select-output'))
+    ]),
+    dbc.Row([
+        dbc.Col(html.Div(id='modal-output', children=get_appointment_modal()))
+    ])
+], fluid=True)
+