# dashboard/pages/appointments.py
from dash import html, dcc
import dash
from dash_using_fullcalendar import DashUsingFullcalendar

# dash.register_page(__name__, path="/appointments", name="Termine")
# def layout():  # Als Funktion definieren
#     return html.Div([
#         dcc.Store(id="calendar-click-store"),
#         dcc.Store(id="calendar-event-store"), 
#         dcc.Input(id="test-input"),
#         html.Div("TEST")
#     ])
import dash_bootstrap_components as dbc

dash.register_page(__name__, path="/appointments", name="Termine")

layout = dbc.Container([
    dbc.Row([
        dbc.Col(html.H2("Dash FullCalendar mit Bootstrap 5"))
    ]),
    dbc.Row([
        dbc.Col(
            DashUsingFullcalendar(
                id='calendar',
                events=[
                    {"id": "1", "title": "Meeting", "date": "2025-06-13T09:00:00"},
                    {"id": "2", "title": "Workshop", "date": "2025-06-15T14:30:00"}
                ],
                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'))
    ])
], fluid=True)