Kategorie: SAPUI5 / Fiori

Eclipse Project

Datenhaltung

• transparente Tabelle
• hält die Geschäftsdaten

@EndUserText.label : 'Tabelle für XYZ'
@AbapCatalog.enhancement.category : #NOT_EXTENSIBLE
@AbapCatalog.tableCategory : #TRANSPARENT
@AbapCatalog.deliveryClass : #A
@AbapCatalog.dataMaintenance : #ALLOWED
define table ztablexyz {
  key client            : abap.clnt not null;
  key id                : sysuuid_x16 not null;
  name                  : abap.char(50);
  description           : abap.char(200);
  lastchangedat         : timestampl;
  locallastchangedat    : timestampl;
  active                : abap_boolean;
  age                   : abap.int1;
}

Root Entity

• CDS-View
• definiert Geschäftsobjekt
• Sicht auf die DB-Tabelle ztablexyz

@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Root Entity View'
define root view entity z_i_xyz as select from ztablexyz
{
    key id as Id,
    name as Name,
    description as Description,
    @Semantics.systemDateTime.lastChangedAt: true
    lastchangedat as Lastchangedat,
    @Semantics.systemDateTime.localInstanceLastChangedAt: true
    locallastchangedat as Locallastchangedat,
    active as Active,
    age as Age
}

Projection View

• CDS-View mit Annotationen
• Sicht auf Root Entity

@EndUserText.label: 'Projection View'
@AccessControl.authorizationCheck: #NOT_REQUIRED
@Search.searchable: true
@Metadata.allowExtensions: true
define root view entity z_c_xyz
provider contract transactional_query
as projection on z_i_xyz
{
    @EndUserText.label: 'Id'
    key Id,
    @EndUserText.label: 'Name'
    @Search.defaultSearchElement: true
    Name,
    @EndUserText.label: 'Description'
    @Search.defaultSearchElement: true
    Description,
    Lastchangedat,
    Locallastchangedat,
    @EndUserText.label: 'Active'
    Active,
    @EndUserText.label: 'Age'
    Age
}

Metadatenerweiterung (Annotationen) für Projection View

