Atualizar a notificação de inspeção para usar um cartão adaptável

Neste artigo, você alterará as notificações de inspeção provenientes do aplicativo Inspeções de mensagens baseadas em HTML para cartões adaptáveis no Microsoft Teams.

Os cartões adaptáveis tornam as notificações mais interativas. Postagens em canais são ótimas, mas são uma comunicação unilateral. Os cartões adaptáveis oferecem notificações mais interativas, permitindo a personalização da mensagem, e a capacidade de fazer um hiperlink para o aplicativo ou fornecem a capacidade de atualizar os dados do aplicativo do cartão.

Assista a este vídeo para aprender como atualizar a notificação de inspeção para usar um cartão adaptável:

Pré-requisitos

Antes de começar, você deve ter instalado e configurado o aplicativo de exemplo Inspeção com as permissões necessárias para editá-lo no Teams.

Criar o fluxo do Power Automate para gerar o cartão adaptável

Comece com o aplicativo pessoal do Power Apps no Teams e localize o aplicativo Inspeção. Para facilitar o uso, você pode clicar com o botão direito do mouse no logotipo do Power Apps no Teams e selecionar Destacar aplicativo para trabalhar com o Power Apps Studio em sua própria janela.

  1. Selecione o aplicativo Inspeção para abrir o Power Apps Studio no Teams e comece a editar o aplicativo.

  2. Na barra de menus superior, selecione as reticências verticais à direita da opção Configurações. Isso revelará três opções: Power Automate, Coleções e Variáveis.

  3. Selecione Power Automate para abrir o menu da barra lateral Dados no lado direito da tela. Você verá todos os fluxos disponíveis aqui.

  4. Selecione Criar um novo fluxo. Isso iniciará o Power Automate studio em uma janela separada do navegador. Verifique se você está no ambiente correto para a equipe que contém o aplicativo que você está tentando alterar antes de continuar.

  5. Na área superior esquerda, você verá que o fluxo tem o nome Sem título. Selecione esse texto para alterar o nome para Cartão Adaptável do Inspeção para o Teams.

  6. Adicione o gatilho do Power Apps. Isso nos permitirá disparar o fluxo do Power Apps e adicionar valores para passar do Power Apps para o Power Automate.

  7. Em seguida, adicione quatro ações Inicializar Variável. Essas ações serão usadas para armazenar informações do Power Apps e armazenar um link para o aplicativo Revisar Inspeções. Renomeie cada uma das ações da seguinte forma:

    • Inicializar variável: Título do Cartão
    • Inicializar variável: Local
    • Inicializar variável: Tipo de Trabalho
    • Inicializar variável: Link do Revisar Inspeções

    Etapas do fluxo de cartão adaptável da notificação de inspeção

  8. Defina cada um dos valores "Tipo" como "Cadeia de Caracteres" e adicione um nome para cada um: varCardTitle, varLocation, varWorkType e varReviewInspectionLink, respectivamente.

  9. Para as ações Título do Cartão, Local e Tipo de Trabalho, selecione a área do campo Valor para revelar o menu Conteúdo dinâmico.

  10. Selecione Pergunte no Power Apps. Isso criará uma variável no gatilho do Power Apps para permitir a passagem de dados do aplicativo para o Power Automate.

  11. Para a ação Link do Revisar Inspeções, vamos colar o link na guia em que está o aplicativo. Abra o aplicativo Revisar Inspeções no canal do Teams e selecione o botão no canto superior direito para destacar o aplicativo para sua própria janela. Depois, você pode copiar a URL direta para o aplicativo. Volte ao Power Automate studio. Clique com o botão direito do mouse na área do campo Valor na ação Link do Revisar Inspeções e cole o link.

    Dica

    Para saber como criar links profundos no Microsoft Teams, consulte Criar link profundo.

  12. Adicione uma ação Postar cartão adaptável em um chat ou canal. Defina o valor de Postar como como Usuário e o valor Postar em como Canal.

  13. Nos campos Equipe e Canal, selecione a Equipe e o Canal em que você gostaria de postar o cartão adaptável.

Você pode gerar seu cartão adaptável JSON acessando https://adaptivecards.io. No campo Cartão Adaptável, copie e cole o seguinte:

