Reporting mit Fiori Elements

LESEZEIT: 10 MINUTEN

Reporting mit Fiori Elements

Dienstag, 12.4.2022

Mit Fiori Elements können mit geringem Aufwand sehr mächtige Fiori Apps erstellt werden. Basis ist dabei, dass die Oberfläche nicht mit UI5 ausprogrammiert wird, sondern durch Annotationen generiert wird. Für den End User ist nicht ersichtlich, ob eine App ausprogrammiert oder mit Fiori Elements konfiguriert wurde. In diesem Blog möchten wir kurz auf die verschiedenen Typen der Fiori Elements Apps eingehen und einen Einblick in die Entwicklung solcher Apps geben.

Übersicht Inhalt:

  1. Übersicht der Fiori Elements App Typen
    1. Analytical List Pages (ALP)
    2. Overview Page
  2. Entwicklung der Fiori Elements Apps
    1. Entwicklungsumgebung
    2. Annotationen und WebIDE vs. BAS
    3. Extensions
    4. Deployment
    5. Git
  3. Fazit

Übersicht der Fiori Elements App-Typen

Einen Teil der App-Typen haben wir in unserem ersten Blog dieser Reihe bereits vorgestellt.

Generell gibt es vier verschiedene App-Typen, die mit Fiori Elements erstellt werden können:

  • Analytical List Page / Object Page
  • List Report Application
  • Overview Page
  • Worklist / Object Page

Analytical List Pages

Auf einer ALP können Kennzahlen zu Objekten sowohl tabellarisch als auch per Chart visualisiert werden. Zusätzlich stehen mit Hilfe des visuellen Filterbereichs oberhalb von Chart/Tabelle komfortable Filtermöglichkeiten zur Verfügung. Man kann mit einer ALP sehr schnell die relevanten Objekte (z.B. Projekte, Mitarbeiter, …) anhand der wichtigsten Kennzahlen identifizieren und dann die Details auf einer Object Page zum gewählten Objekt analysieren. Was uns extrem begeistert, ist die Performance der Analytical Table – diese kann selbst mehrere 10‘000 Zeilen unglaublich schnell bearbeiten.

Weitere Details dazu hier. 

Beispiel: ProGress Plus ALP + Object Page

Beispiel: ProGress Plus ALP + Object Page

Beispiel ProGress Plus ALP + Object Page 2

 

List Report Application

In einer List Report Application geht es weniger um die grafische Darstellung, sondern mehr um das Handling von grossen Listen. Microcharts sind direkt in der Tabelle möglich. Auch hier ist ein Absprung in eine Object Page möglich.

Weitere Details dazu hier. 

List Report Application

Overview Page

Eine Overview Page stellt sozusagen das Dashboard in Fiori dar. Hauptsächlich werden dort via Charts Kennzahlen zu den gewählten Filterungen dargestellt. Oft ist aber auch eine kurze Auflistung von Objekten (z.B. Projekten, Verträgen usw.) zu finden, welche eine dringende Handlung erfordern.

Weitere Details dazu hier. 

 Beispiel: ProGress Plus Overview Page

Beispiel ProGress Plus Overview Page

Worklist

Eine Worklist App stellt dem User einen Arbeitsvorrat zur Verfügung. Es werden also Objekte dargestellt, mit denen der User etwas tun muss, z.B. genehmigen oder ablehnen.

Worklist

Entwicklung der Fiori Elements Apps

Fiori Elements Apps basieren wie „normale“ Fiori Apps auf OData-Services. Man kann die OData-Services mit ABAP ausprogrammieren, aber viel einfacher ist es, sie mit CDS-Views zu generieren. Dazu dient das ganze virtuelle Datenmodell der SAP– wie im zweiten Teil dieser Blogreihe erläutert.

Es muss eine Annotation in die CDS-View aufgenommen werden:
@OData.publish: true

Daraufhin wird automatisch ein OData-Service für die CDS-View generiert.

Fiori Apps laufen auf einem Frontendserver – entweder direkt eingebettet im S/4HANA-System oder auch standalone. Auf diesem Frontendserver wird dann mit der Transaktion /IWFND/MAINT_SERVICE der OData-Service aktiviert und ist ab dann nutzbar.

Entwicklungsumgebung

Als Entwicklungsumgebung stehen die WebIDE und ihr Nachfolger, das Business Application Studio (BAS) zur Verfügung. Beide Tools sind primär für die Nutzung in der Cloud via SAP Business Technology Platform gedacht, es gibt jedoch auch On-Premise-Varianten davon.

Aus unserer Erfahrung heraus empfehlen wir sehr, die Cloud-Versionen zu nutzen. Es gibt zwar einmalig etwas Aufwand, um den Cloud Connector zu installieren und durch die Firewalls erreichbar zu machen, jedoch funktioniert diese Umgebung danach sehr stabil und es ist sehr leicht, weitere Entwickler mit ins Projekt zu integrieren. Die On-Premise-Installationen greifen direkt auf den Frontendserver zu, benötigen jedoch lokale Installationen und häufig auch manuelle Updates.

Bild6_1

Annotationen und WebIDE vs. BAS

Fiori-Elements-Apps werden im Wesentlichen konfiguriert. Die Oberfläche wird also nicht mit UI5 Coding programmiert, sondern durch Annotationen „zusammengeklickt“.

Man wählt in beiden Entwicklungstools einen der Fiori Elements App-Typen als Template aus und wird dann mit einem Assistenten durch die Auswahl des gewählten Systems, des OData-Services und den relevanten Grundeinstellungen geführt.

