Create the Application Project
Use
In this step, you create the application project where the Fiori app will be imported.
Procedure
-
Open Eclipse.
Choose File → New → Project.
Select SAPUI5 Application Development.
Select Application Project.
Choose Next >.
In the New Application Project window, make the following entry:
-
Field Name
|
Entry Value
|
Project name
|
(for example, SD_MYQUOTES)
|
Select Use default location.
Select Mobile (or sap.m) in Target Device (or Library).
Remove selection from Create an Initial View.
Choose Finish.
Result
You have created an SAPUI5 application project.
Import the Downloaded Application to the Eclipse Project
Use
In this step, you import the downloaded application to the Eclipse project created in the previous step.
Procedure
-
Open Eclipse.
In the Project Explorer on the left, select the project
(for example, SD_MYQUOTES).
Expand project.
Right-click the WebContent folder.
Choose Import….
In the Import window, select General → File System.
Choose Next >.
Choose Browse… in the From directory: field.
Select the folder where the content of the downloaded app is (used in step Retrieving the SAP Fiori App).
Choose Ok.
Choose Select All.
Choose Finish.
Result
You have imported the downloaded SAP Fiori app to the SAPUI5 application project created previously.
Extend OData Service
Use
This is a prerequisite for the view extension to add a new field to the frontend.
Within this example implementation, 3 different fields are added to the SAP Fiori app and the corresponding Odata service is enhanced. Find here a short description which, backend fields of the quotation are used in these examples:
Procedure
Example1: ‘Title’ for the Partner Function ‘Ship-to party
-
Access the quotation using one of the following navigation options in the SAP ERP backend:
-
SAP Menu
|
Logistics Sales and Distribution Sales Quotation Display
|
Transaction Code
|
VA23
|
Open a quotation and navigate via the menu: Goto Header Partner.
Select the partner function Ship-to party.
Choose Detail.
The Title field is used as first example:
Example2: ‘Incoterms’ from the Billing Document’
-
Access the quotation using one of the following navigation options in the ERP Backend :
-
SAP Menu
|
Logistics Sales and Distribution Sales Quotation Display
|
Transaction Code
|
VA23
|
Open a quotation and navigate via the menu: Goto Header Billing.
The fields Incoterms are used as second example:
Caution
This section needs to be carried out for the ‘Add Fields’ scenario only. The corresponding frontend enhancements are described in chapter ‘Implement the view Extension (Add Fields)’.
Use
In this step, you extend the ABAP DDIC Structure of the ODATA service with an append structure in the back-end system so that it can be used in the user interface displaying the data from the connected back-end system.
Note
This step is carried out in the back-end system.
Procedure
-
In SAP GUI, access the following transaction:
-
Choose Enter.
Choose Repository Browser.
From the dropdown, choose Package.
Choose the arrow button.
Choose the Information System button.
Make the following entry:
-
Field Name
|
Entry Value
|
Package
|
ERP_SD_ODATA*
|
Choose Execute.
Select package ERP_SD_ODATA_MYQUOTATION and double-click it.
On the left side, choose Dictionary Objects → Structures.
Example1: Title
-
Double-click the option TDS_ODATA_QUOTATION_PARTNER_IN.
Choose the Append Structure… button on top.
In the Create Append Structure for TDS_ODATA_QUOTATI… window, make the following entry:
-
Field Name
|
Entry Value
|
Append Name
|
Z (for example, Z00_PARTNER_EXT)
|
Choose Continue.
Enter a Short Description.
Make the following entry:
-
Field Name
|
Entry Value
|
Component
|
TITLE_T
|
Typing Method
|
Types
|
Data Type
|
CHAR
Note
You need to choose the Predefine Type button to change this.
|
Length
|
25
|
Choose Save.
Choose your Package. In case you do not want to transport, you can use package $tmp.
Choose Save.
Choose Activate to activate the append structure.
Choose Back.
Example2: Incoterms
-
Double-click the option TDS_ODATA_QUOTATION_HEADER_INC.
Choose the Append Structure… button on top.
In the Create Append Structure for TDS_ODATA_QUOTATI… window, make the following entries:
-
Field Name
|
Entry Value
|
Append Name
|
Z (for example, Z00_HEADER_EXT)
|
Choose Continue.
Enter a Short Description.
Make the following entries:
-
Field Name
|
Entry Value
|
Component
|
INCO1
|
Typing Method
|
Types
|
Component Type
|
INCO1
|
Enter a second line for the long text of the incoterms:
-
Field Name
|
Entry Value
|
Component
|
INCO2
|
Typing Method
|
Types
|
Component Type
|
INCO2
|
Choose Save.
Choose your Package. In case you do not want to transport, you can use $tmp.
Choose Save.
Choose Activate to activate the append structure.
Choose Back.
Result
You have now added the new fields to the structure.
Extend OData Service
Use
In this step, you extend the standard OData service to implement the property added in previous step. This step is carried out in the frontend system.
Procedure
-
In SAP GUI, access the following transaction:
-
Choose Enter.
Choose Create Project.
In the Create Project window, make the following information entries:
-
Field Name
|
Entry Value
|
Project
|
(for example Z_LORD_MY_QUOTATION)
Note
The project name Z_LORD_MY_QUOTATION is used in the following example.
|
Description
|
(for example: My Quotations Extended OData Service)
|
Package
|
(in case you do not want to transport you can use $tmp)
|
Choose Continue.
Select your project and choose the Display <-> Change button for edit mode.
If prompted choose Yes to save.
Right-click Data Model and choose Redefine → OData Service (GW).
In the Wizard Step 1 of 2: Redefine Service window, make the following information entries:
-
Field Name
|
Entry Value
|
Technical Service Name
|
LORD_MY_QUOTATION_SRV
|
Version
|
0001
|
Choose Next.
Choose Select All in the top left.
Choose Finish.
Example1: Title
-
In your new project, expand Data Model, Entity Types and Partner.
Double-click the Properties.
Choose Display <-> Change button for edit mode.
Choose Append Row.
Make the following entries:
-
Field Name
|
Entry Value
|
Name
|
Title
|
Edm Type
|
Edm.String
Caution
Choose value helper button, select Edm.String and choose Copy.
|
Max Length
|
25
|
Label
|
Title
|
ABAP Field Name
|
TITLE_T
Caution
Choose value helper button, select TITLE_T and choose Copy.
|
Choose Check Project Consistency on the top left to check for errors.
Example2: Incoterms
-
In your new project, expand Data Model, Entity Types and QuotationHeader.
Double-click the Properties.
Choose Display <-> Change for edit mode.
Choose Append Row.
Make the following entries:
-
Field Name
|
Entry Value
|
Name
|
Inco1
|
Edm Type
|
Edm.String
Caution
Choose the value helper button, select Edm.String and choose Copy.
|
Max Length
|
3
|
Label
|
Inco1
|
ABAP Field Name
|
INCO1
Caution
Choose the value helper button, select INCO1 and choose Copy.
|
Append a second line:
-
Field Name
|
Entry Value
|
Name
|
Inco2
|
Edm Type
|
Edm.String
Caution
Choose the value helper button, select Edm.String and choose Copy.
|
Max Length
|
28
|
Label
|
Inco2
|
ABAP Field Name
|
INCO2
Caution
Choose the value helper button, select INCO2 and choose Copy.
|
The following steps are valid for both examples:
-
Choose Check Project Consistency button on top left to check for errors.
Choose Generate Runtime Objects.
Choose Continue.
Choose your Package. In case you do not want to transport, you can use $tmp.
Choose Save.
Expand folder Runtime Artifacts in your project.
Double-click ZCL_Z_LORD_MY_QUOTAT_MPC_EXT.
In the right screen area, double-click the ZCL_Z_LORD_MY_QUOTAT_MPC_EXT.
Expand Methods -> Inherited Methods in the navigation area.
Right-click DEFINE and select Redefine.
Select the Redefinitions and double-click DEFINE.
In the content, insert the following code:
Example1: Title
Syntax
-
method DEFINE.
super->define( ).
model->get_entity_type( 'Partner' )->get_property( 'PartnerFunction' )->set_conversion_exit( '' ) ##NO_TEXT.
endmethod.
|
Example2: Incoterms
Syntax
-
method DEFINE.
super->define( ).
model->get_entity_type( 'QuotationHeader' )->get_property( 'QuotationID' )->set_conversion_exit( '' ) ##NO_TEXT.
endmethod.
|
Choose Check.
Choose Save.
Choose Activate.
Choose Continue.
To register the OData service in SAP GUI, access the following transaction:
-
Expand your project and Service Maintenance.
Double-click LOCAL.
Choose Register.
Choose Yes if a pop-up window appears.
Choose your Package. In case you do not want to transport, you can use $tmp.
Choose Continue.
Result
You have now extended the OData service, and the fields are now part of your service.
Use
The extended OData service can be tested and displays the data maintained in the back-end system for a specific quotation.
Procedure
-
Access the service using one of the following navigation options in the frontend system:
-
IMG Menu (Spro)
|
SAP NetWeaver Gateway OData Channel Administration Activate and Maintain Services
|
Transaction Code
|
/IWFND/MAINT_SERVICE
|
Carry out the following steps:
Double-click the service in the list you have created in the previous step.
Choose Gateway Client.
In the line Request URI replace ?format=xml with the following text:
Example 1: Title
QuotationHeaderSet('')?$expand=PartnerSet
Example 2: Incoterms
QuotationHeaderSet('')
Choose Execute.
Result
Within the http response, the above added fields are displayed including the data maintained in the back-end system.
Share with your friends: |