Skip to Content
Technical Articles
Author's profile photo Harsha pagadala

Customize the list report application generated by FIORI elements to look like a worklist application.

Hello All,

This blog post explains how to customize the list report application template to look like a worklist application.

FIORI Elements benefits :

  • SAP Fiori elements provide design patterns for UI and predefined templates for commonly and frequently applications.
  • We the developers can use SAP Fiori elements to create SAP Fiori applications based on OData services and annotations.
  • It requires no JavaScript UI5 coding and uses predefined views and controllers.
  1. Create a CDS view and expose it as an OData service.
  2. Create a Fiori app by selecting the project from a template
  3. Select the List Report templet.
  4. Create the Fiori app with below details
  5. Select the OData service
  6. Select the annotation files
  7. Select the entity set and click on finish
  8. Now run the Fiori elements app
  9. It will show look like below.
  10. I want to have the above Fiori app like below, Without variants, Additional filters, detail page, export to Excel, change the Go Text and widths of the columns.
  11. To customize the Fiori list report app right-click on the Fiori app and click on SAPUI5 visual editor
  12. Switch to Edit mode it looks like below.
  13. Go to the Manifest.json file.
  14. Change the table type to Responsive to Grid also remove the ObjectPage as we don’t have any navigation details using the below code.
  15. Set the Page Title visibility property as false as we don’t require that.
  16. Hiding the Adapt Filters
  17. Change the Go button text
  18. Set the Use Export to Excel to True to enable the Export to Excel button.
  19. Hiding the Settings icon.
  20. Also, I have changed the column width, Final output looks like below.

There is no JavaScript UI5 coding involved in this process, the app will be ready in 1hr with the simple steps.

 

Thank you for getting into my blog post.

Comments are always accepted.

 

Thanks and Regards,

Harsha Pagadala

 

Assigned tags

      7 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Manivel S
      Manivel S

      Hi Harsha pagadala,

       

      Do you have any idea about the column background color in SAP Fiori List Report?

       

      Regards,

      Manivel S

      Author's profile photo Harsha pagadala
      Harsha pagadala
      Blog Post Author

      Hi Manivel,

      Check the below blog.

      https://blogs.sap.com/2019/11/15/css-in-fiori-elements-via-webide-sapui5-visual-editor/

      Author's profile photo Manivel S
      Manivel S

      Thanks Harsha. Let me check it.

       

      Regards,

      Manivel S

      Author's profile photo Ryusuke Yamada
      Ryusuke Yamada

      Hi Harsha pagadala,

      After deployed to fiori launchpad changes are not reflected in launchpad application ,Can anyone please help me on this.

      Author's profile photo Alex Cruickshank
      Alex Cruickshank

      I have not figured this out yet but there is some sort of background job that syncs this from our dev client to our sandpit client, i have tried all the cache clearing transactions and nothing can force it!

      Author's profile photo mahak gupta
      mahak gupta

      Hi,

       

      After making changes, In webapp folder one folder got created with name "changes" and one change file got created inside changes folder.

      By default it took package name as TMP in file . Change that package name with the package that you had used during deployment.

       

      Hope it will help.

       

      Thanks,

      Mahak

      Author's profile photo SAP Seeker
      SAP Seeker

      Hi Harsha pagadala,

      We have a similar CDS based generated list report and by default for Standard template, it shows only one column (key). Not sure how to get all the columns displayed for Standard template.

      Do you have an idea about how to get it fixed ?

      Thanks in advance.