80 lines
3.5 KiB
HTML
80 lines
3.5 KiB
HTML
{% if session['theme'] == 'darkmode' %}
|
|
{% extends "base_dark.html" %}
|
|
{% else %}
|
|
{% extends "base.html" %}
|
|
{% endif %}
|
|
|
|
{% block title %}Termin Planer{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="content-wrapper">
|
|
<div class="form-container" style="max-width: 1000px; padding: 30px;">
|
|
<h2>Termin Planer</h2>
|
|
<div id="calendar" style="margin-top: 20px;">
|
|
<table style="width: 100%; border-collapse: collapse; text-align: center;">
|
|
<thead>
|
|
<tr>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Montag</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Dienstag</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Mittwoch</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Donnerstag</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Freitag</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Samstag</th>
|
|
<th style="padding: 10px; border: 1px solid #ddd;">Sonntag</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for week in calendar %}
|
|
<tr>
|
|
{% for day in week %}
|
|
<td style="padding: 10px; border: 1px solid #ddd; vertical-align: top;">
|
|
<strong>{{ day.date }}</strong>
|
|
<ul style="list-style: none; padding: 0; margin: 10px 0;">
|
|
{% for event in day.events %}
|
|
<li>{{ event.time }} - {{ event.player }}: {{ event.description }} (Für: {{ event.assigned_to }})</li>
|
|
{% endfor %}
|
|
</ul>
|
|
<button onclick="openEventModal('{{ day.date }}')" style="margin-top: 10px;">+ Termin</button>
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="eventModal" style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index: 1000;">
|
|
<h3>Neuen Termin hinzufügen</h3>
|
|
<form method="POST" action="{{ url_for('appointment_scheduler') }}">
|
|
<input type="hidden" name="date" id="eventDate">
|
|
<label for="time">Uhrzeit:</label>
|
|
<input type="time" name="time" id="time" required>
|
|
<br>
|
|
<label for="player">Spieler:</label>
|
|
<input type="text" name="player" id="player" required>
|
|
<br>
|
|
<label for="description">Beschreibung:</label>
|
|
<input type="text" name="description" id="description" required>
|
|
<br>
|
|
<label for="assigned_to">Für:</label>
|
|
<input type="text" name="assigned_to" id="assigned_to" required>
|
|
<br>
|
|
<button type="submit" style="margin-top: 10px;">Speichern</button>
|
|
<button type="button" onclick="closeEventModal()" style="margin-top: 10px;">Abbrechen</button>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
function openEventModal(date) {
|
|
document.getElementById('eventDate').value = date;
|
|
document.getElementById('eventModal').style.display = 'block';
|
|
}
|
|
|
|
function closeEventModal() {
|
|
document.getElementById('eventModal').style.display = 'none';
|
|
}
|
|
</script>
|
|
{% endblock %}
|