Building Modern SAP Fiori Elements Apps with OData V4

Accelerating Fiori App Development with Fiori Elements & OData V4

SAP Fiori Elements provides pre-defined UI page templates (List Report, Object Page, Analytical List Page) driven by metadata annotations. With OData V4, performance is drastically improved via batch processing and reduced payload overhead.

UI Annotations in ABAP CDS Views

@UI.headerInfo: { typeName: 'Sales Order', typeNamePlural: 'Sales Orders' }
define root view entity ZC_SalesOrder
  as projection on ZI_SalesOrder
{
  @UI.facet: [ { id: 'SalesOrderHeader', type: #IDENTIFIER_REFERENCE, label: 'General Info' } ]
  @UI.lineItem: [ { position: 10, label: 'Order ID', importance: #HIGH } ]
  key SalesOrderID,
  
  @UI.lineItem: [ { position: 20, label: 'Customer Name' } ]
  CustomerName,
  
  @UI.lineItem: [ { position: 30, label: 'Net Amount' } ]
  NetAmount
}