Diseño de Power APPS Demo Albaranes

¡Bienvenidos, muy buenos días tardes o noches , según donde me leas !

De que se tratara esta APP demo

El artículo detalla el proceso completo para crear una aplicación de generación de albaranes utilizando listas de SharePoint y Power Apps. Comienza con la configuración inicial de SharePoint, donde se crea el sitio web y se establecen las listas necesarias. Estas listas incluyen «Cuentas de Clientes» y «DimPlatos», cada una con columnas específicas para almacenar información relevante como cliente, dirección, tipo de plato, precio, entre otros. También se crean bibliotecas para gestionar los albaranes y facturas, con campos como nombre, modificado, cliente, importe, entre otros.

Una vez configuradas las listas y bibliotecas, se procede a poblarlas con datos que serán utilizados en la aplicación. Estos datos servirán como la base para manejar la aplicación de albaranes en Power Apps. El siguiente paso es la creación de la solución en Power Apps. Se crean varias pantallas y se conectan las listas y bibliotecas de SharePoint a la solución. Esto incluye la inserción de botones, galerías y otros componentes visuales necesarios para la funcionalidad de la aplicación.

El desarrollo de la aplicación implica la manipulación de datos mediante funciones y variables en Power Apps. Se utilizan colecciones para almacenar y procesar datos temporalmente dentro de la aplicación. Además, se crean módulos específicos, como el módulo de pedidos, donde se gestionan las inserciones, ediciones y eliminaciones de datos. La aplicación también permite la creación de albaranes, con una funcionalidad que permite imprimir el proceso completo en formato PDF.

Para la generación de albaranes, se inserta una galería dentro de un contenedor para mostrar la información detallada de cada pedido. Se utilizan etiquetas de texto y cálculos para mostrar el subtotal, IVA y el total del pedido. Además, se configuran botones y galerías adicionales para mejorar la usabilidad de la aplicación, como la inserción de un botón de PDF que envía todo el contenido a un lienzo en formato PDF listo para imprimir.

 

App de creación de albaranes, ojo paso a paso.

  • Recrearemos las listas de sharepoint, que necesitamos, creamos nuestro sitio web de sharepoint. Imagen 1
  • Procedemos a crear específicamente el diseño en el cual manejaremos, listas y bibliotecas, primero crearemos las listas, creando nuestra primera lista en blanco llamada, cuentas de cliente.imagen 2
  • CuentasDeClienentes, las columnas que tendrá serán, cliente, dirección, cpylocalidad, y pais imagen 3 y 4
  • Teniendo esta lista creada insertaremos datos, los cuales nos servirán para, manejar nuestra APP imagen 5 y 6
  • Pasamos a la siguiente opción la cual será DimPlatos, que contendrá las siguientes columnas esta lista TipoDePlato, item, Precio, Ordenación, Encarta, rellenamos los datos y tendríamos nuestra segunda lista imágenes 7 8 y 9
  • Pasamos a crea nuestra primera biblioteca, que se llamará albaranes, con los campos nombre, que será de tipo fichero, Modificado, Modificado por, Pedido, facturado, cliente, importe, creamos las columnas imágenes 10 y 11
  • Procedemos a crear la segunda bibliotecas la cual será Facturas, con las columnas, cliente, nfactura,importe, ID imágenes 12 y 13

Con estos pasos tenemos listo nuestro back para nuestra aplicación

  • Procedemos a crear la solución, en nuestro entorno de power apps imagen 14 y 15
  • Seguimos a crear nuestra aplicación desde cero 16
  • Lo primero será crear 4 pantallas 17
  • Para que todo funcione, todo lo creado anteriormente lo conectaremos a nuestra solución, es decir las listas y las bibliotecas imágenes 18 19 y 20
  • Empezaremos creando el modulo de pedidos
  • Ahora procedemos a conectar nuestras fuentes de datos, las cuales fueron en SharePoint. Imagen 21
  • Insertamos en los objetos visuales un botón, con el tema de color rojo este nos servirá para insertar nuevos registros. Imagen 22
  • Insertaremos una galería la cual nos servirá para validar la dimensión platos. imagen 23
  • Continuamos agregando diseño un desplegable y una variable, esta variable se le creara un numero dinámico entre varios para el numero de factura. Set(varnumero;RandBetween(1000;9999)), el desplegable que añadimos debe estar , asociado a la lista de cuentasdeclientes, a la columna nombre. Imagen 24
  • Pasaremos a crear una colección, en la cual podemos validar y pasar nuestro datos de la galería a la colección.

