{% extends 'base.html.twig' %}
{% block title %}
	Catégories articles / prestations
{% endblock %}
{% block body %}
	<div class="wrapper-table">
		<h1>Catégories articles / prestations</h1>
		<a href="{{path('categories-articles_creer')}}" class="btn">
			<i class="fa-solid fa-circle-plus"></i>Ajouter une catégorie d'article / prestation</a>
		{% if categories %}
			<table class="table-level-1">
				<thead>
					<th colspan="2"></th>
					<th>Libellé article / prestation</th>
					<th></th>
				</thead>
				<tbody>
					{% for c in categories %}
						<tr>
							<td class="text-centered">
								<a href="{{path('categories-articles_modifier',{id:c.id})}}">
									<i class="fa-regular fa-pen-to-square"></i>
								</a>
							</td>
							<td class="text-centered">
								<a href="{{path('categories-articles_supprimer',{id:c.id})}}">
									<i class="fa-regular fa-trash-can"></i>
								</a>
							</td>
							<td>{{c.libelle}}</td>
							<td>
								<div>
									<input type="checkbox" class="check" name="check">
									<label for="check">
										<a href="#">
											<i class="fa-regular fa-eye"></i>Voir articles</a>
									</label>
								</div>
							</td>
						</tr>
						{% if c.articles %}
							<tr class="table-level-2"with="100%">
								<td colspan="4">
									<table width="100%">
										<tr colspan="4" style="width:100%;">
											{% for a in c.articles %}
												<tr>
													<td colspan="4" style="width:100%;">
														<a href="{{path('articles_modifier',{id:a.id})}}">{{a.description}}</a>
													</td>
												</tr>
											{% endfor %}
										</tr>
									</table>
								</td>
							</tr>
						{% endif %}
					{% endfor %}
				</tbody>
			</table>
		{% else %}
			<p>Aucune catégorie / prestation n'a encore été enregistrée dans la base.</p>
		{% endif %}
	</div>
	{% block javascripts %}
		<script src="{{asset('assets/js/main.js')}}" type="text/javascript" defer></script>
	{% endblock %}
{% endblock %}