JH
John Huachaca

Config Dashboard - Copy this React, Tailwind Component to your project

eres-un-experto-Diseñador-UX/UI.-Ayúdame-a-diseñar-el-esquema-funcional-para-una-pantalla-de-una-aplicación-web-enfocada-en-la-gestión-dinámica-de-configuraciones.-Este-cuadro-de-control-debe-ser-configurable-y-editable-con-las-siguientes-características-clave:-1.-Gestión-de-Ubigeos:-o-Mostrar-una-lista-de-ubigeos-únicos-con-opciones-de-búsqueda-y-filtrado.-o-Permitir-la-selección-de-ubigeos-individuales-para-asociarlos-dinámicamente-a-zonas.-2.-Gestión-de-Zonas:-o-Los-ubigeos-seleccionados-deben-agruparse-en-zonas-específicas.-o-Las-zonas-deben-poder-configurarse-mediante-acciones-como-agregar,-editar,-eliminar-y-reorganizar.-o-Interactividad-tipo-"drag-and-drop"-para-mover-ubigeos-entre-zonas.-3.-Gestión-de-Destinos:-o-Cada-zona-debe-poder-asociarse-a-uno-o-más-destinos-(por-ejemplo,-Hub-1-y-Hub-2).-o-Los-destinos-asociados-a-una-zona-deben-mostrarse-de-forma-clara-y-editable.-4.-Restricciones-y-Validaciones:-o-Los-ubigeos-deben-ser-únicos-dentro-de-una-zona.-o-Se-debe-validar-que-las-asociaciones-entre-zonas-y-destinos-sean-correctas-(sin-duplicados-ni-errores).-5.-Interfaz-Intuitiva:-o-Incluir-columnas-principales-para-ubigeos,-zonas-y-destinos-con-una-distribución-clara.-o-Agregar-botones-de-acción-como-"Guardar-Cambios",-"Agregar-Ubigeo",-"Agregar-Zona"-y-"Cancelar".-o-Feedback-visual-inmediato-tras-realizar-acciones,-como-cambios-guardados-o-errores-detectados.-6.-Estilo-Visual:-o-Diseño-moderno-y-limpio-con-colores-distintivos-para-diferenciar-ubigeos,-zonas-y-destinos.-o-Indicadores-visuales-para-mostrar-relaciones-entre-elementos-(e.g.,-qué-zonas-están-asociadas-a-qué-destinos).-Por-favor,-crea-una-representación-gráfica-o-un-esquema-funcional-que-refleje-este-diseño-y-sea-fácil-de-implementar-para-el-equipo-de-desarrollo.-Incluye-detalles-sobre-cómo-debería-ser-la-interacción-del-usuario-en-esta-pantalla-para-garantizar-la-funcionalidad-requerida.

Prompt
Component Preview

About

ConfigDashboard - Manage unique ubigeos, zones, and destinations with drag-and-drop ease. Built with React and Tailwind. View and copy code!

Share

Last updated 1 month ago