Създай персонализирано оформление на работния плот

Общ преглед

Функцията Desktop Layout ви позволява да конфигурирате Webex Contact Center Desktop според изискванията на вашия бизнес. Можете да персонализирате елементи като лого, заглавие и джаджи. Можеш да създадеш оформление на работния стол и да го зададеш на екип. Това оформление генерира агентското изживяване на десктопа за всички агенти, които влизат като част от този екип.

Съществуват два вида разпределения:

Глобално оформление: Това оформление е системно генерирано оформление, което се задава по подразбиране при създаване на екип. За повече информация вижте Управление на екипи. Когато създадете екип, Глобалното оформление автоматично се задава като десктоп оформление на екипа. Не можете да изтриете тази разположение.
Персонализирано оформление: Оформление, което предоставя персонализирано изживяване на работния плот. Можете да създадете персонализирано оформление за един или повече отбора.

Ако зададете ново оформление на работния плот, когато агентът е влязъл, агентът трябва да презареди страницата, за да види новото оформление.

Webex Contact Center Desktop поддържа три персонажа:

Агент
Надзорник
Супервайзор и агент

JSON файлът за оформление има отделни секции за всяка от персоните. Администраторът трябва да конфигурира настройките за всяка персона в съответния раздел на JSON файла за оформление. За повече информация относно примерен JSON файл за оформление, вижте JSON Layout Top-Level Properties.

Когато Cisco добави нова функция към оформлението на работния плот, непромененото оформление се обновява автоматично с новите функции. Обновеното оформление на работния плот е автоматично достъпно за съществуващите екипи, които използват непромененото оформление на работния плот. Потребителите на Desktop устройства, използващи непромененото оформление на работния плот, получават новите функции, базирани на оформление, когато влизат или презареждат браузъра.

Ако използвате стандартния Desktop Layout.json файл без никакви промени, той се счита за непроменено оформление. Въпреки това, ако изтеглите Default Desktop Layout.json файла и го качите отново, той се счита за променено оформление, дори ако съдържанието или името на файла не са променени.

За екипи, които използват персонализирано оформление на работния плот, администраторите трябва периодично да обновяват дефиницията на оформлението, за да добавят нови функции. Когато администраторите видят непроменено оформление или екип, който използва непроменено оформление, се показва съобщение, което показва, че нови функции на работния стол се прилагат автоматично.

В Desktop-а има два типа джаджи — базирани на iframe и базирани на уеб компоненти. Хедърът, навигацията (персонализирана страница), персистентната зона, безглавата зона и aux панелът са персонализируемата зона в десктопа. Това не са джаджи.

Следващият списък описва пространствата, които можете да конфигурирате. Изображенията илюстрират разположението на работния плот:

Област за заглавие и лого: Това поле показва логото Webex Contact Center и името (по подразбиране) в горния ляв ъгъл на екрана.
Хоризонтална заглавна област: Това пространство има конфигурируема зона, която е попълнена с персонализирани джаджи. Тези джаджи могат да показват, например, вградена информация и падащи менюта. Тъй като височината на този хедър е само 64 пиксела, височината на джаджата не може да премине височината на хедъра.
Работно пространство : Това пространство се променя според избора на навигационната лента или когато агентът взаимодейства с клиенти. Когато агент е на повикване, тази област показва панела за контрол на взаимодействието и спомагателната информация (която включва персонализирани джаджи и постоянни джаджи). Когато агент взаимодейства по имейл, чат или социални канали, тази област показва работното пространство и допълнителния информационен панел (който включва зоната с постоянни джаджи).

Персонализираната страница се показва в интерфейса на работното пространство в интерфейса на работното пространство. Можете да достъпите персонализираната страница чрез икони в навигационната лента. Всяка персонализирана страница може да съдържа една или повече персонализирани джаджи.

Custom Widget е приложение на трета страна, конфигурирано в JSON оформлението. Можете да поставите персонализирания уиджет на персонализираната страница, персонализиран Tab (панел за допълнителна информация), или в хоризонталния хедър на работния плот.
Област на навигационната лента : Използвайте това пространство, за да добавите навигационни елементи и да достъпите персонализирани страници.

Примерен потребителски интерфейс на настолния компютър за глас

Примерен потребителски интерфейс на настолния компютър за нови дигитални канали

Свойства на JSON Layout на най-високо ниво

Роли

Стандартният JSON дизайн има три следващи роли.

Agent — За да настрои оформлението на работния плот да се показва, когато агент влезе в Webex Contact Center работния плот, за да обработва дейностите на агентите.
Supervisor — За да настрои оформлението на работния плот да се показва, когато супервайзор влезе в Webex Contact Center Desktop, за да обработва само възможностите на супервизора.

Когато супервайзор влезе в Desktop-а, се прилага разпределението на работния плот, определено за основния екип. Ако не предоставите основен екип, се прилага глобалното оформление. По подразбиране APS отчетите са деактивирани.
supervisorAgent — За задаване на оформлението на работния плот да се показва, когато супервайзор влезе в Webex Contact Center Desktop, за да обработва както възможностите на супервайзора, така и дейностите на агента.

Можете да добавяте или модифицирате уиджети за всяка роля в съответната персона на съответния JSON файл за оформление.

Следните са най-горните характеристики на 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": { ... }, "панел": { ... }, "navigation": { ... }, "постоянен": { ... }, "Безглава": { ... } }, }, "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": { ... }, "панел": { ... }, "navigation": { ... }, "постоянен": { ... }, "Безглава": { ... }, "homePage": { ... } }, } "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": { ... }, "панел": { ... }, "navigation": { ... }, "постоянен": { ... }, "Безглава": { ... } }, } },

appTitle
емблема
taskPageIllustration
stopNavigateOnAcceptTask
dragDropEnabled
Таймер за известие
maximumNotificationCount
browserNotificationTimer
wxmКонфигурирано
desktopChatApp
Площ
advancedHeader

Промените, направени в свойствата на оформлението на JSON, влизат в сила при обновяване на браузъра на работния плот.
Ако функция, която сте активирали в JSON оформлението, не е налична на работния плот, свържете се с Cisco Поддръжка, за да я активирате.
Всички свойства в JSON оформлението са чувствителни към регистри.

appTitle

За да се зададе заглавие в хоризонталния хедър на работния плот. Стандартното заглавие е Webex Contact Center.

Пример:

"appTitle": "Webex Contact Center"

Стандартният appTitle е променен от Contact Center Desktop на Webex Contact Center. Няма влияние върху съществуващите персонализирани оформления, които използват старото стандартно приложение Title (Contact Center Desktop). За да използвате новото appTitle, трябва да промените персонализираното оформление. Въпреки това, новото глобално оформление използва стандартния appTitle като Webex Contact Center.

Заглавието може да бъде текст, изображение или празен низ. Заглавният текст е изпъкнат в два реда. Ако текстът надхвърля втория ред, се показва икона с елипса, а подсказката показва цялото заглавие. Стиловете не могат да се прилагат към заглавието.

Можете да използвате данни URI (Uniform Resource Identifier) или да хоствате персонализирано заглавно изображение в мрежа за доставка на съдържание (CDN), Amazon Web Services (AWS), Simple Storage Service (S3) bucket или подобна хостинг услуга, и след това да посочите URL адреса на хостираното изображение. Поддържаните формати за заглавни изображения са PNG, JPG, JPEG, GIF, SVG и WebP. Поддържаният размер на заглавното изображение е 184 x 32 пиксела (ширина x височина).

емблема

За да се посочи URL за логото на компанията. Ако не предоставите URL, логото Webex Contact Center се появява по подразбиране.

Пример:

"лого": "https://my-cdn.com/logo.png"

Можете да хоствате персонализирано лого изображение в CDN, Amazon Web Services (AWS) Simple Storage Service (S3) кофа или подобна хостинг услуга и след това да посочите URL адреса на хостваното изображение. Поддържаните формати за лого изображения са PNG, JPG, JPEG, GIF, SVG и WebP. Поддържаният размер на изображението на логото е 96 x 32 пиксела (ширина x височина).

Таблица 1. Матрица за дисплей за appЗаглавие и лого Базирано на конфигурацията на работния плот
Условие	Пример	appTitle	емблема
Ако appTitle и логото не са конфигурирани	`"appTitle": "", "logo": "",`	Без заглавие	Стандартно лого
Ако appTitle и логото са конфигурирани	`"appTitle": "ABC Company", "logo": "https://my-cdn.com/abclogo.png",`	Конфигуриран текст	Конфигурирано лого
Ако appTitle е конфигуриран и логото не е конфигурирано	`"appTitle": "ABC Company", "logo": "",`	Конфигуриран текст	Стандартно лого
Ако appTitle не е конфигуриран и логото е конфигурирано	`"appTitle": "", "logo": "https://my-cdn.com/abclogo.png",`	Без заглавие	Конфигурирано лого
Ако appTitle е конфигуриран и логото не е предпочитано	`"appTitle": "ABC Company", "logo": "no-logo",`	Конфигуриран текст	Без лого
Ако appTitle не е конфигуриран и логото не е предпочитано	`"appTitle": "", "logo": "no-logo",`	Без заглавие	Без лого
Ако appTitle се добави като конфигуриране на изображение и лого	`"appTitle": "https://my-cdn.com/abccompanylogo.png ", "logo": "https://my-cdn.com/abclogo.png",`	Конфигурирано изображение	Конфигурирано лого
Ако appTitle се добави като изображение и лого, не се конфигурира	`"appTitle": "https://my-cdn.com/abccompanylogo.png ", "logo": "",`	Конфигурирано изображение	Стандартно лого
Ако appTitle се добави като изображение и лого, не е предпочитано	`"appTitle": "https://my-cdn.com/abccompanylogo.png ", "logo": "no-logo",`	Конфигурирано изображение	Без лого

