- الرئيسية
- /
- المقال
إنشاء تخطيط مخصص لسطح المكتب
تساعد هذه المقالة في إنشاء تخطيط مخصص عن طريق تحرير ملف JSON وتقدم حالات استخدام نموذجية لمساعدتك على بدء استخدام عناصر واجهة المستخدم مثل أداة مقاييس إدارة تجربة العملاء وعنصر واجهة المستخدم رحلة تجربة العملاء. للعمل بفعالية مع تخطيطات سطح المكتب المخصصة، يجب أن يكون لديك فهم قوي لبنية HTML ونموذج شجرة المستند في المستعرض وتنسيق JSON.
نظرة عامة
تتيح لك ميزة تخطيط سطح المكتب تكوين Webex Contact Center Desktop وفقا لمتطلبات عملك. يمكنك تخصيص عناصر مثل الشعار والعنوان والأدوات. يمكنك إنشاء تخطيط سطح مكتب وتعيينه لفريق. ينشئ هذا التخطيط تجربة الوكيل على سطح المكتب لجميع الوكلاء الذين يقومون بتسجيل الدخول كجزء من هذا الفريق.
هناك نوعان من التخطيطات:
-
التخطيط العام: هذا التخطيط عبارة عن تخطيط تم إنشاؤه بواسطة النظام ويتم تعيينه افتراضيا عند إنشاء فريق. لمزيد من المعلومات، راجع إدارة الفرق. عند إنشاء فريق، يتم تعيين التخطيط العام تلقائيا كتخطيط سطح المكتب للفريق. لا يمكنك حذف هذا التخطيط.
-
تخطيط مخصص: تخطيط يوفر تجربة سطح مكتب مخصصة. يمكنك إنشاء تخطيط مخصص لفريق واحد أو أكثر.
إذا قمت بتعيين تخطيط سطح مكتب جديد عند تسجيل دخول أحد العاملين، فيجب على العامل إعادة تحميل الصفحة لرؤية التخطيط الجديد.
يدعم سطح مكتب مركز اتصال Webex ثلاثة أشخاص:
-
الوكيل
-
مشرف
-
مشرف ووكيل
يحتوي ملف تخطيط JSON على أقسام منفصلة لكل شخصية. يجب على المسؤول تكوين الإعدادات لكل شخصية في القسم المقابل من ملف تخطيط JSON. لمزيد من المعلومات حول نموذج ملف تخطيط JSON، راجع خصائص المستوى الأعلى لتخطيط JSON.
عندما تضيف Cisco ميزة جديدة إلى تخطيط سطح المكتب، يتم تحديث التخطيط غير المعدل تلقائيا بالميزات الجديدة. يتوفر تخطيط سطح المكتب المحدث تلقائيا للفرق الموجودة التي تستخدم تخطيط سطح المكتب غير المعدل. يتلقى مستخدمو سطح المكتب الذين يستخدمون تخطيط سطح المكتب غير المعدل الميزات الجديدة المستندة إلى التخطيط عند تسجيل الدخول أو إعادة تحميل المستعرض.
إذا كنت تستخدم ملف سطح المكتب الافتراضي Layout.json
دون أي تعديل ، اعتباره تخطيطا غير معدل. ومع ذلك، إذا قمت بتنزيل ملف "سطح المكتب Layout.json
الافتراضي" وتحميله مرة أخرى، اعتباره تخطيطا معدلا حتى إذا لم يتم تعديل محتوى الملف أو اسم الملف.
في سطح المكتب، يوجد نوعان من عناصر واجهة المستخدم—المستندة إلى iframe والمستندة إلى مكونات الويب. الرأس والتنقل (صفحة مخصصة) والمنطقة الثابتة ومنطقة مقطوعة الرأس ولوحة aux هي المنطقة القابلة للتخصيص في سطح المكتب. هذه ليست عناصر واجهة مستخدم.
توضح القائمة التالية تفاصيل المسافات التي يمكنك تكوينها. توضح الصور تخطيط سطح المكتب:
-
منطقة العنوان والشعار: تعرض هذه المساحة شعار مركز اتصال Webex واسمه (افتراضي) في الزاوية العلوية اليمنى من الشاشة.
-
منطقة الرأس الأفقية: تحتوي هذه المساحة على منطقة قابلة للتكوين يتم ملؤها بعناصر واجهة مستخدم مخصصة. يمكن أن تعرض عناصر واجهة المستخدم هذه، على سبيل المثال، معلومات مضمنة وقوائم منسدلة. نظرا لأن ارتفاع هذا الرأس يبلغ 64 بكسل فقط ، لا يمكن أن يتجاوز ارتفاع عنصر واجهة المستخدم ارتفاع الرأس.
-
مساحة مساحة العمل : تتغير هذه المساحة وفقا للتحديد على شريط التنقل أو عندما يتفاعل أحد الوكلاء مع العملاء. عندما يجري أحد الوكلاء مكالمة، تعرض هذه المنطقة عنصر تحكم التفاعل وجزء المعلومات الإضافية (الذي يتضمن عناصر واجهة مستخدم مخصصة وعناصر واجهة مستخدم ثابتة). عندما يتفاعل أحد العاملين عبر البريد الإلكتروني أو الدردشة أو القنوات الاجتماعية، تعرض هذه المنطقة منطقة مساحة العمل وجزء المعلومات الإضافية (الذي يتضمن منطقة عنصر واجهة المستخدم الثابت).
يتم عرض صفحة مخصصة على واجهة سطح المكتب في جزء مساحة العمل. يمكنك الوصول إلى الصفحة المخصصة من خلال الرموز الموجودة على شريط التنقل. يمكن أن تحتوي كل صفحة مخصصة على عنصر واجهة مستخدم مخصص واحد أو أكثر.
عنصر واجهة المستخدم المخصص هو تطبيق تابع لجهة خارجية تم تكوينه في تخطيط JSON. يمكنك وضع عنصر واجهة المستخدم المخصص على الصفحة المخصصة أو علامة التبويب المخصصة (جزء المعلومات الإضافية) أو على الرأس الأفقي لسطح المكتب.
-
منطقة شريط التنقل: استخدم هذه المساحة لإضافة عناصر تنقل للوصول إلى الصفحات المخصصة.


