Customize Your SAP TM Experience: A Quick View Tutorial

Introduction: 

Quick View UIBBs (User Interface Building Blocks) are designed to present summary information or key details in a compact format, allowing users to access essential data without navigating through more detailed screens. The Quick View UIBB streamlines the user experience by providing an at-a-glance view of critical information enhancing efficiency and decision-making. 

Objectives: 

A recent requirement involved adding a custom column titled ‘Compatible Destination Location’ in the Trucks UI of the Transportation cockpit within the Resource Quadrant. This column needs to display word ‘MULTIPLE’ for multiple locations, with detailed information accessible via a Quick View when the user hovers over the location ID. 

Prerequisites: 

• Access to SAP system and SAP Fiori Launchpad 

• Basic knowledge of UIBBs 

• Familiarity with UI customization 

• Understanding of data sources 

Step 1: Create Structure

Create structure to show the data in UI, Access transaction code SE11 and create a new structure.

Step 2: Implementation of Feeder Class: 

Feeder class provides a link between the application and the user interface building block (UIBB).

Access transaction code SE24 and create a new feeder class

Add interface for configuration of UIBB 

Interface IF_FPM_GUIBB_QV_THING is a feeder interface for quick view UIBB  

Implementation of methods 

GET_DEFINITION and GET_DATA must be implemented to create simple Quick View. PROCESS_EVENT can be implemented if any event needs to be handled 

GET_DEFINITION 

This method provides necessary information to build field catalog, actions required etc. 

GET_DATA 

Primary function of GET_DATA method is to transfer data from the feeder class to the UIBB.     

The importing parameter of this method, IV_KEY, indicates which attribute has been selected. Based on this attribute, we can implement processing logic to retrieve the required data to populate LS_DATA, which is then mapped to CS_DATA.

PROCESS_EVENT 

Here the event processing can take place, if user clicks on any location ID then location master should get opened 

Step 3: Creating UIBB Configuration 

Create component configuration using FPM workbench 

component name: FPM_QUICKVIEW_THING  

configuration ID: any custom name, ZTM_WDCC_DEST_LOC_QV 

Enter feeder class, 

Design the quick view component as per requirement 

Step 4: Assigning quick view component to required attribute 

Right click on resource quadrant of transportation cockpit and select technical setting, open component customizing.

Note: If component customizing is not created then create component customizing first 

Assign quick view schema to required attribute,

Test  

If user clicked on location SP_ADS6, 

Conclusion: 

The creation of the Quick View UIBB in SAP TM has successfully met its objectives by delivering a streamlined, user-friendly interface that efficiently displays multiple destination locations. The UIBB has been well-received for its performance and usability, enhancing both user experience and operational efficiency. Despite facing some technical challenges, adherence to best practices in design and configuration ensured a smooth implementation. Moving forward, additional enhancements will be considered based on user feedback, and ongoing support will be provided to maintain the UIBB’s effectiveness. 

We'd love to hear your thoughts on this guide! If you want to know more or have any questions, feel free to get in touch at manuraj.dhawle@scmyuga.com or contact@scmyuga.com.