• beinhaltet Header-Info (@UI)
• Facet-Definition (@UI.facet) für die Einbindung eines Edit-Fensters (View-Window) für das Neuanlegen/Editieren (#FOR_ACTION) von Daten von Entitäten (Draft-Handling)
• Werthilfe z_c_ValueHelp wird für Feld ‚Name‘ eingebunden

@Metadata.layer: #CORE
@UI: {
    headerInfo: {
    typeName: 'ItemXYZ',
    typeNamePlural: 'ItemsXYZ',
    title: { type: #STANDARD, label: 'ItemXYZ', value: 'Name' },
    description: { label: '(Description)' },
    typeImageUrl: 'sap-icon://chart-axis'
  }
}

annotate view z_c_xyz with
{
  @UI.facet: [{ id: 'ItemXYZ', purpose: #STANDARD, type: #IDENTIFICATION_REFERENCE, label: 'ItemXYZ', position: 10 }]

  @UI: { lineItem: [ { label: 'Id', position: 10 } ], identification: [{ position: 10 }] }
  Id;
  @UI: { lineItem: [ { label: 'Name', position: 20 } ], identification: [{ position: 20 }], selectionField: [{ position: 20 }] }
  @Consumption.valueHelpDefinition: [ { entity: { name: 'z_c_ValueHelp', element: 'Name' } } ]
  Name;
  @UI: { lineItem: [ { label: 'Desc', position: 30 } ], identification: [{ position: 30 }], selectionField: [{ position: 30 }] }
  Description;
  @UI.hidden: true
  Lastchangedat;
  @UI.hidden: true
  Locallastchangedat;

  @UI: { lineItem: [ { label: 'Set Active', position: 40, type: #FOR_ACTION, dataAction: 'setActive' } ] }
  Active;

  @UI: { lineItem: [ { label: 'Age', position: 50 } ], identification: [{ position: 50 }], selectionField: [{ position: 50 }] }
  Age;
}

View für Werthilfe

@AbapCatalog.viewEnhancementCategory: [#NONE]
@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: 'Search Help'
@Metadata.ignorePropagatedAnnotations: true
@ObjectModel.usageType:{
    serviceQuality: #X,
    sizeCategory: #S,
    dataClass: #MIXED
}
 
define view entity z_c_ValueHelp as select from z_i_xyz
{
    @UI.hidden: true
    key Id,
    Name,
    Description
}

Managed Behaviour Definition

• grundsätzlich bei Views, die mehr als nur lesen sollen
• bildet transaktionales Verhalten ab
• Implementation Type: Managed

Root View

managed implementation in class zbp_i_xyz unique; // Managed Behaviour Implementation erfolgt in ABAP-Klasse
strict ( 2 );

with draft; // für Button "Insert" im UI
define behavior for z_i_xyz alias a_i_xyz
persistent table ztablexyz // Datenhaltung in transparenter Tabelle
// Draft-Tabelle kann automatisiert in der Managed Behaviour Implementation über einen Quick Fix (CTRL + 1) generiert werden
draft table ztablexyz_draft // Drafts werden in der Entwurfstabelle zwischengespeichert
lock master total etag LastChangedAt // Lockkriterieum für die Drafts ist das letzte Änderungsdatum
authorization master ( instance )
//etag master <field_name>
{
   draft action Edit;
   draft action Activate;
   draft action Discard;
   draft action Resume;
   draft determine action Prepare;

   create;
   update;
   delete;

   field ( numbering : managed, readonly ) Id;
   field ( readonly ) Active, Lastchangedat, Locallastchangedat;

// zusätzliche selbstdefinierte Action
   action ( features : instance ) setActive result [1] $self;

   mapping for ztablexyz corresponding // im Backend werden die gleichnamigen Felder bei INSERT/UPDATE gemappt, hier brauchen eigentlich nur die nicht namensgleichen Felder gemappt werden
   {
      Id = id;
      Name = name;
      Description = description;
      Lastchangedat = lastchangedat;
      Locallastchangedat = locallastchangedat;
      Active = active;
      Age = age;
   }
}

generierte Draft Table

• speichert Änderungen zwischen (Draft-Handling)
• Includiert zusätzliche Draft-Felder (sych_bdl_draft_admin_inc)

@EndUserText.label : 'Drafttabelle für XYZ'
@AbapCatalog.enhancement.category : #EXTENSIBLE_ANY
@AbapCatalog.tableCategory : #TRANSPARENT
@AbapCatalog.deliveryClass : #A
@AbapCatalog.dataMaintenance : #RESTRICTED
define table ztablexyz_draft {

  key mandt             : mandt not null;
  key id                : sysuuid_x16 not null;
  name                  : abap.char(50);
  description           : abap.char(200);
  lastchangedat         : timestampl;
  locallastchangedat    : timestampl;
  active                : abap_boolean;
  age                   : abap.int1;
  "%admin"              : include sych_bdl_draft_admin_inc;
}

Projection View

projection;
strict ( 2 );
use draft;

define behavior for z_c_xyz //alias <alias_name>
use etag
{
// Button "Delete" Standardfunktion wird im UI eingefügt
  use delete;
// Button "Create" Standardfunktion --> Daft Handling (Tabellen, UI Facet...) muss zusätzlich implementiert werden
  use create;
  use update;

// Button für selbstdef. Action "setActive"
  use action setActive;

  use action Edit;
  use action Activate;
  use action Discard;
  use action Resume;
  use action Prepare;
}

Managed Behaviour Implementation

• globale Klasse zur „Behaviour Implementation“ anlegen: zbp_i_xyz
• lokale Klasse lhc_zbp_i_xyz mit Verhaltensausprägung

CLASS lhc_zbp_i_xyz DEFINITION INHERITING FROM cl_abap_behavior_handler.
  PRIVATE SECTION.

    METHODS get_instance_authorizations FOR INSTANCE AUTHORIZATION
      IMPORTING keys REQUEST requested_authorizations FOR a_i_xyz RESULT result.
    METHODS get_instance_features FOR INSTANCE FEATURES
      IMPORTING keys REQUEST requested_features FOR a_i_xyz RESULT result.
    METHODS setactive FOR MODIFY
      IMPORTING keys FOR ACTION a_i_xyz~setactive RESULT result.
ENDCLASS.

CLASS lhc_zbp_i_xyz IMPLEMENTATION.

  METHOD get_instance_authorizations.

  ENDMETHOD.

  METHOD get_instance_features.
    " Read the active flag of all items
    READ ENTITIES OF z_i_xyz IN LOCAL MODE
        ENTITY a_i_xyz
          FIELDS ( Active ) WITH CORRESPONDING #( keys )
        RESULT DATA(items)
        FAILED failed.

    result = VALUE #( FOR item IN items
            LET status = COND #( WHEN item-Active = abap_true
                                 THEN if_abap_behv=>fc-o-disabled
                                 ELSE if_abap_behv=>fc-o-enabled  )
                                 IN

            ( %tky              = item-%tky
              %action-setActive = status
             ) ).
  ENDMETHOD.

  METHOD setActive.

    MODIFY ENTITIES OF z_i_xyz IN LOCAL MODE
    ENTITY a_i_xyz
    UPDATE
    FIELDS ( Active )

    WITH VALUE #( FOR key IN keys
                  ( %tky   = key-%tky
                    Active = abap_true ) )

       FAILED failed
       REPORTED reported.

    READ ENTITIES OF z_i_xyz IN LOCAL MODE
    ENTITY a_i_xyz
    ALL FIELDS WITH CORRESPONDING #(  keys )
    RESULT DATA(items).

    result = VALUE #(  FOR item IN items
                       ( %tky   = item-%tky
                         %param = item
                        ) ).
  ENDMETHOD.

ENDCLASS.

ODATA V4 Service Definition

• Publiziert den Projection-View z_c_xyz als ODATA V4 Service

@EndUserText.label: 'Service def.'
define service z_expose_xyz {
  expose z_c_xyz;
}

ODATA V4 Service Binding einrichten

• SAP-GUI Transaktion /IWFND/V4_ADMIN aufrufen
• Service-Gruppe publizieren
• Systemalias i.d.R. ‚LOCAL‘

Business Application Studio (BAS)

Fiori-Elements-App zum ODATA V4-Service einrichten

• neues Projekt in der BAS anlegen: ‚SAP Fiori Application‘
• Template ‚List Report Page‘
• Service: den publizierten ODATA V4 Service
• ‚Add deployment configuration‘
• ‚Configure Advanced Options‘ wählen
• ‚Add Eslint configuration to the project‘
• ‚Add code assist librares to your project‘
• Page Map (Flexible Column Layout, Flex enabled, Controller-Extensions: Lifecycle-Funktionen (JS) elegant überschreiben)
• Guided Developement –> Code Snippets einfügen
• Data Editor

Fiori-Elements-App deployen

• wenn nicht beim Erstellen des Projects option ‚Add deployment configuration‘ gewählt wurde, dann im BAS-Explorer
  • npm-scripts: deploy-config oder
  • Quick-Access: Deploy oder
  • Task-Explorer: deploy npm oder
  • Command Palette: Add Deployment Configuration
• Deployment ausführen: Console: npm run deploy
• Bei Erfolg: BSP-Applikation ist im Backend ins Zielpaket geladen worden

App ins Fiori Launchpad einbinden

• Transaktion /UI2/SEMOBJ: Semantisches Objekt anlegen
• Fiori Launchpad –> Fiori Anwendungsmanager: technischen Katalog anlegen –> App-Id steht in der manifest.json
• Transaktion /UI2/FLPCM_CUST: technischen Katalog prüfen
• Transaktion PFCG: Rollen zuweisen (Menü –> Transaktion –> SAP Fiori Launchpad –> Launchpad-Katalog)
• Transaktion /UI2/FLP: App im Fiori Launchpad einbinden –> App Finder –> Katalog

Links

• https://developers.sap.com/tutorials/fiori-tools-rap-create-application.html
• https://software-heroes.com/blog/abap-rap-generator-fiori
• https://learning.sap.com/learning-journeys/developing-an-sap-fiori-elements-app-based-on-a-cap-odata-v4-service
• https://developers.sap.com/group.fiori-tools-odata-v4-travel.html
• https://community.sap.com/t5/technology-blogs-by-sap/sap-fiori-elements-for-odata-v4-knowledge-resources/ba-p/13554974
• https://sapui5.hana.ondemand.com/test-resources/sap/fe/core/fpmExplorer/index.html#/overview/introduction
• https://experience.sap.com/fiori-design-web/floorplan-overview/
• https://github.com/SAP-samples/abap-cheat-sheets/blob/main/08_EML_ABAP_for_RAP.md