modalbox for appoiments

dashboard/pages/appointments.py

@@ -3,6 +3,7 @@ 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")
 
@@ -10,6 +11,17 @@ 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(
@@ -43,6 +55,9 @@ layout = dbc.Container([
     ]),
     dbc.Row([
         dbc.Col(html.Div(id='select-output'))
+    ]),
+    dbc.Row([
+        dbc.Col(html.Div(id='modal-output', children=get_appointment_modal()))
     ])
 ], fluid=True)