Quantcast
Channel: SCN : Blog List - All Communities
Viewing all articles
Browse latest Browse all 2548

How to create a Fiori Overview Page leveraging an on premise OData service and deploy it to an on premise Fiori Launchpad

$
0
0

In my previous blog How to make your OData entities work with the Fiori Overview Page and Cards leveraging the new SAP Web IDE annotation modeler I described the basic steps to create a Fiori Overview Page with a table Card based on an Internet OData service, focusing on how to create the annotation file with new SAP Web IDE annotation modeler and how to adjust the manifst.json within Web IDE respectively.

 

In this blog I will focus on the differences when creating a Fiori Overview Page leveraging an on premise OData service and deploy the result to an on premise Fiori Launchpad. This is similar do deploying a Fiori Application to an on Premise Fiori Lauchpad, as I have described it in my previous blog Verify your Gateway (Frontend) Installation in 45 Minutes, but I will highlight the differences.

 

To start with, you need a HANA Cloud Connector to make your on premise OData service available in the Web IDE during design time and to deploy the Fiori Overview Page to your on premise Fiori Launch Pad:

SAP HANA Cloud Connector.png

To consume the on premise service and to deploy the Fiori Overview Page to the ABAP repository, access to the following resources including all sub-paths needs to be allowed:

 

  • /sap/bc/adt
  • /sap/bc/ui5_ui5
  • /sap/opu/odata

 

In the HANA cloud platform, we need the following corresponding destinations are needed:

UIAddOn.png

UI5.png

OData.png

For this blog I am using the Reference SFlight Data Provider. If not already done so, this service would have to be enabled:

Activate and Maintain Services.png

With these preparations, a Fiori Overview Page can be build based on this service:

Data Connection.png

As before, a local skeleton annotation file needs to be provided:

 

<edmx:Edmx Version="1.0" xmlns:edmx="http://schemas.microsoft.com/ado/2007/06/edmx"

                xmlns:m="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata" xmlns:sap="http://www.sap.com/Protocols/SAPData">

                <edmx:DataServices m:DataServiceVersion="2.0">

                                <Schema Namespace="RMTSAMPLEFLIGHT_2" sap:schema-version="1" xmlns="http://docs.oasis-open.org/odata/ns/edm">

                                </Schema>

                </edmx:DataServices>

</edmx:Edmx>

Annotation Selection.png

And also some template customization:

Template Customization.png

With that we are done and our project got created. Next the path to the annotation file to localService/RMTSAMPLEFLIGHT_2 has to be correctrd to where it is in fact stored:

manifest.png

This enables us to use the Annotation Modeler to annotate the TravelAgencyCollection to use with a LineItem containing the DataFields Name, City and Country:

Annotation Structure.png

Next a Table Card can be added based on the same service:

Configure Datasource.png

Finally we select the TravelAgencyCollection as the Entity Set and provide the Header Elements:

New Card.png

When we now run the Fiori Overview Page as a SAP Fiori Content on Sandbox, we see our card populated with travel agent information from the on premise OData service:

SAP Fiori Content on Sandbox.png

Now we go further and deploy this Fiori Overview Page to our on premise Fiori Launchpad:

Deploy a New Application.png

We chose the destination we created before:

Deployment Options.png

And deploy it as a new application:

Deploy a New Application.png

As a result we find our Fiori Overview Page as a BSP Application in the ABAP Development Workbench. Especially important is the path /sap/bc/ui5_ui5/sap/zflight/webapp:

Web Application Builder.png

First we create a Launchpad (Role):

Overview of Launchpads.png

And then a New Application within the Launchpad. Especially important are

  • Application Parameter URL: /sap/bc/ui5_ui5/sap/zflight/webapp
  • Additional Information: SAPUI5.Component=zflight

As you have seen them in the ABAP Development Workbench:

Change Launchpad.png

Finally we need a corresponding Semantic Object:

Semantic Object.png

With this, a new Catalog can be created:

Create Catalog.png

Next we create a Tile within your Catalog. Important here is the Semantic Object, we created before:

Tile.png

And a Target Mapping for which again the Semantic Object is important but also the Launchpad (Role) and Application Alias that we configured before:

Target Mapping.png

To conclude the Fiori Launchpad configuration we create a Group to represent our user role:

Create Group.png

And assign the Tile from your Catalog to it:

Add Tile to Group.png

Finally we create a Single Role, assign your Fiori Launchpad Catalog and Group to it and assign it to your user:

Change Roles.png

With this we got on premise access our Fiori Overview Page:

Assistant.png

With its Card rendering like a charm:

Travel Management.png

To make this Fiori Overview Page work on premise, you would have to be at least on SAPUI5 version 1.32.0 as shown in the manifest.json:

minUI5Version.png

This blog content has been developed on a NetWeaver 7.50 system, with SAPUI5 version 1.32.12:

SAP UI5 development toolkit for HTML5.png


Viewing all articles
Browse latest Browse all 2548

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>