diff --git a/pages/Sitzplätze/queries/BookSeatSQL/BookSeatSQL.txt b/pages/Sitzplätze/queries/BookSeatSQL/BookSeatSQL.txt index 6f0aa61..88849a4 100644 --- a/pages/Sitzplätze/queries/BookSeatSQL/BookSeatSQL.txt +++ b/pages/Sitzplätze/queries/BookSeatSQL/BookSeatSQL.txt @@ -1,9 +1,27 @@ SELECT id, + platz_id, titel AS title, startzeit AS start, endzeit AS end, gebucht_von FROM `buchungen` WHERE platz_id = '{{appsmith.store.selectedSeatId}}' -ORDER BY startzeit; \ No newline at end of file +ORDER BY startzeit; + +INSERT INTO `buchungen` +( + id, + titel, + startzeit, + endzeit, + gebucht_von +) +VALUES +( + '{{appsmith.store.selectedSeatId}}', + '{{InputTitel.text}}', + '{{InputStartzeit.text}}', + '{{InputEndzeit.text}}', + '{{InputGebuchtVon.text}}' +); \ No newline at end of file diff --git a/pages/Sitzplätze/queries/BookSeatSQL/metadata.json b/pages/Sitzplätze/queries/BookSeatSQL/metadata.json index 71a0c56..e257e06 100644 --- a/pages/Sitzplätze/queries/BookSeatSQL/metadata.json +++ b/pages/Sitzplätze/queries/BookSeatSQL/metadata.json @@ -5,7 +5,7 @@ "pluginType": "DB", "unpublishedAction": { "actionConfiguration": { - "body": "SELECT\n id,\n titel AS title,\n startzeit AS start,\n endzeit AS end,\n gebucht_von\nFROM `buchungen`\nWHERE platz_id = '{{appsmith.store.selectedSeatId}}'\nORDER BY startzeit;", + "body": "SELECT\n id,\n platz_id,\n titel AS title,\n startzeit AS start,\n endzeit AS end,\n gebucht_von\nFROM `buchungen`\nWHERE platz_id = '{{appsmith.store.selectedSeatId}}'\nORDER BY startzeit;\n\nINSERT INTO `buchungen`\n(\n id,\n titel,\n startzeit,\n endzeit,\n gebucht_von\n)\nVALUES\n(\n '{{appsmith.store.selectedSeatId}}',\n '{{InputTitel.text}}',\n '{{InputStartzeit.text}}',\n '{{InputEndzeit.text}}',\n '{{InputGebuchtVon.text}}'\n);", "encodeParamsToggle": true, "paginationType": "NONE", "pluginSpecifiedTemplates": [ diff --git a/pages/Sitzplätze/queries/GetBookings/GetBookings.txt b/pages/Sitzplätze/queries/GetBookings/GetBookings.txt new file mode 100644 index 0000000..bcb5ea7 --- /dev/null +++ b/pages/Sitzplätze/queries/GetBookings/GetBookings.txt @@ -0,0 +1,10 @@ +SELECT + id, + platz_id, + titel AS title, + startzeit AS start, + endzeit AS end, + gebucht_von +FROM `buchungen` +WHERE platz_id = '{{appsmith.store.selectedSeatId}}' +ORDER BY startzeit; \ No newline at end of file diff --git a/pages/Sitzplätze/queries/GetBookings/metadata.json b/pages/Sitzplätze/queries/GetBookings/metadata.json new file mode 100644 index 0000000..66a5a7f --- /dev/null +++ b/pages/Sitzplätze/queries/GetBookings/metadata.json @@ -0,0 +1,35 @@ +{ + "gitSyncId": "6a6b5b477ebc9edeca96e2f8_e0fcb986-9f0b-4eab-bcee-5d1449214ffa", + "id": "Sitzplätze_GetBookings", + "pluginId": "mysql-plugin", + "pluginType": "DB", + "unpublishedAction": { + "actionConfiguration": { + "body": "SELECT\n id,\n platz_id,\n titel AS title,\n startzeit AS start,\n endzeit AS end,\n gebucht_von\nFROM `buchungen`\nWHERE platz_id = '{{appsmith.store.selectedSeatId}}'\nORDER BY startzeit;", + "encodeParamsToggle": true, + "paginationType": "NONE", + "pluginSpecifiedTemplates": [ + { + "value": true + } + ], + "timeoutInMillisecond": 10000 + }, + "confirmBeforeExecute": false, + "datasource": { + "id": "MySQL Bürobuchungen", + "isAutoGenerated": false, + "name": "MySQL Bürobuchungen", + "pluginId": "mysql-plugin" + }, + "dynamicBindingPathList": [ + { + "key": "body" + } + ], + "name": "GetBookings", + "pageId": "Sitzplätze", + "runBehaviour": "AUTOMATIC", + "userSetOnLoad": false + } +} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/Custom4.json b/pages/Sitzplätze/widgets/Custom4.json index 29aa2f9..e5943c1 100644 --- a/pages/Sitzplätze/widgets/Custom4.json +++ b/pages/Sitzplätze/widgets/Custom4.json @@ -24,7 +24,11 @@ } ], "dynamicHeight": "FIXED", - "dynamicPropertyPathList": [], + "dynamicPropertyPathList": [ + { + "key": "seatSelected" + } + ], "dynamicTriggerPathList": [ { "key": "seatSelected" @@ -51,7 +55,7 @@ "parentRowSpace": 10, "renderMode": "CANVAS", "rightColumn": 64, - "seatSelected": "{{showModal(SeatCalendar.name);}}", + "seatSelected": "{{\n storeValue(\n \"selectedSeatId\",\n Custom4.model.selectedSeat.id\n )\n .then(() =>\n storeValue(\n \"selectedSeatName\",\n Custom4.model.selectedSeat.name\n )\n )\n .then(() => GetBookings.run())\n .then(() => showModal(SeatCalendar.name))\n}}", "srcDoc": { "css": "@charset \"UTF-8\";\nhtml,\nbody {\n margin: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n font-family: Arial, sans-serif;\n}\n\n/* Bild + Overlay */\n#imgHolder {\n position: relative;\n width: 100%;\n height: 700px; /* feste Höhe, damit sicher nicht 0 */\n overflow: hidden;\n border-radius: 6px;\n background: #f3f4f6;\n}\n\n#floorplanImage {\n position: absolute;\n inset: 0;\n z-index: 1;\n display: block;\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n\n#seatLayer {\n position: absolute;\n inset: 0;\n z-index: 2;\n width: 100%;\n height: 100%;\n pointer-events: none; /* Punkte bekommen später pointer-events:auto */\n}\n\n/* Sitzpunkte */\n.seat {\n position: absolute;\n z-index: 3;\n display: block;\n width: 18px;\n height: 18px;\n padding: 0;\n transform: translate(-50%, -50%);\n border: 2px solid #ffffff;\n border-radius: 50%;\n background: #22c55e;\n color: #22c55e;\n cursor: pointer;\n pointer-events: auto;\n appearance: none;\n box-sizing: border-box;\n box-shadow: 0 0 5px currentColor, 0 0 10px currentColor;\n transition: transform 0.15s ease, box-shadow 0.15s ease;\n}\n\n.seat:hover {\n z-index: 10;\n transform: translate(-50%, -50%) scale(1.45);\n box-shadow: 0 0 8px currentColor, 0 0 16px currentColor;\n}\n\n/* Farben nach Status */\n.seat.frei {\n background: #22c55e; /* Grün */\n color: #22c55e;\n}\n\n.seat.belegt {\n background: #ef4444; /* Rot */\n color: #ef4444;\n}\n\n.seat.selected {\n outline: 3px solid #2563eb;\n outline-offset: 3px;\n}\n\n/* Legende */\n#legend {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n margin-top: 8px;\n color: #374151;\n font-size: 13px;\n}\n\n.legendItem {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n}\n\n.legendColor {\n display: inline-block;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n}\n\n.legendColor.frei {\n background: #22c55e;\n}\n\n.legendColor.belegt {\n background: #ef4444;\n}", "html": "
\n\n
\n \n \"Büroplan\"\n\t\t
\n\t\t\n\t\t\n
\n
", diff --git a/pages/Sitzplätze/widgets/Modal1/Custom3.json b/pages/Sitzplätze/widgets/Modal1/Custom3.json deleted file mode 100644 index bf87ef4..0000000 --- a/pages/Sitzplätze/widgets/Modal1/Custom3.json +++ /dev/null @@ -1,64 +0,0 @@ -{ - "backgroundColor": "#FFFFFF", - "borderColor": "#E0DEDE", - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "borderWidth": "1", - "bottomRow": 60, - "boxShadow": "{{appsmith.theme.boxShadow.appBoxShadow}}", - "defaultModel": "", - "dynamicBindingPathList": [ - { - "key": "theme" - }, - { - "key": "borderRadius" - }, - { - "key": "boxShadow" - } - ], - "dynamicHeight": "FIXED", - "dynamicTriggerPathList": [ - { - "key": "onResetClick" - } - ], - "events": [ - "onResetClick" - ], - "isCanvas": false, - "isLoading": false, - "isSearchWildcard": true, - "isVisible": true, - "key": "m02i2p2i1e", - "leftColumn": 0, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "mobileBottomRow": 30, - "mobileLeftColumn": 0, - "mobileRightColumn": 23, - "mobileTopRow": 0, - "needsErrorInfo": false, - "onResetClick": "{{showAlert('Successfully reset!!', '');}}", - "parentColumnSpace": 21.40625, - "parentId": "q2rxwqtggc", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "rightColumn": 64, - "srcDoc": { - "css": "", - "html": "\n\n\n\n\n\n\n\n
\n\n", - "js": "appsmith.onReady(() => {\n const calendarEl = document.getElementById('calendar');\n const calendar = new FullCalendar.Calendar(calendarEl, {\n initialView: 'dayGridMonth'\n });\n calendar.render();\n});" - }, - "theme": "{{appsmith.theme}}", - "topRow": 0, - "type": "CUSTOM_WIDGET", - "uncompiledSrcDoc": { - "css": "", - "html": "\n\n\n\n\n\n\n\n
\n\n", - "js": "appsmith.onReady(()=>{\nconst calendarEl = document.getElementById('calendar')\nconst calendar = new FullCalendar.Calendar(calendarEl, {\ninitialView: 'dayGridMonth'\n})\ncalendar.render()\n})" - }, - "version": 1, - "widgetId": "5pq6xcyg78", - "widgetName": "Custom3" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/Modal1/Modal1.json b/pages/Sitzplätze/widgets/Modal1/Modal1.json deleted file mode 100644 index dcc7c6a..0000000 --- a/pages/Sitzplätze/widgets/Modal1/Modal1.json +++ /dev/null @@ -1,85 +0,0 @@ -{ - "animateLoading": true, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 271, - "boxShadow": "none", - "canEscapeKeyClose": true, - "canOutsideClickClose": true, - "children": [ - { - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 700, - "boxShadow": "{{appsmith.theme.boxShadow.appBoxShadow}}", - "canExtend": true, - "detachFromLayout": true, - "dynamicBindingPathList": [ - { - "key": "borderRadius" - }, - { - "key": "boxShadow" - } - ], - "dynamicHeight": "AUTO_HEIGHT", - "flexLayers": [], - "isDisabled": false, - "isLoading": false, - "isVisible": true, - "key": "h3ezoy44rt", - "leftColumn": 0, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "minHeight": 700, - "minWidth": 450, - "mobileBottomRow": 240, - "mobileLeftColumn": 0, - "mobileRightColumn": 609.375, - "mobileTopRow": 0, - "needsErrorInfo": false, - "parentColumnSpace": 1, - "parentId": "8lajbnb6nu", - "parentRowSpace": 1, - "renderMode": "CANVAS", - "responsiveBehavior": "fill", - "rightColumn": 609.375, - "shouldScrollContents": false, - "topRow": 0, - "type": "CANVAS_WIDGET", - "version": 1, - "widgetId": "q2rxwqtggc", - "widgetName": "Canvas5" - } - ], - "detachFromLayout": true, - "dynamicBindingPathList": [ - { - "key": "borderRadius" - } - ], - "dynamicHeight": "FIXED", - "dynamicTriggerPathList": [], - "height": 700, - "isCanvas": true, - "isLoading": false, - "key": "gatb3mw95x", - "leftColumn": 15, - "maxDynamicHeight": 9000, - "minDynamicHeight": 24, - "mobileBottomRow": 55, - "mobileLeftColumn": 15, - "mobileRightColumn": 39, - "mobileTopRow": 31, - "needsErrorInfo": false, - "parentColumnSpace": 25.390625, - "parentId": "0", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "rightColumn": 39, - "shouldScrollContents": false, - "topRow": 31, - "type": "MODAL_WIDGET", - "version": 2, - "widgetId": "8lajbnb6nu", - "widgetName": "Modal1", - "width": 1360 -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/ButtonBuchen.json b/pages/Sitzplätze/widgets/SeatCalendar/ButtonBuchen.json deleted file mode 100644 index d9bc997..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/ButtonBuchen.json +++ /dev/null @@ -1,45 +0,0 @@ -{ - "animateLoading": true, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 7, - "boxShadow": "none", - "buttonColor": "{{appsmith.theme.colors.primaryColor}}", - "buttonVariant": "PRIMARY", - "disabledWhenInvalid": false, - "dynamicBindingPathList": [ - { - "key": "buttonColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicTriggerPathList": [], - "isDefaultClickDisabled": true, - "isDisabled": false, - "isLoading": false, - "isVisible": true, - "key": "ecgxpla2dn", - "leftColumn": 45, - "minWidth": 120, - "mobileBottomRow": 7, - "mobileLeftColumn": 42, - "mobileRightColumn": 58, - "mobileTopRow": 3, - "needsErrorInfo": false, - "parentColumnSpace": 9.1875, - "parentId": "ekq4ry46pv", - "parentRowSpace": 10, - "placement": "CENTER", - "recaptchaType": "V3", - "renderMode": "CANVAS", - "resetFormOnClick": false, - "responsiveBehavior": "hug", - "rightColumn": 58, - "text": "Speichern", - "topRow": 2, - "type": "BUTTON_WIDGET", - "version": 1, - "widgetId": "0a20eja5yr", - "widgetName": "ButtonBuchen" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/Custom5.json b/pages/Sitzplätze/widgets/SeatCalendar/Custom5.json index f61c4d1..e831a3c 100644 --- a/pages/Sitzplätze/widgets/SeatCalendar/Custom5.json +++ b/pages/Sitzplätze/widgets/SeatCalendar/Custom5.json @@ -3,9 +3,9 @@ "borderColor": "#E0DEDE", "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", "borderWidth": "1", - "bottomRow": 54, + "bottomRow": 53, "boxShadow": "{{appsmith.theme.boxShadow.appBoxShadow}}", - "defaultModel": "{{\n {\n events: GetSeats.data || [],\n seatId: appsmith.store.selectedSeatId,\n seatName: appsmith.store.selectedSeatName\n }\n}}", + "defaultModel": "{{\n {\n events: GetBookings.data || [],\n seatId: appsmith.store.selectedSeatId,\n seatName: appsmith.store.selectedSeatName\n }\n}}", "dynamicBindingPathList": [ { "key": "theme" @@ -21,13 +21,18 @@ } ], "dynamicHeight": "FIXED", + "dynamicPropertyPathList": [ + { + "key": "seatSelected" + } + ], "dynamicTriggerPathList": [ { - "key": "onResetClick" + "key": "seatSelected" } ], "events": [ - "onResetClick" + "seatSelected" ], "isCanvas": false, "isLoading": false, @@ -42,24 +47,24 @@ "mobileRightColumn": 26, "mobileTopRow": 10, "needsErrorInfo": false, - "onResetClick": "{{showAlert('Successfully reset!!', '');}}", "parentColumnSpace": 7.40625, "parentId": "ekq4ry46pv", "parentRowSpace": 10, "renderMode": "CANVAS", "rightColumn": 64, + "seatSelected": "{{\n storeValue(\n \"selectedSeatId\",\n Custom4.model.selectedSeat.id\n )\n .then(() =>\n storeValue(\n \"selectedSeatName\",\n Custom4.model.selectedSeat.name\n )\n )\n .then(() => GetBookings.run())\n .then(() => showModal(SeatCalendar.name))\n}}", "srcDoc": { "css": "html,\nbody {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n font-family: Arial, sans-serif;\n overflow: auto;\n}\n\n#calendarWrapper {\n width: 100%;\n min-height: 620px;\n box-sizing: border-box;\n padding: 10px;\n background: #ffffff;\n}\n\n#calendarHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n margin-bottom: 10px;\n padding: 8px 10px;\n border: 1px solid #d1d5db;\n border-radius: 6px;\n background: #f9fafb;\n}\n\n#calendarSeatTitle {\n font-size: 15px;\n font-weight: 600;\n color: #374151;\n}\n\n#calendarViewButtons {\n display: flex;\n gap: 6px;\n}\n\n#calendarViewButtons button {\n padding: 6px 10px;\n border: 1px solid #9ca3af;\n border-radius: 5px;\n background: #ffffff;\n color: #374151;\n cursor: pointer;\n}\n\n#calendarViewButtons button:hover {\n background: #e5e7eb;\n}\n\n#calendar {\n width: 100%;\n min-height: 520px;\n}\n\n#calendarSelection {\n margin-top: 10px;\n padding: 8px 10px;\n border: 1px solid #d1d5db;\n border-radius: 5px;\n background: #f9fafb;\n color: #374151;\n font-size: 13px;\n}\n\n/* FullCalendar-Anpassungen */\n.fc {\n font-size: 13px;\n}\n\n.fc .fc-button {\n background: #374151;\n border-color: #374151;\n}\n\n.fc .fc-button:hover,\n.fc .fc-button-active {\n background: #111827;\n border-color: #111827;\n}\n\n.fc .fc-daygrid-day.fc-day-today,\n.fc .fc-timegrid-col.fc-day-today {\n background: #eff6ff;\n}\n\n.fc .fc-event {\n cursor: pointer;\n}", "html": "
\n
\n
\n Kalender\n
\n\n
\n \n\n \n
\n
\n\n
\n\n
\n Kein Zeitraum ausgewählt\n
\n\n \n
", - "js": "let calendar = null;\nfunction getModel() {\n const model = appsmith.model || {};\n if (typeof model === \"string\") {\n try {\n return JSON.parse(model);\n } catch (error) {\n return {};\n }\n }\n return model;\n}\nfunction getEvents() {\n const model = getModel();\n if (!Array.isArray(model.events)) {\n return [];\n }\n return model.events;\n}\nfunction getSeatName() {\n const model = getModel();\n return model.seatName || model.seatId || \"kein Platz ausgewählt\";\n}\nfunction updateSeatTitle() {\n const titleElement = document.getElementById(\"calendarSeatTitle\");\n if (!titleElement) {\n return;\n }\n titleElement.textContent = `Kalender für ${getSeatName()}`;\n}\nfunction updateSelectionText(text) {\n const selectionElement = document.getElementById(\"calendarSelection\");\n if (!selectionElement) {\n return;\n }\n selectionElement.textContent = text;\n}\nfunction createCalendar() {\n const calendarElement = document.getElementById(\"calendar\");\n if (!calendarElement) {\n return;\n }\n if (typeof FullCalendar === \"undefined\") {\n calendarElement.textContent = \"FullCalendar konnte nicht geladen werden.\";\n return;\n }\n if (calendar) {\n calendar.destroy();\n }\n calendar = new FullCalendar.Calendar(calendarElement, {\n initialView: \"dayGridMonth\",\n locale: \"de\",\n firstDay: 1,\n navLinks: true,\n selectable: true,\n selectMirror: true,\n editable: false,\n eventStartEditable: false,\n eventDurationEditable: false,\n height: \"auto\",\n headerToolbar: {\n left: \"prev,next today\",\n center: \"title\",\n right: \"\"\n },\n buttonText: {\n today: \"Heute\"\n },\n slotDuration: \"00:30:00\",\n snapDuration: \"00:30:00\",\n slotMinTime: \"07:00:00\",\n slotMaxTime: \"20:00:00\",\n allDaySlot: true,\n nowIndicator: true,\n events: getEvents(),\n dateClick(info) {\n if (info.view.type === \"dayGridMonth\") {\n calendar.changeView(\"timeGridDay\", info.date);\n return;\n }\n updateSelectionText(`Ausgewählter Zeitpunkt: ${info.dateStr}`);\n },\n navLinkDayClick(date) {\n calendar.changeView(\"timeGridDay\", date);\n },\n select(info) {\n const start = formatDateTime(info.start);\n const end = formatDateTime(info.end);\n updateSelectionText(`Ausgewählt: ${start} bis ${end}`);\n appsmith.updateModel({\n selectedRange: {\n start: info.startStr,\n end: info.endStr,\n allDay: info.allDay\n }\n });\n },\n eventClick(info) {\n const event = info.event;\n const start = event.start ? formatDateTime(event.start) : \"\";\n const end = event.end ? formatDateTime(event.end) : \"\";\n const rangeText = event.allDay ? \"Ganztägig\" : `${start} bis ${end}`;\n updateSelectionText(`${event.title || \"Buchung\"} – ${rangeText}`);\n }\n });\n calendar.render();\n}\nfunction formatDateTime(date) {\n if (!date) {\n return \"\";\n }\n return new Intl.DateTimeFormat(\"de-DE\", {\n dateStyle: \"short\",\n timeStyle: \"short\"\n }).format(date);\n}\nfunction registerButtons() {\n const monthButton = document.getElementById(\"monthButton\");\n const dayButton = document.getElementById(\"dayButton\");\n if (monthButton) {\n monthButton.addEventListener(\"click\", () => {\n if (calendar) {\n calendar.changeView(\"dayGridMonth\");\n }\n });\n }\n if (dayButton) {\n dayButton.addEventListener(\"click\", () => {\n if (calendar) {\n calendar.changeView(\"timeGridDay\", calendar.getDate());\n }\n });\n }\n}\nfunction refreshCalendarEvents() {\n if (!calendar) {\n createCalendar();\n return;\n }\n calendar.removeAllEventSources();\n calendar.addEventSource(getEvents());\n}\nappsmith.onReady(() => {\n updateSeatTitle();\n registerButtons();\n createCalendar();\n appsmith.onModelChange(() => {\n updateSeatTitle();\n refreshCalendarEvents();\n });\n});" + "js": "let calendar = null;\nfunction getModel() {\n const model = appsmith.model || {};\n if (typeof model === \"string\") {\n try {\n return JSON.parse(model);\n } catch (error) {\n return {};\n }\n }\n return model;\n}\nfunction getEvents() {\n const model = getModel();\n if (Array.isArray(model.events)) {\n return model.events;\n }\n return [];\n}\nfunction getSeatName() {\n const model = getModel();\n return model.seatName || model.seatId || \"kein Platz ausgewählt\";\n}\nfunction updateSeatTitle() {\n const titleElement = document.getElementById(\"calendarSeatTitle\");\n if (!titleElement) {\n return;\n }\n titleElement.textContent = `Kalender für ${getSeatName()}`;\n}\nfunction createCalendar() {\n const calendarElement = document.getElementById(\"calendar\");\n if (!calendarElement) {\n return;\n }\n if (typeof FullCalendar === \"undefined\") {\n calendarElement.textContent = \"FullCalendar konnte nicht geladen werden.\";\n return;\n }\n if (calendar) {\n calendar.destroy();\n }\n calendar = new FullCalendar.Calendar(calendarElement, {\n initialView: \"dayGridMonth\",\n locale: \"de\",\n firstDay: 1,\n navLinks: true,\n navLinkDayClick(date) {\n calendar.changeView(\"timeGridDay\", date);\n },\n selectable: false,\n editable: false,\n eventStartEditable: false,\n eventDurationEditable: false,\n height: \"auto\",\n headerToolbar: {\n left: \"prev,next today\",\n center: \"title\",\n right: \"dayGridMonth,timeGridDay\"\n },\n buttonText: {\n today: \"Heute\",\n month: \"Monat\",\n day: \"Tag\"\n },\n slotDuration: \"00:30:00\",\n snapDuration: \"00:30:00\",\n slotMinTime: \"07:00:00\",\n slotMaxTime: \"20:00:00\",\n allDaySlot: false,\n nowIndicator: true,\n events: getEvents(),\n eventClick(info) {\n const event = info.event;\n const start = event.start ? formatDateTime(event.start) : \"\";\n const end = event.end ? formatDateTime(event.end) : \"\";\n const rangeText = end ? `${start} bis ${end}` : start;\n updateSelectionText(`${event.title || \"Buchung\"} – ${rangeText}`);\n }\n });\n calendar.render();\n}\nfunction formatDateTime(date) {\n if (!date) {\n return \"\";\n }\n return new Intl.DateTimeFormat(\"de-DE\", {\n dateStyle: \"short\",\n timeStyle: \"short\"\n }).format(date);\n}\nfunction updateSelectionText(text) {\n const selectionElement = document.getElementById(\"calendarSelection\");\n if (!selectionElement) {\n return;\n }\n selectionElement.textContent = text;\n}\nfunction registerButtons() {\n const monthButton = document.getElementById(\"monthButton\");\n const dayButton = document.getElementById(\"dayButton\");\n if (monthButton) {\n monthButton.addEventListener(\"click\", () => {\n if (!calendar) {\n return;\n }\n calendar.changeView(\"dayGridMonth\");\n });\n }\n if (dayButton) {\n dayButton.addEventListener(\"click\", () => {\n if (!calendar) {\n return;\n }\n calendar.changeView(\"timeGridDay\", calendar.getDate());\n });\n }\n}\nfunction refreshCalendarEvents() {\n if (!calendar) {\n createCalendar();\n return;\n }\n calendar.removeAllEvents();\n calendar.addEventSource(getEvents());\n}\nappsmith.onReady(() => {\n registerButtons();\n updateSeatTitle();\n createCalendar();\n appsmith.onModelChange(() => {\n updateSeatTitle();\n refreshCalendarEvents();\n });\n});" }, "theme": "{{appsmith.theme}}", - "topRow": 7, + "topRow": 0, "type": "CUSTOM_WIDGET", "uncompiledSrcDoc": { "css": "html,\nbody {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n font-family: Arial, sans-serif;\n overflow: auto;\n}\n\n#calendarWrapper {\n width: 100%;\n min-height: 620px;\n box-sizing: border-box;\n padding: 10px;\n background: #ffffff;\n}\n\n#calendarHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n margin-bottom: 10px;\n padding: 8px 10px;\n border: 1px solid #d1d5db;\n border-radius: 6px;\n background: #f9fafb;\n}\n\n#calendarSeatTitle {\n font-size: 15px;\n font-weight: 600;\n color: #374151;\n}\n\n#calendarViewButtons {\n display: flex;\n gap: 6px;\n}\n\n#calendarViewButtons button {\n padding: 6px 10px;\n border: 1px solid #9ca3af;\n border-radius: 5px;\n background: #ffffff;\n color: #374151;\n cursor: pointer;\n}\n\n#calendarViewButtons button:hover {\n background: #e5e7eb;\n}\n\n#calendar {\n width: 100%;\n min-height: 520px;\n}\n\n#calendarSelection {\n margin-top: 10px;\n padding: 8px 10px;\n border: 1px solid #d1d5db;\n border-radius: 5px;\n background: #f9fafb;\n color: #374151;\n font-size: 13px;\n}\n\n/* FullCalendar-Anpassungen */\n\n.fc {\n font-size: 13px;\n}\n\n.fc .fc-button {\n background: #374151;\n border-color: #374151;\n}\n\n.fc .fc-button:hover,\n.fc .fc-button-active {\n background: #111827;\n border-color: #111827;\n}\n\n.fc .fc-daygrid-day.fc-day-today,\n.fc .fc-timegrid-col.fc-day-today {\n background: #eff6ff;\n}\n\n.fc .fc-event {\n cursor: pointer;\n}", "html": "
\n
\n
\n Kalender\n
\n\n
\n \n\n \n
\n
\n\n
\n\n
\n Kein Zeitraum ausgewählt\n
\n\n \n
", - "js": "let calendar = null;\n\nfunction getModel() {\n const model = appsmith.model || {};\n\n if (typeof model === \"string\") {\n try {\n return JSON.parse(model);\n } catch (error) {\n return {};\n }\n }\n\n return model;\n}\n\nfunction getEvents() {\n const model = getModel();\n\n if (!Array.isArray(model.events)) {\n return [];\n }\n\n return model.events;\n}\n\nfunction getSeatName() {\n const model = getModel();\n\n return model.seatName ||\n model.seatId ||\n \"kein Platz ausgewählt\";\n}\n\nfunction updateSeatTitle() {\n const titleElement = document.getElementById(\"calendarSeatTitle\");\n\n if (!titleElement) {\n return;\n }\n\n titleElement.textContent =\n `Kalender für ${getSeatName()}`;\n}\n\nfunction updateSelectionText(text) {\n const selectionElement =\n document.getElementById(\"calendarSelection\");\n\n if (!selectionElement) {\n return;\n }\n\n selectionElement.textContent = text;\n}\n\nfunction createCalendar() {\n const calendarElement =\n document.getElementById(\"calendar\");\n\n if (!calendarElement) {\n return;\n }\n\n if (typeof FullCalendar === \"undefined\") {\n calendarElement.textContent =\n \"FullCalendar konnte nicht geladen werden.\";\n return;\n }\n\n if (calendar) {\n calendar.destroy();\n }\n\n calendar = new FullCalendar.Calendar(calendarElement, {\n initialView: \"dayGridMonth\",\n\n locale: \"de\",\n firstDay: 1,\n\n navLinks: true,\n selectable: true,\n selectMirror: true,\n\n editable: false,\n eventStartEditable: false,\n eventDurationEditable: false,\n\n height: \"auto\",\n\n headerToolbar: {\n left: \"prev,next today\",\n center: \"title\",\n right: \"\"\n },\n\n buttonText: {\n today: \"Heute\"\n },\n\n slotDuration: \"00:30:00\",\n snapDuration: \"00:30:00\",\n\n slotMinTime: \"07:00:00\",\n slotMaxTime: \"20:00:00\",\n\n allDaySlot: true,\n nowIndicator: true,\n\n events: getEvents(),\n\n dateClick(info) {\n if (info.view.type === \"dayGridMonth\") {\n calendar.changeView(\"timeGridDay\", info.date);\n return;\n }\n\n updateSelectionText(\n `Ausgewählter Zeitpunkt: ${info.dateStr}`\n );\n },\n\n navLinkDayClick(date) {\n calendar.changeView(\"timeGridDay\", date);\n },\n\n select(info) {\n const start = formatDateTime(info.start);\n const end = formatDateTime(info.end);\n\n updateSelectionText(\n `Ausgewählt: ${start} bis ${end}`\n );\n\n appsmith.updateModel({\n selectedRange: {\n start: info.startStr,\n end: info.endStr,\n allDay: info.allDay\n }\n });\n },\n\n eventClick(info) {\n const event = info.event;\n const start = event.start\n ? formatDateTime(event.start)\n : \"\";\n\n const end = event.end\n ? formatDateTime(event.end)\n : \"\";\n\n const rangeText = event.allDay\n ? \"Ganztägig\"\n : `${start} bis ${end}`;\n\n updateSelectionText(\n `${event.title || \"Buchung\"} – ${rangeText}`\n );\n }\n });\n\n calendar.render();\n}\n\nfunction formatDateTime(date) {\n if (!date) {\n return \"\";\n }\n\n return new Intl.DateTimeFormat(\"de-DE\", {\n dateStyle: \"short\",\n timeStyle: \"short\"\n }).format(date);\n}\n\nfunction registerButtons() {\n const monthButton =\n document.getElementById(\"monthButton\");\n\n const dayButton =\n document.getElementById(\"dayButton\");\n\n if (monthButton) {\n monthButton.addEventListener(\"click\", () => {\n if (calendar) {\n calendar.changeView(\"dayGridMonth\");\n }\n });\n }\n\n if (dayButton) {\n dayButton.addEventListener(\"click\", () => {\n if (calendar) {\n calendar.changeView(\n \"timeGridDay\",\n calendar.getDate()\n );\n }\n });\n }\n}\n\nfunction refreshCalendarEvents() {\n if (!calendar) {\n createCalendar();\n return;\n }\n\n calendar.removeAllEventSources();\n calendar.addEventSource(getEvents());\n}\n\nappsmith.onReady(() => {\n updateSeatTitle();\n registerButtons();\n createCalendar();\n\n appsmith.onModelChange(() => {\n updateSeatTitle();\n refreshCalendarEvents();\n });\n});" + "js": "let calendar = null;\n\nfunction getModel() {\n const model = appsmith.model || {};\n\n if (typeof model === \"string\") {\n try {\n return JSON.parse(model);\n } catch (error) {\n return {};\n }\n }\n\n return model;\n}\n\nfunction getEvents() {\n const model = getModel();\n\n if (Array.isArray(model.events)) {\n return model.events;\n }\n\n return [];\n}\n\nfunction getSeatName() {\n const model = getModel();\n\n return model.seatName ||\n model.seatId ||\n \"kein Platz ausgewählt\";\n}\n\nfunction updateSeatTitle() {\n const titleElement =\n document.getElementById(\"calendarSeatTitle\");\n\n if (!titleElement) {\n return;\n }\n\n titleElement.textContent =\n `Kalender für ${getSeatName()}`;\n}\n\nfunction createCalendar() {\n const calendarElement =\n document.getElementById(\"calendar\");\n\n if (!calendarElement) {\n return;\n }\n\n if (typeof FullCalendar === \"undefined\") {\n calendarElement.textContent =\n \"FullCalendar konnte nicht geladen werden.\";\n return;\n }\n\n if (calendar) {\n calendar.destroy();\n }\n\n calendar = new FullCalendar.Calendar(calendarElement, {\n initialView: \"dayGridMonth\",\n\n locale: \"de\",\n firstDay: 1,\n\n navLinks: true,\n navLinkDayClick(date) {\n calendar.changeView(\"timeGridDay\", date);\n },\n\n selectable: false,\n editable: false,\n eventStartEditable: false,\n eventDurationEditable: false,\n\n height: \"auto\",\n\n headerToolbar: {\n left: \"prev,next today\",\n center: \"title\",\n right: \"dayGridMonth,timeGridDay\"\n },\n\n buttonText: {\n today: \"Heute\",\n month: \"Monat\",\n day: \"Tag\"\n },\n\n slotDuration: \"00:30:00\",\n snapDuration: \"00:30:00\",\n\n slotMinTime: \"07:00:00\",\n slotMaxTime: \"20:00:00\",\n\n allDaySlot: false,\n nowIndicator: true,\n\n events: getEvents(),\n\n eventClick(info) {\n const event = info.event;\n\n const start = event.start\n ? formatDateTime(event.start)\n : \"\";\n\n const end = event.end\n ? formatDateTime(event.end)\n : \"\";\n\n const rangeText = end\n ? `${start} bis ${end}`\n : start;\n\n updateSelectionText(\n `${event.title || \"Buchung\"} – ${rangeText}`\n );\n }\n });\n\n calendar.render();\n}\n\nfunction formatDateTime(date) {\n if (!date) {\n return \"\";\n }\n\n return new Intl.DateTimeFormat(\"de-DE\", {\n dateStyle: \"short\",\n timeStyle: \"short\"\n }).format(date);\n}\n\nfunction updateSelectionText(text) {\n const selectionElement =\n document.getElementById(\"calendarSelection\");\n\n if (!selectionElement) {\n return;\n }\n\n selectionElement.textContent = text;\n}\n\nfunction registerButtons() {\n const monthButton =\n document.getElementById(\"monthButton\");\n\n const dayButton =\n document.getElementById(\"dayButton\");\n\n if (monthButton) {\n monthButton.addEventListener(\"click\", () => {\n if (!calendar) {\n return;\n }\n\n calendar.changeView(\"dayGridMonth\");\n });\n }\n\n if (dayButton) {\n dayButton.addEventListener(\"click\", () => {\n if (!calendar) {\n return;\n }\n\n calendar.changeView(\n \"timeGridDay\",\n calendar.getDate()\n );\n });\n }\n}\n\nfunction refreshCalendarEvents() {\n if (!calendar) {\n createCalendar();\n return;\n }\n\n calendar.removeAllEvents();\n calendar.addEventSource(getEvents());\n}\n\nappsmith.onReady(() => {\n registerButtons();\n updateSeatTitle();\n createCalendar();\n\n appsmith.onModelChange(() => {\n updateSeatTitle();\n refreshCalendarEvents();\n });\n});" }, "version": 1, "widgetId": "ad7fob2vs9", diff --git a/pages/Sitzplätze/widgets/SeatCalendar/InputEndzeit.json b/pages/Sitzplätze/widgets/SeatCalendar/InputEndzeit.json deleted file mode 100644 index 54bb923..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/InputEndzeit.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "accentColor": "{{appsmith.theme.colors.primaryColor}}", - "animateLoading": true, - "autoFocus": false, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 7, - "boxShadow": "none", - "defaultText": "", - "dynamicBindingPathList": [ - { - "key": "accentColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicHeight": "FIXED", - "dynamicTriggerPathList": [], - "iconAlign": "left", - "inputType": "TEXT", - "isDisabled": false, - "isLoading": false, - "isRequired": false, - "isVisible": true, - "key": "ta0c6wkf1z", - "label": "Endzeit", - "labelAlignment": "left", - "labelPosition": "Top", - "labelStyle": "", - "labelTextSize": "0.875rem", - "labelWidth": 5, - "leftColumn": 21, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "minWidth": 450, - "mobileBottomRow": 7, - "mobileLeftColumn": 26, - "mobileRightColumn": 46, - "mobileTopRow": 0, - "needsErrorInfo": false, - "parentColumnSpace": 9.1875, - "parentId": "ekq4ry46pv", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "resetOnSubmit": true, - "responsiveBehavior": "fill", - "rightColumn": 32, - "showStepArrows": false, - "topRow": 0, - "type": "INPUT_WIDGET_V2", - "version": 2, - "widgetId": "ta8xd32gsh", - "widgetName": "InputEndzeit" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/InputGebuchtVon.json b/pages/Sitzplätze/widgets/SeatCalendar/InputGebuchtVon.json deleted file mode 100644 index cad7a4b..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/InputGebuchtVon.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "accentColor": "{{appsmith.theme.colors.primaryColor}}", - "animateLoading": true, - "autoFocus": false, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 7, - "boxShadow": "none", - "defaultText": "", - "dynamicBindingPathList": [ - { - "key": "accentColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicHeight": "FIXED", - "dynamicTriggerPathList": [], - "iconAlign": "left", - "inputType": "TEXT", - "isDisabled": false, - "isLoading": false, - "isRequired": false, - "isVisible": true, - "key": "ta0c6wkf1z", - "label": "Gebucht von", - "labelAlignment": "left", - "labelPosition": "Top", - "labelStyle": "", - "labelTextSize": "0.875rem", - "labelWidth": 5, - "leftColumn": 32, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "minWidth": 450, - "mobileBottomRow": 7, - "mobileLeftColumn": 36, - "mobileRightColumn": 56, - "mobileTopRow": 0, - "needsErrorInfo": false, - "parentColumnSpace": 9.1875, - "parentId": "ekq4ry46pv", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "resetOnSubmit": true, - "responsiveBehavior": "fill", - "rightColumn": 45, - "showStepArrows": false, - "topRow": 0, - "type": "INPUT_WIDGET_V2", - "version": 2, - "widgetId": "gdgks90sqi", - "widgetName": "InputGebuchtVon" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/InputStartzeit.json b/pages/Sitzplätze/widgets/SeatCalendar/InputStartzeit.json deleted file mode 100644 index 937f791..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/InputStartzeit.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "accentColor": "{{appsmith.theme.colors.primaryColor}}", - "animateLoading": true, - "autoFocus": false, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 7, - "boxShadow": "none", - "defaultText": "", - "dynamicBindingPathList": [ - { - "key": "accentColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicHeight": "FIXED", - "dynamicTriggerPathList": [], - "iconAlign": "left", - "inputType": "TEXT", - "isDisabled": false, - "isLoading": false, - "isRequired": false, - "isVisible": true, - "key": "ta0c6wkf1z", - "label": "Startzeit", - "labelAlignment": "left", - "labelPosition": "Top", - "labelStyle": "", - "labelTextSize": "0.875rem", - "labelWidth": 5, - "leftColumn": 9, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "minWidth": 450, - "mobileBottomRow": 7, - "mobileLeftColumn": 14, - "mobileRightColumn": 34, - "mobileTopRow": 0, - "needsErrorInfo": false, - "parentColumnSpace": 9.1875, - "parentId": "ekq4ry46pv", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "resetOnSubmit": true, - "responsiveBehavior": "fill", - "rightColumn": 21, - "showStepArrows": false, - "topRow": 0, - "type": "INPUT_WIDGET_V2", - "version": 2, - "widgetId": "fp4jilo4ey", - "widgetName": "InputStartzeit" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/InputTitel.json b/pages/Sitzplätze/widgets/SeatCalendar/InputTitel.json deleted file mode 100644 index ed5e642..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/InputTitel.json +++ /dev/null @@ -1,53 +0,0 @@ -{ - "accentColor": "{{appsmith.theme.colors.primaryColor}}", - "animateLoading": true, - "autoFocus": false, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 7, - "boxShadow": "none", - "defaultText": "", - "dynamicBindingPathList": [ - { - "key": "accentColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicHeight": "FIXED", - "iconAlign": "left", - "inputType": "TEXT", - "isDisabled": false, - "isLoading": false, - "isRequired": false, - "isVisible": true, - "key": "ta0c6wkf1z", - "label": "Label", - "labelAlignment": "left", - "labelPosition": "Top", - "labelStyle": "", - "labelTextSize": "0.875rem", - "labelWidth": 5, - "leftColumn": 0, - "maxDynamicHeight": 9000, - "minDynamicHeight": 4, - "minWidth": 450, - "mobileBottomRow": 7, - "mobileLeftColumn": 1, - "mobileRightColumn": 21, - "mobileTopRow": 0, - "needsErrorInfo": false, - "parentColumnSpace": 9.1875, - "parentId": "ekq4ry46pv", - "parentRowSpace": 10, - "renderMode": "CANVAS", - "resetOnSubmit": true, - "responsiveBehavior": "fill", - "rightColumn": 9, - "showStepArrows": false, - "topRow": 0, - "type": "INPUT_WIDGET_V2", - "version": 2, - "widgetId": "0k8djo34h7", - "widgetName": "InputTitel" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/Schliessen.json b/pages/Sitzplätze/widgets/SeatCalendar/Schliessen.json deleted file mode 100644 index aae1923..0000000 --- a/pages/Sitzplätze/widgets/SeatCalendar/Schliessen.json +++ /dev/null @@ -1,44 +0,0 @@ -{ - "animateLoading": true, - "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 4, - "boxShadow": "none", - "buttonColor": "{{appsmith.theme.colors.primaryColor}}", - "buttonVariant": "TERTIARY", - "dynamicBindingPathList": [ - { - "key": "buttonColor" - }, - { - "key": "borderRadius" - } - ], - "dynamicTriggerPathList": [ - { - "key": "onClick" - } - ], - "iconName": "cross", - "iconSize": 24, - "isDisabled": false, - "isLoading": false, - "isVisible": true, - "key": "0h513i0hp4", - "leftColumn": 58, - "minWidth": 50, - "mobileBottomRow": 4, - "mobileLeftColumn": 58, - "mobileRightColumn": 64, - "mobileTopRow": 0, - "needsErrorInfo": false, - "onClick": "{{closeModal(SeatCalendar.name);}}", - "parentId": "ekq4ry46pv", - "renderMode": "CANVAS", - "responsiveBehavior": "hug", - "rightColumn": 64, - "topRow": 0, - "type": "ICON_BUTTON_WIDGET", - "version": 1, - "widgetId": "djgr636dvq", - "widgetName": "Schliessen" -} \ No newline at end of file diff --git a/pages/Sitzplätze/widgets/SeatCalendar/SeatCalendar.json b/pages/Sitzplätze/widgets/SeatCalendar/SeatCalendar.json index 1a755b6..f072859 100644 --- a/pages/Sitzplätze/widgets/SeatCalendar/SeatCalendar.json +++ b/pages/Sitzplätze/widgets/SeatCalendar/SeatCalendar.json @@ -1,14 +1,14 @@ { "animateLoading": true, "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 585, + "bottomRow": 575, "boxShadow": "none", "canEscapeKeyClose": true, "canOutsideClickClose": true, "children": [ { "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", - "bottomRow": 560, + "bottomRow": 550, "boxShadow": "{{appsmith.theme.boxShadow.appBoxShadow}}", "canExtend": true, "detachFromLayout": true, @@ -57,7 +57,9 @@ } ], "dynamicHeight": "AUTO_HEIGHT", - "height": 560, + "dynamicPropertyPathList": [], + "dynamicTriggerPathList": [], + "height": 550, "isCanvas": true, "isLoading": false, "key": "u2wwvtyano",