SAP Customer Relationship Management, SAPUI5

Adding custom fields to promotion details UI5 screen in Trade Management solution

Adding custom fields to promotion details UI5 screen in Trade Management solution

We will be creating a new custom field for eg. ‘Linked Promotion’ under the ‘General Data’ section as shown below.

SAP Customer Relationship Management, SAPUI5

The field will be added to the promotion details screen – 7.0.1 in Virtual View Framework.

SAP Customer Relationship Management, SAPUI5

Creating the custom field and configuring the Virtual View Framework

Create the custom field ZZ_PROM from the old trade promotion UI using AET tool under HEADER object part of trade promotion.

SAP Customer Relationship Management, SAPUI5

Adding the newly created field in the Virtual View Framework customizing

SPRO Path: CRM->Trade Management->General Settings ->System Settings->Maintain Virtual View framework Customizing.

Click on “Maintain Virtual Screens” in the dialog structure and select screen 7.0.1

SAP Customer Relationship Management, SAPUI5

Select “Maintain Logical Context Nodes” and select TRADE

SAP Customer Relationship Management, SAPUI5

Select “Map Logical Context Node Attributes” and add the above created custom field.

SAP Customer Relationship Management, SAPUI5

Click on “Maintain Virtual Views” and select “GENERAL_DATA” virtual view

SAP Customer Relationship Management, SAPUI5

Click on “Select Context Nodes Used” and select “Trade” context node.

SAP Customer Relationship Management, SAPUI5

Add the newly created custom attribute under “Select Context Node Attributes Used” section.

SAP Customer Relationship Management, SAPUI5

Adding the custom attribute to the trade promotion UI5 configuration

SPRO Path: CRM ->Trade Management -> Trade Promotion Planning and Management -> Trade Promotion Planning -> UI Configuration -> Define UI Configuration

Add the attribute to the standard ‘GEND’ profile.

SAP Customer Relationship Management, SAPUI5

Select screen 7.0.1

SAP Customer Relationship Management, SAPUI5

Select 701_GENERAL_DATA virtual view usage

SAP Customer Relationship Management, SAPUI5

We will already see ZZ_PROM field in this configuration. Check ‘Display’ and ‘Editable’ check boxes to enable it for display in the UI5 screen and mention a unique UI position in sequence.

SAP Customer Relationship Management, SAPUI5

UI5 Extension

To add new extensions in UI5 screens, refer to the below extension guide below to complete the initial setup on how to create SAPUI5 project and how to perform the deployment of custom UI5 app into backend server

Find the View Extension Point

We would need to find the extension point for the general data section in 7.0.1 screen from the extension guide.

In our case it is “extDetailedPromoGenData” extension point under standard view sap.crm.mkt.cbp.lib.commons.view.tma.DetailedPromotion as shown below.

SAP Customer Relationship Management, SAPUI5

Sample Fragment Code Snippet

Create a fragment under the custom SAPUI5 project and add the custom field ‘Linked Promotion’.

The custom fields added in customization will be available in SAPUI5 model ‘tradeModel’ which can be used to populate the data in the text box.

SAP Customer Relationship Management, SAPUI5

Sample Controller Code Snippet

You can refer to the below code to set the value entered in the Linked Promotion custom field.

SAP Customer Relationship Management, SAPUI5

Deploy the UI5 project as a BSP application

Once the project is ready, you can deploy it as a BSP application in the backend server. Please refer to the extensions guide for the same. Below is a snapshot of the deployed application with the view and controller.

SAP Customer Relationship Management, SAPUI5

UI5 extension configuration

SPRO Path: CRM ->Trade Management -> General Settings->UI Extension

Maintain the namespace maintained in the UI5 custom application.

SAP Customer Relationship Management, SAPUI5

Map the fragment to the extension corresponding to the general data section of the promotion details screen 7.0.1

SAP Customer Relationship Management, SAPUI5

Add an entry to register the controller extension

SAP Customer Relationship Management, SAPUI5

This completes the configuration and development steps needed for adding a custom field in the promotion details UI5 screen to display data.

Leave a Reply

Your email address will not be published. Required fields are marked *