Object Page app in Fiori Elements app

When it comes to "Object Pages" in SAP Fiori Elements apps, it is a modern, customizable app type for presenting details of a single business object. Object Page is designed to provide a simplified development methodology that enables developers to quickly create detail pages that comply with SAP Fiori user experience standards. This application type combines features such as field layout, interactive charts, smart forms, and navigation functions in a configurable manner to help users browse and edit detailed information of business objects more intuitively. At the same time, Object Page can be easily connected with back-end OData service or CDS (Core Data Services) view, so that developers can focus on business logic and user experience rather than technical details. The features, components and an example of Object Page will be introduced in detail below to illustrate its usage.

Features and components:

1. Field Layout ( Flexible Column Layout): Object Page apps employ a flexible column layout that allows users to display and navigate different content areas on the screen. A typical layout includes a title area, details area, and navigation area.

2. Interactive charts ( Interactive Charts): Object Page supports embedded interactive charts, such as line charts, histograms, etc. These charts can visually display data trends and analysis results related to current business objects.

3. Smart form ( Smart Form): Object Page can automatically generate a smart form to automatically display the detailed information of the business object according to the back-end data model. These form fields can be automatically generated based on the data model and metadata from backend services, reducing the developer's workload.

4. Navigation function ( Navigation Actions): Object Page supports nested navigation function within the detail page, allowing users to navigate from one business object to other related business objects. In this way, users can more easily interact and navigate between different business objects.

5. Tab page ( Tab Sections): Object Page Tab pages can be used in the detailed information area to classify the related information of the business object. Each tab can contain different fields and content to help users better organize and browse information.

6. Edit Mode ( Edit Mode): The Object Page supports edit mode, which allows users to directly edit the properties of a business object on the detail page. This way, the user can quickly update the data without having to go back to the list page or other pages.

7. Associated data ( Associated Data): On the Object Page, you can also display the associated data of the business object, such as displaying information about sub-objects or related objects related to the current business object.

Example:

Suppose we have a business scenario of "Employee". Now, we want to create an Object Page application to display the detailed information of a single employee, including basic information, salary information, department information, performance evaluation, etc. We also want to show the employee's performance history line graph and related training records on the detail page.

1. Data model and service : First, we need to define the employee data model and create the corresponding OData service in the backend. The data model may contain entities such as "Employee", "Salary", "Department" and "Performance", which may have different relationships between them.

2. Create Object Page applications : In SAP Web IDE or other suitable development tools, we can use the "Fiori Elements" template to create Object Page applications. During the creation process, we need to select the "Object Page" type and associate the data model just created.

3. Configure field layout : After the application is created, we can start configuring the field layout. We can put the employee's basic information, salary information and department information in the title area, and put the performance evaluation information in the detailed information area. At the same time, add navigation links in the navigation area so that users can quickly navigate to other relevant employee information.

4. Embed line chart : We can embed a line chart in the detailed information area to display the employee's performance history data. This line chart can display the performance evaluation results of different time periods according to the data of the "Performance" entity.

5. Smart Forms : We can use smart forms to automatically generate employee basic information, salary information and department information. These form fields can be automatically generated from the data model and support an edit mode, allowing users to update employee information directly on the page.

6. Linked data : We can also display employee-related data on the detail page, such as displaying employee training records. Users can navigate to the associated training record by clicking on the corresponding link.

Through the above configuration, our Object Page application now has the ability to display detailed information of employees. Users can view employees' basic information, salary information, department information, performance evaluation, etc. through this application, and can edit employee information and navigate to other related information at the same time.

Summarize

Object Page is a powerful tool in SAP Fiori Elements for presenting details of a single business object. Its configurability and modern user experience enable developers to quickly build complex detail display and editing applications while ensuring compliance with SAP Fiori's user experience standards.