Technical Articles
SAP Mobile Cards to enable SAP SuccessFactors Approvals
For all of you that own Mobile Services and Success Factors how about enabling your users to take advantage of Mobile Cards to do Approvals with the SuccessFactors API’s.
We have Out-Of-The-Box templates that you can quickly enable SuccessFactors in Mobile Cards, I wanted to take it to the next step and show you being able to use the the Todo’s API’s to get back your approvals and then be able to use the WfRequest API to take action on your approval.
. 
I’m just going to provide you the details of the card so you can enable it yourself, but you can see the video at the bottom of this post for yourself on how this looks.
In this example I have used the CategoryId 18 which provides only the Time-Off Approvals to the user. You can change the CategoryId for other approvals. I’m also using the feature of Multiple URL’s. The initial query of the Todo’s returns just a few relevant fields, but I wanted to expand on that and get the user that submitted for the time off as well as other details like the creation date and the comments. To do this, I retrieve the SubjectID from the todo query and then use that to retrieve the details of the Workflow using WfRequest. Doing so, this will create a dataset that returns the data I want to display on the cards.
The first thing you need to do is setup your destination. You can either create a destination the SuccessFactors API server for your tenant, or you can use the API Business Hub and configure your API access there. I created a Mobile Destination that points to https://apisalesdemo2.successfactors.eu/odata/v2. I’ve provided an admin user for credentials, but you can setup App-To-App SSO if your user credentials are enabled for SuccessFactors access.
For the card I started withe the SuccessFactors Vacation Template. I enabled the card as an Automatic Generation card and the Query is set to the following:
/Todo?$filter=categoryId%20eq%20’18’&$format=json
For the Collection Handling the Root will be:
$.d.results[0].todos.results[0].entries.results
and the Query Entity Key Paths will be:
$.d.subjectId
I have also created a Parameter so that I can use that in my Actions
Name: wfRequestId
Subject: $.d.subjectId
As mentioned above I wanted to get additional details for the approvals, so I added an additional URL in the URL’s section with the following definition:
/WfRequest?$filter=wfRequestId%20eq%20${wfRequestID}&$expand=wfRequestCommentsNav&$format=JSON
If you have setup your destination correctly and the URL’s you can go to the Sample Data and use the Get Data button. This should retrieve your JSON Data that should be similar to the following.
{
"dataSets": [{
"resourceIdentifier": "/WfRequest?$filter=wfRequestId%20eq%205684&$expand=wfRequestCommentsNav&$format=JSON",
"data": {
"d": {
"results": [{
"__metadata": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)",
"type": "SFOData.WfRequest"
},
"wfRequestId": "5684",
"module": "GENERIC_OBJECT",
"status": "PENDING",
"currentStepNum": 1,
"lastModifiedDateTime": "/Date(1553114856000+0000)/",
"lastModifiedOn": "/Date(1553118456000)/",
"totalSteps": 1,
"url": "https://salesdemo.successfactors.eu/sf/hrisworkflowapprovelink?workflowRequestId=V2-FhwX16DTU%2BQPySbkiuLKHA%3D%3D&prevPage=HOME&company=SFPART035023&username=sfadmin",
"reminderSentDate": null,
"createdOn": "/Date(1553118456000)/",
"createdBy": "demou",
"createdDateTime": "/Date(1553114856000+0000)/",
"lastModifiedBy": "demou",
"parentWfRequestId": null,
"workflowAllowedActionListNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)/workflowAllowedActionListNav"
}
},
"wfRequestCommentsNav": {
"results": [{
"__metadata": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequestComments(6405L)",
"type": "SFOData.WfRequestComments"
},
"wfRequestCommentId": "6405",
"wfRequestStepId": "5604",
"actionType": "INITIATE",
"lastModifiedDateTime": "/Date(1553114856000+0000)/",
"lastModifiedOn": "/Date(1553118456000)/",
"createdOn": "/Date(1553118456000)/",
"wfRequestId": "5684",
"createdBy": "demou",
"userId": null,
"createdDateTime": "/Date(1553114856000+0000)/",
"lastModifiedBy": "demou",
"comments": "Need some time for kids",
"userNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequestComments(6405L)/userNav"
}
}
}]
},
"parentWfRequestNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)/parentWfRequestNav"
}
},
"wfRequestParticipatorNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)/wfRequestParticipatorNav"
}
},
"wfRequestStepNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)/wfRequestStepNav"
}
},
"empWfRequestNav": {
"__deferred": {
"uri": "https://apisalesdemo2.successfactors.eu/odata/v2/WfRequest(5684L)/empWfRequestNav"
}
}
}]
}
}
}, {
"resourceIdentifier": "/GeneratedEntitySet(key0='5684')",
"data": {
"d": {
"completedDate": null,
"formDataId": "0",
"status": 2,
"statusLabel": "Active",
"subjectFullName": "Vacation (03/27/2019 - 03/27/2019): Demo User ",
"subjectId": "5684",
"url": "https://salesdemo.successfactors.eu/sf/hrisworkflowapprovelink?workflowRequestId=V2-FhwX16DTU%2BQPySbkiuLKHA%3D%3D&prevPage=HOME&company=SFPART035023&username=sfadmin"
}
}
}]
}
Because we are using the multiple URL’s option we cannot use Data Mapping, so you will need to define the source without mapping. Keep in mind all of this also could be done in WebIDE. Here is my HTML
<body>
<div id="mySimpleTemplate" class="myTemplate"
data-type="text/x-handlebars-template">
<link rel="stylesheet" type="text/css" href="style.css">
<div class="wrap">
<div class="header" >
<img src="airplane_copy.png" alt="" height="56px">
<div style="text-align: left;">
<h1>
Vacation Approvals
</h1>
</div>
</div>
<div class="card-content">
<br>
The following vacation request is awaiting your approval.
<br>
<br>
<span class="label">Subject:</span><br>
{{dataSets.[1].data.d.subjectFullName}} <br>
<br>
<span class="label">Status: </span><br>
{{dataSets.[1].data.d.statusLabel}} <br>
<br>
<span class="label">User: </span><br>
{{dataSets.[0].data.d.results.[0].createdBy}} <br>
<br>
<span class="label">Comments: </span><br>
{{dataSets.[0].data.d.results.[0].wfRequestCommentsNav.results.[0].comments}} <br>
<br>
<span class="label">Created On: </span><br>
{{c2gEdmDateTime "M/d/yyyy" dataSets.[0].data.d.results.[0].createdOn}} <br>
<br>
</div>
<img src="chair.png" alt="" style="width: 7rem; height: 7rem; position: absolute;
bottom: 5rem; right: 3rem;" >
</div>
</div>
</body>The last thing to do is setup you Actions. Here are the URL’s that I used for each, note that I’m using the parameter we created in the template ${wfRequestID}. Don’t miss putting the L at end after the Request ID. With comments you will need to create a parameter for comments as well so that you are prompted to provide comments.
Approve:/approveWfRequest?wfRequestId=${wfRequestID}L
Reject: /rejectWfRequest?wfRequestId=${wfRequestID}L
Comments: /commentWfRequest?wfRequestId=${wfRequestID}L&comment=’${Comments}’
Awesome integration, very neat and a very good sample of how easy is to integrate with SAP SuccessFactors
An engagement is made possible for the nine forums for the candidates. The hiring of the services of https://essaywriter.org/proofread-my-paper is punctuated for all sorts. Pities held for the sphere for the joys. Connectivity is filed for the realm of the dynamics of people.