<!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 Business</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
	<th:block layout:fragment="content">
		<div class="mainpage">
			<div class="container" style="max-width: 100%" sec:authorize="hasRole('business_outlay')">
				<div class="alert alert-danger" th:unless="${bean}">Die Bearbeitung der Abrechnung ist nur dem Auslegenden erlaubt.</div>
				<form th:action="@{/business/outlay/save}" th:object="${bean}" method="post" th:if="${bean}">
					<input type="hidden" th:field="*{id}" />
					<div class="row g-2">
						<div class="col-lg-1 col-md-2 col-sm-12">Auslegender</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<input type="text" th:field="*{provider}" class="form-control" readonly="readonly" />
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Händler / Shop</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<span class="error" th:each="error : ${#fields.errors('trader')}">[[${error}]]<br /></span> <input type="text" th:field="*{trader}" class="form-control" />
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Freizeit</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<span class="error" th:each="error : ${#fields.errors('fkCamp')}">[[${error}]]<br /></span> <select id="inputCamp" th:field="*{fkCamp}"
								th:class="${'form-select ' + (#fields.hasErrors('fkCamp') ? 'inputerror' : '')}">
								<option value="">--- bitte wählen ---</option>
								<option th:each="l : ${camps}" th:value="${l.id}" th:text="${l.campname}"></option>
							</select>
							<script type="text/javascript">
								$(document).ready(function() {
									$("#inputCamp").select2();
								});
							</script>
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Betrag</div>
						<div class="col-lg-10 col-md-9 col-sm-11">
							<span class="error" th:each="error : ${#fields.errors('cash')}">[[${error}]]<br /></span> <input type="number" step="0.01" th:field="*{cash}" class="form-control" />
						</div>
						<div class="col-lg-1 col-md-1 col-sm-1 h3">€</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Tag / Uhrzeit</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<input type="datetime-local" th:field="*{buydate}" class="form-control" step="1" />
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Kassenzettelnummer</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<input type="text" th:field="*{recipenumber}" class="form-control" />
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Kurzbeschreibung</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<textarea th:field="*{ingredients}" class="form-control"></textarea>
						</div>
						<div class="col-lg-1 col-md-2 col-sm-12">Bemerkungen</div>
						<div class="col-lg-11 col-md-10 col-sm-12">
							<textarea th:field="*{recipenote}" class="form-control"></textarea>
						</div>
						<div class="col-12 text-center">
							<button type="submit" class="btn btn-success">Speichern</button>
							<a th:href="@{/business/outlay}" class="btn btn-outline-secondary">Abbrechen</a>
							<button type="button" class="btn btn-outline-danger" th:if="${bean.id}" data-bs-toggle="modal" data-bs-target="#deleteModal">Löschen</button>
							<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
							  <div class="modal-dialog">
							    <div class="modal-content">
							      <div class="modal-header alert alert-danger">
							        <h1 class="modal-title fs-5" id="deleteModalLabel">Löschen der Abrechnung</h1>
							        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
							      </div>
							      <div class="modal-body">
							        Willst du wirklich diesen Eintrag mit einem Betrag von <span th:text="${#numbers.formatDecimal(bean.cash, 1, 2, 'COMMA')}"></span> € löschen? Diese Daten gehen dauerhaft verloren.
							      </div>
							      <div class="modal-footer">
							        <a th:href="@{/business/outlay/delete/{id}(id=${bean.id})}" class="btn btn-danger">endgültig löschen</a>
							        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">abbrechen</button>
							      </div>
							    </div>
							  </div>
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</th:block>
</body>
</html>