Refactor collection detail view: enhance layout and improve organization of case management links and collection information

This commit is contained in:
Ross
2025-11-16 22:31:00 +00:00
parent 7eb478b111
commit 6b73006122
+123 -100
View File
@@ -43,112 +43,135 @@
{% endpartialdef %}
{% block content %}
<h2>{{collection.name}}</h2>
{% include 'exam_notes.html' %}
<div class="card mb-3">
<div class="card-body">
<h2 class="card-title mb-2">{{ collection.name }}</h2>
{% include 'exam_notes.html' %}
<p class="mb-1"><strong>Exam mode:</strong> {{ collection.exam_mode }}
<small class="text-muted">(open access: {{ collection.exam_open_access }})</small>
</p>
<p class="mb-1">
{% include "generic/partials/exams/exam_status.html#publish-results" %}
{% include "generic/partials/exams/exam_status.html#exam-active" %}
</p>
<p class="mb-1"><strong>Collection Type:</strong> {{ collection.get_collection_type_display }}</p>
<p class="mb-1"><strong>Self review:</strong> {{ collection.self_review }}</p>
<p class="mb-1"><strong>Open access:</strong> {{ collection.open_access }}</p>
<div>
Exam mode: {{collection.exam_mode}} (open access: {{collection.exam_open_access}})<br />
{% include "generic/partials/exams/exam_status.html#publish-results" %}
{% include "generic/partials/exams/exam_status.html#exam-active" %}
Collection Type: {{collection.get_collection_type_display}}<br />
Self review: {{collection.self_review}}<br />
Open access: {{collection.open_access}}<br />
{% if collection.prerequisites.exists %}
Prerequisite collections:
<ul>
{% for prereq in collection.prerequisites.all %}
<li>
<a href="{% url 'atlas:collection_detail' prereq.pk %}">{{ prereq.name }}</a>
&nbsp;
</li>
{% endfor %}
</ul>
<p>
<button
title="Sync users from all prerequisite collections into this collection"
hx-post="{% url 'atlas:collection_sync_prerequisite_users' collection.pk %}"
hx-swap="outerHTML"
class="btn btn-sm btn-secondary"
>Sync prerequisite users</button>
</p>
{% endif %}
</div>
{% if collection.collection_type == "VIV" %}
<p><a href='{% url "atlas:collection_viva" collection.pk %}'><button class="btn btn-primary">Start Viva</button></a>
{% else %}
<p>This collection will be available to view/take <a href='{{collection.get_take_url}}' id="take-url">here</a>{% if not collection.active %} (when active){% endif %} <button
_="on click
writeText(#take-url's href) on navigator.clipboard
put 'copied url!' into me
wait 1s
put 'copy url' into me"
class="btn btn-sm">copy link</button>
<p>Review collection <a href='{% url "atlas:collection_viva" collection.pk %}'>here</a>
{% endif %}
<h3>Cases</h3>
<ol id="full-question-list" class="sortable">
{% for casedetail in casesdetails %}
<li data-question_pk={{casedetail.case.pk}}>
<a href="{% url 'atlas:collection_case_view' pk=collection.pk case_number=forloop.counter0 %}">Case {{forloop.counter}}</a>
:
{% if casedetail.case.series.count == 0 %}
&nbsp;<i class="bi bi-exclamation-circle text-warning" title="No series attached to this case"></i>&nbsp;
{% endif %}
{{casedetail.case.title}}&nbsp;
{% partial casedetails-management-links %}
</li>
{% endfor %}
</ol>
{% if can_edit %}
<p><button id='button-edit-order' title='click and drag questions to change order' data-posturl="{% url 'atlas:exam_json_edit' pk=collection.pk %}">Edit case order / Remove cases</button></p>
<p><button id='button-add-case'
title='click to add a case to this collection'
hx-get="{% url 'atlas:add_case_to_collection' collection.pk %}" hx-swap="innerHTML" hx-target="#case-list">
Add case
</button>
<div id='case-list'></div>
</p>
<details>
<summary>Answer management</summary>
<div class="alert alert-danger">
<p>Manage answers for this collection. </p>
Please note these are permanant and cannot be undone.
<div class="mb-2">
<strong>Prerequisite collections:</strong>
<ul class="mb-0">
{% for prereq in collection.prerequisites.all %}
<li>
<a href="{% url 'atlas:collection_detail' prereq.pk %}">{{ prereq.name }}</a>
</li>
{% endfor %}
</ul>
</div>
<button title="This will clear all user answers and attempts"
hx-post="{% url 'atlas:collection_reset_answers' collection.pk %}"
<p>
<button
title="Sync users from all prerequisite collections into this collection"
hx-post="{% url 'atlas:collection_sync_prerequisite_users' collection.pk %}"
hx-swap="outerHTML"
hx-confirm="Are you sure you want to reset all answers? This action cannot be undone."
>Reset all answers</button>
class="btn btn-sm btn-secondary"
>Sync prerequisite users</button>
</p>
{% endif %}
<button title="This will specific user answers and attempts"
hx-post="{% url 'atlas:collection_reset_answers_user_list' collection.pk %}"
hx-swap="innerHTML"
hx-target="#user-list"
>Reset user answers</button>
<div id="user-list"></div>
<div class="mt-3">
{% if collection.collection_type == "VIV" %}
<a href="{% url 'atlas:collection_viva' collection.pk %}" class="btn btn-primary">Start Viva</a>
{% else %}
<p class="mb-1">This collection will be available to view/take <a href="{{ collection.get_take_url }}" id="take-url">here</a>{% if not collection.active %} (when active){% endif %}
<button
_="on click
writeText(#take-url's href) on navigator.clipboard
put 'copied url!' into me
wait 1s
put 'copy url' into me"
class="btn btn-sm btn-outline-secondary ms-2">copy link</button>
</p>
<p class="mb-0">Review collection <a href="{% url 'atlas:collection_viva' collection.pk %}">here</a></p>
{% endif %}
</div>
</div>
</div>
</details>
{% endif %}
{% include 'exam_overview_js.html' %}
<h3>Cases</h3>
<ol id="full-question-list" class="list-group list-group-numbered sortable">
{% for casedetail in casesdetails %}
<li class="list-group-item d-flex justify-content-between align-items-start" data-question_pk={{ casedetail.case.pk }}>
<div class="me-3">
<a href="{% url 'atlas:collection_case_view' pk=collection.pk case_number=forloop.counter0 %}">Case {{ forloop.counter }}</a>
:
{% if casedetail.case.series.count == 0 %}
<i class="bi bi-exclamation-circle text-warning ms-1" title="No series attached to this case"></i>
{% endif %}
<span class="ms-2">{{ casedetail.case.title }}</span>
</div>
<div class="ms-auto">
{% partial casedetails-management-links %}
</div>
</li>
{% endfor %}
</ol>
{% if can_edit %}
<p>
<button id='button-edit-order'
title='click and drag questions to change order'
data-posturl="{% url 'atlas:exam_json_edit' pk=collection.pk %}"
class="btn btn-sm btn-secondary">
Edit case order / Remove cases
</button>
</p>
<p>
<button id='button-add-case'
title='click to add a case to this collection'
hx-get="{% url 'atlas:add_case_to_collection' collection.pk %}" hx-swap="innerHTML" hx-target="#case-list"
class="btn btn-sm btn-secondary">
Add case
</button>
<div id='case-list'></div>
</p>
<details>
<summary>Answer management</summary>
<div class="alert alert-danger">
<p>Manage answers for this collection. </p>
Please note these are permanant and cannot be undone.
</div>
<button title="This will clear all user answers and attempts"
hx-post="{% url 'atlas:collection_reset_answers' collection.pk %}"
hx-swap="outerHTML"
hx-confirm="Are you sure you want to reset all answers? This action cannot be undone."
class="btn btn-danger"
>Reset all answers</button>
<button title="This will specific user answers and attempts"
hx-post="{% url 'atlas:collection_reset_answers_user_list' collection.pk %}"
hx-swap="innerHTML"
hx-target="#user-list"
class="btn btn-warning">
Reset user answers</button>
<div id="user-list"></div>
</details>
{% endif %}
{% include 'exam_overview_js.html' %}
{% endblock %}