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

{% block title %}Accueil
{% endblock %}

{% block stylesheets %}
	{{ parent() }}
	<link
	href='fullcalendar/main.css' rel='stylesheet'/>
	{# <link rel="stylesheet" href="{{ asset('css/dom.css') }}"> #}
	<link href="https://cdn.jsdelivr.net/npm/@fullcalendar/core@4.2.0/main.min.css" rel="stylesheet"/>
{% endblock %}

{% block javascripts %}
	{{ parent() }}
	<script src='fullcalendar/main.js'></script>
	<script src='fullcalendar/calendar-week.js' type='module'></script>
{% endblock %}


{% block body %}

	{% for message in app.flashes('success') %}
		<div class="alert alert-success">
			{{ message }}
		</div>
	{% endfor %}

	<!-- Modal -->
	<div class="calendar" id='calendar-week'></div>

	<div class='ATmodal'></div>

	{# {{ include('partials/modal.html.twig') }} #}
	{# {{ include('partials/modal_add_task.html.twig') }} #}

	<h2 class="font-weight-bold">Mes tâches récentes</h2>


	{% for key, taskList in recentTasksList %}
		{% if taskList is not null and taskList is not empty %}
			<h3 class="text-muted text-title">{{ key }}</h3>
			{% for tache in taskList %}

				<a data-bs-toggle="modal" data-bs-target="#divTacheDetailModal-{{tache.id}}">
					<div class="main-block-task">

						<div class="tache-block {% if tache.status == "NF" %} tache-block-af {% elseif tache.status == "EC" %} tache-block-ec {% else %} tache-block-ft tache-color-ft {% endif %}">
							<div class="div-titre">
								{% if tache.client %}
									<div class="black-task-client">
										<h5>{{ tache.client.name}}</h5>
									</div>
								{% else %}
									<div class="black-task-client">
										<h5>{{ tache.title}}</h5>
									</div>
								{% endif %}

								<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 %}
		{% endif %}
	{% endfor %}

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


	<!-- Modal -->
	{% for tache in recentTasks %}
		<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="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>
	{% endfor %}
{% endblock %}