Files
SGTMensa/mensa_app/templates/mensa_app/speiseplan.html
T

93 lines
3.9 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mensa Speiseplan</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-light">
<div class="container mt-5">
<div class="row justify-content-center">
<div class="col-md-8">
<!-- PAGER & DATUM ANZEIGE -->
<div class="card shadow mb-4">
<div class="card-body text-center">
<h2 class="mb-3">Speiseplan für den <br><span class="text-primary">{{ target_date|date:"d.m.Y" }}</span></h2>
<div class="btn-group" role="group" aria-label="Datum Navigation">
<!-- Button Zurück -->
{% if prev_date %}
<a href="?datum={{ prev_date }}" class="btn btn-outline-secondary">&laquo; Vorheriger Tag</a>
{% else %}
<button class="btn btn-outline-light text-muted" disabled>&laquo; Vorheriger</button>
{% endif %}
<!-- Button Heute (Reset) -->
<a href="?" class="btn btn-primary">Heute</a>
<!-- Button Weiter -->
{% if next_date %}
<a href="?datum={{ next_date }}" class="btn btn-outline-secondary">Nächster Tag &raquo;</a>
{% else %}
<button class="btn btn-outline-light text-muted" disabled>Nächster &raquo;</button>
{% endif %}
</div>
</div>
</div>
<!-- TABELLE DER TAGESMENÜS -->
<div class="card shadow mb-4">
<div class="card-header bg-dark text-white">Tagesmenüs</div>
<div class="card-body p-0">
<table class="table table-striped mb-0">
<thead>
<tr>
<th>Gericht</th>
<th>Kategorie</th>
<th>Preis</th>
</tr>
</thead>
<tbody>
{% for menue in menues_day %}
<tr>
<td>{{ menue.gericht.name }}</td>
<td><span class="badge bg-info text-dark">{{ menue.gericht.kategorie.name }}</span></td>
<td>{{ menue.preis|floatformat:2 }} €</td>
</tr>
{% empty %}
<tr>
<td colspan="3" class="text-center py-3 text-muted">Keine Tagesmenüs für diesen Tag geplant.</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<!-- TABELLE DER DAUERANGEBOTE -->
<div class="card shadow">
<div class="card-header bg-success text-white">Immer verfügbar (Dauerangebote)</div>
<div class="card-body p-0">
<ul class="list-group list-group-flush">
{% for gericht in dauerangebote %}
<li class="list-group-item d-flex justify-content-between align-items-center">
{{ gericht.name }}
<span class="badge bg-success rounded-pill">Verfügbar</span>
</li>
{% empty %}
<li class="list-group-item text-muted">Momentan keine Dauerangebote.</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</div>
</body>
</html>