johanleroy/ENI-sortir
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

plein de truc

Browse Source
This commit is contained in:
marvin
2024-11-22 14:10:39 +01:00
parent 22006281cd
commit db38ec2979
11 changed files with 710 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
templates/main/index.html.twig
View File

@@ -1,4 +1,5 @@
{% extends 'main/base.html.twig' %}
{% block head %}
<head>
<meta charset="UTF-8">
@@ -10,13 +11,92 @@
{% endblock %}
{% block content %}
<div class="container mx-auto p-4">
<h1 class="text-2xl font-bold mb-6 text-center">Liste des sorties</h1>
<div class="container mx-auto p-6 bg-gray-50 rounded-lg shadow-lg mt-6">
<h1 class="text-3xl font-bold text-center text-gray-800 mb-8">🎉 Liste des sorties</h1>
<div class="grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-6 gap-6">
<!-- Section de filtre -->
<form method="GET" action="{{ path('home') }}" class="bg-white rounded-lg shadow-md p-4 mb-6">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
<!-- Filtre par nom -->
<div>
<label for="search" class="block text-sm font-medium text-gray-700">🔍 Recherche</label>
<input type="text" name="search" id="search" value="{{ app.request.query.get('search', '') }}"
class="block w-full mt-2 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
placeholder="Nom de la sortie">
</div>
<!-- Filtre par site -->
<div>
<label for="site" class="block text-sm font-medium text-gray-700">📍 Site</label>
<select name="site" id="site" class="block w-full mt-2 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">
<option value="">Tous les sites</option>
{% for site in sites %}
<option value="{{ site.idSite }}" {% if site.idSite == app.request.query.get('site') %}selected{% endif %}>
{{ site.nom }}
</option>
{% endfor %}
</select>
</div>
<!-- Filtre par date de début -->
<div>
<label for="start_date" class="block text-sm font-medium text-gray-700">📅 Date de début</label>
<input type="date" name="start_date" id="start_date" value="{{ app.request.query.get('start_date', '') }}"
class="block w-full mt-2 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">
</div>
<!-- Filtre par date de fin -->
<div>
<label for="end_date" class="block text-sm font-medium text-gray-700">📅 Date de fin</label>
<input type="date" name="end_date" id="end_date" value="{{ app.request.query.get('end_date', '') }}"
class="block w-full mt-2 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">
</div>
</div>
<!-- Cases à cocher -->
<div class="mt-4 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<div class="flex items-center">
<input type="checkbox" name="organisateur" id="organisateur" value="1"
{% if app.request.query.get('organisateur') %}checked{% endif %}
class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500">
<label for="organisateur" class="ml-2 text-sm text-gray-700">Sorties dont je suis l'organisateur/trice</label>
</div>
<div class="flex items-center">
<input type="checkbox" name="inscrit" id="inscrit" value="1"
{% if app.request.query.get('inscrit') %}checked{% endif %}
class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500">
<label for="inscrit" class="ml-2 text-sm text-gray-700">Sorties auxquelles je suis inscrit/e</label>
</div>
<div class="flex items-center">
<input type="checkbox" name="non_inscrit" id="non_inscrit" value="1"
{% if app.request.query.get('non_inscrit') %}checked{% endif %}
class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500">
<label for="non_inscrit" class="ml-2 text-sm text-gray-700">Sorties auxquelles je ne suis pas inscrit/e</label>
</div>
<div class="flex items-center">
<input type="checkbox" name="passees" id="passees" value="1"
{% if app.request.query.get('passees') %}checked{% endif %}
class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500">
<label for="passees" class="ml-2 text-sm text-gray-700">Sorties passées</label>
</div>
</div>
<!-- Bouton soumettre -->
<div class="mt-6 flex justify-end">
<button type="submit" class="px-6 py-2 bg-blue-500 text-white rounded-md shadow hover:bg-blue-600">
🔎 Filtrer
</button>
</div>
</form>
<!-- Affichage des sorties -->
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6 gap-6">
{% for sortie in sorties %}
<div class="bg-white rounded-lg shadow-md p-4">
<h2 class="text-lg font-semibold">{{ sortie.nom }}</h2>
<h2 class="text-lg font-semibold text-gray-800">{{ sortie.nom }}</h2>
<p class="mt-2 text-gray-600">
<strong>Date de début :</strong> {{ sortie.dateHeureDebut|date('d/m/Y H:i') }}<br>
<strong>Durée :</strong> {{ sortie.duree }} minutes<br>
@@ -24,9 +104,11 @@
<strong>Infos :</strong> {{ sortie.infosSortie }}
</p>
<div class="mt-4 flex justify-end">
<a href="#" class="text-blue-500 hover:text-blue-700 font-medium">Voir plus</a>
<a href="{{ path('sortie_view', { id: sortie.idSortie }) }}" class="text-blue-500 hover:text-blue-700 font-medium">Voir plus</a>
</div>
</div>
{% else %}
<p class="text-gray-600 text-center col-span-6">Aucune sortie ne correspond à vos critères.</p>
{% endfor %}
</div>
</div>