Персонализираният размер на изображението се настройва според съотношението на страните. Персонализираният текст на заглавието, който е конфигуриран по-рано, сега може да се появява в два реда на работния плот. За да избегнете това, можете да промените персонализирания текст на заглавието.
Ако заглавието и логото не са конфигурирани в хоризонталния хедър на работния плот, това пространство се използва от уиджетите на заглавието. Уиджетите на заглавието трябва да са правилно конфигурирани, за да използват пространството за заглавие и лого.
Заглавието и логото заедно не могат да надвишават максималната ширина от 304 пиксела (включително покритието). Ако ширината на логото е по-малка от 96 пиксела, останалата ширина може да се използва за заглавието.
Ако персонализираният размер на изображението е по-голям от поддържания, размерът на изображението се настройва според съотношението на страните в хоризонталния хедър. Ако персонализираният размер на изображението е по-малък от поддържания, реалният размер на изображението се запазва в хоризонталния хедър.

taskPageIllustration

Да се специфицира персонализирана илюстрация за страницата със задачи, базирана на предпочитанията на организацията и съгласуваността на бранда. Когато агент влезе, страницата със задачите показва конфигурираната илюстрация като фон. По подразбиране страницата със задачата се появява без илюстрации.

Пример:

"taskPageIllustration": "https://www.abc.com/image/logo.jpg",

Можете да използвате данни URI или да хоствате персонализирана илюстрация в мрежа за доставка на съдържание (CDN), Amazon Web Services (AWS) Simple Storage Service (S3) bucket или подобна хостинг услуга и след това да посочите URL адреса на хостваната илюстрация. Илюстрацията може да бъде конфигурирана на глобално или екипно ниво въз основа на дефиницията на оформлението. Уверете се, че сте конфигурирали правилния URL, за да предотвратите показването на счупено изображение на работния плот.

Поддържаните формати за илюстрации на страниците със задачи са PNG, JPG, JPEG, GIF, SVG и WebP. Препоръчителният размер на илюстрацията е 400 x 400 пиксела (ширина x височина). Ако размерът на персонализираната илюстрация е по-голям от препоръчителния, размерът на илюстрацията се коригира според съотношението на страните на страницата със задачата. Ако размерът на персонализираната илюстрация е по-малък от препоръчителния, реалният размер на илюстрацията се запазва на страницата със задачата.

Webex Contact Center interface example of a custom illustration retraining the actual size. — ***Пример за персонализирана илюстрация, запазваща реалния размер***

Webex Contact Center interface example of a custom illustration adjusted based on the aspect ratio. — ***Примерен пример за персонализирана илюстрация, коригирана според съотношението на страните***

stopNavigateOnAcceptTask

Да определи дали да се пренасочи вниманието към новоприета задача, когато агентът приеме новата задача, докато работи по предишна. По подразбиране стойността е false.

Пример:

"stopNavigateOnAcceptTask": false

Ако стойността е зададена като вярна, когато потребителят приеме нова задача на работния плот, фокусът се запазва върху предишната задача и не се прехвърля към новоприетата задача. Тази настройка предотвратява загуба на данни при приемане на нова заявка.

Например, представете си, че Агент 1 е в чат с Клиент 1 и едновременно на гласов разговор с Клиент 2. По време на гласовото обаждане Агент 1 актуализира данните за Клиент 2 в панела за контрол на взаимодействието. В момента Агент 1 има две активни задачи в панела със списък със задачи, като фокусът е върху панела за контрол на взаимодействието. Когато Агент 1 приеме нова заявка за чат от Клиент 3, фокусът остава върху панела за контрол на взаимодействието с Клиент 2 и не се прехвърля към новоприетата заявка за чат.

За да запазите фокуса върху предишната задача и да не прехвърлите към новоприетата задача, изберете персонализираното оформление с стойността на свойството stopNavigateOnAcceptTask на true.

Ако стойността на свойството stopNavigateOnAcceptTask не е въведена в JSON оформлението, работният плот премества фокуса към новоприетата задача. Поведението е подобно на това, когато стойността на свойството stopNavigateOnAcceptTask е зададена на false.

Тази настройка важи за всички задачи (гласови и цифрови канали), изпълнявани на десктопа — като приемане на задача, конференция, консултация или трансфер, както и за изходящи обаждания, изходящи кампании, автоматично приключване и т.н.
Настройката не се прилага, ако потребителят на работния стол е на страницата Home, без активна задача в панела със списък със задачи. В такъв случай, когато се прие нова задача, фокусът се измества от страницата Home към новоприетата задача.

dragDropEnabled

За да активирате плъзгане и пускане и преоразмеряване на уиджетите на персонализираните страници, задайте стойността на true. По подразбиране стойността е false.

Пример:

"dragDropEnabled": false

За повече информация относно активирането на функцията за плъзгане и пускане на табовете в панела за допълнителна информация, вижте Панел за допълнителна информация.

Таймер за известие

За да се зададе продължителността (в секунди), след което известията на работния плот автоматично се отхвърлят. Известието се появява в горния десен ъгъл на работния плот. Стандартната стойност на таймаут е 8 секунди. Валидният диапазон за стойности на таймаут е 1-10 секунди. За да влязат промените в таймаут, браузърът трябва да бъде обновен след направените промени.

Пример:

"timerNotificationTimer": 8

maximumNotificationCount

За да зададете броя на известията на работния плот, които да се показват наведнъж на работния плот. По подразбиране стойността е 3. Диапазонът за известия на десктоп е от 1 до 10. Известията на работния плот са натрупани. Ако има много известия, те се появяват с леко забавяне в зависимост от настройките на Timemer на известието.

Пример:

"максимален брой известия": 3

browserNotificationTimer

За да се зададе продължителността (в секунди), след което уведомленията за браузъра на десктопа автоматично се отхвърлят. Toaster е родно известие за браузър, което се появява само ако Desktop не е активният прозорец на браузъра или Tab. Прозорецът на браузъра на работния стол или Tab е неактивен, когато

Работите върху други прозорци или раздели на браузъра.
Работите в друго приложение.
Минимизирали сте прозореца на браузъра на работния плот.

Известието се появява в горния десен ъгъл на работния плот. Стандартната стойност на таймаут е 8 секунди. Препоръчителният диапазон за стойности на таймаут е 5-15 секунди. За да влязат промените в таймаут, браузърът трябва да бъде обновен след направените промени.

Пример:

"browserNotificationTimer": 8

Конфигурираният тайм-аут за известия в браузъра зависи от операционната система и настройките на браузъра. Стойността на изчакването се показва в браузъра Chrome в целия Windows OS, Chrome OS и macOS. Неподдъраните браузъри обаче не почитат конфигурираната стойност за изчакване на известията последователно .

wxmКонфигурирано

(По желание) За да конфигурирате Webex Experience Management, задайте стойността на true. По подразбиране стойността е false.

Пример:

"wxmConfigured": вярно

desktopChatApp

За конфигуриране на множество чат приложения, предлагани от Cisco, като Webex App.

webexКонфигуриран

Webex Приложението, заедно с функциите за съобщения и срещи, могат да бъдат конфигурирани на работния плот. Тази конфигурация позволява на агентите да си сътрудничат с други агенти, супервайзори и експерти по предмета (SMEs) в тяхната организация, без да навигират извън работния плот.

