{% extends 'layouts/base.html.twig' %}
{% block title %}Rental index
{% endblock %}

{% block body %}
	{# <div class="row justify-content-center"> #}
	<div class="container position-relative align-items-center">
		<div class="row py-2 bg-light rounded shadow-sm">
			<h1>Locations</h1>
			<div class="col-12 col-md-2 mb-3">
				{{ form_start(form) }}
				<div>
					{{ form_row(form.id) }}
				</div>
				<div class="row">
					<button type="submit" class="btn btn-primary mt-2">Filtrer</button>
				</div>
				{{ form_end(form) }}
			</div>
			<div class="col-12 col-md-10 py-2 bg-light rounded shadow-sm">
				<div class="table-responsive">
					<table class="table table-striped table-bordered">
						<thead class="thead-dark">
							<tr>
								<th scope="col" class="original-col">Locataire</th>
								<th scope="col" class="original-col">Bien</th>
								<th scope="col" class="merged-col">Locataire, Bien</th>
								<th scope="col">
									{{ knp_pagination_sortable(pagination, 'Début', 'start_date') }}
									{% if sortDirection == 'asc' %}
										&uarr;
									{% else %}
										&darr;
									{% endif %}
								</th>
								<th scope="col">
									{{ knp_pagination_sortable(pagination, 'Fin', 'end_date') }}
								</th>
								<th scope="col" class="original-col">Jour de paiement</th>
								<th scope="col" class="original-col">Relance avant échéance</th>
								<th scope="col" class="original-col">Fréquence loyer</th>
								<th scope="col" class="original-col text-end">Loyer mensuel</th>
								<th scope="col">Archivé</th>
								<th scope="col" class="original-col text-center">Actions</th>
								<th scope="col" class="merged-col text-center">#</th>
							</tr>
						</thead>
						{% for rental in pagination %}

							<tbody>
								<tr>
									<td class="original-col">{{ rental.tenant }}</td>
									<td class="original-col">{{ rental.property }}</td>
									<td class="merged-col">{{ rental.tenant }},<br>{{ rental.property }}</td>
									<td>{{ rental.startDate ? rental.startDate|date('d/m/Y') : '' }}</td>
									<td>{{ rental.endDate ? rental.endDate|date('d/m/Y') : '' }}</td>
									<td class="original-col">{{ rental.jourEcheance }}</td>
									<td class="original-col">{{ rental.generationLoyer }}</td>
									<td class="original-col">{{ choicesInv[rental.frequenceLoyer] }}</td>
									<td class="original-col text-end">{{ rental.monthlyRent|number_format(0, '.', ' ') }}</td>
									<td>
										<div class="form-check form-switch">
											<input class="form-check-input" type="checkbox" id="flexSwitchCheckChecked{{ rental.id }}" {% if rental.archived %} checked {% endif %} onclick="toggleArchived({{ rental.id }}, '{{ csrf_token('update_status') }}')">
											<label class="original-col form-check-label" id="flexSwitchLabelChecked{{ rental.id }}">{{ rental.archived ? 'Oui' : 'Non' }}</label>
										</div>
									</td>
									<td class="dropdownButton font-weight-bold fs-3">
										<button class="btn btn-light bi bi-chevron-down"></button>
									</td>
								</tr>
								<tr style="display:none;">
									<td colspan="10">
										{% if is_granted("ROLE_EDITOR") %}
											<a class="btn btn-primary" href="{{ path('app_rental_edit', {'id': rental.id}) }}">Modifier</a>
											<a class="btn btn-primary" href="{{ path('app_contract_create', {'id': rental.id}) }}">Créer contrat</a>
											<form method="post" action="{{ path('app_rental_delete', {'id': rental.id}) }}" onsubmit="return confirm('Êtes-vous sûr de vouloir supprimer cette location ?');">
												<input type="hidden" name="_token" value="{{ csrf_token('delete' ~ rental.id) }}">
												<button class="btn btn-warning">Supprimer</button>
											</form>
										{% endif %}
									</td>
								</tr>
							</tbody>
						{% else %}
							<tr>
								<td colspan="11">
									Aucune location trouvée
									{% if is_granted("ROLE_EDITOR") %}
										<a href="{{ path('app_rental_new') }}">
											<i class="fas fa-plus"></i>Ajouter une location
										</a>
									{% endif %}
								</td>
							</tr>
						{% endfor %}

					</table>
				</div>
				<div class="navigation mt-3">
					{% do pagination.setPageRange(3) %}
					{{ knp_pagination_render(pagination, 'pagination.html.twig') }}
					{# {{ knp_pagination_render(pagination) }} #}
				</div>
				{% if is_granted("ROLE_EDITOR") %}
					<a href="{{ path('app_rental_new') }}" class="btn btn-primary mt-3">Ajouter une location</a>
				{% endif %}

			</div>
		</div>
	</div>
	{# </div> #}
{% endblock %}
{% block javascript %}
	{{ parent() }}
	<script src="{{ asset('assets/js/switcher.js') }}"></script>
	<script src="{{ asset('assets/js/dropdown.js') }}"></script>
{% endblock %}