feat: Enhance supervision page with collapsible group sections for better organization

Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Ross
2026-04-29 21:50:45 +01:00
parent 8201f91697
commit f63f3b3687
+29 -11
View File
@@ -1,6 +1,14 @@
{% extends 'atlas/exams.html' %}
{% load static %}
{% block css %}
{{ block.super }}
<style>
.collapse-chevron { transition: transform .2s ease; }
[aria-expanded="true"] .collapse-chevron { transform: rotate(-180deg); }
</style>
{% endblock %}
{% block content %}
<div class="d-flex flex-wrap justify-content-between align-items-start gap-3 mb-3">
<div>
@@ -72,17 +80,26 @@
{# ---- Grouped results ---- #}
{% if groups %}
{% for group_label, attempt_rows in groups %}
<div class="mb-4">
<h5 class="h6 fw-semibold border-bottom pb-1 mb-2">
{% if group_by == 'user' %}
<i class="bi bi-person me-1" aria-hidden="true"></i>
{% else %}
<i class="bi bi-collection me-1" aria-hidden="true"></i>
{% endif %}
{{ group_label }}
<span class="badge bg-secondary fw-normal ms-1">{{ attempt_rows|length }} attempt{{ attempt_rows|length|pluralize }}</span>
</h5>
<div class="table-responsive">
<div class="mb-3">
<button class="btn btn-link text-start text-decoration-none w-100 p-0 border-bottom pb-1 mb-0 collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#group-{{ forloop.counter }}"
aria-expanded="false"
aria-controls="group-{{ forloop.counter }}">
<h5 class="h6 fw-semibold d-inline mb-0">
{% if group_by == 'user' %}
<i class="bi bi-person me-1" aria-hidden="true"></i>
{% else %}
<i class="bi bi-collection me-1" aria-hidden="true"></i>
{% endif %}
{{ group_label }}
<span class="badge bg-secondary fw-normal ms-1">{{ attempt_rows|length }} attempt{{ attempt_rows|length|pluralize }}</span>
</h5>
<i class="bi bi-chevron-down ms-2 small collapse-chevron" aria-hidden="true"></i>
</button>
<div class="collapse" id="group-{{ forloop.counter }}">
<div class="table-responsive mt-2">
<table class="table table-hover table-sm align-middle mb-0">
<thead class="table-dark">
<tr>
@@ -146,6 +163,7 @@
</tbody>
</table>
</div>
</div>{# /collapse #}
</div>
{% endfor %}
{% else %}