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 ServiceNow Site do desenvolvedor.
Procedimento
-
Adicione componentes à sua página.
Construtor de IU vem com uma biblioteca de componentes para 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 sua 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.
- 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 componente 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 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 baixo código de 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 Editor de código do Now (recurso avançado).
Nota:O editor JSON de baixo código está disponível somente para propriedades que têm um esquema e cuja entrada JSON corresponde a esse esquema.O editor JSON de baixo código 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 de cada 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 baixo código de Construtor de IUpara editar as propriedades do componente sem precisar editar o código JSON.
- Opcional:
Adicione mais componentes à sua página selecionando o + na parte superior ou inferior dos componentes na página (o + muda para + Adicionar).
- Selecione + na parte superior do seu 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 nas 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 forma de reutilizar dados e configurações em diferentes experiências e tornar os componentes dinâmicos em uma página.
Funções compatíveis com o editor de fórmulas do componente Construtor de IU
Saiba mais sobre as várias funções compatíveis com o editor de fórmula 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 | Condição de exemplo | Operador de consulta equivalente | Consulta de exemplo | Saída de exemplo |
|---|---|---|---|---|
| Todos vazios | [Descrição resumida][ALL_EMPTY] | TODOS_VAZIOS | short_descriptionTODOS_EMPTY | Todos os registros nos quais não há nenhum valor no campo Descrição resumida. |
| Todos iguais | [Descrição resumida][ALL_EQ][Armazenamento de rede indisponível] | ALL_EQ | short_description=network armazenamento 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 a | [Impacto][ALL_GTE][2 - Médio] | >= | impacto>=2 | Todos os registros nos quais o campo Impacto tem um valor 2 - Médio ou 3 - Baixo. |
| Todos os menores que | [Contagem de reatribuições][ALL_LT][2] | < | reassignment_count<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 a | [Contagem de reatribuições][ALL_LTE][2] | <= | reassignment_count<=2 | Todos os registros nos quais o valor no campo Contagem de reatribuições é um dos seguintes:
|
| Todos não iguais a | [Impacto][ALL_NEQ][1 - Alto] | != | impacto! = 1 | Todos os registros nos quais o valor no campo Impacto é diferente de 1 - Alto. |
| Nem todos estão vazios | [Impacto][ALL_NOTEMPTY] | ALL_NOTEMPTY | impactoTODOS_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] | TODOS_NOTONEOF | impactoTODOS_NOTONEOF1,2 | Todos os registros nos quais o campo Impacto é preenchido por qualquer coisa, exceto os seguintes valores:
|
| Todos os 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 nenhum valor no campo Descrição resumida. |
| Qualquer igual | [Descrição resumida][ANY_EQ][Armazenamento de rede indisponível] | QUALQUER_EQ | short_description=network armazenamento 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 | Quaisquer registros em que o campo Impacto tenha um valor de 3 - Baixo |
| Qualquer maior ou igual a | [Impacto][ANY_GTE][2 - Médio] | QUALQUER_GTE | impactoANY_GTE2 | Qualquer registro em que o campo Impacto tenha um valor 2 - Médio ou 3 - Baixo. |
| Qualquer valor menor que | [Contagem de reatribuições][ANY_LT][2] | QUALQUER_LT | reatribuição_contagemANY_LT2 | Qualquer registro em que o valor no campo Contagem de reatribuições seja um 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 diferente de 1 - Alto. |
| Qualquer não vazio | [Impacto][ANY_NOTEMPTY] | QUALQUER_NOTEMPTY | impactoANY_NOTEMPTY | Qualquer registro no qual o campo Impacto tenha algum valor. |
| Qualquer um que não seja um de | [Impacto][ANY_NOTONEOF][1 - Alto, 2 - Médio] | QUALQUER_NOTONEOF | impactoANY_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_ONEOF | impactoANY_ONEOF1,2 | Qualquer registro no qual o campo Impacto seja preenchido por um dos seguintes valores:
|
| CONCATÁRIA | CONCAT(valor) | CONCATÁRIA | CONCAT("Welcome, ",@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 | VAZIO (@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, retorne o valor. |
| LEN | LEN(lista) | LEN | LEN([1,2,3]) | Retorna o número de itens na matriz |
| Escolher | PICK(matriz, campo) | Escolher | 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, a) | Intervalo | RANGE(1,10) | Cria uma matriz de números, começando com, 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 a soma 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 traduzidos para os caracteres especificados no terceiro argumento. |
| Onde estiver 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 | [Descrição resumida][WHERE_EQ][Armazenamento de rede indisponível] | ONDE_EQ | short_descriptionWHERE_EQarmazenamento de rede indisponível | Extraia registros em que o campo Descrição resumida seja igual a "O armazenamento de rede está indisponível". |
| Onde maior que | [Impacto][WHERE_GT][2 - Médio] | ONDE_GT | impactoWHERE_GT2 | Extrair registros em que o campo Impacto tenha um valor 3 - Baixo |
| Quando maior 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] | ONDE_LT | reatribuição_contagemWHERE_LT2 | Extraia registros em que o valor no campo Contagem de reatribuições seja um número menor que (mas não igual a) 2. |
| Quando menor ou igual a | [Contagem de reatribuições][WHERE_LTE][2] | ONDE_LTE | reatribuição_contagemWHERE_LTE2 | Extrair registros em que o valor no campo Contagem de reatribuições for um dos seguintes:
|
| Onde não é igual | [Impacto][WHERE_NEQ][1 - Alto] | ONDE_NEQ | impactoWHERE_NEQ1 | Extraia registros em que o valor no campo Impacto seja diferente de 1 - Alto. |
| Onde não está vazio | [Impacto][WHERE_NOTEMPTY] | ONDE_NOTEMVAZIO | 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] | ONDE_NOTONEOF | impactoWHERE_NOTONEOF1,2 | Extraia registros em que o campo Impacto seja preenchido por qualquer coisa, exceto os seguintes valores:
|
| Onde um de | [Impacto][WHERE_ONEOF][1 - Alto, 2 - Médio] | ONDE_ONEOF | impactoWHERE_ONEOF1,2 | Extraia registros em que o campo Impacto seja preenchido por um dos seguintes valores:
|