feat(*): Add quality of life buttons

This commit is contained in:
Josh Creek
2025-04-16 23:48:16 +01:00
parent bbeb29dea5
commit e0b13d4962
2 changed files with 32 additions and 2 deletions
@@ -1,4 +1,6 @@
<script lang="ts">
import { createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
export let history: any[] = [];
export let hideIfEmpty: boolean = false;
</script>
@@ -18,6 +20,7 @@
<th class="py-2 px-3 border-b text-left">Task/Assignment</th>
<th class="py-2 px-3 border-b text-left">Grade</th>
<th class="py-2 px-3 border-b text-left">Actions</th>
<th class="py-2 px-3 border-b text-left">Delete</th>
</tr>
</thead>
<tbody>
@@ -43,6 +46,9 @@
</div>
</details>
</td>
<td class="py-1 px-3 text-center">
<button class="bg-red-100 text-red-700 px-2 py-1 rounded hover:bg-red-200 transition text-xs" on:click={() => dispatch('delete', entry.timestamp)}>Delete</button>
</td>
</tr>
{/each}
</tbody>
+26 -2
View File
@@ -31,7 +31,10 @@ onMount(() => {
</script>
<section class="max-w-xl mx-auto py-12">
<h1 class="text-2xl font-bold mb-4">Assessment Results</h1>
<div class="flex justify-between items-center mb-4">
<h1 class="text-2xl font-bold">Assessment Results</h1>
<a href="/upload" class="bg-blue-100 text-blue-700 px-3 py-1 rounded hover:bg-blue-200 transition">Back to Upload</a>
</div>
<p class="mb-6">View detailed feedback and recommendations for each student submission.</p>
{#if feedback}
<AssessmentFeedback {...feedback} />
@@ -39,5 +42,26 @@ onMount(() => {
{#if !feedback && (!history || history.length === 0)}
<div class="border rounded p-6 text-gray-500">No results yet. Upload submissions to see feedback here.</div>
{/if}
<AssessmentHistory {history} hideIfEmpty={true} />
<div class="flex justify-end mt-6">
<button class="bg-red-100 text-red-700 px-3 py-1 rounded hover:bg-red-200 transition" on:click={clearHistory} disabled={history.length === 0}>Clear History</button>
</div>
<AssessmentHistory {history} hideIfEmpty={true} on:delete={deleteEntry} />
</section>
<script lang="ts" context="module">
export function clearHistory() {
localStorage.removeItem('assessmentHistory');
window.location.reload();
}
export function deleteEntry(event: CustomEvent) {
const timestamp = event.detail;
let prev = [];
try {
prev = JSON.parse(localStorage.getItem('assessmentHistory') || '[]');
} catch {}
prev = prev.filter((entry: any) => entry.timestamp !== timestamp);
localStorage.setItem('assessmentHistory', JSON.stringify(prev));
window.location.reload();
}
</script>