Compare commits
No commits in common. "fd0d45f721396787ad35fca2a7fd0f26d98b23e9" and "238082b657998f513111e832556926decbe84e21" have entirely different histories.
fd0d45f721
...
238082b657
@ -14,41 +14,42 @@
|
||||
accessorKey: "id",
|
||||
header: () => "id",
|
||||
},
|
||||
{
|
||||
header: "Name",
|
||||
footer: (props) => props.column.id,
|
||||
columns: [
|
||||
{
|
||||
accessorKey: "firstname",
|
||||
cell: (info) => info.getValue(),
|
||||
footer: (props) => props.column.id,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.lastname,
|
||||
id: "lastname",
|
||||
cell: (info) => info.getValue(),
|
||||
header: () => "Nachname",
|
||||
footer: (props) => props.column.id,
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => `${row.firstname} ${row.lastname}`,
|
||||
id: "fullname",
|
||||
header: "Voller Name",
|
||||
cell: (info) => info.getValue(),
|
||||
// footer: (props) => props.column.id,
|
||||
// filterFn: "fuzzy",
|
||||
// sortingFn: fuzzySort,
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// header: "Name",
|
||||
// footer: (props) => props.column.id,
|
||||
// columns: [
|
||||
// {
|
||||
// accessorKey: "firstname",
|
||||
// cell: (info) => info.getValue(),
|
||||
// footer: (props) => props.column.id,
|
||||
// },
|
||||
// {
|
||||
// accessorFn: (row) => row.lastname,
|
||||
// id: "lastname",
|
||||
// cell: (info) => info.getValue(),
|
||||
// header: () => "Nachname",
|
||||
// footer: (props) => props.column.id,
|
||||
// },
|
||||
// {
|
||||
// accessorFn: (row) => `${row.firstname} ${row.lastname}`,
|
||||
// id: "fullname",
|
||||
// header: "Voller Name",
|
||||
// cell: (info) => info.getValue(),
|
||||
// // footer: (props) => props.column.id,
|
||||
// // filterFn: "fuzzy",
|
||||
// // sortingFn: fuzzySort,
|
||||
// },
|
||||
// ],
|
||||
// accessorKey: "firstname",
|
||||
// header: () => "firstname",
|
||||
// },
|
||||
{
|
||||
accessorKey: "firstname",
|
||||
header: () => "firstname",
|
||||
},
|
||||
{
|
||||
accessorKey: "lastname",
|
||||
header: () => "lastname",
|
||||
},
|
||||
// {
|
||||
// accessorKey: "lastname",
|
||||
// header: () => "lastname",
|
||||
// }
|
||||
// ,
|
||||
{
|
||||
accessorKey: "group.name",
|
||||
header: () => "group",
|
||||
@ -214,28 +215,28 @@
|
||||
<div class="flex items-center gap-2">
|
||||
<button
|
||||
class="border rounded p-1"
|
||||
on:click={() => $table.setPageIndex(0)}
|
||||
onClick={() => $table.setPageIndex(0)}
|
||||
disabled={!$table.getCanPreviousPage()}
|
||||
>
|
||||
{"<<"}
|
||||
</button>
|
||||
<button
|
||||
class="border rounded p-1"
|
||||
on:click={() => $table.previousPage()}
|
||||
onClick={() => $table.previousPage()}
|
||||
disabled={!$table.getCanPreviousPage()}
|
||||
>
|
||||
{"<"}
|
||||
</button>
|
||||
<button
|
||||
class="border rounded p-1"
|
||||
on:click={() => $table.nextPage()}
|
||||
onClick={() => $table.nextPage()}
|
||||
disabled={!$table.getCanNextPage()}
|
||||
>
|
||||
{">"}
|
||||
</button>
|
||||
<button
|
||||
class="border rounded p-1"
|
||||
on:click={() => $table.setPageIndex($table.getPageCount() - 1)}
|
||||
onClick={() => $table.setPageIndex($table.getPageCount() - 1)}
|
||||
disabled={!$table.getCanNextPage()}
|
||||
>
|
||||
{">>"}
|
||||
@ -252,27 +253,22 @@
|
||||
<input
|
||||
type="number"
|
||||
defaultValue={$table.getState().pagination.pageIndex + 1}
|
||||
on:change={(e) => {
|
||||
onChange={(e) => {
|
||||
const page = e.target.value ? Number(e.target.value) - 1 : 0;
|
||||
$table.setPageIndex(page);
|
||||
}}
|
||||
class="border p-1 rounded w-16"
|
||||
/>
|
||||
</span>
|
||||
<select
|
||||
value={$table.getState().pagination.pageSize}
|
||||
on:change={(e) => {
|
||||
const ps = Number(e.target.value);
|
||||
console.log({ ps });
|
||||
$table.setPageSize(Number(e.target.value));
|
||||
}}
|
||||
>
|
||||
{#each [10, 25, 50, 100, 250] as pageSize}
|
||||
<option value={pageSize}>{pageSize}</option>
|
||||
{/each}
|
||||
</select>
|
||||
<!-- <select
|
||||
value={$table.getState().pagination.pageSize}
|
||||
onChange={e => {
|
||||
$table.setPageSize(Number(e.target.value))
|
||||
}}
|
||||
>
|
||||
|
||||
</select> -->
|
||||
</div>
|
||||
<pre>{JSON.stringify($table.getState(), null, 2)}</pre>
|
||||
<!-- </Datatable> -->
|
||||
{/if}
|
||||
{/if}
|
||||
|
Loading…
x
Reference in New Issue
Block a user