a lot of ui and flash message. Useless af
This commit is contained in:
Olivier PARPAILLON
@@ -11,8 +11,13 @@
|
||||
<h1 class="text-2xl font-semibold mb-4">Gestion des utilisateurs</h1>
|
||||
|
||||
<!-- Actions: Import/Export -->
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<div class="flex flex-row items-center mb-4">
|
||||
<form action="{{ path('participant_import') }}" method="post" enctype="multipart/form-data" class="flex items-center">
|
||||
<button
|
||||
type="submit"
|
||||
class="bg-green-500 text-white mr-4 px-4 py-2 rounded hover:bg-green-600">
|
||||
Importer CSV
|
||||
</button>
|
||||
<input
|
||||
type="file"
|
||||
name="csv_file"
|
||||
@@ -23,78 +28,75 @@
|
||||
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>
|
||||
<button
|
||||
id="openModal"
|
||||
class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700">
|
||||
class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700 items-end justify-end">
|
||||
Ajouter un utilisateur
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">
|
||||
<a href="{{ path('participant_export') }}">Exporter CSV</a>
|
||||
</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">Prénom</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Pseudo</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Site</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 %}
|
||||
{% if not participant.pending %}
|
||||
<form method="POST" action="{{ path('participant_export') }}">
|
||||
<button type="submit" class="bg-blue-500 text-white px-4 py-2 mb-4 rounded hover:bg-blue-600">
|
||||
<a href="{{ path('participant_export') }}">Exporter CSV</a>
|
||||
</button>
|
||||
<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>
|
||||
<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.pseudo }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.site ? participant.site.nom : "N/A" }}</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.email }}</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="flex flex-row px-6 py-4 whitespace-nowrap items-center font-medium">
|
||||
<a href="{{ path('app_adminUserDisable', {'id': participant.idParticipant}) }}" class="items-centerp pr-4">
|
||||
<img src="{{ participant.actif ? asset('img/user-able.svg') : asset('img/user-disable.svg') }}" alt="Logo" height="32px" width="32px">
|
||||
</a>
|
||||
<a href="{{ path('app_adminUserDelete', {'id': participant.idParticipant}) }}" class="items-center">
|
||||
<img src="{{ asset('img/user-delete.svg') }}" alt="Logo" height="32px" width="32px">
|
||||
</a>
|
||||
</td>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"><input type="checkbox" id="selectAll" /></th>
|
||||
<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">Pseudo</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Site</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>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="8" class="px-6 py-4 text-center text-gray-500">Aucun participant trouvé</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-gray-200">
|
||||
{% for participant in participants %}
|
||||
{% if not participant.pending %}
|
||||
<tr>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><span><input type="checkbox" value="{{ participant.idParticipant }}" name="userList[]"></span></td>
|
||||
<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.pseudo }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ participant.site ? participant.site.nom : "N/A" }}</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.email }}</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 ? '❌' : '✔️' }}
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
|
||||
{{ participant.roles|join(', ') }}
|
||||
</td>
|
||||
<td class="flex flex-row px-6 py-4 whitespace-nowrap items-center font-medium">
|
||||
<a href="{{ path('app_adminUserDisable', {'id': participant.idParticipant}) }}" class="items-centerp pr-4">
|
||||
<img src="{{ participant.actif ? asset('img/user-able.svg') : asset('img/user-disable.svg') }}" alt="Logo" height="32px" width="32px">
|
||||
</a>
|
||||
<a href="{{ path('app_adminUserDelete', {'id': participant.idParticipant}) }}" class="items-center">
|
||||
<img src="{{ asset('img/user-delete.svg') }}" alt="Logo" height="32px" width="32px">
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="8" class="px-6 py-4 text-center text-gray-500">Aucun participant trouvé</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{# Tableau user en attente #}
|
||||
<div class="overflow-x-auto bg-white rounded shadow mt-16">
|
||||
@@ -157,52 +159,76 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modale pour ajouter un user -->
|
||||
<div id="userModal" 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 un utilisateur</h2>
|
||||
<form id="addUserForm" method="POST" action="{{ path('app_adminUserAdd') }}">
|
||||
<div class="mb-4">
|
||||
<label for="nom" class="block text-sm font-medium text-gray-700">Nom</label>
|
||||
<input id="nom" name="nom" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="prenom" class="block text-sm font-medium text-gray-700">Prénom</label>
|
||||
<input id="prenom" name="prenom" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="pseudo" class="block text-sm font-medium text-gray-700">Pseudo *</label>
|
||||
<input id="pseudo" name="pseudo" 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="phone" class="block text-sm font-medium text-gray-700">téléphone</label>
|
||||
<input id="phone" name="phone" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="mail" class="block text-sm font-medium text-gray-700">Email *</label>
|
||||
<input id="mail" name="mail" 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>
|
||||
<p>* Champ obligatoire</p>
|
||||
<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>
|
||||
<!-- Modale pour ajouter un user -->
|
||||
<div id="userModal" 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 un utilisateur</h2>
|
||||
<form id="addUserForm" method="POST" action="{{ path('app_adminUserAdd') }}">
|
||||
<div class="mb-4">
|
||||
<label for="nom" class="block text-sm font-medium text-gray-700">Nom</label>
|
||||
<input id="nom" name="nom" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="prenom" class="block text-sm font-medium text-gray-700">Prénom</label>
|
||||
<input id="prenom" name="prenom" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="pseudo" class="block text-sm font-medium text-gray-700">Pseudo *</label>
|
||||
<input id="pseudo" name="pseudo" 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="phone" class="block text-sm font-medium text-gray-700">téléphone</label>
|
||||
<input id="phone" name="phone" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="mail" class="block text-sm font-medium text-gray-700">Email *</label>
|
||||
<input id="mail" name="mail" 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>
|
||||
<p>* Champ obligatoire</p>
|
||||
<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>
|
||||
|
||||
<script>
|
||||
// Ouvrir la modale manuellement
|
||||
document.getElementById('openModal').addEventListener('click', function() {
|
||||
document.getElementById('userModal').classList.remove('hidden');
|
||||
});
|
||||
|
||||
// Fermer la modale
|
||||
document.getElementById('closeModal').addEventListener('click', function() {
|
||||
document.getElementById('userModal').classList.add('hidden');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{# Modale import CSV#}
|
||||
|
||||
<script>
|
||||
// Ouvrir la modale manuellement
|
||||
document.getElementById('openModal').addEventListener('click', function() {
|
||||
document.getElementById('userModal').classList.remove('hidden');
|
||||
});
|
||||
|
||||
// Fermer la modale
|
||||
document.getElementById('closeModal').addEventListener('click', function() {
|
||||
document.getElementById('userModal').classList.add('hidden');
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const selectAllCheckbox = document.getElementById('selectAll');
|
||||
const checkboxes = document.querySelectorAll('input[type="checkbox"][name="userList[]"]');
|
||||
|
||||
// Ajouter un event listener à la checkbox globale
|
||||
selectAllCheckbox.addEventListener('change', function () {
|
||||
const isChecked = selectAllCheckbox.checked;
|
||||
checkboxes.forEach(checkbox => {
|
||||
checkbox.checked = isChecked;
|
||||
});
|
||||
});
|
||||
|
||||
// Mettre à jour la checkbox globale si l'une des checkboxes change
|
||||
checkboxes.forEach(checkbox => {
|
||||
checkbox.addEventListener('change', function () {
|
||||
const allChecked = Array.from(checkboxes).every(checkbox => checkbox.checked);
|
||||
selectAllCheckbox.checked = allChecked;
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user