Skip to Content
0

Overview Page from Template in UI5

Mar 01 at 09:02 AM

67

avatar image
Former Member

Hi All,

I have a requirement to develop the overview page with template with the following details,

1. card with the list

2. card with any chart , or donut chart

3. card with the progress indicator

4.on click of line item it should navigate to the actual app.

Please let me know how can i achieve this, and any sample examples would be the great help.

Thanks in advance,

Pradeep

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

3 Answers

Best Answer
MEGHAL SHAH Mar 01 at 10:49 AM
0

Hi

Please check below example ,

https://blogs.sap.com/2016/01/11/sap-overview-page-list-cards-examples/

# to get the navigation details check below url

https://sapui5.hana.ondemand.com/#/topic/530f9e6f66104d5888ade79b5cf417e0

Regards ,

Meghal shah

Show 1 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi Meghal,

Thank you so much for the reply, and i will try out the example which is in the Link which you have shared.

Thanks a lot,

Best Regards,

Pradeep

1
Nicholas Owen O’Malley Mar 05 at 08:09 AM
0

Hello Pradeep V

Here are some examples on json to putt in manifest.json, One custom, one line and one bar


"customCard_Card": { "model": "northwind", "template": "name.cards.productionStatus", "settings": { "title": "{{titel}}", "entitySet": "Customers" } }, "line_Card": { "model": "northwind", "template": "name.cards.line", "settings": { "title": "{{line_title}}", "entitySet": "Sales_Totals_by_Amounts", "selectionAnnotationPath": "com.sap.vocabularies.UI.v1.SelectionVariant", "chartAnnotationPath": "com.sap.vocabularies.UI.v1.Chart", "presentationAnnotationPath": "com.sap.vocabularies.UI.v1.PresentationVariant", "selectionPresentationAnnotationPath": "com.sap.vocabularies.UI.v1.SelectionPresentationVariant", "identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification", "navigation": "dataPointNav" } }, "bar_card": { "model": "northwind", "template": "name.cards.bar", "settings": { "title": "{{bar_title}}", "entitySet": "Invoices", "selectionAnnotationPath": "com.sap.vocabularies.UI.v1.SelectionVariant", "chartAnnotationPath": "UI.Chart", "presentationAnnotationPath": "com.sap.vocabularies.UI.v1.PresentationVariant", "selectionPresentationAnnotationPath": "com.sap.vocabularies.UI.v1.SelectionPresentationVariant", "identificationAnnotationPath": "com.sap.vocabularies.UI.v1.Identification", "navigation": "dataPointNav" } }
Show 2 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi Nicholas,

your code Helped me a lot , Thank you :)

Best Regards,

Pradeep

0

No problem. A upvote is always appreciated :)

1
Prasita Prabhakaran
Mar 14 at 03:51 AM
0
Show 1 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi Prasita,

Thanks a lot for the Reply.

it is really a good example.

0