innohub/tatort
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change case loading in server side mode, made case list functional

Browse Source
This commit is contained in:
Jared
2025-06-19 16:01:07 +02:00
parent a2ac88af50
commit c5dd8b9424
8 changed files with 110 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/routes/(token-based)/list/+page.svelte
View File

@@ -1,103 +0,0 @@
<script lang="ts">
import { onMount } from 'svelte';
import Trash from '$lib/icons/Trash.svelte';
import Folder from '$lib/icons/Folder.svelte';
/**
* @type any[]
*/
let list: any[] = [];
//$: list;
onMount(async () => {
const response = await fetch('/api/list');
const stream = await response.body;
if (!stream) return;
const reader = stream.getReader();
while (true) {
const { done, value } = await reader.read();
if (done) return;
const objs = new TextDecoder()
.decode(value)
.split('\n')
.filter((i) => i.length > 0)
.map((i) => JSON.parse(i));
list = list.concat(objs);
}
});
async function delete_item(ev: Event) {
let delete_item = window.confirm('Bist du sicher?');
if (delete_item) {
const target = ev.currentTarget as HTMLElement | null;
if (!target) return;
let filename = target.id.split('del__')[1];
// delete request
// --------------
let url = `/api/list/${filename}`;
try {
const response = await fetch(url, { method: 'DELETE' });
if (response.status == 204) {
setTimeout(() => {
window.location.reload();
}, 500);
}
} catch (error) {
if (error instanceof Error) {
console.log(error.message);
} else {
console.log(error);
}
}
}
}
</script>
<div class="-z-10 bg-white">
<div class="flex flex-col items-center justify-center w-full">
<h1 class="text-xl">Liste der Vorgänge</h1>
</div>
<div class="mx-auto flex justify-center max-w-7xl h-full">
<ul role="list" class="divide-y divide-gray-100">
{#each list as item}
<li>
<a href="/list/{item.name}" class="flex justify-between gap-x-6 py-5">
<div class="flex gap-x-4">
<!-- Ordner -->
<Folder />
<div class="min-w-0 flex-auto">
<span class="text-sm font-semibold leading-6 text-gray-900">{item.name}</span>
<!-- Delete button -->
<button
style="padding: 2px"
id="del__{item.name}"
on:click|preventDefault={delete_item}
aria-label="Vorgang {item.name} löschen"
>
<Trash />
</button>
</div>
</div>
<div class="hidden sm:flex sm:flex-col sm:items-end">
<p class="text-sm leading-6 text-gray-900">Vorgang</p>
</div>
</a>
</li>
{/each}
</ul>
</div>
</div>
<style>
ul {
min-width: 24rem;
}
</style>

32
src/routes/(token-based)/list/[vorgang]/+page.server.ts
View File

@@ -1,18 +1,28 @@
import { checkIfVorgangExists } from '$lib/server/vorgangService';
import { hasValidToken } from '$lib/server/vorgangService';
import { redirect } from '@sveltejs/kit';
import { getVorgangByCaseId } from '$lib/server/vorgangService';
import type { PageServerLoad } from '../../view/$types';
export const load: PageServerLoad = ({params, url}) => {
const caseID = params.vorgang;
const token = url.searchParams.get('token');
export const load: PageServerLoad = async ({ params, url }) => {
const caseId = params.vorgang;
const caseToken = url.searchParams.get('token');
let isTokenValid
const isVorgangValid = await checkIfVorgangExists(caseId);
if (isVorgangValid !== true) {
return {
error: 'Vorgang wurde nicht gefunden.'
};
}
const isTokenValid = await hasValidToken(caseId, caseToken);
if (isTokenValid !== true) {
return {
error: 'Zugriffscode ist ungültig.'
};
}
if (typeof token === 'string' && caseID) {
isTokenValid = hasValidToken(caseID, token);
}
const crimesList = await getVorgangByCaseId(caseId);
if(!isTokenValid) {
redirect(303, '/anmeldung');
}
return {
crimesList
};
};

58
src/routes/(token-based)/list/[vorgang]/+page.svelte
View File

@@ -1,5 +1,4 @@
<script lang="ts">
import { onMount } from 'svelte';
import shortenFileSize from '$lib/helper/shortenFileSize';
import { page } from '$app/stores';
@@ -27,8 +26,7 @@
// add other properties as needed
}
let list: ListItem[] = [];
$: list;
const crimesList: ListItem[] = data.crimesList;
let open = false;
$: open;
@@ -40,38 +38,12 @@
let rename_input;
$: rename_input;
onMount(async () => {
const response = await fetch('/api/list/' + $page.params.vorgang);
const stream = response.body;
if (!stream) return;
const reader = stream.getReader();
while (true) {
const { done, value } = await reader.read();
if (done) return;
const objs = new TextDecoder()
.decode(value)
.split('\n')
.filter((i) => i.length > 0)
.map((i) => JSON.parse(i));
list = list.concat(objs);
list = list.map((item) => {
item.show_button = true;
return item;
});
}
});
function uploadSuccessful() {
open = false;
}
function defocus_element(i: number) {
let item = list[i];
let item = crimesList[i];
let text_field_id = `label__${item.name}`;
let text_field = document.getElementById(text_field_id);
@@ -81,12 +53,12 @@
}
// reshow button
list[i].show_button = true;
crimesList[i].show_button = true;
return;
}
async function handle_input(ev: KeyboardEvent, i: number) {
let item = list[i];
let item = crimesList[i];
if (ev.key == 'Escape') {
let text_field_id = `label__${item.name}`;
@@ -163,7 +135,7 @@
</div>
<div class="mx-auto flex justify-center max-w-7xl h-full">
<ul class="divide-y divide-gray-100">
{#each list as item, i}
{#each crimesList as item, i}
<li>
<a
href="/view/{$page.params.vorgang}/{item.name}"
@@ -191,20 +163,6 @@
}}>{item.name}</span
>
<!--<input
class="text-sm font-semibold leading-6 text-gray-900 inline-block min-w-1"
type="text"
name=""
on:keydown|stopPropagation={// event needed to identify ID
// TO-DO: check if event is needed or if index is sufficient
async (ev) => {
handle_input(ev, i);
}}
bind:value={item.name}
id="label__{item.name}"
/>-->
<!-- disabled={item.show_button} -->
<!-- https://iconduck.com/icons/192863/edit-rename -->
{#if item.show_button}
<button
@@ -306,6 +264,12 @@
</Modal>
</div>
{#if data.error}
<div class="max-w-xl mx-auto bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mt-4">
<strong class="font-bold">Fehler: </strong>
<span class="block sm:inline">{data.error}</span>
</div>
{/if}
<style>
ul {
min-width: 24rem;