Adicionar e configurar componentes
Saiba como adicionar componentes à sua página em Construtor de IU. Uma página é criada adicionando componentes.
Antes de Iniciar
Função necessária: ui_builder_admin
Por Que e Quando Desempenhar Esta Tarefa
Componentes são os blocos de construção usados para criar páginas personalizadas em Construtor de IU. Saiba como adicionar um componente a uma página. Depois de adicionar um componente a uma página, você deve configurar o componente. Para obter mais informações sobre como configurar componentes, consulte a documentação do componente no site do desenvolvedor ServiceNow.
Procedimento
-
Adicione componentes à sua página.
Construtor de IU vem com uma biblioteca de componentes para você escolher. Você adiciona componentes como os blocos de construção da sua página. Por exemplo, você pode adicionar um título, visualizações de dados e assim por diante. A tabela a seguir mostra as diferentes maneiras de adicionar um componente a uma página.
Para adicionar um componente Faça o seguinte Diretamente da sua página Na página, selecione + e escolha um componente na caixa de ferramentas. Você pode pesquisar um componente ou rolar pela lista. Menu flutuante acima da página Selecione o menu flutuante acima do seu componente. - Selecione Adicionar antes ou Adicionar depois de.
- Escolha um componente na caixa de ferramentas.
Árvore de conteúdo Você pode adicionar um componente da árvore de conteúdo das duas maneiras a seguir. - Selecione +Adicionar conteúdo abaixo de um contêiner na árvore de conteúdo. Em seguida, escolha um componente na caixa de ferramentas.
- Mova o mouse sobre um contêiner na árvore de conteúdo, selecione o ícone Menu e selecione Adicionar componente. Em seguida, escolha um componente na caixa de ferramentas.
-
Agora configure as propriedades dos componentes que você acabou de adicionar.
Configurar componentes significa personalizá-los de acordo com as suas necessidades. Para obter mais informações sobre como configurar componentes, consulte Next Experience Componentes.
-
Para componentes com propriedades JSON configuráveis, você pode usar o editor JSON de low-code Construtor de IUpara editar as propriedades do componente sem precisar editar o código JSON.
A IU do editor JSON exibe todas as propriedades disponíveis, até mesmo as propriedades não definidas nos dados fictícios ou nos valores definidos. Você pode atualizar as propriedades ou adicionar suas próprias propriedades personalizadas no editor JSON. Para obter mais informações sobre como configurar componentes, consulte Editar código com o Now Code Editor (recurso avançado).
Nota:O editor JSON low-code só está disponível para propriedades que têm um esquema e cuja entrada JSON corresponde a esse esquema.O editor JSON low-code oferece suporte a objetos simples, propriedades de matriz simples, matrizes complexas, matrizes de objetos e oferece suporte parcial a objetos complexos. Para matrizes complexas, você pode adicionar, excluir ou mover a posição dos itens da matriz. Você também pode selecionar Ocultar itens não definidos para ocultar objetos com valores vazios ou nulos para uma experiência de edição simplificada.
-
Ao trabalhar com um componente de contêiner, você pode editar alguns estilos usando os painéis flutuantes.
Selecione o ícone Menu para exibir um menu.
Selecione a opção Layout, Dimensionamentoou Espaçamento para abrir um painel flutuante com as opções mais comuns exibidas. Arraste o painel flutuante para outro local conforme necessário. Somente um painel flutuante pode ser aberto por vez.
Para obter mais informações sobre como configurar componentes, consulte Next Experience Componentes. -
Para componentes com propriedades JSON configuráveis, você pode usar o editor JSON de low-code Construtor de IUpara editar as propriedades do componente sem precisar editar o código JSON.
- Opcional:
Adicione mais componentes à sua página selecionando + na parte superior ou inferior dos componentes da página (o + muda para + Adicionar).
- Selecione + na parte superior do componente para adicionar um componente antes do componente existente ou selecione + na parte inferior de um componente para inserir um componente depois dele.
- Arraste um componente da lista de componentes para inserir o componente antes ou depois de um componente existente.
O que Fazer Depois
Você adicionou e configurou componentes em sua página. Para obter mais informações, consulte Expor dados dinamicamente em páginas do Construtor de IU (recurso avançado). Um recurso de dados em Construtor de IU são os dados que uma página busca para exibir conteúdo em componentes. Os componentes usam recursos de dados como uma maneira de reutilizar dados e configurações em diferentes experiências e tornar os componentes dinâmicos em uma página.
Funções compatíveis no editor de fórmulas do componente Construtor de IU
Saiba mais sobre as várias funções compatíveis com o editor de fórmulas do componente Construtor de IU.
A tabela a seguir lista as funções que você pode usar no editor de fórmulas do componente Construtor de IU. Para obter mais informações sobre o editor de fórmulas do componente, consulte Personalizar Construtor de IU páginas usando componentes.
| Rótulo do operador | Exemplo de condição | Operador de consulta equivalente | Consulta de exemplo | Exemplo de saída |
|---|---|---|---|---|
| Tudo vazio | [Descrição resumida][ALL_EMPTY] | TUDO_VAZIO | short_descriptionALL_EMPTY | Todos os registros em que não há valor no campo Descrição resumida. |
| Tudo igual | [Descrição resumida][ALL_EQ][Armazenamento na rede indisponível] | ALL_EQ | short_description=armazenamento de rede indisponível | Todos os registros em que o valor do campo Descrição resumida é igual a "Armazenamento de rede indisponível". |
| Todos maiores que | [Impacto][ALL_GT][2 - Médio] | > | impacto>2 | Todos os registros em que o campo Impacto tem um valor de 3 - Baixo |
| Todos maiores ou iguais | [Impacto][ALL_GTE][2 - Médio] | >= | impacto>=2 | Todos os registros nos quais o campo Impacto tem um valor de 2 - Médio ou 3 - Baixo. |
| Todos menores que | [Contagem de reatribuições][ALL_LT][2] | < | reatribuição_contagem<2 | Todos os registros nos quais o valor no campo Contagem de reatribuições é qualquer número menor que (mas não igual a) 2. |
| Todos menores ou iguais | [Contagem de reatribuições][ALL_LTE][2] | <= | reatribuição_contagem<=2 | Todos os registros em que o valor no campo Contagem de reatribuições é um dos seguintes:
|
| Todos diferentes de | [Impacto][ALL_NEQ][1 - Alto] | != | impacto!=1 | Todos os registros nos quais o valor no campo Impacto é qualquer coisa menos 1 - Alto. |
| Nem tudo vazio | [Impacto][ALL_NOTEMPTY] | TODOS_NOTEMPTY | impactALL_NOTEMPTY | Todos os registros nos quais o campo Impacto tem algum valor. |
| Todos, não um de | [Impacto][ALL_NOTONEOF][1 - Alto, 2 - Médio] | ALL_NOTONEOF | impactoALL_NOTONEOF1,2 | Todos os registros nos quais o campo Impacto é preenchido por qualquer coisa, exceto os seguintes valores:
|
| Todos um de | [Impacto][ALL_ONEOF][1 - Alto, 2 - Médio] | ALL_ONEOF | impactoTODOS_ONEOF1,2 | Todos os registros nos quais o campo Impacto é preenchido por um dos seguintes valores:
|
| Qualquer vazio | [Descrição resumida][ANY_EMPTY] | QUALQUER_VAZIO | short_descriptionANY_EMPTY | Qualquer registro em que não haja valor no campo Descrição resumida. |
| Qualquer igual | [Descrição resumida][ANY_EQ][Armazenamento na rede indisponível] | QUALQUER_EQ | short_description=armazenamento de rede indisponível | Qualquer registro em que o valor do campo Descrição resumida seja igual a "Armazenamento de rede indisponível". |
| Qualquer maior que | [Impacto][ANY_GT][2 - Médio] | QUALQUER_GT | impactoANY_GT2 | Todos os registros em que o campo Impacto tem um valor de 3 - Baixo |
| Qualquer maior ou igual a | [Impacto][ANY_GTE][2 - Médio] | QUALQUER_GTE | impactoANY_GTE2 | Qualquer registro no qual o campo Impacto tenha um valor de 2 - Médio ou 3 - Baixo. |
| Qualquer valor menor que | [Contagem de reatribuições][ANY_LT][2] | QUALQUER_LT | reatribuição_countANY_LT2 | Qualquer registro em que o valor no campo Contagem de reatribuição seja qualquer número menor que (mas não igual a) 2. |
| Qualquer valor menor ou igual a | [Contagem de reatribuições][ANY_LTE][2] | QUALQUER_LTE | reatribuição_countANY_LTE2 | Qualquer registro em que o valor no campo Contagem de reatribuições seja um dos seguintes:
|
| Qualquer diferente | [Impacto][ANY_NEQ][1 - Alto] | QUALQUER_NEQ | impactoANY_NEQ1 | Qualquer registro em que o valor no campo Impacto seja qualquer coisa menos 1 - Alto. |
| Qualquer não está vazio | [Impacto][ANY_NOTEMPTY] | QUALQUER_NOTEMPTY | impactANY_NOTEMPTY | Qualquer registro no qual o campo Impacto tenha algum valor. |
| Qualquer não um de | [Impacto][ANY_NOTONEOF][1 - Alto, 2 - Médio] | QUALQUER_NOTONEOF | impactANY_NOTONEOF1,2 | Qualquer registro no qual o campo Impacto seja preenchido por qualquer coisa, exceto os seguintes valores:
|
| Qualquer um de | [Impacto][ANY_ONEOF][1 - Alto, 2 - Médio] | QUALQUER UM | impactoANY_ONEOF1,2 | Qualquer registro no qual o campo Impacto seja preenchido por um dos seguintes valores:
|
| CONCAT | CONCAT (valor) | CONCAT | CONCAT("Bem-vindo(a), ",@context.session.user.firstName) | Criar uma nova cadeia de caracteres que combina todas as cadeias de caracteres fornecidas em uma só |
| VAZIO | VAZIO (valor) | VAZIO | EMPTY(@context.session.user.roles) | Retorna verdadeiro se o valor for nulo ou indefinido |
| SE | IF (se, então, caso contrário) | SE | IF(@context.props.bare,"página simples","página não simples") | Se a condição for verdadeira, retorne o valor. Se a condição for falsa, retorna o valor else. |
| LEN | LEN(lista) | LEN | LEN([1,2,3]) | Retorna o número de itens na matriz |
| Selecionar | PICK(matriz, campo) | Selecionar | PICK(@context.session.user.preferences, "name") | Cria uma nova matriz em que cada item é selecionado do campo em cada item da matriz. Se o campo não existir, o item na nova matriz será VAZIO |
| Intervalo | RANGE(de, até) | Intervalo | INTERVALO (1,10) | Cria uma matriz de números, começando com de, até, incrementando por etapa |
| Soma | SUM(matriz) | Soma | SOMA([1,2,3]) | Começando em 0, adicione o valor numérico de cada item na matriz e retorne o somatório resultante |
| Traduzir | TRANSLATE (texto) | Traduzir | TRANSLATE("Bem-vindo de volta") | Retorna a cadeia de caracteres do primeiro argumento depois que os caracteres especificados no segundo argumento são convertidos para os caracteres especificados no terceiro argumento. |
| Onde vazio | [Descrição resumida][WHERE_EMPTY] | ONDE_VAZIO | short_descriptionWHERE_EMPTY | Extraia registros onde não há valor no campo Descrição resumida. |
| Onde igual a | [Descrição resumida][WHERE_EQ][Armazenamento de rede indisponível] | WHERE_EQ | short_descriptionWHERE_EQarmazenamento na rede indisponível | Extrair registros em que o campo Descrição resumida é igual a "Armazenamento de rede indisponível". |
| Onde maior que | [Impacto][WHERE_GT][2 - Médio] | ONDE_GT | impactoWHERE_GT2 | Extrair registros em que o campo Impacto tem um valor de 3 - Baixo |
| Quando maior que ou igual a | [Impacto][WHERE_GTE][2 - Médio] | ONDE_GTE | impactoWHERE_GTE2 | Extraia registros em que o campo Impacto tenha um valor de 2 - Médio ou 3 - Baixo. |
| Onde menor que | [Contagem de reatribuições][WHERE_LT][2] | WHERE_LT | reatribuição_contagemWHERE_LT2 | Extraia registros em que o valor no campo Contagem de reatribuições for qualquer número menor que (mas não igual a) 2. |
| Onde menor ou igual a | [Contagem de reatribuições][WHERE_LTE][2] | ONDE_LTE | reatribuição_contagemWHERE_LTE2 | Extraia registros em que o valor no campo Contagem de reatribuições for um dos seguintes:
|
| Onde não é igual | [Impacto][WHERE_NEQ][1 - Alto] | WHERE_NEQ | impactoWHERE_NEQ1 | Extraia registros em que o valor no campo Impacto seja qualquer coisa menos 1 - Alto. |
| Onde não está vazio | [Impacto][WHERE_NOTEMPTY] | WHERE_NOTEMPTY | impactoWHERE_NOTEMPTY | Extraia registros em que o campo Impacto tenha algum valor. |
| Onde não é um de | [Impacto][WHERE_NOTONEOF][1 - Alto, 2 - Médio] | WHERE_NOTONEOF | impactoWHERE_NOTONEOF1,2 | Extrair registros em que o campo Impacto é preenchido por qualquer coisa, exceto os seguintes valores:
|
| Onde um de | [Impacto][WHERE_ONEOF][1 - Alto, 2 - Médio] | WHERE_ONEOF | impactoWHERE_ONEOF1,2 | Extrair registros em que o campo Impacto é preenchido por um dos seguintes valores:
|