fix: reset merge form after redirect
This commit is contained in:
@@ -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"
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user