Widget de Carga de Varios Archivos¶
Descripción¶
Este widget se actualizó en enero de 2022
El Widget de carga de archivos múltiples utiliza la biblioteca FilePond, versión 4.28.2, que se puede encontrar en https://github.com/pqina/filepond. Este widget permite cargar varios archivos de forma sincrónica o asincrónica almacenando archivos temporalmente en una sola columna y utilizando el evento de guardado para extraer el archivo binario y moverlo a una tabla separada donde se puede procesar más o mover a un archivo local o de red. sistema.
- Creador original: JP Fortier
- Actualizado por: Andros Haggins y Shrey Kumar
- Tipo: Widget de control
-
Parámetros:
Nombre del parámetro Predeterminado Traducible Descripción allowImagePreview
1
No
Habilite (1) o deshabilite (0) la vista previa para tipos de archivos de imagen. allowMultiple
1
No
Habilite (1) o deshabilite (0) la adición de múltiples archivos. forceReload
1
No
Habilite (1) o deshabilite (0) la ejecución de una actualización global después de que se haya cargado un lote de archivos. maxParallelUploads
1
No
Número máximo de archivos que se pueden cargar en paralelo. El máximo probado es 100. runSave
1
No
Habilite (1) o deshabilite (0) la ejecución del evento de guardado para cada archivo que se carga en la columna de archivos del objeto de negocio. Hay más parámetros disponibles para configurar según la documentación de FilePond en
https://pqina.nl/filepond/docs/print-version/#toc
en la sección "Propiedades". Para agregar parámetros/propiedades adicionales, deberá editar el archivo "binder.js" directamente en el widget. Tenga en cuenta que es posible que los parámetros/propiedades adicionales agregados no funcionen como se esperaba y solo se han probado los parámetros anteriores.
Configuración¶
Todas las configuraciones/capturas de pantalla a continuación se basan en la versión 3.1.27791 de Vinyl
Para que el widget de carga de archivos múltiples funcione correctamente necesitamos 2 tablas separadas. Uno para los archivos que se guardarán (en nuestro ejemplo, esta es la tabla "Archivo") y otro que asociará las cargas de archivos con otros datos según el caso de uso de su aplicación; en nuestro ejemplo, esta es la tabla "Ticket".
Definición de Tabla de Tickets¶
Nota
La columna PK (TicketID) y la columna Binary (Archivo) son las únicas columnas requeridas
Definición de Tabla de Archivos¶
Nota
La columna PK (FileID), la columna binaria (Archivo) y la columna FK para otra tabla (TicketID) son las únicas columnas requeridas
Ahora que nuestras tablas están configuradas, podemos pasar a la configuración de reglas comerciales. Necesitaremos un mínimo de 3 reglas comerciales, 2 objetos comerciales y 1 regla CRUD para insertar un archivo en la tabla de archivos.
Boleto (fuente)¶
El primer objeto comercial es simplemente un objeto fuente para la tabla Ticket. Este es el objeto de negocio que usaremos en nuestro primer panel al que se vinculará nuestro panel con el widget y nos permitirá asociar un archivo con un registro específico:
Boleto (archivo)¶
Nuestro segundo objeto comercial apunta a la misma tabla de Tickets, pero solo contiene la PK (TicketID), el Archivo y el nombre de archivo (opcional). Esto es importante porque necesitamos un objeto comercial separado para que el widget esté activado para poder cargar varios archivos en paralelo:
Boleto (insertar en Archivo)¶
Nuestra última regla comercial es una regla Insertar CRUD que insertará un nuevo registro en la tabla Archivo. Apuntamos a la tabla de archivos y le damos un NewUUID() para la columna FileID. Esta regla CRUD se agregará al evento de guardado de nuestro objeto comercial anterior en el siguiente paso:
Ahora asociamos la regla CRUD Ticket (Insertar en archivo) con el evento de guardado de nuestro segundo objeto comercial Ticket (Archivo) y agregamos un enlace en TicketID como se muestra a continuación. Esto moverá cada archivo a la tabla Archivo una vez que termine de cargarse. Debido a que nuestra tabla de tickets solo tiene una única columna de Archivo binario, esta configuración permite asociar una cantidad dinámica de archivos con un único registro de Ticket:
Ahora podemos pasar a la capa UI para configurar el widget. Nuestra página constará de 2 paneles. Uno usando Ticket (Fuente) y el otro usando Ticket (Archivo):
El panel que utiliza Ticket (Fuente) tiene menos restricciones en cuanto a configuración siempre que nuestro próximo panel esté vinculado a él. Así es como se ve el nuestro:
Nuestro siguiente panel usando Ticket (Archivo) tiene un único control Archivo donde configuraremos el widget:
En Cosmético > Información del widget, seleccionará el widget MultiFileUpload. Si desea cambiar alguno de los parámetros predeterminados, puede hacerlo haciendo clic en los 3 cuadros debajo de los parámetros de esta manera:
Aquí puede ver que hemos cambiado maxParallelUploads a 25. Aunque runSave sigue siendo 1, lo mostramos aquí para mostrar su importancia para la funcionalidad de cómo funciona este widget. Dado que nuestra regla CRUD que mueve nuestro archivo a la tabla Archivo está configurada en el evento Guardar de Ticket (Archivo), debemos asegurarnos de que esté configurado en 1 para que funcione correctamente. Si runSave no está configurado en 1, no podremos manejar varios archivos.
Si tiene que realizar algún procesamiento o acción adicional en un archivo, debe hacerlo en el evento Insertar de la tabla Archivo. Esto incluiría mover el archivo a un sistema de archivos local o de red.
Nota
Si está cargando archivos en Amazon S3 Bucket y desea crear una estructura de directorios por niveles para los archivos, consulte el Sistema de archivos de Amazon S3 artículo.