{% extends 'base.html.twig' %}

{% block title %}Les tâches{% endblock %}


{% block body %}


	{% include "partials/_filter.html.twig" with { form: form } only %}

	{% if pagination.items is empty %}
		<h3 class="display-4 fs-3">Aucun résultat trouvé</h3>
	{% endif %}


	<section class="section-show-all-tasks">
		{% for tache in pagination.items %}
			<a data-bs-toggle="modal" data-bs-target="#divTacheDetailModal-{{tache.id}}">
				<div class="main-block-task">
					<div {% if tache.status == "NF" %} class="tache-block tache-block-af " {% elseif tache.status == "EC" %} class="tache-block tache-block-ec " {% else %} class="tache-block tache-block-ft tache-color-ft" {% endif %}>
						<div class="div-titre">
							<div class="black-task-client">
								<h5>
									{% if tache.client %}
										{{ tache.client.name}}
									{% else %}
										{{ tache.title}}
									{% endif %}
								</h5>
							</div>
							<div class="block-task-description">
								<p>{{ tache.description }}</p>
							</div>
						</div>
					</div>
					<div class="block-acteur d-grid {% if tache.status == "NF" %} tache-block-af {% elseif tache.status == "EC" %} tache-block-ec {% else %} tache-block-ft tache-color-ft {% endif %}">
						{% for userAttr in tache.usersAttr %}
							<div class="block-task-acteur d-grid">
								{{ userAttr }}
							</div>
						{% endfor %}
					</div>
				</div>
			</a>
		{% endfor %}

		<!-- Modal -->
		{% for tache in pagination.items %}
			<div class="modal fade" id="divTacheDetailModal-{{tache.id}}" tabindex="-1" aria-labelledby="divTacheDetailModalLabel-{{tache.id}}" aria-hidden="true">
				<div class="modal-dialog-centered modal-dialog">
					<div class="modal-content">
						<div class="btn-div-modal">
							<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
						</div>
						<div class="task-detail">
							<div class="text-uppercase text-center mb-3" id="name_client">
								{{ tache.client }}
							</div>
							<div class="modal__body_content">
								<div class="task-detail-attribue div-detail">
									<h6 class="task-detail-title">Attribué à:</h6>
									{% for userAttr in tache.usersAttr %}
										<span class="badge badge-dark">{{ userAttr }}</span>
									{% endfor %}
								</div>
								{% if tache.client %}
									<div class="task-detail-adresse div-detail">
										<h6 class="task-detail-title">Adresse:</h6>
										<a href="https://maps.google.com/maps?q={{ tache.client.adresse }}" target="_blank">
											{{ tache.client.adresse }}
										</a>
									</div>
								{% endif %}
								<div class="task-detail-description div-detail">
									<h6 class="task-detail-title">Description:</h6>
									<p>{{ tache.description }}</p>
								</div>
								<div class="image-file div-detail">
									<h6 class="task-detail-title">Pièces jointes:</h6>
									{% if tache.image == null %}
										<p>Aucune pièce jointe</p>
									{% else %}
										<img src="{{ vich_uploader_asset(tache, 'imageFile') }}" alt="task-image" class="w-25">
									{% endif %}
								</div>
								<div class="div-detail">
									<h6 class="task-detail-title">Status:</h6>
									{% if tache.Status == "NF" %}
										<div class="modal__task_status modal__task_status_nf"></div>
									{% elseif tache.Status == "EC" %}
										<div class="modal__task_status modal__task_status_ec"></div>
									{% else %}
										<div class="modal__task_status modal__task_status_ft"></div>
									{% endif %}
								</div>

								<div class="task-detail-more div-detail">
									<h6 class="task-detail-title">Urgent:</h6>
									{% if tache.isUrgent %}
										<span class="badge badge-danger">Oui</span>
									{% else %}
										<span class="badge badge-secondary">Non</span>
									{% endif %}
								</div>
								
								<div class="task-detail-more div-detail">
									<h6 class="task-detail-title">A facturer:</h6>
									{% if tache.toCharge %}
										<span class="badge badge-danger">Oui</span>
									{% else %}
										<span class="badge badge-secondary">Non</span>
									{% endif %}
								</div>

								<div class="task-detail-commentaire div-detail">
									<h6 class="task-detail-title">Commentaire:</h6>
									<p>{{ tache.commentaire }}</p>
								</div>

								<div class="task-detail-footer">
									<a href="{{ path('tache-detail' , {'id' : tache.id} ) }}" type="button" class="btn btn-secondary">Voir</a>
									<a href="{{ path('tache-edit' , {'id' : tache.id} ) }}" type="button" class="btn btn-primary">Modifier</a>
									<a href="{{ path('tache-deactivate', { 'id': tache.id }) }}" onclick="return confirm('Etes-vous sûr de vouloir supprimer la tâche ?')" type="button" class="btn btn-danger">
										<i class="fa-solid fa-trash"></i>
									</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		{% endfor %}
	</section>

	<a class="add-task" href="{{ path('nouvelle_tache') }}">
		<i class="fa-solid fa-circle-plus"></i>
	</a>

	<div class="pagination">
		{{ knp_pagination_render(pagination) }}
	</div>

	<div>
		<div class="show-task-status">
			<div class="div-status tache-fait">
				<div class="filter-btn-tache-realise">Réalisée</div>
			</div>
			<div class="div-status tache-en-cours">
				<div class="filter-btn-tache-en-cours">En cours</div>
			</div>
			<div class="div-status tache-non-fait">
				<div class="filter-btn-tache-non-fait">Non-fait</div>
			</div>
		</div>
	</div>


{% endblock %}