Add subscription functionality
This commit is contained in:
134
new-registration-app/templates/subscribe.html
Normal file
134
new-registration-app/templates/subscribe.html
Normal file
@@ -0,0 +1,134 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row mt-4">
|
||||
<!-- Left column: subscription form -->
|
||||
<div class="col-12 col-lg-6">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col">
|
||||
<div class="card shadow-sm mt-4">
|
||||
<div class="card-header bg-primary text-white">
|
||||
<h1 class="fs-5 mb-0">Dauerhafte Anmeldung zu allen Kochabenden</h1>
|
||||
</div>
|
||||
|
||||
<form action="/subscribe" method="POST">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
Mit einer dauerhaften Anmeldung kannst du dich/euch für alle zukünftigen Kochabende
|
||||
anmelden. Es ist möglich
|
||||
diese Anmeldung auf bestimmte Wochentage zu beschränken.
|
||||
</p>
|
||||
<p>
|
||||
Dauerhafte Anmeldungen werden eine Woche vor einem Kochabend als Anmeldungen für diesen
|
||||
Abend eingetragen. Danach
|
||||
können sie auch noch gelöscht bzw. bearbeitet werden.
|
||||
</p>
|
||||
<!-- Household selection -->
|
||||
<div class="mb-3">
|
||||
<select name="household" class="form-select" required>
|
||||
<option value="" disabled selected hidden>Wer?</option>
|
||||
{% for household in households %}
|
||||
<option value="{{household.id}}">{{household.name}}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<p class="text-muted">
|
||||
Wenn dein Haushalt hier nicht auswählbar ist, besteht bereits eine dauerhafte Anmeldung.
|
||||
Um Änderungen vorzunehmen, lösche die bestehende Anmeldung und lege eine neue an.
|
||||
</p>
|
||||
|
||||
<!-- Person counts -->
|
||||
<div class="row g-3 mb-3">
|
||||
<div class="col">
|
||||
<label for="InputAdults" class="form-label">Anzahl Erwachsene</label>
|
||||
<input name="numAdults" id="InputAdults" type="number" class="form-control"
|
||||
aria-label="Anzahl Erwachsene" min="0" step="1" inputmode="numeric">
|
||||
</div>
|
||||
<div class="col">
|
||||
<label for="InputKids" class="form-label">Anzahl Kinder >7</label>
|
||||
<input name="numKids" id="InputKids" type="number" class="form-control"
|
||||
aria-label="Anzahl Kinder >7" min="0" step="1" inputmode="numeric">
|
||||
</div>
|
||||
<div class="col">
|
||||
<label for="InputSmallKids" class="form-label">Anzahl Kinder <7</label>
|
||||
<input name="numSmallKids" id="InputSmallKids" type="number" class="form-control"
|
||||
aria-label="Anzahl Kinder <7" min="0" step="1" inputmode="numeric">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Days of the week -->
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Wochentage auswählen (optional)</label>
|
||||
<p class="text-muted small mb-2">
|
||||
Wenn du nur an bestimmten Tagen teilnehmen möchtest, wähle sie hier aus.
|
||||
</p>
|
||||
<div class="d-flex flex-wrap gap-3">
|
||||
{% set days = ["Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag",
|
||||
"Sonntag"] %}
|
||||
{% for day in days %}
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" name="days" value="{{loop.index}}"
|
||||
id="day-{{loop.index}}">
|
||||
<label class="form-check-label" for="day-{{loop.index}}">
|
||||
{{day}}
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="card-footer d-flex justify-content-end gap-2">
|
||||
<button type="submit" class="btn btn-primary">Dauerhaft anmelden</button>
|
||||
<a href="/" class="btn btn-secondary">Abbrechen</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right column: existing registrations -->
|
||||
<div class="col-12 col-lg-6 mt-4 mt-lg-0">
|
||||
<p class="h4 m-2">Bestehende dauerhafte Anmeldungen</p>
|
||||
{% if subscriptions | length == 0 %}
|
||||
<p class="m-2">Es gibt noch keine dauerhaften Anmeldungen</p>
|
||||
{% else %}
|
||||
{% for sub in subscriptions %}
|
||||
<div class="card mb-2">
|
||||
<div class="card-body py-2 px-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<h6 class="mb-0">{{ sub.household.name }}</h6>
|
||||
<a href="/subscribe/{{sub.household.id}}/delete" class="text-danger">
|
||||
<i class="bi bi-trash"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="row g-2">
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Erwachsene</div>
|
||||
<div class="fw-bold small">{{ sub.num_adult_meals }}</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Kinder</div>
|
||||
<div class="fw-bold small">{{ sub.num_children_meals }}</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Kleinkinder</div>
|
||||
<div class="fw-bold small">{{ sub.num_small_children_meals }}</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Tage</div>
|
||||
<div class="fw-bold small">{{ sub.day_string_de() }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user