File size: 5,556 Bytes
91073d4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 |
{% extends 'layout.html' %}
{% block title %}Gérer les Catégories | Forum Communautaire{% endblock %}
{% block breadcrumb %}
<a href="{{ url_for('forum.index') }}" class="hover:text-blue-600">Accueil</a>
<span class="mx-2">/</span>
<a href="{{ url_for('admin.dashboard') }}" class="hover:text-blue-600">Administration</a>
<span class="mx-2">/</span>
<span class="text-gray-700">Gérer les Catégories</span>
{% endblock %}
{% block content %}
<div class="bg-white rounded-lg shadow-sm p-6">
<div class="flex justify-between items-center mb-6">
<h1 class="text-2xl font-bold">Gérer les Catégories</h1>
<a href="{{ url_for('admin.create_category') }}" class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 focus:outline-none focus:ring flex items-center">
<i data-feather="plus" class="w-4 h-4 mr-2"></i>
Nouvelle Catégorie
</a>
</div>
{% if categories %}
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Ordre
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Nom
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Description
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Sujets
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Actions
</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
{% for category in categories %}
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
{{ category.order }}
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm font-medium text-gray-900">
<a href="{{ url_for('forum.category_view', id=category.id) }}" class="hover:text-blue-600">
{{ category.name }}
</a>
</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-500 line-clamp-2">
{{ category.description or "Aucune description" }}
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
{{ category.topic_count() }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
<div class="flex space-x-2">
<a href="{{ url_for('admin.edit_category', id=category.id) }}" class="text-blue-600 hover:text-blue-900">
<i data-feather="edit" class="w-4 h-4"></i>
<span class="sr-only">Modifier</span>
</a>
<form action="{{ url_for('admin.delete_category', id=category.id) }}" method="post" class="delete-form inline">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="text-red-600 hover:text-red-900 bg-transparent border-none p-0 cursor-pointer"
data-confirm="Êtes-vous sûr de vouloir supprimer cette catégorie ? Cette action est irréversible et supprimera également tous les sujets associés.">
<i data-feather="trash-2" class="w-4 h-4"></i>
<span class="sr-only">Supprimer</span>
</button>
</form>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="bg-gray-50 p-6 text-center rounded-lg">
<p class="text-gray-600">Aucune catégorie n'a été créée.</p>
<a href="{{ url_for('admin.create_category') }}" class="mt-2 inline-block px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 focus:outline-none focus:ring">
Créer votre première catégorie
</a>
</div>
{% endif %}
</div>
{% endblock %}
{% block extra_js %}
<script>
document.addEventListener('DOMContentLoaded', function() {
// Configuration des confirmations de suppression
document.querySelectorAll('.delete-form').forEach(form => {
form.addEventListener('submit', function(e) {
e.preventDefault();
const confirmMessage = this.querySelector('button').getAttribute('data-confirm');
if (confirm(confirmMessage)) {
this.submit();
}
});
});
});
</script>
{% endblock %} |