Widget de carga de ficheros (con temas)
El widget de carga de ficheros permite a los usuarios cargar uno o varios ficheros en un almacén ThingWorx. El widget se puede configurar para cargar ficheros de una de las siguientes maneras:
• Seleccionar ficheros en el sistema local al pulsar en el botón Inspeccionar. Los ficheros seleccionados se cargan cuando se pulsa en el botón Cargar.
• Arrastrar los ficheros del sistema local a la zona de descarga del widget.
Además, se pueden configurar reglas de validación para aplicar restricciones en el tipo de fichero, el tamaño, la cantidad y más.
Anatomía de widgets
Arrastrar y soltar
1. Selector de almacén de ficheros
2. Zona de descarga de ficheros
3. Ficheros cargados
4. Ruta del almacén
Al arrastrar o seleccionar un fichero en este modo, los ficheros se cargan o enumeran inmediatamente, en función del valor de la propiedad DisableInstantUpload. Opcionalmente, se puede desactivar la propiedad AllowInstantUpload y cargar ficheros manualmente mediante un botón o el servicio Upload del widget. Además, se muestra un botón Reemplazar que permite reemplazar un fichero cargado en el almacén.
Solo botón Inspeccionar
1. Selector de almacén de ficheros
2. Botón Inspeccionar
3. Ficheros seleccionados
4. Ruta del almacén
Desactivación de la carga instantánea
Por defecto, los ficheros seleccionados se cargan automáticamente en el almacén. Se muestra una barra de progreso para indicar el progreso de carga de cada fichero.
Para permitir a los usuarios revisar los ficheros seleccionados antes de cargarlos, defina las propiedades del widget DisbaleInstantUpload y ShowUploadButton en verdadero. En tiempo de ejecución, los usuarios pueden iniciar la carga pulsando el botón Cargar. Opcionalmente, se puede enlazar un evento de mashup, función o widget al servicio Upload del widget para iniciar la carga basada en una condición específica.
Adición de un botón Borrar
Se puede añadir un botón Borrar para permitir a los usuarios detener la carga y quitar los ficheros seleccionados de la lista. Los ficheros cargados solo se quitan de la lista y no se borran del almacén de ThingWorx. Para borrar ficheros del almacén, utilice un servicio de datos personalizado.
Carga de ficheros en un almacén de ThingWorx
Por defecto, los usuarios pueden utilizar los controles disponibles para seleccionar un almacén y una carpeta en los que cargar los ficheros. Para impedir que los usuarios elijan un almacén o una ruta de carpeta, defina las propiedades ShowRepositoryPath y ShowRepositorySelector en falso. Se puede especificar el nombre y la carpeta del almacén por defecto con las propiedades RepositoryName y Path del widget. Para obtener más información sobre los almacenes de la plataforma, consulte Gestión de almacenes de ficheros.
Validación del tamaño de fichero
Por defecto, los usuarios pueden cargar ficheros de cualquier tamaño en tiempo de ejecución. Es posible limitar el tamaño máximo de fichero que está disponible para la carga mediante la propiedad MaxFileSize del widget del panel Validación. Para personalizar los mensajes de fallo cuando un fichero es mayor que el máximo permitido, configure las propiedades MaxFileSizeFailureMessage y MaxFileSizeFailureTitle.
Validación del tamaño de carga
La propiedad de validación MaxUploadSize se puede utilizar para restringir el tamaño de la carga total. Se muestra un mensaje de error cuando el tamaño total de carga supera el límite. Para personalizar el mensaje de error, utilice las propiedades MaxUploadSizeFailureMessage y MaxUploadSizeFailureTitle.
Número máximo de ficheros
Se puede limitar el número máximo de ficheros que los usuarios pueden cargar mediante la propiedad MaxFileSize del widget del panel Validación. Cuando el número seleccionado de ficheros es superior al máximo, se muestra un mensaje de fallo. Para personalizar el mensaje de error, utilice la propiedad MaxNumberOfFilesFailureMessage.
Restricción de tipos de fichero
El widget se puede configurar para que acepte formatos de fichero específicos mediante la propiedad AllowedFileTypes. Se pueden añadir varios tipos de fichero, separados por comas. Por ejemplo, escriba .pdf, .png para permitir solo ficheros PDF y PNG. Utilice las propiedades AllowedFileTypesMessage y AllowedFileTypesTitle para personalizar el mensaje de error que se muestra cuando se añade un tipo de fichero no soportado.
 | Considere la posibilidad de enumerar los tipos de fichero soportados en el rótulo de zona de descarga. |
