Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
saurabhsharma82
Explorer
It is a common requirement to enable app to app navigation and intra-app navigation when building a suite of UI5 apps. Anybody who has experience with traditional UI5 apps (free style apps before the Fiori elements era) will acknowledge that it is a bit challenging to implement and a variety of approaches can be used to achieve this. Things are streamlined a lot in apps using Fiori elements and usage of navigation controller(provided as part of extension API). In this blog I will share my experience building apps that talk to each other.

The first app for this demo is a bit more complicated than the apps I used in previous blogs. The List report has multiple entities (this feature is available Fiori version 1.60 and above for on premise customers) shown in separate tabs and each tab navigates to a different object page( See UI5 SDK link for more details). The second app used here is a simple list report (to demo app to app navigation).



 

There can be three usecases –

1. Internal navigation - This is the case of navigation within the views of the same application, from one object page to another. To implement this, we must build a binding context for the target view by passing key valuesand use the NavigationController’s navigateInternal method.



 

2. External navigation to a simple application – In this case we can simply navigate with the semantic object and pass it the preferred mode as a parameter. The preferred mode could me create, display(default) or edit. Use the NavigationController’s navigateExternal method using the outbound configured in manifest. In addition to this, for create mode we need to maintain inbound parameters in the target application’s manifest. Check out the onWBSPress method in the objectPageEx.controller.js file and outbound in manifest.



3. External Navigation to a complex application – Complex application can be thought of as the one with multiple entities and object pages. So, by just passing the key values to the target application and outbound, application cannot decide which object page to navigate to.Here we cannot use navigation controller's navigateExternal method similar to point 2.  (Refer to the block diagram) We want to navigate from WBS Object Page to Order Object Page.


To achieve this a technique called the hash replacement is used. Replace the hash of the current application with the target application's hash in the URL. Then use the sap.m.URLHelper to navigate to the application.



 

Application Demo -



Putting it all together :

Order CDS -
@AbapCatalog.sqlViewName: 'ZCUSTORD'
@AbapCatalog.compiler.compareFilter: true
@AbapCatalog.preserveKey: true
@AccessControl.authorizationCheck: #CHECK
@EndUserText.label: 'Custom Order'

@ObjectModel.createEnabled: true
@ObjectModel.deleteEnabled: true
@ObjectModel.updateEnabled: true