Администраторът на сайта управлява Webex Срещи на потребителите и присвоява права само ако потребителите имат Webex Enterprise Edition. За повече информация вижте Управление на Webex Meetings Потребители в Cisco Webex Control Hub.
Ръководителите и експертите трябва да изтеглят клиента Webex на своята система (лично устройство) или да достъпят приложението Webex чрез Webex App for Web ( https://web.webex.com/). За повече информация вижте Изтеглете приложението.
Можете да достъпите приложението Webex в рамките на Agent Desktop, за да си сътрудничите с други агенти, ръководители и експерти по предмета (SMEs) на вашата организация, без да се отклонявате от Agent Desktop. Функцията за контрол на обажданията не е налична. За да получавате и извършвате обаждания, ви е необходимо външното, невградено приложение Webex. За повече информация вижте Приложение за повикванеs.

За да конфигурирате приложението Webex в работния плот:

В Cisco Webex Control Hub, при добавяне на услуги за потребител, изберете отметката за разширени съобщения (Потребители > Управление на потребители > Услуги > Съобщения). За повече информация вижте Управление на потребителски акаунти в Cisco Webex Администриране на сайта.
В персонализираното оформление на работния плот, задайте стойността на свойството webexConfigured на true.

Пример:
```
"desktopChatApp": { "webexConfigured": true },
```
По подразбиране стойността на свойството webexConfigured е false.

Webex App е достъпно за ролите агент, супервайзор и supervisorAgent само ако зададете стойността на свойството на webexConfigured на true за всяка от тези роли. Агентът, ръководителят или супервизорътАгентът не може да излезе от Webex App.

За да се покаже (Webex) икона в хоризонталния хедър на работния плот, въведете стойност Webex в свойството headerActions . За повече информация вижте headerActions.

За да активирате приложението Webex за конкретен екип, изберете персонализираното оформление с стойността на свойството webexConfigured на true. За повече информация вижте Създаване на екип.

Можете да конфигурирате Webex App в панела за допълнителна информация, персонализирана страница и персонализиран уиджет. За повече информация вижте Помощен информационен панел.

Webex Известие за приложението

Стойностите, които са зададени чрез свойствата на NotificationTimer и browserNotificationTimer за таймера на известията, са приложими за приложението Webex. Стандартната стойност на таймаут е 8 секунди за тези свойства. За повече информация вижте notificationTimer и browserNotificationTimer.

headerActions

За промяна на реда на иконите в хоризонталния хедър на работния плот. Подразбиращият ред е следният:

(Webex)
(Изходящ обаждане)
(Център за известия)

Задайте стойността на свойството headerActions по следния начин:

Име на иконата	headerActions Стойност на свойството
Webex приложениеп	Webex
Изходящи повиквания	Outdial
Център за Известия	известие

Пример:

"headerActions": ["Webex", "outdial", "notification"],

Стойността на свойството headerActions е чувствителна към малкия регистр.

За да промените реда по подразбиране на иконите, въведете свойството headerActions и стойностите в персонализираното оформление съответно.

Пример:

"headerActions": ["известие", "излизане", "Webex"],

Ако не въведете свойството headerActions и стойностите в персонализираното оформление, иконите се показват по подразбиране.
За да премахнете иконите на заглавия и свързаните с тях функционалности от работния плот, задайте празна стойност за свойството headerActions ("headerActions": []). Въпреки това, ако сте добавили Webex приложение към панела за допълнителна информация или в персонализирана страница, или като персонализиран уиджет, агентът все още може да достъпи приложението Webex, въпреки че приложението Webex не е налично в хоризонталния хедър на работния плот.
Ако стойността на свойството webexConfigured е зададена като false, иконата на приложението Webex не се показва на хоризонталния хедър на работния плот, дори ако стойността Webex се добави в свойството headerActions . За повече информация вижте webexConfigured.

Площ

Свойството на зоната е основната част на оформлението на работния плот. Можеш да определиш разположението според зоната.

"area": { "header": { ... }, "advancedHeader: { { "comp": "widget-1", "атрибути": { ... }, "script": .... } }, "панел": { ... }, "navigation": { ... }, "постоянен": { ... }, "Безглава": { ... } },

Можете да конфигурирате следните обекти на областта :

Панел: Представлява втория панел или най-десния панел в панела за допълнителна информация.
Навигация: Представлява персонализирани страници и техните навигационни елементи, свързани със страниците.
Persistent: Представлява уиджетите на ниво страница, които са постоянни и се показват на всички страници на работния плот.
Headless: Представлява уиджетите, които нямат визуален интерфейс, но изпълняват логика във фонов режим.

Ако е конфигурирано свойства advancedHeader, свойствата на header и headerActions трябва да бъдат премахнати.

advancedHeader

За персонализиране на видимостта и промяна на реда на иконите в хоризонталния хедър на работния плот. Подразбиращият ред е следният:

(Webex)
(Изходящ обаждане)
(Център за известия)
(Селектор на състоянието на агента)

Задайте стойността на свойствата advancedHeader по следния начин:

Име на иконата	headerActions Стойност на свойството
Webex приложениеп	agentx-webex
Изходящи повиквания	agentx-outdial
Център за Известия	agentx-известие
Агент Стейт Селектор	agentx-state-selector

Пример:

"advancedHeader": [ { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } { "comp": "widget-1", "attributes": { ... }, "script": .... } ]

Стойността на свойството advancedHeader е чувствителна към малки букви.

За да промените реда по подразбиране на иконите, въведете свойството advancedHeader и стойностите в персонализираното оформление съответно.

Джаджите се вливат в падащото меню отляво надясно.

Ако не въведете имота advancedHeader в персонализираното оформление, по подразбиране се показва заглавието.
Когато разширеният хедър е активиран, трябва да преместиш уиджетите от действащия в разширения хедър, както е в примера.
Когато разширеният хедър е активиран, старият хедър няма да се показва.
Всяка икона на джаджа има подразбиране и полето, дефинирано чрез CSS и не може да бъде персонализирано през десктоп.
Местоположението на логото, заглавието и иконите на профила е фиксирано и не може да бъде персонализирано.
За да премахнете иконите на заглавия и свързаните с тях функционалности от работния плот, задайте празна стойност за съответния компонент в свойството advancedHeader ("advancedHeader": []).

Ако сте добавили Webex приложение към панела за допълнителна информация или в персонализирана страница, или като персонализиран уиджет, агентът все още може да достъпва Webex App, въпреки че Webex App не е налично в хоризонталния хедър на работния плот.
Ако добавите джаджа с дълъг етикет, се показва съкратено име на етикета според наличното пространство.

Можете да използвате атрибута textContent , за да добавите етикет към джаджа.

Пример:
```
{ "comp": "timer-widget", "attributes": { "duration": "08:00:00" }, "textContent": "Отброяване на таймера за текуща промяна", "script": "https://wxcc-demo.s3.amazonaws.com/widgets/timer-widget.js" }
```
Етикетът "Таймер за обратно броене за текуща смяна" ще бъде съкратен и показан според наличното пространство.
- Избягвайте добавянето на джаджи с дълъг етикет.
- Когато джаджа преминава към падащото меню, само иконата на джаджата е кликваема.
Ако стойността на свойството webexConfigured е зададена като false, иконата на приложението Webex не се показва на хоризонталния хедър на работния плот, дори ако стойността Webex е добавена в свойството advancedHeader . За повече информация вижте webexConfigured.

Home Страница

Когато влезете в Desktop, попадате на страницата Home.

Страницата Home е приложима само за супервайзори и персона SupervisorAgent.

Можете да видите следните джаджи на страницата Home. По подразбиране са предоставени анализаторни джаджи, но администраторът може също да конфигурира Persistent и Custom widgets. За повече информация вижте JSON Layout Top-Level Properties.

Analyzer Widgets

По подразбиране, widget Analyzer се показва на страницата на работния плот Home.

Home Конфигурация на оформлението на страницата

Можете да конфигурирате страницата Home на работния плот да показва оформление, базирано на предпочитанията на вашата организация и съответствие с бранда. Редактирайте полето Начална страница, за да конфигурирате страницата Home. Можете да конфигурирате следните компоненти да се показват на страницата Home, когато потребител влезе в работния плот:

Приветствено послание
Иконата Задача в навигационната лента за навигация към панела за задачи. Иконата Задача се показва за ролите Супервайзор и Супервайзор и Агент с активирана функция за мониторинг на обаждания. Панелът на задачите показва входящи заявки на клиенти, активни и минали взаимодействия с клиенти, както и заявки за активен мониторинг.
Филтрирайте секции като име на опашка, тип канал и управлявани екипи.

Следната таблица описва свойствата на страницата , необходими за конфигуриране на страницата Home:

Таблица 2. Динамично Home оформление на страницата — свойства на страницата
Имоти	Описание и код
страница > useFlexLayout	Flex layout е нов уеб компонент. Това не променя съществуващите джаджи. Новото гъвкаво оформление използва същия формат на конфигурация на разположението по опростен начин. Това е обратно съвместимо и не влияе на съществуващите уиджети. Трябва да конфигурирате JSON оформлението. За да конфигурирате JSON оформлението, посочете височината и ширината на джаджата. Widget-ът се рендерира в същата последователност, както е конфигуриран в JSON оформлението. Джаджите имат стандартен марж от 8 пиксела. JSON разположението се базира на размерите (ширина x височина) и координатите (X, Y и Z) на уиджетите. Гъвкавото оформление поддържа възможности като промяна на размера на отделния уиджет, максимизиране на уиджетите и други. Височината на отделните джаджи се измерва в пиксели. 1 единица височина = 40 пиксела. Ширината на джаджата зависи от броя на колоните в контейнера и броя на колоните, които се променят според ширината на контейнера. Widgets се показват отляво надясно. Разширеният механизъм за оформление използва персонализирана логика за прилагане както на хоризонтално, така и на вертикално регулиране на пространството на джаджите. Първоначално разположението се зарежда хоризонтално. След хоризонтално зареждане, джаджата се зарежда вертикално и гарантира, че използването на пространството е оптимално. Конфигурирайте уиджетите според размера на екрана. Можете да увеличите или намалите ширината на уиджетите, в зависимост от размера на екрана. Това прави джаджетите по-четими и използваеми. Flex layout осигурява стандартни точки на прекъсване като голяма, средна, малка и екстра малка. Големите джаджи имат резолюция от 1360 пиксела или повече. За големи джаджи задайте стойността на колоната като 12. Средните джаджи имат резолюция от 1070 px до 1360 px. За средни джаджи задайте стойността на колоната като 10. Малките джаджи имат резолюция от 850 px до 1070 px. За малки джаджи задайте стойността на колоната като 6. Екстра малките джаджи имат резолюция 500 пиксела. За допълнителни малки уиджети задайте стойността на колоната като 4. Тези пиксели могат да варират в зависимост от операционната система и браузъра. `"page": { "ID": "landing", "useFlexLayout": true, "widgets": { "comp1": { "comp": "div", "width": 4, "height": 4, "textContent": "widget 1", "attributes": { "style": "width: max-content; маргина: 80px 240px; цвят: бял;" } }, "comp2": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 2", "attributes": { "style": "width: max-content; маргина: 80px 240px; цвят: бял;" } } }`
Страница > комп	Уверете се, че предоставяте уникален персонализиран компонент. `"comp": "заглавие на страница",` Компонентът на заглавието на страницата `представлява заглавие ниво 2` <h2> `на персонализирания HTML елемент.`
страница > страницаЗаглавие	Уверете се, че сте посочили титулен низ, който може да бъде статичен, динамичен или и двете. Компонентът на заглавието на страницата `представлява заглавие от ниво 2` <h2> `в персонализирания HTML елемент.` Статична струна: Например, Hey, Welcome! `"comp": "page-title", "attributes": { "pageTitle": "Здрасти, добре дошли!" }` Динамичен низ: За извличане на стойността от `STORE`. Например, Джейн Доу. `"comp": "page-title", "attributes": { "pageTitle": "$STORE.agent.agentName" }` И двете: Комбинацията от статични и динамични струни. Например, Hey Jane Doe, Welcome! `"comp": "page-title", "attributes": { "pageTitle": "Здравей {$STORE.agent.agentName}, добре дошъл!" }` Трябва да обградите динамичната част на струната в затворените къдрави скоби {} и да префиксирате структурата $.
страница > страницаПодзаглавие	Уверете се, че сте добавили Sub Header, който се показва на работния плот. Потребителят може да добави Go to Analyzer в подзаглавието. Кодов блок за Sub Header `"useFlexLayout": true, "pageSubHeader": { "comp": "div", "атрибути": { "style": "display: flex; float:Right; margin:16px 0px 16px 16px" }, "children": [ { "comp": "div", "children": [ { "comp": "md-label", "textContent": "$I 18N.pageSubHeader.queueName", "attributes": { "style": "margin-bottom:8px;" }` Кодов блок за Go to Analyzer в подзаглавието `{ "comp": "div", "children": [ { "comp": "agentx-more-actions-wrapper", "properties": { "actionList": [ { "comp": "agentx-wc-goto-analyzer" } ] } }`

Навигация (персонализирани страници)

В тази секция можете да добавите страници, които се появяват в лявата навигационна лента. Посочвате икона за навигация и уникален URL адрес, за да се появи уиджето в навигационната лента. Препоръчваме да използвате специфичен префикс за URL адреса, за да избегнете конфликти. За повече подробности вижте секцията за свойства на навигацията.

Можете също така да имате колекция от джаджи, които да се показват на тази страница. Страницата може да има една единствена джаджа, която се появява на екрана, или колекция от джаджи в мрежа. За повече подробности относно подреждането на мрежата, вижте секцията за свойства на оформлението.

Не е нужно да добавяте обвивка за динамична област към дървото на джаджатите. Това означава, че можете да плъзгате, пускате и променяте размера на уиджети на персонализирани страници, когато активирате тази опция.

Пример:

{ "nav": { "label": "Custom Page", "icon": "stored-info", "iconType": "momentumDesign", "navigateTo": "dynamic-tabs", "align": "top", "isDefaultLandingPage": true }, "page": { "ID": "my - custom - page", "useFlexLayout": true, "widgets": { " comp1": { "comp": "md-tabs", "children": [{ "comp": "md-tab", "textContent": "Shift Timer", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "attributes": { "slot": "panel" }, "children": [{ "comp": "my - custom - timer", "source": http: //my-cdn.com/my-custom-timer.js "wrapper": { "title": "Shift Timer", "maximizeAreaName": "app-maximize-area" } }] }, { "comp": "md-tab", "textContent": "Фондов пазар", "responsive": "false" "атрибути": { "slot": "Tab" }, }, { "comp": "md-tab-panel", "attributes": { "slot": "panel" }, "children": [{ "comp": "agentx-wc-iframe", "responsive": "false" "attributes": { "src": "https://widget-kad.s3.amazonaws.com/Trading.htm" }, "wrapper": { "title": "Stock Market", "maximizeAreaName": "app-maximize-area" } }], }, { "comp": "md-tab", "textContent": "Widget3", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Три съдържание", "атрибути": { "slot": "panel" } } ] }, "comp2": { "comp": "my - Google - Maps - Component", "source": "https://my-cdn.com/my-google.maps.js "wrapper": { "title": "Google Map", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["left", "right"] ], "size": { "cols": [1, 1], "rows": [1] } } },

Следната таблица описва свойствата на навигацията и страницата заедно с техните дъщерни свойства:

Таблица 3. Подробности за имота на навигацията
Имоти	Описание и код
nav > label	Това свойство показва идентификатора за навигация на страницата. Екранният четец чете това свойство и то се появява в подсказката. Тези параметри са необходими, за да се покаже вашата персонализирана страница на навигационната лента. `type Navigation.Item = { label: string; iconType: "momentumDesign" \| "други"; икона: струна; align: "top" \| "bottom"; навигация към: струна; iconSize? : номер; isResponsive? : булев; };` Свойството `етикет` е заглавието на персонализираната страница.
nav > iconType	Това свойство представлява типа икона, която се показва в навигационната лента за персонализираната страница. Следните видове икони са налични: momentumDesign: Можете да изберете всички налични икони в колекцията: https://momentum-design.github.io/momentum-design/en/tokens/icons/. Предимството на използването на Momentum е, че предоставя няколко икони с "активна" версия. Случай на употреба на активна версия: Например, ако изберете тип икона Momentum Съобщение, можеш да видиш иконата по подразбиране в навигационната лента. Когато навлезеш на персонализираната страница (свързана с иконата), иконата се променя на Анонс-Активно версията автоматично. Уверете се, че проверявате дали има Активен версия на същата икона в библиотеката с икони. Друго: Можете да предоставите персонализиран URL адрес на изображението (хостван на CDN), който се появява на навигационната лента. Ако използвате черно-бяла персонализирана икона, иконата не се вижда, когато превключвате между светъл и тъмен режим.
навигация > икона	Това свойство представлява името на иконата в библиотеката Momentum или на CDN URL адреса. `тип Navigation.Item ={ icon:"announcement"; }; ИЛИ // тип Navigation.Item ={ icon:"https://my-cdn.com /my-navigation-icon.png"; };`
nav > align	Това свойство ви помага да подравните иконата в горната или долната част на навигационната лента. В момента имотът позволява само горно трасе.
nav > isDefaultLandingPage	Това свойство определя стандартната целева страница за агентите в Agent Desktop. Задайте това свойство на true , за да направите навигационната лента по подразбиране целева страница, която се появява за агентите след влизане в Agent Desktop. Ако повече от една страница в навигационната лента има това свойство на true, системата счита първата страница на навигационната лента за стандартна целева страница. Ако нито една навигационна лента няма това свойство на true, страницата Home действа като стандартна целева страница. Не можете да зададете докладите за статистика на анализатора и агентите като стандартна целева страница.
nav > navigateTo	Това свойство определя името на персонализираната страница. Това име се появява в адресната лента, когато агентът навигира. NavigateTo не трябва да включва следните стойности: изображения, шрифтове, css, build_info, помощ, приложение, i18n, икони, изображения-mfe-wc и звуци. `type Navigation.Item = { navigateTo: "my - custom - страница"; };`

Таблица 4. страница Детайли за имота
Имоти	Описание и код
страница > ID	В страница Свойство, посочвате обекта за персонализирана страница (динамичен джаджат). the id Свойството представлява уникален идентификатор на страница. Например, my-custom-page-1. Агентът не може да види този идентификатор на работния плот. `type DynamicWidgets.Page = { ID: string; widgets: Запишете < низ, DynamicWidget.Options > ; layout: Layout; };`
page > useFlexLayout	Flex layout е нов уеб компонент. Това не променя съществуващите джаджи. Новото гъвкаво оформление използва същия формат на конфигурация на разположението по опростен начин. Това е обратно съвместимо и не влияе на съществуващите уиджети. Трябва да конфигурирате JSON оформлението. За да конфигурирате JSON оформлението, посочете височината и ширината на джаджата. Widget-ът се рендерира в същата последователност, както е конфигуриран в JSON оформлението. Джаджите имат стандартен марж от 8 пиксела. JSON разположението се базира на размерите (ширина x височина) и координатите (X, Y и Z) на уиджетите. Гъвкавото оформление поддържа възможности като промяна на размера на отделния уиджет, максимизиране на уиджетите и други. Височината на отделните джаджи се измерва в пиксели. 1 единица височина = 40 пиксела. Ширината на джаджата зависи от броя на колоните в контейнера и броя на колоните, които се променят според ширината на контейнера. Widgets се показват отляво надясно. Разширеният механизъм за оформление използва персонализирана логика за прилагане както на хоризонтално, така и на вертикално регулиране на пространството на джаджите. Първоначално разположението се зарежда хоризонтално. След хоризонтално зареждане, джаджата се зарежда вертикално и гарантира, че използването на пространството е оптимално. Конфигурирайте уиджетите според размера на екрана. Можете да увеличите или намалите ширината на уиджетите, в зависимост от размера на екрана. Това прави джаджетите по-четими и използваеми. Flex layout осигурява стандартни точки на прекъсване като голяма, средна, малка и екстра малка. Големите джаджи имат резолюция от 1360 пиксела или повече. За големи джаджи задайте стойността на колоната като 12. Средните джаджи имат резолюция от 1070 px до 1360 px. За средни джаджи задайте стойността на колоната като 10. Малките джаджи имат резолюция от 850 px до 1070 px. За малки джаджи задайте стойността на колоната като 6. Екстра малките джаджи имат резолюция 500 пиксела. За допълнителни малки уиджети задайте стойността на колоната като 4. Тези пиксели могат да варират в зависимост от операционната система и браузъра. `"page": { "ID": "landing", "useFlexLayout": true, "widgets": { "comp1": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 1", "attributes": { "style": "width: max-content; маргина: 80px 240px; цвят: бял;" } }, "comp2": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 2", "attributes": { "style": "width: max-content; маргина: 80px 240px; цвят: бял;" } } }`
страници > widgets page > comp	Помага ти да дефинираш персонализираните си джаджи. За да поставите няколко джаджа, задайте опциите за джаджа последователно. Уверете се, че давате на всяка джаджа уникално име на област. Използвайте го по-късно в секцията за оформление. `"widgets": { "comp1": { ... } "comp2": { ... } }` Това свойство представлява името на персонализирания HTML елемент (известен като уеб компонент или друг елемент – ако искате да го използвате като обвивка). За повече информация вижте Примери за случаи на употреба. Въведете името на вашия персонализиран елемент тук без ъглови скоби ("<" или ">"). Например, "моят-персонализиран-елемент". Всеки запис в секцията с джаджи поддържа следния формат: `type Options = { comp: string; script? : струна; Имоти? : Запишете < струна, всяка > ; Характеристики? : Записвайте < струна, струна > ; деца? : Опции[]; textContent? : струна; стил? : Частична < CSSStyleDeclaration > ; Опаковка? : { title: string; maximizeAreaName: string; }; };`
страница> скрипт	(По желание) Това свойство е необходимо само когато заредите джаджа или компонент от отдалечено място като CDN. `"comp1": { "comp": "widget-one", "script": "http:/my-cdn.com / dynamic - widgets / widget - one.js ", }` Не променяй URL адреса на скрипта за същия компонент. Ако трябва да смените URL адреса на скрипта за същия компонент, направете едно от следните: Уведомете агента да изчисти кеша на браузъра и да зареди Agent Desktop. Запази съществуващия URL. Динамично импортирайте новия URL на пакета, използвайки javascript, хостван в съществуващия URL. Пример: `(function() { var script = document.createElement("script"); script.src = <URL на вашия JS скрипт> script.type = "text/javascript"; script.async = true; document.getElementsByTagName ("head").item(0).appendchild(script); } ) ()`
страница > свойства	Можете да зададете свойства, които трябва да преминете за уеб компонента. `"properties": { "user": "admin", },`
страница> отзивчиво	Определя дали уеб компонент или уиджет, базиран на iFrame, добавен в персонализираното оформление на `ниво страница` или на `ниво комп` , е отзивчив. Адаптивните уеб компоненти правят вашата уеб страница визуално привлекателна на всички устройства и лесна за използване. Трябва да използвате адаптивни iFrame джаджи. Конфигурирайте това свойство с една от следните стойности: Вярно: Активира отзивчивостта на джаджата. По подразбиране всички джаджи са отзивчиви според прогресивните размери на екрана, ориентацията и зоните за гледане на използваното устройство. False: Деактивира отзивчивостта на джаджата. Ако джаджетите не поддържат преглед на различни устройства, маркирайте ги като неотзивчиви. `{ "comp": "md-tab", "responsive": true, "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "responsive": false, "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "атрибути": { "name": "CALL_GUIDE" } }], "visibility": "CALL_GUIDE" },` Неотзивчивите уиджети не могат да гарантират най-доброто потребителско изживяване и не се показват в по-малкия изглед. Агентът трябва да увеличи размера на прозореца на браузъра, за да вижда всички уиджети, конфигурирани като неотзивчиви.
страници > атрибути	Можете да посочите атрибутите на уеб компонентите в този раздел. `"атрибути": { "disabled": "false", },`
Страница > видимост	Уточнява дали уиджетите, предложени от Cisco, добавени в персонализираното оформление на `ниво страница` или на `ниво комп,` са видими или не. Джаджите, предлагани от Cisco, са История на контактите, Cisco Webex Experience Management, IVR Транскрипция, Ръководство за предварителен преглед на кампанията и Screen Pop. Стойностите на свойствата за видимост са вградени и дефинирани в стандартния JSON файл на Desktop Layout. Администраторът не може да променя стойностите на свойствата за видимост на джаджите, предложени от Cisco. Стойността на имота за видимост NOT_RESPONSIVE е остаряла. Можеш да продължиш да го използваш само за обратна съвместимост. Всяка стойност, зададена като NOT_RESPONSIVE преди, не изисква промяна, тъй като функционалността остава същата. За да зададете новосъздадена джаджа като отзивчива или не, трябва да използвате свойството responsive . За повече информация, вижте Responsive Property.
page > деца	Този имот е основната част от разпределението. В Деца можете да вложите толкова нива, колкото е необходимо, ако уеб компонентната джаджа ви позволява да предавате деца. За да стане това възможно, разработчикът трябва програмно да управлява с прорези доволен. За повече информация вижте Cisco Webex Contact Center Ръководство за десктоп разработчици. За да научите за предаване на стойности на STORE като свойства, вижте Споделяне на данни от работния стол към уиджети. `"children": [{ "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "children": [{ "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" } ]` Предимството на секцията "деца" масиви е, че можете да използвате съществуващи уеб компоненти в спецификацията на оформлението, която вече е част от Desktop пакета. Някои от уеб компонентите на настолния пакет включват: agentx-wc-iframe: Уиджет, който ви позволява да поставите всяка уеб страница в iFrame като джаджа. динамична област: Компонент, който ви позволява да активирате функцията за плъзгане и пускане за агенти на място, различно от персонализирани страници. Персонализираните страници също могат да имат тази възможност, ако по подразбиране активирате drag-and-drop. Всеки компонент в библиотеката momentum-ui-web-component. За повече информация вижте GitHub. Например: md-tabs: Обвивка на контейнер за табове md-tab: Единично Tab заглавие md-tab-panel: Единично Tab съдържание За повече информация относно атрибутите на персистентния Tab, вижте Атрибути за постоянни табове.
страница > текстСъдържание	Помага ти да добавяш текстово съдържание. `"textContent": "Моето текстово съдържание",`
page > style	Помага ти да зададеш определен CSS стил на компонента си. `"style": { "backgroundColor": "#CBD", "overflow": "scroll" },`
страница > обвивка	Widget wrapper ти позволява да добавиш лента с инструменти върху джаджата. Лентата с инструменти може да съдържа заглавие и (Максимизиране) икона отгоре на джаджата. Когато джаджата заеме малко място на страницата, иконата за максимизиране позволява на агента да види джаджата в пълното работно пространство. Уверете се, че използвате стандартната стойност като "app-maximize-area". В момента е налична само стойността по подразбиране. Ако оформлението е конфигурирано с `useFlexlayout`, можете да активирате иконата за максимизиране/възстановяване в заглавието на джаджата, като добавите `атрибута isMaximizable` към конфигурацията на джаджата и зададете стойността му на `true`. `"wrapper": { "title": Заглавието на моя джаджа ", "maximizeAreaName": "app-maximize-area" "isMaximizable":true }`
страница > обвивка> ID	(По желание) Обвивката на уеб компонентния widget позволява да актуализирате заглавието на динамичния widget чрез уникален идентификатор. Въведете стойността на свойството на widget wrapper `ID` като unique-id-to-update-title. `"wrapper": { "title": My Widget Title ", "ID": "unique-id-to-update-title", "maximizeAreaName": "app-maximize-area" }` Уверете се, че използвате същия уникален идентификатор за JavaScript CustomEvent. За повече информация вижте секцията Асинхронни събития в главата Модул за контакт с агенти на настолния разработчик Cisco Webex Contact Center. За да обновите заглавието на джаджата, базирано на iFrame, използвайте съдържанието на iFrame от същия домейн. Следва примерен пример: < тип скрипт = "text/javascript" > var title = """; window.addEventListener("update-title-event", function(e) { title = e.detail.title; }); document.querySelector('#customEvent').onclick = function() { const e = new CustomEvent("update-title-event", { bubbles: true, detail: { title: "new title" } }); window.parent.dispatchEvent(e); }; < /script> < button ID = "customEvent" > Ново заглавие < /button> < iframe src = "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" > < /iframe>
Page > agentx-wc-iframe	Позволява ви да вградите уеб страница в iFrame, която се появява като джаджа на работния плот. Можеш да използваш iFrame джаджата, наречена "agentx-wc-iframe". `"comp1": { "comp": "agentx-wc-iframe", "атрибути": { "src": "https://blog.logrocket.com / the - ultimate - guide - към - iframes / " }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } },`
Страница > оформление	Позволява ви да подредите джаджетите на страница. Следният формат представя разположение на мрежата: `тип Layout = { areas: string[][]; size: { rows: number[]; cols: number[]; }; };` Тук можете да дефинирате мрежата с имената на областите, които сте дефинирали в секцията с джаджи. Следният пример показва как се задава разположението на три реда и три колони: `"layout": { "areas": [ [ "comp1", "comp1", "comp3" ], [ "comp2", "comp2", "comp3" ], [ "comp4", "comp4", "comp4" ] ], "size": { "cols": [1, 1, 1], "редове": [1, 1, 1] } }` *Равномерно разпределение на 3x3 разположение* В секцията за размер числата представляват частта от пространството, която джаджата може да заема спрямо другите джаджи. И трите колони заемат равна 1 фракция от пространството. С 100% налична ширина, всяка джаджа заема 33.33% от хоризонталното пространство. *С равна ширина на колоната* Друг пример за употреба е, ако зададеш като "cols": [1, 2, 2], това означава, че общото пространство се дели на 5 (1+2+2) и първият джаджат заема 20% от хоризонталното пространство. Втората и третата джаджа взимат по 40% всяка. За повече информация вижте Основни концепции за разположение на мрежата. *След промяна на ширината на колоната*
страница > КОРЕН	Вложенето на разположения се нарича подразположение. Ако имате вложени оформления в конфигурацията на оформлението, трябва да имате един "ROOT" обект като родител за подразположенията. В противен случай конфигурацията на разположението може да бъде плоска, ако не е необходимо вложене. Това подразпределение осигурява повече контрол върху поведението при преоразмеряване на разположението. Свойството за оформление на страницата трябва да е от типа Запис<низ, Оформление>. Свойството за оформление ви позволява да подредите уиджетите на страница. { "ID": "some-id", "widgets": { "c1": { "comp": "div", "textContent": "c1" }, "c2": { "comp": "div", "textContent": "c2" }, "c3": { "comp": "div", "textContent": "c3" }, "c4": { "comp": "div", "textContent": "c4" }, "c5": { "comp": "div", "textContent": "c4" }, "c5": { "comp": "div", "textContent": "c", "c", "c4" }, "c5": { "comp": "div", "textContent": "c", "c4" }, "c5": { "comp": "div", "textContent": "c": "c", "c4" }, "c5": { "comp": "div", "textContent": "c", "c5": { "comp": "div", "textContent": "c": "c", "c4" }, "c5": { "comp": "div", "textContent": "c": "c", "c4" }, "c5": { "comp": "div", "textContent": "c": "c4" }, "c5": { "comp": "div", "textContent": "c4": "c4" }, "c5": { "comp": "div", "textContent": "c4": "c4" }, "c5"5" } }, "layout": { "ROOT": { "areas": [ ["c1", "sub1"], ["c2", "sub2"], "size": { "cols": [1, 1], "rows": [1, 1] } }, "sub1": { "areas": [ ["c3", "c4"] ], "size": { "cols": [1, 1], "редове": [1] } }, "sub2": { "areas": [ ["c1"], ["c5"] ], "size": { "cols": [1], "rows": [1, 1] } } Тази конфигурация създава мрежа в ROOT оформлението с две подмрежи, които можете да променяте размера независимо. *Външен вид на подразположението* Промяната на размера на компонент влияе върху компонентите в този подразположение. *След преоразмеряване и на двете подразположения* Бъдете наясно със следните случаи: Безкраен цикъл: Ако включите ROOT layout като подразположение на ROOT, това причинява грешка "стекът на извиквания" и преминава в безкраен цикъл. `{ "layout": { "ROOT": { "areas": [ ["c1", "c2"], ["c3", "ROOT"], "size": { "cols": [1, 1], "редове": [1, 1] } } }` *Подразположение с безкраен цикъл* Еднакви подразположение (N) времена: Ако включите подразположението в решетката си повече от веднъж със същото име и ако промените размера на едно от тях, всички подразположения се променят автоматично. Ако това не е желаното поведение, преименувайте всяко подоформление с уникално име. `{ "layout": { "ROOT": { "areas": [ ["c1", "sub1"], ["c2", "sub1"], "size": { "cols": [1, 1], "редове": [1, 1] } }, "sub1": { "areas": [ ["c3", "c4"], "size": { "cols": [1, 1], "редове": [1] } } }` *Подразположение с N времена*

Атрибути за Persistent Tabs

За да зададете табовете в персонализираните страници и персонализираните уиджети като постоянни, въведете атрибутите за md-tabs в персонализираното оформление.

Пример: Задайте табовете като постоянни

{ "comp": "md-tabs", "attributes": { "persist-selection": true, "tabs-id": "unique-id за всички табове заедно в контейнера" }, }

Имоти	Описание
persist-селекция	За да настроя `md-tabs` да са постоянни. Стандартната стойност е вярна.
tabs-id	Уникална идентификация за всички табове заедно в контейнера.

Когато настроите md-tabs да са постоянни (persist-selection: true), Agent Desktop запазва избора Tab, дори ако агентът превключва между страници или джаджи на работния плот.

Свойството persist-select не е приложимо за табовете в панела за допълнителна информация и страницата с отчети за статистика за представянето на агентите, тъй като поведението на persistent Tab вече е зададено на работния плот.
Изборът Tab се нулира до стандартния Tab, когато излезеш от Desktop, презаредиш/обновиш браузъра или изчистиш кеша на браузъра.

Конфигурация на постоянни джаджи

Можеш да конфигурираш всяка персонализирана джаджа да е постоянна. Persistent widgets се показват на всички страници на работния плот. Persistent widgets се показват като нов Tab в панела за допълнителна информация само когато имате активна заявка за контакт или разговор. Например, Примерна постоянна джаджа.

Постоянните джаджи не се показват на страницата Home по начина, по който се показват на другите страници. Въпреки това, ако имате активно взаимодействие, постоянните джаджи се показват на страницата Home като част от панела за допълнителна информация. Например, когато сте отговорили на обаждане, се показва панелът за контрол на взаимодействието, а widget-ът Sample Persistent се показва като част от панела за допълнителна информация.

Пример:

"area": { "persistent": [{ "comp": "md-tab", "атрибути": { "slot": "Tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "emoticons_16" }, { "comp": "span", "textContent": "Custom Page Widget" } ] }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel" }, "children": [{ "comp": "dynamic-area", "properties": { "area": { "ID": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } }, "comp2": { "comp": "uuip-widget-two", "script": "./dynamic-widgets/widget-two.js", "attributes": { "title": "WIDGET 2 content" }, "wrapper": { "title": "Widget 2 title", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "rows": [1] } } } ] }

Когато персонализирате джаджа, можете да изберете някоя от опциите:

Хоствайте приложение на уеб страница, която може да бъде вградена в iframe.
Създай персонализирана джаджа.

Техническите изисквания за джаджа са описани в Документацията за разработка на настолни джаджи. Като редактор на оформление, уверете се, че имате следните детайли:

Как се нарича персонализираният HTML елемент (известен като Web Component)?
Какъв е URL адресът към източника на мрежата за доставка на съдържание (CDN), който хоства JavaScript пакета?

Хедър уиджети

Заглавието се използва за показване на вътрешна информация, добавяне на падащи менюта и т.н. Тъй като контейнерът за заглавие има ограничено вертикално пространство, общата височина на хедъра е само 64 пиксела. За повече информация относно подравняването на оформлението, вижте секцията за свойства на оформлението.

Пример:

"header":{ "ID":"header", "widgets":{ "head1":{ "comp":"header-widget-one", "script":"https://my-cdn.com/dynamic-widgets/header-widget-one.js", }, "head2":{ "comp":"header-widget-two", "script":"https://my-cdn.com/dynamic-widgets/header-widget-two.js", } }, "layout":{ "areas":[ "head1", "head2" ]], "size": { "cols": [1, 1], "rows": [1] } } }

За да добавите подсказка за header widget, обвийте компонента с md-tooltip. Въведете информация от подсказката в свойството на съобщението .

Пример:

"header": { "ID": "dw-header", "widgets": { "head1": { "comp": "md-tooltip", "attributes": { "message": "netlify" }, "children": [{ "comp": "agentx-wc-iframe", "attributes": { "src": "https://keen-jackson-8d352f.netlify.app" } }] }, }, }

Трябва да добавите стиловите атрибути, дисплей и височина , за да конфигурирате уиджети през iFrame в областта за персонализация на джаджета в заглавието. Най-добрата стойност за напасване на атрибута височина е 64 пиксела.

Уверете се, че добавяте style атрибутите към съществуващите хедър уиджети, за да могат да се заредят както се очаква в iFrame.

Пример:

"head1": { "comp": "agentx-wc-iframe", "атрибути": { "src": "https://widget-kad.s3.amazonaws.com/Headers/Timer/Timer.htm", "style": "height:64px; display:flex;" } },

Препоръчваме да използвате само един ред с няколко колони за заглавието, защото височината на заглавката е само 64 пиксела. За повече информация относно подравняването вижте секцията за свойства на разположението.

Помощен информационен екран

Панелът за допълнителна информация на работния плот показва табовете, които включват предложените от Cisco (по подразбиране) уиджети и персонализирани джаджи. Следните джаджи, предлагани от Cisco, се появяват в предварително дефинираните табове:

История на контактите
IVR транскрипт
Пътешествие на клиентското изживяване
Изскачащ прозорец

Можете да използвате панела за допълнителна информация, за да:

Добави табове
Променете реда Tab
Премахнете предварително дефинирани табове
Маркирайте персонализираните табове като плъзгащи се
Добавете подсказки към персонализираните табове
Добавете опцията Reset Tab Order

Пример:

"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", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "атрибути": { "name": "CONTACT_HISTORY" } }] }, { "comp": "md-tab", "атрибути": { "слот": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "pop-out_16" } }, { "comp": "span", "textContent": "Screen Pop" } ], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "#SCREEN_POP" }], }, { "comp": "md-tab", "атрибути": { "slot": "Tab" }, "деца": [{ "comp": "md-icon", "атрибути": { "name": "emoticons_16" }, { "comp": "span", "textContent": "Custom Widget" } ] }, { "comp": "md-tab-panel", "attributes": { "slot": "panel" }, "children": [{ "comp": "dynamic-area", "properties": { "area": { "ID": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } }, "comp2": { "comp": "widget-one", "script": "https://my-cdn.com/dynamic-widgets/widget-one.js", "wrapper": { "title": "widget title", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1"], ["comp2"] ], "size": { "cols": [1], "редове": [1, 1] } } },

Можете да конфигурирате уиджета Customer Experience Journey, след като активирате метриките за управление на клиентското изживяване в Управленския портал.

В панела за допълнителна информация добавете нови табове, за да поставите вашите персонализирани джаджи. Тук не се прилагат специални правила и вложението на компонентите е както се очаква и е описано в секцията за деца . За повече информация вижте собствеността "Деца " на страницата.

По-долу са конкретните примери за персонализиране на вашите Tab заглавия:

Пример за поставяне на икони и етикети в детската собственост

{ "comp": "md-tab", "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "transcript_16" } }, { "comp": "span", "textContent": "My Widget Tab" } ], },

Пример за поставяне на изображение (с CSS) и етикети в свойството Child

{ "comp": "md-tab", "атрибути": { "slot": "Tab" }, "деца": [{ "comp": "обхват", "атрибути": { "style": "align-items: center; display: flex;" }, "children": [{ "comp": "img", "attributes": { "src": "http: //my-cdn.com/icon.svg", "width": 16, "height": 16, "style": "margin-right: 0.5rem;" } }, { "comp": "span", "textContent": "My Widget Tab" } ] }], },

Падащият списък Повече табове се появява автоматично, когато панелът за допълнителна информация съдържа няколко таба.

Трябва да добавите персонализиран подсказка Tab за четимост и достъпност. За да добавите подсказка за персонализиран Tab, обвийте компонента с md-tooltip. Въведете информацията от подсказката в свойството съобщение и приложете стойностите на свойствата на стила , както е показано в следния пример.

"comp": "md-tooltip", "attributes": { "class": "widget-tabs", "message": "Sample Tab 1", "style": "max-width: 252px; минимална ширина: 110px; препълване: скрито; Препълване на текста: Елипса; бяло пространство: nowrap; дисплей: инлайн блок; Margin-bottom: -10px;" },

За персонализиран Tab препоръчваме максимална ширина от 252 пиксела и минимална ширина от 110 пиксела.

За да активирате функцията за плъзгане и пускане в персонализирания Tab, добавете следното свойство в атрибутите:

"comp": "md-tabs", "attributes": { "class": "widget-tabs", "draggable": true, "comp-unique-id": "sample-dynamic-custom-tabs" },

Draggable: Задайте стойността на свойството на влачене на true.
comp-unique-id: Въведете уникална стойност, за да идентифицирате компонента.

Пример:
```
"comp-unique-id": "sample-dynamic-custom-tabs" 
```

Ако активирате drag-and-drop за персонализиран Tab, агентът може да плъзне и пусне Tab на нужната позиция в панела за допълнителна информация. За да нулирате табовете в стандартния ред Tab, добавете следното свойство:

"comp": "agentx-wc-more-actions-widget", "атрибути": { "slot": "settings", "class": "widget-pane", "tabs-unique-id": "sample-dynamic-custom-tabs" },

agentx-wc-more-actions-widget: Въведете компонента, който се показва като Повече действия () икона в панела за допълнителна информация.
slot="settings": Въведете атрибут в компонента, който се показва като опцията Reset Tab Order в падащото меню More Actions. Агентите могат да нулират табовете в панела за допълнителна информация в стандартния ред, като кликнат върху > Нулиране Tab Ред.
tabs-unique-id: Въведете същата уникална стойност, дефинирана за свойството comp-unique-id , за да се съпоставят и нулират компонентите на md-tabs .

Следващият примерен код използва функциите More Actions и Reset Tab Order .

"comp": "agentx-wc-more-actions-widget", "атрибути": { "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" } ] }], }

Webex Contact Center more actions menu example, showing the 'Reset Tab Order' option.

По подразбиране са дефинирани подсказката, иконата за елипса и нулиране на реда Tab за предварително дефинирани табове.

Падащото меню Още действия може да бъде разширено, за да добави допълнителни персонализирани компоненти или джаджи след опцията Reset Tab Order . Следва примерен набор от стойности на свойства на стила , които могат да се приложат към допълнителни компоненти.

"comp": "md-tooltip", "attributes": { "class": "widget-tabs", "message": "sample element", "style": "max-width: 252px; минимална ширина: 110px; препълване: скрито; Препълване на текста: Елипса; бяло пространство: nowrap; дисплей: инлайн блок; Margin-bottom: -10px;" },

Webex Contact Center more actions menu example, showing additional, custom options that can be added after the 'Reset Tab Order' option.

Функцията за плъзгане и пускане не се поддържа за допълнителните персонализирани компоненти или уиджети, които се добавят в падащото меню Още действия .

Безглави уиджети

В секцията без глава можете да добавите уиджети, които са скрити и не се появяват в Agent Desktop. Тези джаджи се използват за изпълнение на логиката във фонов режим. Този раздел е полезен за задействане на събития, които се случват на работния плот, и за изпълнение на логика, специфична за джаджата. Например, отваряне на персонализиран CRM Screen Pop за SMS при пристигането му.

Пример:

"headless":{ "ID":"headless", "widgets":{ "comp1":{ "comp":"headless-widget-one", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-one.js", }, "comp2":{ "comp":"headless-widget-two", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-two.js", } }, "layout":{ "areas":[ "comp1", comp2" ]], "size": { "cols": [1, 1], "редове": [1] } } }

Споделяне на данни от работния плот към уиджети

За да получавате данни в реално време чрез свойства или атрибути в персонализиран джаджат, задайте подходящи стойности на STORE в конфигурацията на оформлението JSON.

Освен това, за да получите достъп до данните чрез абонати на JavaScript SDK, можете също да ги предавате чрез свойства или атрибути. Ако вашият компонент е създаден да реагира на промени в свойства или атрибути, получавате актуализации в реално време от Agent Desktop, който се нарича доставчик на данни.

В момента имаме един доставчик на данни под ключов STORE. За повече информация вижте секцията Data Provider—Widget Properties and Attributes в ръководството за десктоп разработчикиCisco Webex Contact Center.

Предварителен повик за кампанията

Администраторът създава кампании, конфигурира режима на набиране (предварителен преглед) и разпределя кампаниите на отборите. Ако агент е част от екип, към който са назначени кампаниите, тогава агентът може да направи изходяща предварителна кампания. За повече информация вижте Конфигуриране на гласови изходящи кампании в Webex Contact Center.

Администраторът конфигурира следното в персонализираното оформление, за да активира контакт с предварителен преглед на кампанията за агент.

Контакт за кампанията
Ръководство за обаждания

Контакт за кампанията

Администраторът добавя джаджата Campaign Contact в заглавния контейнер на персонализираното оформление. Контактът на кампанията показва контактната информация на клиента, базирана на дефинираните свойства. За повече информация относно подравняването на оформлението, вижте реда на свойството на оформлението в таблицата Property Details .

Пример:

 "advancedHeader": [ { "comp": "agentx-preview-campaign", "properties": { "isCampaignManagementEnabled": "$STORE.agent.isCampaignManagementEnabled", "agentDbId": "$STORE.agent.acqueonAgentId", "lcmUrl": "$STORE.agent.lcmUrl", "isCallInProgress": "$STORE.agentContact.isActiveCall", "outdialEntryPointId": "$STORE.agent.outDialEp", "teamId": "$STORE.agent.getAcqueonTeamId", "campaignManagerAdditionalInfo": "$STORE.agent.campaignManagerAdditionalInfo", "orgId": "$STORE.agent.orgId", "dialerProxyHost": "$STORE.envVaribles.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featuresFlags.isProgressiveCampaignEnabled" } }, { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } ]

Ръководство за обаждания

Widget Call Guide се показва в панела Auxiliary Information на работния плот. Ръководството за обаждания показва въпросите и отговорите на ниво кампания. Агентът е подканен да прочете набор от въпроси в ръководството за обаждания и да подаде отговорите.

Пример:

"panel":{ "comp":"md-tabs", "атрибути":{ "class":"widget-tabs" }, "children":[ { "comp":"md-tab", "attributes":{ "slot":"Tab", "class":"widget-pane-tab" }, "children":[ { "comp":"md-icon", "attributes":{ "name":"icon-note_16" } }, { "comp":"span", "textContent":"Call Guide" } ], "visibility":"CALL_GUIDE" }, { "comp":"md-tab-panel", "attributes":{ "slot":"panel", "class":"widget-pane" }, "children":[ { "comp": "acqueon-call-guide", "script": "http://localhost:5555//index.js", // include CDN линк тук "wrapper":{ "title":"Call Guide", "maximizeAreaName":"app-maximize-area" }, "properties":{ "lcmKey":"$STORE.agentContact.getCallGuideProps.LCMKey", "agentDbId":"$STORE.agent.acqueonAgentId", "lcmUrl":"$STORE.agent.lcmUrl", "campaignManagerAdditionalInfo":"$STORE.agent.campaignManagerAdditionalInfo" "orgId": "$STORE.agent.orgId", "dialerProxyHost": "$STORE.envVaribles.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featureFlags.isProgressiveCampaignEnabled" } } ], "видимост":"CALL_GUIDE" } ] }

Следните препратки към съпоставимите свойства са променени. agentX в стойността на свойството се заменя с acqueon:
- AgentX-Preview-кампания е преименувана на Acqueon-Preview-Campaign
- agentx-call-guide е преименуван на acqueon-call-guide
Трябва да хоствате List and Campaign Manager (LCM) на CDN и след това да посочите URL адреса в свойството на скрипта .

Изскачащ прозорец

В Desktop Layout можете да конфигурирате Screen Pop по един от следните начини:

Като персонализирана страница
Като една от притурките на потребителската страница
Като Tab в панела за допълнителна информация

Екранът се показва на работния плот въз основа на следните фактори:

За Voice канала:

Конфигурацията, дефинирана в Desktop Layout
Дейността Screen Pop, дефинирана в Flow Designer

За новите дигитални канали:

Конфигурацията, дефинирана в Desktop Layout
Възелът Screen Pop, дефиниран в Connect Flow Builder

За повече информация относно конфигурирането на Screen Pop, вижте Screen Pop.

Изскачане на екрана за конфигуриране в навигационната лента

Можеш да конфигурираш Screen Pop като персонализирана страница или като един от уиджетите в персонализирана страница. За достъп до персонализираната страница Screen Pop, кликнете върху иконата Screen Pop в навигационната лента. За достъп до джаджата Screen Pop в персонализираната страница, кликнете върху персонализираната икона в навигационната лента. За повече информация относно свойствата на навигацията вижте Навигация (Custom Pages).

Пример: Изскачане на екрана като персонализирана страница

{ "nav": { "label": "Screen Pop", "icon": "pop-out", "iconType": "momentum", "navigateTo": "/screenpop", "align": "top" }, "page": { "ID": "agentx-wc-screen-pop", "widgets": { "comp1": { "comp": "agentx-wc-screen-pop", "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" } } }, "layout": { "areas": [ ["comp1"] ], "size": { "cols": [1], "rows": [1] } }, "visibility": "SCREEN_POP" }

Пример: Изскачане на екрана като уиджет в персонализираната страница

"comp1": { "comp": "agentx-wc-screen-pop", "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" }

Ако Screen Pop не е конфигуриран в Flow Designer, персонализираната страница изглежда празна. За повече информация относно конфигурирането на Screen Pop в Flow Designer, вижте Screen Pop.

Конфигуриране на екрана в спомагателния информационен панел

Можете да конфигурирате Screen Pop да се появява като Tab в панела за допълнителна информация.

По подразбиране, Screen Pop се появява като нов субредит Tab в Screen Pop Tab на панела за допълнителна информация, ако Screen Pop е конфигуриран да се показва като Inside Desktop в Flow Designer.

Добавете следния атрибут в секцията на панела , за да включите Screen Pop като Tab в панела за допълнителна информация. За повече информация относно детайли на панела , вижте Информационен панел за помощници.

Пример: Появяване на екрана като Tab в Спомагателния информационен панел

 { "comp":"md-tab", "атрибути":{ "slot":"Tab", "class":"widget-pane-tab" }, "деца":[ { "comp": "md-icon", "атрибути": { "name": "pop-out_16" }}, { "comp": "span", "textContent": "Screen Pop" }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "#SCREEN_POP" } ], }

Опцията Screen Pop дисплей, дефинирана в Flow Designer, има предимство пред конфигурацията, дефинирана в Desktop Layout.

Например, приемете, че сте конфигурирали следните настройки на Screen Pop:

Flow Designer — Настройките за показване както в новия браузър Tab
Оформление на работния плот — Като Tab в панела за допълнителна информация

Когато се случи събитието, за което е конфигурирано изскачането на екрана, то се показва извън работния плот – тоест в нов браузър Tab.

Примери за случаи на употреба

Следващите раздели предоставят няколко примера за вашата справка:

Конфигурирайте и достъпете уиджета за управление на клиентското изживяване метрики от навигационната лента
Използване на табове на персонализираната страница
По подразбиране спомагателен информационен панел с история на контактите и изскачане на екрана
Допълнителен информационен панел с уиджет за клиентско изживяване

Конфигурирайте и достъпете уиджета за управление на клиентското изживяване метрики от навигационната лента

Пример:

{ "nav": { "label": "Метрики за управление на клиентското изживяване", "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": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": ".agent.teamName", "ani": "", "isDarkMode": "isDarkMode": "is "$STORE.app.darkMode" }, "wrapper": { "title": "Customer Experience Journey", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1"] ], "size": { "cols": [1], "rows": [1] } } } },

За да получите spaceId и metricsId, вижте документацията Webex Experience Management .

Използване на табове на персонализираната страница

Пример:

{ "nav": { "label": "Динамични табове", "icon": "stored info", "iconType": "momentum", "navigateTo": "dynamic-tabs", "align": "top" }, "page": { "ID": "page-id-tabs", "widgets": { "comp1": { "comp": "md-tabs", "children": [ "comp": "md-tab", "textContent": "One", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel" }, "children": [{ "comp": "widget-two", "script": "http:/my-cdn.com/dynamic-widgets/widget-two.js" }] }, { "comp": "md-tab", "textContent": "Two", "атрибути": { "слот": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Две съдържания", "атрибути": { "слот": "панел" } } }, "comp2": { "comp": "widget-two", "script": " http:/my-cdn.com/dynamic-widgets/widget-two.js" } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "редове": [1] } }

По подразбиране Допълнителен информационен панел с история на контактите и изскачане на екрана

Пример:

"panel": { "comp": "md-tabs", "атрибути": { "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", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "атрибути": { "name": "CONTACT_HISTORY" } }, }, ] }, { "comp": "md-tab", "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, { "comp": "md-tab", "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "атрибути": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "атрибути": { "name": "SCREEN_POP" } }], "visibility": "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" } }], "visibility": "WXM_JOURNEY" }, { "comp": "md-tab-panel", "атрибути": { "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", "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, "children": { "comp": "md-tab", "атрибути": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY_TAB" } }] }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY" } }] }, { "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "атрибути": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "атрибути": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "атрибути": { "име": "SCREEN_POP" } }], "видимост": "SCREEN_POP" } "видимост": "SCREEN_POP" }, },

Локализиране

Потребителският интерфейс на работния плот поддържа локализация на 29 езика.

Поддържат се следните езици:

Български, каталан, китайски (Китай), китайски (Тайван), хърватски, чешки, датски, нидерландски, английски (Обединено кралство), английски (САЩ), фински, френски, немски, унгарски, италиански, японски, корейски, норвежки бокомал, полски, португалски (Бразилия), португалски (Португалия), румънски, руски, сръбски, словашки, словенски, испански, шведски и турски

Езикът на Desktop UI е базиран на настройките за езикови предпочитания във вашия браузър. Например, нека приемем, че сте избрали предпочитания език като френски в браузъра Firefox. Когато стартирате работния плот в браузъра на Firefox, потребителският интерфейс на работния плот се появява на френски (френски). Въпреки това, хоризонталният хедър, навигационната лента и другите компоненти, добавени в Desktop Layout, не са локализирани според езиковите предпочитания във вашия браузър.

Локализиране на десктоп компоненти

За локализация на десктоп компоненти,

Използвайте съществуващите ключове за локализация, зададени във файла app.json . Ако ключовете за локализация не са зададени, се използва стандартният английски език (US). Можете да подадете заявка за услуга до Cisco Поддръжка, за да добавите ключ за локализация към app.json файла.

Пример: Ключ за локализация
```
{ "common": { "buttonTitle": "Stop Timer" } }
```
Въведете следното свойство, чувствително към регистра, в JSON файла Desktop Layout, за да локализирате компонент:
```
"textContent": "$I 18N.<ключ>", 
```
къде <ключ> се отнася до съответния ключ за локализация във файла app.json .

Пример: Компонент за локализиране на хедъра

"header": { "ID": "header", "widgets": { "head1": { "comp": "md-button", "attributes": { "slot": "menu-trigger", "style": "height: 64px" }, "children": [{ "comp": "span", "textContent": "$I 18N.common.buttonTitle", } }, }, }

Пример: Локализирайте компонента Tab в спомагателния информационен панел

"panel": { "comp": "md-tab", "атрибути": { "slot": "Tab" }, "children": [{ "comp": "span", "textContent": "$I 18N.panelTwo.screenPopTitle" }] }

Cisco AI Assistant

Благодарим за обратната връзка.

Създай персонализирано оформление на работния плот

Общ преглед

Свойства на JSON Layout на най-високо ниво

Роли

appTitle

емблема

taskPageIllustration

stopNavigateOnAcceptTask

dragDropEnabled

Таймер за известие

maximumNotificationCount

browserNotificationTimer

wxmКонфигурирано

desktopChatApp

headerActions

Площ

advancedHeader

Home Страница

Analyzer Widgets

Home Конфигурация на оформлението на страницата

Навигация (персонализирани страници)

Атрибути за Persistent Tabs

Конфигурация на постоянни джаджи

Хедър уиджети

Помощен информационен екран

Безглави уиджети

Споделяне на данни от работния плот към уиджети

Предварителен повик за кампанията

Изскачащ прозорец

Изскачане на екрана за конфигуриране в навигационната лента

Конфигуриране на екрана в спомагателния информационен панел

Примери за случаи на употреба

Локализиране

Локализиране на десктоп компоненти

Малък бизнес

Предприятие

Устройства

Решения за

Ресурси

Фирма