Prehľad

Funkcia Rozloženie pracovnej plochy vám umožňuje nakonfigurovať pracovnú plochu Webex Contact Center podľa požiadaviek vašej firmy. Môžete prispôsobiť prvky, ako sú logo, názov a widgety. Môžete vytvoriť rozloženie pracovnej plochy a priradiť ho tímu. Toto rozloženie generuje skúsenosti agentov na pracovnej ploche pre všetkých agentov, ktorí sa prihlásia ako súčasť tohto tímu.

Existujú dva typy rozložení:

  • Globálne rozloženie: Toto rozloženie je rozloženie generované systémom, ktoré sa predvolene priradí pri vytváraní tímu. Ďalšie informácie nájdete v téme Správa tímov. Keď vytvoríte tím, globálne rozloženie sa automaticky nastaví ako rozloženie pracovnej plochy pre tím. Toto rozloženie nie je možné odstrániť.

  • Vlastné rozloženie: Rozloženie poskytujúce prispôsobené prostredie pracovnej plochy. Môžete vytvoriť vlastné rozloženie pre jeden alebo viac tímov.

Ak priradíte nové rozloženie pracovnej plochy, keď je prihlásený agent, agent musí stránku znova načítať, aby videl nové rozloženie.

Webex Contact Center Desktop podporuje tri persóny:

  • Agent

  • Supervízor

  • Supervízor a zástupca

Súbor rozloženia JSON má samostatné sekcie pre každú z osôb. Správca by mal nakonfigurovať nastavenia pre každú osobu v príslušnej časti súboru rozloženia JSON. Ďalšie informácie o vzorovom súbore rozloženia JSON nájdete v téme Vlastnosti najvyššej úrovne rozloženia JSON.

Keď Cisco pridá novú funkciu do rozloženia pracovnej plochy, nezmenené rozloženie sa automaticky aktualizuje novými funkciami. Aktualizované rozloženie pracovnej plochy je automaticky k dispozícii existujúcim tímom, ktoré používajú nezmenené rozloženie pracovnej plochy. Používatelia pracovnej plochy, ktorí používajú neupravené rozloženie pracovnej plochy, dostanú po prihlásení alebo opätovnom načítaní prehľadávača nové funkcie založené na rozložení.

Ak používate súbor Default Desktop Layout.json bez akýchkoľvek úprav, považuje sa za nezmenené rozloženie. Ak však stiahnete súbor Default Desktop Layout.json a znova ho nahráte, bude sa považovať za zmenené rozloženie, aj keď sa obsah súboru alebo názov súboru nezmení.

V prípade tímov, ktoré používajú vlastné rozloženie pracovnej plochy, musia správcovia pravidelne obnovovať definíciu rozloženia, aby obsahovali nové funkcie. Keď správcovia zobrazia nezmenené rozloženie alebo tím, ktorý používa nezmenené rozloženie, zobrazí sa hlásenie s informáciou, že nové funkcie pracovnej plochy sa automaticky použijú.

Na pracovnej ploche existujú dva typy miniaplikácií – miniaplikácie iframe a webové komponenty. Hlavička, navigácia (vlastná stránka), trvalá oblasť, bezhlavá oblasť a panel aux sú prispôsobiteľnou oblasťou na pracovnej ploche. Toto nie sú widgety.

Nasledujúci zoznam podrobne popisuje priestory, ktoré môžete nakonfigurovať. Obrázky ilustrujú rozloženie pracovnej plochy:

  1. Oblasť názvu a loga: V tomto priestore sa v ľavom hornom rohu obrazovky zobrazuje logo a názov Webex Contact Center (predvolené nastavenie).

  2. Vodorovná oblasť hlavičky : Tento priestor má konfigurovateľnú oblasť, ktorá je vyplnená vlastnými widgetmi. Tieto widgety môžu zobrazovať napríklad vnorené informácie a rozbaľovacie ponuky. Keďže výška tejto hlavičky je iba 64 pixelov, výška miniaplikácie nemôže prekročiť výšku hlavičky.

  3. Oblasť pracovného priestoru : Tento priestor sa mení podľa výberu na navigačnom paneli alebo keď agent komunikuje so zákazníkmi. Keď agent práve volá, v tejto oblasti sa zobrazí tabla ovládania interakcie a pomocné informácie (ktorá obsahuje vlastné widgety a trvalé widgety). Keď agent interaguje s e-mailom, konverzáciou alebo sociálnymi kanálmi, táto oblasť zobrazuje oblasť pracovného priestoru a tablu pomocných informácií (ktorá zahŕňa oblasť trvalých miniaplikácií).

    Vlastná stránka sa zobrazí v rozhraní pracovnej plochy na table pracovného priestoru. Prístup k vlastnej stránke môžete získať prostredníctvom ikon na navigačnom paneli. Každá vlastná stránka môže obsahovať jeden alebo viac vlastných widgetov.

    Vlastný widget je aplikácia tretej strany, ktorá je nakonfigurovaná v rozložení JSON. Vlastnú miniaplikáciu môžete umiestniť na vlastnú stránku, vlastnú Tab (tabla Pomocné informácie) alebo na vodorovnú hlavičku pracovnej plochy.

  4. Oblasť navigačného panela : Tento priestor použite na pridanie navigačných položiek na prístup k vlastným stránkam.

Sample Webex Contact Center Desktop user interface for voice, showing the areas that are customizable including page icons, page labels, page level widgets, tab icons, tab labels, table level widgets, logo, title, drag and drop/resize/maximize/minimize ability, header customization, and other header widgets.
Vzorové počítačové používateľské rozhranie pre hlasové služby
Sample Webex Contact Center Desktop user interface for new digital channels, showing the areas that are customizable including page icons, page labels, page level widgets, tab icons, tab labels, table level widgets, logo, title, drag and drop/resize/maximize/minimize ability, header customization, and other header widgets.
Vzorové používateľské rozhranie pracovnej plochy pre nové digitálne kanály

Vlastnosti najvyššej úrovne rozloženia formátu JSON

Roly

Predvolené rozloženie JSON má nasledujúce tri roly.

  • Agent – nastavenie rozloženia pracovnej plochy, ktoré sa má zobraziť, keď sa agent prihlási na pracovnú plochu Webex Contact Center na spracovanie aktivít agenta.

  • Supervízor – nastavenie rozloženia pracovnej plochy, ktoré sa má zobraziť, keď sa supervízor prihlási na pracovnú plochu Webex Contact Center tak, aby spracovával iba možnosti supervízora.

    Keď sa supervízor prihlási na pracovnú plochu, použije sa rozloženie pracovnej plochy, ktoré je určené pre primárny tím. Ak neposkytnete primárny tím, použije sa globálne rozloženie. V predvolenom nastavení sú hlásenia APS zakázané.

  • supervisorAgent – nastavenie rozloženia pracovnej plochy, ktoré sa má zobraziť, keď sa supervízor prihlási na pracovnú plochu Webex Contact Center, aby zvládol funkcie supervízora aj aktivity agenta.

Môžete buď pridať alebo upraviť miniaplikácie pre každú rolu v zodpovedajúcej osobe príslušného súboru rozloženia JSON.

Nasledujú vlastnosti najvyššej úrovne pre rozloženie JSON založené na roli:

{ "agent": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panel": { ... }, "navigácia": { ... }, "trvalé": { ... }, "bezhlavý": { ... } }, }, "supervízor": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panel": { ... }, "navigácia": { ... }, "trvalé": { ... }, "bezhlavý": { ... }, "domovská stránka": { ... } }, } "supervisorAgent": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panel": { ... }, "navigácia": { ... }, "trvalé": { ... }, "bezhlavý": { ... } }, } },
  • Zmeny vlastností rozloženia JSON sa prejavia pri obnovení prehľadávača na pracovnej ploche.
  • Ak funkcia, ktorú ste povolili v rozložení JSON, nie je k dispozícii na pracovnej ploche, obráťte sa na podporu Cisco a povoľte ju.
  • Vo všetkých vlastnostiach rozloženia JSON sa rozlišujú veľké a malé písmená.

appTitle

Zadajte názov v vodorovnej hlavičke pracovnej plochy. Predvolený názov je Webex Contact Center.

Príklad:

"appTitle": "Webex Contact Center"

Predvolená položka appTitle sa zmení z Contact Center Desktop na Webex Contact Center. Na existujúce vlastné rozloženia, ktoré používajú starú predvolenú aplikáciu appTitle (Contact Center Desktop), to nebude mať žiadny vplyv. Ak chcete použiť nový appTitle, musíte upraviť vlastné rozloženie. Nové globálne rozloženie však používa predvolený appTitle ako Webex Contact Center.

Názov môže byť text, obrázok alebo prázdny reťazec. Text názvu sa zobrazí v dvoch riadkoch. Ak text presahuje druhý riadok, zobrazí sa ikona troch bodiek a popis zobrazí celý názov. Štýly nie je možné použiť na názov.

Môžete použiť identifikátory URI údajov (Uniform Resource Identifier) alebo hosťovať vlastný titulný obrázok v sieti na doručovanie obsahu (CDN), segmente Amazon Web Services (AWS) Simple Storage Service (S3) alebo podobnej hostiteľskej službe a potom zadať adresu URL hosťovaného obrázka. Podporované formáty titulných obrázkov sú PNG, JPG, JPEG, GIF, SVG a WebP. Podporovaná veľkosť titulného obrázka je 184 x 32 pixelov (šírka x výška).

logo

Zadanie adresy URL pre logo spoločnosti. Ak adresu URL nezadáte, logo Webex Contact Center sa zobrazí predvolene.

Príklad:

"logo": "https://my-cdn.com/logo.png"

Môžete hosťovať vlastný obrázok loga v CDN, vedre Amazon Web Services (AWS) Simple Storage Service (S3) alebo podobnej hostiteľskej službe a potom určiť adresu URL hosťovaného obrázka. Podporované formáty obrázkov loga sú PNG, JPG, JPEG, GIF, SVG a WebP. Podporovaná veľkosť obrázka loga je 96 x 32 pixelov (šírka x výška).

Tabuľka 1. Matica zobrazenia pre appTitle a logo Na základe konfigurácie rozloženia pracovnej plochy
Podmienka Príklad appTitle logo
Ak appTitle a logo nie sú nakonfigurované 
"appTitle": "", "logo": "",
Bez názvu Predvolené logo
Ak sú nakonfigurované appTitle a logo 
"appTitle": "Spoločnosť ABC", "logo": "https://my-cdn.com/abclogo.png",
Konfigurovaný text Nakonfigurované logo
Ak je nakonfigurovaný appTitle a logo nie je nakonfigurované 
"appTitle": "Spoločnosť ABC", "logo": "",
Konfigurovaný text Predvolené logo