define view zcustom_order
as select from zcustomorder
association [* ] to zcustom_notif as _NotifHelp on _NotifHelp.qmnum = zcustomorder.qmnum
and _NotifHelp.qmart like 'M%'
{

@UI : {
lineItem: [{ position: 10 }],
selectionField: [{ position: 10 }],
fieldGroup: [{
qualifier: 'Header1',
position : 10
},
{
qualifier: 'Overview1',
position : 10
}]
}
key aufnr,
@UI : {
lineItem: { position: 20 },
selectionField: { position: 20 },
fieldGroup: {
qualifier: 'Overview1',
position : 20
}
}
ktext,
@UI : {
lineItem: [{ position: 30 }],
selectionField: [{ position: 30 }],
fieldGroup: {
qualifier: 'Overview2',
position : 10
}
}
auart,
@UI : {
lineItem: [{ position: 40 }],
selectionField: [{ position: 40 }],
fieldGroup: {
qualifier: 'Overview2',
position : 20
}
}
@Consumption.filter.defaultValue: '30'
auftyp,
@UI : {
selectionField: [{ position: 50 }],
fieldGroup: {
qualifier: 'Overview3',
position : 10
}
}
werks,
@UI : {
lineItem: [{ position: 60 }],
selectionField: [{ position: 60 }],
fieldGroup: {
qualifier: 'Overview4',
position : 20
}
}
phas0,
@UI : {
lineItem: [{ position: 10 }],
selectionField: { position: 70 },
fieldGroup: {
qualifier: 'Overview4',
position : 10
}

}
@Consumption.valueHelp: '_NotifHelp'
qmnum,
@UI : {
lineItem: [{ position: 10 }],
selectionField: { position: 80 },
fieldGroup: {
qualifier: 'Overview3',
position : 20
}
}
@Consumption.filter: {selectionType : #SINGLE, multipleSelections: false}
@EndUserText.label: 'Order Start Date'
orderstart,

objecttyp,

@UI : {


fieldGroup: {
qualifier: 'Overview1',
position : 30
}
}

@EndUserText.label: 'Linked WBS'
posid,

_NotifHelp
}

Nofification CDS -
@AbapCatalog.sqlViewName: 'ZCUSTNOTIF'
@AbapCatalog.compiler.compareFilter: true
@AbapCatalog.preserveKey: true
@OData.publish: true
@AccessControl.authorizationCheck: #CHECK
@EndUserText.label: 'Custom notification'

@ObjectModel.createEnabled: true
@ObjectModel.deleteEnabled: true
@ObjectModel.updateEnabled: true

define view zcustom_notif
as select from zcustomnotif
{
@UI : {
lineItem: [{position: 10 }],
selectionField: [{position: 10}],
fieldGroup: [{position: 10,
qualifier: 'Overview1' },{position: 10, qualifier: 'Header1'}]
}
key qmnum,
@UI : {fieldGroup: [{position: 10,

qualifier: 'Overview2' }],
selectionField: [{position: 20}],
lineItem: [{position: 20 }]}
qmtxt,
@UI : {fieldGroup: [{position: 10,
qualifier: 'Overview3' }],
selectionField: [{position: 30}],
lineItem: [{position: 30 }]}
qmdat,
@UI : {fieldGroup: [{position: 10,
qualifier: 'Overview4' }],
selectionField: [{position: 40}],
lineItem: [{position: 40 }]}
aufnr,
@UI : {fieldGroup: [{position: 20,
qualifier: 'Overview1' }],
selectionField: [{position: 50}],
lineItem: [{position: 50 }]}
qmart,

objecttyp

}

WBS CDS -
@AbapCatalog.sqlViewName: 'ZCUSTWBS'
@AbapCatalog.compiler.compareFilter: true
@AbapCatalog.preserveKey: true
@AccessControl.authorizationCheck: #CHECK
@EndUserText.label: 'Custom WBS'
@OData.publish: true
define view ZCUSTOM_WBS as select from zcustomwbs {
@UI : {
lineItem: [{ position: 10 }],
selectionField: [{ position: 10 }],
fieldGroup: [{
qualifier: 'Header1',
position : 10
},
{
qualifier: 'Overview1',
position : 10
}]
}
key posid,
@UI : {
lineItem: [{ position: 20 }],
selectionField: [{ position: 20 }],
fieldGroup: [
{
qualifier: 'Overview1',
position : 20
}]
}
aufnr,
@UI : {
lineItem: [{ position: 30 }],
selectionField: [{ position: 30 }],
fieldGroup: [
{
qualifier: 'Overview2',
position : 10
}]
}
pspid,
@UI : {
lineItem: [{ position: 40 }],
selectionField: [{ position: 40 }],
fieldGroup: [
{
qualifier: 'Overview2',
position : 20
}]
}
pkokr,
@UI : {
lineItem: [{ position: 50 }],
fieldGroup: [
{
qualifier: 'Overview3',
position : 10
}]
}
pbukr,
@UI : {

selectionField: [{ position: 60 }],
fieldGroup: [
{
qualifier: 'Overview3',
position : 20
}]
}
werks,
objecttyp,
@UI : {

fieldGroup: [
{
qualifier: 'Overview4',
position : 10
}]
}
prctr
}

Order Notification UI5 App source code -

ObjectPageEx.controller.js
sap.ui.controller("zcustomorder.ext.controller.ObjectPageExt", {
onInit: function () {
that = this;
//Automatic value help for Object Page smart field
var fld = this.oView.byId("zcustomorder::sap.suite.ui.generic.template.ObjectPage.view.Details::zcustom_order--RF1::qmnum::Field");
if (fld) {
var oConfig = fld.getConfiguration();
if (!oConfig) {
oConfig = new sap.ui.comp.smartfield.Configuration();
}
oConfig.setPreventInitialDataFetchInValueHelpDialog(false);
oConfig.setDisplayBehaviour(sap.ui.comp.smartfield.DisplayBehaviour.descriptionAndId);
fld.setConfiguration(oConfig);
}

//Convert Smart field into URL
var notifFld = this.getView().byId(
"zcustomorder::sap.suite.ui.generic.template.ObjectPage.view.Details::zcustom_order--RF1::qmnum::Field"
);
if (notifFld) {
notifFld.attachPress(this.onNotifPress);
}

var wbsFld = this.getView().byId(
"zcustomorder::sap.suite.ui.generic.template.ObjectPage.view.Details::zcustom_order--RF2::posid::Field"
);
if (wbsFld) {
wbsFld.attachPress(this.onWBSPress);
}

},

onWBSPress : function(){
var sPath = that.getView().getBindingContext().getPath();
var wbs = that.getView().getModel().getProperty(sPath + "/posid");
var oNavControl = that.extensionAPI.getNavigationController();
oNavControl.navigateExternal("WBS", {
posid: wbs
});
},

onNotifPress : function(){
var sPath = that.getView().getBindingContext().getPath();
var notifNo = that.getView().getModel().getProperty(sPath + "/qmnum");
var oModel = that.getOwnerComponent().getModel();
// Create a target Path
var targetPath = "/" + oModel.createKey("zcustom_notif", {
qmnum: notifNo
});
// Create binding context and navigate in function callback
oModel.createBindingContext( targetPath , that.navigateInt, true );
},

//Callback function
navigateInt : function(oContext){
var oNavControl = that.extensionAPI.getNavigationController();
oNavControl.navigateInternal(oContext);
},

onCreateNotification: function (oEvent) {
var oNavControl = this.extensionAPI.getNavigationController();
var oModel = this.getOwnerComponent().getModel();
var sPath = oEvent.getSource().getBindingContext().getPath();
var notNo = oModel.getProperty(sPath + "/qmnum");
var ordNo = oModel.getProperty(sPath + "/aufnr");
var ordStart = oModel.getProperty(sPath + "/orderstart");
oNavControl.navigateExternal("Notification", {
qmnum: notNo,
aufnr: ordNo,
qmdat: ordStart,
preferredMode: "create"
});

}
});

manifest.json -
{
"_version": "1.8.0",
"sap.app": {
"id": "zcustomorder",
"type": "application",
"i18n": "i18n/i18n.properties",
"applicationVersion": {
"version": "1.0.0"
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"tags": {
"keywords": []
},
"dataSources": {
"ZCUSTOMORDER_SRV": {
"uri": "/sap/opu/odata/sap/ZCUSTOMORDER_SRV/",
"type": "OData",
"settings": {
"localUri": "localService/ZCUSTOMORDER_SRV/metadata.xml",
"annotations": [
"localAnnotations",
"ZCUSTOMORDER_ANNO_MDL"
]
}
},
"localAnnotations": {
"uri": "annotations/annotations.xml",
"type": "ODataAnnotation",
"settings": {
"localUri": "annotations/annotations.xml"
}
},
"ZCUSTOMORDER_ANNO_MDL": {
"uri": "/sap/opu/odata/IWFND/CATALOGSERVICE;v=2/Annotations(TechnicalName='ZCUSTOMORDER_ANNO_MDL',Version='0001')/$value/",
"type": "ODataAnnotation",
"settings": {
"localUri": ""
}
}
},
"offline": false,
"sourceTemplate": {
"id": "servicecatalog.connectivityComponentForManifest",
"version": "0.0.0"
},
"crossNavigation": {
"inbounds": {
"intent1": {
"signature": {
"parameters": {},
"additionalParameters": "allowed"
},
"semanticObject": "zcustord",
"action": "manage"
}
},
"outbounds": {
"WBS": {
"semanticObject": "zcustwbs",
"action": "manage"
},
"Notification": {
"semanticObject": "zcustnot",
"action": "manage"
}
}
}
},
"sap.ui": {
"technology": "UI5",
"icons": {
"icon": "",
"favIcon": "",
"phone": "",
"phone@2": "",
"tablet": "",
"tablet@2": ""
},
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
},
"supportedThemes": [
"sap_hcb",
"sap_belize"
]
},
"sap.ui5": {
"resources": {
"js": [],
"css": []
},
"dependencies": {
"minUI5Version": "1.38.34",
"libs": {},
"components": {}
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/i18n.properties"
},
"@i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/i18n.properties"
},
"i18n|sap.suite.ui.generic.template.ListReport|zcustom_order": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/ListReport/zcustom_order/i18n.properties"
},
"i18n|sap.suite.ui.generic.template.ObjectPage|zcustom_order": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/ObjectPage/zcustom_order/i18n.properties"
},
"": {
"type": "sap.ui.model.odata.v2.ODataModel",
"settings": {
"defaultOperationMode": "Server",
"defaultBindingMode": "OneWay",
"defaultCountMode": "Request"
},
"dataSource": "ZCUSTOMORDER_SRV",
"preload": true
}
},
"extends": {
"extensions": {
"sap.ui.controllerExtensions": {
"sap.suite.ui.generic.template.ObjectPage.view.Details": {
"controllerName": "zcustomorder.ext.controller.ObjectPageExt",
"sap.ui.generic.app": {
"zcustom_order": {
"EntitySet": "zcustom_order",
"Header": {
"Actions": {
"Notification": {
"id": "Notification",
"text": "{@i18n>CREATE}",
"press": "onCreateNotification"
}
}
}
}
}
},
"sap.suite.ui.generic.template.ListReport.view.ListReport": {
"controllerName": "zcustomorder.ext.controller.ListReportExt",
"sap.ui.generic.app": {
"zcustom_order": {
"EntitySet": "zcustom_order",
"Actions": {}
}
}
}
}
}
},
"contentDensities": {
"compact": true,
"cozy": false
}
},
"sap.ui.generic.app": {
"_version": "1.3.0",
"settings": {
"forceGlobalRefresh": false
},
"pages": {
"ListReport|zcustom_filter": {
"entitySet": "zcustom_filter",
"component": {
"name": "sap.suite.ui.generic.template.ListReport",
"list": true,
"settings": {
"smartVariantManagement": true,
"quickVariantSelectionX": {
"showCounts": false,
"enableAutoBinding": false,
"variants": {
"0": {
"key": "t0",
"entitySet": "zcustom_order",
"annotationPath": "com.sap.vocabularies.UI.v1.SelectionVariant#Order"
},
"1": {
"key": "t1",
"entitySet": "zcustom_notif",
"annotationPath": "com.sap.vocabularies.UI.v1.SelectionVariant#Notif"
},
"2": {
"key": "t2",
"entitySet": "zcustom_order_chart",
"annotationPath": "com.sap.vocabularies.UI.v1.PresentationVariant#Chart"
}
}
}
}
},
"pages": {
"ObjectPage|zcustom_order": {
"entitySet": "zcustom_order",
"component": {
"name": "sap.suite.ui.generic.template.ObjectPage"
}
},
"ObjectPage|zcustom_notif": {
"entitySet": "zcustom_notif",
"component": {
"name": "sap.suite.ui.generic.template.ObjectPage"
}
}
}
}
}
},
"sap.platform.hcp": {
"uri": ""
}
}

