To add the order approval feature to your storefront, you must add these two widgets the Profile layout:
The Order Approval Settings widget provides the delegated administrator with an interface for enabling and disabling order approvals and setting the purchase limit.
If you integrate with an external system determine if orders require approval, the account’s delegated administrators will not be able to enable and disable order approvals or set a purchase limit. See Integrate with an external system for order approvals for more information.
The Orders Pending Approval widget allows an approver to view a list of orders pending approval.
To add the order approval widgets to the Profile layout, you can create a vertical tab stack and place the order approval widgets on individual tabs within the stack. To restrict the display of the Order Approval Settings widget to contacts with administrator privileges and the display of the Orders Pending Approval tab to contacts with approver privileges, you can add something similar to the following code snippet in the vertical tab stack’s template:
<!-- ko foreach: regions -->
<!--ko if:($data.displayName() == 'Profile') ||
((($data.displayName() == 'Account Contacts') ||
($data.displayName() == 'Account Addresses') ||
($data.displayName() == 'Order Approval Settings')) &&
($masterViewModel.data.global.user.roles.map(function(data)
{return data.function; }).indexOf("admin")!== -1)) ||
(($data.displayName() == 'Orders Pending Approval') &&
($masterViewModel.data.global.user.roles.map(function(data)
{return data.function; }).indexOf("approver")!== -1))-->
<li role="presentation" data-bind="css: {active: $index() === 0},
attr: { id: 'verticalTabs-'+$parent.id()+'-tab-'+$index() }">
<a data-toggle="tab" data-bind="attr: { 'href': '#verticalTabs-' +
$parent.id() + '-content-' + $index()}">
<span data-bind="text: displayName"></span>
</a>
</li>
<!-- /ko -->
<!-- /ko -->This code snippet shows the My Profile tab to all contacts but restricts the display of the Orders Pending Approval tab to approvers and the display of the other tabs (Account Contacts, Account Addresses, and Order Approval Settings) to administrators. (It assumes you used “My Profile”, “Account Contacts”, “Account Addresses”, “Order Approval Settings”, and “Orders Pending Approval” as the display names for the tabs that hold the Customer Profile, Account Contacts, Account Addresses, Order Approval Settings, and Orders Pending Approval widgets, respectively.)
In addition to adding the Order Approval Settings and Orders Pending Approval widgets to the Profile layout, you must also make sure you are using the latest version of the Account Contacts widget. This version allows the delegated administrator to assign the Approver role to contacts.
Note: The Account Addresses and Account Contacts widgets are described in the Add delegated administration to your storefront section. For more information on vertical tab stacks, see Add Vertical Tabs in the Using Oracle Commerce Cloud guide and Use Stacks for Increased Widget Layout Control in the Developing Widgets guide.
