角色

預設 JSON 佈局具有以下三個角色。

• 代理 - 設定當代理登入 Webex Contact Center Desktop 以處理代理活動時所顯示的桌面配置。

• 監督員 - 設定當監督員登入 Webex Contact Center 桌面以僅處理監督員功能時所顯示的桌面配置。

  當監督員登入桌面時，將套用為主要小組指定的桌面配置。 如果未提供主要團隊，則應用全域佈局。 預設停用 APS 報告。

• supervisorAgent - 設定當監督員登入 Webex Contact Center Desktop 以處理監督員功能及代理活動時所顯示的桌面配置。

以下是基於角色的 JSON 佈局的頂級屬性：

{“agent”：{“version”：“0.1.0”，“appTitle”：“Webex Contact Center”，“logo”：“”，“taskPageIllustration”：“https://www.abc.com/image/logo.jpg”，“stopNavigateOnAcceptTask”：false，“dragDropEnabled”：false，“notificationTimer”：8，“maximumNotificationCount”：3，“browserNotificationTimer”：8，“wxmConfigured”：false，“desktopChatApp”：{“webexConfigured”：false，}“headerActions”：[“outdial”，“notification”]，“area”：{“advancedHeader”：{ ... }，“panel”：{ ... }，“導航”：{ ... }，“持久”：{ ... }，“無頭”：{ ... } }，}，“supervisor”：{“version”：“0.1.0”，“appTitle”：“Webex Contact Center”，“logo”：“”，“taskPageIllustration”：“https://www.abc.com/image/logo.jpg”，“stopNavigateOnAcceptTask”：false，“dragDropEnabled”：false，“notificationTimer”：8，“maximumNotificationCount”：3，“browserNotificationTimer”：8，“wxmConfigured”：false，“desktopChatApp”：{“webexConfigured”：false，}“headerActions”：[“outdial”，“notification”]，“area”：{“advancedHeader”：{ ... }，“panel”：{ ... }，“導航”：{ ... }，“持久”：{ ... }，“無頭”：{ ... }，“主頁”：{ ... } }，}“supervisorAgent”：{“version”：“0.1.0”，“appTitle”：“Webex Contact Center”，“logo”：“”，“taskPageIllustration”：“https://www.abc.com/image/logo.jpg”，“stopNavigateOnAcceptTask”：false，“dragDropEnabled”：false，“notificationTimer”：8，“maximumNotificationCount”：3，“browserNotificationTimer”：8，“wxmConfigured”：false，“desktopChatApp”：{“webexConfigured”：false，}“headerActions”：[“outdial”，“notification”]，“area”：{“advancedHeader”：{ ... }，“panel”：{ ... }，“導航”：{ ... }，“持久”：{ ... }，“無頭”：{ ... } }, } },

應用標題

在桌面的水平頁眉上指定標題。 默認標題為 Webex Contact Center。

範例:

“appTitle”：“Webex Contact Center”

標題可以是文本、圖像或空字串。 標題文字分兩行顯示。 如果文本超出第二行，則會顯示省略符號圖示，並且工具提示將顯示完整的標題。 樣式不能應用於標題。

您可以使用數據 URI (統一資源識別碼) 或在內容交付網路 (CDN)、亞馬遜雲科技 (AWS) 簡單存儲服務 (S3) 儲存桶或類似的託管服務上託管自定義標題圖像，然後指定託管圖像的 URL。 支援的標題圖像格式為 PNG、JPG、JPEG、GIF、SVG 和 WebP。 支援的標題圖像大小為 184 x 32 像素 (寬 x 高)。

標誌

為公司徽標指定 URL。 如果未提供 URL，則預設情況下會顯示 Webex Contact Center 徽標。

範例:

“徽標”：“https://my-cdn.com/logo.png”

您可以在 CDN、亞馬遜雲科技 (AWS) 簡單存儲服務 (S3) 儲存桶或類似的託管服務上託管自定義徽標圖像，然後指定託管映像的 URL。 支援的徽標圖像格式為 PNG、JPG、JPEG、GIF、SVG 和 WebP。 支援的徽標圖像大小為 96 x 32 像素 (寬 x 高)。

工作頁面插圖

根據組織首選項和品牌對齊方式為任務頁面指定自定義插圖。 當代理登錄時，任務頁面將顯示配置的插圖作為背景。 默認情況下，任務頁面顯示時不帶插圖。

範例:

“taskPageIllustration”：“https://www.abc.com/image/logo.jpg”，

您可以使用數據 URI，也可以在內容交付網路 (CDN)、亞馬遜雲科技 (AWS) 簡單存儲服務 (S3) 儲存桶或類似的託管服務上託管自定義插圖，然後指定託管插圖的 URL。 可以根據佈局定義在全域或團隊級別配置圖。 確保配置正確的 URL，以防止損壞的圖像顯示在桌面上。

支援的任務頁面插圖格式為 PNG、JPG、JPEG、GIF、SVG 和 WebP。 建議的插圖大小為 400 x 400 像素 (寬 x 高)。 如果自定義插圖大小大於建議的大小，則會根據任務頁面中的縱橫比調整插圖大小。 如果自定義插圖大小小於建議的大小，則任務頁面中將保留實際插圖大小。

stopNavigateOnAcceptTask

確定當代理在處理上一個任務時接受新任務時，是否將焦點轉移到新接受的任務上。 預設值為 False。

範例:

“stopNavigateOnAcceptTask”：false

如果該值設置為 true，則當使用者在桌面上接受新任務時，焦點將保留在上一個任務上，而不會轉移到新接受的任務上。 此設置可防止使用者在接受新請求時丟失任何數據。

例如，假設代理 1 正在與客戶 1 聊天，同時與客戶 2 進行語音通話。在語音通話期間，代理 1 在「互動控制」窗格中更新客戶 2 的詳細資訊。 目前，代理 1 在“任務清單”窗格中有兩個活動任務，重點是“交互控制”窗格。 當代理 1 接受來自客戶 3 的新聊天請求時，焦點仍保留在與客戶 2 的“交互控制”窗格上，而不會轉移到新接受的聊天請求上。

若要將焦點保留在上一個任務上，而不切換到新接受的任務，請選擇 stopNavigateOnAcceptTask 屬性值設置為 true 的自訂佈局 。

如果未在 JSON 佈局中輸入 stopNavigateOnAcceptTask 屬性值，桌面會將焦點轉移到新接受的任務上。 此行為類似於 stopNavigateOnAcceptTask 屬性值設定為 false 時。

dragDropEnabled

要在自定義頁面上啟用小部件的拖放和大小調整，請將值 設置為 true。 預設值為 False。

範例:

“dragDropEnabled”：假

通知計時器

設定在多長時間後 (以秒為單位)，桌面上的桌面通知將自動關閉。 通知將顯示在桌面的右上角。 預設逾時值為 8 秒。 逾時值的有效範圍為 1-10 秒。 要使超時更改生效，必須在進行更改後刷新瀏覽器。

範例:

“通知計時器”：8

最大通知計數

設定一次在桌面上顯示的桌面通知數。 預設值為 3。桌面通知的範圍為 1-10。 桌面通知堆疊在一起。 若有許多通知，則會根據 notificationTimer 設定略有延遲顯示。

瀏覽器通知計時器

設置持續時間 (以秒為單位)，之後桌面上的瀏覽器烤麵包機通知將自動關閉。 Toaster 是本機瀏覽器通知，僅當桌面不是活動的瀏覽器視窗或 Tab 時才會顯示。 桌面瀏覽器視窗或 Tab 在以下情況下處於非作用狀態

• 您正在處理其他瀏覽器視窗或標籤。

• 您正在處理其他應用程式。

• 您已最小化桌面瀏覽器視窗。

通知將顯示在桌面的右上角。 預設逾時值為 8 秒。 超時值的建議範圍為 5-15 秒。 要使超時更改生效，必須在進行更改後刷新瀏覽器。

範例:

“browserNotificationTimer”：8

wxm 已設定

（選用）若要設定 Webex Experience Management，請將值設為 true。 預設值為 False。

範例:

“wxmConfigured”：true

桌面聊天應用程式

配置多個 Cisco 提供的聊天應用程式，如 Webex App。

webex 已設定

Webex 應用程式及其消息傳遞和會議功能可以在桌面中配置。 此組態允許代理與其組織中的其他代理、監督員及主題專家 (SME) 進行協作，而無需離開桌面。

要在桌面中配置 Webex 應用程式，請執行以下操作：

• 在 Cisco Webex Control Hub 中，為使用者添加服務時，選中“ 高級消息傳遞 ”複選框 (使用者 > 管理使用者 > 服務 > 消息傳遞)。 有關詳細資訊，請參閱 Cisco Webex 網站管理中的管理用戶帳戶。

• 在自訂桌面配置中，將 webexConfigured 屬性值設定為 true。

  範例:

  “desktopChatApp”：{“webexConfigured”：true }，

  webexConfigured 屬性的 預設值為 false。

  Webex 僅當您將 webexConfigured 屬性值 設定 為 true 時，應用程式才可用於代理、主管和主管代理角色。 代理、主管或主管代理無法登出 Webex App。

  若要顯示 （Webex）圖示，在標頭操作 屬性中 輸入值 Webex 。 有關詳細資訊，請參閱 標頭操作。

  要為特定團隊啟用 Webex 應用程式，請選擇 webexConfigured 屬性值設定為 true 的自訂佈局。 具體操作，請參見 創建團隊。

您也可以在輔助資訊窗格、自訂頁面和自訂小工具中配置 Webex App。 有關詳細資訊，請參閱 輔助資訊窗格。

Webex 應用程式通知

使用 notificationTimer 和 browserNotificationTimer 屬性為通知計時器指定的值適用於 Webex App。 這些屬性的預設超時值為 8 秒。 有關詳細資訊，請參閱 notificationTimer 和 browserNotificationTimer。

標頭動作

變更桌面水平頁首上圖示的順序。 預設順序如下：

1. (Webex)

2. (撥出通話)

3. (通知中心)

按如下所示設定 headerActions 屬性的值 ：

範例:

若要變更圖示的預設順序，請在自訂配置中相應地輸入 headerActions 屬性和值。

範例：

區

區域 屬性是桌面佈局的核心部分。 您可以根據區域定義佈局。

“區域”：{“標題”：{ ... }，“advancedHeader：{ {”comp“：”widget-1“，”attributes“：{ ... }，“腳本”：.... } }，“panel”：{ ... }，“導航”：{ ... }，“持久”：{ ... }，“無頭”：{ ... } },

您可以設定以下 區域 物件：

• 面板：代表「輔助資訊」窗格中的第二個面板或最右側的面板。

• 導航：表示與頁面相關的自定義頁面及其導航元素。

• 持久性：表示持久性並顯示在桌面的所有頁面上的頁面級小部件。

• 無頭：表示沒有可視介面但在後台執行邏輯的小組件。

進階標題

自訂桌面水平頁眉上的顯示範圍及圖示順序。 預設順序如下：

1. (Webex)

2. (撥出通話)

3. (通知中心)

4. (代理狀態選擇器)

按如下所示設定 advancedHeader 屬性的值 ：

範例:

“advancedHeader”：[ {“comp”：“agentx-webex”}，{“comp”：“agentx-outdial”}，{“comp”：“agentx-notification”}，{“comp”：“agentx-state-selector”} {“comp”：“widget-1”，“attributes”：{ ... }，“腳本”：.... } ]

若要變更圖示的預設順序，請在自訂配置中相應地輸入 advancedHeader 屬性和值。

小部件由左到右流入下拉功能表。

持續性頁籤的屬性

要將自訂頁面和自訂小工具中的標籤設定為永久標籤，請在自訂配置中輸入 md-tab 的屬性 。

範例：將選項卡設置為持久性

{“comp”：“md-tabs”，“attributes”：{“persist-selection”：true，“tabs-id”：“containers 中所有標籤的唯一 id”}，}

當您將 md-tabs 設定 為持續 (persist-selection：true) 時，即使代理在桌面中的頁面或小工具之間切換，Agent Desktop 也會保留 Tab 選擇。

當輔助資訊窗格包含多個選項卡時，會自動顯示更多選項卡 下拉清單。

必須添加自定義 Tab 工具提示以提高可讀性和輔助功能。 要為自定義 Tab 添加工具提示，請使用 md-tooltip 包裝元件。 在消息屬性中 輸入工具提示資訊，並應用樣式 屬性值， 如以下示例 所示。

“comp”：“md-tooltip”，“attributes”：{“class”：“widget-tabs”，“message”：“示例 Tab 1”，“style”：“max-width：252px;最小寬度：110px;溢出：隱藏;文本溢出：省略號;空格：無換行;顯示：內聯塊;下邊距：-10px;“}，

若要在自訂 Tab 中啟用拖放功能，請在屬性 中添加以下屬性：

“comp”：“md-tabs”，“attributes”：{“class”：“widget-tabs”，“draggable”：true，“comp-unique-id”：“sample-dynamic-custom-tabs”}，

• 可拖動：將 可 拖動屬性值設置為 true。

• comp-unique-id：輸入一個唯一值來標識元件。

  範例：

  “comp-unique-id”：“sample-dynamic-custom-tabs” 

若為自訂的 Tab 啟用拖放功能，代理可以將 Tab 拖放到「輔助資訊」窗格中的所需位置。 若要將選項卡重置為預設的 Tab 順序，請添加以下屬性：

“comp”：“agentx-wc-more-actions-widget”，“attributes”：{“slot”：“settings”，“class”：“widget-pane”，“tabs-unique-id”：“sample-dynamic-custom-tabs”}，

• agentx-wc-more-actions-widget：輸入顯示為「 更多動作 」（）圖示。

• slot=“settings”：在元件中輸入一個屬性，該屬性在“更多操作”下拉列表中 顯示為“ 重置 Tab 順序 ” 選項。 代理可將「輔助資訊」窗格中的標籤重設為預設順序，方法是按一下 > 重置 Tab 順序。

• tabs-unique-id：輸入為 comp-unique-id 屬性定義的相同唯一值，以映射和重置 md-tabs 元件。

以下示例代碼使用 “更多操作” 和 “重置 Tab 順序 ”函數。

“comp”：“agentx-wc-more-actions-widget”，“attributes”：{“slot”：“settings”，“class”：“widget-pane”，“tabs-unique-id”：“sample-dynamic-custom-tabs”}，“children”：[{“comp”：“div”，“attributes”：{“textContent”：“Custom action”，“slot”：“custom-action”}，“children”：[{“comp”：“agentx-wc-notes-header-widget”}，{“comp”：“agentx-wc-menu-notification”} ] }]，}

可以擴展“更多操作 ” 下拉列表，以在“重置 Tab 順序 ”選項之後 添加其他自定義元件或小部件。 下面是 一組可應用於其他元件的樣式 屬性值示例。

“comp”：“md-tooltip”，“attributes”：{“class”：“widget-tabs”，“message”：“Sample Element”，“style”：“max-width：252px;最小寬度：110px;溢出：隱藏;文本溢出：省略號;空格：無換行;顯示：內聯塊;下邊距：-10px;“}，

• 從導覽列配置和存取客戶體驗管理指標小組件

• 使用自訂頁面上的標籤

• 包含聯絡人歷史記錄和螢幕彈出的預設輔助資訊窗格

• 帶有客戶體驗旅程小組件的輔助資訊窗格

從導覽列配置和存取客戶體驗管理指標小組件

範例：

{“nav”：{“label”：“Customer Experience Management Metrics”，“icon”：“/app/images/wxm.bcd45cc3.svg”，“iconType”：“other”，“navigateTo”：“wxm-metrics”，“align”：“top”}，“page”：{“id”：“wxm-metrics”，“widgets”：{“comp1”：{“comp”：“agentx-wc-cloudcherry-widget”，“attributes”：{“metrics”：true }，“properties”：{“userModel”：“$STORE.app.userModel”，“spaceId”：“”，“metricsId”：“”，“teamId”：“$STORE.agent.teamName”，“ani”：“$STORE.agentContact.taskSelected.ani”，“isDarkMode”：“$STORE.app.darkMode“}，”wrapper“：{”title“：”Customer Experience Journey“，”maximizeAreaName“：”app-maximize-area“} } }，”layout“：{”areas“：[ [”comp1“] ]，”size“：{”cols“：[1]，”rows“：[1] } } }，

使用自訂頁面上的標籤

範例：

{“nav”：{“label”：“Dynamic Tabs”，“icon”：“stored-info”，“iconType”：“momentum”，“navigateTo”：“dynamic-tabs”，“align”：“top”}，“page”：{“id”：“page-id-tabs”，“widgets”：{“comp1”：{“comp”：“md-tabs”，“child”：[{“comp”：“md-tab”，“textContent”：“One”，“attributes”：{“slot”：“Tab”} }，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”}，“children”：[{“comp”：“widget-two”，“script”：“http:/my-cdn.com/dynamic-widgets/widget-two.js”}] }，{“comp”：“md-tab”，“textContent”：“Two”，“attributes”：{“slot”：“Tab”} }，{“comp”：“md-tab-panel”，“textContent”：“Two Content”，“attributes”：{“slot”：“panel”} } ] }，“comp2”：{“comp”：“widget-two”，“script”：“http:/my-cdn.com/dynamic-widgets/widget-two.js”} }，“layout”：{“areas”：[ [“comp1”，“comp2”]，“size”：{“cols”：[1，1]，“rows”：[1] } } } }

包含聯絡歷史記錄和螢幕彈出的預設輔助資訊窗格

範例：

“panel”：{“comp”：“md-tabs”，“attributes”：{“class”：“widget-tabs”}，“children”：[{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“class”：“widget-pane-tab”}，“children”：[{“comp”：“slot”，“attributes”：{“name”：“CONTACT_HISTORY_TAB”} }] }，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”，“class”：“widget-pane”}，“children”：[{“comp”：“slot”，“attributes”：{“name”：“CONTACT_HISTORY”} }]，]}，{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“children”：[{“comp”：“slot”，“attributes”：{“slot”：“#”，“class”：“widget-pane-tab”}，{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“class”：“widget-pane-tab”}，“children”：[{“comp”：“slot”，“attributes”：{“name”：“SCREEN_POP_TAB”} }]，“可見性”：“SCREEN_POP”}，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”，“class”：“widget-pane”}，“child”：[{“comp”：“slot”，“attributes”：{“name”：“SCREEN_POP”} }]，“可見性”：“SCREEN_POP”} }，

帶有客戶體驗旅程小組件的輔助資訊窗格

範例：

“panel”：{“comp”：“md-tabs”，“attributes”：{“class”：“widget-tabs”}，“children”：[{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”}，“children”：[{“comp”：“slot”，“attributes”：{“name”：“WXM_JOURNEY_TAB”} }]，“可見性”：“WXM_JOURNEY”}，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”，“class”：“widget-pane”}，“children”：[{“comp”：“agentx-wc-cloudcherry-widget”，“properties”：{“userModel”：“$STORE.app.userModel”，“spaceId”：“”，“metricsId”：“”，“teamId”：“$STORE.agent.teamName”，“ani”：“$STORE.agentContact.taskSelected.ani”，“isDarkMode”：“$STORE.app.darkMode”}，“wrapper”：{“title”：“Customer Experience Journey”，“maximizeAreaName”：“app-maximize-area”} }]，{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“class”：“widget-pane-tab”}，“children”：{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“class”：“widget-pane-tab”}，“children”：[{“comp”：“slot”，“attributes”：{“name”：“CONTACT_HISTORY_TAB”} }]，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”，“class”：“widget-pane”}，“child”：[{“comp”：“slot”，“attributes”：{“name”：“CONTACT_HISTORY”} }，{“comp”：“md-tab”，“attributes”：{“slot”：“Tab”，“class”：“widget-pane-tab”}，“child”：[{“comp”：“slot”，“attributes”：{“name”：“SCREEN_POP_TAB”} }]，“可見性”：“SCREEN_POP”}，{“comp”：“md-tab-panel”，“attributes”：{“slot”：“panel”，“class”：“widget- 窗格”}，“子”：[{“comp”：“slot”，“attributes”：{“name”：“SCREEN_POP”} }]，“可見性”：“SCREEN_POP”}“可見性”：“SCREEN_POP”}，}，