verschoben von innohub/k3s repo
This commit is contained in:
titver968
75
src/routes/(angemeldet)/list/+page.svelte
Normal file
75
src/routes/(angemeldet)/list/+page.svelte
Normal file
@@ -0,0 +1,75 @@
|
||||
<style>
|
||||
ul {
|
||||
min-width: 24rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
/**
|
||||
* @type any[]
|
||||
*/
|
||||
let list = [];
|
||||
//$: 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));
|
||||
|
||||
console.log(objs);
|
||||
list = list.concat(objs);
|
||||
}
|
||||
});
|
||||
</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">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-6 h-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M2.25 12.75V12A2.25 2.25 0 014.5 9.75h15A2.25 2.25 0 0121.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 00-1.061-.44H4.5A2.25 2.25 0 002.25 6v12a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18V9a2.25 2.25 0 00-2.25-2.25h-5.379a1.5 1.5 0 01-1.06-.44z"
|
||||
/>
|
||||
</svg>
|
||||
<div class="min-w-0 flex-auto">
|
||||
<p class="text-sm font-semibold leading-6 text-gray-900">{item.name}</p>
|
||||
</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>
|
||||
92
src/routes/(angemeldet)/list/[vorgang]/+page.svelte
Normal file
92
src/routes/(angemeldet)/list/[vorgang]/+page.svelte
Normal file
@@ -0,0 +1,92 @@
|
||||
<style>
|
||||
ul {
|
||||
min-width: 24rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
import shortenFileSize from '$lib/helper/shortenFileSize';
|
||||
import { page } from '$app/stores';
|
||||
import timeElapsed from '$lib/helper/timeElapsed';
|
||||
|
||||
/** @type {import('./$types').PageData} */
|
||||
export let data;
|
||||
|
||||
/**
|
||||
* @type any[]
|
||||
*/
|
||||
let list = [];
|
||||
$: list;
|
||||
|
||||
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));
|
||||
|
||||
console.log(objs);
|
||||
list = list.concat(objs);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="-z-10 bg-white">
|
||||
<div class="flex flex-col items-center justify-center w-full">
|
||||
<h1 class="text-xl">Vorgang {$page.params.vorgang}</h1>
|
||||
</div>
|
||||
<div class="mx-auto flex justify-center max-w-7xl h-full">
|
||||
<ul class="divide-y divide-gray-100">
|
||||
{#each list as item}
|
||||
<li>
|
||||
<a
|
||||
href="/view/{$page.params.vorgang}/{item.name}"
|
||||
class="flex justify-between gap-x-6 py-5"
|
||||
>
|
||||
<div class="flex gap-x-4">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-6 h-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M21 7.5l-2.25-1.313M21 7.5v2.25m0-2.25l-2.25 1.313M3 7.5l2.25-1.313M3 7.5l2.25 1.313M3 7.5v2.25m9 3l2.25-1.313M12 12.75l-2.25-1.313M12 12.75V15m0 6.75l2.25-1.313M12 21.75V19.5m0 2.25l-2.25-1.313m0-16.875L12 2.25l2.25 1.313M21 14.25v2.25l-2.25 1.313m-13.5 0L3 16.5v-2.25"
|
||||
/>
|
||||
</svg>
|
||||
<div class="min-w-0 flex-auto">
|
||||
<p class="text-sm font-semibold leading-6 text-gray-900">{item.name}</p>
|
||||
<p class="mt-1 truncate text-xs leading-5 text-gray-500">
|
||||
{shortenFileSize(item.size)}
|
||||
</p>
|
||||
</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>
|
||||
<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>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user