Using SAP Build Apps, create an app that calls a CAP service via a destination, updates data, and manages permissions based on SAP BTP role collections.
Instead of building the entire project from scratch, you will import a project with all the pages created, all the UI components added to the pages, and all the components stylized. Most bindings will also be set.
The app you will help build has 3 pages:
App design
Risks: This page lists all the existing risks (with description and criticality displayed), and includes a button so you can add a new risk.
Next to each risk is a delete button, which lets you delete a risk from the CAP service.
Risk Details: This page shows all fields for a specific risk, plus the corresponding mitigation selected for the risk (if one exists). The page has 2 actions you can do:
There is an Edit button to edit the fields. The button takes you to the Manage Risks page, which is used for both adding and editing risks.
All the existing mitigations are displayed, and you can select one to assign it to the current risk, instead of the currently assigned mitigation.
Manage (Add/Update) Risks: This page lets you add a new risk or update an existing risk (if a risk ID is passed). If you navigate from an existing risk, all the field values for that risk are loaded, and you will be updating that risk.
IMPORTANT: Both the CAP service and the SAP HANA instance on a trial account may stop automatically each day, or more frequently. If you do not get returned data, check that they are running and restart them if necessary.
Restart services
Step 1Open SAP Build Apps
—
Open SAP Build Apps, by going to the SAP BTP cockpit, and under Instances and Subscriptions, click SAP Build Apps.
Second, go to the SAP Build lobby and click on the Import button.
Import button
In the dialog, select the downloaded project file, and click Import.
Select MTAR
The project should be added to the lobby.
Project added
Click the project to open it.
If the project cannot load because it conflicts with an existing project or you already imported it, there is a second way to import projects (from within an existing project), and we have provided a second version of the project for this purpose.
From within an open SAP Build Apps project, make sure the project is saved. Then go to the upper-right corner, select the 3 dots and then Replace – this import replaces and deletes the current content of the project.
Select the gpg file and click Replace.
Step 3Create data resource for CAP app
+
The first thing you need to do is connect the project to your CAP service via our destination, to retrieve the data. And in order to do this we need to enable SAP BTP authentication.
Go to the Auth tab.
Click Enable Authentication, then select SAP BTP Authentication.
Enable authentication
Click OK.
Go to the Data tab.
Click Add Integration.
Add integration
Note that there will be many error messages. This is because we already created data variables as well as bindings with those variables, but we deleted the data resources because we wanted you to do that part.
Error messages
You can ignore these error messages. As soon as you create the data resources, they will go away.
Click BTP Destinations, and then select the the destination.
Select destination
Click Install Integration (upper right).
Alt text
For each of the two entities, Risks and Mitigations, click the entity and then click Enable Data Entity.
Entities added
You can now click Browse Real Data to see live data from the CAP service.
Browse real data
In addition, the errors should now be gone. Data variables were already set up on all 3 pages of the app, and now should be functioning properly.
Step 4Risks – Review logic to check permissions
+
When the first page loads, we want to do 2 things:
Load the list of risks
Check whether user has permission to read / write.
Click the UI Canvas tab again to go back to the UI, and then open the logic canvas.
UI canvas
You should see the page’s main canvas page (the one you get if you click away from any component/variable, that is, in the open gray area). We’ve added the following logic:
Initial logic
The logic is triggered when the page opens, and the following is performed:
Retrieve Risks: A call is made to the CAP service to get all the risks.
Check Write Permissions: If reading the CAP service succeeded, we now check if the user has write permission by making an empty update to the first record (the update does not change the record – PATCH update with no values). If the update fails, we set a page variable to indicate the user does not have write permission.
Check Read Permissions: If reading the CAP service failed, we check if the reason was because of permissions (403 status error). If yes, we set page variables to indicate the user has neither read nor write permissions.
Display User Permissions: After checking permissions, we display a toast message indicating what permission the user has.
Display permissions
Step 5Risks – Add logic to navigate to add risk
+
Now we just want to enable the Add Risk button to navigate to the Manage Risks page.
Select the Add Risk button and open the logic panel.
Open logic for button
Add an Open page flow function, and connect it to the Page mount event.
Open page
Set the page to open as Manage Risks.
Set page
Click Save (upper right).
Step 6Test app
+
Go to the Launch tab, then Open Preview Portal, then Web Preview.
Web preview
Click Risk Management to open the app. You should see the first page with a list of risks.
Test risks
In addition, you see a toast message indicating what permissions you. In this case, since you gave yourself manager permissions, it should say you are a manager.
Permissions
Also, the Add Risk button should take you to the Manage Risks page (though that page will not let you add a risk yet, and clicking Create Risk will not do anything).
Step 7Manage Risks – Add logic to load data
+
The Manage Risks page can be used to add a new risk or update an existing risk if navigating from an existing risk.
The page has a page parameter. If sent, the page is for updating; if it’s null, the page will be used to add a risk.
In the upper left, click the link for the Risks page.
Next page
This will take you to the area for managing the app’s pages.
Click on the Manage Risks page.
Select page
If you don’t go to the Manage Risks page, make sure to save your project (upper right).
Open the Variables.
Variables
Click Data Variables. You have 2 data variables related to the Risks entity:
Risks1: This variable is specified as a New data record, meaning it is empty but has the schema appropriate for this data entity.
Data variables
Risks2: This variable is specified as a Single data record, meaning it will retrieve the data of an existing risk if we navigated from an existing risk and we want to update that risk.
We will be calling the CAP service using Risks1. But if we are updating an existing risk, we want to copy the existing values into Risks1 from Risks2.
Click Risk2 and open the logic canvas. You should see the basic logic flow for data variables of type Single data record (except we already deleted the Delay flow function).
Risk2
Click the Get record flow function, and set the ID to the page parameter RiskID.
ID
Add another Set data variable flow function to the end of the flow.
Set risks
Set Data variable name to the data variable Risks1.
Set Record properties to the data variable Risks2 > Risks2.
Step 8Manage Risks – Add logic to add/update risk
+
Back on the View tab, click the Update Risk button and open its logic canvas.
Add logic flow functions and connect them as in the following:
Logic
Be careful to use the top or bottom output of a flow function, as shown in the image.
Configure the flow functions as follows:
IF condition (first): Set the condition to the following formula (validates the prio field):
JavaScript
NOT(LENGTH(data.Risks1.prio)>5)
IF condition (second): Set the condition to the following formula (checks if we are updating a risk or creating a new one):
JavaScript
NOT(IS_NULLY(params.RiskID))
Update record: Set the following:
Resource name: Risks
Risk ID: page parameter RiskID
Record: Set the following formula (allows us to make sure the integer fields receive a number value):
This formula will show as read because we are not supplying an ID value. But the CAP service will assign an ID automatically when it is created. You can still save the formula.
Add Alert flow functions as follows:``
Alerts
Set the texts for each alert as follows:
1
Text
Priority can only be 5 characters
2 (if update fails)
Set to Output value of another node > Update record > Error > Message.
3
Text
New risk created
4 (if create fails)
Set to Output value of another node > Create record > Error > Message.
Click Save (upper right).
Step 9Test app
+
Again, go to the Launch tab, then Open Preview Portal, then Web Preview.
Click Risk Management to open the app.
Click Add a risk and enter values for the fields (test that priority cannot be more than 5 characters).
Click Create Risk.
Add risk
Troubleshooting: If your risk does not get added, you may have inadvertently enabled draft mode. Go back to your CAP service, select the Risk entity, and check its settings.
Draft mode
If draft mode is enabled, uncheck the option and redeploy the CAP service.
Now use the navigation menu to return to the main page with all the risks, and make sure your new risk is there.
Navigate back
You should see your new risk.
New risk
We will check the update functionality later.
Step 10Risk Details – Add logic to edit risk
+
In the upper left, click the link for the Manage Risks page.
Next page
This will take you to the area for managing the app’s pages.
Click on the Risk Details page.
Select page
If you don’t go to the Risk Details page, make sure to save your project (upper right) and try again.
Click on the Edit button, and open the logic canvas.
Edit logic
Add an Open page flow function, and connect it to the Component tap event.
Add open page
Configure the Open page flow function to open the Manage Risks page, and set the ID to the RiskID page parameter.
Configure open page
Step 11Risk Details – Review logic to change mitigation
+
We want to enable the user to see all the existing mitigations, and to click on one to make it the mitigation for the current risk.
Select the list item component (just under the All Mitigations text) and open the logic pane.
Initial logic
In this logic flow, we do the following:
Check Need for Update: We check 2 things to see if we need to do the update at all:
Does the user have write permission?
Did the user select a different mitigation?
Update Risk: If both checks are true, we update the risk.
Refresh Risk Details: We retrieve the risk details in order o refresh the page.
The other flow functions set the changingMigration variable in order to display a spinner while we are updating the record.
Step 12Test app
+
Again, go to the Launch tab, then Open Preview Portal, then Web Preview.
Click Risk Management to open the app.
Click the risk we added earlier.
Display risk
The risk will not have any mitigation. Click one of the mitigations to select it for this risk.
Share feedback on this tutorial or join the conversation in SAP Community.
Submit detailed feedbackDiscuss in Community
Steps
Step 1 of 12
1. Open SAP Build Apps2. Import project3. Create data resource for CAP app4. Risks – Review logic to check permissions5. Risks – Add logic to navigate to add risk6. Test app7. Manage Risks – Add logic to load data8. Manage Risks – Add logic to add/update risk9. Test app10. Risk Details – Add logic to edit risk11. Risk Details – Review logic to change mitigation12. Test app
Joule
AI Notice
Joule is an AI assistant. Generative AI may produce inaccurate, incomplete, or biased information. Always verify important details before acting on them.
Conversations are sent to SAP-hosted large language models for processing. Do not include personal data, credentials, or confidential information in your messages.
Joule's responses are based on the SAP tutorial catalog and may not reflect the latest product changes. For authoritative guidance, consult the linked tutorials and official SAP documentation.
