Ir para o conteúdo

Painéis no Jitterbit App Builder

Introdução

Painéis no App Builder são os contêineres nas páginas de suas aplicações que abrigam as informações exibidas na interface do usuário, como dados, imagens e todo tipo de controles.

Todas as páginas nas aplicações do App Builder são organizadas com o uso de painéis. Existem vários tipos de painéis, descritos nesta página.

Tipos de Painéis

Na aba Páginas do App Workbench, você pode selecionar qualquer uma das páginas da sua aplicação ou clicar para criar uma nova. Quando você faz isso, é levado à tela de edição daquela página, onde o painel Layout do Painel da Página permite configurar todos os painéis naquela página.

Clicar no botão + Adicionar Painel abre o diálogo Criar um Painel:

criar um diálogo de painel

O diálogo lista todos os tipos de painel disponíveis, também descritos nas seções abaixo:

  • Dinâmico

    • Grade
      Múltiplas linhas de dados com campos aparecendo horizontalmente.

    • Tile
      Dados exibidos como blocos, descendo pela página.

    • Formulário
      Linha única de dados com controles aparecendo verticalmente.

  • Relatório

    • Calendário
      Dados exibidos como um calendário, por diferentes visualizações.

    • Gráfico
      Exibir visualmente dados em uma variedade de tipos de gráficos.

    • Gantt
      Exibe dados como um gráfico de Gantt, para planejamento e agendamento.

    • Mapa
      Exibe um mapa para visualizar relações geográficas.

    • Gráfico de Rede
      Mostra visualmente as relações entre itens conectados.

    • Pivot
      Exibe dados em um formato de tabela dinâmica.

  • Caso de Bordo

Dinâmico

Grade

Ícone do painel de grade

Grade é o tipo básico de painel para exibir várias linhas de dados ao mesmo tempo. Este tipo de painel exibe colunas específicas da tabela ou objeto da fonte de dados selecionada. Clicar no título de uma coluna permite que as linhas sejam ordenadas em ordem crescente ou decrescente. O número total de linhas em um painel de Grade é exibido no canto superior direito, acima dos títulos das colunas. O número de linhas carregadas de cada vez (dependendo do total de registros) para fins de exibição pode ser menor que o total ou pode ser um subconjunto de todos os registros. Para visualizar mais linhas, clique no botão Carregar Mais Linhas na parte inferior do painel.

Bloco

Ícone do painel de bloco

Bloco combina o comportamento dos painéis de Grade e dos painéis de Formulário. Assim como os painéis de Grade, os painéis de Bloco exibem múltiplos conjuntos de informações ao mesmo tempo. No entanto, as informações das tabelas ou objetos da fonte de dados são apresentadas em blocos dispostos da esquerda para a direita, em vez de em colunas. Assim como nos painéis de Formulário, os controles são agrupados com outros controles na mesma posição na tabela de dados.

Formulário

Ícone do painel de formulário

Formulário é projetado para exibir uma única linha de dados da fonte de dados selecionada. Este tipo de painel é especialmente útil como uma janela pop-up ou página de detalhes em um aplicativo. Quando os painéis de Formulário são atribuídos a múltiplos controles, cada controle é exibido individualmente.

Relatório

Calendário

Ícone do painel de calendário

Os painéis de Calendário preenchem um calendário com informações da fonte de dados selecionada. Assim como os painéis de Gráfico, os painéis de Calendário podem ser vinculados a outro painel para exibir mais detalhes sobre um Evento no calendário.

Tipos de controle obrigatórios

  • Descrição: Designa o que aparecerá no calendário; tipicamente o Nome de um Evento.
  • Início do Evento: Designa em qual dia o Evento começa; pode incluir carimbos de data e hora exibidos ao lado da descrição do evento.
  • Fim do Evento: Designa em qual dia o Evento termina; pode incluir carimbos de data e hora exibidos ao lado da descrição do evento.

Tipos de controle opcionais

  • Cor: Valor de cor usado pelo calendário para indicar Eventos.
  • Ordenar: Permite aplicar ordenação ao valor selecionado.

Gráfico

Ícone do painel de gráfico

Os painéis de Gráfico exibem dados em uma representação gráfica. O App Builder suporta muitos tipos de gráfico, incluindo Barras, Colunas, Linhas e Área. Os gráficos podem ser vinculados aos dados subjacentes para que um usuário possa clicar e visualizar os dados de suporte.

Tipos de controle obrigatórios

  • Categoria: Representa o eixo X (horizontal) no gráfico.
  • Valor: Representa o eixo Y (vertical) no gráfico.

Tipos de controle opcionais

  • Cor: Valor de cor usado pelo gráfico.
  • Ordenar: Permite aplicar ordenação ao valor selecionado.
  • Sinalizador: Usado para marcar um evento ou ponto de interesse.
  • Objeto de Opções JSON: Objeto JSON que substitui as opções do gráfico.

Gantt

Ícone do painel de Gantt

Os painéis de Gantt exibem gráficos de Gantt, que são úteis para planejar e agendar projetos. Eles ajudam a avaliar quanto tempo um projeto deve levar, determinar os recursos necessários e planejar a ordem em que as tarefas serão concluídas. Os gráficos de Gantt também são uma ferramenta útil para gerenciar dependências entre tarefas.

