88 lines
3.6 KiB
HTML
88 lines
3.6 KiB
HTML
<!-- Calendar Section -->
|
|
<section id="calendar-section" class="tab-content">
|
|
<div class="tab-section-shell">
|
|
<div class="d-flex justify-content-between align-items-center mb-3 tab-section-header">
|
|
<h3 class="mb-0">Kalender</h3>
|
|
<div class="d-flex align-items-center gap-2">
|
|
<select id="calendar-location-filter" class="form-select form-select-sm">
|
|
<option value="">alle</option>
|
|
</select>
|
|
{% if admin_enabled %}
|
|
<div class="btn-group" role="group">
|
|
<button id="export-calendar-btn" class="btn btn-outline-secondary btn-sm" title="Kalender als Excel herunterladen">
|
|
Export
|
|
</button>
|
|
<button id="import-calendar-btn" class="btn btn-outline-secondary btn-sm" title="Excel hochladen und Kalender überschreiben">
|
|
Import
|
|
</button>
|
|
</div>
|
|
<button id="add-calendar-entry-btn" class="btn btn-primary" title="Eintrag hinzufügen">
|
|
<i class="bi bi-plus-circle"></i>
|
|
</button>
|
|
<input type="file" id="import-calendar-input" accept=".xlsx" style="display:none">
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tab-section-body">
|
|
<div class="calendar-weekday-header"></div>
|
|
|
|
<div id="calendar-days" class="calendar-grid">
|
|
<!-- Populated via inline script below -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Calendar Modal -->
|
|
<div class="modal fade" id="calendarModal" tabindex="-1" aria-labelledby="calendarModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="calendarModalLabel">Kalendereintrag</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="calendarForm">
|
|
<input type="hidden" id="calendarEntryId">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label for="calendarDate" class="form-label">Datum</label>
|
|
<input type="date" class="form-control" id="calendarDate" required>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label for="calendarTime" class="form-label">Uhrzeit</label>
|
|
<input type="time" class="form-control" id="calendarTime">
|
|
</div>
|
|
</div>
|
|
{% if admin_enabled %}
|
|
<div class="row g-3 mt-1" id="calendarRecurrenceRow">
|
|
<div class="col-md-6">
|
|
<label for="calendarRepeatCount" class="form-label">Anzahl Wiederholung (Wöchentlich)</label>
|
|
<input type="number" class="form-control" id="calendarRepeatCount" min="1" max="52" step="1" value="1">
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
<div class="mt-3">
|
|
<label for="calendarTitle" class="form-label">Titel</label>
|
|
<input type="text" class="form-control" id="calendarTitle" required>
|
|
</div>
|
|
<div class="mt-3">
|
|
<label for="calendarLocation" class="form-label">Ort</label>
|
|
<input type="text" class="form-control" id="calendarLocation">
|
|
</div>
|
|
<div class="mt-3">
|
|
<label for="calendarDetails" class="form-label">Details</label>
|
|
<textarea class="form-control" id="calendarDetails" rows="3"></textarea>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
|
<button type="button" class="btn btn-primary" id="saveCalendarEntryBtn">Speichern</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|