Ak appTitle nie je nakonfigurovaný a logo je nakonfigurované

 
"appTitle": "", "logo": "https://my-cdn.com/abclogo.png",
Bez názvu Nakonfigurované logo
Ak je nakonfigurované logo appTitle a logo nie je preferované 
"appTitle": "Spoločnosť ABC", "logo": "bez loga",
Konfigurovaný text Žiadne logo

Ak appTitle nie je nakonfigurovaný a logo nie je preferované

 
"appTitle": "", "logo": "bez loga",
Bez názvu Žiadne logo
Ak je appTitle pridaný ako obrázok a logo je nakonfigurované 
"appTitle": "https://my-cdn.com/abccompanylogo.png", "logo": "https://my-cdn.com/abclogo.png",
Nakonfigurovaný obrázok Nakonfigurované logo

Ak je appTitle pridaný ako obrázok a logo nie je nakonfigurované

 
"appTitle": "https://my-cdn.com/abccompanylogo.png", "logo": "",
Nakonfigurovaný obrázok Predvolené logo

Ak je appTitle pridaný ako obrázok a logo nie je preferované 

"appTitle": "https://my-cdn.com/abccompanylogo.png", "logo": "bez loga",
Nakonfigurovaný obrázok Žiadne logo
  • Vlastná veľkosť obrázka sa upraví na základe pomeru strán. Text vlastného názvu, ktorý ste nakonfigurovali skôr, sa teraz môže zobraziť v dvoch riadkoch na pracovnej ploche. Ak sa tomu chcete vyhnúť, môžete upraviť vlastný text názvu.
  • Ak názov a logo nie sú nakonfigurované vo vodorovnej hlavičke pracovnej plochy, miniaplikácie hlavičky zaberajú toto miesto. Widgety hlavičky musia byť správne nakonfigurované tak, aby používali priestor názvu a loga.
  • Názov a logo spolu nesmú prekročiť maximálnu šírku 304 pixelov (vrátane odsadenia). Ak je šírka loga menšia ako 96 pixelov, pre názov sa môže použiť zostávajúca šírka.
  • Ak je vlastná veľkosť obrázka vyššia ako podporovaná veľkosť, veľkosť obrázka sa upraví na základe pomeru strán v vodorovnej hlavičke. Ak je vlastná veľkosť obrázka menšia ako podporovaná veľkosť, skutočná veľkosť obrázka sa zachová v vodorovnej hlavičke.

taskPageIllustration

Ak chcete zadať vlastnú ilustráciu pre stránku úlohy na základe predvolieb organizácie a zarovnania značky. Keď sa agent prihlási, na stránke úlohy sa ako pozadie zobrazí nakonfigurovaná ilustrácia. V predvolenom nastavení sa stránka úlohy zobrazuje bez ilustrácie.

Príklad:

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

Môžete použiť dátové URI alebo hosťovať vlastnú ilustráciu v sieti na doručovanie obsahu (CDN), segmente Amazon Web Services (AWS) Simple Storage Service (S3) alebo podobnej hostiteľskej službe a potom zadať adresu URL hosťovanej ilustrácie. Ilustráciu je možné nakonfigurovať na globálnej alebo tímovej úrovni na základe definície rozloženia. Uistite sa, že ste nakonfigurovali správnu adresu URL, aby ste zabránili zobrazeniu nefunkčného obrázka na pracovnej ploche.

Podporované formáty ilustrácií stránky úloh sú PNG, JPG, JPEG, GIF, SVG a WebP. Odporúčaná veľkosť ilustrácie je 400 x 400 pixelov (šírka x výška). Ak je veľkosť vlastnej ilustrácie väčšia ako odporúčaná veľkosť, veľkosť ilustrácie sa upraví na základe pomeru strán na stránke úlohy. Ak je vlastná veľkosť ilustrácie menšia ako odporúčaná veľkosť, skutočná veľkosť ilustrácie sa zachová na stránke úlohy.

Webex Contact Center interface example of a custom illustration retraining the actual size.
Ukážkový príklad vlastnej ilustrácie so zachovaním skutočnej veľkosti
Webex Contact Center interface example of a custom illustration adjusted based on the aspect ratio.
Ukážkový príklad vlastnej ilustrácie upravenej na základe pomeru strán

stopNavigateOnAcceptTask

Určiť, či presunúť zameranie na novo prijatú úlohu, keď agent prijme novú úlohu počas práce na predchádzajúcej úlohe. Predvolená hodnota je nepravda.

Príklad:

"stopNavigateOnAcceptTask": false

Ak je hodnota nastavená ako true, keď používateľ prijme novú úlohu na pracovnej ploche, zameranie sa zachová na predchádzajúcu úlohu a nepresunie sa na novo prijatú úlohu. Toto nastavenie zabraňuje používateľovi stratiť akékoľvek údaje pri prijatí novej žiadosti.

Zvážte napríklad, že agent 1 je na chate so zákazníkom 1 a súčasne na hlasovom hovore so zákazníkom 2. Počas hlasového hovoru agent 1 aktualizuje podrobnosti o zákazníkovi 2 na paneli Interaction Control. V súčasnosti má Agent 1 dve aktívne úlohy na table Zoznam úloh a zameranie je na table Riadenie interakcie. Keď agent 1 prijme novú žiadosť o chat od Zákazníka 3, zameranie zostane na paneli Interaction Control so Zákazníkom 2 a nepresunie sa na novo prijatú žiadosť o chat.

Ak chcete zachovať zameranie na predchádzajúcu úlohu a neprechádzať na novo prijatú úlohu, vyberte vlastné rozloženie s hodnotou vlastnosti stopNavigateOnAcceptTask nastavenou na hodnotu true.

Ak hodnota vlastnosti stopNavigateOnAcceptTask nie je zadaná v rozložení JSON, pracovná plocha presunie pozornosť na novo prijatú úlohu. Správanie je podobné, ako keď je hodnota vlastnosti stopNavigateOnAcceptTask nastavená na hodnotu nepravda.

  • Toto nastavenie sa vzťahuje na všetky úlohy (hlasové a digitálne kanály) vykonávané na pracovnej ploche, ako je napríklad prijatie úlohy, konferencia, konzultácia alebo prepojenie, a na odchádzajúce hovory, odchádzajúce hovory kampane, automatické zalomenie atď.
  • Toto nastavenie sa neuplatňuje, ak sa používateľ pracovnej plochy nachádza na stránke Home a na table Zoznam úloh nie je aktívna žiadna úloha. V takom prípade, keď je nová úloha prijatá, zameranie sa presunie zo stránky Home na novo prijatú úlohu.

dragDropEnabled

Ak chcete povoliť presúvanie a zmenu veľkosti miniaplikácií na vlastných stránkach, nastavte hodnotu na hodnotu true. Predvolená hodnota je nepravda.

Príklad:

"dragDropEnabled": false

Ďalšie informácie o zapnutí funkcie presúvania myšou pre karty na table Pomocné informácie nájdete v časti Pomocná informačná tabla.

Časovač upozornení

Nastavte trvanie (v sekundách), po uplynutí ktorého sa oznámenia na pracovnej ploche automaticky zrušia. Oznámenie sa zobrazí v pravom hornom rohu pracovnej plochy. Predvolená hodnota časového limitu je 8 sekúnd. Platný rozsah hodnôt časového limitu je 1 až 10 sekúnd. Aby sa zmeny časového limitu prejavili, musí sa prehliadač po vykonaní zmien obnoviť.

Príklad:

"notTimer": 8

maximumNotificationCount

Počet oznámení na pracovnej ploche sa má naraz zobraziť na pracovnej ploche. Predvolená hodnota je 3. Rozsah oznámení na ploche je 1-10. Oznámenia na ploche sú naskladané. Ak existuje veľa upozornení, zobrazia sa s miernym oneskorením v závislosti od nastavení notifikácieTimer .

Príklad:

"maximumNotificationCount": 3

prehliadačNotTimer

Nastavenie trvania (v sekundách), po uplynutí ktorého sa upozornenia hriankovača prehliadača na pracovnej ploche automaticky zrušia. Hriankovač je natívne upozornenie prehliadača, ktoré sa zobrazuje iba vtedy, ak pracovná plocha nie je aktívnym oknom prehliadača alebo Tab. Okno prehliadača na pracovnej ploche alebo Tab je neaktívne, keď

  • pracujete na iných oknách prehliadača alebo kartách,

  • pracujete s inými aplikáciami,

  • Minimalizovali ste okno prehliadača na pracovnej ploche.

Oznámenie sa zobrazí v pravom hornom rohu pracovnej plochy. Predvolená hodnota časového limitu je 8 sekúnd. Odporúčaný rozsah hodnôt časového limitu je 5-15 sekúnd. Aby sa zmeny časového limitu prejavili, musí sa prehliadač po vykonaní zmien obnoviť.

Príklad:

"browserNotificationTimer": 8

Nakonfigurovaný časový limit pre oznámenia prehliadača závisí od operačného systému a nastavení prehliadača. Hodnota časového limitu sa dodržiava v prehliadači Chrome cez OS Windows, Chrome OS a macOS. Ostatné podporované prehliadače však nerešpektujú nakonfigurovanú hodnotu časového limitu upozornenia.

wxmNakonfigurované

(Voliteľné) Ak chcete nakonfigurovať Webex Experience Management, nastavte hodnotu na hodnotu true. Predvolená hodnota je nepravda.

Príklad:

"wxmConfigured": true

desktopChatApp

Umožňuje nakonfigurovať viacero chatovacích aplikácií ponúkaných spoločnosťou Cisco, napríklad Webex App.

webexNakonfigurované