{
    "type": "AdaptiveCard",
    "body": [
{
    "type": "TextBlock",
    "size": "large",
    "weight": "Bolder",
    "text": "@{variables('varCardTitle')}",
    "wrap": true
},
{
    "type": "TextBlock",
    "text": "A new @{variables('varWorkType')} has been submitted!",
    "wrap": true
},
{
    "type": "TextBlock",
    "text": "For the location: @{variables('varLocation')}",
    "wrap": true
}
],
    "actions": [
{
    "type": "Action.OpenUrl",
    "title": "View @{variables('varWorkType')}",
    "url": "@{variables('varReviewInspectionsLink')}"
}
],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.2"
}
  1. No campo Assunto, copie e cole o seguinte:

    New @{variables('varWorkType')} submitted
    

    Etapa Postar cartão adaptável no fluxo

    Isso definirá as características do cartão adaptável e usará as variáveis do Power Apps nele.

  2. Salve e teste o fluxo para garantir que ele funciona corretamente. Selecionar manualmente na barra lateral Testar Fluxo permitirá que você insira as variáveis Título do Cartão, Local e Tipo de Trabalho.

Adicionar o fluxo ao aplicativo Inspeção

Depois de verificar se o fluxo está funcionando corretamente, você poderá adicioná-lo ao aplicativo Inspeção.

  1. Volte para o Power Apps Studio Studio onde o aplicativo Inspeção estava sendo editado.

  2. No Modo de Exibição de Árvore no lado esquerdo, selecione a Tela Revisar.

  3. Selecione o botão Enviar inspeção (denominado btnContinueSubmitInspection no Modo de Exibição de Árvore). Vamos adicionar o fluxo do Power Automate que criamos para esse botão.

    Botão Enviar Inspeção na tela Visão geral do Inspeção

  4. Primeiro, copiaremos o código que está na propriedade OnSelect do botão. Um problema com a adição de fluxos do Power Automate para controles no Power Apps é que qualquer código existente no controle será removido. Para contornar isso, cole o código copiado em um editor de texto, como o Bloco de Notas, e edite-o para colá-lo novamente na propriedade OnSelect quando terminar. Depois de colar o código, certifique-se de que todo o código foi adicionado.

  5. Com o botão ainda selecionado, selecione as reticências verticais à direita de Configurações na parte superior. Selecione Power Automate, o que revelará a barra lateral Dados.

  6. Agora você verá o fluxo Cartão Adaptável do Inspeção para o Teams na seção Fluxos disponíveis. Selecione-o e adicione-o ao botão.

  7. Agora você precisará editar o código colado. Encontre e substitua a parte da fórmula a seguir, conforme mostrado abaixo.

    Remova a seção da fórmula:

    MicrosoftTeams.PostMessageToChannelV3(
                    gblPlannerGroupId,
                    gblRecordSettings.'Parameter (Notification Channel Id)',// gblParamChannelId,
                    {
                        content: Concatenate(
                            With(
                                {
                                    varDefault: "A new " & Lower(gblWorkType) & " has been submitted!",
                                    varOOBTextId: "_translateCommon__" & gblWorkType & "Submitted"
                                },
                                With(
                                    {
                                        varLocalizedText: LookUp(
                                            colLocalization,
                                            OOBTextID = varOOBTextId,
                                            LocalizedText
                                        )
                                    },
                                    Coalesce(
                                        varLocalizedText,
                                        varDefault
                                    )
                                )
                            ),
                    //"A new " & Lower(gblWorkType) & " has been submitted!",
                            "<br></br>",
                            "<b>" & With(
                                {
                                    varDefault: "For the Location:",
                                    varOOBTextId: "_translateCommon__InspectionForLocation"
                                },
                                With(
                                    {
                                        varLocalizedText: LookUp(
                                            colLocalization,
                                            OOBTextID = varOOBTextId,
                                            LocalizedText
                                        )
                                    },
                                    Coalesce(
                                        varLocalizedText,
                                        varDefault
                                    )
                                )
                            ) & " " & "</b>",
                    //"<b>For the Location: </b>",
                            gblLastInspection.Location.Name
                        ),
                        contentType: "html"
                    },
                    {subject: gblLastInspection.Name}
                )
    

    Adicione seção a uma fórmula:

    InspectionAdaptiveCardToTeams.Run(gblLastInspection.Name,
    gblLastInspection.Location.Name, Lower(gblWorkType))
    

    Envie a fórmula de inspeção atualizada.

    Esta fórmula contém a referência ao fluxo que acabamos de adicionar e as variáveis a serem passadas para o Power Automate.

  8. Copie todo o texto editado e cole-o de volta na propriedade OnSelect do botão Enviar inspeção. Verifique se não há erros no botão.

  9. Selecione a Tela de Boas-Vindas no Modo de Exibição de Árvore, visualize o aplicativo e insira uma inspeção de teste para verificar se o fluxo está postando o cartão adaptável no canal do Teams que você definiu no fluxo.

    Cartão adaptável da notificação de inspeção no Teams

Consulte também

Observação

Você pode nos falar mais sobre suas preferências de idioma para documentação? Faça uma pesquisa rápida. (Observe que esta pesquisa está em inglês)

A pesquisa levará cerca de sete minutos. Nenhum dado pessoal é coletado (política de privacidade).