feat: improve assessments filters
This commit is contained in:
@@ -183,7 +183,7 @@
|
||||
</a>
|
||||
{% endmacro %}
|
||||
|
||||
{# Macro pour filtres standardisés #}
|
||||
{# Macro pour filtres standardisés - Version classique (conservée pour compatibilité) #}
|
||||
{% macro filter_section(filters, current_values={}) %}
|
||||
<div class="filter-section">
|
||||
<div class="flex flex-col lg:flex-row lg:items-center lg:justify-between space-y-4 lg:space-y-0">
|
||||
@@ -210,4 +210,86 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
{# Macro pour filtres simplifiés et discrets #}
|
||||
{% macro simple_filter_section(filters_config, current_values={}, total_items=0, filtered_items=0) %}
|
||||
<div class="bg-gray-50 rounded-lg p-4 mb-6 border border-gray-200">
|
||||
<!-- Filtres compacts en une ligne -->
|
||||
<div class="flex flex-wrap items-center gap-4 text-sm">
|
||||
<div class="flex items-center text-gray-600">
|
||||
<svg class="w-4 h-4 mr-1" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fill-rule="evenodd" d="M3 3a1 1 0 011-1h12a1 1 0 011 1v3a1 1 0 01-.293.707L12 11.414V15a1 1 0 01-.293.707l-2 2A1 1 0 018 17v-5.586L3.293 6.707A1 1 0 013 6V3z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
<span id="filtered-count">{{ filtered_items }}</span>/<span class="text-gray-500">{{ total_items }}</span>
|
||||
</div>
|
||||
<!-- Filtre Trimestre -->
|
||||
{% if filters_config.trimester %}
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-gray-500 text-xs">Trimestre:</span>
|
||||
<button type="button" data-filter="trimester" data-value=""
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if not current_values.get('trimester-filter') %}bg-blue-600 text-white border-blue-600{% else %}bg-white text-gray-600 border-gray-300 hover:bg-gray-50{% endif %} transition-colors">
|
||||
Tous
|
||||
</button>
|
||||
{% for i in range(1, 4) %}
|
||||
<button type="button" data-filter="trimester" data-value="{{ i }}"
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if current_values.get('trimester-filter') == i|string %}bg-blue-600 text-white border-blue-600{% else %}bg-white text-gray-600 border-gray-300 hover:bg-gray-50{% endif %} transition-colors">
|
||||
T{{ i }}
|
||||
</button>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- Filtre Classe -->
|
||||
{% if filters_config.class_options %}
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-gray-500 text-xs">Classe:</span>
|
||||
{% for option in filters_config.class_options %}
|
||||
<button type="button" data-filter="class" data-value="{{ option.value }}"
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if current_values.get('class-filter') == option.value %}bg-blue-600 text-white border-blue-600{% else %}bg-white text-gray-600 border-gray-300 hover:bg-gray-50{% endif %} transition-colors">
|
||||
{{ option.label }}
|
||||
</button>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- Filtre État de correction -->
|
||||
{% if filters_config.correction %}
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-gray-500 text-xs">État:</span>
|
||||
<button type="button" data-filter="correction" data-value=""
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if not current_values.get('correction-filter') %}bg-blue-600 text-white border-blue-600{% else %}bg-white text-gray-600 border-gray-300 hover:bg-gray-50{% endif %} transition-colors">
|
||||
Toutes
|
||||
</button>
|
||||
<button type="button" data-filter="correction" data-value="not_started"
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if current_values.get('correction-filter') == 'not_started' %}bg-red-500 text-white border-red-500{% else %}bg-white text-red-600 border-red-200 hover:bg-red-50{% endif %} transition-colors">
|
||||
Non commencées
|
||||
</button>
|
||||
<button type="button" data-filter="correction" data-value="incomplete"
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if current_values.get('correction-filter') == 'incomplete' %}bg-orange-500 text-white border-orange-500{% else %}bg-white text-orange-600 border-orange-200 hover:bg-orange-50{% endif %} transition-colors">
|
||||
En cours
|
||||
</button>
|
||||
<button type="button" data-filter="correction" data-value="complete"
|
||||
class="filter-btn px-2 py-1 text-xs rounded border {% if current_values.get('correction-filter') == 'complete' %}bg-green-500 text-white border-green-500{% else %}bg-white text-green-600 border-green-200 hover:bg-green-50{% endif %} transition-colors">
|
||||
Terminées
|
||||
</button>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- Reset discret et contenu additionnel -->
|
||||
<div class="flex items-center justify-between mt-2">
|
||||
<div id="active-filter-tags" class="flex flex-wrap gap-1">
|
||||
<!-- Tags générés par JavaScript -->
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<button type="button" id="reset-filters" class="text-xs text-gray-500 hover:text-gray-700 hidden">
|
||||
Effacer
|
||||
</button>
|
||||
{% if caller %}
|
||||
{{ caller() }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
Reference in New Issue
Block a user