108 lines
6.7 KiB
HTML
108 lines
6.7 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Terminplaner - Inventarsystem{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container py-4">
|
|
<div class="row justify-content-center">
|
|
<div class="col-12 col-lg-11 col-xl-10">
|
|
<section class="p-4 p-md-5 rounded-4 shadow-lg" style="background: linear-gradient(135deg, rgba(15,76,92,0.96), rgba(22,105,122,0.92)); color: #fff;">
|
|
<div class="d-flex flex-column flex-lg-row justify-content-between gap-4 align-items-start align-items-lg-end">
|
|
<div>
|
|
<p class="text-uppercase fw-semibold mb-2" style="letter-spacing: .12em; opacity: .8;">Terminplaner</p>
|
|
<h1 class="display-6 fw-bold mb-3">Reservierungen und Termine übersichtlich verwalten</h1>
|
|
<p class="lead mb-0" style="max-width: 60ch; opacity: .95;">Erstellen Sie neue Terminreihen, teilen Sie Buchungslinks und öffnen Sie den Kalender für bestehende Reservierungen.</p>
|
|
</div>
|
|
<div class="d-flex flex-wrap gap-2">
|
|
<a class="btn btn-light btn-lg fw-semibold" href="{{ url_for('terminplaner.configure', tenant=tenant_id) }}">Neue Planung</a>
|
|
<a class="btn btn-outline-light btn-lg fw-semibold" href="{{ url_for('terminplan', tenant=tenant_id) }}">Kalender öffnen</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="row g-4 mt-1">
|
|
<div class="col-12 col-md-4">
|
|
<div class="card h-100 shadow-sm border-0 rounded-4">
|
|
<div class="card-body p-4">
|
|
<div class="display-6 mb-3">🗓️</div>
|
|
<h2 class="h4 fw-bold">Kalender</h2>
|
|
<p class="mb-4 text-muted">Sehen Sie vorhandene Termine, ihre Auslastung und die aktuellen Reservierungen im Kalender.</p>
|
|
<a class="btn btn-primary w-100" href="{{ url_for('terminplan', tenant=tenant_id) }}">Zum Kalender</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-md-4">
|
|
<div class="card h-100 shadow-sm border-0 rounded-4">
|
|
<div class="card-body p-4">
|
|
<div class="display-6 mb-3">✍️</div>
|
|
<h2 class="h4 fw-bold">Neue Planung</h2>
|
|
<p class="mb-4 text-muted">Erstellen Sie einen neuen Terminplan und verschicken Sie den Buchungslink an Ihre Zielgruppe.</p>
|
|
<a class="btn btn-outline-primary w-100" href="{{ url_for('terminplaner.configure', tenant=tenant_id) }}">Konfiguration öffnen</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-md-4">
|
|
<div class="card h-100 shadow-sm border-0 rounded-4">
|
|
<div class="card-body p-4">
|
|
<div class="display-6 mb-3">🔗</div>
|
|
<h2 class="h4 fw-bold">Buchungslink</h2>
|
|
<p class="mb-4 text-muted">Die öffentliche Buchungsseite liegt unter dem jeweiligen Terminlink und kann direkt an Teilnehmende weitergegeben werden.</p>
|
|
<div class="small text-muted">Die Buchungsseite wird aus dem Terminplan automatisch erzeugt.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% if current_user %}
|
|
<div class="mt-4 p-4 rounded-4 bg-white shadow-sm">
|
|
<h2 class="h5 fw-bold mb-2">Angemeldet als {{ current_user }}</h2>
|
|
<p class="mb-0 text-muted">Sie können Termine anlegen, den Kalender prüfen und Buchungslinks verteilen.</p>
|
|
</div>
|
|
|
|
<div class="mt-4 p-4 rounded-4 bg-white shadow-sm">
|
|
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2 mb-3">
|
|
<h2 class="h5 fw-bold mb-0">Kommende Termine</h2>
|
|
<span class="text-muted small">Alle offenen Terminpläne dieses Nutzers</span>
|
|
</div>
|
|
|
|
{% if upcoming_events %}
|
|
<div class="vstack gap-3">
|
|
{% for event in upcoming_events %}
|
|
<div class="border rounded-3 p-3">
|
|
<div class="d-flex flex-column flex-lg-row justify-content-between gap-3">
|
|
<div>
|
|
<div class="fw-semibold">{{ event.date_start }} bis {{ event.date_end }}</div>
|
|
<div class="text-muted small">ID: {{ event.appointment_id }}</div>
|
|
{% if event.time_span %}
|
|
<div class="small mt-1">Zeitfenster: {{ event.time_span|join(' | ') }}</div>
|
|
{% endif %}
|
|
{% if event.note %}
|
|
<div class="small mt-1 text-muted">Notiz: {{ event.note }}</div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="text-lg-end">
|
|
<div class="small mb-2">Gebucht: <strong>{{ event.slots_booked }}</strong> / {{ event.slots_total }} | Frei: <strong>{{ event.slots_left }}</strong></div>
|
|
<div class="d-flex flex-wrap gap-2 justify-content-lg-end">
|
|
<a class="btn btn-sm btn-primary" href="{{ event.link }}" target="_blank" rel="noopener">Client-Link öffnen</a>
|
|
{% if event.calendar_link %}
|
|
<a class="btn btn-sm btn-outline-primary" href="{{ event.calendar_link }}">.ics</a>
|
|
{% endif %}
|
|
<form method="post" action="{{ url_for('terminplaner.delete_appointment', appointment_id=event.appointment_id, tenant=tenant_id) }}" class="d-inline" onsubmit="return confirm('Diesen Terminplan wirklich löschen?');">
|
|
<button type="submit" class="btn btn-sm btn-outline-danger">Entfernen</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="text-muted">Keine kommenden Termine gefunden.</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|