mirror of
https://github.com/jcreek/AutomatedAssessmentFeedbackAgent.git
synced 2026-07-12 18:43:49 +00:00
feat(*): Add quality of life buttons
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user