خصائص المستوى الأعلى لتخطيط JSON
ادوار
يحتوي تخطيط JSON الافتراضي على الأدوار الثلاثة التالية.
-
الوكيل—لتعيين تخطيط سطح المكتب ليتم عرضه عندما يقوم أحد الوكلاء بتسجيل الدخول إلى Webex Contact Center Desktop للتعامل مع أنشطة العامل.
-
المشرف—لتعيين تخطيط سطح المكتب ليتم عرضه عندما يقوم المشرف بتسجيل الدخول إلى Webex Contact Center Desktop للتعامل مع إمكانات المشرف فقط.
عندما يقوم المشرف بتسجيل الدخول إلى سطح المكتب، يتم تطبيق تخطيط سطح المكتب المحدد للفريق الأساسي. إذا لم تقم بتوفير فريق أساسي، تطبيق التخطيط العام. بشكل افتراضي، APS يتم تعطيل التقارير.
-
supervisorAgent—لتعيين تخطيط سطح المكتب ليتم عرضه عندما يقوم المشرف بتسجيل الدخول إلى Webex Contact Center Desktop للتعامل مع كل من إمكانات المشرف وأنشطة العامل.
يمكنك إما إضافة عناصر واجهة مستخدم أو تعديلها لكل دور في الشخصية المقابلة لملف تخطيط JSON ذي الصلة.
فيما يلي خصائص المستوى الأعلى لتخطيط JSON استنادا إلى الدور:
{ "الوكيل": { "الإصدار": "0.1.0"، "appTitle": "Webex مركز الاتصال"، "الشعار": ""، "taskPageIllustration": "https://www.abc.com/image/logo.jpg"، "stopNavigateOnAcceptTask": خطأ، "dragDropEnabled": خطأ، "notificationTimer": 8، "maximumNotificationCount": 3، "browserNotificationTimer": 8، "wxmConfigured": false، "desktopChatApp": { "webexConfigured": false، } "headerActions": ["outdial"، "notification"]، "area": { "advancedHeader": { ... } ، "لوحة": { ... } ، "الملاحة": { ... } ، "مستمر": { ... } ، "مقطوعة الرأس": { ... } }, }, "المشرف": { "الإصدار": "0.1.0", "appTitle": "Webex مركز الاتصال", "الشعار": """، "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": خطأ, "dragDropEnabled": خطأ, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... } ، "لوحة": { ... } ، "الملاحة": { ... } ، "مستمر": { ... } ، "مقطوعة الرأس": { ... }، "الصفحة الرئيسية": { ... } }, } "supervisorAgent": { "الإصدار": "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": { ... } ، "لوحة": { ... } ، "الملاحة": { ... } ، "مستمر": { ... } ، "مقطوعة الرأس": { ... } }, } },
- تسري التغييرات التي تم إجراؤها على خصائص تخطيط JSON عند تحديث مستعرض سطح المكتب.
- في حالة عدم توفر الميزة التي قمت بتمكينها في تخطيط JSON على سطح المكتب، اتصل بدعم Cisco لتمكين الميزة.
- جميع الخصائص في تخطيط JSON حساسة لحالة الأحرف.
عنوان التطبيق
لتحديد عنوان على الرأس الأفقي لسطح المكتب. العنوان الافتراضي هو Webex مركز
الاتصال.
مثال:
"appTitle": "مركز اتصال Webex"
يتم تغيير عنوان التطبيق الافتراضي من سطح مكتب
مركز الاتصال إلى Webex مركز
الاتصال. لا يوجد أي تأثير على التخطيطات المخصصة الموجودة التي تستخدم عنوان التطبيق الافتراضي القديم (سطح مكتب
مركز الاتصال). لاستخدام عنوان التطبيق الجديد، يجب تعديل التخطيط المخصص. ومع ذلك، يستخدم التخطيط العام الجديد عنوان التطبيق الافتراضي على النحو التالي Webex مركز
الاتصال.
يمكن أن يكون العنوان نصا أو صورة أو سلسلة فارغة. يظهر نص العنوان في صفين. إذا امتد النص إلى ما بعد الصف الثاني، يتم عرض أيقونة علامة حذف، ويعرض تلميح الأداة العنوان الكامل. لا يمكن تطبيق الأنماط على العنوان.
يمكنك إما استخدام عناوين URI للبيانات (معرف الموارد الموحد) أو استضافة صورة عنوان مخصصة على شبكة توصيل المحتوى (CDN) أو حاوية Amazon Web Services (AWS) خدمة التخزين البسيطة (S3) أو خدمة استضافة مماثلة، ثم تحديد عنوان URL للصورة المستضافة. تنسيقات صور العنوان المدعومة هي PNG وJPG وJPEG وGIF وSVG وWebP. حجم صورة العنوان المدعومة هو 184 × 32 بكسل (العرض × الارتفاع).
الشعار
لتحديد عنوان URL لشعار الشركة. إذا لم تقم بتوفير عنوان URL، فسيظهر شعار Webex Contact Center افتراضيا.
مثال:
"الشعار": "https://my-cdn.com/logo.png"
يمكنك استضافة صورة شعار مخصصة على CDN أو حاوية Amazon Web Services (AWS) Simple Storage Service (S3) أو خدمة استضافة مماثلة، ثم تحديد عنوان URL للصورة المستضافة. تنسيقات صور الشعار المدعومة هي PNG وJPG وJPEG وGIF وSVG وWebP. حجم صورة الشعار المدعوم هو 96 × 32 بكسل (العرض × الارتفاع).
الحالة | مثال | عنوان التطبيق | الشعار |
---|---|---|---|
إذا لم يتم تكوين 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 × 400 بكسل (العرض × الارتفاع). إذا كان حجم الرسم التوضيحي المخصص أكبر من الحجم الموصى به، يتم ضبط حجم الرسم التوضيحي استنادا إلى نسبة العرض إلى الارتفاع في صفحة المهمة. إذا كان حجم الرسم التوضيحي المخصص أصغر من الحجم الموصى به، يتم الاحتفاظ بحجم الرسم التوضيحي الفعلي في صفحة المهمة.


إيقافنافيجيتأونقبولالمهمة
لتحديد ما إذا كان سيتم تحويل التركيز إلى مهمة مقبولة حديثا، عندما يقبل العامل المهمة الجديدة أثناء العمل على مهمة سابقة. القيمة الافتراضية هي false
.
مثال:
"stopNavigateOnAcceptTask": false
إذا تم تعيين القيمة كtrue ، عندما يقبل المستخدم مهمة جديدة على سطح المكتب، يتم الاحتفاظ بالتركيز على المهمة السابقة ولا ينتقل إلى المهمة المقبولة حديثا. يمنع هذا الإعداد المستخدم من فقدان أي بيانات عند قبول طلب جديد.
على سبيل المثال، ضع في اعتبارك أن العميل 1 يجري محادثة مع العميل 1 وفي نفس الوقت يجري مكالمة صوتية مع العميل 2. أثناء المكالمة الصوتية، يقوم العامل 1 بتحديث تفاصيل العميل 2 في جزء التحكم في التفاعل. حاليا، لدى العامل 1 مهمتان نشطتان في جزء قائمة المهام، وينصب التركيز على جزء التحكم في التفاعل. عندما يقبل العامل 1 طلب دردشة جديد من العميل 3، يظل التركيز على جزء التحكم في التفاعل مع العميل 2 ولا ينتقل إلى طلب الدردشة المقبول حديثا.
للاحتفاظ بالتركيز على المهمة السابقة وعدم الانتقال إلى المهمة المقبولة حديثا، حدد التخطيط المخصص مع تعيين قيمة الخاصية stopNavigateOnAcceptTask
إلى true
.
إذا لم يتم إدخال قيمة خاصية stopNavigateOnAcceptTask
في تخطيط JSON، يحول سطح المكتب التركيز إلى المهمة المقبولة حديثا. السلوك مشابه عندما يتم تعيين قيمة الخاصية stopNavigateOnAcceptTask
إلى false
.
- ينطبق هذا الإعداد على جميع المهام (الصوتية والقنوات الرقمية) التي يتم تنفيذها على سطح المكتب—مثل قبول مهمة أو مؤتمر أو استشارة أو تحويل، وبالنسبة للمكالمات الخارجية ومكالمات الحملة الصادرة والإنهاء التلقائي وما إلى ذلك.
- لا يتم تطبيق الإعداد إذا كان مستخدم سطح المكتب موجودا في الصفحة الرئيسية، مع عدم وجود مهمة نشطة في جزء قائمة المهام. في مثل هذه الحالة، عند قبول مهمة جديدة، يتم تحويل التركيز من الصفحة الرئيسية إلى المهمة المقبولة حديثا.
السحب دروب ممكن
لتمكين السحب والإفلات وتغيير حجم الأدوات في الصفحات المخصصة، قم بتعيين القيمة إلى true
. القيمة الافتراضية هي false
.
مثال:
"dragDropEnabled": خطأ
لمزيد من المعلومات حول تمكين ميزة السحب والإفلات لعلامات التبويب في جزء المعلومات المساعدة، راجع جزء المعلومات الإضافية.
مؤقت الإخطار
لتعيين المدة (بالثواني) التي يتم بعدها تجاهل إعلامات سطح المكتب على سطح المكتب تلقائيا. يظهر الإعلام في الزاوية العلوية اليسرى من سطح المكتب. قيمة المهلة الافتراضية هي 8 ثوان. النطاق الصالح لقيم المهلة هو من 1 إلى 10 ثوان. لكي تدخل تغييرات المهلة حيز التنفيذ، يجب تحديث المستعرض بعد إجراء التغييرات.
مثال:
"مؤقت الإخطار": 8
الحد الأقصىعدد الإشعارات
لتعيين عدد إعلامات سطح المكتب ليتم عرضها في وقت واحد على سطح المكتب. القيمة الافتراضية هي 3. نطاق إعلامات سطح المكتب هو 1-10. إعلامات سطح المكتب مكدسة. إذا كان هناك العديد من الإشعارات ، فإنها تظهر مع تأخير طفيف وفقا لإعدادات notificationTimer
.
مثال:
"الحد الأقصى لعدد الإخطارات": 3
المتصفحNotificationTimer
لتعيين المدة (بالثواني) التي يتم بعدها رفض إشعارات محمصة المتصفح على سطح المكتب تلقائيا. Toaster هو إشعار مستعرض أصلي يظهر فقط إذا لم يكن سطح المكتب هو نافذة أو علامة تبويب المتصفح النشطة. تكون نافذة أو علامة تبويب مستعرض سطح المكتب غير نشطة عندما
-
أنت تعمل على نوافذ أو علامات تبويب متصفح أخرى.
-
أنت تعمل على تطبيقات أخرى.
-
لقد قمت بتصغير نافذة مستعرض سطح المكتب.
يظهر الإعلام في الزاوية العلوية اليسرى من سطح المكتب. قيمة المهلة الافتراضية هي 8 ثوان. النطاق الموصى به لقيم المهلة هو 5-15 ثانية. لكي تدخل تغييرات المهلة حيز التنفيذ، يجب تحديث المستعرض بعد إجراء التغييرات.
مثال:
"مؤقت المستعرض": 8
تعتمد المهلة التي تم تكوينها لإشعارات المستعرض على نظام التشغيل وإعدادات المستعرض. يتم احترام قيمة المهلة في متصفح Chrome عبر أنظمة التشغيل Windows وChrome OS وmacOS. ومع ذلك، لا تحترم المستعرضات المدعومة الأخرى قيمة مهلة الإعلام التي تم تكوينها بشكل متسق.
wxmConfigure
(اختياري) لتكوين Webex Experience Management، قم بتعيين القيمة إلى صواب
. القيمة الافتراضية هي false
.
مثال:
"wxmتكوين": صحيح
desktopChatApp
لتكوين العديد من تطبيقات الدردشة التي تقدمها Cisco مثل تطبيق Webex.
webexConfigure
يمكن تكوين Webex التطبيق جنبا إلى جنب مع وظائف المراسلة والاجتماع داخل سطح المكتب. يسمح هذا التكوين للوكلاء بالتعاون مع الوكلاء والمشرفين وخبراء الموضوع (SMEs) الآخرين في مؤسستهم دون التنقل بعيدا عن سطح المكتب.
- يدير مسؤول الموقع مستخدمي Webex Meeting ويعين الامتيازات فقط إذا كان لدى المستخدمين Webex Enterprise Edition. لمزيد من المعلومات، راجع إدارة Webex Meetings المستخدمين في Cisco Webex Control Hub.
- يجب على المشرفين والشركات الصغيرة والمتوسطة تنزيل Webex العميل على نظامهم (الجهاز الشخصي) أو الوصول إلى تطبيق Webex باستخدام تطبيق Webex للويب ( https://web.webex.com/). لمزيد من المعلومات، راجع تنزيل التطبيق.
- يمكنك الوصول إلى تطبيق Webex داخل Agent Desktop للتعاون مع الوكلاء والمشرفين والخبراء المتخصصين (SMEs) الآخرين في مؤسستك دون الانتقال بعيدا عن Agent Desktop. ميزة التحكم في المكالمات غير متوفرة. لتلقي المكالمات وإجرائها، تحتاج إلى تطبيق Webex خارجي غير مضمن. لمزيد من المعلومات، راجع تطبيقات الاتصال.
لتكوين Webex التطبيق داخل سطح المكتب:
-
في Cisco Webex Control Hub، عند إضافة خدمات لمستخدم، حدد خانة الاختيار المراسلة المتقدمة ( ). لمزيد من المعلومات، راجع إدارة حسابات المستخدمين في Cisco Webex إدارة الموقع.
-
في تخطيط سطح المكتب المخصص، قم بتعيين
قيمة الخاصية webexConfigure
إلىtrue
.مثال:
"desktopChatApp": { "webexConfigured": true },
القيمة الافتراضية للخاصية
webexConfigure
هيfalse
.لا يتوفر Webex App لأدوار العامل والمشرف والوكيل المشرف إلا إذا قمت بتعيين
قيمة خاصية webexConfigure
إلىtrue
لكل دور من هذه الأدوار. لا يمكن للوكيل أو المشرف أو وكيل المشرف تسجيل الخروج من Webex التطبيق.لعرض
(Webex) على الرأس الأفقي لسطح المكتب، أدخل القيمة
webex
فيخاصية headerActions
. لمزيد من المعلومات، راجع headerActions.لتمكين تطبيق Webex لفريق معين، حدد التخطيط المخصص مع
تعيين قيمة خاصية webexConfigure
إلىtrue
. لمزيد من المعلومات، راجع إنشاء فريق.
يمكنك تكوين Webex التطبيق في جزء المعلومات الإضافية والصفحة المخصصة وعنصر واجهة المستخدم المخصص أيضا. لمزيد من المعلومات، راجع لوحة المعلومات المساعدة.
Webex إشعار التطبيق
القيم التي تم تحديدها باستخدام خصائص notificationTimer
و browserNotificationTimer
لمؤقت الإشعارات قابلة للتطبيق على تطبيق Webex. قيمة مهلة الانتظار الافتراضية هي 8 ثوانٍ لهذه الخصائص. لمزيد من المعلومات، راجع notificationTimer و browserNotificationTimer.
إجراءات الرأس
لتغيير ترتيب الأيقونات الموجودة في الرأس الأفقي لسطح المكتب. الترتيب الافتراضي هو كما يلي:
-
(Webex)
-
(مكالمة خارجية)
-
(مركز الإشعارات)
قم بتعيين قيمة الخاصية headerActions
كما يلي:
اسم الأيقونة |
قيمة خاصية headerActions |
---|---|
تطبيق Webex |
webex |
مكالمة طلب صادر |
الاتصال الخارجي |
مركز الإعلام |
إعلام |
مثال:
"headerActions": ["webex"، "outdial"، "notification"]،
قيمة الخاصية headerActions
حساسة لحالة الأحرف.
لتغيير الترتيب الافتراضي للرموز، أدخل الخاصية headerActions
والقيم في التخطيط المخصص وفقًا لذلك.
المثال:
"headerActions": ["الإشعار"، "الاتصال الخارجي"، "webex"]،
- إذا لم تقم بإدخال الخاصية
headerActions
والقيم في التخطيط المخصص، فسيتم عرض الرموز بالترتيب الافتراضي. - لإزالة أيقونات الرأس والوظائف المرتبطة بها من سطح المكتب، قم بتعيين قيمة فارغة لخاصية
headerActions
("headerActions": []
). ومع ذلك، إذا قمت بإضافة تطبيق Webex إلى جزء المعلومات المساعدة أو صفحة مخصصة، أو كأداة مخصصة، لا يزال بإمكان الوكيل الوصول إلى تطبيق Webex على الرغم من عدم توفر تطبيق Webex في الرأس الأفقي لسطح المكتب. - إذا تم تعيين قيمة الخاصية
webexConfigured
علىfalse
، فلن يتم عرض رمز Webex App على الرأس الأفقي لسطح المكتب، حتى إذا تمت إضافةwebex
القيمةفي headerActions
. لمزيد من المعلومات، راجع webexConfigured.
منطقة
تُعد خاصية المنطقة
القسم الأساسي لتخطيط سطح المكتب. يمكنك تحديد التخطيط حسب المنطقة.
"المنطقة": { "الرأس": { ... }, "advancedHeader: { { "comp": "widget-1", "attributes": { ... }, "النص": .... } }، "لوحة": { ... }، "ملاحة": { ... }، "مثابر": { ... }, "بدون رأس": { ... } },
يمكنك تكوين كائنات المنطقة التالية:
-
اللوحة: تمثل اللوحة الثانية أو اللوحة الموجودة في أقصى اليمين في جزء المعلومات المساعدة.
-
التنقل: يمثل الصفحات المخصصة وعناصر التنقل الخاصة بها والتي تتعلق بالصفحات.
-
مستمر: يمثل عناصر واجهة المستخدم على مستوى الصفحة التي تكون مستمرة ويتم عرضها على جميع صفحات سطح المكتب.
-
بدون رأس: يمثل الأدوات التي ليس لها واجهة مرئية، ولكنها تنفذ المنطق في الخلفية.
إذا تم تكوين خاصية advancedHeader، فيجب إزالة خصائص header وheaderActions.
رأس متقدم
لتخصيص الرؤية وتغيير ترتيب الأيقونات الموجودة في الرأس الأفقي لسطح المكتب. الترتيب الافتراضي هو كما يلي:
-
(Webex)
-
(مكالمة خارجية)
-
(مركز الإشعارات)
-
(محدد حالة الوكيل)
قم بتعيين قيمة الخاصية advancedHeader
كما يلي:
اسم الأيقونة |
قيمة خاصية headerActions |
---|---|
تطبيق Webex |
وكيل إكس ويبكس |
مكالمة طلب صادر |
وكيل x-outdial |
مركز الإعلام |
إشعارات Agentx |
محدد حالة الوكيل |
محدد حالة الوكيل x |
مثال:
"advancedHeader": [ { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } { "comp": "widget-1", "attributes": { ... }, "النص": .... } ]
قيمة الخاصية advancedHeader
حساسة لحالة الأحرف.
لتغيير الترتيب الافتراضي للرموز، أدخل الخاصية advancedHeader
والقيم في التخطيط المخصص وفقًا لذلك.
تتدفق الأدوات إلى القائمة المنسدلة من اليسار إلى اليمين.
-
إذا لم تقم بإدخال الخاصية
advancedHeader
في التخطيط المخصص، فسيتم عرض الرأس الافتراضي. -
عند تمكين الرأس المتقدم، يجب عليك نقل الأدوات من الرأس الحالي إلى الرأس المتقدم وفقًا للمثال.
-
عندما يتم تمكين الرأس المتقدم، لن يتم عرض الرأس القديم.
-
يحتوي كل رمز عنصر واجهة مستخدم على حشوة وهامش افتراضي يتم تعريفهما من خلال CSS ولا يمكن تخصيصهما من خلال سطح المكتب.
-
يعد موقع الشعار والعنوان وأيقونات الملف الشخصي ثابتًا ولا يمكن تخصيصه.
-
لإزالة أيقونات الرأس والوظائف المرتبطة بها من سطح المكتب، قم بتعيين قيمة فارغة للمكون المرتبط في الخاصية
advancedHeader
("advancedHeader": []
).إذا قمت بإضافة تطبيق Webex إلى جزء المعلومات المساعدة أو صفحة مخصصة، أو كأداة مخصصة، لا يزال بإمكان الوكيل الوصول إلى تطبيق Webex على الرغم من عدم توفر تطبيق Webex في الرأس الأفقي لسطح المكتب.
-
إذا قمت بإضافة عنصر واجهة مستخدم يحتوي على تسمية طويلة، فسيتم عرض اسم التسمية المقطوع وفقًا للمساحة المتوفرة.
يمكنك استخدام السمة
محتوى النص
لإضافة تسمية إلى عنصر واجهة المستخدم.مثال:
{ "comp": "timer-widget", "attributes": { "duration": "08:00:00" }, "textContent": "مؤقت العد التنازلي للوردية الحالية", "script": "https://wxcc-demo.s3.amazonaws.com/widgets/timer-widget.js" }
سيتم اقتطاع علامة "مؤقت العد التنازلي للوردية الحالية" وعرضها وفقًا للمساحة المتوفرة.
-
تجنب إضافة أدوات ذات تسمية طويلة.
-
عندما تنتقل الأداة إلى القائمة المنسدلة، يكون رمز الأداة فقط هو القابل للنقر.
-
-
إذا كان
تم تكوين webex
تم تعيين قيمة الخاصية على أنهاخطأ شنيع
، ال تطبيق Webex لا يتم عرض الرمز على رأس سطح المكتب الأفقي، حتى لو كانويبكس
تتم إضافة القيمة فيرأس متقدم
ملكية. لمزيد من المعلومات، انظر تم تكوين webex.
الصفحة الرئيسية
عند تسجيل الدخول إلى سطح المكتب، ستنتقل إلى الصفحة الرئيسية.
الصفحة الرئيسية مخصصة فقط للمشرفين وشخصيات SupervisorAgent.
يمكنك عرض الأدوات التالية على الصفحة الرئيسية. يتم توفير أدوات التحليل بشكل افتراضي، ولكن يمكن للمسؤول أيضًا تكوين أدوات ثابتة ومخصصة. لمزيد من المعلومات، انظر خصائص المستوى الأعلى لتخطيط JSON.
أدوات التحليل
بشكل افتراضي، يتم عرض أداة المحلل على الصفحة الرئيسية لسطح المكتب.
تكوين تخطيط الصفحة الرئيسية
بإمكانك تكوين الصفحة الرئيسية لسطح المكتب لعرض تخطيط يعتمد على تفضيلات مؤسستك ومواءمة العلامة التجارية. تعديل الصفحة الرئيسية حقل لتكوين الصفحة الرئيسية. يمكنك تكوين المكونات التالية لعرضها في الصفحة الرئيسية عندما يقوم المستخدم بتسجيل الدخول إلى سطح المكتب:
-
رسالة ترحيب
-
استخدم رمز المهمة على شريط التنقل للانتقال إلى جزء المهام. يتم عرض رمز المهمة لدور المشرف والمشرف والوكيل مع تمكين ميزة مراقبة المكالمات. يعرض جزء المهام طلبات العملاء الواردة، والتفاعلات النشطة والماضية مع العملاء، وطلبات المراقبة النشطة.
-
قم بتصفية الأقسام مثل اسم قائمة الانتظار، نوع القناة، و الفرق المُدارة.
يوضح الجدول التالي خصائص الصفحة المطلوبة لتكوين الصفحة الرئيسية:
ملكية |
الوصف والرمز |
---|---|
الصفحة > useFlexLayout |
تخطيط Flex هو مكون ويب جديد. لا يتم تغيير الأدوات الموجودة. يستخدم تخطيط Flex الجديد نفس تنسيق تكوين التخطيط بطريقة مبسطة. إنه متوافق مع الإصدارات السابقة ولا يؤثر على الأدوات الموجودة. يجب عليك تكوين تخطيط JSON. لتكوين تخطيط JSON، قم بتوفير الارتفاع والعرض للأداة. يتم عرض الأداة بنفس التسلسل الذي تم تكوينها به داخل تخطيط JSON. تحتوي الأدوات على هامش افتراضي يبلغ 8 بكسل. يعتمد تخطيط JSON على الأبعاد (العرض × الارتفاع) والإحداثيات (X وY وZ) للأدوات. يدعم التصميم المرن إمكانيات مثل تغيير حجم عناصر واجهة المستخدم الفردية، وتكبير عناصر واجهة المستخدم، وما إلى ذلك. يتم قياس ارتفاع الأدوات الفردية بالبكسل. 1 وحدة ارتفاع = 40 بكسل. يعتمد عرض الأداة على عدد الأعمدة الموجودة في الحاوية وعدد الأعمدة التي تتغير استنادًا إلى عرض الحاوية. يتم عرض الأدوات من اليسار إلى اليمين. يستخدم محرك التخطيط المتقدم منطقًا مخصصًا لتطبيق تعديل المساحة الأفقية والرأسية للأدوات. في البداية، يتم تحميل التخطيط أفقيًا. بعد التحميل أفقيًا، يتم تحميل الأداة عموديًا لضمان الاستخدام الأمثل للمساحة. قم بتكوين الأدوات بناءً على حجم الشاشة. يمكنك إما زيادة أو تقليل عرض الأدوات، استنادًا إلى حجم الشاشة. يؤدي هذا إلى جعل الأدوات أكثر قابلية للقراءة والاستخدام. يوفر تخطيط Flex نقاط توقف قياسية مثل الكبيرة والمتوسطة والصغيرة والصغيرة جدًا.
قد تختلف هذه البكسلات وفقًا لنظام التشغيل والمتصفح.
|
الصفحة > comp |
تأكد من توفير مكون مخصص فريد من نوعه.
يمثل مكون |
الصفحة > رأس الصفحة |
تأكد من تحديد سلسلة عنوان يمكن أن تكون ثابتة أو ديناميكية أو كليهما. يمثل مكون
|
الصفحة > pageSubHeader |
تأكد من إضافة عنوان فرعي يظهر على سطح المكتب. يمكن للمستخدم إضافة الانتقال إلى المحلل في العنوان الفرعي.
|
التنقل (الصفحات المخصصة)
في هذا القسم، يمكنك إضافة الصفحات التي تظهر على شريط التنقل الأيسر. يمكنك تحديد أيقونة تنقل وعنوان URL فريدًا للأداة لتظهر على شريط التنقل. نوصي باستخدام بادئة محددة لعنوان URL لتجنب التعارضات. لمزيد من التفاصيل، راجع خاصية الملاحة قسم.
يمكنك أيضًا الحصول على مجموعة من الأدوات التي يمكن عرضها على هذه الصفحة. يمكن أن تحتوي الصفحة على عنصر واجهة مستخدم واحد يظهر على الشاشة أو مجموعة من عناصر واجهة المستخدم في شبكة. لمزيد من التفاصيل حول ترتيب الشبكة، راجع خاصية التخطيط قسم.
لا تحتاج إلى إضافة غلاف منطقة ديناميكية إلى شجرة الأدوات. يعني هذا أنه بإمكانك سحب وإفلات عناصر واجهة المستخدم وتغيير حجمها على الصفحات المخصصة عند تمكين هذا الخيار.
المثال:
{ "nav": { "label": "صفحة مخصصة"، "icon": "معلومات مخزنة"، "iconType": "momentum"، "navigateTo": "علامات تبويب ديناميكية"، "align": "top"، "isDefaultLandingPage": true }, "page": { "id": "my - custom - page"، "useFlexLayout": true، "widgets": { "comp1": { "comp": "md-tabs"، "children": [{ "comp": "md-tab"، "textContent": "مؤقت التحويل"، "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": "مؤقت التحويل"، "maximizeAreaName": "app-maximize-area" } }] }, { "comp": "md-tab", "textContent": "سوق الأسهم", "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": { "slot": "panel" } } ] }، "comp2": { "comp": "my - google - maps - component"، "source": "https://my-cdn.com/my-google.maps.js "wrapper": { "title": "Google Map"، "maximizeAreaName": "app-maximize-area" } } }، "layout": { "areas": [ ["left", "right"] ]، "size": { "cols": [1, 1]، "rows": [1] } } } }،
يوضح الجدول التالي الملاحة و صفحة الخصائص مع خصائصها الفرعية:
ملكية |
الوصف والرمز |
---|---|
الملاحة > ملصق |
تشير هذه الخاصية إلى معرف التنقل في الصفحة. يقوم قارئ الشاشة بقراءة هذه الخاصية وتظهر في تلميح الأدوات. هذه المعلمات ضرورية لعرض صفحتك المخصصة على شريط التنقل.
ال |
التنقل > نوع الرمز |
تمثل هذه الخاصية نوع الرمز الذي يظهر في شريط التنقل للصفحة المخصصة. الأنواع التالية من الرموز متاحة:
|
أيقونة التنقل > |
تمثل هذه الخاصية اسم الرمز في مكتبة Momentum أو عنوان URL لشبكة CDN.
|
nav > محاذاة |
تساعدك هذه الخاصية على محاذاة الرمز إلى أعلى أو أسفل شريط التنقل. حاليًا، تسمح الخاصية بالمحاذاة العلوية فقط. |
nav > isDefaultLandingPage | تحدد هذه الخاصية صفحة الوصول الافتراضية للوكلاء في Agent Desktop. قم بتعيين هذه الخاصية إلى true لجعل صفحة شريط التنقل هي صفحة الوصول الافتراضية التي تظهر للوكلاء بعد تسجيل الدخول إلى Agent Desktop. إذا تم تعيين هذه الخاصية على true لأكثر من صفحة شريط تنقل، فسيعتبر النظام أن صفحة شريط التنقل الأولى هي صفحة الوصول الافتراضية. إذا لم يتم تعيين هذه الخاصية على true في أي صفحة شريط تنقل، فإن الصفحة الرئيسية تعمل كصفحة الوصول الافتراضية. لا يمكنك تعيين تقارير إحصائيات أداء الوكيل كصفحة الوصول الافتراضية. |
التنقل > انتقل إلى |
تحدد هذه الخاصية اسم الصفحة المخصصة. يظهر هذا الاسم في شريط العناوين عندما يقوم الوكيل بالتنقل. يجب ألا يتضمن ملف navigateTo القيم التالية: الصور، والخطوط، وcss، وbuild_info، والمساعدة، والتطبيق، وi18n، والأيقونات، والصور-mfe-wc، والأصوات.
|
ملكية |
الوصف والرمز |
---|---|
الصفحة > معرف |
في ال
|
الصفحة > استخدام FlexLayout |
تخطيط Flex هو مكون ويب جديد. لا يتم تغيير الأدوات الموجودة. يستخدم تخطيط Flex الجديد نفس تنسيق تكوين التخطيط بطريقة مبسطة. إنه متوافق مع الإصدارات السابقة ولا يؤثر على الأدوات الموجودة. يجب عليك تكوين تخطيط JSON. لتكوين تخطيط JSON، قم بتوفير الارتفاع والعرض للأداة. يتم عرض الأداة بنفس التسلسل الذي تم تكوينها به داخل تخطيط JSON. تحتوي الأدوات على هامش افتراضي يبلغ 8 بكسل. يعتمد تخطيط JSON على الأبعاد (العرض × الارتفاع) والإحداثيات (X وY وZ) للأدوات. يدعم التصميم المرن إمكانيات مثل تغيير حجم عناصر واجهة المستخدم الفردية، وتكبير عناصر واجهة المستخدم، وما إلى ذلك. يتم قياس ارتفاع الأدوات الفردية بالبكسل. 1 وحدة ارتفاع = 40 بكسل. يعتمد عرض الأداة على عدد الأعمدة الموجودة في الحاوية وعدد الأعمدة التي تتغير استنادًا إلى عرض الحاوية. يتم عرض الأدوات من اليسار إلى اليمين. يستخدم محرك التخطيط المتقدم منطقًا مخصصًا لتطبيق تعديل المساحة الأفقية والرأسية للأدوات. في البداية، يتم تحميل التخطيط أفقيًا. بعد التحميل أفقيًا، يتم تحميل الأداة عموديًا لضمان الاستخدام الأمثل للمساحة. قم بتكوين الأدوات بناءً على حجم الشاشة. يمكنك إما زيادة أو تقليل عرض الأدوات، استنادًا إلى حجم الشاشة. يؤدي هذا إلى جعل الأدوات أكثر قابلية للقراءة والاستخدام. يوفر تخطيط Flex نقاط توقف قياسية مثل الكبيرة والمتوسطة والصغيرة والصغيرة جدًا.
قد تختلف هذه البكسلات وفقًا لنظام التشغيل والمتصفح.
|
صفحة > أدوات صفحة > كومب |
يساعدك على تحديد عناصر واجهة المستخدم المخصصة الخاصة بك. لوضع عناصر واجهة مستخدم متعددة، حدد خيارات عناصر واجهة المستخدم بالتسلسل. تأكد من تسمية كل عنصر واجهة مستخدم باسم منطقة فريد. استخدمه في قسم التخطيط لاحقًا.
تمثل هذه الخاصية اسم عنصر HTML المخصص (المعروف باسم مكون الويب أو أي عنصر آخر - إذا كنت تريد استخدامه كغلاف). لمزيد من المعلومات، انظر أمثلة على حالات الاستخدام النموذجية. أدخل اسم العنصر المخصص هنا بدون أقواس زاوية ("<" أو ">"). على سبيل المثال، "my-custom-element". يدعم كل إدخال ضمن قسم الأدوات التنسيق التالي:
|
صفحة > نص |
(اختياري) هذه الخاصية مطلوبة فقط عند تحميل الأداة أو المكون من موقع بعيد مثل شبكة توصيل المحتوى (CDN).
لا تقم بتغيير عنوان URL للنص البرمجي لنفس المكون. إذا كنت بحاجة إلى تغيير عنوان URL للبرنامج النصي لنفس المكون، فقم بأحد الإجراءات التالية:
|
صفحة > ملكيات |
يمكنك تحديد الخصائص التي يجب عليك تمريرها لمكون الويب.
|
الصفحة > مستجيبة |
يحدد ما إذا كان مكون الويب أو عنصر واجهة المستخدم المستند إلى iFrame الذي تمت إضافته في التخطيط المخصص على مستوى الصفحة أو مستوى التكوين مستجيبًا. قم بتكوين هذه الخاصية باستخدام إحدى القيم التالية:
لا يمكن للأدوات غير المستجيبة ضمان أفضل تجربة للمستخدم ولا يتم عرضها في العرض الأصغر. يتعين على الوكيل زيادة حجم نافذة المتصفح لعرض أي عناصر واجهة مستخدم تم تكوينها على أنها غير مستجيبة. |
الصفحة > السمات |
يمكنك تحديد سمات مكون الويب في هذا القسم.
|
الصفحة > الرؤية |
يحدد ما إذا كانت عناصر واجهة المستخدم التي تقدمها Cisco المضافة في التخطيط المخصص على مستوى الأدوات التي تقدمها شركة Cisco هي سجل الاتصال، ونسخة Cisco Webex Experience Management, IVR، ودليل معاينة مكالمة الحملة، والشاشة المنبثقة.
|
الصفحة > الأطفال |
تعتبر هذه الخاصية الجزء الأساسي من التخطيط. في لمعرفة كيفية تمرير قيم STORE كخصائص، راجع مشاركة البيانات من سطح المكتب إلى الأدوات.
تتمثل ميزة قسم مجموعة "الأطفال" في أنه يمكنك استخدام مكونات الويب الموجودة في مواصفات التخطيط الخاصة بك، والتي تعد بالفعل جزءًا من مجموعة سطح المكتب. تتضمن بعض مكونات الويب الخاصة بحزمة سطح المكتب ما يلي:
لمزيد من المعلومات حول السمات الخاصة بعلامة التبويب الدائمة، راجع سمات علامات التبويب الدائمة. |
الصفحة > محتوى النص |
يساعدك على إضافة محتوى النص الخاص بك.
|
نمط الصفحة > |
يساعدك على تعيين نمط CSS معين لمكونك.
|
> غلاف الصفحة |
يتيح لك غلاف الأداة إضافة شريط أدوات أعلى الأداة الخاصة بك. يمكن أن يحتوي شريط الأدوات على عنوان و تأكد من استخدام القيمة الافتراضية "app-maximize-area". حاليًا، القيمة الافتراضية فقط هي المتاحة.
|
صفحة > الغلاف> المعرف |
(اختياري) يسمح لك غلاف عنصر واجهة المستخدم الرسومية لمكون الويب بتحديث عنوان عنصر واجهة المستخدم الديناميكي باستخدام معرف فريد. أدخل غلاف الأداة
تأكد من استخدام نفس المعرف الفريد لـ JavaScript CustomEvent. لمزيد من المعلومات، راجع الأحداث غير المتزامنة قسم في وحدة اتصال الوكيل فصل من Cisco Webex Contact Center مطور سطح مكتب. لتحديث عنوان عنصر واجهة المستخدم المستند إلى iFrame، استخدم محتوى iFrame من نفس المجال. وفيما يلي مثال على ذلك:
|
الصفحة > agentx-wc-iframe |
يتيح لك تضمين صفحة ويب في iFrame تظهر كأداة على سطح المكتب. يمكنك استخدام أداة iFrame المسماة "agentx-wc-iframe".
|
تخطيط الصفحة | يسمح لك بترتيب الأدوات على الصفحة. يمثل التنسيق التالي تخطيط الشبكة:
هنا يمكنك تعريف الشبكة بأسماء المناطق التي قمت بتعريفها في قسم الأدوات . يوضح المثال التالي كيفية تحديد تخطيط ثلاثة صفوف وثلاثة أعمدة:
![]() في قسم الحجم، تمثل الأرقام جزء المساحة التي يمكن أن تشغلها الأداة، نسبة إلى الأدوات الأخرى. تشغل الأعمدة الثلاثة جزءًا متساويًا من المساحة. مع عرض متاح بنسبة 100%، تشغل كل أداة 33.33% من المساحة الأفقية. ![]() مثال آخر لحالة الاستخدام، إذا قمت بتعيين "الأعمدة": [1، 2، 2]، فهذا يعني أن المساحة الإجمالية مقسمة على 5 (1+2+2) وأن الأداة الأولى تشغل 20% من المساحة الأفقية. الأداة الثانية والثالثة تأخذ 40% لكل منهما. لمزيد من المعلومات، راجع المفاهيم الأساسية لتخطيط الشبكة. ![]() |
الصفحة > الجذر |
يُطلق على تعشيش التخطيطات اسم التخطيط الفرعي. في حالة وجود تخطيطات متداخلة في تكوين التخطيط الخاص بك، يجب أن يكون لديك كائن "ROOT" واحد كعنصر أساسي للتخطيطات الفرعية. بخلاف ذلك، يمكن أن يكون تكوين التخطيط الخاص بك مسطحًا إذا لم يكن التعشيش مطلوبًا. يوفر هذا التخطيط الفرعي مزيدًا من التحكم في سلوك تغيير حجم التخطيط. يجب أن تكون خاصية تخطيط الصفحة من نوع Record<string, Layout>. تتيح لك خاصية التخطيط ترتيب الأدوات على الصفحة.
يؤدي هذا الإعداد إلى إنشاء شبكة في تخطيط ROOT تحتوي على شبكتين فرعيتين يمكنك تغيير حجمهما بشكل مستقل. ![]() يؤثر تغيير حجم أحد المكونات على المكونات الموجودة داخل هذا التخطيط الفرعي. ![]() كن على علم بالحالات التالية: حلقة لا نهائية: إذا قمت بتضمين تخطيط ROOT كتخطيط فرعي لـ ROOT، فسوف يتسبب ذلك في حدوث خطأ "تجاوز مكدس النداء" ويؤدي إلى حلقة لا نهائية.
![]() نفس التخطيط الفرعي (N) مرة: إذا قمت بتضمين التخطيط الفرعي في شبكتك أكثر من مرة بنفس الاسم، وإذا قمت بتغيير حجم أحدها، فسيتم تغيير حجم جميع التخطيطات الفرعية تلقائيًا. إذا لم يكن هذا هو السلوك المطلوب، فقم بإعادة تسمية كل تخطيط فرعي باسم فريد.
![]() |
سمات علامات التبويب الدائمة
لتعيين علامات التبويب في الصفحات المخصصة والأدوات المخصصة على أنها دائمة، أدخل السمات لـ md-tabs
في التخطيط المخصص.
مثال: تعيين علامات التبويب كعلامات تبويب دائمة
{ "comp": "md-tabs"، "attributes": { "persist-selection": true، "tabs-id": "معرف فريد لجميع علامات التبويب معًا في الحاوية" }, }
ملكية |
الوصف |
---|---|
استمرار التحديد |
لتعيين |
معرف علامات التبويب |
تعريف فريد لجميع علامات التبويب معًا في الحاوية. |
عندما تقوم بتعيين md-tabs
ليكون ثابتًا (persist-selection: true
)، يحتفظ Agent Desktop باختيار علامة التبويب حتى إذا قام أحد الوكلاء بالتبديل بين الصفحات أو الأدوات في سطح المكتب.
- ال
استمرار التحديد
لا تنطبق الخاصية على علامات التبويب الموجودة في جزء المعلومات المساعدة وصفحة تقارير إحصائيات أداء العميل، لأن سلوك علامة التبويب الدائمة تم تعيينه بالفعل في سطح المكتب. - يتم إعادة تعيين اختيار علامة التبويب إلى علامة التبويب الافتراضية عند تسجيل الخروج من سطح المكتب، أو إعادة تحميل/تحديث المتصفح، أو مسح ذاكرة التخزين المؤقت للمتصفح.
تكوين أدوات واجهة المستخدم الثابتة
يمكنك تكوين أي عنصر واجهة مستخدم مخصص ليكون مستمرًا. يتم عرض عناصر واجهة المستخدم الثابتة على جميع صفحات سطح المكتب. تظهر عناصر واجهة المستخدم الثابتة كعلامة تبويب جديدة في جزء المعلومات المساعدة فقط عندما يكون لديك طلب اتصال نشط أو محادثة. على سبيل المثال، عينة مستمرة القطعة.
لا يتم عرض الأدوات المساعدة الثابتة على الصفحة الرئيسية بالطريقة التي يتم عرضها بها على الصفحات الأخرى. ومع ذلك، إذا كان لديك تفاعل نشط، فسيتم عرض عناصر واجهة المستخدم الثابتة في الصفحة الرئيسية كجزء من جزء المعلومات المساعدة. على سبيل المثال، عند الرد على مكالمة، يتم عرض جزء "التحكم في التفاعل" و عينة مستمرة يتم عرض الأداة كجزء من جزء المعلومات المساعدة.
المثال:
"المنطقة": { "مستمر": [{ "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": { "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" }, "wrapper": { "title": "AgentX iFrame، "maximizeAreaName": "app-maximize-area" } }، "comp2": { "comp": "uuip-widget-two"، "script": "./dynamic-widgets/widget-two.js"، "attributes": { "title": "محتوى الأداة 2" }، "wrapper": { "title": "عنوان الأداة 2"، "maximizeAreaName": "app-maximize-area" } } }، "layout": { "areas": [ ["comp1"، "comp2"] ]، "size": { "cols": [1, 1]، "rows": [1] } } } }] } ] }
عند تخصيص عنصر واجهة مستخدم، يمكنك اختيار أحد الخيارين التاليين:
-
استضافة تطبيق على صفحة ويب يمكن تضمينها داخل إطار مضمن.
-
إنشاء عنصر واجهة مستخدم مخصص.
يتم وصف متطلبات الأداة التقنية في وثائق تطوير أدوات سطح المكتب. باعتبارك محرر تخطيط، تأكد من أن لديك التفاصيل التالية:
-
ما هو اسم عنصر HTML المخصص (المعروف باسم مكون الويب)؟
-
ما هو عنوان URL لمصدر شبكة توصيل المحتوى (CDN) الذي يستضيف حزمة JavaScript؟
أدوات الرأس
يتم استخدام الرأس لعرض المعلومات المضمنة، وإضافة القوائم المنسدلة، وما إلى ذلك. نظرًا لأن حاوية الرأس تحتوي على مساحة رأسية محدودة، فإن الارتفاع الإجمالي للرأس هو 64 بكسل فقط. لمزيد من المعلومات حول محاذاة التخطيط، راجع قسم خصائص التخطيط .
المثال:
"الرأس":{ "المعرف": "الرأس"، "الأدوات":{ "الرأس1":{ "الرسم": "رأس-الأداة-واحد"، "النص": "https://my-cdn.com/dynamic-widgets/header-widget-one.js"، }، "الرأس2":{ "الرسم": "رأس-الأداة-اثنين"، "النص": "https://my-cdn.com/dynamic-widgets/header-widget-two.js"، }، "التخطيط":{ "المناطق":[[ "الرأس1"، "الرأس2" ]]، "الحجم": { "الأعمدة": [1، 1]، "الصفوف": [1] } } }
لإضافة تلميح أداة لعنصر واجهة المستخدم الرسومية، قم بتغليف المكون باستخدام md-tooltip
. أدخل معلومات التلميح في خاصية الرسالة
.
المثال:
"الرأس": { "المعرف": "رأس dw"، "الأدوات": { "الرأس1": { "comp": "md-tooltip"، "السمات": { "الرسالة": "Netlify" }، "الأطفال": [{ "comp": "agentx-wc-iframe"، "السمات": { "src": "https://keen-jackson-8d352f.netlify.app" } }] }, }, }
يجب عليك إضافة سمات النمط display
و height
لتكوين أي عناصر واجهة مستخدم من خلال iFrame في منطقة عناصر واجهة المستخدم القابلة للتخصيص في الرأس. القيمة الأفضل لسمة الارتفاع
هي 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 نص
-
رحلة تجربة العملاء
-
سكرين بوب
يمكنك استخدام جزء المعلومات المساعدة للقيام بما يلي:
-
إضافة علامات التبويب
-
تغيير ترتيب علامات التبويب
-
إزالة علامات التبويب المحددة مسبقًا
-
قم بتمييز علامات التبويب المخصصة على أنها قابلة للسحب
-
إضافة تلميحات الأدوات إلى علامات التبويب المخصصة
-
أضف خيار إعادة تعيين ترتيب علامات التبويب
المثال:
"لوحة": { "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 أداة" } ] }, { "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": { "المناطق": [ ["comp1"]، ["comp2"] ]، "الحجم": { "الأعمدة": [1]، "الصفوف": [1، 1] } } } } }] } ] },
بإمكانك تكوين أداة رحلة تجربة العميل بعد تمكين مقاييس إدارة تجربة العميل على بوابة الإدارة.
في جزء المعلومات المساعدة، أضف علامات تبويب جديدة لوضع عناصر واجهة المستخدم المخصصة الخاصة بك. لا تنطبق قواعد خاصة هنا ويتم تعشيش المكونات كما هو متوقع وموصوف في قسم الأطفال
. لمزيد من المعلومات، راجع خاصية الأطفال في الصفحة.
وفيما يلي أمثلة محددة لتخصيص رؤوس علامات التبويب الخاصة بك:
مثال لوضع الأيقونات والعلامات في خاصية الأطفال
{ "comp": "md-tab", "attributes": { "slot": "tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "transcript_16" } }, { "comp": "span", "textContent": "علامة تبويب أدواتي" } ], },
مثال لوضع الصورة (باستخدام 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": "علامة تبويب أدواتي" } ] }], },
ال المزيد من علامات التبويب تظهر القائمة المنسدلة تلقائيًا عندما تحتوي لوحة المعلومات المساعدة على علامات تبويب متعددة.
يجب عليك إضافة تلميح علامة تبويب مخصص لسهولة القراءة وإمكانية الوصول. لإضافة تلميح أداة لعلامة تبويب مخصصة، قم بتغليف المكون بـ تلميح أداة md
. أدخل معلومات تلميح الأدوات في رسالة
الممتلكات وتطبيقها أسلوب
قيم الخصائص كما هو موضح في المثال التالي.
"comp": "md-tooltip"، "attributes": { "class": "widget-tabs"، "message": "نموذج علامة تبويب 1"، "style": "الحد الأقصى للعرض: 252 بكسل؛ الحد الأدنى للعرض: 110 بكسل؛ تجاوز السعة: مخفي؛ تجاوز النص: علامات الحذف؛ المسافة الفارغة: nowrap؛ العرض: كتلة مضمنة؛ الهامش السفلي: -10 بكسل؛" },
بالنسبة لعلامة التبويب المخصصة، نوصي بعرض أقصى يبلغ 252 بكسل وعرض أدنى يبلغ 110 بكسل.
لتفعيل ميزة السحب والإفلات داخل علامة التبويب المخصصة، أضف الخاصية التالية داخل صفات
:
"comp": "md-tabs"، "attributes": { "class": "widget-tabs"، "draggable": صحيح، "comp-unique-id": "sample-dynamic-custom-tabs" },
-
قابلة للسحب
:ضبطقابلة للسحب
قيمة الممتلكات إلى حقيقي. -
معرف فريد للشركة
:أدخل قيمة فريدة لتحديد المكون.المثال:
"comp-unique-id": "عينة من علامات التبويب الديناميكية المخصصة"
إذا قمت بتمكين السحب والإفلات لعلامة تبويب مخصصة، فيمكن للوكيل سحب علامة التبويب وإفلاتها إلى الموضع المطلوب داخل جزء المعلومات المساعدة. لإعادة تعيين علامات التبويب إلى ترتيب علامات التبويب الافتراضي، أضف الخاصية التالية:
"comp": "agentx-wc-more-actions-widget"، "attributes": { "slot": "settings"، "class": "widget-pane"، "tabs-unique-id": "sample-dynamic-custom-tabs" },
-
أداة agentx-wc-more-actions
:أدخل المكون الذي يتم عرضه كـ المزيد من الإجراءات () الرمز في جزء المعلومات المساعدة.
-
slot="settings"
: أدخل سمة داخل المكون الذي يتم عرضه كخيار إعادة تعيين ترتيب علامات التبويب في القائمة المنسدلة مزيد من الإجراءات . يمكن للوكلاء إعادة تعيين علامات التبويب في جزء المعلومات الإضافية إلى الترتيب الافتراضي بالنقر فوق> إعادة تعيين ترتيب علامات التبويب.
-
tabs-unique-id
: أدخل نفس القيمة الفريدة المحددة لخاصيةcomp-unique-id
لتعيين مكونات md-tabsوإعادة تعيينها
.
يستخدم نموذج التعليمات البرمجية التالي الدالتين مزيد من الإجراءات وإعادة تعيين ترتيب علامات التبويب.
"comp": "agentx-wc-more-actions-widget"، "السمات": { "فتحة": "إعدادات"، "فئة": "جزء عنصر واجهة المستخدم"، "علامات تبويب فريدة من نوعها": "عينة-ديناميكية-مخصصة-علامات تبويب" }، "تابعون": [{ "شركات": "div"، "سمات": { "textContent": "إجراء مخصص"، "فتحة": "إجراء مخصص" }، "أطفال": [{ "شركات": "agentx-wc-notes-header-widget" }، { "شركات": "agentx-wc-menu-notification" } ] }]، }

بشكل افتراضي، يتم تعريف تلميح الأداة وأيقونة علامة القطع وإعادة تعيين ترتيب علامات التبويب لعلامات التبويب المعرفة مسبقا.
يمكن توسيع القائمة المنسدلة المزيد من الإجراءات لإضافة مكونات أو عناصر واجهة مستخدم مخصصة إضافية بعد خيار إعادة تعيين ترتيب علامات التبويب . فيما يلي مجموعة نموذجية من قيم خصائص النمط
التي يمكن تطبيقها على مكونات إضافية.
"comp": "md-tooltip" ، "السمات": { "الفئة": "علامات تبويب عنصر واجهة المستخدم" ، "الرسالة": "عنصر العينة" ، "النمط": "الحد الأقصى للعرض: 252 بكسل ؛ الحد الأدنى للعرض: 110 بكسل ؛ الفائض: مخفي. تجاوز النص: علامة القطع. مساحة بيضاء: nowrap ؛ عرض: كتلة مضمنة. الهامش السفلي: -10 بكسل ؛" } ،

ميزة السحب والإفلات غير مدعومة للمكونات أو عناصر واجهة المستخدم المخصصة الإضافية التي تتم إضافتها إلى القائمة المنسدلة مزيد من الإجراءات .
الحاجيات مقطوعة الرأس
في قسم مقطوعة الرأس ، يمكنك إضافة عناصر واجهة مستخدم مخفية ولا تظهر على Agent Desktop. تستخدم هذه الأدوات لتنفيذ المنطق في الخلفية. يفيد هذا القسم في تشغيل الأحداث التي تحدث على سطح المكتب وتنفيذ المنطق الخاص بعنصر واجهة المستخدم. على سبيل المثال ، فتح CRM Screen Pop مخصص للحصول على SMS عند وصوله.
المثال:
"مقطوعة الرأس":{ "id":"مقطوعة الرأس", "widgets":{ "comp1":{ "comp":"مقطوعة الرأس-widget-one", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-one.js", }, "comp2":{ "comp":"مقطوعة الرأس-اثنان", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-two.js", } }, "layout":{ "المناطق":[[ "comp1", comp2"]], "الحجم": { "cols": [1, 1], "الصفوف": [1] } } }
مشاركة البيانات من سطح المكتب إلى الأدوات
لتلقي بيانات في الوقت الفعلي من خلال الخصائص أو السمات داخل عنصر واجهة مستخدم مخصص، قم بتعيين قيم STORE المناسبة في تكوين JSON للتخطيط.
بالإضافة إلى ذلك ، للوصول إلى البيانات من خلال مشتركي JavaScript SDK ، يمكنك أيضا تمرير البيانات من خلال الخصائص أو السمات. إذا تم تصميم المكون الخاص بك للتفاعل مع تغييرات الخاصية أو السمة، فستحصل على تحديثات البيانات في الوقت الفعلي من Agent Desktop، وهو ما يسمى موفر البيانات.
حاليا ، لدينا مزود بيانات واحد تحت متجر رئيسي. لمزيد من المعلومات، راجع موفر البيانات - قسم خصائص وسمات عنصر واجهة المستخدم في 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" } ]
دليل المكالمات
يتم عرض عنصر واجهة المستخدم "دليل المكالمات" في جزء "المعلومات المساعدة" على سطح المكتب. يعرض دليل المكالمات الأسئلة والأجوبة على مستوى الحملة. يطلب من الوكيل قراءة مجموعة الأسئلة في دليل المكالمات وإرسال الردود.
المثال:
"لوحة":{ "comp":"md-tabs", "سمات":{ "class":"widget-tabs" }, "children":[ { "comp":"md-tab", "attributes":{ "slot":"tab", "class":"widget-pane-tab" }, "children":[ { "comp":"md-icon", "attributes":{ "name":"icon-note_16" } }, { "comp":"span", "textContent":"Call Guide" } ], "visibility":"CALL_GUIDE" }, { "comp":"md-tab-panel", "attributes":{ "slot":"panel", "class":"widget-pane" }, "children":[ { comp": "acqueon-call-guide", "script": "http://localhost:5555//index.js", // include CDN link here " wrapper":{ "title":"Call Guide", "maximizeAreaName":"app-maximize-area" }, "properties":{ "lcmKey":"$STORE.agentContact.getCallGuideProps.LCMKey", "agentDbId":"$STORE.agent.acqueonAgentId", "lcmUrl":"$STORE.agent.lcmUrl", "campaignManagerAdditionalInfo":"$STORE.agent.campaignManagerAdditionalInfo" "orgId": "$STORE.agent.orgId", "dialerProxyHost": "$STORE.envVaribles.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featureFlags.isProgressiveCampaignEnabled" } } ], "الرؤية":"CALL_GUIDE" } ] }
- تم تغيير مراجع خصائص comp
التالية
.يتم استبدال AgentX
في قيمة العقار بacqueon
:تمت إعادة تسمية AgentX-preview-campaign
إلىAcqueon-Preview-campaign
تمت إعادة تسمية AgentX-Call-Guide
إلىAcqueon-Call-Guide
- يجب عليك استضافة القائمة ومدير الحملة (LCM) على CDN ثم تحديد عنوان URL في
خاصية البرنامج النصي
.
انبثاق الشاشة
في "تخطيط سطح المكتب"، يمكنك تكوين "الشاشة المنبثقة" بإحدى الطرق التالية:
-
كصفحة مخصصة
-
كأحد الأدوات في الصفحة المخصصة
-
كعلامة تبويب في جزء المعلومات الإضافية
يتم عرض نافذة الشاشة المنبثقة على سطح المكتب بناء على العوامل التالية:
بالنسبة للقناة الصوتية:
-
التكوين المحدد في "تخطيط سطح المكتب"
-
نشاط الشاشة المنبثقة المحدد في مصمم التدفق
بالنسبة للقنوات الرقمية الجديدة:
-
التكوين المحدد في "تخطيط سطح المكتب"
-
عقدة الشاشة المنبثقة المحددة في Connect Flow Builder
لمزيد من المعلومات حول تكوين الشاشة المنبثقة، راجع الشاشة المنبثقة.
تكوين الشاشة المنبثقة في شريط التنقل
يمكنك تكوين Screen Pop كصفحة مخصصة، أو كأحد عناصر واجهة المستخدم في صفحة مخصصة. للوصول إلى صفحة Screen Pop المخصصة، انقر فوق رمز Screen Pop على شريط التنقل. للوصول إلى عنصر واجهة مستخدم Screen Pop في الصفحة المخصصة، انقر فوق الرمز المخصص على شريط التنقل. لمزيد من المعلومات حول خصائص التنقل
، راجع التنقل (الصفحات المخصصة).
مثال: انبثاق الشاشة كصفحة مخصصة
{ "التنقل": { "التسمية": "الشاشة المنبثقة"، "الأيقونة": "المنبثقة"، "iconType": "الزخم"، "navigateTo": "/screenpop"، "المحاذاة": "top" }، "الصفحة": { "id": "agentx-wc-screen-pop"، "عناصر واجهة المستخدم": { "comp1": { "comp": "agentx-wc-screen-pop"، "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" } } }، "layout": { "المناطق": [ ["comp1"] ]، "الحجم": { "cols": [1]، "الصفوف": [1] } }، "الرؤية": "SCREEN_POP" }
مثال: نافذة منبثقة الشاشة كعنصر واجهة مستخدم في الصفحة المخصصة
"comp1": { "comp": "agentx-wc-screen-pop", "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" }
إذا لم يتم تكوين نافذة الشاشة المنبثقة في مصمم التدفق، فستظهر الصفحة المخصصة فارغة. لمزيد من المعلومات حول تكوين الشاشة المنبثقة في مصمم التدفق، راجع الشاشة المنبثقة.
تكوين الشاشة المنبثقة في جزء المعلومات الإضافية
يمكنك تكوين الشاشة المنبثقة لتظهر كعلامة تبويب في جزء المعلومات المساعدة.
بشكل افتراضي، تظهر نافذة الشاشة المنبثقة كعلامة تبويب فرعية جديدة في علامة تبويب الشاشة المنبثقة في جزء المعلومات الإضافية إذا تم تكوين نافذة الشاشة المنبثقة ليتم عرضها كسطح مكتب داخلي في مصمم التدفق.
أضف السمة التالية في قسم اللوحة
لتضمين 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 التالية:
- مصمم التدفق—عرض الإعدادات كما في علامة تبويب المتصفح الجديدة
- تخطيط سطح المكتب—كعلامة تبويب في جزء المعلومات الإضافية
عند حدوث الحدث الذي تم تكوين نافذة منبثقة الشاشة من أجله ، يتم عرض نافذة الشاشة المنبثقة خارج سطح المكتب - أي في علامة تبويب متصفح جديدة.
أمثلة على حالات الاستخدام النموذجية
-
تكوين عنصر واجهة مستخدم مقاييس إدارة تجربة العملاء والوصول إليه من شريط التنقل
-
جزء المعلومات الإضافية الافتراضي مع محفوظات جهات الاتصال ونافذة منبثقة على الشاشة
-
جزء المعلومات الإضافية مع عنصر واجهة مستخدم رحلة تجربة العملاء
تكوين عنصر واجهة مستخدم مقاييس إدارة تجربة العملاء والوصول إليه من شريط التنقل
المثال:
{ "التنقل": { "التسمية": "مقاييس إدارة تجربة العملاء"، "الأيقونة": "/التطبيق/الصور/wxm.bcd45cc3.svg"، "iconType": "أخرى"، "navigateTo": "wxm-metrics"، "المحاذاة": "top" }، "الصفحة": { "id": "wxm-metrics"، "عناصر واجهة المستخدم": { "comp1": { "comp": "agentx-wc-cloudcherry-widget"، "السمات": { "المقاييس": true }، "خصائص": { "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] } } } },
للحصول على معرف المسافة ومعرف المقاييس، راجع Webex Experience Management الوثائق.
استخدام علامات التبويب في الصفحة المخصصة
المثال:
{ "التنقل": { "التسمية": "علامات التبويب الديناميكية"، "الرمز": "المعلومات المخزنة"، "iconType": "الزخم"، "التنقل إلى": "علامات التبويب الديناميكية"، "المحاذاة": "أعلى" }، "الصفحة": { "id": "page-id-tabs"، "عناصر واجهة المستخدم": { "comp1": { "comp": "md-tabs"، "الأطفال": [{ "comp": "md-tab"، "textContent": : "واحد"، "سمات": { "فتحة": "علامة التبويب" } }، { "شركات": "md-tab-panel"، "سمات": { "فتحة": "لوحة" }، "أطفال": [{ "شركات": "عنصر واجهة المستخدم اثنان"، "البرنامج النصي": "http:/my-cdn.com/dynamic-widgets/widget-two.js" }] }، { "شركات": "md-tab"، "textContent": "اثنان"، "سمات": { "فتحة": "علامة تبويب" } }, { "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] } } } }
جزء المعلومات الإضافية الافتراضي مع محفوظات جهات الاتصال والشاشة المنبثقة
المثال:
"اللوحة": { "شركات": "علامات تبويب md"، "السمات": { "الفئة": "علامات تبويب عنصر واجهة المستخدم" }، "الأطفال": [{ "شركات": "MD-tab"، "السمات": { "فتحة": "علامة التبويب"، "الفئة": "علامة تبويب جزء واجهة المستخدم" }، "الأطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "CONTACT_HISTORY_TAB" }] }، { "شركات": "md-tab-panel"، "السمات": { "فتحة": "لوحة"، "فئة": "جزء عنصر واجهة المستخدم" }، "الأطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "CONTACT_HISTORY" } }] }، ] }، { "شركات": "MD-tab"، "السمات": { "فتحة": "علامة التبويب"، "الفئة": "جزء عنصر واجهة المستخدم" }, { "comp": "md-tab", "السمات": { "فتحة": "tab", "class": "widget-pane-tab" }, "الأطفال": [{ "comp": "فتحة", "السمات": { "name": "SCREEN_POP_TAB" } }], "الرؤية": "SCREEN_POP" }, { "comp": "md-tab-panel"، "السمات": { "فتحة": "لوحة"، "فئة": "جزء واجهة المستخدم" }، "الأطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "SCREEN_POP" } }]، "الرؤية": "SCREEN_POP" } }،
جزء المعلومات الإضافية مع عنصر واجهة مستخدم رحلة تجربة العملاء
المثال:
"اللوحة": { "comp": "md-tabs" ، "السمات": { "الفئة": "علامات تبويب عنصر واجهة المستخدم" } ، "الأطفال": [{ "comp": "md-tab" ، "السمات": { "فتحة": "علامة التبويب" } ، "الأطفال": [{ "comp": "فتحة" ، "السمات": { "الاسم": "WXM_JOURNEY_TAB" }] ، "الرؤية": "WXM_JOURNEY" } ، { "comp": "md-tab-panel" ، "السمات": { "فتحة": "لوحة" ، "فئة": "جزء عنصر واجهة المستخدم" } ، "الأطفال": [{ "comp": "agentx-wc-cloudcherry-widget" ، "خصائص": { "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": { "فتحة": "لوحة"، "فئة": "جزء عنصر واجهة المستخدم" }، "أطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "CONTACT_HISTORY" } }] }، { "شركات": "MD-tab"، "السمات": { "فتحة": "علامة التبويب"، "الفئة": "عنصر واجهة المستخدم-جزء-علامة التبويب" }، "الأطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "SCREEN_POP_TAB" } }]، "الرؤية": "SCREEN_POP" }، { "شركات": "MD-tab-panel"، "السمات": { "فتحة": "لوحة"، "فئة": "جزء عنصر واجهة المستخدم" }، "الأطفال": [{ "شركات": "فتحة"، "سمات": { "الاسم": "SCREEN_POP" } }]، "الرؤية": "SCREEN_POP" } "الرؤية": "SCREEN_POP" }, },
الترجمه
فيما يلي اللغات المدعومة:
البلغارية والكاتالونية والصينية (الصين) والصينية (تايوان) والكرواتية والتشيكية والدنماركية والهولندية والإنجليزية (المملكة المتحدة) والإنجليزية (الولايات المتحدة) والفنلندية والفرنسية والألمانية والمجرية والإيطالية واليابانية والكورية والنرويجية والبولندية والبرتغالية (البرازيل) والبرتغالية (البرتغال) والرومانية والروسية والصربية والسلوفاكية والسلوفينية والإسبانية والسويدية والتركية.
تعتمد لغة واجهة مستخدم سطح المكتب على إعدادات تفضيلات اللغة في المستعرض الخاص بك. على سبيل المثال ، دعنا نعتبر أنك حددت اللغة المفضلة كلغة فرنسية على متصفح Firefox. عند تشغيل سطح المكتب في متصفح Firefox ، تظهر واجهة مستخدم سطح المكتب باللغة الفرنسية (الفرنسية). ومع ذلك، لا يتم ترجمة الرأس الأفقي وشريط التنقل والمكونات الأخرى المضافة في "تخطيط سطح المكتب" استنادا إلى إعدادات تفضيلات اللغة في المستعرض الخاص بك.
توطين مكونات سطح المكتب
لترجمة مكونات سطح المكتب،
-
استخدم مفاتيح الترجمة الموجودة المعينة في
ملف app.json
. إذا لم يتم تعيين مفاتيح الترجمة، يتم استخدام اللغة الافتراضية الإنجليزية (الولايات المتحدة). يمكنك إرسال طلب خدمة إلى فريق دعم Cisco لإضافة مفتاح ترجمة إلىملف app.json
.مثال: مفتاح الترجمة
{ "مشترك": { "buttonTitle": "إيقاف المؤقت" } }
-
أدخل الخاصية التالية حساسة لحالة الأحرف في ملف JSON لتخطيط سطح المكتب لترجمة مكون:
"محتوى النص": "$I 18N.<مفتاح>" ،
where <key> يشير إلى مفتاح الترجمة المقابل في
ملف 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", } }, }, }
مثال: ترجمة مكون علامة التبويب في جزء المعلومات الإضافية
"لوحة": { "شركات": "md-tab", "السمات": { "فتحة": "tab" }, "الأطفال": [{ "comp": "span", "textContent": "$I 18N.panelTwo.screenPopTitle" }] }