Passar para o conteúdo principal

IF/ELSE no Modelo de proposta e documento

Jociel Adachi avatar
Escrito por Jociel Adachi
Atualizado há mais de um mês

Documentação de Uso dos Blocos Condicionais no Editor de HTML

Introdução

Este documento descreve como usar blocos condicionais personalizados no editor de HTML, permitindo a inclusão ou exclusão de conteúdo com base em condições específicas. Esses blocos condicionais são usados para gerar conteúdo dinâmico, facilitando a personalização de textos, templates e outras estruturas baseadas em variáveis e condições.

Sintaxe Básica

Os blocos condicionais seguem a seguinte estrutura:

{{If condição}}

Conteúdo se a condição for verdadeira.

{{else}}

Conteúdo se a condição for falsa.

{{endif}}

  • {{If condição}}: Define o início de um bloco condicional. A condição deve ser expressa usando variáveis ou valores diretamente.

  • {{else}} (opcional): Define o conteúdo a ser exibido caso a condição seja falsa.

  • {{endif}}: Finaliza o bloco condicional.

Operadores Suportados

Os seguintes operadores podem ser usados para definir condições dentro dos blocos [[If]]:

  • Comparação de igualdade:

    • ==: Verifica se dois valores são iguais.

    • !=: Verifica se dois valores são diferentes.

  • Comparação numérica:

    • >: Verifica se o valor da esquerda é maior que o valor da direita.

    • <: Verifica se o valor da esquerda é menor que o valor da direita.

    • >=: Verifica se o valor da esquerda é maior ou igual ao valor da direita.

    • <=: Verifica se o valor da esquerda é menor ou igual ao valor da direita.

  • Operadores de texto:

    • Contains: Verifica se uma string contém outra string.

    • Not Contains: Verifica se uma string não contém outra string.

    • StartsWith: Verifica se uma string começa com um determinado valor.

    • EndsWith: Verifica se uma string termina com um determinado valor.

  • Verificação de vazio:

    • IsEmpty: Verifica se uma variável ou string está vazia.

    • IsNotEmpty: Verifica se uma variável ou string não está vazia.

Exemplos de Uso

1. Comparação de Igualdade

Exemplo

{{If [[Status]] == "Ativo"}}

O usuário está ativo.

{{else}}

O usuário não está ativo.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Status]] é igual a "Ativo".

  • Resultado:

    • Se [[Status]] == "Ativo", será exibido "O usuário está ativo."

    • Caso contrário, será exibido "O usuário não está ativo."

2. Comparação Numérica

Exemplo

{{If [[Quantidade]] > 10}}

Há mais de 10 itens em estoque.

{{else}}

Estoque baixo.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Quantidade]] é maior que 10.

  • Resultado:

    • Se [[Quantidade]] for maior que 10, será exibido "Há mais de 10 itens em estoque."

    • Caso contrário, será exibido "Estoque baixo."

3. Operadores Contains e Not Contains

Exemplo com Contains

{{If [[Mensagem]] Contains "erro"}}

A mensagem contém a palavra 'erro'.

{{else}}

A mensagem não contém a palavra 'erro'.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Mensagem]] contém a palavra "erro".

  • Resultado:

    • Se a string [[Mensagem]] contiver a palavra "erro", será exibido "A mensagem contém a palavra 'erro'."

    • Caso contrário, será exibido "A mensagem não contém a palavra 'erro'."

Exemplo com Not Contains

{{If [[Aviso]] Not Contains "importante"}}

Este aviso não contém informações importantes.

{{else}}

Este aviso é importante.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Aviso]] não contém a palavra "importante".

  • Resultado:

    • Se a string [[Aviso]] não contiver "importante", será exibido "Este aviso não contém informações importantes."

    • Caso contrário, será exibido "Este aviso é importante."

4. Operadores StartsWith e EndsWith

Exemplo com StartsWith

{{If [[Nome]] StartsWith "Jo"}}

O nome começa com 'Jo'.

{{else}}

O nome não começa com 'Jo'.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Nome]] começa com "Jo".

  • Resultado:

    • Se a string [[Nome]] começar com "Jo", será exibido "O nome começa com 'Jo'."

    • Caso contrário, será exibido "O nome não começa com 'Jo'."

