feat: edit persons
This commit is contained in:
Marcel
@@ -20,6 +20,22 @@ export interface paths {
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/persons/{id}": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path?: never;
|
||||
cookie?: never;
|
||||
};
|
||||
get: operations["getPerson"];
|
||||
put: operations["updatePerson"];
|
||||
post?: never;
|
||||
delete?: never;
|
||||
options?: never;
|
||||
head?: never;
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/documents/{id}": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
@@ -52,6 +68,22 @@ export interface paths {
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/persons/{id}/merge": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path?: never;
|
||||
cookie?: never;
|
||||
};
|
||||
get?: never;
|
||||
put?: never;
|
||||
post: operations["mergePerson"];
|
||||
delete?: never;
|
||||
options?: never;
|
||||
head?: never;
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/groups": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
@@ -148,22 +180,6 @@ export interface paths {
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/persons/{id}": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path?: never;
|
||||
cookie?: never;
|
||||
};
|
||||
get: operations["getPerson"];
|
||||
put?: never;
|
||||
post?: never;
|
||||
delete?: never;
|
||||
options?: never;
|
||||
head?: never;
|
||||
patch?: never;
|
||||
trace?: never;
|
||||
};
|
||||
"/api/persons/{id}/documents": {
|
||||
parameters: {
|
||||
query?: never;
|
||||
@@ -269,6 +285,13 @@ export interface components {
|
||||
id?: string;
|
||||
name?: string;
|
||||
};
|
||||
Person: {
|
||||
/** Format: uuid */
|
||||
id?: string;
|
||||
firstName?: string;
|
||||
lastName?: string;
|
||||
alias?: string;
|
||||
};
|
||||
DocumentUpdateDTO: {
|
||||
title?: string;
|
||||
/** Format: date */
|
||||
@@ -287,6 +310,7 @@ export interface components {
|
||||
id?: string;
|
||||
title?: string;
|
||||
filePath?: string;
|
||||
contentType?: string;
|
||||
originalFilename?: string;
|
||||
/** @enum {string} */
|
||||
status?: "PLACEHOLDER" | "UPLOADED" | "TRANSCRIBED" | "REVIEWED" | "ARCHIVED";
|
||||
@@ -294,6 +318,8 @@ export interface components {
|
||||
documentDate?: string;
|
||||
location?: string;
|
||||
documentLocation?: string;
|
||||
archiveBox?: string;
|
||||
archiveFolder?: string;
|
||||
transcription?: string;
|
||||
summary?: string;
|
||||
/** Format: date-time */
|
||||
@@ -304,13 +330,6 @@ export interface components {
|
||||
sender?: components["schemas"]["Person"];
|
||||
tags?: components["schemas"]["Tag"][];
|
||||
};
|
||||
Person: {
|
||||
/** Format: uuid */
|
||||
id?: string;
|
||||
firstName?: string;
|
||||
lastName?: string;
|
||||
alias?: string;
|
||||
};
|
||||
CreateUserRequest: {
|
||||
username?: string;
|
||||
email?: string;
|
||||
@@ -404,6 +423,56 @@ export interface operations {
|
||||
};
|
||||
};
|
||||
};
|
||||
getPerson: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path: {
|
||||
id: string;
|
||||
};
|
||||
cookie?: never;
|
||||
};
|
||||
requestBody?: never;
|
||||
responses: {
|
||||
/** @description OK */
|
||||
200: {
|
||||
headers: {
|
||||
[name: string]: unknown;
|
||||
};
|
||||
content: {
|
||||
"*/*": components["schemas"]["Person"];
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
updatePerson: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path: {
|
||||
id: string;
|
||||
};
|
||||
cookie?: never;
|
||||
};
|
||||
requestBody: {
|
||||
content: {
|
||||
"application/json": {
|
||||
[key: string]: string;
|
||||
};
|
||||
};
|
||||
};
|
||||
responses: {
|
||||
/** @description OK */
|
||||
200: {
|
||||
headers: {
|
||||
[name: string]: unknown;
|
||||
};
|
||||
content: {
|
||||
"*/*": components["schemas"]["Person"];
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
getDocument: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
@@ -496,6 +565,32 @@ export interface operations {
|
||||
};
|
||||
};
|
||||
};
|
||||
mergePerson: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path: {
|
||||
id: string;
|
||||
};
|
||||
cookie?: never;
|
||||
};
|
||||
requestBody: {
|
||||
content: {
|
||||
"application/json": {
|
||||
[key: string]: string;
|
||||
};
|
||||
};
|
||||
};
|
||||
responses: {
|
||||
/** @description No Content */
|
||||
204: {
|
||||
headers: {
|
||||
[name: string]: unknown;
|
||||
};
|
||||
content?: never;
|
||||
};
|
||||
};
|
||||
};
|
||||
getAllGroups: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
@@ -670,28 +765,6 @@ export interface operations {
|
||||
};
|
||||
};
|
||||
};
|
||||
getPerson: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
header?: never;
|
||||
path: {
|
||||
id: string;
|
||||
};
|
||||
cookie?: never;
|
||||
};
|
||||
requestBody?: never;
|
||||
responses: {
|
||||
/** @description OK */
|
||||
200: {
|
||||
headers: {
|
||||
[name: string]: unknown;
|
||||
};
|
||||
content: {
|
||||
"*/*": components["schemas"]["Person"];
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
getPersonDocuments: {
|
||||
parameters: {
|
||||
query?: never;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { error } from '@sveltejs/kit';
|
||||
import { error, fail, redirect } from '@sveltejs/kit';
|
||||
import { createApiClient } from '$lib/api.server';
|
||||
import { getErrorMessage } from '$lib/errors';
|
||||
|
||||
@@ -21,3 +21,49 @@ export async function load({ params, fetch }) {
|
||||
documents: docsResult.data ?? []
|
||||
};
|
||||
}
|
||||
|
||||
export const actions = {
|
||||
update: async ({ request, params, fetch }) => {
|
||||
const formData = await request.formData();
|
||||
const firstName = formData.get('firstName')?.toString().trim();
|
||||
const lastName = formData.get('lastName')?.toString().trim();
|
||||
const alias = formData.get('alias')?.toString().trim() || undefined;
|
||||
|
||||
if (!firstName || !lastName) {
|
||||
return fail(400, { updateError: 'Vor- und Nachname sind Pflichtfelder.' });
|
||||
}
|
||||
|
||||
const api = createApiClient(fetch);
|
||||
const { error: apiError } = await api.PUT('/api/persons/{id}', {
|
||||
params: { path: { id: params.id } },
|
||||
body: { firstName, lastName, ...(alias ? { alias } : {}) }
|
||||
});
|
||||
|
||||
if (apiError) {
|
||||
return fail(400, { updateError: 'Speichern fehlgeschlagen.' });
|
||||
}
|
||||
|
||||
return { updated: true };
|
||||
},
|
||||
|
||||
merge: async ({ request, params, fetch }) => {
|
||||
const formData = await request.formData();
|
||||
const targetPersonId = formData.get('targetPersonId')?.toString();
|
||||
|
||||
if (!targetPersonId) {
|
||||
return fail(400, { mergeError: 'Bitte eine Zielperson auswählen.' });
|
||||
}
|
||||
|
||||
const api = createApiClient(fetch);
|
||||
const { error: apiError } = await api.POST('/api/persons/{id}/merge', {
|
||||
params: { path: { id: params.id } },
|
||||
body: { targetPersonId }
|
||||
});
|
||||
|
||||
if (apiError) {
|
||||
return fail(400, { mergeError: 'Zusammenführen fehlgeschlagen.' });
|
||||
}
|
||||
|
||||
throw redirect(303, `/persons/${targetPersonId}`);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,6 +1,28 @@
|
||||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import PersonTypeahead from '$lib/components/PersonTypeahead.svelte';
|
||||
|
||||
export let data;
|
||||
const { person, documents } = data;
|
||||
export let form;
|
||||
|
||||
$: ({ person, documents } = data);
|
||||
|
||||
let editMode = false;
|
||||
let mergeTargetId = '';
|
||||
let mergeTargetName = '';
|
||||
let showMergeConfirm = false;
|
||||
|
||||
function enterEdit() {
|
||||
editMode = true;
|
||||
}
|
||||
|
||||
function cancelEdit() {
|
||||
editMode = false;
|
||||
}
|
||||
|
||||
$: if (form?.updated) {
|
||||
editMode = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="max-w-4xl mx-auto py-10 px-4">
|
||||
@@ -15,58 +37,169 @@
|
||||
|
||||
<!-- Header / Metadata Card -->
|
||||
<div class="bg-white shadow-sm border border-brand-sand rounded-sm overflow-hidden mb-10">
|
||||
<!-- Blue Top Border accent -->
|
||||
<div class="h-2 bg-brand-navy w-full"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<div class="flex flex-col md:flex-row gap-8 items-start">
|
||||
{#if editMode}
|
||||
<!-- Edit Form -->
|
||||
<form method="POST" action="?/update" use:enhance>
|
||||
<div class="flex flex-col gap-6">
|
||||
<h2 class="text-xl font-serif text-brand-navy border-b border-gray-100 pb-3">Person bearbeiten</h2>
|
||||
|
||||
<!-- Big Avatar / Icon -->
|
||||
<div class="flex-shrink-0">
|
||||
<div class="w-24 h-24 rounded-full bg-brand-sand/30 flex items-center justify-center text-brand-navy border border-brand-sand">
|
||||
<span class="font-serif text-3xl">{person.firstName[0]}{person.lastName[0]}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Info Grid -->
|
||||
<div class="flex-1 w-full">
|
||||
<h1 class="text-4xl font-serif text-brand-navy mb-8 border-b border-gray-100 pb-4">
|
||||
{person.firstName} {person.lastName}
|
||||
</h1>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div>
|
||||
<span class="block text-xs font-bold font-sans text-gray-400 uppercase tracking-widest mb-1">Voller Name</span>
|
||||
<span class="block text-lg font-serif text-brand-navy">{person.firstName} {person.lastName}</span>
|
||||
</div>
|
||||
|
||||
{#if person.alias}
|
||||
<div>
|
||||
<span class="block text-xs font-bold font-sans text-gray-400 uppercase tracking-widest mb-1">Rufname / Alias</span>
|
||||
<span class="block text-lg font-serif text-brand-navy italic">"{person.alias}"</span>
|
||||
</div>
|
||||
{#if form?.updateError}
|
||||
<p class="text-sm text-red-600 bg-red-50 border border-red-200 rounded px-3 py-2">{form.updateError}</p>
|
||||
{/if}
|
||||
|
||||
{#if person.birthDate}
|
||||
<div>
|
||||
<span class="block text-xs font-bold font-sans text-gray-400 uppercase tracking-widest mb-1">Geburtsdatum</span>
|
||||
<span class="block text-lg font-serif text-brand-navy">{person.birthDate}</span>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label for="firstName" class="block text-xs font-bold uppercase tracking-widest text-gray-400 mb-1">Vorname *</label>
|
||||
<input
|
||||
id="firstName"
|
||||
name="firstName"
|
||||
type="text"
|
||||
required
|
||||
value={person.firstName}
|
||||
class="block w-full border border-gray-300 rounded px-3 py-2 font-serif text-brand-navy focus:outline-none focus:border-brand-navy"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label for="lastName" class="block text-xs font-bold uppercase tracking-widest text-gray-400 mb-1">Nachname *</label>
|
||||
<input
|
||||
id="lastName"
|
||||
name="lastName"
|
||||
type="text"
|
||||
required
|
||||
value={person.lastName}
|
||||
class="block w-full border border-gray-300 rounded px-3 py-2 font-serif text-brand-navy focus:outline-none focus:border-brand-navy"
|
||||
/>
|
||||
</div>
|
||||
<div class="md:col-span-2">
|
||||
<label for="alias" class="block text-xs font-bold uppercase tracking-widest text-gray-400 mb-1">Rufname / Alias</label>
|
||||
<input
|
||||
id="alias"
|
||||
name="alias"
|
||||
type="text"
|
||||
value={person.alias ?? ''}
|
||||
class="block w-full border border-gray-300 rounded px-3 py-2 font-serif text-brand-navy focus:outline-none focus:border-brand-navy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Empty slot or Placeholder for bio/notes -->
|
||||
<div class="flex gap-3">
|
||||
<button type="submit" class="px-5 py-2 bg-brand-navy text-white text-sm font-bold uppercase tracking-widest rounded hover:bg-brand-navy/80 transition-colors">
|
||||
Speichern
|
||||
</button>
|
||||
<button type="button" on:click={cancelEdit} class="px-5 py-2 border border-gray-300 text-gray-600 text-sm font-bold uppercase tracking-widest rounded hover:bg-gray-50 transition-colors">
|
||||
Abbrechen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{:else}
|
||||
<!-- View Mode -->
|
||||
<div class="flex flex-col md:flex-row gap-8 items-start">
|
||||
<div class="flex-shrink-0">
|
||||
<div class="w-24 h-24 rounded-full bg-brand-sand/30 flex items-center justify-center text-brand-navy border border-brand-sand">
|
||||
<span class="font-serif text-3xl">{person.firstName[0]}{person.lastName[0]}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 w-full">
|
||||
<div class="flex items-start justify-between mb-8 border-b border-gray-100 pb-4">
|
||||
<h1 class="text-4xl font-serif text-brand-navy">
|
||||
{person.firstName} {person.lastName}
|
||||
</h1>
|
||||
<button on:click={enterEdit} class="ml-4 flex-shrink-0 inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-bold uppercase tracking-widest border border-gray-300 text-gray-500 rounded hover:border-brand-navy hover:text-brand-navy transition-colors">
|
||||
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
|
||||
Bearbeiten
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div>
|
||||
<span class="block text-xs font-bold font-sans text-gray-400 uppercase tracking-widest mb-1">Voller Name</span>
|
||||
<span class="block text-lg font-serif text-brand-navy">{person.firstName} {person.lastName}</span>
|
||||
</div>
|
||||
|
||||
{#if person.alias}
|
||||
<div>
|
||||
<span class="block text-xs font-bold font-sans text-gray-400 uppercase tracking-widest mb-1">Rufname / Alias</span>
|
||||
<span class="block text-lg font-serif text-brand-navy italic">"{person.alias}"</span>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Merge Section -->
|
||||
<div class="bg-white shadow-sm border border-brand-sand rounded-sm overflow-hidden mb-10">
|
||||
<div class="p-6 md:p-8">
|
||||
<h2 class="text-lg font-serif text-brand-navy mb-1">Person zusammenführen</h2>
|
||||
<p class="text-sm text-gray-500 font-sans mb-5">
|
||||
Diese Person wird in die gewählte Zielperson überführt. Alle Dokumente und Verknüpfungen werden übertragen, danach wird diese Person gelöscht.
|
||||
</p>
|
||||
|
||||
{#if form?.mergeError}
|
||||
<p class="text-sm text-red-600 bg-red-50 border border-red-200 rounded px-3 py-2 mb-4">{form.mergeError}</p>
|
||||
{/if}
|
||||
|
||||
<form method="POST" action="?/merge" use:enhance>
|
||||
<input type="hidden" name="targetPersonId" bind:value={mergeTargetId} />
|
||||
|
||||
<div class="flex flex-col sm:flex-row gap-3 items-end">
|
||||
<div class="flex-1">
|
||||
<PersonTypeahead
|
||||
name="_targetPersonDisplay"
|
||||
label="Zusammenführen mit"
|
||||
value={mergeTargetId}
|
||||
on:change={(e) => { mergeTargetId = e.detail.value; showMergeConfirm = false; }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{#if !showMergeConfirm}
|
||||
<button
|
||||
type="button"
|
||||
disabled={!mergeTargetId}
|
||||
on:click={() => showMergeConfirm = true}
|
||||
class="px-4 py-2 text-sm font-bold uppercase tracking-widest border border-red-300 text-red-600 rounded hover:bg-red-50 transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
|
||||
>
|
||||
Zusammenführen
|
||||
</button>
|
||||
{:else}
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="px-4 py-2 text-sm font-bold uppercase tracking-widest bg-red-600 text-white rounded hover:bg-red-700 transition-colors"
|
||||
>
|
||||
Ja, zusammenführen
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => showMergeConfirm = false}
|
||||
class="px-4 py-2 text-sm font-bold uppercase tracking-widest border border-gray-300 text-gray-500 rounded hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
Abbrechen
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{#if showMergeConfirm}
|
||||
<p class="mt-3 text-sm text-red-700 bg-red-50 border border-red-200 rounded px-3 py-2">
|
||||
Achtung: Diese Aktion ist nicht rückgängig zu machen. <strong>{person.firstName} {person.lastName}</strong> wird gelöscht.
|
||||
</p>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Linked Documents Section -->
|
||||
<div>
|
||||
<div class="flex items-center justify-between mb-6 border-b border-brand-navy/10 pb-2">
|
||||
<h2 class="text-xl font-serif text-brand-navy">
|
||||
Gesendete Dokumente
|
||||
</h2>
|
||||
<h2 class="text-xl font-serif text-brand-navy">Gesendete Dokumente</h2>
|
||||
<span class="bg-brand-navy text-white text-xs font-bold px-2 py-1 rounded-full">
|
||||
{documents.length}
|
||||
</span>
|
||||
@@ -83,12 +216,9 @@
|
||||
<a href="/documents/{doc.id}" class="block bg-white border border-brand-sand p-4 hover:border-brand-navy hover:shadow-md transition-all duration-200">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center gap-4 overflow-hidden">
|
||||
<!-- Icon Box -->
|
||||
<div class="flex-shrink-0 h-10 w-10 bg-brand-sand/20 text-brand-navy rounded flex items-center justify-center group-hover:bg-brand-mint group-hover:text-brand-navy transition-colors">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path></svg>
|
||||
</div>
|
||||
|
||||
<!-- Text Info -->
|
||||
<div class="min-w-0">
|
||||
<div class="font-serif text-base font-medium text-brand-navy truncate group-hover:underline decoration-brand-mint decoration-2 underline-offset-2">
|
||||
{doc.title || doc.originalFilename}
|
||||
@@ -102,12 +232,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Status & Arrow -->
|
||||
<div class="flex items-center flex-shrink-0 pl-4">
|
||||
<span class="hidden sm:inline-flex items-center px-2 py-0.5 rounded-full text-[10px] font-bold uppercase tracking-wide border
|
||||
{doc.status === 'UPLOADED'
|
||||
? 'bg-brand-mint/20 text-brand-navy border-brand-mint/50'
|
||||
{doc.status === 'UPLOADED'
|
||||
? 'bg-brand-mint/20 text-brand-navy border-brand-mint/50'
|
||||
: 'bg-yellow-50 text-yellow-800 border-yellow-200'}">
|
||||
{doc.status}
|
||||
</span>
|
||||
|
||||
Reference in New Issue
Block a user