Widget de Upload de Múltiplos Arquivos no Jitterbit App Builder

Descrição

Este widget foi atualizado em janeiro de 2022

O Widget de Upload de Múltiplos Arquivos utiliza a biblioteca FilePond, que pode ser encontrada em https://github.com/pqina/filepond. Este widget permite que múltiplos arquivos sejam enviados de forma síncrona ou assíncrona, armazenando temporariamente os arquivos em uma única coluna e utilizando o evento de salvamento para puxar o binário do arquivo e movê-lo para uma tabela separada, onde pode ser processado mais adiante ou transferido para um sistema de arquivos local ou de rede.

• Criador Original: JP Fortier
• Atualizado Por: Andros Haggins & Shrey Kumar
• Tipo: Widget de Controle

• Parâmetros:

  Nome do Parâmetro	Padrão	Traduzível	Descrição
  allowImagePreview	1	Não	Habilitar (1) ou desabilitar (0) a visualização para tipos de arquivos de imagem.
  allowMultiple	1	Não	Habilitar (1) ou desabilitar (0) a adição de múltiplos arquivos.
  forceReload	1	Não	Habilitar (1) ou desabilitar (0) a execução de uma atualização global após um lote de arquivos ter sido enviado.
  maxParallelUploads	1	Não	Número máximo de arquivos que podem ser enviados em paralelo. O máximo testado é 100.
  runSave	1	Não	Habilitar (1) ou desabilitar (0) a execução do evento de salvamento para cada arquivo sendo enviado para a coluna de arquivos do Objeto de Negócio.

  Mais parâmetros estão disponíveis para serem configurados com base na documentação do FilePond em https://pqina.nl/filepond/docs/print-version/#toc na seção "Propriedades". Para adicionar parâmetros/propriedades adicionais, será necessário editar o arquivo "binder.js" no widget diretamente. Observe que quaisquer parâmetros/propriedades adicionais adicionados podem não funcionar como esperado e apenas os parâmetros acima foram testados.

Configuração

Para que o Widget de Upload de Múltiplos Arquivos funcione corretamente, precisamos de 2 tabelas separadas. Uma para os arquivos a serem salvos, em nosso exemplo esta é a tabela "Arquivo", e outra que associará seus uploads de arquivos com outros dados com base no caso de uso do seu aplicativo, em nosso exemplo esta é a tabela "Ticket".

Definição da tabela Ticket

Definição da tabela Arquivo

Agora que nossas tabelas estão configuradas, podemos passar para a configuração da Regra de Negócio. Precisaremos de um mínimo de 3 Regras de Negócio, 2 Objetos de Negócio e 1 regra CRUD para inserir um arquivo na tabela de arquivos.

Ticket (origem)

O primeiro objeto de negócio é apenas um objeto de origem para a tabela Ticket. Este é o objeto de negócio que usaremos em nosso primeiro painel, o painel ao qual o widget será vinculado e nos permitirá associar um arquivo a um registro específico:

Ticket (arquivo)

Nosso segundo objeto de negócio tem como alvo a mesma tabela Ticket, mas contém apenas o PK (TicketID), Arquivo e nome do arquivo (opcional). Isso é importante porque precisamos de um objeto de negócio separado para que o widget possa estar em vários arquivos que podem ser carregados em paralelo:

Ticket (inserir no arquivo)

Nossa última regra de negócio é uma regra CRUD de Inserção que irá inserir um novo registro na tabela Arquivo. Nós direcionamos a tabela de arquivos e damos um NewUUID() para a coluna FileID. Esta regra CRUD será adicionada ao evento de salvar do nosso objeto de negócio anterior na próxima etapa:

Agora associamos a regra CRUD Ticket (Inserir no Arquivo) com o evento de salvar do nosso segundo objeto de negócio Ticket (Arquivo) e adicionamos uma vinculação em TicketID, conforme mostrado abaixo. Isso moverá cada arquivo para a tabela Arquivo assim que o upload for concluído. Como nossa tabela de tickets possui apenas uma única coluna Binária de Arquivo, essa configuração permite que um número dinâmico de arquivos seja associado a um único registro de Ticket:

Agora podemos passar para a camada de UI para configurar o widget em si. Nossa página consistirá em 2 painéis. Um usando Ticket (Source) e o outro usando Ticket (File):

O painel usando Ticket (Source) tem menos restrições quando se trata de configuração, desde que nosso próximo painel esteja vinculado a ele. Assim é como o nosso se parece:

Nosso próximo painel usando Ticket (File) tem um único controle de Arquivo onde configuraremos o widget:

Em Cosmetic > Widget Information, você selecionará o Widget MultiFileUpload. Se desejar alterar algum dos parâmetros padrão, você pode fazê-lo clicando nas 3 caixas sob parâmetros, assim:

Aqui você pode ver que mudamos maxParallelUploads para 25. Embora runSave ainda seja 1, estamos mostrando isso aqui para destacar sua importância para a funcionalidade de como este widget funciona. Como nossa regra CRUD que move nosso arquivo para a tabela File está configurada no evento Save de Ticket (File), precisamos garantir que isso esteja definido como 1 para funcionar corretamente. Se runSave não estiver definido como 1, não conseguiremos lidar com múltiplos arquivos.

Se você tiver algum processamento/ação adicional que precise ser feito em um arquivo, isso deve ser feito no evento Insert para a tabela File. Isso incluiria mover o arquivo para um sistema de arquivos local ou de rede.

Exemplo em vídeo de implementação do widget