Implement bulk archive functionality for exams; add HTMX endpoint and update UI controls for improved exam management

This commit is contained in:
Ross
2025-11-11 20:52:44 +00:00
parent dc23dffaf9
commit e9d0e402be
3 changed files with 172 additions and 3 deletions
+115 -3
View File
@@ -3,10 +3,14 @@
{% block content %}
<div id="exam-list-wrapper">
<div class="d-flex justify-content-between align-items-center mb-3">
<div>
<button type="button" class="btn btn-sm btn-outline-secondary" id="bulk-toggle-btn">Bulk edit</button>
</div>
<div>
<button type="button" class="btn btn-sm btn-outline-secondary" id="bulk-toggle-btn">Bulk edit</button>
</div>
<div class="d-flex align-items-center">
<div class="me-2">
<button id="toggle-archive-btn" type="button" class="btn btn-sm btn-outline-info">Show archived</button>
</div>
<div id="bulk-controls" class="d-none">
<div>
<button type="button" class="btn btn-sm btn-outline-primary" id="select-all-btn">Select all</button>
@@ -31,6 +35,16 @@
{% csrf_token %}
<button class="btn btn-sm btn-danger" type="submit" onclick="return confirm('Delete selected exams? This action is irreversible.')">Delete selected</button>
</form>
<form id="bulk-archive-form" class="mt-2" hx-post="{% url app_name|add:':exam_bulk_archive' %}" hx-target="#exam-list-container" hx-include="#exam-list-container input[name='exam_ids']" hx-indicator="#bulk-action-indicator">
{% for k, v in request.GET.items %}
<input type="hidden" name="{{ k }}" value="{{ v }}" />
{% endfor %}
{% csrf_token %}
<div class="btn-group" role="group">
<button name="archive" value="true" class="btn btn-sm btn-warning" type="submit" onclick="return confirm('Archive selected exams?')">Archive selected</button>
<button name="archive" value="false" class="btn btn-sm btn-outline-warning" type="submit" onclick="return confirm('Unarchive selected exams?')">Unarchive selected</button>
</div>
</form>
<!-- Bulk action indicator shown while HTMX requests are running -->
<span id="bulk-action-indicator" class="ms-2" aria-hidden="true">
@@ -67,6 +81,8 @@
/* Defensive: hide bulk-controls unless bulk-mode is enabled */
#exam-list-wrapper:not(.bulk-mode) #bulk-controls { display: none !important; }
/* (bulk-only top-level controls removed) */
/* Bulk action indicator - hidden by default, shown while HTMX request is active */
#bulk-action-indicator { display: none; }
#bulk-action-indicator.htmx-request { display: inline-block; }
@@ -106,6 +122,58 @@
});
}
// Top-level archive/unarchive buttons: make visible and usable without hunting inside bulk panel
const topArchiveBtn = document.getElementById('top-archive-btn');
const topUnarchiveBtn = document.getElementById('top-unarchive-btn');
function ensureBulkModeVisible(){
if(!examListWrapper.classList.contains('bulk-mode')){
examListWrapper.classList.add('bulk-mode');
bulkControls.classList.remove('d-none');
}
}
function submitArchiveAction(isArchive){
// find the bulk-archive form already in the DOM
const form = document.getElementById('bulk-archive-form');
if(!form){
alert('Bulk archive form not found.');
return;
}
// if no checkboxes selected, open bulk-mode and focus user to select
const checked = Array.from(document.querySelectorAll('#exam-list-container input.exam-select-checkbox:checked'));
if(checked.length === 0){
ensureBulkModeVisible();
// scroll to controls so user can pick
bulkControls.scrollIntoView({behavior:'smooth', block:'center'});
// highlight controls briefly
bulkControls.classList.add('border', 'border-3', 'border-primary');
setTimeout(()=> bulkControls.classList.remove('border','border-3','border-primary'), 2000);
return;
}
// set the archive input value on the appropriate button and submit
const btn = form.querySelector('button[name="archive"][value="' + (isArchive ? 'true' : 'false') + '"]');
if(btn){
btn.click();
} else {
// fallback: add hidden input and submit
const hidden = document.createElement('input');
hidden.type = 'hidden';
hidden.name = 'archive';
hidden.value = isArchive ? 'true' : 'false';
form.appendChild(hidden);
form.requestSubmit();
}
}
if(topArchiveBtn){
topArchiveBtn.addEventListener('click', function(){ submitArchiveAction(true); });
}
if(topUnarchiveBtn){
topUnarchiveBtn.addEventListener('click', function(){ submitArchiveAction(false); });
}
// Make clicking an exam row toggle its checkbox when bulk-mode is enabled.
document.addEventListener('click', function(e){
if(!examListWrapper.classList.contains('bulk-mode')) return;
@@ -123,5 +191,49 @@
});
});
</script>
<script>
// Archive toggle button: toggle ?archive=1 while preserving other query params
(function(){
function getQueryParams(){
return new URLSearchParams(window.location.search);
}
function updateButton(){
const btn = document.getElementById('toggle-archive-btn');
if(!btn) return;
const params = getQueryParams();
if(params.get('archive') && params.get('archive') !== '0'){
btn.textContent = 'Hide archived';
btn.classList.remove('btn-outline-info');
btn.classList.add('btn-outline-secondary');
} else {
btn.textContent = 'Show archived';
btn.classList.remove('btn-outline-secondary');
btn.classList.add('btn-outline-info');
}
}
// handle toggle button click
document.addEventListener('click', function(e){
if(e.target && e.target.id === 'toggle-archive-btn'){
const params = getQueryParams();
if(params.get('archive') && params.get('archive') !== '0'){
params.delete('archive');
} else {
params.set('archive','1');
}
const q = params.toString();
const newUrl = window.location.pathname + (q ? ('?' + q) : '');
window.location.href = newUrl;
}
});
// init on load
document.addEventListener('DOMContentLoaded', updateButton);
// also update button when HTMX swaps content
document.addEventListener('htmx:afterSwap', updateButton);
document.addEventListener('htmx:afterOnLoad', updateButton);
})();
</script>
{% endblock %}
+5
View File
@@ -338,6 +338,11 @@ def generic_exam_urls(generic_exam_view: GenericExamViews):
generic_exam_view.exam_bulk_update,
name="exam_bulk_update",
),
path(
"exam/bulk_archive/",
generic_exam_view.exam_bulk_archive,
name="exam_bulk_archive",
),
path(
"exam/bulk_delete/",
generic_exam_view.exam_bulk_delete,
+52
View File
@@ -1117,6 +1117,58 @@ class ExamViews(View, LoginRequiredMixin):
return render(request, "generic/partials/_exam_list.html", {"filter": filter, "app_name": self.app_name})
@method_decorator(login_required)
def exam_bulk_archive(self, request):
"""HTMX endpoint to bulk-archive or unarchive selected exams.
Expects POST with 'exam_ids' (multiple) and 'archive' ('true' or 'false').
Returns the updated exam list partial.
"""
if request.method != "POST":
return HttpResponse(status=405)
exam_ids = request.POST.getlist("exam_ids")
archive_val = request.POST.get("archive", "true")
set_archive = True if archive_val == "true" else False
if (
request.user.is_superuser
or (
self.app_name == "rapids"
and request.user.groups.filter(name="rapid_checker").exists()
)
or (
self.app_name == "anatomy"
and request.user.groups.filter(name="anatomy_checker").exists()
)
or (
self.app_name == "longs"
and request.user.groups.filter(name="long_checker").exists()
)
):
exams_qs = self.Exam.objects.all()
filter = self.ExtraExamFilter(request.GET, queryset=exams_qs)
else:
exams_qs = self.Exam.objects.filter(author__id=request.user.id) | self.Exam.objects.filter(open_access=True)
filter = self.BasicExamFilter(request.GET, queryset=exams_qs)
for eid in exam_ids:
try:
exam = self.Exam.objects.get(pk=eid)
except self.Exam.DoesNotExist:
continue
if not self.check_user_edit_access(request.user, exam_id=exam.pk):
continue
try:
exam.archive = set_archive
exam.save()
except Exception:
continue
return render(request, "generic/partials/_exam_list.html", {"filter": filter, "app_name": self.app_name})
@method_decorator(login_required)
def exam_toggle_results_published(self, request, pk):
if request.method == "POST":