{% extends "geolocale/geolocale.html.twig" %}
{% block title %}
	Géo FUH | BO
{% endblock %}

{% block section %}
	<div class="tab-pane fade show active" id="dances" role="tabpanel">
		<div class="card">
			<div class="card-body">
				<h5 class="card-title">Fuseaux Horaires</h5>

				<table>
					<table class="table table-striped">
						<thead>
							<tr>
								<th>Code</th>
								<th>Décalage</th>
								<th>Description</th>
								<th class="text-center">Actions</th>
							</tr>
						</thead>
						<tbody>

							{% for f in fuseaux %}
								<tr>
									<td>{{f.fuhCode}}</td>
									<td>GMT
										{{ f.fuhValeur }}</td>
									<td>{{ f.fuhDescription }}</td>
									<td class="table-action text-center">
										<a href="{{path('geolocale_fuseau_horaires_edit', {"id":f.fuhId})}}">
											<i class="align-middle text-primary" data-feather="edit-2"></i>
										</a>

									</td>
								</tr>
							</a>

						{% endfor %}
					</tbody>
				</table>

				{% include "components/_paginationApi.html.twig" %}

			</div>
			<div class="card-header">
				<h4 class="card-title">
					Créer un fuseau horaire</h4>
			</div>
			<div class="col-md-10 mx-auto p-4">
				<form action="{{path('geolocale_fuseau_horaires_create')}}" method="POST">
					<div class="row g-2">
						<div class="col-md-6">
							<div class="form-floating">
								<input type="text" name="form[fuhCode]" class="form-control" id="input-fuhCode" placeholder="fuhCode">
								<label for="input-fuhCode">Code</label>
							</div>
						</div>
						<div class="col-md-6">
							<div class="form-floating">
								<input type="integer" name="form[fuhValeur|float]" class="form-control" id="input-fuhValeur" placeholder="Valeur ...">
								<label for="input-fuhValeur">Valeur</label>
							</div>
						</div>
						<div class="col-md-6">
							<div class="form-floating">
								<input type="text" name="form[fuhDescription]" class="form-control" id="input-fuhDescription" placeholder="Description ...">
								<label for="input-fuhDescription">Description</label>
							</div>
						</div>
						<div class="col-md-12 text-center">
							<button class="btn btn-success btn-lg" type="submit">
								Créer ce fuseau horaire
							</button>
						</div>
					</div>
				</form>
			</div>
		</div>

	</div>
{% endblock %}