Added filter

This commit is contained in:
Nicolai Ort 2023-04-12 15:40:43 +02:00
parent a59dbbe50e
commit a9cdac4f74
Signed by: niggl
GPG Key ID: 13AFA55AF62F269F

View File

@ -5,6 +5,7 @@
createSvelteTable,
flexRender,
getCoreRowModel,
getFilteredRowModel,
} from "@tanstack/svelte-table";
const columns = [
@ -95,6 +96,7 @@
data: [],
columns: columns,
getCoreRowModel: getCoreRowModel(),
getFilteredRowModel: getFilteredRowModel(),
});
const table = createSvelteTable(options);
onMount(() => {
@ -154,6 +156,36 @@
header.getContext()
)}
/>
{#if header.column.getCanFilter()}
<div class="relative max-w-xs">
<input
title="name-search"
value={header.column.getFilterValue() || ""}
on:keydown={(e) => {
header.column.setFilterValue(e.target.value);
}}
type="text"
class="block rounded-md border-gray-200 py-2 pl-8 text-xs focus:border-blue-500 focus:ring-blue-500"
placeholder=""
/>
<div
class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-2"
>
<svg
class="h-3.5 w-3.5 text-gray-400"
xmlns="http://www.w3.org/2000/svg"
width={16}
height={16}
fill="currentColor"
viewBox="0 0 16 16"
>
<path
d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"
/>
</svg>
</div>
</div>
{/if}
{/if}
</th>
{/each}