Skip to Content
Technical Articles
Author's profile photo Enric Castella Gonzalez

Trick: Add dynamic tile on the SAP Cloud platform launchpad

Hi!

In cloud foundry it’s possible add a configuration of tile directly in the manifest.json of the SAPUI5 application.

But, Is it possible to do this tile dynamic?

  • YES! OF COURSE

It’s only necessary add “indicatorDataSource” that contains the configuration of KPIs and… the most important… In the path add “/dynamic_dest/<<Your destination>>/path_to_your_service

Just add the following configuration in your manifest (included in section “sap.app”):

"crossNavigation": {
            "inbounds": {
                "intent1": {
                    "signature": {
                        "parameters": {},
                        "additionalParameters": "allowed"
                    },
                    "semanticObject": "Object",
                    "action": "display",
                    "title": "{{appTitle}}",
                    "info": "{{appTitle}}",
                    "subTitle": "{{appSubTitle}}",
                    "icon": "sap-icon://account",
                    "indicatorDataSource": {
                        "dataSource": "APIPORTAL-Northwind",
                        "path": "/dynamic_dest/APIPORTAL-Northwind/V2/Northwind/Northwind.svc/Products/$count",
                        "refresh": 0
                    }
                }
            }
        }
},

This is an example of the configuration:

In this example I used the destination to Northwind service:

Finally, this is the result:

Regards

 

Assigned tags

      6 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Marius Obert
      Marius Obert

      Short and concise - a nice tick, Enric!

      I'm sure you already know this but I want to leave this video tutorial here in case someone comes along this post who doesn't know how to create a SAPUI5 app that can leverage dynamic tiles.

      Author's profile photo Artur Briem
      Artur Briem

      Thank you for the contribution!
      Unfortunately this seem not to work for me.
      First of all i tried to add the service url to the dynamic Tile in the CloudFoundry Portal with following settings, which threw an 500 internal server error.

      System : destination to approuter

      OData-Service-URLodata/SAP/ZFI_APPROVAL_OF_INVOICE_SRV/InvoiceSet/$count?$filter=Status%20eq%20%27O%27


      Then i found this blog post and tried to add a new tile with northwind service as you did.

      the count as you described to the launchpad i deployed with my app. Sadly this resulted in another error 404 Not Found

      I also tried to remove the filter but this did not change anything.

      The application logs also only show that it returned 404.

      2021-01-28T07:11:00.201+0000 [APP/PROC/WEB/0] OUT {"component_type":"application","component_id":"54ac4a13-3d0d-43a5-9d75-5ab05d5406cf","component_name":"InvoiceApproval","component_instance":0,"layer":"[NODEJS]","organization_name":"MJM_DEV_CF","organization_id":"2eac1c07-28b9-4d2c-b719-d753d3302e85","space_name":"Applications","space_id":"0b7d1079-0cc7-4e19-912c-21880b3e5908","container_id":"10.0.137.190","logger":"nodejs-logger","source_instance":0,"written_at":"2021-01-28T07:10:59.142Z","written_ts":1611817859142000000,"request_id":"","request_size_b":"","type":"request","request":"/dynamic_dest/MJM_INVOICEAPPROVAL_APPROUTER/odata/SAP/ZFI_APPROVAL_OF_INVOICE_SRV/InvoiceSet/$count?$filter=Status%20eq%20%27O%27&sap-language=de-DE","method":"GET","remote_user":"","direction":"IN","x_forwarded_for":"","response_time_ms":1059,"referer":"","correlation_id":"","tenant_id":"","tenant_subdomain":"-","level":"info","remote_host":"redacted","remote_port":"redacted","protocol":"HTTP/1.1","remote_ip":"redacted","request_received_at":"2021-01-28T07:10:59.142Z","response_status":404,"response_size_b":"","response_content_type":"","response_sent_at":"2021-01-28T07:11:00.201Z"}
      
      2021-01-28T07:11:00.201+0000 [RTR/58] OUT mjm-dev-cf-applications-invoiceapproval.cfapps.eu10.hana.ondemand.com - [2021-01-28T07:10:59.142042071Z] "GET /dynamic_dest/MJM_INVOICEAPPROVAL_APPROUTER/odata/SAP/ZFI_APPROVAL_OF_INVOICE_SRV/InvoiceSet/$count?$filter=Status%20eq%20%27O%27&sap-language=de-DE HTTP/1.1" 404 0 0 "https://mjm-dev-cf-applications-invoiceapproval.cfapps.eu10.hana.ondemand.com/cp.portal/site" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.141 Safari/537.36" "-" "10.0.137.190:61245" x_forwarded_for:"-" x_forwarded_proto:"https" vcap_request_id:"ccc1c71f-29e2-4eae-50a2-0021320c790d" response_time:1.059415 gorouter_time:0.000138 app_id:"54ac4a13-3d0d-43a5-9d75-5ab05d5406cf" app_index:"0" x_cf_routererror:"-" x_correlationid:"-" tenantid:"-" sap_passport:"-" x_scp_request_id:"409adb73-9b18-466d-90b2-3581896af4ae-60126382-FFAF97" x_cf_app_instance:"-" x_b3_traceid:"be99c9af62e665e2" x_b3_spanid:"be99c9af62e665e2" x_b3_parentspanid:"-" b3:"be99c9af62e665e2-be99c9af62e665e2"

       

      BUT when i try the request with the approuter URL it works fine, which also does in the App itself!

      Marius Obert
      Maybe you have an idea?

      Thanks i advance for every hint!

      Author's profile photo Rodrigo Girlando
      Rodrigo Girlando

      Nice blog!
      Does it works also on the Fiori Launchpad in the SCP Portal Service?

      thanks!

      Author's profile photo Lukas Metzger
      Lukas Metzger

      Thank you @Enric Castella Gonzalez for the great example!

       

      Is it possible to link a service/path which comes directly from a CAP Service?

      Or do you always need a seperate destination on the SCP?

       

      Thanks in advance!

      Author's profile photo Gregor Wolf
      Gregor Wolf

      Hi Lukas,

      in my fork of the central-launchpad-cap application from Mio Yasutake I've added the dynamic tile in this commit:

      https://github.com/gregorwolf/central-launchpad-cap/commit/4c9ee971fda10f9830f984885867d85b4cdfd107

      works just fine:

      CU
      Gregor

      Author's profile photo Vetrivel Shanmugam
      Vetrivel Shanmugam

      Where is the documentation for these configuration available ?