Add Custom Program Enrollments to Billing Highlights

You can use VB Studio to add custom program enrollment options in the Billing Highlights section of the Customer Dashboard screen, available in CX for Utilities Agent Service.

Figure 14-13 Add Billing Programs to Billing Highlights

This example shows how to configure the extensibility of the Billing Highlights section.

This example assumes that the reader is familiar with the Customer Dashboard and understands how to use Visual Builder. For additional information, see:

• Using the Customer Dashboard in the Using CX for Utilities Agent Service Guide

• The Visual Builder Studio library in the Oracle Help Center

• Customizing Variables and Constants in the Extending Oracle Cloud Applications with Visual Builder Studio Guide

Example: Adding a Custom Program Enrollment to the Customer Dashboard

1. Log into CX for Utilities Agent Service as an administrator.

2. Click the menu at the top right of the page and select Edit Page in Visual Builder Studio.

3. Select your workspace and click Select. Note that you can also create a new workspace if needed.

4. In the App UIs panel, expand Oracle Utilities Advanced Care UI application and then navigate to main, then customer-dashboard, and then select customer-dashboard-start.

5. Select the Event and for customerDashboardProgramEnrollmentEvent, create an event listener and select an action chain to implement your custom functionalities.
6. In the App UIs panel, expand Oracle Utilities Advanced Care UI application and then select e11y-user-action-template fragment in the Fragments sub-menu.

7. Select the Variables sub-tab to display the constants and variables.

8. Click on the USER_ACTION_CONTEXT_LIST constant.

9. On the right side of the screen, enter the configuration for your action type in the Default Value field.

   Figure 14-14 Default Value Example

   
   

   

   
   
10. Create an account program to list in the Billing Highlights list.
11. Create an Insight Type and a User Action, and map the new Insight Type and User Action to create your new program.
12. Create a User Action with the same name as the user action used in the USER_ACTION_CONTEXT_LIST of e11y-user-action-template fragment.

    Example default value:

    [{
        "id": "ACTION_CUSTOM_EVENT",
       "label": "View",
        "active": true,
        "context": {
          "type": "CustomEvent",
          "eventId": "page:customerDashboardProgramEnrollmentEvent ",
          "eventData": {
            "eventType": "CUSTOM"
          }
        }
      }]
    

13. Preview your changes to verify that they look as you expected. This will launch a new tab with the Customer Dashboard. Navigate to the Billing Highlights and verify your user action appears in the list.

14. When your changes are ready for use, complete the steps to publish your changes to your production environment.