fix: reset merge form after redirect

This commit is contained in:
Marcel
2026-03-15 21:00:01 +00:00
parent ee279a29e5
commit c2625657e2
2 changed files with 24 additions and 13 deletions

View File

@@ -61,6 +61,15 @@
dispatch('change', { value: person.id }); dispatch('change', { value: person.id });
} }
let inputEl: HTMLInputElement;
let dropdownStyle = '';
function updateDropdownPosition() {
if (!inputEl) return;
const rect = inputEl.getBoundingClientRect();
dropdownStyle = `position:fixed;top:${rect.bottom + 4}px;left:${rect.left}px;width:${rect.width}px`;
}
function clickOutside(node: HTMLElement) { function clickOutside(node: HTMLElement) {
const handleClick = (event: any) => { const handleClick = (event: any) => {
if (node && !node.contains(event.target) && !event.defaultPrevented) { if (node && !node.contains(event.target) && !event.defaultPrevented) {
@@ -74,30 +83,36 @@
} }
</script> </script>
<svelte:window on:scroll={updateDropdownPosition} on:resize={updateDropdownPosition} />
<div class="relative" use:clickOutside> <div class="relative" use:clickOutside>
<label for={name} class="block text-sm font-medium text-gray-700">{label}</label> <label for={name} class="block text-sm font-medium text-gray-700">{label}</label>
<input type="hidden" {name} bind:value={value} /> <input type="hidden" {name} bind:value={value} />
<input <input
bind:this={inputEl}
type="text" type="text"
id="{name}-search" id="{name}-search"
autocomplete="off" autocomplete="off"
bind:value={searchTerm} bind:value={searchTerm}
on:input={handleInput} on:input={handleInput}
on:focus={() => showDropdown = true} on:focus={() => { updateDropdownPosition(); showDropdown = true; }}
placeholder="Namen tippen..." placeholder="Namen tippen..."
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm border p-2 focus:ring-blue-500 focus:border-blue-500" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm border p-2 focus:ring-blue-500 focus:border-blue-500"
/> />
{#if showDropdown && (results.length > 0 || loading)} {#if showDropdown && (results.length > 0 || loading)}
<div class="absolute z-10 mt-1 w-full bg-white shadow-lg max-h-60 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm"> <div
style={dropdownStyle}
class="z-50 bg-white shadow-lg max-h-60 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm"
>
{#if loading} {#if loading}
<div class="p-2 text-gray-500 text-sm">Suche...</div> <div class="p-2 text-gray-500 text-sm">Suche...</div>
{:else} {:else}
{#each results as person} {#each results as person}
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<div <div
class="cursor-pointer select-none relative py-2 pl-3 pr-9 hover:bg-blue-100 text-gray-900" class="cursor-pointer select-none relative py-2 pl-3 pr-9 hover:bg-blue-100 text-gray-900"
on:click={() => selectPerson(person)} on:click={() => selectPerson(person)}
role="button" role="button"

View File

@@ -9,20 +9,14 @@
let editMode = false; let editMode = false;
let mergeTargetId = ''; let mergeTargetId = '';
let mergeTargetName = '';
let showMergeConfirm = false; let showMergeConfirm = false;
function enterEdit() { function enterEdit() { editMode = true; }
editMode = true; function cancelEdit() { editMode = false; }
}
function cancelEdit() { $: if (form?.updated) { editMode = false; }
editMode = false;
}
$: if (form?.updated) { $: person.id, (() => { mergeTargetId = ''; showMergeConfirm = false; })();
editMode = false;
}
</script> </script>
<div class="max-w-4xl mx-auto py-10 px-4"> <div class="max-w-4xl mx-auto py-10 px-4">
@@ -135,6 +129,7 @@
</div> </div>
<!-- Merge Section --> <!-- Merge Section -->
{#key person.id}
<div class="bg-white shadow-sm border border-brand-sand rounded-sm overflow-hidden mb-10"> <div class="bg-white shadow-sm border border-brand-sand rounded-sm overflow-hidden mb-10">
<div class="p-6 md:p-8"> <div class="p-6 md:p-8">
<h2 class="text-lg font-serif text-brand-navy mb-1">Person zusammenführen</h2> <h2 class="text-lg font-serif text-brand-navy mb-1">Person zusammenführen</h2>
@@ -195,6 +190,7 @@
</form> </form>
</div> </div>
</div> </div>
{/key}
<!-- Linked Documents Section --> <!-- Linked Documents Section -->
<div> <div>