feat: combine with search result

This commit is contained in:
tabacoWang 2024-04-08 11:23:20 +08:00
parent 872ea83c50
commit 8a9cf44dbc

View file

@ -73,10 +73,20 @@
loaded = true; loaded = true;
}); });
$: paginatedSource = users.slice( $: paginatedSource = users
paginatorSettings.page * paginatorSettings.limit, .filter((user) => {
paginatorSettings.page * paginatorSettings.limit + paginatorSettings.limit if (search === '') {
); return true;
} else {
let name = user.name.toLowerCase();
const query = search.toLowerCase();
return name.includes(query);
}
})
.slice(
paginatorSettings.page * paginatorSettings.limit,
paginatorSettings.page * paginatorSettings.limit + paginatorSettings.limit
);
$: paginatorSettings.size = users.length; $: paginatorSettings.size = users.length;
</script> </script>
@ -174,15 +184,7 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{#each paginatedSource.filter((user) => { {#each paginatedSource as user}
if (search === '') {
return true;
} else {
let name = user.name.toLowerCase();
const query = search.toLowerCase();
return name.includes(query);
}
}) as user}
<tr class="bg-white border-b dark:bg-gray-900 dark:border-gray-700 text-xs"> <tr class="bg-white border-b dark:bg-gray-900 dark:border-gray-700 text-xs">
<td class="px-3 py-2 min-w-[7rem] w-28"> <td class="px-3 py-2 min-w-[7rem] w-28">
<button <button
@ -280,12 +282,13 @@
{/each} {/each}
</tbody> </tbody>
</table> </table>
<Paginator bind:settings={paginatorSettings} showNumerals />
</div> </div>
<div class=" text-gray-500 text-xs mt-2 text-right"> <div class=" text-gray-500 text-xs mt-2 text-right">
{$i18n.t("Click on the user role button to change a user's role.")} {$i18n.t("Click on the user role button to change a user's role.")}
</div> </div>
<Paginator bind:settings={paginatorSettings} showNumerals />
</div> </div>
</div> </div>
</div> </div>