From ec9ec1f58a28855a4a1d651033c95b0c80b68df5 Mon Sep 17 00:00:00 2001 From: fede Date: Thu, 12 Feb 2026 18:14:31 -0300 Subject: [PATCH] =?UTF-8?q?fix:=20a=C3=B1adida=20paginacion?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/lib/components/TablaUsuarios.svelte | 57 +++++++++++++------------ src/lib/hooks/UsuariosAdmin.ts | 42 +++++++++--------- src/lib/hooks/busquedaAdminUsuarios.ts | 18 +++++--- src/routes/(privado)/admin/+page.svelte | 3 +- src/routes/(privado)/admin/+page.ts | 9 ++-- 5 files changed, 68 insertions(+), 61 deletions(-) diff --git a/src/lib/components/TablaUsuarios.svelte b/src/lib/components/TablaUsuarios.svelte index 4572fd5..fb67d66 100644 --- a/src/lib/components/TablaUsuarios.svelte +++ b/src/lib/components/TablaUsuarios.svelte @@ -33,10 +33,12 @@ interface Props { usuarios: UserResponseDto[]; + hayMas: boolean; } - let { usuarios = $bindable() }: Props = $props(); + let { usuarios = $bindable(), hayMas }: Props = $props(); + let hayMass = $state(hayMas); let open = $state(false); let openModificarUsuario = $state(false); let openDarAdmin = $state(false); @@ -112,19 +114,18 @@ // $inspect(usuarios); let timeoutId: ReturnType | number | undefined; - function buscarUsuarios() { if (timeoutId) { clearTimeout(timeoutId); } timeoutId = setTimeout(async () => { - paginaActual = 1; if (search === '') { - usuariosFiltrados = usuarios; - return; + search = ''; } - usuariosFiltrados = await busquedaAdminUsuarios(search); + let ret = await busquedaAdminUsuarios(search, ITEMS_POR_PAGINA, paginaActual); + usuariosFiltrados = ret.usuarios; + hayMass = ret.hayMas; }, 200); return () => { @@ -135,11 +136,9 @@ let paginaActual = $state(1); - const totalPaginas = $derived(Math.ceil(usuariosFiltrados.length / ITEMS_POR_PAGINA)); - - const usuariosPaginados = $derived( - usuariosFiltrados.slice((paginaActual - 1) * ITEMS_POR_PAGINA, paginaActual * ITEMS_POR_PAGINA) - ); + // const usuariosPaginados = $derived( + // usuariosFiltrados.slice((paginaActual - 1) * ITEMS_POR_PAGINA, paginaActual * ITEMS_POR_PAGINA) + // );
@@ -184,7 +183,7 @@

No hay usuarios por el nombre de: {search}

{:else} - {#each usuariosPaginados as usuario} + {#each usuariosFiltrados as usuario} @ @@ -253,23 +252,25 @@
-

- Página {paginaActual} de {totalPaginas} -

+ -
- - - -
+
diff --git a/src/lib/hooks/UsuariosAdmin.ts b/src/lib/hooks/UsuariosAdmin.ts index e27cdea..94e5ed3 100644 --- a/src/lib/hooks/UsuariosAdmin.ts +++ b/src/lib/hooks/UsuariosAdmin.ts @@ -1,25 +1,25 @@ -import { apiBase } from "@/stores/url"; -import { sesionStore } from "@/stores/usuario"; -import { redirect } from "@sveltejs/kit"; -import { get } from "svelte/store"; -import type { UserResponseDto } from "../../types"; +import { apiBase } from '@/stores/url'; +import { sesionStore } from '@/stores/usuario'; +import { redirect } from '@sveltejs/kit'; +import { get } from 'svelte/store'; +import type { UserResponseDto } from '../../types'; export async function fetchUsuariosAdmin(page: number, limit: number) { - let response = await fetch(get(apiBase) + `/api/admin/users?page=${page}&pageSize=${limit}`,{ - method: 'GET', - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${get(sesionStore)?.accessToken}` - } - }); + let response = await fetch(get(apiBase) + `/api/admin/users?page=${page}&pageSize=${limit}`, { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${get(sesionStore)?.accessToken}` + } + }); - if (response.status === 401) { - throw redirect(302, '/'); - } + if (response.status === 401) { + throw redirect(302, '/'); + } - if (!response.ok) { - return { error: true }; - } - const usuarios: UserResponseDto[] = await response.json(); - return { usuarios, error: false }; -} \ No newline at end of file + if (!response.ok) { + return { error: true }; + } + const ret: { usuarios: UserResponseDto[]; hayMas: boolean } = await response.json(); + return { ret, error: false }; +} diff --git a/src/lib/hooks/busquedaAdminUsuarios.ts b/src/lib/hooks/busquedaAdminUsuarios.ts index ce1b2d1..0234190 100644 --- a/src/lib/hooks/busquedaAdminUsuarios.ts +++ b/src/lib/hooks/busquedaAdminUsuarios.ts @@ -2,15 +2,19 @@ import { apiBase } from '@/stores/url'; import { sesionStore } from '@/stores/usuario'; import { get } from 'svelte/store'; -export async function busquedaAdminUsuarios(q: string) { +export async function busquedaAdminUsuarios(q: string, limit = 5, page = 1) { try { - const response = await fetch(get(apiBase) + '/api/admin/users?q=' + q, { - method: 'GET', - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${get(sesionStore)?.accessToken}` + const response = await fetch( + get(apiBase) + + `/api/admin/users${q ? `?q=${q}` : ''}${q ? '&' : '?'}page=${page}&pageSize=${limit}`, + { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${get(sesionStore)?.accessToken}` + } } - }); + ); if (response.ok) { return await response.json(); } diff --git a/src/routes/(privado)/admin/+page.svelte b/src/routes/(privado)/admin/+page.svelte index ea7a515..4a69be7 100644 --- a/src/routes/(privado)/admin/+page.svelte +++ b/src/routes/(privado)/admin/+page.svelte @@ -10,6 +10,7 @@ interface Prop { data: { usuarios?: UserResponseDto[]; + hayMas: boolean; error: boolean; }; } @@ -31,7 +32,7 @@ {#if data.usuarios?.length === 0} No hay usuarios que mostar {:else} - + {/if} diff --git a/src/routes/(privado)/admin/+page.ts b/src/routes/(privado)/admin/+page.ts index 6e24889..17ad0f9 100644 --- a/src/routes/(privado)/admin/+page.ts +++ b/src/routes/(privado)/admin/+page.ts @@ -3,16 +3,17 @@ import { fetchUsuariosAdmin } from '@/hooks/UsuariosAdmin.js'; export const ssr = false; -export const load: PageLoad = async ({ depends}) => { +export const load: PageLoad = async ({ depends }) => { depends('admin:load'); - const result = await fetchUsuariosAdmin(1, 10); + const result = await fetchUsuariosAdmin(1, 5); if (result.error) { return { error: true }; } return { - usuarios: result.usuarios, + usuarios: result.ret?.usuarios, + hayMas: result.ret?.hayMas, error: false }; -} +};