Aplikáciu Webex spolu s funkciami odosielania správ a schôdzí je možné konfigurovať na pracovnej ploche. Táto konfigurácia umožňuje agentom spolupracovať s inými agentmi, supervízormi a odborníkmi na danú problematiku (MSP) v ich organizácii bez toho, aby museli opustiť pracovnú plochu.

  • Správca lokality spravuje používateľov aplikácie Webex Meeting a priraďuje oprávnenia iba vtedy, ak majú používatelia Webex Enterprise Edition. Ďalšie informácie nájdete v téme Správa Webex Meetings používateľov v Cisco Webex Control Hub.
  • Supervízori a malé a stredné podniky si musia stiahnuť klienta Webex do svojho systému (osobné zariadenie) alebo otvoriť aplikáciu Webex pomocou aplikácie Webex pre web ( https://web.webex.com/). Ďalšie informácie nájdete v časti Stiahnutie aplikácie.
  • V rámci Agent Desktop môžete pristupovať k aplikácii Webex a spolupracovať s inými agentmi, supervízormi a odborníkmi na danú problematiku (MSP) vašej organizácie bez toho, aby ste sa vzdialili od Agent Desktop. Funkcia ovládania hovorov nie je k dispozícii. Ak chcete prijímať a uskutočňovať hovory, potrebujete externú, nevloženú aplikáciu Webex. Viac informácií nájdete v časti Aplikácie pre hovory.

Ak chcete nakonfigurovať aplikáciu Webex na pracovnej ploche:

  • V Cisco Webex Control Hub pri pridávaní služieb pre používateľa začiarknite políčko Rozšírené správy (Používatelia > Správa používateľov > Služby > Správy). Ďalšie informácie nájdete v téme Správa používateľských kont v Cisco Webex Site Administration.

  • Vo vlastnom rozložení pracovnej plochy nastavte hodnotu vlastnosti webexConfigured na hodnotu true.

    Príklad:

    "desktopChatApp": { "webexConfigured": true },

    Predvolená hodnota vlastnosti webexConfigured je nepravda.

    Aplikácia Webex je k dispozícii pre roly agenta, supervízora a supervízoraAgenta iba vtedy, ak pre každú z týchto rolí nastavíte hodnotu vlastnosti webexConfigured na hodnotu true . Agent, supervízor alebo supervízorAgent sa nemôže odhlásiť z aplikácie Webex.

    Ak chcete zobraziť Ikona Webex (Webex) v vodorovnej hlavičke pracovnej plochy zadajte hodnotu Webex do vlastnosti headerActions . Ďalšie informácie nájdete v téme Akcie hlavičky.

    Ak chcete povoliť aplikáciu Webex pre konkrétny tím, vyberte vlastné rozloženie s hodnotou vlastnosti webexConfigured nastavenou na true. Viac informácií nájdete v časti Vytvorenie tímu .

Aplikáciu Webex môžete nakonfigurovať aj v paneli Pomocné informácie, na vlastnej stránke a vo vlastnom widgete. Viac informácií nájdete v časti Tabla pomocných informácií.

Webex Upozornenie aplikácie

Hodnoty, ktoré sú zadané pomocou vlastností notificationTimer a browserNotificationTimer pre časovač upozornení, platia pre aplikáciu Webex. Predvolená hodnota časového limitu pre tieto vlastnosti je 8 sekúnd. Viac informácií nájdete v častiach notificationTimer a browserNotificationTimer.

Akcie v hlavičke

Zmena poradia ikon v horizontálnej hlavičke pracovnej plochy. Predvolené poradie je nasledovné:

  1. Ikona Webex (Webex)

  2. Použiť telefón pre zvukový indikátor (Volanenie von)

  3. Ikona upozornenia. (Centrum upozornení)

Nastavte hodnotu vlastnosti headerActions nasledovne:

Názov ikony

Hodnota vlastnosti headerActions

Aplikácia Webex

Webex

Hovor s vytáčaním

vytočiť

Centrum oznámení

notifikácia

Príklad:

„headerActions“: [„Webex“, „vytočenie čísla“, „upozornenie“],

Hodnota vlastnosti headerActions rozlišuje veľké a malé písmená.

Ak chcete zmeniť predvolené poradie ikon, zadajte vlastnosť headerActions a príslušné hodnoty vo vlastnom rozložení.

Príklad:

„headerActions“: [„oznámenie“, „vytočenie čísla“, „Webex“],
  • Ak nezadáte vlastnosť a hodnoty headerActions v vlastnom rozložení, ikony sa zobrazia v predvolenom poradí.
  • Ak chcete z pracovnej plochy odstrániť ikony hlavičky a súvisiace funkcie, nastavte pre vlastnosť headerActions prázdnu hodnotu ("headerActions": []). Ak ste však pridali aplikáciu Webex do panela Pomocné informácie alebo na vlastnú stránku, prípadne ako vlastný widget, agent má stále prístup k aplikácii Webex, hoci aplikácia Webex nie je dostupná v horizontálnej hlavičke pracovnej plochy.
  • Ak je hodnota vlastnosti webexConfigured nastavená na false, ikona aplikácie Webex sa nezobrazí v horizontálnej hlavičke pracovnej plochy, a to ani v prípade, že je hodnota Webex pridaná do vlastnosti headerActions . Viac informácií nájdete v časti webexConfigured.

oblasť

Vlastnosť **area** je jadrom rozloženia na pracovnej ploche. Rozloženie môžete definovať podľa oblasti. 

"oblasť": { "hlavička": { ... }, "advancedHeader: { { "comp": "widget-1", "attributes": { ... }, "skript": .... } }, "panel": { ... }, "navigácia": { ... }, „trvalý“: { ... }, „bez hlavy“: { ... } },

Môžete nakonfigurovať nasledujúce objekty oblasti :

  • Panel: Predstavuje druhý panel alebo panel úplne vpravo v table Pomocné informácie.

  • Navigácia: Predstavuje vlastné stránky a ich navigačné prvky, ktoré súvisia so stránkami.

  • Trvalé: Predstavuje widgety na úrovni stránky, ktoré sú trvalé a zobrazujú sa na všetkých stránkach pracovnej plochy.

  • Bezhlavý: Predstavuje widgety, ktoré nemajú vizuálne rozhranie, ale vykonávajú logiku na pozadí.

Ak je nakonfigurovaná vlastnosť advancedHeader, vlastnosti header a headerActions musia byť odstránené.

pokročilá hlavička

Prispôsobenie viditeľnosti a zmena poradia ikon v horizontálnej hlavičke pracovnej plochy. Predvolené poradie je nasledovné:

  1. Ikona Webex (Webex)

  2. Použiť telefón pre zvukový indikátor (Volanenie von)

  3. Ikona upozornenia. (Centrum upozornení)

  4. Webex Contact Center Selektor stavu agenta. (Výber stavu agenta)

Nastavte hodnotu vlastnosti advancedHeader nasledovne:

Názov ikony

Hodnota vlastnosti headerActions

Aplikácia Webex

agentx-webex

Hovor s vytáčaním

agentx-outdial

Centrum oznámení

Oznámenie agentx

Výber stavu agenta

selektor-stavu-agentx

Príklad:

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

Hodnota vlastnosti advancedHeader rozlišuje veľké a malé písmená.

Ak chcete zmeniť predvolené poradie ikon, zadajte vlastnosť advancedHeader a príslušné hodnoty vo vlastnom rozložení.

Widgety sa zobrazujú v rozbaľovacej ponuke zľava doprava.

  • Ak vo vlastnom rozložení nezadáte vlastnosť advancedHeader , zobrazí sa predvolená hlavička.

  • Keď je povolená rozšírená hlavička, mali by ste presunúť widgety z existujúcej hlavičky do rozšírenej hlavičky podľa príkladu.

  • Keď je povolená rozšírená hlavička, stará hlavička sa nezobrazí.

  • Každá ikona widgetu má predvolené odsadenie a okraj, ktoré sú definované pomocou CSS a nemožno ich prispôsobiť prostredníctvom desktopu.

  • Umiestnenie loga, názvu a ikon profilu je pevné a nemožno ho prispôsobiť.

  • Ak chcete z pracovnej plochy odstrániť ikony hlavičky a súvisiace funkcie, nastavte pre príslušný komponent prázdnu hodnotu. pokročilá hlavička nehnuteľnosť ( „rozšírená hlavička“: []).

    Ak ste pridali aplikáciu Webex do panela Pomocné informácie alebo na vlastnú stránku, prípadne ako vlastný widget, agent má stále prístup k aplikácii Webex, hoci aplikácia Webex nie je dostupná v horizontálnej hlavičke pracovnej plochy.

  • Ak pridáte widget s dlhým popisom, zobrazí sa skrátený názov popisu podľa dostupného miesta.

    Môžete použiť atribút textObsah pridať štítok k widgetu.

    Príklad:

    { "comp": "timer-widget", "attributes": { "duration": "08:00:00" }, "textContent": "Odpočítavací časovač pre aktuálnu smenu", "script": "https://wxcc-demo.s3.amazonaws.com/widgets/timer-widget.js" }

    Označenie „Odpočítavanie času pre aktuálnu smenu“ bude skrátené a zobrazené podľa dostupného miesta.

    • Vyhnite sa pridávaniu widgetov s dlhým popisom.

    • Keď sa miniaplikácia presunie do rozbaľovacej ponuky, kliknúť sa dá iba na ikonu miniaplikácie.

  • Ak webexConfigured hodnota nehnuteľnosti je nastavená ako nepravdivé, ten Aplikácia Webex ikona sa nezobrazuje v horizontálnej hlavičke pracovnej plochy, aj keď Webex hodnota sa pridáva v pokročilá hlavička majetok. Viac informácií nájdete webexConfigured.

Home Stránka

Po prihlásení na pracovnú plochu sa dostanete na stránku Home.

Stránka Home sa vzťahuje iba na supervízorov a personu SupervisorAgent.

Na stránke Home si môžete pozrieť nasledujúce widgety. Widgety analyzátora sú poskytované štandardne, ale správca môže nakonfigurovať aj trvalé a vlastné widgety. Viac informácií nájdete v časti Vlastnosti najvyššej úrovne rozloženia JSON.

Widgety analyzátora

Widget Analyzátor sa predvolene zobrazuje na stránke pracovnej plochy Home.

Home Konfigurácia rozloženia stránky

Stránku Home na pracovnej ploche môžete nakonfigurovať tak, aby zobrazovala rozloženie založené na preferenciách vašej organizácie a zameraní na značku. Upravte pole Domovská stránka a nakonfigurujte stránku Home. Nasledujúce komponenty môžete nakonfigurovať tak, aby sa zobrazovali na stránke Home po prihlásení používateľa na pracovnú plochu:

  • Uvítacia správa

  • Ikona Úloha na navigačnom paneli slúži na prechod na tablu úloh. Ikona úlohy sa zobrazuje pre rolu Supervízor a Supervízor a agent s povolenou funkciou monitorovania hovorov. Panel úloh zobrazuje prichádzajúce požiadavky zákazníkov, aktívne a minulé interakcie so zákazníkmi a aktívne požiadavky na monitorovanie.

  • Filtrujte sekcie ako napríklad Názov frontu, Typ kanála a Spravované tímy.

Nasledujúca tabuľka popisuje vlastnosti stránky, ktoré sú potrebné na konfiguráciu stránky Home:

Tabuľka 2. Dynamické rozloženie stránky Home – vlastnosti stránky

Nehnuteľnosť

Popis a kód

Stránka > použitieFlexLayout

Flexibilné rozloženie je nový webový komponent. Nemení existujúce widgety. Nové flexibilné rozloženie používa rovnaký formát konfigurácie rozloženia zjednodušeným spôsobom. Je spätne kompatibilný a nemá vplyv na existujúce widgety. Musíte nakonfigurovať rozloženie JSON. Ak chcete nakonfigurovať rozloženie JSON, zadajte výšku a šírku widgetu. Widget sa vykresľuje v rovnakom poradí, v akom je nakonfigurovaný v rámci rozloženia JSON. Widgety majú predvolený okraj 8 px.

Rozloženie JSON je založené na rozmeroch (šírka x výška) a súradniciach (X, Y a Z) widgetov.

Flexibilné rozloženie podporuje funkcie, ako je zmena veľkosti jednotlivých widgetov, maximalizácia widgetov atď.

Výška jednotlivých widgetov sa meria v pixeloch. 1 jednotka výšky = 40 pixelov. Šírka widgetu závisí od počtu stĺpcov v kontajneri a počtu stĺpcov, ktoré sa menia na základe šírky kontajnera.

Widgety sa zobrazujú zľava doprava. Pokročilý nástroj na rozloženie používa vlastnú logiku na úpravu horizontálneho aj vertikálneho priestoru widgetov. Spočiatku sa rozloženie načíta horizontálne. Po horizontálnom načítaní sa widget načíta vertikálne a zabezpečí optimálne využitie priestoru.

Nakonfigurujte widgety podľa veľkosti obrazovky. Šírku widgetov môžete zväčšiť alebo zmenšiť v závislosti od veľkosti obrazovky. Vďaka tomu sú widgety čitateľnejšie a použiteľnejšie.

Flexibilné rozloženie poskytuje štandardné body prerušenia, ako napríklad veľké, stredné, malé a extra malé.

  • Veľké widgety majú rozlíšenie 1360 px alebo viac. Pre veľké widgety zadajte hodnotu stĺpca ako 12.

  • Stredné widgety majú rozlíšenie 1070 px až 1360 px. Pre stredné widgety zadajte hodnotu stĺpca ako 10.

  • Malé widgety majú rozlíšenie od 850 px do 1070 px. Pre malé widgety zadajte hodnotu stĺpca ako 6.

  • Extra malé widgety majú rozlíšenie 500 px. Pre extra malé widgety zadajte hodnotu stĺpca ako 4.

Tieto pixely sa môžu líšiť v závislosti od operačného systému a prehliadača.

"stránka": { "id": "landing", "useFlexLayout": true, "widgety": { "comp1": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 1", "attributes": { "style": "width: max-content; margin: 80px 240px; color: white;" } }, "comp2": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 2", "attributes": { "style": "width: max-content; margin: 80px 240px;color: white;" } } }

Stránka > porovnanie

Uistite sa, že poskytujete jedinečný vlastný komponent.

"comp": "názov stránky",

Komponent page-title predstavuje nadpis úrovne 2 <h2> vlastného HTML elementu.

Stránka > hlavička stránky

Uistite sa, že zadáte reťazec názvu, ktorý môže byť statický, dynamický alebo oboje.

Komponent page-title predstavuje nadpis úrovne 2 <h2> vo vlastnom HTML elemente.

  • Statický reťazec: Napríklad Ahoj, vitaj!

    "comp": "názov stránky", "attributes": { "pageTitle": "Ahoj, vitaj!" }

  • Dynamický reťazec: Na načítanie hodnoty z ÚLOŽISKA. Napríklad Jana Nováková.

    "comp": "názov stránky", "attributes": { "pageTitle": "$STORE.agent.agentName" }

  • Oba: Kombinácia statických a dynamických reťazcov. Napríklad, Ahoj Jana Nováková, vitaj!

    "comp": "názov stránky", "attributes": { "pageTitle": "Ahoj {$STORE.agent.agentName}, vitaj!" }

    Dynamickú časť reťazca musíte uzavrieť do uzavretých zložených zátvoriek {} a pred ňou uviesť štruktúru $.

Stránka > podhlavička stránky

Nezabudnite pridať podhlavičku, ktorá sa zobrazí na pracovnej ploche. Používateľ môže pridať Prejsť na analyzátor v podnadpise.

  • Blok kódu pre podhlavičku

    "useFlexLayout": true, "pageSubHeader": { "comp": "div", "attributes": { "style": "display: flex; float:right;margin:16px 0px 16px 16px" }, "children": [ { "comp": "div", "children": [ { "comp": "md-label", "textContent": "$I18N.pageSubHeader.queueName", "attributes": { "style": "margin-bottom:8px;" }

  • Blok kódu pre Prejsť na analyzátor v podhlavičke

    { "comp": "div", "children": [ { "comp": "agentx-more-actions-wrapper", "properties": { "actionList": [ { "comp": "agentx-wc-goto-analyzer" } ] } }

Navigácia (vlastné stránky)

V tejto sekcii môžete pridať stránky, ktoré sa zobrazia na ľavom navigačnom paneli. Zadáte ikonu navigácie a jedinečnú URL adresu, ktorá sa má zobraziť v navigačnom paneli. Odporúčame použiť pre URL adresu špecifickú predponu, aby sa predišlo konfliktom. Viac informácií nájdete v navigačná vlastnosť sekcia.

Na tejto stránke môžete mať aj kolekciu widgetov, ktoré sa môžu zobraziť. Stránka môže mať jeden widget, ktorý sa zobrazuje na obrazovke, alebo kolekciu widgetov v mriežke. Viac informácií o usporiadaní mriežky nájdete v vlastnosť rozloženia sekcia.

Do stromu widgetov nemusíte pridávať obal dynamickej oblasti. To znamená, že po povolení tejto možnosti môžete na vlastných stránkach presúvať a meniť ich veľkosť.

Príklad: 

{ "nav": { "label": "Vlastná stránka", "icon": "uložené-info", "iconType": "momentumDesign", "navigateTo": "dynamic-tabs", "align": "top", "isDefaultLandingPage": true }, "page": { "id": "moja - vlastná - stránka", "useFlexLayout": true, "widgety": { " comp1": { "comp": "md-tabs", "children": [{ "comp": "md-tab", "textContent": "Časovač posunu", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "attributes": { "slot": "panel" }, "children": [{ "comp": "md - vlastný - časovač", "source": http: //my-cdn.com/my-custom-timer.js "wrapper": { "title": "Časovač posunu", "maximizeAreaName": "app-maximize-area" } }] }, { "comp": "md-tab", "textContent": "Akciový trh", "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": "Akciový trh", "maximizeAreaName": "app-maximize-area" } }], }, { "comp": "md-tab", "textContent": "Widget3", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Tri typy obsahu", "attributes": { "slot": "panel" } } ] }, "comp2": { "comp": "moja komponenta - google - mapy", "source": "https://my-cdn.com/my-google.maps.js "wrapper": { "title": "Mapa Google", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["left", "right"] ], "size": { "cols": [1, 1], "rows": [1] } } } },

Nasledujúca tabuľka popisuje navigácia a stránka vlastnosti spolu s ich podradenými vlastnosťami:

Tabuľka 3. Podrobnosti o nehnuteľnosti

Nehnuteľnosť

Popis a kód

nav > označenie

Táto vlastnosť označuje identifikátor navigácie na stránke. Čítačka obrazovky prečíta túto vlastnosť a zobrazí sa v popise.

Tieto parametre sú potrebné na zobrazenie vašej vlastnej stránky na navigačnom paneli. 

typ Navigácia.Položka = { label: string; iconType: "momentumDesign" | "iné"; icon: string; zarovnanie: "hore" | "dole"; navigovaťNa: string; veľkosť ikony? : číslo; jeResponzívny? Boolovská hodnota; };

Vlastnosť **label** je názov vlastnej stránky.

nav > ikonaTyp

Táto vlastnosť predstavuje typ ikony, ktorá sa zobrazuje v navigačnom paneli pre vlastnú stránku.

K dispozícii sú nasledujúce typy ikon:

  • momentumDesign: Môžete si vybrať ľubovoľné dostupné ikony v kolekcii: https://momentum-design.github.io/momentum-design/en/tokens/icons/. Výhodou používania Momentum je, že poskytuje niekoľko ikon s „aktívnou“ verziou.

    Prípad použitia aktívnej verzie:

    Napríklad, ak si vyberiete typ ikony Hybnosť oznámenie, na navigačnom paneli uvidíte predvolenú ikonu. Keď prejdete na vlastnú stránku (prepojenú s ikonou), ikona sa zmení na Oznámenie aktívne Verzia automaticky. Uistite sa, že overíte, či má aktívny Verziu tej istej ikony v knižnici ikon.

  • Iné: Môžete zadať vlastnú URL adresu obrázka (hostovanú na CDN), ktorá sa zobrazí na navigačnom paneli. Ak používate čiernu alebo bielu vlastnú ikonu, ikona sa nezobrazí pri prepínaní medzi svetlým a tmavým režimom.

ikona navigácie

Táto vlastnosť predstavuje názov ikony v knižnici Momentum alebo URL adresu CDN.

type Navigation.Item ={ ikona:"oznámenie"; }; // ALEBO // type Navigation.Item ={ ikona:"https://my-cdn.com /my-navigation-icon.png"; };

zarovnanie navigácie

Táto vlastnosť vám pomôže zarovnať ikonu s hornou alebo dolnou časťou navigačného panela.

V súčasnosti nehnuteľnosť umožňuje iba zarovnanie zhora.

nav > jePredvolenáCestnáStránka

Táto vlastnosť určuje predvolenú vstupnú stránku pre agentov v Agent Desktop. Nastavte túto vlastnosť na hodnotu true , ak chcete, aby sa stránka navigačného panela zobrazovala agentom po prihlásení do Agent Desktop ako predvolená vstupná stránka. Ak má viacero stránok navigačného panela túto vlastnosť nastavenú na hodnotu true, systém považuje prvú stránku navigačného panela za predvolenú vstupnú stránku.

Ak žiadna stránka navigačného panela nemá túto vlastnosť nastavenú na hodnotu true, stránka Home bude fungovať ako predvolená vstupná stránka.

Prehľady štatistík výkonnosti agentov nie je možné nastaviť ako predvolenú vstupnú stránku.

nav > navigovaťDo

Táto vlastnosť určuje názov vlastnej stránky. Toto meno sa zobrazí v paneli s adresou, keď agent prechádza cez navigáciu.

navigateTo nesmie obsahovať nasledujúce hodnoty: images, fonts, css, build_info, help, app, i18n, icons, images-mfe-wc a sounds.

type Navigation.Item = { navigateTo: "moja - vlastná - stránka"; };
Tabuľka 4. Podrobnosti o vlastnostiach na stránke

Nehnuteľnosť

Popis a kód

ID stránky >

Prichádzajúce hovory stránka Vlastnosť, zadáte objekt vlastnej stránky (dynamický widget).

Zariadenie identifikátor Vlastnosť predstavuje jedinečný identifikátor stránky. Napríklad moja-vlastná-stránka-1. Agent tento identifikátor na ploche nevidí.

typ DynamicWidgets.Page = { id: string; widgety: Záznam <string, DynamicWidget.Options>; rozloženie: Rozloženie; };

stránka > pouseFlexLayout

Flexibilné rozloženie je nový webový komponent. Nemení existujúce widgety. Nové flexibilné rozloženie používa rovnaký formát konfigurácie rozloženia zjednodušeným spôsobom. Je spätne kompatibilný a nemá vplyv na existujúce widgety. Musíte nakonfigurovať rozloženie JSON. Ak chcete nakonfigurovať rozloženie JSON, zadajte výšku a šírku widgetu. Widget sa vykresľuje v rovnakom poradí, v akom je nakonfigurovaný v rámci rozloženia JSON. Widgety majú predvolený okraj 8 px.

Rozloženie JSON je založené na rozmeroch (šírka x výška) a súradniciach (X, Y a Z) widgetov.

Flexibilné rozloženie podporuje funkcie, ako je zmena veľkosti jednotlivých widgetov, maximalizácia widgetov atď.

Výška jednotlivých widgetov sa meria v pixeloch. 1 jednotka výšky = 40 pixelov. Šírka widgetu závisí od počtu stĺpcov v kontajneri a počtu stĺpcov, ktoré sa menia na základe šírky kontajnera.

Widgety sa zobrazujú zľava doprava. Pokročilý nástroj na rozloženie používa vlastnú logiku na úpravu horizontálneho aj vertikálneho priestoru widgetov. Spočiatku sa rozloženie načíta horizontálne. Po horizontálnom načítaní sa widget načíta vertikálne a zabezpečí optimálne využitie priestoru.

Nakonfigurujte widgety podľa veľkosti obrazovky. Šírku widgetov môžete zväčšiť alebo zmenšiť v závislosti od veľkosti obrazovky. Vďaka tomu sú widgety čitateľnejšie a použiteľnejšie.

Flexibilné rozloženie poskytuje štandardné body zlomu, ako napríklad veľké, stredné, malé a extra malé.

  • Veľké widgety majú rozlíšenie 1360 px alebo viac. Pre veľké widgety zadajte hodnotu stĺpca ako 12.

  • Stredné widgety majú rozlíšenie 1070 px až 1360 px. Pre stredné widgety zadajte hodnotu stĺpca ako 10.

  • Malé widgety majú rozlíšenie od 850 px do 1070 px. Pre malé widgety zadajte hodnotu stĺpca ako 6.

  • Extra malé widgety majú rozlíšenie 500 px. Pre extra malé widgety zadajte hodnotu stĺpca ako 4.

Tieto pixely sa môžu líšiť v závislosti od operačného systému a prehliadača.

"stránka": { "id": "landing", "useFlexLayout": true, "widgety": { "comp1": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 1", "attributes": { "style": "width: max-content; margin: 80px 240px; color: white;" } }, "comp2": { "comp": "div", "width": 4, "height": 4, "textContent": "Widget 2", "attributes": { "style": "width: max-content; margin: 80px 240px;color: white;" } } }

stránka > widgety

stránka > komp

Pomáha vám definovať vaše vlastné widgety. Ak chcete umiestniť viacero widgetov, zadajte postupne možnosti widgetov. Uistite sa, že každému widgetu priradíte jedinečný názov oblasti. Použite ho neskôr v sekcii rozloženia.

"widgety": { "comp1": { ... } "comp2": { ... } }

Táto vlastnosť predstavuje názov vlastného HTML elementu (známeho ako webový komponent alebo akýkoľvek iný element – ak ho chcete použiť ako obal). Viac informácií nájdete Príklady prípadov použitia. Sem zadajte názov vlastného prvku bez hranatých zátvoriek („<“ alebo „>“). Napríklad „môj-vlastný-prvok“.

Každá položka v sekcii widgetov podporuje nasledujúci formát:

typ Možnosti = { comp: reťazec; skript? : reťazec; vlastnosti? Záznam <reťazec, ľubovoľný> ; atribúty? Záznam <reťazec, reťazec> ; deti? : Možnosti[]; textObsah? : reťazec; štýl? Čiastočný <CSSStyleDeclaration> ; obal? : { názov: reťazec; maximizeAreaName: reťazec; }; };

stránka > skript

(Voliteľné) Táto vlastnosť je povinná iba vtedy, keď načítate widget alebo komponent zo vzdialeného umiestnenia, ako je napríklad CDN. 

"comp1": { "comp": "widget-one", "script": "http:/my-cdn.com / dynamické - widgety / widget - one.js ", }

Nemeňte URL adresu skriptu pre ten istý komponent. Ak potrebujete zmeniť URL adresu skriptu pre ten istý komponent, vykonajte jeden z nasledujúcich krokov:

  • Upozornite agenta, aby vymazal vyrovnávaciu pamäť prehliadača a znova načítal súbor Agent Desktop.

  • Ponechajte existujúcu URL adresu. Dynamicky importujte novú URL adresu balíka pomocou javascriptu hostovaného v existujúcej URL adrese.

    Príklad:

    (function() { var script = document.createElement("script"); script.src = <URL vašej JS skriptu> script.type = "text/javascript"; script.async = true; document.getElementsByTagName ("head").item(0).appendchild(script); } ) ()

vlastnosti stránky >

Môžete určiť vlastnosti, ktoré musíte odovzdať pre webový komponent. 

"vlastnosti": { "používateľ": "admin", },

stránka > responzívna

Určuje, či je webový komponent alebo widget založený na iFrame, ktorý je pridaný do vlastného rozloženia na úrovni stránky alebo kompozície, responzívny. Responzívne webové komponenty robia vašu webovú stránku vizuálne príťažlivou na všetkých zariadeniach a sú ľahko použiteľné. Musíte používať responzívne widgety iFrame.

Nakonfigurujte túto vlastnosť s jednou z nasledujúcich hodnôt:

  • True: Povolí responzívnosť widgetu. V predvolenom nastavení sú všetky widgety responzívne na základe progresívnych veľkostí obrazovky, orientácie a oblastí zobrazenia používaného zariadenia.

  • False: Zakáže responzívnosť widgetu. Ak widgety nepodporujú zobrazenie na rôznych zariadeniach, označte ich ako neresponzívne.

{ "comp": "md-tab", "responzívny": true, "attributes": { "slot": "Tab", "trieda": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP_TAB" } }], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "responzívny": false, "attributes": { "slot": "panel", "trieda": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "CALL_GUIDE" } }], "visibility": "CALL_GUIDE" },

Neresponzívne widgety nedokážu zabezpečiť najlepší používateľský zážitok a nezobrazujú sa v menšom zobrazení. Agent musí zväčšiť veľkosť okna prehliadača, aby mohol zobraziť všetky widgety, ktoré sú nakonfigurované ako nereagujúce.

atribúty stránky >

V tejto časti môžete zadať atribúty webového komponentu. 

"atribúty": { "zakázané": "false", },

viditeľnosť stránky

Určuje, či sú widgety ponúkané spoločnosťou Cisco pridané do vlastného rozloženia na úrovni stránky alebo na úrovni kompozície viditeľné alebo nie.

Spoločnosť Cisco ponúka widgety ako História kontaktov, Prepis Cisco Webex Experience Management, IVR, Sprievodca hovormi kampane s ukážkou a Vyskakovacie okno.

  • Hodnoty vlastnosti **visibility** sú zabudované a definované v predvolenom súbore JSON rozloženia pre pracovnú plochu. Administrátor nemôže upravovať hodnoty vlastnosti **viditeľnosť** miniaplikácií ponúkaných spoločnosťou Cisco.

  • Hodnota vlastnosti **visibility** s hodnotou **NOT_RESPONSIVE** je zastaraná. Môžete ho naďalej používať iba kvôli spätnej kompatibilite. Akákoľvek hodnota nastavená ako NOT_RESPONSIVE predtým nevyžaduje úpravu, pretože funkčnosť zostáva rovnaká.

    Ak chcete nastaviť novovytvorený widget ako responzívny alebo neresponzívny, musíte použiť vlastnosť responzívny . Viac informácií nájdete v časti responzívna vlastnosť.

deti na stránke >

Táto vlastnosť je jadrom rozloženia. V deti V sekcii môžete vnoriť ľubovoľný počet úrovní, ak vám widget založený na webových komponentoch umožňuje odovzdávať podradené prvky. Aby to bolo možné, vývojár musí programovo spracovať drážkovaný obsah. Viac informácií nájdete v príručke pre vývojárov počítačov Cisco Webex Contact Center .

Ak chcete vedieť o odovzdávaní hodnôt STORE ako vlastností, pozrite si časť Zdieľanie údajov z počítača do widgetov. 

"children": [{ "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test"dch": "div": "div": "div": "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" }, { "comp": "div", "textContent": "Test" } ] } ],

Výhodou sekcie poľa „children“ je, že vo svojej špecifikácii rozloženia môžete použiť existujúce webové komponenty, ktoré sú už súčasťou balíka Desktop. Medzi webové komponenty balíka Desktop patria:

  • agentx-wc-iframe: Widget, ktorý vám umožňuje umiestniť ľubovoľnú webovú stránku do iFrame ako widget.

  • Dynamická oblasť: Komponent, ktorý umožňuje povoliť funkciu drag-and-drop pre agentov na inom mieste ako na vlastných stránkach. Vlastné stránky môžu mať túto funkciu, ak predvolene povolíte funkciu drag-and-drop.

  • Ľubovoľný komponent v knižnici momentum-ui-web-component. Viac informácií nájdete na stránke GitHub. Príklad:

    • md-tabs: Obal kontajnera Tabs

    • md-tab: Jedna hlavička Tab

    • md-tab-panel: Jeden obsah Tab

Viac informácií o atribútoch pre perzistentnú Tab nájdete v časti Atribúty pre trvalé karty.

stránka > textObsah

Pomáha vám pridať textový obsah. 

„textContent“: „Môj textový obsah“,

stránka > štýl

Pomáha vám priradiť konkrétny štýl CSS vášmu komponentu.

„štýl“: { „farba pozadia“: „#CBD“, „pretečenie“: „posúvanie“ },

stránka > obal

Obal widgetu vám umožňuje pridať panel s nástrojmi na vrch widgetu. Panel s nástrojmi môže obsahovať názov a Ikona maximalizácie ( Maximalizovať) ikonu v hornej časti widgetu. Keď widget zaberie malý priestor na stránke, ikona maximalizácie umožní agentovi vidieť widget v plnom pracovnom priestore.

Uistite sa, že používate predvolenú hodnotu „app-maximize-area“. Momentálne je k dispozícii iba predvolená hodnota. 

"wrapper": { "title": Názov môjho widgetu ", "maximizeAreaName": "app-maximize-area" }

stránka > obal> id

(Voliteľné) Obal widgetu webového komponentu vám umožňuje aktualizovať dynamický názov widgetu pomocou jedinečného identifikátora. Zadajte obal widgetu identifikátor hodnota nehnuteľnosti ako jedinečné-id-na-aktualizáciu-názvu. 

"wrapper": { "title": Názov môjho widgetu ", "id": "unique-id-to-update-title", "maximizeAreaName": "app-maximize-area" }

Uistite sa, že pre JavaScript CustomEvent používate rovnaký jedinečný identifikátor. Viac informácií nájdete v časti Asynchrónne udalosti v kapitole Modul kontaktu s agentom v dokumente Cisco Webex Contact Center Desktop Developer.

Ak chcete aktualizovať názov widgetu založeného na iFrame, použite obsah iFrame z rovnakej domény. Nasleduje vzorový príklad:

<typ skriptu = "text/javascript" >var názov = ""; window.addEventListener("aktualizácia-názvu-udalosti", function(e) { názov = e.detail.title; }); document.querySelector('#customEvent').onclick = function() { const e = new CustomEvent("aktualizácia-názvu-udalosti", { bubbles: true, detail: { názov: "nový názov" } }); window.parent.dispatchEvent(e); }; </script><button id = "customEvent" > Nový názov </button><iframe src = "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" >/iframe>

stránka > agentx-wc-iframe

Umožňuje vložiť webovú stránku do prvku iFrame, ktorý sa zobrazí ako widget na pracovnej ploche. Môžete použiť widget iFrame s názvom „agentx-wc-iframe“. 

"comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://blog.logrocket.com / the - ultimate - guide - to - iframes / " }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } },

rozloženie stránky >

Umožňuje usporiadať widgety na stránke.

Nasledujúci formát predstavuje mriežkové rozloženie:

typ Rozloženie = { oblasti: reťazec[][]; veľkosť: { riadky: počet[]; stĺpce: počet[]; }; };

Tu môžete definovať mriežku s názvami oblastí, ktoré ste definovali v sekcii widgety .

Nasledujúci príklad ukazuje, ako sa určuje rozloženie troch riadkov a troch stĺpcov: 

"rozloženie": { "oblasti": [ [ "komp1", "komp1", "komp3" ], [ "komp2", "komp2", "komp3" ], [ "komp4", "komp4", "komp4" ] ], "veľkosť": { "stĺpce": [1, 1, 1], "riadky": [1, 1, 1] } }
Rovnomerné rozloženie rozloženia 3x3
Equal distribution of a 3x3 layout for Webex contact Center Desktop layout configuration.

V sekcii veľkosti čísla predstavujú zlomok priestoru, ktorý môže widget zaberať v porovnaní s ostatnými widgetmi. Všetky tri stĺpce zaberajú rovnaký zlomok priestoru. Pri dostupnej šírke 100 % zaberá každý widget 33,33 % horizontálneho priestoru.

S rovnakou šírkou stĺpca
Equal column width layout for Webex Contact Center Desktop layout configuration.

Ďalší príklad použitia, ak nastavíte ako „stĺpce“: [1, 2, 2], znamená to, že celkový priestor je vydelený 5 (1+2+2) a prvý widget zaberá 20 % horizontálneho priestoru. Druhý a tretí widget zaberajú každý po 40 %. Viac informácií nájdete v časti Základné koncepty rozloženia mriežky.

Unequal column width layout for Webex Contact Center Desktop layout configuration.
Po zmene šírky stĺpca

stránka > KOREŇ

Vnorenie rozložení sa nazýva podrozloženie. V prípade, že máte vo svojej konfigurácii rozloženia vnorené rozloženia, musíte mať jeden objekt „ROOT“ ako rodiča pre podrozloženia. V opačnom prípade môže byť konfigurácia rozloženia plochá, ak nie je potrebné vnorenie.

Toto podrozloženie poskytuje väčšiu kontrolu nad správaním pri zmene veľkosti rozloženia. Vlastnosť rozloženie stránky musí byť typu Record<string, Layout>. Vlastnosť layout umožňuje usporiadať widgety na stránke.

{ "id": "some-id", "widgety": { "c1": { "comp": "div", "textContent": "c1" }, "c2": { "comp": "div", "textContent": "c2" }, "c3": { "comp": "div", "textContent": "c3" }, "c4": { "comp": "div", "textContent": "c4" }, "c5": { "comp": "div", "textContent": "c5" } }, "layout": { "ROOT": { "areas": [ ["c1", "sub1"], ["c2", "sub2"], ], "size": { "cols": [1, 1], "rows": [1, 1] } }, "sub1": { "areas": [ ["c3", "c4"] ], "veľkosť": { "stĺpce": [1, 1], "riadky": [1] } }, "pod2": { "oblasti": [ ["c1"], ["c5"] ], "veľkosť": { "stĺpce": [1], "riadky": [1, 1] } } } }

Toto nastavenie vytvorí mriežku v rozložení ROOT s dvoma podmriežkami, ktorých veľkosť môžete meniť nezávisle.

Sub-layout appearance for Webex Contact Center Desktop layout configuration.
Vzhľad podrozloženia

Zmena veľkosti komponentu ovplyvní komponenty v rámci daného podrozloženia.

Sub-layout appearance, after resizing both sub-layouts, for Webex Contact Center Desktop layout configuration.
Po zmene veľkosti oboch podrozložení

Dávajte si pozor na nasledujúce prípady:

Nekonečná slučka: Ak zahrniete rozloženie ROOT ako podrozloženie ROOT, spôsobí to chybu „prekročený zásobník volaní“ a spustí sa nekonečná slučka.

{ "rozloženie": { "KOREŇ": { "oblasti": [ ["c1", "c2"], ["c3", "KOREŇ"], ], "veľkosť": { "stĺpce": [1, 1], "riadky": [1, 1] } } }
Sub-layout appearance with infinite loop for Webex Contact Center Desktop layout configuration.
Podrozloženie s nekonečnou slučkou

Rovnaké podrozloženie (N)-krát: Ak podrozloženie zahrniete do mriežky viackrát s rovnakým názvom a ak zmeníte veľkosť jedného z nich, veľkosť všetkých podrozložení sa automaticky zmení.

Ak toto nie je požadované správanie, premenujte každé z podrozložení jedinečným názvom.

{ "rozloženie": { "KOREŇ": { "oblasti": [ ["c1", "sub1"], ["c2", "sub1"], ], "veľkosť": { "stĺpce": [1, 1], "riadky": [1, 1] } }, "sub1": { "oblasti": [ ["c3", "c4"] ], "veľkosť": { "stĺpce": [1, 1], "riadky": [1] } } } }
Sub-layout appearance with N times for Webex Contact Center Desktop layout configuration.
Podrozloženie s N-krát

Atribúty pre trvalé karty

Ak chcete nastaviť karty na vlastných stránkach a vlastných widgetoch ako trvalé, zadajte atribúty pre md-tabs vo vlastnom rozložení.

Príklad: Nastavenie tabulátorov ako trvalých

{ "comp": "md-tabs", "attributes": { "persist-selection": true, "tabs-id": "jedinečné ID pre všetky karty v kontajneri" }, }

Nehnuteľnosť

Popis

Pretrvávajúci výber

Nastavenie md-tabs na trvalé uloženie. Predvolená hodnota je true.

ID kariet

Jedinečná identifikácia všetkých záložiek v kontajneri.

Keď nastavíte md-tabs byť vytrvalý ( persist-selection: true), Agent Desktop si zachová výber Tab, aj keď agent prepína medzi stránkami alebo widgetmi na pracovnej ploche.

  • Ten/Tá/To pretrvávajúci výber Vlastnosť nie je použiteľná pre karty v table Pomocné informácie a na stránke Štatistiky výkonu agenta, pretože trvalé správanie Tab je už nastavené na pracovnej ploche.
  • Výber Tab sa po odhlásení z pracovnej plochy, opätovnom načítaní/obnovení prehliadača alebo vymazaní vyrovnávacej pamäte prehliadača obnovia na predvolenú hodnotu Tab.

Konfigurácia trvalých widgetov

Ľubovoľný vlastný widget môžete nakonfigurovať tak, aby bol trvalý. Trvalé widgety sa zobrazujú na všetkých stránkach pracovnej plochy. Trvalé widgety sa zobrazujú ako nové Tab v paneli Pomocné informácie iba vtedy, keď máte aktívnu žiadosť o kontakt alebo konverzáciu. Napríklad, Ukážka trvalá widget.

Trvalé widgety sa na stránke Home nezobrazujú tak, ako sa zobrazujú na ostatných stránkach. Ak však máte aktívnu interakciu, trvalé widgety sa zobrazia na stránke Home ako súčasť panela Pomocné informácie. Napríklad, keď prijmete hovor, zobrazí sa panel Ovládanie interakcie a Ukážka trvalá Widget sa zobrazuje ako súčasť panela Pomocné informácie.

Príklad: 

"oblasť": { "persistent": [{ "comp": "md-tab", "atribúty": { "slot": "Tab" }, "deti": [{ "comp": "md-icon", "atribúty": { "name": "emoticons_16" } }, { "comp": "span", "textContent": "Custom Page Widget" } ] }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel" }, "deti": [{ "comp": "dynamic-area", "properties": { "area": { "id": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "atribúty": { "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", "atribúty": { "title": "WIDGET 2 content" }, "wrapper": { "title": "Widget 2 title", "maximizeAreaName": "app-maximalize-area" } } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "riadky": [1] } } } } } }

Pri prispôsobovaní widgetu môžete vybrať jednu z možností:

  • Hosťujte aplikáciu na webovej stránke, ktorú možno vložiť do prvku iframe.

  • Vytvorte si vlastnú miniaplikáciu.

Požiadavky na technickú miniaplikáciu sú popísané v dokumentácii k vývoju miniaplikácie pracovnej plochy . Ako editor rozloženia sa uistite, že máte tieto podrobnosti:

  • Aký je názov vlastného prvku HTML (známeho ako webová súčasť)?

  • Aká je adresa URL zdroja siete na doručovanie obsahu (CDN), ktorý hosťuje balík JavaScript?

Widgety hlavičky

Hlavička sa používa na zobrazenie vnorených informácií, na pridanie rozbaľovacích ponúk atď. Keďže kontajner hlavičky má obmedzený vertikálny priestor, celková výška hlavičky je iba 64 pixelov. Ďalšie informácie o zarovnaní rozloženia nájdete v časti vlastnosť rozloženia.

Príklad: 

"hlavička":{ "id":"hlavička", "widgety":{ "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], "riadky": [1] } } }

Ak chcete pridať popis pre miniaplikáciu hlavičky, zalomte komponent popisom md-tooltip. Do vlastnosti správy zadajte informácie o popise .

Príklad: 

"hlavička": { "id": "dw-header", "widgety": { "head1": { "comp": "md-tooltip", "atribúty": { "message": "Netlify" }, "children": [{ "comp": "agentx-wc-iframe", "atribúty": { "src": "https://keen-jackson-8d352f.netlify.app" } }], }, }, }

Ak chcete nakonfigurovať widgety prostredníctvom prvku iFrame v prispôsobiteľnej oblasti miniaplikácií v hlavičke, musíte pridať atribúty štýlu , zobrazenie a výšku . Najvhodnejšia hodnota atribútu height [výška ] je 64 pixelov.

Uistite sa, že ste pridali atribúty štýlu k existujúcim widgetom hlavičky, aby sa v prvku iFrame načítali podľa očakávania.

Príklad: 

"head1": { "comp": "agentx-wc-iframe", "atribúty": { "src": "https://widget-kad.s3.amazonaws.com/Headers/Timer/Timer.htm", "style": "height:64px; displej:flex;" } },

Odporúčame použiť iba jeden riadok s viacerými stĺpcami pre hlavičku, pretože výška hlavičky je iba 64 pixelov. Ďalšie informácie o zarovnaní nájdete v časti vlastnosť rozloženia.

Panel pomocných informácií

Na table Pomocné informácie na pracovnej ploche sa zobrazujú karty, ktoré obsahujú miniaplikácie ponúkané spoločnosťou Cisco (predvolené) a vlastné widgety. Nasledujúce miniaplikácie ponúkané spoločnosťou Cisco sa zobrazujú na preddefinovaných kartách:

  • História kontaktov

  • Prepis IVR

  • Cesta zákazníckej skúsenosti

  • Vyskakovacie okno

Tablu Pomocné informácie môžete použiť na:

  • Pridanie kariet

  • Zmena poradia Tab

  • Odstránenie preddefinovaných kariet

  • Označenie vlastných kariet ako kariet, ktoré sa dajú presúvať

  • Pridanie popisov na vlastné karty

  • Pridať možnosť Obnoviť Tab poradie

Príklad: 

"panel": { "comp": "md-tabs", "atribúty": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY_TAB" } }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY" } }, { "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "atribúty": { "name": "pop-out_16" } }, { "comp": "span", "textContent": "Screen Pop" } ], "viditeľnosť": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "#SCREEN_POP" }], }, { "comp": "md-tab", "atribúty": { "slot": "Tab" }, "deti": [{ "comp": "md-icon", "atribúty": { "name": "emoticons_16" } }, { "comp": "rozpätie", "textContent": "Vlastný widget" } ] }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel" }, "deti": [{ "comp": "dynamic-area", "properties": { "area": { "id": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "atribúty": { "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-maximalize-area" } } }, "rozloženie": { "oblasti": [ ["comp1"], ["comp2"] ], "veľkosť": { "cols": [1], "riadky": [1, 1] } } } } ] },

Widget Customer Experience Journey môžete nakonfigurovať po povolení metrík riadenia spokojnosti zákazníkov na portáli správy.

Na table Pomocné informácie pridajte nové karty na umiestnenie vlastných miniaplikácií. Neplatia tu žiadne špeciálne pravidlá a hniezdenie komponentov je podľa očakávania a popísané v sekcii deti . Ďalšie informácie nájdete na stránke vo vlastnosti Podradené .

Nižšie sú uvedené konkrétne príklady prispôsobenia hlavičiek Tab:

Príklad umiestnenia ikon a menoviek do vlastnosti Deti 

{ "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "atribúty": { "name": "transcript_16" } }, { "comp": "span", "textContent": "My Widget Tab" } ], },

Príklad umiestnenia obrázka (so šablónou CSS) a štítkov do vlastnosti Podradené 

{ "comp": "md-tab", "atribúty": { "slot": "Tab" }, "deti": [{ "comp": "rozpätie", "atribúty": { "štýl": "zarovnať položky: na stred; zobrazenie: flex;" }, "deti": [{ "comp": "img", "atribúty": { "src": "http: //my-cdn.com/icon.svg", "šírka": 16, "výška": 16, "štýl": "pravý okraj: 0,5rem;" } }, { "comp": "rozpätie", "textContent": "Môj widget Tab" } ] }], },

Rozbaľovací zoznam Ďalšie karty sa zobrazí automaticky, keď tabla Pomocné informácie obsahuje viacero kariet.

Musíte pridať vlastný popis Tab, aby ste boli čitateľní a prístupní. Ak chcete pridať popis pre vlastnú Tab, zalomte komponent popisom md-tooltip. Do vlastnosti správy zadajte informácie popisu a použite hodnoty vlastností štýlu , ako je znázornené v nasledujúcom príklade.

"comp": "md-tooltip", "atribúty": { "class": "widget-tabs", "message": "Sample Tab 1", "style": "max-width: 252px; min. šírka: 110px; pretečenie: skryté; pretečenie textu: tri bodky; medzery: nowrap; displej: inline-block; okraj-dole: -10px;" },

Pre vlastné Tab odporúčame maximálnu šírku 252 pixelov a minimálnu šírku 110 pixelov.

Ak chcete povoliť funkciu presúvania myšou vo vlastnom znaku Tab, pridajte do atribútov nasledujúcuvlastnosť: 

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

  • pretiahnuteľné: Nastavte hodnotu vlastnosti ťahaného na hodnotu true.

  • comp-unique-id: Zadajte jedinečnú hodnotu na identifikáciu komponentu.

    Príklad: 

    "comp-unique-id": "vzorka-dynamické-vlastné-karty"

Ak povolíte drag-and-drop pre vlastnú Tab, agent môže Tab presunúť myšou na požadovanú pozíciu v rámci tably Pomocné informácie. Ak chcete obnoviť predvolené poradie Tab kariet, pridajte nasledujúcu vlastnosť: 

"comp": "agentx-wc-more-actions-widget", "atribúty": { "slot": "nastavenia", "class": "widget-pane", "tabs-unique-id": "sample-dynamic-custom-tabs" },

  • Agentx-wc-more-actions-widget: Zadajte komponent, ktorý sa zobrazí ako Ďalšie akcie (Ikona Ďalšie akcie) na table Pomocné informácie.

  • slot="nastavenia": Zadajte atribút v rámci komponentu, ktorý sa zobrazí ako možnosť Resetovať Tab Poradie v rozbaľovacom zozname Ďalšie akcie . Agenti môžu obnoviť záložky na table Pomocné informácie do predvoleného poradia kliknutím na tlačidlo Ikona Ďalšie akcie > Obnoviť poradie Tab.

  • tabs-unique-id: Zadajte rovnakú jedinečnú hodnotu definovanú pre vlastnosť comp-unique-id na priradenie a resetovanie komponentov md-tabs .

Nasledujúci vzorový kód používa funkcie Ďalšie akcie a Resetovať Tab Poradie .

"comp": "agentx-wc-more-actions-widget", "atribúty": { "slot": "nastavenia", "trieda": "widget-pane", "tabs-unique-id": "sample-dynamic-custom-tabs" }, "children": [{ "comp": "div", "atribúty": { "textContent": "vlastná akcia", "slot": "vlastná akcia" }, "deti": [{ "comp": "agentx-wc-notes-header-widget" }, { "comp": "agentx-wc-menu-notification" } ] }], }
Webex Contact Center more actions menu example, showing the 'Reset Tab Order' option.

V predvolenom nastavení je definovaný popis, ikona troch bodiek a obnovenie poradia Tab pre preddefinované karty.

Rozbaľovací zoznam Ďalšie akcie je možné rozšíriť o ďalšie vlastné komponenty alebo miniaplikácie po možnosti Obnoviť poradie Tab. Nasleduje vzorová množina hodnôt vlastností štýlu , ktoré možno použiť na ďalšie súčasti.

"comp": "md-tooltip", "atribúty": { "class": "widget-tabs", "message": "Sample Element", "style": "max-width: 252px; min. šírka: 110px; pretečenie: skryté; pretečenie textu: tri bodky; medzery: nowrap; displej: inline-block; okraj-dole: -10px;" },
Webex Contact Center more actions menu example, showing additional, custom options that can be added after the 'Reset Tab Order' option.

Funkcia presúvania myšou nie je podporovaná pre ďalšie vlastné komponenty alebo widgety, ktoré sú pridané do rozbaľovacieho zoznamu Ďalšie akcie .

Bezhlavé widgety

V sekcii bez hlavy môžete pridať widgety, ktoré sú skryté a nezobrazujú sa na Agent Desktop. Tieto widgety sa používajú na spustenie logiky na pozadí. Táto časť je užitočná na spustenie udalostí, ktoré sa vyskytujú na pracovnej ploche, a na spustenie logiky špecifickej pre widgety. Napríklad otvorenie vlastného CRM Screen Pop pre SMS pri jeho príchode.

Príklad: 

"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], "riadky": [1] } } } }

Zdieľanie údajov z pracovnej plochy s miniaplikáciami

Ak chcete prijímať údaje v reálnom čase prostredníctvom vlastností alebo atribútov vo vlastnej miniaplikácii, priraďte príslušné hodnoty STORE v konfigurácii rozloženia JSON.

Okrem toho, ak chcete získať prístup k údajom prostredníctvom odberateľov súpravy JavaScript SDK, môžete údaje odovzdávať aj prostredníctvom vlastníctiev alebo atribútov. Ak je váš komponent vytvorený tak, aby reagoval na zmeny vlastností alebo atribútov, dostávate aktualizácie údajov v reálnom čase od služby Agent Desktop, ktorá sa nazýva poskytovateľ údajov.

V súčasnosti máme jediného poskytovateľa údajov pod kľúčovým STORE. Ďalšie informácie nájdete v časti Poskytovateľ údajov – vlastnosti a atribúty miniaplikácie v príručke Cisco Webex Contact Center Desktop Developer Guide.

Ukážka hovoru kampane

Administrátor vytvára kampane, konfiguruje režim vytáčania (ukážka) a priraďuje kampane tímom. Ak je agent súčasťou tímu, ku ktorému sú priradené kampane, môže uskutočniť odchádzajúci ukážkový hovor kampane. Ďalšie informácie nájdete v téme Konfigurácia režimov odchádzajúcej hlasovej kampane v Webex Contact Center.

Administrátor nakonfiguruje nasledujúce nastavenia vo vlastnom rozložení tak, aby povolil ukážku kontaktu kampane pre agenta.

Kontakt kampane

Správca pridá miniaplikáciu Kontakt kampane do kontajnera hlavičky vlastného rozloženia. Kontakt kampane zobrazí kontaktné informácie zákazníka na základe definovaných vlastností. Ďalšie informácie o zarovnaní rozloženia nájdete v riadku vlastností rozloženia tabuľky Podrobnosti o vlastnostiach stránky.

Príklad: 

 "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" } ]

Sprievodca hovormi

Miniaplikácia Sprievodca hovormi sa zobrazí na table Pomocné informácie na pracovnej ploche. Sprievodca výzvami zobrazuje otázky a odpovede na úrovni kampane. Agent je vyzvaný, aby si prečítal súbor otázok v sprievodcovi hovormi a odoslal odpovede.

Príklad: 

"panel":{ "comp":"md-tabs", "atribúty":{ "trieda":"widget-tabs" }, "deti":[ { "comp":"md-tab", "atribúty":{ "slot":"Tab", "class":"widget-pane-tab" }, "children":[ { "comp":"md-icon", "atribúty":{ "name":"icon-note_16" } }, { "comp":"span", "textContent":"Sprievodca hovormi" } ], "viditeľnosť":"CALL_GUIDE" }, { "comp":"md-tab-panel", "atribúty":{ "slot":"panel", "class":"widget-pane" }, "children":[ { "comp": "acqueon-call-guide", "script": "http://localhost:5555//index.js", // include CDN odkaz tu "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" } } ], "visibility":"CALL_GUIDE" } ] }
  • Nasledujúce odkazy na vlastnosti comp sa zmenili. AgentX v hodnote nehnuteľnosti sa nahrádza Acqueon:
    • Agentx-preview-campaign sa premenuje na acqueon-preview-campaign
    • agentx-call-guide sa premenuje na acqueon-call-guide
  • Musíte hosťovať zoznam a správcu kampaní (LCM) v CDN a potom zadať URL adresu vo vlastnosti skriptu .

Vyskakovacie okno

V rozložení pracovnej plochy môžete nakonfigurovať funkciu Zväčšovanie obrazovky jedným z nasledujúcich spôsobov:

  • ako vlastná stránka,

  • ako jedna z miniaplikácií na vlastnej stránke.

  • Ako Tab na table Pomocné informácie

Kontext obrazovky sa zobrazuje na pracovnej ploche na základe nasledujúcich faktorov:

Pre hlasový kanál:

  • Konfigurácia definovaná v rozložení pracovnej plochy

  • Aktivita funkcie Screen Pop definovaná v návrhárovi postupov

V prípade nových digitálnych kanálov:

  • Konfigurácia definovaná v rozložení pracovnej plochy

  • Uzol Screen Pop definovaný v Zostavovači toku pripojenia

Ďalšie informácie o konfigurácii funkcie Screen Pop nájdete v téme Screen Pop.

Konfigurácia funkcie Screen Pop na navigačnom paneli

Funkciu Screen Pop môžete nakonfigurovať ako vlastnú stránku alebo ako jeden z widgetov na vlastnej stránke. Ak chcete získať prístup k vlastnej stránke funkcie Zvýraznenie obrazovky, kliknite na ikonu funkcie Zvýraznenie obrazovky na navigačnom paneli. Ak chcete získať prístup k miniaplikácii Screen Pop na vlastnej stránke, kliknite na vlastnú ikonu na navigačnom paneli. Ďalšie informácie o navigačných vlastnostiach nájdete v téme Navigácia (vlastné stránky).

Príklad: Zvýraznenie obrazovky ako vlastná stránka

{ "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", "vlastnosti": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" } } }, "rozloženie": { "oblasti": [ ["comp1"] ], "veľkosť": { "cols": [1], "riadky": [1] } }, "viditeľnosť": "SCREEN_POP" }

Príklad: Funkcia Screen Pop ako miniaplikácia na vlastnej stránke

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

Ak funkcia Screen Pop nie je nakonfigurovaná v návrhárovi postupov, vlastná stránka sa zobrazí prázdna. Ďalšie informácie o konfigurácii funkcie Screen Pop v návrhárovi postupov nájdete v téme Screen Pop.

Konfigurácia zobrazenia obrazovky na table Pomocné informácie

Funkciu Screen Pop môžete nakonfigurovať tak, aby sa na table Pomocné informácie zobrazovala ako Tab.

V predvolenom nastavení sa funkcia Screen Pop zobrazí ako nová podpoložka Tab v okne Snímka obrazovkyTab tably Pomocné informácie, ak je funkcia Screen Pop nakonfigurovaná na zobrazovanie ako Inside Desktop v návrhárovi postupov.

Pridajte nasledujúci atribút do časti panela , aby ste funkciu Screen Pop zahrnuli ako Tab na table Pomocné informácie. Ďalšie informácie o podrobnostiach panela nájdete v časti Pomocná informačná tabla.

Príklad: Zobrazenie obrazovky ako Tab na table pomocných informácií

 { "comp":"md-tab", "atribúty":{ "slot":"Tab", "class":"widget-pane-tab" }, "children":[ { "comp": "md-icon", "atribúty": { "name": "pop-out_16" }}, { "comp": "span", "textContent": "Screen Pop" }], "viditeľnosť": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "deti": [{ "comp": "#SCREEN_POP" } ], }

Možnosť zobrazenia Screen Pop definovaná v návrhárovi postupov má prednosť pred konfiguráciou definovanou v rozložení pracovnej plochy.

Zvážte napríklad, že ste nakonfigurovali nasledujúce nastavenia funkcie Screen Pop:

  • Návrhár postupov – zobrazenie nastavení ako V novom prehliadači Tab
  • Rozloženie pracovnej plochy – ako Tab na table Pomocné informácie

Keď dôjde k udalosti, pre ktorú je nakonfigurované vyskakovanie obrazovky, Screen Pop sa zobrazí mimo pracovnej plochy - to znamená v novom prehliadači Tab.

Ukážkové príklady prípadov použitia

V nasledujúcich častiach je uvedených niekoľko príkladov pre vašu referenciu:

Konfigurácia miniaplikácie Metriky riadenia spokojnosti zákazníkov a prístup k nej z navigačného panela

Príklad: 

{ "nav": { "label": "Customer Experience Management Metrics", "icon": "/app/images/wxm.bcd45cc3.svg", "iconType": "other", "navigateTo": "wxm-metrics", "align": "top" }, "page": { "id": "wxm-metrics", "widgets": { "comp1": { "comp": "agentx-wc-cloudcherry-widget", "atribúty": { "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], "riadky": [1] } } } },

Ak chcete získať spaceId a metricsId, pozrite si dokumentáciu Webex Experience Management .

Používanie kariet na vlastnej stránke

Príklad: 

{ "nav": { "label": "Dynamické karty", "ikona": "uložené informácie", "iconType": "momentum", "navigateTo": "dynamic-tabs", "align": "top" }, "page": { "id": "page-id-tabs", "widgets": { "comp1": { "comp": "md-tabs", "children": [{ "comp": "md-tab", "textContent": "One", "atribúty": { "slot": "Tab" } }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel" }, "deti": [{ "comp": "widget-two", "script": "http:/my-cdn.com/dynamic-widgets/widget-two.js" }], { "comp": "md-tab", "textContent": "Two", "atribúty": { "slot": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Two Content", "atribúty": { "slot": "panel" } } ] }, "comp2": { "comp": "widget-two", "script": " http:/my-cdn.com/dynamic-widgets/widget-two.js" } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "riadky": [1] } } } } }

Predvolená tabla pomocných informácií s históriou kontaktov a funkciou Screen Pop

Príklad: 

"panel": { "comp": "md-tabs", "atribúty": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY_TAB" } }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY" } }, ] }, { "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, { "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribúty": { "name": "SCREEN_POP_TAB" } }], "viditeľnosť": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribúty": { "name": "SCREEN_POP" } }], "viditeľnosť": "SCREEN_POP" } },

Tabla pomocných informácií s miniaplikáciou Cesta zákazníckej skúsenosti

Príklad: 

"panel": { "comp": "md-tabs", "atribúty": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "atribúty": { "slot": "Tab" }, "deti": [{ "comp": "slot", "atribúty": { "name": "WXM_JOURNEY_TAB" } }], "viditeľnosť": "WXM_JOURNEY" }, { "comp": "md-tab-panel", "atribúty": { "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", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": { "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY_TAB" } }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "trieda": "widget-pane" }, "deti": [{ "comp": "slot", "atribúty": { "name": "CONTACT_HISTORY" } }, { "comp": "md-tab", "atribúty": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribúty": { "name": "SCREEN_POP_TAB" } }], "viditeľnosť": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribúty": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribúty": { "názov": "SCREEN_POP" } }], "viditeľnosť": "SCREEN_POP" } "viditeľnosť": "SCREEN_POP" }, },

Lokalizácia

Používateľské rozhranie pracovnej plochy podporuje lokalizáciu v 29 jazykoch.

Podporované jazyky sú nasledujúce:

Bulharčina, katalánčina, čínština (Čína), čínština (Taiwan), chorvátčina, čeština, dánčina, holandčina, angličtina (UK), angličtina (USA), fínčina, francúzština, nemčina, maďarčina, taliančina, japončina, kórejčina, nórčina, poľština, portugalčina (Brazília), portugalčina (Portugalsko), rumunčina, ruština, srbčina, slovenčina, slovinčina, španielčina, švédčina a turečtina.

Jazyk používateľského rozhrania pracovnej plochy je založený na nastaveniach jazykových preferencií vo vašom prehliadači. Zvážme napríklad, že ste v prehliadači Firefox vybrali preferovaný jazyk ako francúzštinu. Keď spustíte pracovnú plochu v prehliadači Firefox, používateľské rozhranie pracovnej plochy sa zobrazí vo francúzštine Français. Vodorovná hlavička, navigačný panel a ďalšie súčasti pridané do rozloženia pracovnej plochy však nie sú lokalizované na základe nastavení jazykových preferencií v prehliadači.

Lokalizovať súčasti pracovnej plochy

Ak chcete lokalizovať súčasti pracovnej plochy,

  • Použite existujúce lokalizačné kľúče nastavené v súbore app.json . Ak lokalizačné kľúče nie sú nastavené, použije sa predvolený jazyk angličtina (US). Na podporu Cisco môžete odoslať žiadosť o servis a pridať lokalizačný kľúč do súboru app.json .

    Príklad: Lokalizačný kľúč 

    { "common": { "buttonTitle": "Stop Timer" } }

  • Do súboru JSON rozloženia pracovnej plochy zadajte nasledujúcu vlastnosť rozlišujúcu veľké a malé písmená na lokalizáciu súčasti:

    "textContent": "$I 18N.<kľúč>",

    kde <kľúč> odkazuje na zodpovedajúci lokalizačný kľúč v súbore app.json .

Príklad: Lokalizácia súčasti hlavičky 

"hlavička": { "id": "hlavička", "widgety": { "head1": { "comp": "md-button", "atribúty": { "slot": "menu-trigger", "style": "výška: 64px" }, "children": [{ "comp": "span", "textContent": "$I 18N.common.buttonTitle", } }, }, }

Príklad: Lokalizácia súčasti Tab na table pomocných informácií

"panel": { "comp": "md-tab", "atribúty": { "slot": "Tab" }, "deti": [{ "comp": "span", "textContent": "$I 18N.panelTwo.screenPopTitle" }] }