Reorganize historic runs section to improve layout and accessibility

This commit is contained in:
Ross
2025-12-17 14:46:09 +00:00
parent 1e6d1d5f5b
commit ea38a25fa1
@@ -19,28 +19,7 @@
{% include 'rota/partials/worker_list.html' %}
</div>
<div class="mb-4">
<details class="box">
<summary class="subtitle" style="cursor:pointer; outline:none;">Historic runs</summary>
<div style="margin-bottom:0.5em; margin-top:0.5em;">
<form method="post" action="{% url 'rota:rota_runs_clear' rota.id %}" style="display:inline" onsubmit="return confirm('Delete all historic runs for this rota? This cannot be undone.')">
{% csrf_token %}
<button class="button is-danger is-light is-small" type="submit">Clear all runs</button>
</form>
</div>
<ul>
{% for run in rota.runs.all %}
<li>
<a href="{% url 'rota:rota_run_detail' run.id %}">Run {{ run.id }}</a> — {{ run.get_status_display }}
{% if run.finished_at %} — finished {{ run.finished_at }}{% endif %}
<span class="ml-2"><a class="button is-small is-light" href="{% url 'rota:rota_run_export_html' run.id %}" target="_blank">Export</a></span>
</li>
{% empty %}
<li>No previous runs</li>
{% endfor %}
</ul>
</details>
</div>
{# Historic runs moved to be grouped with the scheduled-run controls further down the page. #}
<div class="mb-4">
<h2 class="subtitle">Constraint options</h2>
@@ -108,6 +87,17 @@
</div>
</div>
{# Run controls and historic runs moved to the bottom of the page. #}
<div>
<h2 class="subtitle">Edit shifts</h2>
<p><button class="button is-link" hx-get="{% url 'rota:shift_add' rota.id %}" hx-target="#shift-form" hx-swap="innerHTML">Add shift</button></p>
<div id="shift-form">{# Load form via HTMX when user clicks 'Add shift' - initial empty state #}</div>
{% include 'rota/partials/shift_list.html' %}
</div>
<hr />
<form method="post">
{% csrf_token %}
<div class="field is-grouped is-grouped-multiline">
@@ -117,13 +107,27 @@
</div>
</form>
<hr />
<div>
<h2 class="subtitle">Edit shifts</h2>
<p><button class="button is-link" hx-get="{% url 'rota:shift_add' rota.id %}" hx-target="#shift-form" hx-swap="innerHTML">Add shift</button></p>
<div id="shift-form">{# Load form via HTMX when user clicks 'Add shift' - initial empty state #}</div>
{% include 'rota/partials/shift_list.html' %}
<div class="mb-4" style="margin-top:0.75rem;">
<details class="box">
<summary class="subtitle" style="cursor:pointer; outline:none;">Historic runs</summary>
<div style="margin-bottom:0.5em; margin-top:0.5em;">
<form method="post" action="{% url 'rota:rota_runs_clear' rota.id %}" style="display:inline" onsubmit="return confirm('Delete all historic runs for this rota? This cannot be undone.')">
{% csrf_token %}
<button class="button is-danger is-light is-small" type="submit">Clear all runs</button>
</form>
</div>
<ul>
{% for run in rota.runs.all %}
<li>
<a href="{% url 'rota:rota_run_detail' run.id %}">Run {{ run.id }}</a> — {{ run.get_status_display }}
{% if run.finished_at %} — finished {{ run.finished_at }}{% endif %}
<span class="ml-2"><a class="button is-small is-light" href="{% url 'rota:rota_run_export_html' run.id %}" target="_blank">Export</a></span>
</li>
{% empty %}
<li>No previous runs</li>
{% endfor %}
</ul>
</details>
</div>
</div>