SAP Fiori 2.0 for SAP HCM – How to extend “My Profile” app using SAP Web IDE

In this post I will show you step-by-step how to extend standard SAP Fiori application on example My Profile.

Run SAP Web IDE. In my case it is Personal Edition.

Go to Workspace -> New -> Extension Project

Select Application -> SAPUI5 ABAP Repository

Select System from list (configuration is done in folder /config_master/service.destinations/destinations/) and application to extend:

To start application you have to add following code to Component.js.

(function() {
 jQuery.sap.registerModulePath("hcm.fab.lib.common", "/sap/bc/ui5_ui5/sap/hcmfab_common/");
 }());

By default application “My Profile” looks like below:

I would like to consider two scenarios:

Scenarios 1: Hide fields from section Personal Data subsection Marital Status field Number of Children from Personal Data section.
Scenarios 2: Add new fields to existing section Personal Data.

Scenarios 1: Hide fields from section Personal Data subsection Marital Status field Number of Children from Personal Data section

I want to hide field “Number of Children” from Personal Data section.

Go to Tools -> Extensibility Panel

Select View to extend, in my case “PersInfoPersonalDataBlock”. Click button “Extend” -> Replace with a copy of the original view.

Comment or remove section to hide.

Result you can see below.

Scenarios 2: Add new fields to existing section Personal Data

Add base salary for Personal Data section

First of all create oData (based on HCMFAB_MYPROFILE).

Goto tcode SEGW and create new oData (in my case ZHCMFAB_MYPROFILE).

Redefine standard oData HCMFAB_MYPROFILE and go throw wizard.

Add custom field to HCMFAB_S_PERS_PERSONALDATA structure.

Import new field in SEGW to my oData.

Change oData in SAP Fiori app. Goto New -> Extension.

Add following code to Component.js.

this.hcm.fab.myprofile.Component.extend("hcm.fab.myprofile.HCMFAB_PRFL_MONExtension.Component", {
	metadata: {
		manifest: "json",
		config: {
			"sap.ca.serviceConfigs": [{
				"name": "ZHCMFAB_MYPROFILE2_SRV",
				"serviceUrl": "/sap/opu/odata/sap/ZHCMFAB_MYPROFILE_SRV;mo/",
				"isDefault": true,
				"mockedDataSource": "./model/metadata.xml"
			}]
		}
	}
});