fix layout by reordering anker element

src/lib/helper/caseNumberOccupied.js

@@ -6,7 +6,7 @@ import { client } from '$lib/minio';
  * @returns {Promise<boolean>}
  */
 export default async function caseNumberOccupied(caseNumber) {
-	const prefix = `${caseNumber}/config.json`;
+	const prefix = `${caseNumber}`;
 	const promise = new Promise((resolve) => {
 		let stream = client.listObjectsV2('tatort', prefix, false, '');
 		stream.on('data', () => {

src/lib/helper/getCode.js

@@ -0,0 +1,10 @@
+export default async function get_code(case_no) {
+	let url = `/api/list/${case_no}/code`;
+	const response = await fetch(url);
+
+	if (response.status == 200) {
+		return response.text();
+	} else {
+		return -1;
+	}
+}

src/routes/(angemeldet)/list/[vorgang]/+page.svelte

@@ -18,8 +18,6 @@
 	/** @type {import('./$types').PageData} */
 	export let data;
 
-	console.log(`--- ${data.user.admin}`);
-
 	interface ListItem {
 		name: string;
 		size: number;
@@ -170,14 +168,15 @@
 		<ul class="divide-y divide-gray-100">
 			{#each list as item, i}
 				<li>
-					<div class=" flex gap-x-4">
 						<a
 							href="/view/{$page.params.vorgang}/{item.name}"
 							class=" flex justify-between gap-x-6 py-5"
 							aria-label="zum 3D-modell"
 						>
+					<div class=" flex gap-x-4">
+
 							<Cube />
-						</a>
+					
 						<div class="min-w-0 flex-auto">
 							{#if data.user.admin}
 								<span
@@ -197,7 +196,7 @@
 									}}>{item.name}</span
 								>
 
-								<input
+								<!--<input
 									class="text-sm font-semibold leading-6 text-gray-900 inline-block min-w-1"
 									type="text"
 									name=""
@@ -208,7 +207,7 @@
 									}}
 									bind:value={item.name}
 									id="label__{item.name}"
-								/>
+								/>-->
 								<!-- disabled={item.show_button} -->
 								<!-- https://iconduck.com/icons/192863/edit-rename -->
 
@@ -293,6 +292,7 @@
 							>
 						</p>
 					</div>
+	</a>
 				</li>
 			{/each}
 		</ul>

src/routes/(angemeldet)/upload/+page.server.js

@@ -1,5 +1,6 @@
 import path from 'path';
 import { writeFile } from 'fs/promises';
+import { Buffer } from 'buffer';
 import { createReadStream } from 'fs';
 /** import Minio from 'minio'; */
 import { Readable } from 'stream';
@@ -22,6 +23,7 @@ export const actions = {
 		const vorgang = data.get('vorgang');
 		const name = data.get('name');
 		const type = data.get('type');
+		const code = data.get('zugangscode');
 		const fileName = data.get('fileName');
 
 		let objectName = `${vorgang}/${name}`;
@@ -35,6 +37,14 @@ export const actions = {
 
 		const url = await client.presignedPutObject('tatort', objectName);
 
+		// store code in S3
+		// tatort/<vorgang>/__perm__
+		const code_filename = '__perm__';
+		const buf = Buffer.from(code, 'utf-8');
+		const code_stream = Readable.from(buf);
+		const code_path = `${vorgang}/${code_filename}`;
+		await client.putObject('tatort', code_path, code_stream);
+
 		return { url };
 	},
 	validate: async ({ request }) => {

src/routes/(angemeldet)/upload/+page.svelte

@@ -16,10 +16,20 @@
 	let inProgress = false;
 	let vorgang = '';
 	const code_len = 8;
-	let zugangscode = Math.random()
+
+	function generate_token() {
+		return Math.random()
 		.toString(36)
 		.slice(2, 2 + code_len);
+	}
+	let zugangscode = ''
+	let zugangscode_old = ''
+	$: zugangscode_old = generate_token();
+	$: zugangscode = zugangscode_old
+
 	let case_existing = undefined;
+	$: case_existing = false;
+
 	let name = '';
 	/** @type {?string}*/
 	let etag = null;
@@ -66,6 +76,7 @@
 		let data = new FormData();
 		data.append('vorgang', vorgang);
 		data.append('name', name);
+		data.append('zugangscode', zugangscode);
 		if (files?.length === 1) {
 			data.append('type', files[0].type);
 			data.append('fileName', files[0].name);
@@ -147,25 +158,54 @@
 		}
 	}
 
-	// return true or false
+	// `/(angemeldet)/view` return true or false
 	async function case_exists(case_no) {
-		console.log('--- fired');
-		// ping `/(angemeldet)/view` with caseNumber in POST body
+
+		if (case_no == '') {
+			zugangscode = zugangscode_old;
+		}
+
+		// ping `/view` with caseNumber in POST body
 		let url = '/view';
+
 		let data = new FormData();
 		data.append('caseNumber', case_no);
+
+		// fetch code in parallel
+		const code = await get_code(case_no);
+		if (code != -1) {
+			zugangscode = code;
+			case_existing = true;
+			return true
+		}
+
 		const response = await fetch(url, { method: 'POST', body: data });
 
-		const code = response.status;
+		const res_json = await response.json();
+		const status = res_json.status;
 
-		console.log(`+++ ${response.redirected}`);
-
-		if (code == 303) {
-			return true;
+		if (status != 303) {
+			case_existing = false;
+			zugangscode = zugangscode_old;
 		}
 
 		return false;
 	}
+
+	async function get_code(case_no) {
+
+		if (case_no == '') return;
+
+		let url = `/api/list/${case_no}/code`;
+		const response = await fetch(url);
+
+		if (response.status == 200) {
+			return response.text();
+		} else {
+			return -1;
+		}
+	}
+
 </script>
 
 <div class="mx-auto max-w-2xl">
@@ -207,12 +247,17 @@
 						{#if formErrors?.vorgang}
 							<p class="block text-sm leading-6 text-red-900 mt-2">{formErrors.vorgang}</p>
 						{/if}
+						{#if case_existing && vorgang.length > 0}
+							<span>Datei wird zum existierenden Vorgang hinzugefügt.</span>
+						{:else if vorgang.length > 0}
+							<span>Neuer Vorgang wird angelegt.</span>
+						{/if}
 					</div>
 
 					<div>
 						<label for="name" class="block text-sm font-medium leading-6 text-gray-900"
-							><span class="flex"
-								>{#if formErrors?.name}
+						><span class="flex"
+							>{#if formErrors?.name}
 									<span class="inline-block mr-1"><Exclamation /></span>
 								{/if} Name</span
 							></label
@@ -253,9 +298,18 @@
 									type="text"
 									name="zugangscode"
 									id="zugangscode"
+									on:input="{ (ev) => { zugangscode_old = ev.target.value }}"
 									class="block flex-1 border-0 bg-transparent py-1.5 pl-1 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6"
 								/>
+
 							</div>
+							<button
+							class="rounded-md bg-blue-500 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+							on:click="{() => {
+							zugangscode = zugangscode_old = generate_token(); }}"
+							type="button">
+								Generiere Zugangscode
+							</button>
 						</div>
 						{#if formErrors?.code}
 							<p class="block text-sm leading-6 text-red-900 mt-2">{formErrors.code}</p>

src/routes/(angemeldet)/view/+page.server.js

@@ -1,15 +1,15 @@
 import caseNumberOccupied from '$lib/helper/caseNumberOccupied';
 import { fail, redirect } from '@sveltejs/kit';
+import { client } from '$lib/minio';
 
 /** @type {import('./$types').Actions} */
 export const actions = {
 	default: async ({ request }) => {
 		const data = await request.formData();
-		console.log(`--- ${Object.keys(data)}`)
 		const caseNumber = data.get('caseNumber');
+		const user_token = data.get('token');
 
 		if (!caseNumber) {
-			console.log('^^^ here')
 			return fail(400, {
 				success: false,
 				caseNumber,
@@ -17,20 +17,59 @@ export const actions = {
 			});
 		}
 
-		let res = (await caseNumberOccupied(caseNumber))
-		console.log(`gibt es? ${res} + ${caseNumber}`)
 		if (!(await caseNumberOccupied(caseNumber))) {
-			console.log('^^^ there')
 			return fail(400, {
 				success: false,
 				caseNumber,
 				error: { caseNumber: 'Die Vorgangsnummer existiert in dieser Anwendung nicht.' }
 			});
 		}
-		else {
-			throw redirect(303, `/list/${caseNumber}`);
-			console.log(`---blabla ${caseNumber}`)
+
+		//
+		// Ab hier ist Vorgang vorhanden
+		//
+
+		// Jetzt prüfen, ob Code vorhanden ist und
+		// dem eingegebenen Code entspricht
+
+		const token = await get_code_or_null(caseNumber);
+		console.log(`xxx ${token}, ${user_token}`);
+
+		// token vorhanden, check ob gleich sind
+		if (token && token != user_token) {
+			console.log(`ooo token check`);
+			return fail(400, {
+				success: false,
+				caseNumber,
+				error: { token: 'Der Token ist falsch.' }
+			});
 		}
 
+		redirect(303, `/list/${caseNumber}`);
 	}
 };
+
+// returns `code` oder `null`
+
+async function get_code_or_null(vorg) {
+	const code_name = '__perm__';
+	const obj_path = `${vorg}/${code_name}`;
+
+	let resp = null;
+	let code_saved = '';
+
+	try {
+		resp = await client.getObject('tatort', obj_path);
+		code_saved = await new Response(resp).text();
+	} catch (error) {
+		if (error.name == 'S3Error') {
+			resp = null;
+		}
+	}
+
+	if (resp != null) {
+		return code_saved;
+	} else {
+		return null;
+	}
+}

src/routes/(angemeldet)/view/+page.svelte

@@ -50,6 +50,29 @@
 							<p class="block text-sm leading-6 text-red-900 mt-2">{form.error.caseNumber}</p>
 						{/if}
 					</div>
+
+					<div>
+						<label for="token" class="block text-sm font-medium leading-6 text-gray-900"
+							><span class="flex"> Zugangscode</span></label
+						>
+						<div class="mt-2 w-full">
+							<div
+								class="flex w-full rounded-md shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-inset focus-within:ring-indigo-600"
+							>
+								<input
+									value={false || ''}
+									placeholder="optional"
+									type="text"
+									name="token"
+									id="token"
+									class="block w-full flex-1 border-0 bg-transparent py-1.5 pl-1 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6"
+								/>
+							</div>
+						</div>
+						{#if form?.error?.token}
+							<p class="block text-sm leading-6 text-red-900 mt-2">{form.error.token}</p>
+						{/if}
+					</div>
 				</div>
 			</div>
 			<div class="mt-6 flex items-center justify-end gap-x-6">

src/routes/api/list/[[vorgang]]/+server.js

@@ -15,6 +15,8 @@ export async function GET({ params }) {
 
 				const name = data.name.slice(prefix.length);
 				if (name === 'config.json') return;
+				// zugangscode datei
+				if (name === '__perm__') return;
 
 				controller.enqueue(`${JSON.stringify({ ...data, name, prefix })}\n`);
 			});
@@ -34,30 +36,27 @@ export async function GET({ params }) {
 	});
 }
 
-
 export async function DELETE({ params }) {
-	const vorgang = params.vorgang
+	const vorgang = params.vorgang;
 
 	const object_list = await new Promise((resolve, reject) => {
-
-		const res = []
-		const items_str = client.listObjects('tatort', vorgang, true)
+		const res = [];
+		const items_str = client.listObjects('tatort', vorgang, true);
 
 		items_str.on('data', (obj) => {
-			res.push(obj.name)
-		})
+			res.push(obj.name);
+		});
 
-		items_str.on('error', reject)
+		items_str.on('error', reject);
 
 		items_str.on('end', async () => {
-			resolve(res)
-		})
+			resolve(res);
+		});
 
-		console.log(`+++ ${vorgang}`)
+		console.log(`+++ ${vorgang}`);
+	});
 
-	})
+	await client.removeObjects('tatort', object_list);
 
-	await client.removeObjects('tatort', object_list)
-
-    return new Response(null, { status: 204 });
-};
+	return new Response(null, { status: 204 });
+}

src/routes/api/list/[[vorgang]]/code/+server.js

@@ -0,0 +1,28 @@
+import { json } from '@sveltejs/kit';
+import { client } from '$lib/minio';
+import { Readable } from 'stream';
+import { Buffer } from 'buffer';
+
+/** @type {import('./$types').RequestHandler} */
+export async function GET({ params }) {
+	const prefix = params.vorgang ? `${params.vorgang}` : '';
+
+	const code_name = '__perm__';
+	const obj_path = `${prefix}/${code_name}`;
+
+	let result = null;
+
+	try {
+		result = await client.getObject('tatort', obj_path);
+	} catch (error) {
+		if (error.name == 'S3Error') {
+			result = null;
+		}
+	}
+
+	if (result != null) {
+		return new Response(result, { status: 200 });
+	} else {
+		return new Response(null, { status: 404 });
+	}
+}