- Начало
- /
- Статия
Създаване на персонализирано оформление на работния плот
Тази статия помага при създаването на персонализирано оформление чрез редактиране на JSON файл и предлага примерни случаи на употреба, които да ви помогнат да започнете с джаджи като приспособлението за показатели за управление на клиентското изживяване и приспособлението за пътуване на клиентското изживяване. За да работите ефективно с персонализирани оформления на работния плот, трябва да имате солидно разбиране за HTML структурата, модела на дървото на документа в браузър и JSON формата.
Общ преглед
Функцията за оформление на работния плот ви позволява да конфигурирате работния плот на Webex Contact Center според вашите бизнес изисквания. Можете да персонализирате елементи като лого, заглавие и джаджи. Можете да създадете оформление на работния плот и да го възложите на екип. Това оформление генерира изживяването на агента на работния плот за всички агенти, които влизат като част от този екип.
Има два вида оформления:
-
Глобално оформление: Това оформление е системно генерирано оформление, което се задава по подразбиране, когато създавате екип. За повече информация вижте Управление на екипи. Когато създавате екип, глобалното оформление автоматично се задава като оформление на работния плот за екипа. Не можете да изтриете това оформление.
-
Персонализирано оформление: Оформление, което осигурява персонализирано изживяване на работния плот. Можете да създадете персонализирано оформление за един или повече екипи.
Ако зададете ново оформление на работния плот, когато агентът е влязъл, агентът трябва да презареди страницата, за да види новото оформление.
Работният плот на Webex Contact Center поддържа три лица:
-
Агент
-
Надзорник
-
Супервайзор и агент
Файлът за оформление на JSON има отделни секции за всяка от персоните. Администраторът трябва да конфигурира настройките за всяка персона в съответния раздел на файла за оформление на JSON. За повече информация относно примерен файл за оформление на JSON вижте Свойства на оформление от първо ниво на JSON.
Когато Cisco добави нова функция към оформлението на работния плот, непромененото оформление се актуализира автоматично с новите функции. Актуализираното оформление на работния плот е автоматично достъпно за съществуващите екипи, които използват непромененото оформление на работния плот. Потребителите на работния плот, използващи непромененото оформление на работния плот, получават новите функции, базирани на оформлението, когато влязат или презаредят браузъра.
Ако използвате файла Layout.json за
работен плот по подразбиране без никакви промени, тогава той се счита за непроменено оформление. Ако обаче изтеглите файла Layout.json на
работния плот по подразбиране и го качите отново, той се счита за променено оформление, дори ако съдържанието или името на файла не са променени.
В работния плот има два вида уиджети – базирани на iframe и базирани на уеб компоненти. Заглавката, навигацията (персонализирана страница), постоянната област, зоната без глава и допълнителният панел са персонализираната област в работния плот. Това не са джаджи.
Списъкът по-долу описва подробно пространствата, които можете да конфигурирате. Изображенията илюстрират оформлението на работния плот:
-
Област "Заглавие и емблема": Това пространство показва емблемата и името на Webex Contact Center (по подразбиране) в горния ляв ъгъл на екрана.
-
Хоризонтална област на заглавката : Това пространство има конфигурируема област, която се попълва с персонализирани джаджи. Тези джаджи могат да показват например вградена информация и падащи менюта. Тъй като височината на тази заглавка е само 64 пиксела, височината на джаджата не може да пресича височината на заглавката.
-
Област на работното пространство : Това пространство се променя според избора в лентата за навигация или когато агент взаимодейства с клиенти. Когато агент е в разговор, тази област показва контролата на взаимодействието и екрана с спомагателна информация (който включва персонализирани приспособления и постоянни приспособления). Когато агент взаимодейства по имейл, чат или социални канали, тази област показва областта на работното пространство и спомагателния информационен екран (който включва постоянната област на джаджата).
Персонализирана страница се показва в интерфейса на работния плот в екрана на работната област. Можете да получите достъп до персонализираната страница чрез икони в лентата за навигация. Всяка персонализирана страница може да съдържа една или повече персонализирани джаджи.
Custom Widget е приложение на трета страна, което е конфигурирано в оформлението на JSON. Можете да поставите персонализираната джаджа на персонализираната страница, персонализирания раздел (панел със спомагателна информация) или в хоризонталния хедър на работния плот.
-
Област на лентата за навигация: Използвайте това пространство, за да добавите елементи за навигация за достъп до персонализирани страници.