Para usar um gráfico de Gantt em um painel de Gantt, é necessário um objeto de negócios que contenha informações para os controles requeridos. Gráficos de Gantt também podem representar Dependências de Tarefas e Grupos de Tarefas, desde que essas informações estejam configuradas no objeto de negócios.

Tipos de controles obrigatórios

  • Tarefa: Representa uma tarefa individual do projeto que está sendo monitorada.
  • Data de Início: Representa a data de início da tarefa.
  • Data de Término: Representa a data de término da tarefa.

Tipos de controles opcionais

  • Cor: Valor da cor para a tarefa no gráfico.
  • Dependência: Determina a relação da tarefa com outras tarefas das quais depende.
  • Tarefa Pai: Referência a outra tarefa do objeto de negócios, usada para arranjo hierárquico.
  • Ordenar: Permite aplicar ordenação ao valor selecionado.
  • Grupo de Tarefas: Usado para agrupar ou colocar várias tarefas na mesma linha.

Mapa

Ícone do painel de Mapa

Os painéis de Mapa exibem um mapa onde os controles podem ser visualizados por meio da localização geográfica. Os nomes das regiões do mapa no seu objeto de negócios subjacente devem corresponder aos identificadores dos mapas de origem do Highmaps; isso pode exigir atenção extra para garantir que a chave do seu objeto de negócios possa ser reconhecida pelo mapa de origem. Por exemplo, se você tiver um objeto de negócios com nomes de condados dos EUA, os nomes dos condados podem não ser únicos — nesse caso, você deve ter uma coluna que corresponda à chave do Highmaps. Diferentes mapas fornecidos através da API do Highmaps podem ser escolhidos com base nos dados que você deseja exibir.

Para informações adicionais sobre painéis de Mapa, consulte Painel de Mapa. Para informações sobre mapas de origem fornecidos no painel de Mapa, consulte a documentação do Highmaps.

Tipos de controles obrigatórios

  • Categoria: País, Estado, etc.
  • Valor: Valor associado à categoria.

Tipos de controles opcionais

  • Objeto de Opções JSON: Objeto JSON que substitui as opções do gráfico.
  • Cor: Valor da cor para um evento ou tarefa.

Gráfico de Rede

Ícone do painel Gráfico de Rede

Os painéis de Network Graph exibem interconexões entre um conjunto de entidades. Cada entidade é representada por um nó, e as conexões entre os nós são representadas por meio de links.

Tipos de controle obrigatórios

  • De: Nó de origem para este link.
  • Nó: Nó do Gráfico de Rede.
  • Rótulo do Nó: Rótulo do nó do Gráfico de Rede. Necessário ao usar UUIDs para relacionamentos.

Tipos de controle opcionais

  • Objeto de Opções JSON: Objeto JSON que substitui as opções do gráfico.
  • Cor do Link: Cor do link do Gráfico de Rede.
  • Cor: Valor da cor para um evento ou tarefa.

Tabela Dinâmica

Ícone do painel Tabela Dinâmica

Os painéis de Pivot exibem uma tabela dinâmica com informações de uma fonte de dados.

Tipos de controle obrigatórios

  • Coluna: Preenche os cabeçalhos das colunas.
  • Linha: Preenche os cabeçalhos das linhas.
  • Valor: Exibe os dados relevantes da fonte.

Caso Limite

Chat do Agente

Ícone do painel Chat do Agente

Os painéis de Chat do Agente fornecem a interface pela qual você conversa com seus agentes de IA configurados. Nesses painéis, os usuários podem digitar mensagens e receber respostas do agente sem sair da aplicação.

HTML Personalizado

Ícone do painel HTML Personalizado

Os painéis de HTML Personalizado utilizam templates HTML/CSS para exibir dados e imagens. Eles oferecem um alto grau de controle sobre a saída de exibição e se assemelham a uma página da web padrão.

Painel de Diagrama de Evento

Ícone do Painel de Diagrama de Evento

Painel de Diagrama de Evento os painéis incorporam um fluxo de trabalho visual interativo em uma página, exibindo os eventos configurados em uma tabela ou objeto de negócios como um diagrama de fluxo de processo BPMN.

Navegador de Arquivos

Ícone do painel Navegador de Arquivos

Painéis de Navegador de Arquivos estão vinculados a um sistema de arquivos local ou de rede e se assemelham a um diretório de arquivos. Eles permitem que os usuários façam upload de arquivos para um servidor e os baixem para um dispositivo. A navegação dentro de subdiretórios também é possível, com subdiretórios indicados por um ícone de pasta.

Quadro

Ícone do painel Quadro

Frame reservam um espaço na tela onde todos os links de página clicados serão carregados. O tipo de painel Quadro não possui conteúdo próprio — quando um Quadro existe em uma tela, qualquer navegação de página é direcionada para o Quadro em vez de substituir toda a tela. Este tipo de painel é mais frequentemente usado para manter um menu lateral persistente visível enquanto o contêiner Quadro renderiza a página de destino dentro dele.

Faixa

Ícone do painel Faixa

Lane exibem informações agrupadas. Eles são semelhantes aos painéis de Tile na medida em que exibem dados agrupados no formato de painel de Formulário, mas podem ser configurados vertical ou horizontalmente.