Merge branch 'Johan'

This commit is contained in:
Olivier PARPAILLON
2024-11-19 14:03:55 +01:00
7 changed files with 326 additions and 5 deletions

View File

@@ -0,0 +1,119 @@
{% extends 'main/base.html.twig' %}
{% block title %}📣 Sortie.com Admin City 🔊{% endblock %}
{% block content %}
<div class="flex">
{% include 'admin/sidebar.html.twig' %}
<!-- Main Content -->
<div class="ml-64 p-8 w-full">
<h1 class="text-2xl font-semibold mb-4">Gestion des villes</h1>
<!-- Actions: Ajouter -->
<div class="mb-4">
<!-- Bouton pour ouvrir la modale -->
<button id="openModal" class="inline-block bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-700">
Ajouter une ville
</button>
</div>
<!-- Participants Table -->
<div class="overflow-x-auto bg-white rounded shadow">
<table class="min-w-full bg-white divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nom</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Code postal</th>
<th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
{% for city in citys %}
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ city.nom }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ city.codePostal }}</td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a href="{{ path('app_adminCityDelete', {'id': city.idVille}) }}" class="text-red-600 hover:text-red-900 ml-4">Supprimer</a>
</td>
</tr>
{% else %}
<tr>
<td colspan="8" class="px-6 py-4 text-center text-gray-500">Aucune ville trouvée</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<!-- Modale pour ajouter une ville -->
<div id="cityModal" class="fixed inset-0 z-50 hidden bg-gray-900 bg-opacity-50">
<div class="flex justify-center items-center min-h-screen">
<div class="bg-white p-6 rounded shadow-md w-1/3">
<h2 class="text-xl font-semibold mb-4">Ajouter une ville</h2>
<form id="addCityForm" method="POST" action="{{ path('app_adminCityAdd') }}">
<div class="mb-4">
<label for="postalCode" class="block text-sm font-medium text-gray-700">Code postal</label>
<input id="postalCode" name="postalCode" type="text" class="mt-1 block w-full px-4 py-2 border rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label for="citySelect" class="block text-sm font-medium text-gray-700">Sélectionner une ville</label>
<select id="citySelect" name="citySelect" class="mt-1 block w-full px-4 py-2 border rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500" required>
<!-- Options will be populated dynamically based on postal code -->
</select>
</div>
<div class="flex justify-end">
<button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-700">Ajouter</button>
<button type="button" id="closeModal" class="ml-2 bg-gray-500 text-white px-4 py-2 rounded hover:bg-gray-700">Annuler</button>
</div>
</form>
</div>
</div>
</div>
<script>
// Ouvrir la modale
document.getElementById('openModal').addEventListener('click', function() {
document.getElementById('cityModal').classList.remove('hidden');
});
// Fermer la modale
document.getElementById('closeModal').addEventListener('click', function() {
document.getElementById('cityModal').classList.add('hidden');
});
// Fonction pour charger les villes en fonction du code postal en utilisant l'API Carto
document.getElementById('postalCode').addEventListener('input', function() {
const postalCode = this.value;
const citySelect = document.getElementById('citySelect');
if (postalCode.length >= 3) {
// URL de l'API Carto pour récupérer les villes en fonction du code postal
const apiUrl = `https://api-adresse.data.gouv.fr/search/?q=${postalCode}&type=municipality&limit=10`;
fetch(apiUrl)
.then(response => response.json())
.then(data => {
// Clear previous options
citySelect.innerHTML = '';
// Ajouter des nouvelles options de villes dans la liste déroulante
data.features.forEach(feature => {
const option = document.createElement('option');
option.value = feature.properties.label;
option.textContent = feature.properties.label; // Nom de la ville
citySelect.appendChild(option);
});
})
.catch(error => console.error('Erreur:', error));
} else {
// Clear options si le code postal est trop court
citySelect.innerHTML = '';
}
});
</script>
</div>
{% endblock %}

View File

@@ -7,12 +7,12 @@
</a>
</li>
<li>
<a href="#" class="block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded">
<a href="{{ path('app_adminUser') }}" class="block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded">
👤 Utilisateurs
</a>
</li>
<li>
<a href="#" class="block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded">
<a href="{{ path('app_adminCity') }}" class="block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded">
🏙 Villes
</a>
</li>

View File

@@ -0,0 +1,83 @@
{% extends 'main/base.html.twig' %}
{% block title %}&#128227; Sortie.com Admin User &#128266;{% endblock %}
{% block content %}
<div class="flex">
{% include 'admin/sidebar.html.twig' %}
<!-- Main Content -->
<div class="ml-64 p-8 w-full">
<h1 class="text-2xl font-semibold mb-4">Gestion des utilisateurs</h1>
<!-- Actions: Import/Export -->
<div class="flex items-center justify-between mb-4">
<form action="{{ path('participant_import') }}" method="post" enctype="multipart/form-data" class="flex items-center">
<input
type="file"
name="csv_file"
accept=".csv"
class="block w-full text-sm text-gray-500
file:mr-4 file:py-2 file:px-4
file:rounded file:border-0
file:text-sm file:font-semibold
file:bg-gray-800 file:text-white
hover:file:bg-gray-700" />
<button
type="submit"
class="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600">
Importer CSV
</button>
</form>
<a href="{{ path('participant_export') }}" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">
Exporter CSV
</a>
</div>
<!-- Participants Table -->
<div class="overflow-x-auto bg-white rounded shadow">
<table class="min-w-full bg-white divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nom</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Prénom</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Téléphone</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Email</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Administrateur</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actif</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Rôles</th>
<th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
{% for participant in participants %}
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.nom }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.prenom }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.telephone }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.mail }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
{{ participant.administrateur ? 'Oui' : 'Non' }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
{{ participant.actif ? 'Oui' : 'Non' }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
{{ participant.roles|join(', ') }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a href="{{ path('participant_edit', {'id': participant.id}) }}" class="text-indigo-600 hover:text-indigo-900">Modifier</a>
<a href="{{ path('participant_delete', {'id': participant.id}) }}" class="text-red-600 hover:text-red-900 ml-4">Supprimer</a>
</td>
</tr>
{% else %}
<tr>
<td colspan="8" class="px-6 py-4 text-center text-gray-500">Aucun participant trouvé</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% endblock %}

View File

@@ -8,7 +8,7 @@
</head>
<body>
<div class="flex items-center justify-center" style="background-color: #F4F4F4;" >
<div class="flex items-center justify-center" >
ENI &copy; Sortie {{ "now"|date("Y") }}
</div>
</body>