Configuración de la zona de descarga de ficheros
Se pueden arrastrar ficheros al área de la zona de descarga o pulsar en el rótulo para abrir un cuadro de diálogo de selección de ficheros. El color de la zona cambia automáticamente para indicar que se pueden soltar ficheros.
Se pueden utilizar las siguientes propiedades para configurar la zona de descarga:
• DropZoneHeight: permite definir una altura específica para la zona de descarga.
• DropZoneIcon: permite mostrar una entidad multimedia como un icono.
• DropZoneLabel: permite definir el rótulo que se debe mostrar. Esta propiedad se puede utilizar para proporcionar información sobre los tipos y tamaños de fichero soportados.
Propiedades de los widgets
En la siguiente tabla se enumeran las propiedades que están disponibles en el panel Propiedades.
Nombre de la propiedad | Descripción | Tipo base | Valor por defecto | Enlazable (Sí/No) | Localizable (Sí/No) |
|---|---|---|---|---|---|
BrowseButtonLabel | Permite definir el rótulo del botón Inspeccionar. | STRING | Inspeccionar | S | S |
BrowseButtonType | Permite definir el tipo de botón Inspeccionar. Opciones: Principal, Secundario, Terciario | STRING | Principal | N | N |
ClearList | Un servicio enlazable que borra la lista de ficheros seleccionados. | Servicio | n/d | S | N |
CustomClass | Permite definir la clase CSS que se debe aplicar al elemento superior div del widget. Se pueden introducir varias clases, separadas por un espacio. | STRING | n/d | S | N |
DisableInstantUpload | Permite desactivar la carga instantánea cuando se selecciona un fichero. | BOOLEAN | Falso | ||
DropZoneHeight | Permite definir la altura de la zona de descarga del fichero. | NUMBER | 96 | ||
DropZoneIcon | Permite definir el icono que se mostrará dentro de la zona de descarga. | IMAGELINK | n/d | ||
DropZoneLabel | Permite definir el rótulo de la zona de descarga. | STRING | Arrastrar los ficheros aquí o pulsar para inspeccionar | ||
FileNames | Se incluyen los nombres de los ficheros seleccionados. | STRING | n/d | S | N |
FileUploadMode | Permite especificar cómo se seleccionan los ficheros en tiempo de ejecución. Se puede arrastrar y soltar o mostrar un botón Inspeccionar. | STRING | Arrastrar y soltar | N | N |
RepositoryName | El nombre del almacén de ficheros utilizado por el widget. | THINGNAME | SystemRepository | S | N |
ShowRespositorySelector | Permite mostrar si el almacén de ficheros de destino debe ser editable. | BOOLEAN | Verdadero | N | N |
Path | La ruta de la carpeta para cargar ficheros en el almacén. | STRING | n/d | S | N |
MultiFilesSelect | Permite la selección de varios ficheros. | BOOLEAN | Falso | N | N |
ShowDataLoading | Permite mostrar un icono de expansión cuando se cargan los datos. | BOOLEAN | Verdadero | N | N |
Width | El ancho del widget. | NUMBER | 302 | N | |
Height | La altura del widget. | NUMBER | 95 | N | N |
Visible | Permite definir la visibilidad del widget en tiempo de ejecución. | Verdadero | Verdadero | N | N |
ClearList | Permite despejar la lista de ficheros añadidos al widget. | n/d | n/d | S | N |
DisbaleInstantUpload | Permite desactivar la carga instantánea después de seleccionar un fichero. Si se define en falso, los ficheros solo se cargan después de pulsar en el botón Cargar. | Falso | Falso | S | N |
ResetToDefaultValue | Permite restaurar los valores por defecto de las entradas del widget. | n/d | n/d | S | N |
ShowDeleteAllButton | Se muestra el botón Borrar todo y permite a los usuarios cancelar la carga y borrar todos los ficheros cargados. | BOOLEAN | Falso | N | N |
ShowRepositoryPath | Permite a los usuarios especificar una ruta dentro del almacén mediante un campo de texto. | BOOLEAN | Verdadero | N | N |
ShowRepositorySelector | Permite mostrar una lista desplegable en la que los usuarios pueden seleccionar el almacén de ThingWorx en el que se deben cargar los ficheros. | BOOLEAN | Verdadero | N | N |
ShowUploadButton | Se muestra un botón de carga que carga los ficheros seleccionados. Esta propiedad solo está disponible si InstantUpload se ha definido en falso. | BOOLEAN | Falso | N | N |
UploadComplete | Un evento enlazable que se activa cuando se completa la carga del fichero. | n/d | n/d | S | N |
Upload | Un servicio enlazable que carga los ficheros seleccionados. | Servicio | |||
UploadDescription | Permite definir el texto de descripción que se utiliza para guiar a los usuarios sobre los ficheros que se deben cargar. | n/d | n/d | S | N |
UploadDescriptionType | El tipo de rótulo que se utiliza para mostrar el texto de la descripción. | Cuerpo | Cuerpo | N | N |
UploadStarted | Un evento enlazable que se activa al iniciarse la carga. | n/d | n/d | S | N |
UploadFailed | Un evento enlazable que se activa cuando un fichero no se carga. | n/d | n/d | S | N |
Validación de los datos del widget de carga de ficheros
A diferencia de otros widgets que soportan la validación, la carga de ficheros no soporta los mensajes de validación y criterios. Se puede definir un mensaje de criterios y activar ShowFailureMessage y mostrar un mensaje de error cuando ValidationState es Invalid.
 | Solo el estado Invalid está disponible al aplicar estilos a los mensajes de fallo en el panel Propiedades de estilo. |