local annotation file -
<?xml version="1.0" encoding="utf-8"?>
<edmx:Edmx xmlns:edmx="http://docs.oasis-open.org/odata/ns/edmx" Version="4.0">
<edmx:Reference Uri="/sap/bc/ui5_ui5/ui2/ushell/resources/sap/ushell/components/factsheet/vocabularies/UI.xml">
<edmx:Include Alias="UI" Namespace="com.sap.vocabularies.UI.v1"/>
</edmx:Reference>
<edmx:Reference Uri="/sap/opu/odata/sap/ZCUSTOM_ORDER_CDS/$metadata">
<edmx:Include Alias="ZCUSTOMORDER_SRV" Namespace="ZCUSTOMORDER_SRV"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Capabilities.V1.xml">
<edmx:Include Alias="Capabilities" Namespace="Org.OData.Capabilities.V1"/>
</edmx:Reference>
<edmx:DataServices>
<Schema xmlns="http://docs.oasis-open.org/odata/ns/edm" Namespace="zcustomorder.ZCUSTOMORDER_SRV">
<!--===============================================================================
Entity Type from chosen collection
================================================================================-->
<Annotations Target="ZCUSTOMORDER_SRV.zcustom_orderType">
<Annotation Term="UI.HeaderInfo">
<Record Type="UI.HeaderInfoType">
<PropertyValue Property="TypeName" String="{@i18n&gt;ORDER}"/>
<PropertyValue Property="TypeNamePlural" String="{@i18n&gt;ORDERS}"/>
<PropertyValue Property="Title">
<Record Type="UI.DataField">
<PropertyValue Property="Value" Path="objecttyp"/>
</Record>
</PropertyValue>
</Record>
</Annotation>
<Annotation Term="UI.SelectionVariant" Qualifier="Order">
<Record Type="UI.SelectionVariantType">
<PropertyValue Property="ID" String="SEL01"/>
<PropertyValue Property="Text" String="{@i18n&gt;ORDER}"/>
</Record>
</Annotation>
<Annotation Term="UI.HeaderFacets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Header1"/>
</Record>
</Collection>
</Annotation>
<Annotation Term="UI.Facets">
<Collection>
<Record Type="UI.CollectionFacet">
<PropertyValue Property="ID" String="GeneralInformation"/>
<PropertyValue Property="Label" String="{@i18n&gt;OVERVIEW}"/>
<PropertyValue Property="Facets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview1"/>
<PropertyValue Property="ID" String="RF2"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview2"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview3"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview4"/>
<PropertyValue Property="ID" String="RF1"/>
</Record>
</Collection>
</PropertyValue>
</Record>
</Collection>
</Annotation>
</Annotations>
<Annotations Target="ZCUSTOMORDER_SRV.ZCUSTOMORDER_SRV_Entities/zcustom_order">
<Annotation Term="Capabilities.UpdateRestrictions">
<Record Type="Capabilities.UpdateRestrictionsType">
<PropertyValue Property="Updatable" Path="phas0"/>
</Record>
</Annotation>
<Annotation Term="Capabilities.DeleteRestrictions">
<Record Type="Capabilities.DeleteRestrictionsType">
<PropertyValue Property="Deletable" Path="phas0"/>
</Record>
</Annotation>
</Annotations>
<Annotations Target="ZCUSTOMORDER_SRV.zcustom_order_chartType">
<Annotation Term="UI.PresentationVariant" Qualifier="Chart">
<Record Type="UI.PresentationVariantType">
<PropertyValue Property="Visualizations">
<Collection>
<AnnotationPath>@UI.Chart#Chart1</AnnotationPath>
</Collection>
</PropertyValue>
<PropertyValue Property="ID" String="CH1"/>
<PropertyValue Property="Text" String="{@i18n&gt;CHART}"/>
</Record>
</Annotation>
</Annotations>
<Annotations Target="ZCUSTOMORDER_SRV.zcustom_notifType">
<Annotation Term="UI.HeaderInfo">
<Record Type="UI.HeaderInfoType">
<PropertyValue Property="TypeName" String="{@i18n&gt;NOTIFICATION}"/>
<PropertyValue Property="TypeNamePlural" String="{@i18n&gt;NOTIFICATIONS}"/>
<PropertyValue Property="Title">
<Record Type="UI.DataField">
<PropertyValue Property="Value" Path="objecttyp"/>
</Record>
</PropertyValue>
</Record>
</Annotation>
<Annotation Term="UI.Facets">
<Collection>
<Record Type="UI.CollectionFacet">
<PropertyValue Property="ID" String="GeneralInformation"/>
<PropertyValue Property="Label" String="{@i18n&gt;OVERVIEW}"/>
<PropertyValue Property="Facets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview1"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview2"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview3"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview4"/>
</Record>
</Collection>
</PropertyValue>
</Record>
</Collection>
</Annotation>
<Annotation Term="UI.HeaderFacets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Header1"/>
</Record>
</Collection>
</Annotation>
<Annotation Term="UI.SelectionVariant" Qualifier="Notif">
<Record Type="UI.SelectionVariantType">
<PropertyValue Property="ID" String="SEL02"/>
<PropertyValue Property="Text" String="{@i18n&gt;NOTIFICATION}"/>
</Record>
</Annotation>
<Annotation Term="UI.FilterFacets">
<Collection/>
</Annotation>
</Annotations>
</Schema>
</edmx:DataServices>
</edmx:Edmx>

