Diseño y Construcción Avanzada (Finalización de app tipo Kardex con SharePoint Lists)

🎯 Objetivo de la clase

Consolidar una aplicación Canvas orientada a negocio (Kardex) pasando de Dataverse a SharePoint Lists, mejorando diseño, navegación, gestión del estado con variables y lógica de registro de movimientos que actualiza el stock del producto. [learn.microsoft.com], [learn.microsoft.com], [learn.microsoft.com], [learn.microsoft.com]

🧩 Temas tratados

1) 🧱 SharePoint Lists como base de datos (Productos y Movimientos)

• Se trabajó con SharePoint como fuente de datos para el Kardex, creando listas y columnas (texto, numérico, fecha, opción/elección y búsqueda/lookup). [learn.microsoft.com], [learn.microsoft.com]
• Se resaltó la diferencia práctica: SharePoint es ideal para escenarios ligeros/medios; Dataverse es más robusto para modelos complejos y escalabilidad. [learn.microsoft.com], [learn.microsoft.com]

Modelado recomendado:

• Lista Productos: Nombre/Título, Stock (número), Activo (Sí/No), adjuntos (imagen). [learn.microsoft.com], [learn.microsoft.com], [learn.microsoft.com]
• Lista Movimientos: Producto (lookup), Tipo (Entrada/Salida), Cantidad, Fecha/Hora, Observación. [learn.microsoft.com], [learn.microsoft.com]

✅ Buen tip técnico del docente: evitar tildes / ñ en nombres internos de columnas para reducir problemas de referencia en fórmulas y conectores (buena práctica general de integración). [learn.microsoft.com], [learn.microsoft.com]

2) 🔌 Conexión de Power Apps a SharePoint (reemplazo de Dataverse)

• Se conectaron las listas desde Data > Add data > SharePoint y se reasignó el origen en controles (galería y formularios). [learn.microsoft.com]
• Se enfatizó el patrón: Galería para listar, EditForm/NewForm para crear/editar registros y SubmitForm si se desea guardar desde un formulario. [learn.microsoft.com], [learn.microsoft.com]

3) 🖼️ Galería de productos: imágenes desde adjuntos (SharePoint)

• Se explicó que el campo Adjuntos puede devolver varios archivos, por lo que el control imagen necesita tomar solo uno (por ejemplo, el primero).
• Para esto se aplica First() sobre la columna de adjuntos y luego el Value (contenido/URL del archivo según el control y contexto). [learn.microsoft.com], [learn.microsoft.com]

📌 Referencia: el control Attachments y su comportamiento/limitaciones en canvas apps. [learn.microsoft.com], [learn.microsoft.com]

4) 🧭 Estructura del Árbol (Tree View) + Contenedores (Containers)

• Se reforzó cómo leer el Tree view: pantalla → contenedores → controles anidados. [learn.microsoft.com], [learn.microsoft.com]
• Se sugirió:
  • Renombrar controles para ubicar rápido (“MenuContainer”, “galProductos”, “frmMovimientos”, etc.). [learn.microsoft.com], [learn.microsoft.com]
  • Usar containers para orden, accesibilidad y control de propiedades como Visible, Width/Height. [learn.microsoft.com], [learn.microsoft.com]

5) ✅ “Filtro booleano” (Activo: Sí/No) — aplicado a productos

Como en la clase se definió una columna Activo (Sí/No), se recomendó aplicar un filtro en la galería para mostrar solo productos activos. [learn.microsoft.com], [learn.microsoft.com]

🔧 Ejemplo recomendado (Items de la galería):

// Solo productos activos
Filter('Lista_Productos', Activo = true)

✅ Con buscador + filtro booleano (patrón típico):

Filter(
    'Lista_Productos',
    Activo = true &&
    (IsBlank(txtBuscar.Text) || txtBuscar.Text in Title)
)

Nota: Filter y in son funciones clave para búsqueda/filtrado; considerar delegación en listas grandes. [learn.microsoft.com]

6) 🧠 Variables booleanas para UX (mostrar/ocultar menú)

Se implementó un patrón de estado simple usando una variable global booleana con Set():

• Inicializar en App.OnStart (o lógica equivalente).
• Alternar con negación ! al presionar el ícono de “hamburguesa”.
• Enlazar a la propiedad Visible del contenedor del menú. [learn.microsoft.com], [learn.microsoft.com], [learn.microsoft.com]

📌 Patrón recomendado:

// App.OnStart
Set(varMenuVisible, true);

// Icono menú (OnSelect)
Set(varMenuVisible, !varMenuVisible);

// Contenedor del menú (Visible)
varMenuVisible

7) 🧾 Registro de movimientos + actualización de stock (lógica Kardex)

Se construyó lógica para:

1. Guardar el movimiento en la lista Movimientos
2. Actualizar stock en la lista Productos según:
   • Entrada → Stock = Stock + Cantidad
   • Salida → Stock = Stock – Cantidad

✅ Funciones clave utilizadas

• Patch() para crear/actualizar registros. [learn.microsoft.com], [learn.microsoft.com]
• Defaults() para crear el “registro base” al insertar. [learn.microsoft.com], [learn.microsoft.com]
• LookUp() para encontrar el producto seleccionado (por ID u otra clave). [learn.microsoft.com]
• Value() para convertir texto a número desde un input. [learn.microsoft.com], [learn.microsoft.com]
• If() para lógica condicional (entrada/salida). [learn.microsoft.com], [learn.microsoft.com]
• Notify() para confirmación al usuario. [learn.microsoft.com], [learn.microsoft.com]