ClearCollect(ColCarrito;Table({Articulos:»»;Importe:0;Precio:0}));;, el objetivo es quedarnos con los cabeceros.

  • Creamos otra galería y la insertamos , añadimos el nombre de la galería imagen 25
  • Añadimos un botón nuevo en el cual manejaremos , los datos deseados , es decir los datos en los cuales , tenemos por aterrizar, que son , pasar de una galería a otro los datos , con que función pasamos los datos de una colección a otra , los pasamos específicamente, con el collect Collect(ColCarrito;{Articulo:ThisItem.item;Cantidad:1;Precio:ThisItem.Precio;Importe:ThisItem.Precio}) imagen 26 Modulo de pedidos
  • Ahora en la nueva galería insertamos todos los procesos en los cuales necesitamos específicamente, los nuevos datos, organizamos la galería con los datos que tenemos en la data, y fueron pasados hacia la galería, tenemos dos fechas para ordenar y una de borrar imagen 27

Ahora pasaremos un patch en el cual podremos ordenar específicamente, cada registro , es decir podemos editar todo lo que necesitamos, subiendo productos o bajándolos y eliminándolos, es decir la galería de la derecha , nos sirve para controlar la cantidad de pedidos que vamos a realizar, tenemos el código para subir la cantidad, dentro de la colección , el importe que genera esa cantidad de platos comprados, Patch(ColCarrito;ThisItem;{Cantidad:ThisItem.Cantidad+1;Importe:(ThisItem.Cantidad+1)*ThisItem.Precio})

Ahora para reducir esa cantidad, pero tiene una peculiaridad, que específicamente, lo mínimo es 1 y luego de menos de uno se debe desactivar la flecha bajando, le colocamos un condicional if en el displaymode If(ThisItem.Cantidad=1;DisplayMode.Disabled;DisplayMode.Edit)

Y en el onselect Patch(ColCarrito;ThisItem;{Cantidad:ThisItem.Cantidad-1;Importe:(ThisItem.Cantidad-1)*ThisItem.Precio})

 

 

Procedemos a crear específicamente la página de albaranes:

Lo primero será imprimir todo completamente el proceso, imprimiremos en el pdf toda la página.

Lo que realizaremos es el albarán en lugar de un contenedor será desde una galería, como para este caso, solo filtraremos específicamente, un solo registro, será mucho mas fácil.

Dado que este será el que envió al pdf.

Etiqueta de texto

Ahora dentro del contenedor insertaremos una galería dado que no podemos aterrizar una tabla dentro, para aterrizar toda la información, cuando vaya a insertar información de la dela galería  , debe ser dentro de los albaranes, ojo con este detalle , como no me permitió insertar la tabla de datos dentro de mi  contendedor, podremos específicamente , colocar la galería, cuando tenemos ya la tabla conectada a la lista de sharepoint , colocaremos específicamente los datos dentro de ella , a la  galería se le asigna que cuando en el desplegable del menú principal se pase la variable varcliente cambie la tabla y filtre los registros , en la función ítems de la tabla se colocara , este código   Filter(CuentasDeClientes;cliente=varcliente)

Ahora , le pasamos el código , a la variable de datos , en la cual vamos a gestionar cada registros de información, este código será aplicado en el desplegable de ítems de la pagina del menuprincipal en la propiedad onchange Set(varcliente;Self.Selected.cliente)

Insertamos en el contenedor, una etiqueta de texto, ojo con las ordenaciones dado que no permite mover de manera libre lo que se desea cargar «ALB-«&varnumero

Para que almacene el numero aleatorio de albaranes, y sumaremos otra tabla mas para tener la información completa, asociamos está a la colección que se crea por medio de pedidos, me envía la información de la colección a mi tabla de destino imagen 28

Añadiremos tres campos más de tipo label , los cuales son etiquetas de texto , para que tengan buen funcionamiento , para este seria el subtotal , «Subtotal: «& Text(Sum(ColCarrito;Importe);»##.00$»),Recurda que puedes combinar lo que estamos almacenando en la galeria para luego colocarlo en la data normal un detalle importante, es que no se puede , aterrizar , específicamente, o el intellisense no reconoce la colección creada por el botón de nuevo pedido donde estamos almacenando la información desde la galería del menú principal , se debe escribir manualmente , para el botón del iva  lo mismo  «IVA: «&Text(Sum(ColCarrito;Importe)*0,20;»##.00$»)

Por ultimo el valor de total , el cual será el del iva «Total: «&Text(Sum(ColCarrito;Importe)+Sum(ColCarrito;Importe)*0,20;»##.00$»)

Imagen 29

 

Ahora cargaremos los pedidos solicitados es decir que pedidos se almacenan en la colección creada , para este caso crearemos otra galería

, insertamos en la segunda galería los productos y rectángulos para los títulos.

Por ultimo configuramos el botón PDF, para que envié todo el lienzo a una lienzo pero en formato pdf para poderlo imprimir Set(varpdf;PDF(Albaranes));;Navigate(Visorpdf) imagen 32

 

Con todos estos pasos , se crea una solicitud de pedidos, desde una fuente de datos Sharepoint, pasando por una colección con varias galerías y seteando los datos con las variables

 

Link del video:

Vicente Antonio Juan Magallanes.

Loading

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *