Auto-Provision UX — panel en vivo + asignación inline (s115)
Resumen
En la sesión s115, se completaron las Partes 2 y 3 de la iniciativa Auto-Provision UX, cerrando la iniciativa conjuntamente con el botón Refresh y las búsquedas guardadas. Dos mejoras sustanciales que simplifican el flujo de descubrimiento e ingesta masiva de equipos de red.
Parte 2: Panel de descubrimiento en vivo
Durante el escaneo (single device o subnet scan), dentro del modal de Auto-Provision aparece un panel en vivo que muestra:
-
Lista de fases (izquierda): Ping → ARP → SNMP → HTTP → Enrich. Cada fase pasa por estados:
- Pending (defecto, gris).
- Active (latido azul con anillo expansivo).
- Done (check verde + hito fijo, p.ej. “3 hosts alive”, “2 SNMP OK”).
- Skipped (línea punteada, si la fase es opcional o falla).
-
Feed de dispositivos (derecha): lista scrollable que se rellena conforme aparecen dispositivos en cada fase. Cada item muestra:
- IP del dispositivo (monospace).
- Vendor + tipo detectado (p.ej. “Cisco · Switch”).
- Badge de método de descubrimiento (SNMP/SSH/PING con colores).
- Micro-animación de entrada (respeta
prefers-reduced-motion).
Componentes:
- Nuevo módulo
static/js/network/auto_provision/live_panel.js(LivePanel). - HTML en
#discovery-progress(debajo de la barra existente). - CSS en
static/css/pages/auto_provision.css. - Mock de diseño:
_design/autoprovision-live-panel.html(716 líneas, funcional y documentado).
Interfaz pública (LivePanel):
LivePanel.setPhaseActive(phase) // marca fase actual
LivePanel.setPhaseDone(phase, milestone) // fija fase + hito
LivePanel.setPhaseSkipped(phase, milestone) // fase omitida
LivePanel.addDevice({ip, vendor, type, method}) // inserta dispositivo en feed
LivePanel.reset() // resetea para nuevo escaneo
Parte 3: Asignación de destino inline + Apply
El Step 2 (tabla de resultados) ahora incluye:
-
Columna “Destination” por dispositivo: desplegable con opciones prerellenadas según tipo detectado:
- Rack
- Wireless AP
- Wireless Controller
- UPS
- Digital Signage
- Observatory
-
Barra de asignación masiva:
- “Apply to selected” — selecciona filas marcadas y asigna el mismo destino en bloque.
- “Auto by type” — rellena todos automáticamente según sus tipos detectados.
-
Botón “Apply” (parpadeo + globo informativo):
- Llama al nuevo endpoint
POST /auto-provision/assign-types(Parte 3). - Crea/rutea todo en una pasada (no requiere pasos intermedios).
- Persist device_type en DeviceProfile (clave que usan monitores para incluir el equipo).
- Llama al nuevo endpoint
Se elimina el Step 3 (selector de destinos que había antes). El asistente queda en 2 pasos únicamente.
Nuevo endpoint:
POST /auto-provision/assign-types(network/api/assign.py)- Requiere:
require_perm(network, edit)+ scope org (cross-tenant safe). - Payload: lista de
{profile_id, device_type}. - Respuesta:
{updated: n}. - 5 tests en
test_network_assign_types.py.
Beneficios
| Antes | Después |
|---|---|
| Barra de progreso opaca (solo %). | Panel que muestra en directo cada fase completándose + hitos + dispositivos encontrados. |
| 3 pasos: discovery → selector destinos → aplicar. | 2 pasos: discovery → asignar y aplicar en la misma tabla. |
| Destino decidido antes de ver resultados. | Destino asignado después de inspeccionar los dispositivos descubiertos (con opción masiva). |
| Sin opción masiva; requería repetir por tipo. | Masivo integrado (“Apply to selected”, “Auto by type”). |
Cierre de iniciativa
Junto con:
- Botón Refresh en el modal (Parte 1, sesión anterior).
- Búsquedas guardadas persistidas en BD (Parte 4b, sesión s115).
Se cierra completamente la iniciativa “Auto-Provision UX”. El asistente es ahora intuitivo, rápido y visual.
Véase también
- [[entity—network—endpoint—assign-types]]
- [[entity—network—service—live-panel]]
- [[concept—network—device-discovery]]
- [[concept—saas—multi-tenancy]]
- [[feature—network—autoprovision-saved-searches]]