Exemplo com EndsWith

{{If [[Nome]] EndsWith "son"}}

O nome termina com 'son'.

{{else}}

O nome não termina com 'son'.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Nome]] termina com "son".

  • Resultado:

    • Se a string [[Nome]] terminar com "son", será exibido "O nome termina com 'son'."

    • Caso contrário, será exibido "O nome não termina com 'son'."

5. Verificação de Vazio: IsEmpty e IsNotEmpty

Exemplo com IsEmpty

{{If [[Status]] IsEmpty}}

O status está vazio.

{{else}}

O status foi definido.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Status]] está vazia.

  • Resultado:

    • Se a variável [[Status]] estiver vazia (ou seja, não tiver valor), será exibido "O status está vazio."

    • Caso contrário, será exibido "O status foi definido."

Exemplo com IsNotEmpty

{{If [[Descricao]] IsNotEmpty}}

Há uma descrição disponível.

{{else}}

Nenhuma descrição foi fornecida.

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Descricao]] não está vazia.

  • Resultado:

    • Se a variável [[Descricao]] tiver um valor (ou seja, não estiver vazia), será exibido "Há uma descrição disponível."

    • Caso contrário, será exibido "Nenhuma descrição foi fornecida."

Regras Importantes

  1. Variáveis Interpoladas: As variáveis dentro das condições, como [[Status]] ou [[Nome]], devem ser substituídas pelos seus valores antes de serem processadas.

  2. Casos Insensíveis a Maiúsculas: As comparações de texto, como Contains, StartsWith, e EndsWith, são insensíveis a maiúsculas e minúsculas. Ou seja, "Erro" e "erro" serão tratados da mesma forma.

  3. Valores Numéricos: Para comparações numéricas (>, <, >=, <=), os valores à esquerda e à direita devem ser numéricos. Se uma das variáveis não for numérica, a condição será considerada falsa.

  4. Bloco else Opcional: O bloco [[else]] é opcional. Se não for incluído, o conteúdo dentro do bloco [[If]] será simplesmente omitido se a condição for falsa.

Casos de Uso Comuns

Exemplo 1: Validação de Status

{{If [[Status]] == "Pendente"}}

O pedido está pendente.

{{else If [[Status]] == "Concluído"}}

O pedido foi concluído.

{{else}}

O pedido foi cancelado ou está em outro status.

{{endif}}

Explicação

  • Condição: O bloco avalia o status do pedido e exibe mensagens personalizadas dependendo de seu valor.

  • Resultado:

    • Se [[Status]] == "Pendente", exibe "O pedido está pendente."

    • Se [[Status]] == "Concluído", exibe "O pedido foi concluído."

    • Se o [[Status]] for outro, exibe "O pedido foi cancelado ou está em outro status."

Exemplo 2: Verificar Nome do Usuário

{{If [[Nome]] IsNotEmpty}}

Bem-vindo, [[Nome]]!

{{else}}

Bem-vindo, visitante!

{{endif}}

Explicação

  • Condição: Verifica se a variável [[Nome]] contém um valor. Se contiver, exibe uma mensagem personalizada com o nome do usuário; caso contrário, exibe uma mensagem padrão.

  • Resultado:

    • Se [[Nome]] estiver definido, exibe "Bem-vindo, [Nome]!"

    • Se [[Nome]] estiver vazio, exibe "Bem-vindo, visitante!"

Conclusão

O uso de blocos condicionais em seu editor de HTML permite criar conteúdo altamente dinâmico e personalizado com base em variáveis e condições. Com suporte a uma ampla gama de operadores e verificações de texto e valores, você pode facilmente controlar o conteúdo exibido com base nas informações disponíveis no momento da renderização.

Esses blocos proporcionam flexibilidade e poder na personalização de documentos, páginas e templates, otimizando a comunicação e a exibição de dados para seus usuários.

Espero que este tutorial tenha sido útil. Se você tiver alguma dúvida, sinta-se à vontade para perguntar no Intercom.

Respondeu à sua pergunta?