إضافة إجراءات إلى قائمة عقود الخدمة

يمكنك استخدام VB Studio لإضافة إجراءات مخصصة إلى عقود الخدمة التي تظهر في "خريطة الاستهلاك بعقد الخدمة"، والتي تتوفر في علامة تبويب "الاستهلاك" من العرض الشامل للحساب. هذه الشاشة متوفرة في مبيعات تجارب العملاء للخدمات والمرافق.


توضح هذه الصورة مكان عرض قائمة الإجراءات في خريطة الاستهلاك بعقد الخدمة.

يمكنك إضافة أنواع الإجراءات هذه:

  • إجراء "فتح عنوان URL"
  • إجراء "التنقل إلى الصفحة"
  • إجراء الحدث المخصص

يوضح هذا المثال كيفية إضافة إجراء فتح عنوان URL أو إجراء التنقل إلى صفحة أو إجراء مخصص إلى القائمة.

يفترض هذا المثال أن القارئ على دراية بالعرض الشامل للحساب ويفهم كيفية استخدام Visual Builder. لمزيد من المعلومات، راجع:

مثال: إضافة عنصر قائمة إجراءات إلى ملخص حساب الفوترة

  1. قم بتسجيل الدخول إلى مبيعات تجارب العملاء للخدمات والمرافق كمسؤول وانتقل إلى العرض الشامل للحساب.

  2. ابحث عن حساب فوترة وحدده للوصول إلى "لوحة معلومات العميل".
  3. انقر فوق القائمة الموجودة أعلى يمين الصفحة وحدد تحرير الصفحة في Visual Builder Studio.

  4. حدد مساحة العمل وانقر تحديد. لاحظ أنه يمكنك أيضًا إنشاء مساحة عمل جديدة إذا لزم الأمر.

  5. في لوحة "واجهات مستخدم التطبيقات"، قم بتوسيع مقطع خريطة-الاستهلاك بعقد-الخدمة.

  6. حدد مقطع نموذج-إجراء-المستخدم-e11y وقم بتكوينه.
  7. حدد علامة التبويب الفرعية المتغيرات لعرض الثوابت والمتغيرات.

  8. انقر فوق الثابت USER_ACTION_CONTEXT_LIST.

  9. على الجانب الأيمن من الشاشة، أدخل عينة التعليمات البرمجية التالية في حقل القيمة الافتراضية، مع التأكد من تضمين أي معلمات مضمنة في عينة التعليمات البرمجية في عنوان URL الخاص بك أيضًا.

    [
    {
    "id": "CUSTOM_ACTION_NAME",
    "label": "Custom Menu Label",
    "active": true,
    "context": {
    "type": "Url",
    "url": "https://custommenuname.html?component=${component}&demo=${demo}&testId=${testId}",
    "params": [
    {
    "name": "component",
    "value": "menu"
    },
    {
    "name": "demo",
    "value": "overview"
    },
    {
    "name": "testId",
    "scope": "ext"
    }
    ]
    }
    }
    ]

    ملاحظة:

    يمكنك أيضًا إضافة إجراء "التنقل إلى الصفحة" عن طريق استبدال عينة التعليمات البرمجية أعلاه بعينة التعليمات البرمجية هذه:
    [
    {
    "id": "CUSTOM_ACTION_NAME",
    ...
    },
    {
        "id": "NAVIGATE_ACTION_NAME",
        "label": "Navigate to activities page",
        "active": true,
        "context": {
            "type": "InAppNavigation",
            "appName": "cx-sales",
            "appPage": "application/container/accounts/accounts-detail",
            "windowName": "_blank",
            "params": [
                {
                    "name": "puid",
                    "alias": "keyAccountPartyNumber"
                },
                        {
                            "name": "view",
                            "value": "activities"
                        }
            ]
        }
    }
    ]

    ملاحظة:

    يمكنك أيضًا إضافة حدث مخصص عن طريق استبدال عينة الرموز المذكورة أعلاه بعينة الرموز هذه. ويمكنك استخدام هذه الطريقة للإجراءات المخصصة مثل فتح نافذة جانبية.
     [
        {
            "id": "ACTION_CUSTOM_EVENT",
            "label": "Test Custom Event",
            "active": true,
            "context": {
                "type": "CustomEvent",
                "eventId": "usageMapMenuActionEvent",
                "eventData": {
                }
            }
        }
    ]
    
  10. إذا كانت هناك معلمات امتداد Visual Builder تريد استخدامها في معلمات سياق بيانات تعريف الإجراء، فأكمل هذه الخطوات لإدخال معلمات امتداد Visual Builder:

    1. ارجع إلى علامة تبويب خريطة-الاستهلاك بعقد-الخدمة وحدد علامة التبويب الفرعية المتغيرات.

    2. انقر فوق الثابت USER_ACTION_PARAMS_MENU_ACTIONS.

    3. في حقل القيمة الافتراضية، أدخل تعيين القيمة لمعلمات الامتداد:

      [{
      
      "name":"testId",
      
      "value":"[[$page.variables.testId]]"
      
      }]
      
  11. انقر علامة التبويب الفرعية JSON لعرض طريقة يمكنك بها تحرير عينة الرموز هذه بسهولة وتحديث عينة الرموز بحيث تعكس القيم المخصصة.

  12. ارجع إلى علامة التبويب الفرعية المتغيرات وانقر فوق الثابت USER_ACTION_UI_MENU_ACTIONS.

  13. في حقل القيمة الافتراضية، أدخل المعرف الذي استخدمته في عينة التعليمات البرمجية أعلاه. على سبيل المثال، أدخل ["CUSTOM_ACTION_NAME"] في هذا الحقل.

  14. قم بمعاينة التغييرات للتأكد من أنها تبدو كما توقعت. سيؤدي ذلك إلى فتح علامة تبويب جديدة تحتوي على العرض الشامل للحساب في شاشة "عرض جهات الاتصال". تحقق من أن الخيار الجديد متاح، وأنه ينتقل إلى عنوان URL المناسب.

  15. عندما تكون تغييراتك جاهزة للاستخدام، أكمل الخطوات لنشر التغييرات إلى بيئة الإنتاج الخاصة بك.

  16. بالنسبة للإجراءات المخصصة، حدد علامة التبويب "مستمع الأحداث" وقم بتكوين مستمع للإجراء usageMapMenuActionEvent وحدد أو قم بتكوين سلسلة إجراءات لتنفيذ الإجراء المخصص الخاص بك.