WBS UI5 App source code -

ObjectPageEx.controller.js
sap.ui.controller("zcustomwbs.ext.controller.ObjectPageExt", {

onInit: function(){
that = this;
//Convert Smart field into URL
var ordFld = this.getView().byId(
"zcustomwbs::sap.suite.ui.generic.template.ObjectPage.view.Details::ZCUSTOM_WBS--RF1::aufnr::Field"
);
if (ordFld) {
ordFld.attachPress(this.onOrderPress);
}
},

onOrderPress : function(){
var sPath = that.getView().getBindingContext().getPath();
var order = that.getView().getModel().getProperty(sPath + "/aufnr");
if (order) {
var currentURL = window.location.href;
//Build modified URL
var idx = currentURL.indexOf("#zcustwbs");
var modURL = currentURL.slice(0, idx);
// After semantic object and action, we need to append the information of which object page it needs to navigate to
var hash = "#zcustord-manage&/zcustom_order('" + order + "')";
modURL = modURL + hash;
//Navigate to second app using URLHelper
sap.m.URLHelper.redirect(modURL, false);
}
}

});

manifest.json -
{
"_version": "1.8.0",
"sap.app": {
"id": "zcustomwbs",
"type": "application",
"i18n": "i18n/i18n.properties",
"applicationVersion": {
"version": "1.0.0"
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"tags": {
"keywords": []
},
"dataSources": {
"mainService": {
"uri": "/sap/opu/odata/sap/ZCUSTOM_WBS_CDS/",
"type": "OData",
"settings": {
"annotations": ["ZCUSTOM_WBS_CDS_VAN", "localAnnotations"],
"localUri": "localService/metadata.xml"
}
},
"ZCUSTOM_WBS_CDS_VAN": {
"uri": "/sap/opu/odata/IWFND/CATALOGSERVICE;v=2/Annotations(TechnicalName='ZCUSTOM_WBS_CDS_VAN',Version='0001')/$value/",
"type": "ODataAnnotation",
"settings": {
"localUri": "localService/ZCUSTOM_WBS_CDS_VAN.xml"
}
},
"localAnnotations": {
"uri": "annotations/annotations.xml",
"type": "ODataAnnotation",
"settings": {
"localUri": "annotations/annotations.xml"
}
}
},
"offline": false,
"sourceTemplate": {
"id": "ui5template.smartTemplate",
"version": "1.40.12"
},
"crossNavigation": {
"inbounds": {
"intent1": {
"signature": {
"parameters": {},
"additionalParameters": "allowed"
},
"semanticObject": "zcustwbs",
"action": "manage"
}
}
}
},
"sap.ui": {
"technology": "UI5",
"icons": {
"icon": "",
"favIcon": "",
"phone": "",
"phone@2": "",
"tablet": "",
"tablet@2": ""
},
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
},
"supportedThemes": ["sap_hcb", "sap_belize"]
},
"sap.ui5": {
"resources": {
"js": [],
"css": []
},
"dependencies": {
"minUI5Version": "1.38.34",
"libs": {},
"components": {}
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/i18n.properties"
},
"@i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/i18n.properties"
},
"i18n|sap.suite.ui.generic.template.ListReport|ZCUSTOM_WBS": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/ListReport/ZCUSTOM_WBS/i18n.properties"
},
"i18n|sap.suite.ui.generic.template.ObjectPage|ZCUSTOM_WBS": {
"type": "sap.ui.model.resource.ResourceModel",
"uri": "i18n/ObjectPage/ZCUSTOM_WBS/i18n.properties"
},
"": {
"dataSource": "mainService",
"preload": true,
"settings": {
"defaultBindingMode": "TwoWay",
"defaultCountMode": "Inline",
"refreshAfterChange": false,
"metadataUrlParams": {
"sap-value-list": "none"
}
}
}
},
"extends": {
"extensions": {
"sap.ui.controllerExtensions": {
"sap.suite.ui.generic.template.ObjectPage.view.Details": {
"controllerName": "zcustomwbs.ext.controller.ObjectPageExt",
"sap.ui.generic.app": {
"ZCUSTOM_WBS": {
"EntitySet": "ZCUSTOM_WBS"
}
}
}
}
}
},
"contentDensities": {
"compact": true,
"cozy": false
}
},
"sap.ui.generic.app": {
"_version": "1.3.0",
"settings": {
"useColumnLayoutForSmartForm": false
},
"pages": {
"ListReport|ZCUSTOM_WBS": {
"entitySet": "ZCUSTOM_WBS",
"component": {
"name": "sap.suite.ui.generic.template.ListReport",
"list": true,
"settings": {
"condensedTableLayout": true,
"smartVariantManagement": true,
"enableTableFilterInPageVariant": true
}
},
"pages": {
"ObjectPage|ZCUSTOM_WBS": {
"entitySet": "ZCUSTOM_WBS",
"component": {
"name": "sap.suite.ui.generic.template.ObjectPage"
}
}
}
}
}
},
"sap.platform.hcp": {
"uri": ""
}
}