Das Aussehen der App im Detail wird dann durch die Annotationen gesteuert.

Hier sehen wir zwei Beispiele für Annotationen in der WebIDE:

  • Selektionsfelder im Filter: Annotation @UI.SelectionFields
  • Spalten in der Tabelle: Annotation @UI.LineItems

 

Beispiele für Annotationen in der WebIDE 1

 

Mittels Mausklick auf eine Kachel kann ein Drill-down auf eine vordefinierte Sicht initiiert werden, wo meist auch per Dropdown zwischen verschiedenen Ansichten gewechselt werden kann. Hier kann man auch sehr gut in einer Ansicht auf ein Merkmal filtern und anschliessend die Details einer anderen Ansicht für diese Filterung analysieren. 

SAP Smart Business KPIs

Beispiele für Annotationen in der WebIDE 2

 

Im Annotation Modeler sieht das dann etwas übersichtlicher aus.

Annotation Structure

 

Diese Annotationen können in der Datei annotations.xml in der Fiori App eingebaut werden, aber auch bereits in der CDS-View bzw. einer Metadata Extension dazu. Somit können Fiori Apps erstellt werden, ohne in der WebIDE oder im BAS etwas anpassen zu müssen. Das UI kann also direkt bei den Daten festgelegt werden.

Beispiele für Annotationen in CDS-Views bzw. Metadata Extension zur CDS-View

Beispiele für Annotationen in CDS-Views bzw. Metadata Extension zur CDS-View

 

Im Business Application Studio stehen sehr viele Assistenten im Rahmen der Fiori Guided Development Tools zur Verfügung. Im Wesentlichen muss man nur wissen, was man tun will, aber nicht, wie es genau geht.

Fiori Guided Development Tools

 

Dazu wird der passende Assistent ausgewählt und die vom Assistenten angezeigten Felder ausgefüllt. Die benötigten (und richtigen) Annotationen werden an die richtige Stelle in die Annotationsdatei gestellt.

CDS-Views bzw. Metadata Extension zur CDS-View 3

 

Das ist ein riesiger Fortschritt gegenüber der WebIDE. Dort konnte man zwar auch die Annotationen zusammenklicken, aber man musste genau wissen, welche Annotationen man braucht und diese dann entsprechend einbauen. Es wird zwar gut in der Dokumentation erklärt, aber man muss es halt manuell hinzufügen.

WebIDE

 

In der WebIDE gibt es noch den Visual Editor, mit dem man sehr eingeschränkt weitere Anpassungen ohne Coding machen kann. Aber so richtig hilfreich ist der eigentlich nicht.

Bild14-1

Extensions

Natürlich gibt es auch Fälle, in denen eine Anforderung nicht mit Annotationen erfüllt werden kann. Dafür gibt es die Möglichkeit, über Extensions an sehr vielen Stellen eigene Elemente einzubauen. Dies geht so weit, dass ganze Views mit UI5-Coding und JavaScript-Controllern eingebaut werden können. Damit sind die Möglichkeiten unbegrenzt.

Extensions

Deployment

Wenn die Erstellung der App fertig ist, wird sie aus der WebIDE bzw. dem BAS heraus auf den Frontendserver deployed. Dabei wird sie in einem normalen SAP-Transportauftrag aufgezeichnet und dann innerhalb der Transportschiene in die Folgesysteme transportiert. Es müssen noch die Sprungziele und entsprechende Kachelkataloge und Kachelgruppen konfiguriert werden, damit die App dann im Fiori Launchpad aufrufbar ist. Bereits in der Entwicklungsumgebung kann die App schon mit den echten Daten getestet werden.

Git

Wir empfehlen sehr stark, ein Git Repository für die Verwaltung der Versionen der Fiori Apps zu verwenden. Dies kann sehr gut sowohl in die WebIDE als auch das BAS integriert werden. Typische Vertreter sind github.com und gitlab.com.
In der SE80 taucht die deployte App zwar auf, ist dort aber nicht wirklich wartbar.

Man kann zwar so eine App auch vom ABAP Repository in die Entwicklungsumgebung importieren, aber danach funktionieren viele Assistenten nicht mehr richtig --> dies sollte man unbedingt vermeiden und immer das Originalprojekt seiner Entwicklungsumgebung entweder irgendwo als zip-File exportieren und ablegen oder aber sehr viel eleganter in einem Git-Repository verwalten.

Fazit

Wir sind von den Möglichkeiten der Fiori Elements Apps sehr überzeugt und schätzen diese vor allem dafür, sehr mächtige, performante und nicht zuletzt auch attraktive Reporting-Anwendungen zu erstellen, die vom Aufbau und Coding her auch noch einfach wartbar sind.

Weitere Informationen

Haben Sie Fragen zur Thematik? Sprechen Sie mit uns über die Chancen, welche die verschiedenen Fiori Apps für Ihr Unternehmen bietet. Gerne zeigen wir Ihnen die Möglichkeiten auch individuell für Ihr Unternehmen in einer unverbindlichen Demo.

Hier Kontakt aufnehmen.

Weitere Informationen erhalten Sie zudem auf unserer Website hier.

Lesen Sie auch Teil 1 und 2 unserer dreiteiligen Blogserie: 
SAP S/4HANA - Reporting und Analysemöglichkeiten
Reporting Datenbeschaffung mittels ABAP CDS (Core Data Services)

 

UNSER WISSEN KOSTENLOS FÜR SIE!
E-BOOKS, RATGEBER, CHECKLISTEN UND VIELES MEHR

JETZT ANSEHEN