From 8a9cf44dbc2c7c377659dfcbeb39905575edfeea Mon Sep 17 00:00:00 2001
From: tabacoWang <7a6ac0@users.noreply.github.com>
Date: Mon, 8 Apr 2024 11:23:20 +0800
Subject: [PATCH] feat: combine with search result

---
 src/routes/(app)/admin/+page.svelte | 31 ++++++++++++++++-------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/src/routes/(app)/admin/+page.svelte b/src/routes/(app)/admin/+page.svelte
index 92a8315b63..6d153d8a84 100644
--- a/src/routes/(app)/admin/+page.svelte
+++ b/src/routes/(app)/admin/+page.svelte
@@ -73,10 +73,20 @@
 		loaded = true;
 	});
 
-	$: paginatedSource = users.slice(
-		paginatorSettings.page * paginatorSettings.limit,
-		paginatorSettings.page * paginatorSettings.limit + paginatorSettings.limit
-	);
+	$: paginatedSource = users
+		.filter((user) => {
+			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;
 </script>
@@ -174,15 +184,7 @@
 										</tr>
 									</thead>
 									<tbody>
-										{#each paginatedSource.filter((user) => {
-											if (search === '') {
-												return true;
-											} else {
-												let name = user.name.toLowerCase();
-												const query = search.toLowerCase();
-												return name.includes(query);
-											}
-										}) as user}
+										{#each paginatedSource as user}
 											<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">
 													<button
@@ -280,12 +282,13 @@
 										{/each}
 									</tbody>
 								</table>
-								<Paginator bind:settings={paginatorSettings} showNumerals />
 							</div>
 
 							<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.")}
 							</div>
+
+							<Paginator bind:settings={paginatorSettings} showNumerals />
 						</div>
 					</div>
 				</div>