Para obtener más información sobre el uso de las propiedades de validación comunes, consulte Widget de campo de texto (con temas).
En la siguiente tabla se enumeran las propiedades de validación que están disponibles en el panel Validación.
Nombre | Descripción | Tipo base | Valor por defecto | ¿Es enlazable? | ¿Es localizable? |
|---|---|---|---|---|---|
AllowedFileTypes | Permite definir los tipos de ficheros permitidos que los usuarios pueden seleccionar, separados por comas. Por ejemplo:.png, .pdf, .txt | STRING | N/D | S | N |
AllowedFileTypesMessage | Mensaje que se debe mostrar cuando se añade un tipo de fichero no soportado. | STRING | S | S | |
AllowedFileTypesMessageDetails | Los detalles que se deben mostrar en el mensaje en el que se enumeran los tipos de fichero permitidos. | STRING | S | S | |
CriteriaMessage | El mensaje que se mostrará para los criterios de validación y cuando la validación falla. | STRING | S | S | |
CriteriaMessageDetails | Los detalles que se mostrarán para los criterios de validación y el mensaje de fallo. | STRING | S | S | |
FileRequired | Se requiere un fichero para cargar. | BOOLEAN | Falso | S | N |
FileRequiredMessage | El mensaje que se debe mostrar cuando falta un fichero obligatorio. | STRING | S | S | |
FileUploadErrorDetails | Un mensaje en el que se muestran detalles adicionales sobre los ficheros que no se han podido cargar. | STRING | S | S | |
FileUploadErrorMessage | Mensaje que se debe mostrar cuando un fichero no se puede cargar. | STRING | S | S | |
MaxFileSize | Permite definir un límite de tamaño máximo en cada fichero individual en megabytes. | NUMBER | N/D | S | N |
MaxFileSizeFailureMessage | Mensaje que se debe mostrar cuando un fichero supere el tamaño máximo de fichero permitido. | STRING | S | S | |
MaxFileSizeFailureTitle | El título del cuadro de diálogo que se muestra cuando el tamaño del fichero supera el tamaño máximo de fichero permitido. | STRING | S | S | |
MaxNumberOfFiles | Permite definir el número máximo de ficheros que se pueden añadir a la lista de carga. | NUMBER | N/D | S | S |
MaxNumberOfFilesFailureMessage | Mensaje que se muestra cuando el número de ficheros añadidos supera el máximo. | STRING | S | S | |
MaxUploadSize | Permite definir un límite de tamaño máximo en megabytes para la carga cuando se seleccionan múltiples ficheros. | NUMBER | N/D | S | N |
MaxUploadSizeFailureMessage | Mensaje que se muestra cuando el tamaño total de los ficheros supera el tamaño máximo de fichero permitido. | STRING | S | S | |
MaxUploadSizeFailureTitle | El título del cuadro de diálogo que se muestra cuando el tamaño total del fichero supera el valor máximo permitido. | STRING | S | S | |
ShowValidationFailure | Permite mostrar un mensaje de fallo cuando la validación falla. | BOOLEAN | Falso | S | N |
ShowValidationState | Un servicio enlazable que permite mostrar el estado de validación antes de que un usuario interactúe con el widget en tiempo de ejecución. Por defecto, el estado de validación solo se muestra tras la interacción del usuario. | Servicio | n/d | Dentro | N |
Validate | Un evento que se activa cuando se cambia el valor del widget. Este evento se debe enlazar a un servicio o función para aplicar un patrón o expresión de validación. | Evento | N/D | S | N |
ValidationFailureIcon | Permite definir el icono SVG que se mostrará en el mensaje de estado cuando falle la validación. | IMAGELINK | cds:icon_error | N | N |
ValidationOutput | Permite recuperar el resultado de la validación del widget. Los valores devueltos son Undefined, Unvalidated, Valid o Invalid. | STRING | N/D | S | N |
ValidationState | Una propiedad enlazable que permite definir el estado de validación. Esta propiedad se puede definir en Undefined, Unvalidated, Valid o Invalid. | STRING | Undefined | S | N |