local annotation file -
<?xml version="1.0" encoding="utf-8"?>
<edmx:Edmx xmlns:edmx="http://docs.oasis-open.org/odata/ns/edmx" Version="4.0">
<edmx:Reference Uri="/sap/bc/ui5_ui5/ui2/ushell/resources/sap/ushell/components/factsheet/vocabularies/UI.xml">
<edmx:Include Alias="UI" Namespace="com.sap.vocabularies.UI.v1"/>
</edmx:Reference>
<edmx:Reference Uri="/sap/opu/odata/sap/ZCUSTOM_WBS_CDS/$metadata">
<edmx:Include Alias="ZCUSTOM_WBS_CDS" Namespace="ZCUSTOM_WBS_CDS"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Aggregation.V1.xml">
<edmx:Include Alias="Aggregation" Namespace="Org.OData.Aggregation.V1"/>
</edmx:Reference>
<edmx:Reference Uri="https://wiki.scn.sap.com/wiki/download/attachments/462030211/Analytics.xml">
<edmx:Include Alias="Analytics" Namespace="com.sap.vocabularies.Analytics.v1"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Authorization.V1.xml">
<edmx:Include Alias="Auth" Namespace="Org.OData.Authorization.V1"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Capabilities.V1.xml">
<edmx:Include Alias="Capabilities" Namespace="Org.OData.Capabilities.V1"/>
</edmx:Reference>
<edmx:Reference Uri="https://wiki.scn.sap.com/wiki/download/attachments/448470974/Common.xml?api=v2">
<edmx:Include Alias="Common" Namespace="com.sap.vocabularies.Common.v1"/>
</edmx:Reference>
<edmx:Reference Uri="https://wiki.scn.sap.com/wiki/download/attachments/448470971/Communication.xml?api=v2">
<edmx:Include Alias="Communication" Namespace="com.sap.vocabularies.Communication.v1"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Core.V1.xml">
<edmx:Include Alias="Core" Namespace="Org.OData.Core.V1"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Measures.V1.xml">
<edmx:Include Alias="Measures" Namespace="Org.OData.Measures.V1"/>
</edmx:Reference>
<edmx:Reference Uri="https://wiki.scn.sap.com/wiki/download/attachments/496435637/PersonalData.xml">
<edmx:Include Alias="PersonalData" Namespace="com.sap.vocabularies.PersonalData.v1"/>
</edmx:Reference>
<edmx:Reference Uri="https://oasis-tcs.github.io/odata-vocabularies/vocabularies/Org.OData.Validation.V1.xml">
<edmx:Include Alias="Validation" Namespace="Org.OData.Validation.V1"/>
</edmx:Reference>
<edmx:DataServices>
<Schema xmlns="http://docs.oasis-open.org/odata/ns/edm" Namespace="zcustomwbs.ZCUSTOM_WBS_CDS">
<!--===============================================================================
Entity Type from chosen collection
================================================================================-->
<Annotations Target="ZCUSTOM_WBS_CDS.ZCUSTOM_WBSType">
<Annotation Term="UI.HeaderInfo">
<Record Type="UI.HeaderInfoType">
<PropertyValue Property="TypeName" String="{@i18n&gt;WBS}"/>
<PropertyValue Property="TypeNamePlural" String="{@i18n&gt;WBS}"/>
<PropertyValue Property="Title">
<Record Type="UI.DataField">
<PropertyValue Property="Value" Path="objecttyp"/>
</Record>
</PropertyValue>
</Record>
</Annotation>
<Annotation Term="UI.HeaderFacets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Header1"/>
</Record>
</Collection>
</Annotation>
<Annotation Term="UI.Facets">
<Collection>
<Record Type="UI.CollectionFacet">
<PropertyValue Property="ID" String="GeneralInformation"/>
<PropertyValue Property="Label" String="{@i18n&gt;OVERVIEW}"/>
<PropertyValue Property="Facets">
<Collection>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview1"/>
<PropertyValue Property="ID" String="RF1"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview2"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview3"/>
</Record>
<Record Type="UI.ReferenceFacet">
<PropertyValue Property="Target" AnnotationPath="@UI.FieldGroup#Overview4"/>
</Record>
</Collection>
</PropertyValue>
</Record>
</Collection>
</Annotation>
</Annotations>
</Schema>
</edmx:DataServices>
</edmx:Edmx>

 
11 Comments
civ211
Participant
0 Kudos
Great blog Saurabh ! Thank you for sharing.
nabheetscn
Active Contributor
0 Kudos
Very nice, Thanks for sharing the experience.
former_member420915
Discoverer
0 Kudos
Nice blog !! Thanks for sharing 🙂
smarchesini
Active Contributor
0 Kudos
Thanks for sharing !

Have you got a github link of the project ?

Thank you
0 Kudos
Great read. Thanks!
saurabhsharma82
Explorer
0 Kudos
Thank you civ211 nabheetscn jayekulk haywoodhunt for your kind words
saurabhsharma82
Explorer
0 Kudos
Hey c9f8de6ef0704cac8b4246c3c6e79ac1 I have already shared the source code here. Its a bit difficult to put it on github as we would need to deploy the applications on Fiori Launchpad(or SAP WebIDE test environment) to test app to app navigation that we discussed here.
smarchesini
Active Contributor
0 Kudos
Sorry saurabhsharma82 I'm only lazy.

No problem, thank you again. Great job 🙂
0 Kudos
Class act.

That's a follow from me!
saurabhsharma82
Explorer
0 Kudos
Thank you tony.dethomasis7
0 Kudos
Hi saurabh_sharma82 ,

 

is there a way to submit Values for Placeholders in the Annotation File
String="{@i18n&gt;OVERVIEW}

How can I use here a text with a Placeholder for example
"this is my global Setting {0}"

and I have a second service defined that will deliver this value from the backend.
Labels in this area