Enhance event registration system:
- Update Google Sheets integration to support optional tab names. - Add functionality to fetch and display public participants. - Revise event configuration in YAML for clarity and consistency. - Improve form layout with additional fields for contact information and meal preferences. - Create a new home page template for event selection. - Update success page to link back to the participants list.
This commit is contained in:
parent
f83a061e39
commit
c160446eac
6 changed files with 219 additions and 42 deletions
|
|
@ -94,9 +94,13 @@
|
|||
<input type="text" class="form-control" name="land" value="Nederland">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Telefoon (06)</label>
|
||||
<label class="form-label">Telefoon (Mobiel)</label>
|
||||
<input type="text" class="form-control" name="telefoonmobiel" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Telefoon (Vast)</label>
|
||||
<input type="text" class="form-control" name="telefoonvast">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Email</label>
|
||||
<input type="email" class="form-control" name="email" required>
|
||||
|
|
@ -111,6 +115,19 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Eten & Drinken -->
|
||||
<h4 class="section-title mt-4">Eten & Drinken</h4>
|
||||
<div class="row g-3 mb-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Aantal personen Buffet (Zaterdag)</label>
|
||||
<input type="number" class="form-control" name="buffet" min="0" placeholder="0">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Aantal personen Ontbijt (Zondag)</label>
|
||||
<input type="number" class="form-control" name="ontbijt" min="0" placeholder="0">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="form-label">Opmerkingen</label>
|
||||
<textarea class="form-control" name="opmerkingen" rows="3"></textarea>
|
||||
|
|
@ -134,6 +151,45 @@
|
|||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Participants List Section -->
|
||||
<div class="form-card mt-5" id="deelnemers">
|
||||
<h3 class="section-title">Huidige Deelnemers</h3>
|
||||
|
||||
{% if participants|length > 0 %}
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<th>Klasse</th>
|
||||
<th>Zeilnr</th>
|
||||
<th>Bootnaam</th>
|
||||
<th>Type</th>
|
||||
<th>Schipper</th>
|
||||
<th>Vereniging</th>
|
||||
<th>Plaats</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for p in participants %}
|
||||
<tr>
|
||||
<td>{{ p.klasse }}</td>
|
||||
<td>{{ p.zeilnummer }}</td>
|
||||
<td>{{ p.bootnaam }}</td>
|
||||
<td>{{ p.boottype }}</td>
|
||||
<td>{{ p.naam }}</td>
|
||||
<td>{{ p.vereniging }}</td>
|
||||
<td>{{ p.plaats }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{% else %}
|
||||
<p class="text-center text-muted">Er zijn nog geen inschrijvingen.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
|
|
|||
51
templates/home.html
Normal file
51
templates/home.html
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Zeilwedstrijden Inschrijving</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<style>
|
||||
.event-card {
|
||||
transition: transform 0.2s;
|
||||
cursor: pointer;
|
||||
}
|
||||
.event-card:hover {
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-light">
|
||||
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center text-center mb-5">
|
||||
<div class="col-lg-8">
|
||||
<h1 class="display-4 fw-bold text-primary">Wedstrijd Inschrijvingen</h1>
|
||||
<p class="lead text-muted">Kies hieronder de wedstrijd waarvoor je je wilt inschrijven.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-4 justify-content-center">
|
||||
<!-- Loop through the events defined in events.yaml -->
|
||||
{% for slug, data in events.items() %}
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card h-100 shadow-sm event-card border-0">
|
||||
<div class="card-body p-4 text-center">
|
||||
<div class="mb-3">
|
||||
<!-- Simple Icon using Bootstrap Icons (SVG) or just text -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" fill="#0d6efd" class="bi bi-water" viewBox="0 0 16 16">
|
||||
<path d="M.036 3.314a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .354.928l-1.757.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.757-.703a.5.5 0 0 1-.278-.65zm0 3a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .354.928l-1.757.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.757-.703a.5.5 0 0 1-.278-.65z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="card-title h4">{{ data.title }}</h3>
|
||||
<p class="card-text text-muted mb-4">{{ data.description }}</p>
|
||||
<a href="/{{ slug }}" class="btn btn-primary w-100">Inschrijven →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -13,7 +13,10 @@
|
|||
<p class="lead">Je inschrijving voor <strong>{{ event.title }}</strong> is ontvangen.</p>
|
||||
<p>De gegevens zijn opgeslagen.</p>
|
||||
<hr>
|
||||
<a href="https://docs.google.com/spreadsheets/d/{{ event.sheet_id }}" target="_blank" class="btn btn-outline-success">Bekijk deelnemers (Google Sheets)</a>
|
||||
<!-- Link back to the form page, scrolled down to the list -->
|
||||
<a href="/{{ slug }}#deelnemers" class="btn btn-primary">Bekijk deelnemerslijst</a>
|
||||
<br><br>
|
||||
<a href="/" class="btn btn-link text-muted">Terug naar overzicht</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue