建立您的第一張調適型卡片

Power Automate 中的調適型卡片可能會共用資訊區塊,或透過指定之資料來源的表單來收集資料。

不論是哪一種情況,您都必須草擬您將共用的資料集,和/或表單需要收集的資料。

提示

使用簡單的資料區塊,而不是複雜的資料表陣列。

先決條件

已安裝工作流程應用程式的 Microsoft Teams。

新增動作

在此程序中,您將會新增一個動作,此動作使用流程中先前動作的資料,將資訊張貼至 Microsoft Teams 管道。

  1. 登入 Power Automate

  2. 在頂端瀏覽列中選取我的流程

  3. 選取新流程>即時雲端流程

  4. 為您的流程命名。

  5. 選取手動觸發流程作為觸發程序。

  6. 選取建立

  7. 在設計工具中,選取新增步驟

  8. 搜尋 Microsoft Teams,然後選取將調適型卡片張貼至 Teams 管道並等待回覆做為動作。

  9. 選取您想要張貼卡片的小組頻道

  10. 將此 JSON 貼入訊息方塊中。

    {
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
            {
                "type": "TextBlock",
                "text": "Poll Request",
                "id": "Title",
                "spacing": "Medium",
                "horizontalAlignment": "Center",
                "size": "ExtraLarge",
                "weight": "Bolder",
                "color": "Accent"
            },
            {
                "type": "TextBlock",
                "text": "Header Tagline Text",
                "id": "acHeaderTagLine",
                "separator": true
            },
            {
                "type": "TextBlock",
                "text": "Poll Header",
                "weight": "Bolder",
                "size": "ExtraLarge",
                "spacing": "None",
                "id": "acHeader"
            },
            {
                "type": "TextBlock",
                "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vestibulum lorem eget neque sollicitudin, quis malesuada felis ultrices. ",
                "id": "acInstructions",
                "wrap": true
            },
            {
                "type": "TextBlock",
                "text": "Poll Question",
                "id": "acPollQuestion"
            },
            {
                "type": "Input.ChoiceSet",
                "placeholder": "Select from these choices",
                "choices": [
                    {
                        "title": "Choice 1",
                        "value": "Choice 1"
                    },
                    {
                        "title": "Choice 2",
                        "value": "Choice 2"
                    },
                    {
                        "title": "Choice 3",
                        "value": "Choice 3"
                    }
                ],
                "id": "acPollChoices",
                "style": "expanded"
            }
        ],
        "actions": [
            {
                "type": "Action.Submit",
                "title": "Submit",
                "id": "btnSubmit"
            }
        ]
    }
    
  11. 取代 JSON 中的下列內容。

    重要

    當您進行取代時,請勿移除任何引號。 您可以修改汽車選擇以符合您的需求:

    要變更的文字 新文字
    Header Tagline Text Power Automate 投票
    Poll Header 慣用的汽車型號
    Poll Question 請從此處所列的選項,對您慣用的汽車型號進行投票。
    以與您為什麼進行投票相關的原因或商務內容取代拉丁文字。 我們會讓員工投票,以判斷我們是否應該提供針對最受歡迎車輛調整大小的個人化停車位。
    Choice 1 (同時在兩個位置取代) Tesla
    Choice 2 (同時在兩個位置取代) Lexus
    Choice 3 (同時在兩個位置取代) Honda
  12. 選取新增步驟,然後搜尋並選取其中一個您擁有存取權的傳送電子郵件動作。

  13. 提供電子郵件收件者作為選取 [立即] 按鈕的人員 (使用來自觸發程序的動態內容中的電子郵件標記)。

  14. 設定電子郵件的內文,如下所示。 以動態語彙基元取代波浪括號 "{}" 中的字:
    您的投票回覆為 {acPollChoices} (acPollChoices 是來自「等候回應」動作的動態內容)。 這是由 {User Name} 提交 (User Name 是來自觸發程序的動態內容)

測試調適型卡片

若要測試您的工作,請執行您稍早建立的流程,並確認下列事項:

  • 流程執行沒有任何錯誤,而且會等待回應,並在 [執行] 畫面上顯示調適型卡片動作的等候指示器。

  • Teams 頻道已張貼新的調適型卡片。

  • 當您選取汽車型號,然後在調適型卡片的底部區段中選取提交按鈕來回應卡片時:

    • 調適型卡片上不會發生任何錯誤。

    • 流程執行成功完成。

  • 如果您已經設定等候回應動作底部的更新訊息區域 (如下所示的對應替代卡片),則在提交之後,卡片替代是有意義的。 否則,所有提交項目都只會重設表單。

    替代卡片。

  • 電子郵件通知中包含的內文會顯示提交回應的人員,以及選擇的汽車。

恭喜! 您剛製作了第一張互動式調適型卡片!

完成第一張卡片。

調適型卡片的疑難排解祕訣

建立調適型卡片時最常遇到的問題包括:

  • 流程執行錯誤通常是由下列其中一個因素所造成:

    在此情況下,此錯誤可能與下列螢幕擷取畫面類似:

    錯誤訊息。

    • JSON 格式不正確。這種情況通常不如預期般複雜。 這些最常見的情況是:

      • 在 JSON 中的值周圍有彎引號或缺少引號。 請務必檢查 JSON,以確保所有文字值都以雙引號括住,而且數字括在引號中。 所有引號都應該是直線,而不是彎的。

      • 您可以透過將 JSON 貼入卡片承載編輯器來驗證 JSON 的格式。

    • 缺少影像 URL – 調適型卡片內的所有影像值都必須指的是有效的 URL。 調適型卡片不直接支援完整的影像內容。 將 URL 貼入瀏覽器來測試影像連結,以查看是否顯示影像。

  • 調適型卡片看起來可能不像在設定樣式和架構條件約束期間所預期的內容:

    • 檢查預留位置值、文字樣式和任何標記語言是否符合調適型卡片結構描述需求 (請檢閱這裡調適型卡片結構描述最佳做法)

    • 利用 Visual Studio Code 調適型卡片驗證程式。 若要從 Visual Studio Code 應用程式進行安裝,請開啟擴充功能服務商場,然後搜尋調適型卡片檢視器

      Visual Studio Code 擴充功能。

Visual Studio Code 中安裝的調適型卡片檢視器擴充功能截斷的螢幕擷取畫面 (快速鍵:啟用後按 Ctrl+V+A)。

  • 調適型卡片提交後發生的錯誤通常是由下列原因所造成:

    • 使用名稱中不包含「等候回應」的動作

      再次嘗試。

    • 嘗試多次提交卡片。 每張調適型卡片只能提交一次,之後將會忽略所有其他提交。