2 Commits

Author SHA1 Message Date
6f9b386c18 Merge pull request 'implement drag and drop feature' (#46) from f120_drag_and_drop into development
All checks were successful
InnoHub Processor/tatort/pipeline/head This commit looks good
Reviewed-on: #46
2025-12-16 09:43:49 +01:00
b4d9824942 implement drag and drop feature 2025-12-16 09:23:22 +01:00

View File

@@ -287,8 +287,26 @@ Mit freundlichen Grüßen,
open = false; open = false;
isError = false; isError = false;
} }
// drag and drop functionality
let isDragging = $state(false);
function handleDrop(event) {
event.preventDefault();
isDragging = false;
if (event.dataTransfer?.files?.length) {
files = event.dataTransfer.files;
}
}
</script> </script>
<svelte:window
on:dragover|preventDefault
on:drop|preventDefault
/>
{#if data.vorgang && crimesList} {#if data.vorgang && crimesList}
<div class="-z-10 bg-white"> <div class="-z-10 bg-white">
<div class="flex flex-col items-center justify-center w-full"> <div class="flex flex-col items-center justify-center w-full">
@@ -415,7 +433,13 @@ Mit freundlichen Grüßen,
</span> </span>
</label> </label>
<div <div
class="mt-2 flex justify-center rounded-lg border border-dashed border-gray-900/25 px-6 py-10" class="mt-2 flex justify-center rounded-lg border border-dashed px-6 py-10
{isDragging
? 'border-blue-500 bg-blue-50'
: 'border-gray-900/25'}"
on:dragover|preventDefault={() => (isDragging = true)}
on:dragleave={() => (isDragging = false)}
on:drop={handleDrop}
> >
<div class="text-center"> <div class="text-center">
<FileRect /> <FileRect />