Steps to Replace OData in Business Application Studio UI5 Extension Project

SAP ABAP Central · 11 months ago · 83 views

How to change OData service when using BAS Extension Project for Standard AppsBackground: Sometimes, standard FIORI apps cannot be extended via BAS Adaptation Project. This limitation arises if the app contains synchronous views. In such cases, you may need an alternative approach to customize the app effectively.Requirement: The standard app ‘Transfer Stock - Cross-Plant’, includes buttons to transfer stock between plants. My requirement is to customize the app to grey out the buttons based on the plant category.Solution:This standard app uses OData service MMIM_MATERIAL_DATA_SRV. To implement the required changes, I created a custom OData service ZMMIM_MATERIAL_DATA_SRV, based on the standard service with an additional field. While the creation of this service is beyond the scope of this blog, I will focus on integrating it into the app.The buttons I customized are highlighted in the below image.Source: https://fioriappslibrary.hana.ondemand.com/sap/fix/externalViewer/#/detail/Apps('F1957')/S21OPSteps to Implement the Customization1. Start by opening the BAS tool and selecting the Adaptation Project option.2. Fill in the necessary details for the project setup and proceed to the next step.3. Select the relevant system associated with the project.4. Upon choosing the standard app, a message will appear indicating that the app contains synchronous views.5. Due to the limitation, you cannot proceed with an Adaptation Project. Instead, create an Extension Project and click Finish.6. Once the Extension Project is created, open it separately (optional). Then, create an extension by right-clicking the .extconfig.json file.7. In the context menu, choose ‘Extend Controller’ and then select ‘Copy of the Original Controller’.8. Uncomment the function ‘_loadMaterial’ in the file ‘S1Custom.controller.js’. This is where the oData service needs to be replaced.9. Replace references to the standard OData service with the custom OData service ZMMIM_MATERIAL_DATA_SRV in your UI5 extension project. The required changes are shown below:10. Search for all occurrences of the model ‘oMaterialData’ in the code. Update them accordingly to use the custom service.11. In the custom OData service, I added a new property ‘PlantCategory’ to the existing entity type ‘MaterialPlant’.12. Update the UI5 code to use new property ‘PlantCategory’ in the function ‘_checkFirstClickIsAllowed’. This ensures the buttons are always greyed out based on the plant category.Testing:Before the change (in the standard app):After the change (in the enhanced app):As it can be seen from the above output, the buttons in the entire row are disabled. Requirement has been achieved.