📌 Patrón recomendado (conceptual) para “Guardar movimiento”
(ejemplo simplificado, orientativo y alineado a lo visto):

// 1) Guardar movimiento
Patch(
    Lista_Movimientos,
    Defaults(Lista_Movimientos),
    {
        Producto: cboProducto.Selected,
        TipoMovimiento: cboTipo.Selected.Value,
        Cantidad: Value(txtCantidad.Text),
        FechaRegistro: dtpFecha.SelectedDate,
        Observacion: txtObs.Text
    }
);

// 2) Actualizar stock del producto seleccionado
If(
    cboTipo.Selected.Value = "Entrada",
    Patch(
        Lista_Productos,
        LookUp(Lista_Productos, ID = cboProducto.Selected.ID),
        { Stock: LookUp(Lista_Productos, ID = cboProducto.Selected.ID).Stock + Value(txtCantidad.Text) }
    ),
    Patch(
        Lista_Productos,
        LookUp(Lista_Productos, ID = cboProducto.Selected.ID),
        { Stock: LookUp(Lista_Productos, ID = cboProducto.Selected.ID).Stock - Value(txtCantidad.Text) }
    )
);

// 3) Mensaje al usuario
Notify("Movimiento guardado.", NotificationType.Success, 2000);

🔎 Recomendación técnica: para mejorar legibilidad y rendimiento, se puede usar With() y evitar repetir LookUp() (opcional, práctica avanzada). [learn.microsoft.com]

❓ Preguntas y respuestas destacadas (con refuerzo oficial)

❓ 1) “¿Por qué conviene usar variables para mostrar/ocultar el menú?”

✅ Respuesta del docente (síntesis): porque permite controlar el estado visual (UI) de forma simple y reutilizable en varias pantallas.
🔎 Refuerzo Microsoft: Set() crea/actualiza variables globales y se usan en propiedades como Visible. [learn.microsoft.com], [learn.microsoft.com]

❓ 2) “¿Por qué la imagen (adjuntos) da error en la galería?”

✅ Respuesta del docente (síntesis): porque adjuntos devuelve una colección (varios archivos); el control de imagen requiere un único valor/archivo.
🔎 Refuerzo Microsoft: control Attachments y limitaciones; uso de First() para tomar el primer registro de una tabla. [learn.microsoft.com], [learn.microsoft.com]

❓ 3) “¿Cómo relaciono Movimientos con Productos?”

✅ Respuesta del docente (síntesis): usando una columna Lookup (búsqueda) en SharePoint y luego consumiendo esa relación desde Power Apps.
🔎 Refuerzo Microsoft: tutorial oficial sobre columnas Lookup y su uso en Power Apps. [learn.microsoft.com], [learn.microsoft.com]

❓ 4) “¿Cuál es la forma correcta de guardar y actualizar datos en listas?”

✅ Respuesta del docente (síntesis): usar Patch() para insertar o actualizar registros y LookUp() para ubicar el registro a modificar.
🔎 Refuerzo Microsoft: Patch() para crear/actualizar y Filter/LookUp para encontrar registros. [learn.microsoft.com], [learn.microsoft.com]

✅ Conclusiones

• SharePoint Lists es una base práctica para apps empresariales ligeras, y Power Apps permite integrarla rápidamente. [learn.microsoft.com], [learn.microsoft.com]
• La app Kardex quedó con lógica funcional: movimientos → actualización de stock, y feedback con notificaciones. [learn.microsoft.com], [learn.microsoft.com]
• El manejo de variables booleanas es clave para UI responsive (menú ocultable) y buena experiencia de usuario. [learn.microsoft.com], [learn.microsoft.com]
• El siguiente paso natural es mejorar mantenibilidad usando Componentes y estandarizar UI. [learn.microsoft.com], [learn.microsoft.com]

⭐ Recomendaciones

• 🧩 Componentizar: crear un componente de menú reutilizable para no duplicar estructuras entre pantallas. [learn.microsoft.com], [learn.microsoft.com]
• ✅ Aplicar filtro booleano por defecto (Activo = true) y permitir toggle de “ver inactivos”. [learn.microsoft.com]
• 🔎 Validar datos antes de Patch (cantidad numérica, stock no negativo en salidas) usando If() y notificaciones. [learn.microsoft.com], [learn.microsoft.com]
• 🧱 Usar contenedores para una UI más ordenada y responsive, especialmente en móvil vs web. [learn.microsoft.com], [learn.microsoft.com]

📚 Referencias oficiales

• Microsoft Learn. Connect to SharePoint from a canvas app.
  https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/connections/connection-sharepoint-online, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Link lists using a lookup column in Power Apps.
  https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/sharepoint-lookup-fields, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Set function (global variables).
  https://learn.microsoft.com/es-es/power-platform/power-fx/reference/function-set, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Understand variables in canvas apps.
  https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/working-with-variables, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Patch function.
  https://learn.microsoft.com/es-es/power-platform/power-fx/reference/function-patch, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Filter, Search, and LookUp functions.
  https://learn.microsoft.com/en-us/power-platform/power-fx/reference/function-filter-lookup, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Notify function.
  https://learn.microsoft.com/es-es/power-platform/power-fx/reference/function-showerror, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Attachments control (SharePoint lists/Dataverse).
  https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/controls/control-attachments, [learn.microsoft.com] [learn.microsoft.com]
• Microsoft Learn. Canvas component overview.
  https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/create-component, [learn.microsoft.com] [learn.microsoft.com]