<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" layout:decorate="~{template}" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head>
<title>Camp Organizer Confirmation</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
	<th:block layout:fragment="content">
		<div sec:authorize="hasRole('registrator')" style="margin: 8px">
			<div class="btn-group" role="group">
				<a class="btn btn-outline-primary" role="button" th:href="@{/confirmation/board/download/{id}(id=${campId})}"><i class="fas fa-download"></i>&nbsp;alles als CSV exportieren</a>
			</div>
			<br />
			<table id="table" class="table table-striped">
				<thead>
					<tr>
						<th>Bezahlt</th>
						<th>Vorname</th>
						<th>Nachname</th>
						<th>Adresse</th>
						<th>Kontakt</th>
						<th>Gruppe</th>
						<th>Geburtsdatum</th>
						<th>Status</th>
						<th>angemeldet</th>
						<th>Foto</th>
						<th>Kommentar</th>
					</tr>
				</thead>
				<tbody>
					<tr th:each="p : ${persons}">
						<td th:text="${#strings.replace(#numbers.formatCurrency(p.paid), '¤', '€')}"></td>
						<td th:text="${p.forename}"></td>
						<td th:text="${p.surname}"></td>
						<td><div th:text="${p.street}"></div> <span th:text="${p.zip}"></span>&nbsp;<span th:text="${p.city}"></span></td>
						<td><div th:text="'Tel.: ' + ${p.phone}"></div>
							<div th:text="${p.email}"></div></td>
						<td><div th:text="${p.sex}"></div>
							<div th:text="${p.camprolle}"></div></td>
						<td><div th:text="${#temporals.format(p.birthDate, 'dd.MM.yyyy')}"></div>
							<div th:text="${p.getAge(campStartDate)} + ' Jahre'"></div></td>
						<td th:text="${p.progress}"></td>
						<td th:text="${#temporals.format(p.created, 'dd.MM.yyyy HH:mm')}"></td>
						<td><span th:text="${p.consentCatalogPhoto ? 'ja' : 'nein'}" th:if="${p.consentCatalogPhoto}"></span></td>
						<td th:text="${p.comment}"></td>
					</tr>
				</tbody>
			</table>
			<script type="text/javascript">
				$(document).ready(function() {
					$("#table").DataTable({
						language : locale_de
					});
				});
			</script>
		</div>
	</th:block>
</body>
</html>