From aa8f0494442abd2b9a4e61c68c20313ac90ea2b2 Mon Sep 17 00:00:00 2001 From: javiermengual Date: Tue, 3 Feb 2026 11:45:54 +0100 Subject: [PATCH] Refactor invoice loading and search functionality for improved performance and user experience --- src/pages/Facturas.js | 29 ++++++++++++++--------------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/src/pages/Facturas.js b/src/pages/Facturas.js index e211206..2f935dc 100755 --- a/src/pages/Facturas.js +++ b/src/pages/Facturas.js @@ -67,7 +67,7 @@ export function renderFacturasPage() { // Función para renderizar la página actual function renderPage(page = 1) { const invoicesList = container.querySelector('.invoices-list'); - + currentPage = page; totalPages = Math.ceil(filteredInvoices.length / pageSize); @@ -100,23 +100,23 @@ export function renderFacturasPage() { // Función para cargar todas las facturas async function loadAllInvoices() { const invoicesList = container.querySelector('.invoices-list'); - + try { invoicesList.innerHTML = '
Cargando facturas...
'; - + const token = localStorage.getItem('token'); - + // Construir URL con parámetros let url = `${import.meta.env.VITE_API_BASE_URL}/api/Invoices?limit=1000`; - + if (currentFilter) { url += `&status=${currentFilter}`; } - + if (searchTerm) { url += `&search=${encodeURIComponent(searchTerm)}`; } - + const response = await fetch(url, { method: 'GET', headers: { @@ -130,13 +130,13 @@ export function renderFacturasPage() { } const data = await response.json(); - + // Manejo de respuesta - obtener todas las facturas allInvoices = Array.isArray(data) ? data : data.data || data.invoices || []; filteredInvoices = [...allInvoices]; - + console.log(`Total de facturas cargadas: ${allInvoices.length}`); - + // Renderizar la primera página renderPage(1); @@ -183,16 +183,15 @@ export function renderFacturasPage() { const searchInput = container.querySelector('.search-input'); searchInput.addEventListener('input', (e) => { - const inputValue = e.target.value; + const inputValue = e.target.value.trim(); // Debounce para no hacer muchas llamadas clearTimeout(searchInput.debounceTimer); searchInput.debounceTimer = setTimeout(() => { - // Solo aplicar búsqueda si contiene al menos un número - const hasNumber = /\d/.test(inputValue); - if (hasNumber && inputValue !== 'I' && inputValue !== 'IN' && inputValue !== 'N') { + // Validación mínima: al menos 2 caracteres para activar búsqueda + if (inputValue.length >= 2) { searchTerm = inputValue; } else { - searchTerm = ''; // Si no tiene número, mostrar todas + searchTerm = ''; // Si es muy corto, mostrar todas } applyFilters(); }, 500); // Espera 500ms después de que el usuario deja de escribir