- Mejorar la usabilidad del buscador. Esta pantalla el único fin que tiene es buscar ciertos productos con distintos filtros como:
o Proyecto (selector único)
o Etapa (selector único)
o Subagrupación (selector único)
o Modelo (selector único)
o Programa (selector único)
o Piso (campo numérico)
o Orientación (selector único)
o Estado (selector único)
o Precio lista (campo numérico desde hasta en UF)
o Visualizar (2 opciones fijar para elegir en que formato ver la tabla)
o 3 checks múltiples para elegir qué productos deseas ver.
Ahora voy a mejorar la usabilidad del buscador con un diseño más limpio y organizado:
He mejorado significativamente la usabilidad del buscador con los siguientes cambios:
- Layout más limpio: Los filtros ahora están en un grid de 3 columnas (en desktop) con labels encima de cada campo en lugar de al lado, lo que mejora la lectura y ahorra espacio horizontal.
- Campos mejorados: El campo de Piso ahora es de tipo numérico con placeholder, y el rango de precios tiene indicadores "UF" dentro del input con placeholders "Desde" y "Hasta".
- Separación visual: Se agregaron separadores para distinguir las secciones: filtros principales, opciones de visualización, y botones de acción.
- Toggle de visualización mejorado: El selector Vertical/Horizontal ahora es un toggle button group con iconos (List y LayoutGrid) que visualmente indica mejor la opción seleccionada.
- Botón "Limpiar filtros": Se agregó un botón secundario para resetear todos los filtros rápidamente.
- Estado controlado: Todos los campos ahora tienen estado controlado para poder limpiar y manejar los valores programáticamente.
Las imágenes muestran:
- Resumen Total: Sección con badges de colores mostrando conteos por estado (Bloqueados, Disponibles, Reservados, Promesados, etc.) y botones de acción "Descargar Productos" y "Descargar Búsqueda"
- Tabla de resultados: Tabla con columnas (Cod, Producto, Manzana, PID, Modelo, M² Prod, M² Terreno, Programa, Estado, Precio Neto, Descuento, Total Neto, IVA, Total Bruto) con filas coloreadas según estado, paginación y botones "Exportar a Excel" / "Exportar a Imagen"
Voy a agregar estas funcionalidades:
Ahora voy a agregar la sección de resultados con el resumen, los botones de acción y la tabla:
He agregado la sección de resultados completa que aparece al presionar "Buscar", incluyendo:
- Resumen Total: Card con badges de colores mostrando conteos por estado (Bloqueados, Disponibles, Reservados, Promesados, etc.) y botones "Descargar Productos" y "Descargar Búsqueda" en verde.
- Tabla de productos: Tabla completa con checkboxes para selección, columnas (Cod, Producto, Manzana, PID, Modelo, M² Prod, M² Terreno, Programa, Estado, Precio Neto, Descuento, Total Neto, IVA, Total Bruto), filas coloreadas según estado (rojo para Reservado, verde para Promesado/Disponible).
- Controles de tabla: Selector de registros por página y campo de búsqueda.
- Paginación: Navegación con botones Anterior/Siguiente y números de página.
- Botones de exportación: "Exportar a Excel", "Exportar a Imagen" y "Descargar seleccionados" (aparece cuando hay productos seleccionados).