Свойства от първо ниво на JSON оформление
Роли
JSON оформлението по подразбиране има следните три роли.
-
агент – За да зададете оформлението на работния плот да се показва, когато агент влезе в работния плот на Webex Contact Center, за да обработва дейностите на агента.
-
супервайзор – За да зададете оформлението на работния плот да се показва, когато ръководител влезе в работния плот на Webex Contact Center, за да обработва само възможностите на супервайзора.
Когато ръководител влезе в работния плот, се прилага оформлението на работния плот, което е посочено за основния екип. Ако не предоставите основен екип, се прилага глобалното оформление. По подразбиране APS отчетите са деактивирани.
-
supervisorAgent – За да зададете оформлението на работния плот да се показва, когато ръководител влезе в работния плот на Webex Contact Center, за да се справи както с възможностите на супервайзора, така и с дейностите на агента.
Можете да добавяте или променяте джаджи за всяка роля в съответния персон на съответния файл за оформление на 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": { ... }, "панел": { ... }, "навигация": { ... }, "постоянен": { ... }, "headless": { ... } }, }, "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": { ... }, "панел": { ... }, "навигация": { ... }, "постоянен": { ... }, "headless": { ... }, "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": { ... }, "панел": { ... }, "навигация": { ... }, "постоянен": { ... }, "headless": { ... } }, } },
- Промените, направени в свойствата на оформлението на JSON, влизат в сила, когато браузърът на работния плот се обнови.
- Ако функция, която сте активирали в оформлението на JSON, не е налична на работния плот, свържете се с поддръжката на Cisco, за да активирате функцията.
- Всички свойства в оформлението на JSON са чувствителни към малки и големи букви.
appTitle
За да зададете заглавие в хоризонталната заглавка на работния плот. Заглавието по подразбиране е Webex Contact Center
.
Пример:
"appTitle": "Контактен център на Webex"
AppTitle по подразбиране се променя от работен
плот на контактния център на Webex Contact Center
. Няма влияние върху съществуващите персонализирани оформления, които използват старото appTitle по подразбиране (работен плот
на контактния център). За да използвате новото appTitle, трябва да промените оформлението по избор. Новото глобално оформление обаче използва appTitle по подразбиране като Webex Contact Center
.
Заглавието може да бъде текст, изображение или празен низ. Заглавният текст се показва на два реда. Ако текстът се простира отвъд втория ред, се показва икона с многоточие и подсказката показва цялото заглавие. Стиловете не могат да се прилагат към заглавието.
Можете да използвате URI файлове за данни (Uniform Resource Identifier) или да хоствате персонализирано изображение на заглавието в мрежа за доставка на съдържание (CDN), Amazon Web Services (AWS) Simple Storage Service (S3) или подобна хостинг услуга и след това да посочите URL адреса на хостваното изображение. Поддържаните формати на заглавните изображения са PNG, JPG, JPEG, GIF, SVG и WebP. Поддържаният размер на изображението на заглавието е 184 x 32 пиксела (ширина x височина).
емблема
За да посочите URL адрес за емблемата на фирмата. Ако не предоставите URL адрес, емблемата на Webex Contact Center се показва по подразбиране.
Пример:
"logo": "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 височина).
Условие | Пример | appTitle | емблема |
---|---|---|---|
Ако appTitle и емблемата не са конфигурирани |
|
Без заглавие | Лого по подразбиране |
Ако appTitle и емблемата са конфигурирани |
|
Конфигуриран текст | Конфигурирано лого |
Ако appTitle е конфигуриран, а емблемата не е конфигурирана |
|
Конфигуриран текст | Лого по подразбиране |
Ако appTitle не е конфигуриран и емблемата е конфигурирана
|
|
Без заглавие | Конфигурирано лого |
Ако appTitle е конфигуриран и логото не е за предпочитане |
|
Конфигуриран текст | Без лого |
Ако appTitle не е конфигуриран и логото не е за предпочитане
|
|
Без заглавие | Без лого |
Ако appTitle е добавен като изображение и емблемата е конфигурирана |
|
Конфигурирано изображение | Конфигурирано лого |
Ако appTitle е добавено като изображение и логото не е конфигурирано
|
|
Конфигурирано изображение | Лого по подразбиране |
Ако appTitle е добавено като изображение и логото не е за предпочитане
|
|
Конфигурирано изображение | Без лого |
- Персонализираният размер на изображението се регулира въз основа на съотношението на страните. Текстът на заглавието по избор, който е конфигуриран по-рано, вече може да се показва на два реда на работния плот. За да избегнете това, можете да промените текста на заглавието по избор.
- Ако заглавието и емблемата не са конфигурирани в хоризонталната заглавка на работния плот, това пространство се използва от уиджетите на заглавката. Уиджетите на заглавката трябва да бъдат конфигурирани правилно, за да използват заглавието и пространството на логото.
- Заглавието и логото заедно не могат да надвишават максималната ширина от 304 пиксела (включително подплънки). Ако ширината на логото е по-малка от 96 пиксела, останалата ширина може да се използва за заглавието.
- Ако размерът на персонализираното изображение е по-голям от поддържания размер, размерът на изображението се коригира въз основа на съотношението в хоризонталната горна колона. Ако размерът на персонализираното изображение е по-малък от поддържания, действителният размер на изображението се запазва в хоризонталната заглавка.
taskPageIllustration
За да зададете персонализирана илюстрация за страницата на задачата въз основа на предпочитанията на организацията и подравняването на марката. Когато агент влезе, страницата на задачата показва конфигурираната илюстрация като фон. По подразбиране страницата на задачата се показва без илюстрация.
Пример:
"taskPageIllustration": "https://www.abc.com/image/logo.jpg",
Можете да използвате URI файлове за данни или да хоствате персонализирана илюстрация в мрежа за доставка на съдържание (CDN), Amazon Web Services (AWS) Simple Storage Service (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
.
Ако стойността на свойството stopNavigateOnAcceptTask
не е въведена в оформлението на JSON, работният плот измества фокуса към новоприетата задача. Поведението е подобно на това, когато стойността на свойството stopNavigateOnAcceptTask
е зададена на false
.
- Настройката се прилага за всички задачи (гласови и цифрови канали), изпълнявани на работния плот – като например приемане на задача, конференция, консултация или прехвърляне, както и за изходящи повиквания на кампании, автоматично приключване и т.н.
- Настройката не се прилага, ако потребителят на работния плот е на началната страница, без активна задача в екрана Списък със задачи. В такъв случай, когато се приеме нова задача, фокусът се измества от началната страница към новоприетата задача.
dragDropEnabled
За да активирате плъзгането и пускането и преоразмеряването на джаджите на персонализираните страници, задайте стойността на true
. Стойността по подразбиране е false
.
Пример:
"dragDropEnabled": false
За повече информация относно разрешаването на функцията за плъзгане и пускане за разделите в екрана Спомагателна информация вижте Екран със спомагателна информация.
notificationTimer
За да зададете продължителността (в секунди), след която известията на работния плот на работния плот се отхвърлят автоматично. Известието се появява в горния десен ъгъл на работния плот. Стойността на времето за изчакване по подразбиране е 8 секунди. Валидният диапазон за стойностите на времето за изчакване е 1-10 секунди. За да влязат в сила на промените в времето за изчакване, браузърът трябва да се обнови след извършването им.
Пример:
"notificationTimer": 8
maximumNotificationCount
За да зададете броя на известията на работния плот, които да се показват едновременно на работния плот. Стойността по подразбиране е 3. Диапазонът за известия на работния плот е 1-10. Известията на работния плот са подредени. Ако има много известия, те се появяват с леко закъснение в зависимост от настройките на notificationTimer
.
Пример:
"maximumNotificationCount": 3
browserNotificationTimer
За да зададете продължителността (в секунди), след която известията на тостера на браузъра на работния плот се отхвърлят автоматично. Тостерът е собствено известие на браузъра, което се появява само ако работният плот не е активният прозорец или раздел на браузъра. Прозорецът или разделът на браузъра на работния плот е неактивен, когато
-
Работите върху други прозорци или раздели на браузъра.
-
Работите в друго приложение.
-
Минимизирали сте прозореца на браузъра на работния плот.
Известието се появява в горния десен ъгъл на работния плот. Стойността на времето за изчакване по подразбиране е 8 секунди. Препоръчителният диапазон за стойности на времето за изчакване е 5-15 секунди. За да влязат в сила на промените в времето за изчакване, браузърът трябва да се обнови след извършването им.
Пример:
"browserNotificationTimer": 8
Конфигурираното време за изчакване за известия на браузъра зависи от операционната система и настройките на браузъра. Стойността на изчакването се показва в браузъра Chrome в целия Windows OS, Chrome OS и macOS. Неподдъраните браузъри обаче не почитат конфигурираната стойност за изчакване на известията последователно .
wxmКонфигуриран
(По избор) За да конфигурирате Webex Experience Management, задайте стойността на true
. Стойността по подразбиране е false
.
Пример:
"wxmConfigured": вярно
настолен компютърChatApp
За конфигуриране на множество приложения за чат, предлагани от Cisco, като например Webex App.
webexКонфигуриран
Приложението Webex заедно с неговите функции за съобщения и срещи могат да бъдат конфигурирани в рамките на работния плот. Тази конфигурация позволява на агентите да си сътрудничат с други агенти, супервайзори и експерти по темата (МСП) в тяхната организация, без да навигират далеч от работния плот.
- Администраторът на сайта управлява потребителите на Webex Meeting и присвоява привилегии само ако потребителите имат Webex Enterprise Edition. За повече информация вижте Управление на потребители на Webex Meetings в Cisco Webex Control Hub.
- Надзорниците и МСП трябва да изтеглят Webex Клиента на своята система (лично устройство) или да получат достъп до Webex Приложението, като използват Webex Приложение за уеб ( https://web.webex.com/). За повече информация вижте Изтегляне на приложението.
- Можете да получите достъп до приложението Webex в рамките на Agent Desktop, за да си сътрудничите с други агенти, ръководители и експерти по темата (МСП) на вашата организация, без да навигирате далеч от Agent Desktop. Функцията за управление на повикванията не е налична. За да получавате и извършвате повиквания, ви е необходимо външното, невградено приложение Webex. За повече информация вижте Приложение за повикванеs.
За да конфигурирате приложението Webex в рамките на работния плот:
-
В Cisco Webex Control Hub, когато добавяте услуги за потребител, поставете отметка в квадратчето Разширени съобщения ( ). За повече информация вижте Управление на потребителски акаунти в Cisco Webex Site Administration.
-
В персонализираното оформление на работния плот задайте стойността на свойството
webexConfigure
наtrue
.Пример:
"desktopChatApp": { "webexConfigured": true },
Стойността по подразбиране на свойството
webexConfigure
еfalse
.Приложението Webex е достъпно за ролите на агент, ръководител и supervisorAgent само ако зададете стойността на свойството
webexConfigure
наtrue
за всяка от тези роли. Агентът, ръководителят или супервайзорътАгентът не може да излезе от приложението Webex.За да се покаже
(Webex) в хоризонталната заглавка на работния плот, въведете стойността
webex
в свойствотоheaderActions
. За повече информация вижте заглавкаДействия.За да разрешите приложението Webex за конкретен екип, изберете персонализираното оформление със стойността на свойството
webexConfigurationed
, зададена наtrue
. За повече информация вижте Създаване на екип.
Можете да конфигурирате приложението Webex в екрана със спомагателна информация, персонализираната страница и персонализираната джаджа. За повече информация вижте Екран със спомагателна информация.
Известие за приложението Webex
Стойностите, които са зададени с помощта на свойствата notificationTimer и
browserNotificationTimer
за таймера за известия, са приложими за приложението Webex. Стойността на времето за изчакване по подразбиране е 8 секунди за тези свойства. За повече информация вижте notificationTimer и browserNotificationTimer.
headerActions
Промяна на реда на иконите в хоризонталния хедър на работния плот. Редът по подразбиране е следният:
-
(Webex)
-
(Изходно повикване)
-
(Център за известия)
Задайте стойността на свойството headerActions
, както следва:
Име на иконата |
headerActions Стойност на свойството |
---|---|
Webex приложениеп |
Webex |
Изходящи повиквания |
Изходящ номер |
Център за Известия |
известие |
Пример:
"headerActions": ["webex", "outdial", "notification"],
Стойността на свойството headerActions
е чувствителна към малки и големи букви.
За да промените реда по подразбиране на иконите, въведете съответно свойството headerActions
и стойностите в оформлението по избор.
Пример:
"headerActions": ["известие", "outdial", "webex"],
- Ако не въведете свойството и стойностите
headerActions
в оформлението по избор, иконите се показват в реда по подразбиране. - За да премахнете иконите на заглавките и свързаните с тях функционалности от работния плот, задайте празна стойност за свойството
headerActions
("headerActions": []
). Въпреки това, ако сте добавили Webex App към екрана със спомагателна информация или персонализирана страница, или като персонализирана джаджа, агентът все още може да има достъп до приложението Webex, въпреки че приложението Webex не е налично в хоризонталната заглавка на работния плот. - Ако стойността на свойството
webexConfigure
е зададена катоfalse
, иконата на приложението Webex не се показва в хоризонталната заглавка на работния плот, дори ако стойността наwebex
е добавена в свойствотоheaderActions
. За повече информация вижте webexConfigured.
област
Свойството area е основната част на оформлението на работния плот. Можете да определите оформлението според областта.
"area": { "header": { ... }, "advancedHeader: { { "comp": "widget-1", "attributes": { ... }, "script": .... } }, "панел": { ... }, "навигация": { ... }, "постоянен": { ... }, "headless": { ... } },
Можете да конфигурирате следните обекти на областта
:
-
Панел: Представлява втория панел или най-десния панел в екрана със спомагателна информация.
-
Навигация: Представя персонализирани страници и техните навигационни елементи, които са свързани със страниците.
-
Постоянен: Представлява уиджетите на ниво страница, които са постоянни и се показват на всички страници на работния плот.
-
Headless: Представлява джаджи, които нямат визуален интерфейс, но изпълняват логика във фонов режим.
Ако свойството advancedHeader е конфигурирано, свойствата header и headerActions трябва да бъдат премахнати.
разширеноЗаглавие
За персонализиране на видимостта и промяна на реда на иконите в хоризонталната заглавка на работния плот. Редът по подразбиране е следният:
-
(Webex)
-
(Изходно повикване)
-
(Център за известия)
-
(Селектор на държавата на агента)
Задайте стойността на свойството advancedHeader
, както следва:
Име на иконата |
headerActions Стойност на свойството |
---|---|
Webex приложениеп |
AgentX-Webex |
Изходящи повиквания |
agentx-outdial |
Център за Известия |
AgentX-известие |
Селектор на състояние на агент |
agentx-селектор на състояние |
Пример:
"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 App към екрана със спомагателна информация или персонализирана страница, или като персонализирана джаджа, агентът все още може да има достъп до приложението Webex, въпреки че приложението Webex не е налично в хоризонталната заглавка на работния плот.
-
Ако добавите приспособление с дълъг етикет, се показва съкратено име на етикет според наличното пространство.
Можете да използвате атрибута
textContent
, за да добавите етикет към джаджа.Пример:
{ "comp": "timer-widget", "attributes": { "duration": "08:00:00" }, "textContent": "Таймер за обратно броене за текущата смяна", "script": "https://wxcc-demo.s3.amazonaws.com/widgets/timer-widget.js" }
Етикетът "Таймер за обратно отброяване за текуща смяна" ще бъде съкратен и показан според наличното пространство.
-
Избягвайте да добавяте джаджи с дълъг етикет.
-
Когато джаджа потече в падащото меню, може да се кликне само върху иконата на приспособлението.
-
-
Ако стойността на свойството
webexConfigure
е зададена катоfalse
, иконата на приложението Webex не се показва в хоризонталната заглавка на работния плот, дори ако стойността наwebex
е добавена в свойствотоadvancedHeader
. За повече информация вижте webexConfigured.
Начална страница
Когато влезете в работния плот, попадате на началната страница.
Началната страница е приложима само за Супервайзори и Супервайзор Агент.
Можете да видите следните джаджи на началната страница. Уиджетите на анализатора се предоставят по подразбиране, но администраторът може също да конфигурира постоянни и персонализирани джаджи. За повече информация вижте Свойства от първо ниво на оформление на JSON.
Джаджи за анализатор
По подразбиране приспособлението Analyzer се показва на началната страница на работния плот.
Конфигурация на оформлението на началната страница
Можете да конфигурирате началната страница на работния плот за показване на оформление, което се основава на предпочитанията на вашата организация и подравняването на марката. Редактирайте полето Начална страница , за да конфигурирате началната страница. Можете да конфигурирате следните компоненти да се показват в началната страница, когато потребител влезе в работния плот:
-
Поздравително съобщение
-
Иконата Task в лентата за навигация, за да отидете до прозореца със задачи. Иконата Task се показва за Supervisor и Supervisor & Роля на агент с активирана функция за наблюдение на обажданията. Панелът на задачите показва входящи заявки от клиенти, активни и минали взаимодействия с клиенти и активни заявки за наблюдение.
-
Филтрирайте секции като Име на опашката, Тип на канала и Управлявани екипи.
Следната таблица описва свойствата на страницата
, които са необходими за конфигуриране на началната страница:
Собственост |
Описание и код |
---|---|
страница > useFlexLayout |
Flex layout е нов уеб компонент. Това не променя съществуващите джаджи. Новото гъвкаво оформление използва същия формат за конфигурация на оформлението по опростен начин. Той е обратно съвместим и не засяга съществуващите джаджи. Трябва да конфигурирате JSON оформлението. За да конфигурирате оформлението на JSON, посочете височината и ширината на изпълнимия модул. Приспособлението се изобразява в същата последователност, както е конфигурирано в оформлението на JSON. Приспособленията имат поле по подразбиране от 8 px. Оформлението на JSON се основава на размерите (ширина x височина) и координатите (X, Y и Z) на уиджетите. Гъвкавото оформление поддържа възможности като индивидуално преоразмеряване на джаджи, максимизиране на джаджи и т.н. Височината на отделните уиджети се измерва в пиксели. 1 единица височина = 40 пиксела. Ширината на изпълнимия модул зависи от броя на колоните в контейнера и броя на колоните, които се променят въз основа на ширината на контейнера. Уиджетите се показват отляво надясно. Механизмът за разширено оформление използва персонализирана логика, за да приложи както хоризонтално, така и вертикално регулиране на пространството на джаджи. Първоначално оформлението се зарежда хоризонтално. След като се зареди хоризонтално, джаджата се зарежда вертикално и гарантира, че използването на пространството е оптимално. Конфигурирайте уиджетите според размера на екрана. Можете да увеличите или намалите ширината на уиджетите в зависимост от размера на екрана. Това прави джаджите по-четими и използваеми. Гъвкавото оформление предоставя стандартни точки на прекъсване като големи, средни, малки и много малки.
Тези пиксели може да варират в зависимост от операционната система и браузъра.
|
страница > комп |
Уверете се, че предоставяте уникален персонализиран компонент.
Компонентът |
страница > pageHeader |
Уверете се, че сте посочили заглавен низ, който може да бъде статичен, динамичен или и двете. Компонентът
|
страница > pageSubHeader |
Уверете се, че сте добавили Sub Header, който се показва на работния плот. Потребителят може да добави Go to Analyzer в Sub Header.
|
Навигация (персонализирани страници)
В този раздел можете да добавяте страници, които се показват в лявата лента за навигация. Посочвате икона за навигация и уникален URL адрес, за да се покаже притурката в лентата за навигация. Препоръчваме да използвате конкретен префикс за URL адреса, за да избегнете конфликти. За повече подробности вижте nav собственост раздел.
Можете също така да имате колекция от джаджи, които могат да се показват на тази страница. Страницата може да има един уиджет, който се появява на екрана, или колекция от уиджети в мрежа. За повече подробности относно подреждането на мрежата вижте свойство на оформлението раздел.
Не е необходимо да добавяте обвивка на динамична област към дървото на джаджи. Това означава, че можете да плъзгате и пускате и преоразмерявате джаджи на потребителски страници, когато активирате тази опция.
Пример:
{ "nav": { "label": "Персонализирана страница", "icon": "stored-info", "iconType": "momentum", "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": "Stock Market", "responsive": "false" "attributes": { "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": "Пазар", "maximizeAreaName": "app-maximize-area" } }], }, { "comp": "md-tab", "textContent": "Widget3", "attributes": { "slot": "tab" } }, { "comp": "md-tab-panel", "textContent": "Три съдържание", "attributes": { "слот": "панел" } } ] }, "comp2": { "comp": "my - google - maps - компонент", "source": "https://my-cdn.com/my-google.maps.js "wrapper": { "title": "Google Map", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "области": [ ["ляво", "дясно"] ], "размер": { "колове": [1, 1], "редове": [1] } } } },
Следващата таблица описва нав и страница свойства заедно с техните дъщерни свойства:
Собственост |
Описание и код |
---|---|
нав > етикет |
Това свойство показва идентификатора за навигация на страницата. Екранният четец чете това свойство и то се появява в подсказката. Тези параметри са необходими за показване на вашата персонализирана страница в лентата за навигация.
Свойството |
nav > iconType |
Това свойство представлява типа икона, която се показва в лентата за навигация за персонализираната страница. Налични са следните видове икони:
|
навигация > икона |
Това свойство представлява името на иконата в библиотеката Momentum или URL адреса на CDN.
|
навигация > подравняване |
Това свойство ви помага да подравните иконата към горната или долната част на лентата за навигация. В момента собствеността позволява само горно подравняване. |
nav > isDefaultLandingPage | Това свойство указва целевата страница по подразбиране за агентите в Agent Desktop. Задайте това свойство на true за да направите страницата на лентата за навигация целевата страница по подразбиране, която се показва за агентите след влизане в Agent Desktop. Ако повече от една страница на навигационната лента има това свойство, зададено на true, системата счита, че първата страница на навигационната лента се превръща в целева страница по подразбиране. Ако никоя страница на навигационната лента няма това свойство, зададено на true, началната страница действа като целева страница по подразбиране. Не можете да зададете статистически отчети за ефективността на агента като целева страница по подразбиране. |
навигация > придвижване до |
Това свойство указва името на персонализираната страница. Това име се появява в адресната лента, когато агентът навигира. NavigateTo не трябва да включва следните стойности: изображения, шрифтове, css, build_info, помощ, приложение, i18n, икони, изображения-mfe-wc и звуци.
|
Собственост |
Описание и код |
---|---|
страница > id |
Входящи the
|
страница > използване на FlexLayout |
Flex layout е нов уеб компонент. Това не променя съществуващите джаджи. Новото гъвкаво оформление използва същия формат за конфигурация на оформлението по опростен начин. Той е обратно съвместим и не засяга съществуващите джаджи. Трябва да конфигурирате JSON оформлението. За да конфигурирате оформлението на JSON, посочете височината и ширината на изпълнимия модул. Приспособлението се изобразява в същата последователност, както е конфигурирано в оформлението на JSON. Приспособленията имат поле по подразбиране от 8 px. Оформлението на JSON се основава на размерите (ширина x височина) и координатите (X, Y и Z) на уиджетите. Гъвкавото оформление поддържа възможности като индивидуално преоразмеряване на джаджи, максимизиране на джаджи и т.н. Височината на отделните уиджети се измерва в пиксели. 1 единица височина = 40 пиксела. Ширината на изпълнимия модул зависи от броя на колоните в контейнера и броя на колоните, които се променят въз основа на ширината на контейнера. Уиджетите се показват отляво надясно. Механизмът за разширено оформление използва персонализирана логика, за да приложи както хоризонтално, така и вертикално регулиране на пространството на джаджи. Първоначално оформлението се зарежда хоризонтално. След като се зареди хоризонтално, джаджата се зарежда вертикално и гарантира, че използването на пространството е оптимално. Конфигурирайте уиджетите според размера на екрана. Можете да увеличите или намалите ширината на уиджетите в зависимост от размера на екрана. Това прави джаджите по-четими и използваеми. Гъвкавото оформление предоставя стандартни точки на прекъсване като големи, средни, малки и много малки.
Тези пиксели може да варират в зависимост от операционната система и браузъра.
|
страница > джаджи страница > комп |
Помага ви да дефинирате вашите персонализирани джаджи. За да поставите множество изпълними елементи, укажете последователно опциите за изпълними елементи. Уверете се, че сте дали на всяка джаджа уникално име на област. Използвайте го в раздела за оформление по-късно.
Това свойство представлява името на персонализирания HTML елемент (известен като уеб компонент или друг елемент - ако искате да го използвате като обвивка). За повече информация вижте Примерни примери за използване. Въведете името на персонализирания елемент тук без ъглови скоби ("<" или ">"). Например „my-custom-element“. Всеки запис в секцията с джаджи поддържа следния формат:
|
страница > сценарий |
(По избор) Това свойство се изисква само когато зареждате изпълнимия модул или компонент от отдалечено местоположение, като например CDN.
Не променяйте URL адреса на скрипта за същия компонент. Ако трябва да промените URL адреса на скрипта за същия компонент, направете едно от следните:
|
страница > свойства |
Можете да посочите свойства, които трябва да подадете за уеб компонента.
|
страница > отзивчив |
Определя дали уеб компонент или изпълним модул, базиран на iFrame, който е добавен в персонализираното оформление на ниво Конфигурирайте това свойство с една от следните стойности:
Неотговарящите приспособления не могат да осигурят най-доброто потребителско изживяване и не се показват в по-малък изглед. Агентът трябва да увеличи размера на прозореца на браузъра, за да види всички изпълними модули, които са конфигурирани като неотговарящи. |
страница > атрибути |
Можете да посочите атрибутите на уеб компонента в този раздел.
|
страница > видимост |
Указва дали предлаганите от Cisco приспособления, добавени в персонализираното оформление на ниво Предлаганите от Cisco приспособления са хронология на контактите, Cisco Webex Experience Management, IVR транскрипт, предварителен преглед на ръководството за повикване на кампания и изскачане на екрана.
|
страница > деца |
Това свойство е основната част от оформлението. В За да научите за предаването на STORE стойности като свойства, вижте Споделяне на данни от работния плот към Widgets.
Предимството на секцията с масиви "children" е, че можете да използвате съществуващи уеб компоненти във вашата спецификация на оформлението, което вече е част от пакета Desktop. Някои от уеб компонентите на пакета Desktop включват:
За повече информация относно атрибутите за постоянния раздел вижте Атрибути за постоянни раздели. |
страница > textContent |
Помага ви да добавите вашето текстово съдържание.
|
страница > стил |
Помага ви да присвоите определен CSS стил на вашия компонент.
|
страница > обвивка |
Widget wrapper ви позволява да добавите лента с инструменти в горната част на вашия widget. Лентата с инструменти може да съдържа заглавие и Уверете се, че използвате стойността по подразбиране като "app-maximize-area". В момента е налична само стойността по подразбиране.
|
страница > обвивка> id |
(По избор) Обвивката на изпълним модул за уеб компонент ви позволява да актуализирате заглавието на динамичния изпълним елемент, като използвате уникален идентификатор. Въведете обвивката на джаджата
Уверете се, че използвате същия уникален идентификатор за JavaScript CustomEvent. За повече информация вижте Асинхронни събития раздел в Модул за контакт с агент глава на Cisco Webex Contact Center Настолен разработчик. За да актуализирате заглавието на изпълним модул, базиран на iFrame, използвайте съдържанието на iFrame от същия домейн. Следва примерен пример:
|
page > agentx-wc-iframe |
Позволява ви да вградите уеб страница в iFrame, която се показва като уиджет на работния плот. Можете да използвате приспособлението iFrame, наречено "agentx-wc-iframe".
|
страница > оформление | Позволява ви да подредите джаджите на страница. Следният формат представлява оформление на мрежата:
Тук можете да дефинирате мрежата с имената на областите, които сте дефинирали в секцията за джаджи. Следващият пример показва как е зададено оформлението на три реда и три колони:
![]() В секцията за размер числата представляват частта от пространството, което джаджата може да заема, спрямо другите приспособления. И трите колони заемат еднаква 1 част от пространството. Със 100% налична ширина, всяка джаджа заема 33,33% от хоризонталното пространство. ![]() Друг пример за употреба, ако зададете като "колони": [1, 2, 2], това означава, че общото пространство е разделено на 5 (1+2+2) и първата джаджа заема 20% от хоризонталното пространство. Втората и третата джаджи заемат по 40%. За повече информация вижте Основни понятия за оформление на мрежата. ![]() |
page > ROOT |
Разполагането на оформления се нарича подоформление. В случай, че имате вложени оформления във вашата конфигурация на оформлението, трябва да имате един "ROOT" обект като родител за подоформления. В противен случай конфигурацията на оформлението ви може да бъде плоска, ако не се изисква разкрой. Това подоформление осигурява повече контрол върху поведението при преоразмеряване на оформлението. Свойството оформление на страницата трябва да е от тип Запис<низ, Оформление>. Свойството оформление ви позволява да подредите джаджите на страница.
Тази настройка създава мрежа в оформлението ROOT с две подмрежи, които можете да преоразмерявате независимо. ![]() Преоразмеряването на компонент засяга компонентите в това подоформление. ![]() Имайте предвид следните случаи: Безкраен цикъл: Ако включите ROOT оформление като подоформление на ROOT, това причинява грешка "превишен стек от повиквания" и преминава в безкраен цикъл.
![]() Едно и също подоформление (N) времена: Ако включите подоформлението във вашата мрежа повече от веднъж с едно и също име и ако преоразмерите едно от тях, всички подоформления се преоразмеряват автоматично. Ако това не е желаното поведение, преименувайте всяко от подоформленията с уникално име.
![]() |
Атрибути за постоянни раздели
За да зададете разделите в персонализираните страници и персонализираните уиджети като постоянни, въведете атрибутите за md-tabs
в персонализираното оформление.
Пример: Задаване на раздели като постоянни
{ "comp": "md-tabs", "attributes": { "persist-selection": true, "tabs-id": "unique-id за всички раздели заедно в контейнера" }, }
Свойство |
Описание |
---|---|
Устойчив избор |
За да зададете |
tabs-id |
Уникална идентификация за всички раздели заедно в контейнера. |
Когато зададете md-tabs
да бъдат постоянни (persist-selection: true
), Agent Desktop запазва избора на раздел дори ако агентът превключва между страници или уиджети в работния плот.
- Свойството
за избор
на запазване не е приложимо за разделите в екрана Спомагателна информация и страницата Статистика за производителността на агента, тъй като поведението на постоянния раздел вече е зададено в работния плот. - Изборът на раздел се връща към раздела по подразбиране, когато излезете от работния плот, презаредите/обновите браузъра или изчистите кеша на браузъра.
Конфигурация на постоянни джаджи
Можете да конфигурирате всяка персонализирана джаджа да бъде постоянна. Постоянните приспособления се показват на всички страници на работния плот. Постоянните приспособления се показват като нов раздел в екрана Спомагателна информация само когато имате активна заявка за контакт или разговор. Например, Примерна постоянна джаджа.
Постоянните уиджети не се показват на началната страница по начина, по който се показват на другите страници. Ако обаче имате активно взаимодействие, постоянните приспособления се показват в началната страница като част от екрана със спомагателна информация. Например, когато сте отговорили на повикване, се показва екранът Управление на взаимодействието, а графичният компонент Примерен постоянен се показва като част от екрана Спомагателна информация.
Пример:
"area": { "persistent": [{ "comp": "md-tab", "attributes": { "slot": "tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "emoticons_16" } }, { "comp": "span", "textContent": "Персонализирана джаджа за страница" } ] }, { "comp": "md-tab-panel", "attributes": { "slot": "panel" }, "children": [{ "comp": "dynamic-area", "properties": { "area": { "id": "dw-panel-two", "widgets": { "comp": { "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 елемент (известен като уеб компонент)?
-
Какъв е 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] } } } }
За да добавите пояснение за джаджа за заглавка, обвийте компонента с 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 в персонализираната област на джаджата в заглавката. Най-добрата стойност за прилягане на атрибута height
е 64 пиксела.
Уверете се, че сте добавили атрибутите на стила към съществуващите джаджи на заглавката, за да се зареждат според очакванията в iFrame.
Пример:
"head1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://widget-kad.s3.amazonaws.com/Headers/Timer/Timer.htm", "style": "height:64px; display:flex;" } },
Препоръчваме ви да използвате само един ред с няколко колони за заглавката, тъй като височината на заглавката е само 64 пиксела. За повече информация относно подравняването вижте раздела за свойства на оформлението.
Помощен информационен екран
Панелът Спомагателна информация на работния плот показва разделите, които включват предлаганите от Cisco (по подразбиране) джаджи и персонализирани джаджи. Следните джаджи, предлагани от Cisco, се появяват в предварително дефинираните раздели:
-
История на контактите
-
IVR транскрипт
-
Пътуване на клиентското изживяване
-
Изскачащ прозорец
Можете да използвате екрана Спомагателна информация, за да:
-
Добавяне на раздели
-
Промяна на реда на разделите
-
Премахване на предварително зададени раздели
-
Маркиране на персонализираните раздели като плъзгащи се
-
Добавяне на пояснения към персонализираните раздели
-
Добавяне на опцията Нулиране на реда на раздела
Пример:
"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", "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", "attributes": { "slot": "tab" }, "children": [{ "comp": "md-icon", "attributes": { "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], "rows": [1, 1] } } ] } },
Можете да конфигурирате приспособлението "Пътуване на клиентското изживяване", след като разрешите показателите за управление на клиентското изживяване в портала за управление.
В екрана Спомагателна информация добавете нови раздели, за да поставите вашите персонализирани джаджи. Тук не се прилагат специални правила и разполагането на компонентите е според очакванията и описаните в раздела за деца
. За повече информация вижте свойството " Деца " на страницата.
По-долу са конкретните примери за персонализиране на заглавките на вашите раздели:
Пример за поставяне на икони и етикети в свойството "Деца"
{ "comp": "md-tab", "attributes": { "slot": "tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "transcript_16" } }, { "comp": "span", "textContent": "My Widget Tab" } ], },
Пример за поставяне на изображение (с CSS) и етикети в свойството "Деца"
{ "comp": "md-tab", "attributes": { "slot": "tab" }, "children": [{ "comp": "span", "attributes": { "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" } ] }], },
Падащият списък Още раздели се появява автоматично, когато екранът Спомагателна информация съдържа няколко раздела.
Трябва да добавите персонализирано пояснение за раздел за четливост и достъпност. За да добавите пояснение за раздел по избор, обвийте компонента с md-tooltip
. Въведете информацията за подсказката в свойството message и приложете стойностите на
свойството style
, както е показано в следващия пример.
"comp": "md-tooltip", "attributes": { "class": "widget-tabs", "message": "Примерен раздел 1", "style": "max-width: 252px; минимална ширина: 110px; преливане: скрит; преливане на текст: многоточие; бяло пространство: nowrap; дисплей: вграден блок; margin-bottom: -10px;" },
За персонализиран раздел препоръчваме максимална ширина от 252 пиксела и минимална ширина от 110 пиксела.
За да активирате функцията за плъзгане и пускане в персонализирания раздел, добавете следното свойство в атрибутите :
"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"
Ако разрешите плъзгане и пускане за раздел по избор, агентът може да плъзне и пусне раздела на желаната позиция в екрана Спомагателна информация. За да нулирате разделите до реда на табулаторите по подразбиране, добавете следното свойство:
"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"
: Въведете атрибут в компонента, който се показва като опция Нулиране на реда на разделите в падащия списък Още действия . Агентите могат да нулират разделите в екрана Спомагателна информация до реда по подразбиране, като щракнат върху бутона> Нулиране на реда на разделите.
-
tabs-unique-id
: Въведете същата уникална стойност, определена за свойствотоcomp-unique-id
, за да съпоставите и нулирате компонентитеmd-tabs
.
Следващият примерен код използва функциите Още действия и Нулиране на реда на разделите.
"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" } ] }], }

