Create Cards with Actions to Enable Workflows (Like Approve Or Reject)

A sales manager in a company usually needs to log into her computer to Approve or Reject Sales Order that her team has created. Since she is constantly on the move, she wants a way to perform these actions on her Mobile Device.

In this tutorial, you will see how you can quickly mobilize this use-case using SAP Mobile Cards. The Automatic Instance card will show three cards with the sales order information. Each card will have the Approve / Reject action. The sales manager can then select an action on a specific card to approve or reject the respective sales order.

Please ensure that you have completed the Automatic Instance Generation tutorial before you proceed with the following steps.

At any given time, only one version can be productive. You need to create a new version to make any changes to a productive version. While you are working on a new version, the end-users can keep using the productive version. Once you deploy the new version, the end-user’s card will be updated.

Make sure you have logged in to SAP Cloud Platform Mobile Services cockpit. Navigate to SAP Mobile Cards to look into Mobile Cards configuration.

Click Automatic Instance Card in the Card Templates Tab.

Click create new Version in the Versions table.

Click Yes on the Confirmation dialog.

Click the Edit Button (Pencil Icon) for the new version of the card.

Enter the version as 1.1 and Click Save.

You will be re-directed to the Card Templates Tab.

Click Automatic Instance Card in the Card Templates Tab.

A new card with version 1.1 is created, and the state of this card is Development.

Click the Edit Button (Pencil Icon) for the development 1.1 version card.

To ensure you are editing the correct version, please notice the green vertical bar in the Versions Table. This bar indicates the version of the current view on SAP Cloud Platform Mobile Services Cockpit.

Click the Editor tab.

Replace SalesOrder text with Action Card to rename the title of card.

Click the Actions tab.

Change Behavior after Action to Active.

The default value for behavior for an action is INACTIVE. An inactive action does not allow any new actions after a successful call.

Add / as the XCSRF Token URL.

Click the + icon to add an action and provide the required information:

Here URL will call the current SalesOrder which the card represents.

${SalesOrderId} defines the placeholder where the current SalesOrderID will be put in from the OData JSON response.

Consider Action As will assign an icon for the actions on Android.

Action Body will patch the SalesOrder status from New to Accepted if the action is triggered.

Click the + icon to create another action.

For Reject, we want the Sales Manager to provide a reason. Thus, we will create an Action Parameter, before we fill the details for the action.

Click + Parameter button to create an action parameter and provide the required information:

In SAP Mobile Cards, you can allow the user to provide an input while performing an action. This input is stored in an Action Parameter.

Click Action 2 field in the Actions Table and provide the required information:

We are storing user’s input the Action Parameter reasonForRejection. We then send the value in this parameter as a part of the body. Upon successful execution, the card will display the reason entered by the user.

Click the Info tab.

In the Versions Table, click the highlighted icon to change the state to Productive.

Choose Yes to confirm.

Notice that the State of the versions has changed. The newly published version - 1.1 is now in Productive state, and the older version - 1.0 is now in Backup state.

Make sure you are choosing the right device platform tab above.

The SAP Mobile Services client syncs new versions periodically. In the interest of time, you can choose to un-subscribe and subscribe the card to force the changes immediately.

Do a pull refresh.

In the card properties view, notice that the version of the Automatic Instance Card is 1.1.

Tap <- ‘Back’ to to see latest cards downloaded on the device and tap v to expand the card action menu.

Tap Reject to reject the Sales Order.

The Icons seen here appear because of the Consider Action As property.

Make a note of the LifeCycleStatus and Action Card Id.

Enter a reason for Rejection and Tap on Reject.

The user is asked for a reason because we added an action parameter for the reject option.

You will now see 2 toast messages: Performing Action and Performed Action Successfully.

If you don’t see these toast messages, there may be some error in the code.

Tap on the card to open it. Notice, that the Life LifeCycleStatus has changed from New to Rejected: Invalid Data.

Now let’s say that the necessary action has been taken, and this Sales Order can be approved.

Tap on the Action Bar button to view the actions, and then tap on Approve.

You will now see 2 toast messages: Performing Action and Performed Action Successfully.

If you don’t see these toast messages, there may be some error in the code.

For the same card, LifeCycleStatus has changed from Rejected: Invalid Data to Accepted.

Do a pull refresh.

In the card properties view, notice that the version of the Automatic Instance Card is 1.1.

Tap New Cards to to see latest cards downloaded on the device.

Tap on a card to open it.

Make a note of the LifeCycleStatus and Action Card Id.

Tap on the Action Menu button to view the actions.

Tap Reject to reject the Sales Order.

Enter a reason for Rejection and Tap on Reject.

The user is asked for a reason because we added an action parameter for the reject option.

You will now see 2 toast messages: Performing Action and Action Successfully Performed.

If you don’t see these toast messages, there may be some error in the code.

Notice, that the Life LifeCycleStatus has changed from New to Rejected: Incorrect Date.

Now let’s say that the necessary action has been taken, and this Sales Order can be approved.

Tap on the Action Menu button to view the actions.

Tap Approve to reject the Sales Order.

You will now see 2 toast messages: Performing Action and Action Successfully Performed.

If you don’t see these toast messages, there may be some error in the code.

Notice, that the Life LifeCycleStatus has changed from Rejected: Incorrect Date to Aceepted.

In the Mobile Services cockpit, click Connectivity under the Features tab.

For the com.sap.edm.sampleservice.v2 sample service, click the OData destination test icon.

Click Next.

Select SalesOrderHeaders as the Metadata Entity Set.

If you can not find particular data set, click Entity Properties to select some properties, click OK.

Verify the LifeCycleStatus for the Sales Orders on which you have performed an action.

Congratulations, you have built a work-flow capable SAP Mobile Cards. You can now use this knowledge to build other workflow applications.