Floke/Brancheneinstufung2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[32788f42] Add Termin-Übersicht feature, dynamic Event-Type selection, and refactor QR cards UI into Job Details

Browse Source
This commit is contained in:
Floke
2026-03-21 13:46:26 +00:00
parent c62db8a2ef
commit f72719b9a4
4 changed files with 468 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

156
fotograf-de-scraper/backend/templates/appointment_list.html Normal file
View File

@@ -0,0 +1,156 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Terminübersicht</title>
<style>
@page {
size: A4 portrait;
margin: 20mm;
@bottom-right {
content: "Seite " counter(page) " von " counter(pages);
font-family: Arial, sans-serif;
font-size: 10pt;
color: #666;
}
}
body {
font-family: Arial, sans-serif;
font-size: 11pt;
color: #333;
line-height: 1.4;
}
.header {
display: flex;
justify-content: space-between;
align-items: flex-start;
border-bottom: 2px solid #ddd;
padding-bottom: 10px;
margin-bottom: 20px;
}
.header-text {
flex: 1;
}
.header-logo {
width: 150px;
text-align: right;
}
.header-logo img {
max-width: 100%;
height: auto;
}
h1 {
font-size: 16pt;
margin: 0 0 5px 0;
color: #2c3e50;
}
h2 {
font-size: 14pt;
margin: 0 0 10px 0;
color: #34495e;
}
.date-header {
background-color: #ecf0f1;
padding: 8px 12px;
margin-top: 20px;
margin-bottom: 10px;
font-weight: bold;
font-size: 13pt;
border-left: 4px solid #3498db;
}
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
page-break-inside: auto;
}
tr {
page-break-inside: avoid;
page-break-after: auto;
}
th, td {
border: 1px solid #bdc3c7;
padding: 8px;
text-align: left;
vertical-align: middle;
}
th {
background-color: #f8f9fa;
font-weight: bold;
color: #2c3e50;
}
.time-col { width: 12%; white-space: nowrap; }
.family-col { width: 35%; }
.children-col { width: 15%; text-align: center; }
.consent-col { width: 20%; text-align: center; }
.done-col { width: 18%; text-align: center; }
.empty-row td {
height: 35px; /* ensure enough space for writing */
color: transparent; /* visually hide "Empty" text but keep structure if any */
}
/* The checkbox square */
.checkbox-square {
display: inline-block;
width: 18px;
height: 18px;
border: 1px solid #333;
background-color: #fff;
position: relative;
}
</style>
</head>
<body>
<div class="header">
<div class="header-text">
<h1>{{ job_name }}</h1>
<h2>Terminübersicht ({{ event_type_name }})</h2>
<p>Stand: {{ current_time }}</p>
</div>
<div class="header-logo">
{% if logo_base64 %}
<img src="data:image/png;base64,{{ logo_base64 }}" alt="Logo">
{% endif %}
</div>
</div>
{% for date, slots in grouped_slots.items() %}
<div class="date-header">{{ date }}</div>
<table>
<thead>
<tr>
<th class="time-col">Uhrzeit</th>
<th class="family-col">Familie</th>
<th class="children-col">Kinder</th>
<th class="consent-col">Veröffentlichung</th>
<th class="done-col">Erledigt</th>
</tr>
</thead>
<tbody>
{% for slot in slots %}
<tr class="{% if not slot.booked %}empty-row{% endif %}">
<td class="time-col" style="color: #333;">{{ slot.time_str }}</td>
<td class="family-col">{{ slot.name if slot.booked else '' }}</td>
<td class="children-col">{{ slot.children if slot.booked else '' }}</td>
<td class="consent-col">
{% if slot.booked and slot.consent %}
<span style="font-size: 16pt;">☑</span>
{% elif slot.booked %}
<!-- nein -->
{% else %}
<!-- leer -->
{% endif %}
</td>
<td class="done-col">
<span class="checkbox-square"></span>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endfor %}
</body>
</html>