По подразбиране се дефинират пояснението, иконата с многоточие и нулирането на реда на разделите за предварително дефинирани раздели.
Падащият списък Още действия може да бъде разширен, за да добави допълнителни персонализирани компоненти или приспособления след опцията Нулиране на реда на раздела. По-долу е даден примерен набор от стойности на свойствата на стила
, които могат да бъдат приложени към допълнителни компоненти.
"comp": "md-tooltip", "attributes": { "class": "widget-tabs", "message": "Примерен елемент", "style": "максимална ширина: 252px; минимална ширина: 110px; преливане: скрит; преливане на текст: многоточие; бяло пространство: nowrap; дисплей: вграден блок; margin-bottom: -10px;" },

Функцията за плъзгане и пускане не се поддържа за допълнителните персонализирани компоненти или приспособления, които се добавят към падащия списък Още действия .
Джаджи без глава
В секцията без глава можете да добавяте уиджети, които са скрити и не се показват на 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], "rows": [1] } } }
Споделяне на данни от работния плот към уиджети
За да получавате данни в реално време чрез свойства или атрибути в персонализирана джаджа, задайте подходящи стойности на STORE в JSON конфигурацията на оформлението.
Освен това, за да получите достъп до данните чрез абонати на JavaScript SDK, можете също да предавате данните чрез свойства или атрибути. Ако вашият компонент е създаден да реагира на промени в свойства или атрибути, получавате актуализации на данни в реално време от Agent Desktop, който се нарича доставчик на данни.
В момента имаме един доставчик на данни под ключов STORE. За повече информация вижте раздела Доставчик на данни – Свойства и атрибути на джаджа в Ръководството за разработчици на работния плот на Cisco Webex Contact Center.
Покана за предварителен преглед на кампанията
Администраторът създава кампании, конфигурира режима на набиране (визуализация) и присвоява кампаниите на екипи. Ако агентът е част от екип, към който са присвоени кампаниите, тогава агентът може да направи изходящо обаждане за предварителен преглед. За повече информация вижте Конфигуриране на режими на изходяща гласова кампания в контактния център на Webex.
Администраторът конфигурира следното в персонализираното оформление, за да разреши контакт за предварителен преглед на кампанията за агент.
Контакт за кампанията
Администраторът добавя приспособлението "Контакт за кампанията" в контейнера на заглавката на персонализираното оформление. Контактът за кампанията показва информацията за контакт на клиента въз основа на дефинираните свойства. За повече информация относно подравняването на оформлението вижте реда за свойства на оформлението на таблицата Подробности за свойствата на страницата.
Пример:
"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.envVariables.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featuresFlags.isProgressiveCampaignEnabled" } }, { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } ]
Ръководство за обаждания
Приспособлението "Ръководство за повикване" се показва в екрана "Спомагателна информация" на работния плот. Ръководството за обаждания показва въпросите и отговорите на ниво кампания. Агентът е подканен да прочете набора от въпроси в ръководството за обаждане и да изпрати отговорите.
Пример:
"panel":{ "comp":"md-tabs", "attributes":{ "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", // включете CDN връзка тук " wrapper":{ "title":"Ръководство за обаждания", "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-campaign
е преименуван наacqueon-preview-campaign
agentx-call-guide
е преименуван наacqueon-call-guide
- Трябва да хоствате Мениджър на списъци и кампании (LCM) на CDN и след това да посочите URL адреса в свойството на
скрипта
.
Изскачащ прозорец
В оформлението на работния плот можете да конфигурирате изскачането на екрана по един от следните начини:
-
Като персонализирана страница
-
Като една от притурките на потребителската страница
-
Като раздел в екрана Спомагателна информация
Изскачащият екран се показва на работния плот въз основа на следните фактори:
За гласовия канал:
-
Конфигурацията, дефинирана в оформлението на работния плот
-
Дейността Screen Pop, дефинирана в Flow Designer
За новите дигитални канали:
-
Конфигурацията, дефинирана в оформлението на работния плот
-
Възелът Screen Pop, дефиниран в Connect Flow Builder
За повече информация относно конфигурирането на Screen Pop вижте Screen Pop.
Конфигуриране на изскачащия екран в навигационната лента
Можете да конфигурирате Screen Pop като персонализирана страница или като една от джаджите в персонализирана страница. За достъп до персонализираната страница Screen Pop, щракнете върху иконата Screen Pop в навигационната лента. За достъп до приспособлението Screen Pop в персонализираната страница, щракнете върху иконата по избор в лентата за навигация. За повече информация относно свойствата на навигацията
вижте Навигация (персонализирани страници).
Пример: Изскачане на екрана като персонализирана страница
{ "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 се появява като нов подраздел в раздела Screen Pop на екрана Спомагателна информация, ако Screen Pop е конфигуриран да се показва като Inside Desktop в Flow Designer.
Добавете следния атрибут в секцията на панела
, за да включите Screen Pop като раздел в екрана Спомагателна информация. За повече информация относно подробностите за панела
вижте Екран със спомагателна информация.
Пример: Изскачане на екрана като раздел в екрана със спомагателна информация
{ "comp":"md-tab", "attributes":{ "slot":"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" } ], }
Опцията Screen Pop display, дефинирана в Flow Designer, има предимство пред конфигурацията, дефинирана в оформлението на работния плот.
Например, имайте предвид, че сте конфигурирали следните настройки за изскачане на екрана:
- Flow Designer – Показване на настройките като в новия раздел на браузъра
- Оформление на работния плот – Като раздел в екрана със спомагателна информация
Когато настъпи събитието, за което е конфигурирано изскачането на екрана, изскачането на екрана се показва извън работния плот - тоест в нов раздел на браузъра.
Примерни примери за случаи на употреба
-
Екран за спомагателна информация по подразбиране с хронология на контактите и изскачащ екран
-
Спомагателен информационен екран с приспособление за пътуване на клиентско изживяване
Конфигуриране и достъп до приспособлението за управление на показатели за управление на клиентското изживяване от навигационната лента
Пример:
{ "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": "$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", "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", "class": "widget-pane-tab" }, { "comp": "md-tab", "attributes": { "slot": "tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "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", "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" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY" } }] }, { "comp": "md-tab", "attributes": { "slot": "tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP" } }], "visibility": "SCREEN_POP" } "видимост": "SCREEN_POP" }, }, },
Локализиране
Поддържат се следните езици:
Български, каталан, китайски (Китай), китайски (Тайван), хърватски, чешки, датски, нидерландски, английски (Обединено кралство), английски (САЩ), фински, френски, немски, унгарски, италиански, японски, корейски, норвежки бокомал, полски, португалски (Бразилия), португалски (Португалия), румънски, руски, сръбски, словашки, словенски, испански, шведски и турски
Езикът на потребителския интерфейс на работния плот се основава на настройките за езикови предпочитания на вашия браузър. Например, нека считаме, че сте избрали предпочитания език като френски в браузъра Firefox. Когато стартирате работния плот в браузъра Firefox, потребителският интерфейс на работния плот се появява на френски език. Хоризонталната заглавка, навигационната лента и други компоненти, добавени в оформлението на работния плот, обаче не са локализирани въз основа на настройките за езикови предпочитания на вашия браузър.
Локализиране на компонентите на работния плот
За да локализирате компонентите на работния плот,
-
Използвайте съществуващите ключове за локализация, зададени във
файла app.json
. Ако ключовете за локализация не са зададени, се използва езикът по подразбиране английски (САЩ). Можете да изпратите заявка за услуга до поддръжката на Cisco, за да добавите ключ за локализация къмфайла app.json
.Пример: Ключ за локализация
{ "common": { "buttonTitle": "Стоп таймер" } }
-
Въведете следното чувствително към малки и големи букви свойство в JSON файла на оформлението на работния плот, за да локализирате компонент:
"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", } }, }, }
Пример: Локализиране на компонент на раздел в екрана със спомагателна информация
"panel": { "comp": "md-tab", "attributes": { "slot": "tab" }, "children": [{ "comp": "span", "textContent": "$I 18N.panelTwo.screenPopTitle" }] }