Enhance exam scores and marking templates with improved feedback display and structured question details

This commit is contained in:
Ross
2025-09-08 10:56:37 +01:00
parent 83e8c14f31
commit 30523c9296
2 changed files with 69 additions and 28 deletions
@@ -8,13 +8,15 @@
<div id="single-dicom-viewer" class="dicom-viewer" data-images="" data-annotations=''>
</div>
<div class="history"></div>
<div>
<div class="answers-section">
<details>
<summary>Sample Answers:</summary>
<span class="answers">
</span>
</details>
</div>
<div class="question-feedback">
</div>
</div>
</div>
<div class="shorts">
@@ -85,6 +87,11 @@
if (data.history) {
$(".question-display-block .history").empty().append(`History:<pre>${data.history}</pre>`);
}
if (data.feedback) {
$(".question-display-block .question-feedback").empty().append(`Feedback:<pre>${data.feedback}</pre>`);
} else {
$(".question-display-block .question-feedback").empty();
}
console.log(data)
if (data.answers && data.answers.length > 0) {
// Format: [[answer, score], ...]
+61 -27
View File
@@ -174,37 +174,71 @@
<span class="ml-3 text-muted">({{ unmarked|length }} answer{{ unmarked|length|pluralize }} left to mark)</span>
</div>
<details closed>
<summary title="click to view/hide the question details">Question Details</summary>
<p class="pre-whitespace"><b>History:</b> {{ question.history }}</p>
<p class="pre-whitespace"><b>Region:</b> {{ question.get_regions }}</p>
<p class="pre-whitespace"><b>Examination:</b> {{ question.get_examinations }}</p>
<p class="pre-whitespace"><b>Abnormality:</b> {{ question.get_abnormalities }}</p>
<div class="pre-whitespace multi-image-block"><b>Images:</b>
{% for image in question.images.all %}
<span class="image-block">
Image {{ forloop.counter }}{% if image.description %} ({{image.description}}){% endif %}{% if image.feedback_image %} [feedback image]{% endif %}:
<div class="dicom-image shorts-img {% if image.feedback_image %}feedback-img{% endif %}"
data-url="{{ remote_url }}{{ image.image.url}}"></div>
</span>
{% endfor %}
</div>
<p class="pre-whitespace"><b>Feedback:</b> {{ question.feedback }}</p>
</details>
<div class="marking-block">
<details open>
<summary title="click to view/hide the mark scheme">Marking Guidance</summary>
{{ question.marking_guidance | safe}}
</details>
<details open>
<summary title="click to view/hide user answers">User answer</summary>
<div>
<div class="shorts-answer">
<pre>{{answer.answer}}</pre>
<!-- Enable Bootstrap dark mode using 'bg-dark', 'text-light', and dark card classes -->
<div class="card mb-4 bg-dark text-light border-secondary">
<details>
<summary class="card-header bg-secondary text-light" title="Click to view/hide the question details">
<strong>Question Details</strong>
</summary>
<div class="card-body">
<p class="pre-whitespace mb-2"><b>History:</b> {{ question.history }}</p>
<p class="pre-whitespace mb-2"><b>Region:</b> {{ question.get_regions }}</p>
<p class="pre-whitespace mb-2"><b>Examination:</b> {{ question.get_examinations }}</p>
<p class="pre-whitespace mb-2"><b>Abnormality:</b> {{ question.get_abnormalities }}</p>
<div class="pre-whitespace multi-image-block mb-2"><b>Images:</b>
<div class="row">
{% for image in question.images.all %}
<div class="col-md-4 mb-2">
<div class="card h-100 bg-dark text-light border-secondary">
<div class="card-body p-2">
<span class="image-block">
<strong>Image {{ forloop.counter }}</strong>
{% if image.description %} ({{image.description}}){% endif %}
{% if image.feedback_image %}
<span class="badge bg-info text-dark">Feedback image</span>
{% endif %}
<div class="dicom-image shorts-img {% if image.feedback_image %}feedback-img{% endif %} mt-2"
data-url="{{ remote_url }}{{ image.image.url}}"></div>
</span>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
<p class="pre-whitespace mb-0"><b>Feedback:</b> {{ question.feedback }}</p>
</div>
</details>
</div>
<div class="row mb-4">
<div class="col-md-6">
<div class="card h-100 bg-dark text-light border-secondary">
<details open>
<summary class="card-header bg-secondary text-light" title="Click to view/hide the mark scheme">
<strong>Marking Guidance</strong>
</summary>
<div class="card-body">
{{ question.marking_guidance | safe }}
</div>
</details>
</div>
</div>
<div class="col-md-6">
<div class="card h-100 bg-dark text-light border-secondary">
<details open>
<summary class="card-header bg-secondary text-light" title="Click to view/hide user answers">
<strong>User Answer</strong>
</summary>
<div class="card-body">
<div class="shorts-answer">
<pre class="mb-0 text-light bg-dark border-0">{{ answer.answer }}</pre>
</div>
</div>
</details>
</div>
</div>
</div>
<div class="marking">
<form method="POST" class="post-form">{% csrf_token %}
<input type="hidden" name="form_id" value="mark_form">