edit Leere Liste in Vorgang und Crime

This commit is contained in:
2025-09-03 12:27:13 +02:00
parent 37e103a494
commit 283755c7db
10 changed files with 134 additions and 98 deletions

View File

@@ -11,6 +11,7 @@
import Cube from '$lib/icons/Cube.svelte';
import { invalidate, invalidateAll } from '$app/navigation';
import NameItemEditor from '$lib/components/NameItemEditor.svelte';
import EmptyList from '$lib/components/EmptyList.svelte';
//Seite für die Tatort-Liste
let { data } = $props();
@@ -30,6 +31,8 @@
let crimesList: ListItem[] = $state(data.crimesList);
const vorgangPIN: string = data.vorgang.vorgangPIN;
let vorgangToken: string = data.vorgang.vorgangToken;
//crimesList = [];
let isEmptyList = $derived(crimesList.length === 0);
//Variablen für Modal
let open = $state(false);
@@ -147,55 +150,61 @@ Mit freundlichen Grüßen,
{#if admin}
Zugangs-PIN: {vorgangPIN}
<a class="pt-2 pb-6" href={constructMailToLink()}><Button>Share Link</Button></a>
<a class="pt-2 pb-6" href={constructMailToLink()}
><Button disabled={isEmptyList}>Share Link</Button></a
>
{/if}
</div>
<div class="mx-auto flex justify-center max-w-7xl h-full">
<ul class="divide-y divide-gray-100">
{#each data.crimesList as item, crimeListItemIndex}
<li>
<div class=" flex gap-x-4">
<a
href="/view/{vorgangToken}/{item.name}?pin={vorgangPIN}"
class=" flex justify-between gap-x-6 py-5"
aria-label="/view/{vorgangToken}/{item.name}?pin={vorgangPIN}"
title={item.name}
>
<Cube />
</a>
<div class="min-w-0 flex-auto">
{#if admin}
<NameItemEditor
list={data.crimesList}
editedName={data.crimeNames[crimeListItemIndex]}
currentName={item.name}
onSave={handleSave}
onDelete={handleDelete}
></NameItemEditor>
{:else}
<span class="text-sm font-semibold leading-6 text-gray-900 inline-block min-w-1"
>{item.name}</span
>
{/if}
{#if item.size}
<p class="mt-1 truncate text-xs leading-5 text-gray-500">
{shortenFileSize(item.size)}
{#if isEmptyList}
<EmptyList></EmptyList>
{:else}
{#each data.crimesList as item, crimeListItemIndex}
<li>
<div class=" flex gap-x-4">
<a
href="/view/{vorgangToken}/{item.name}?pin={vorgangPIN}"
class=" flex justify-between gap-x-6 py-5"
aria-label="/view/{vorgangToken}/{item.name}?pin={vorgangPIN}"
title={item.name}
>
<Cube />
</a>
<div class="min-w-0 flex-auto">
{#if admin}
<NameItemEditor
list={data.crimesList}
editedName={data.crimeNames[crimeListItemIndex]}
currentName={item.name}
onSave={handleSave}
onDelete={handleDelete}
></NameItemEditor>
{:else}
<span class="text-sm font-semibold leading-6 text-gray-900 inline-block min-w-1"
>{item.name}</span
>
{/if}
{#if item.size}
<p class="mt-1 truncate text-xs leading-5 text-gray-500">
{shortenFileSize(item.size)}
</p>
{/if}
</div>
</div>
<div class="hidden sm:flex sm:flex-col sm:items-end">
<p class="text-sm leading-6 text-gray-900">3D Tatort</p>
{#if item.lastModified}
<p class="mt-1 text-xs leading-5 text-gray-500">
Zuletzt geändert <time datetime="2023-01-23T13:23Z"
>{timeElapsed(new Date(item.lastModified))}</time
>
</p>
{/if}
</div>
</div>
<div class="hidden sm:flex sm:flex-col sm:items-end">
<p class="text-sm leading-6 text-gray-900">3D Tatort</p>
{#if item.lastModified}
<p class="mt-1 text-xs leading-5 text-gray-500">
Zuletzt geändert <time datetime="2023-01-23T13:23Z"
>{timeElapsed(new Date(item.lastModified))}</time
>
</p>
{/if}
</div>
</li>
{/each}
</li>
{/each}
{/if}
</ul>
</div>

View File

@@ -1,4 +1,3 @@
import { redirect } from '@sveltejs/kit';
export async function load({fetch, params, url}){
const vorgangResponse = await fetch(`/api/list`);
@@ -14,9 +13,7 @@ export async function load({fetch, params, url}){
//Variabeln für NameItemEditor
const crimeNames: string[] = crimesList.map((l) => l.name);
if (crimesList.length === 0) {
throw redirect(302, '/upload'); // weiterleiten auf die hinzufügen seite
}
return {
vorgang,
vorgangList,