Tutorial: Customizing the Create order flow
In this tutorial, you learn how to customize the existing Order Hub Create order flow.
The customization by configuration approach is used in this tutorial to make simple updates to existing pages.
The customization by code approach is used in this tutorial, where:
- The customization by overrides approach is used to modify an existing page to capture extra data (customer purchase order number) and then send the data to the backend API. Since there is no buc-fields-details.json file to modify the order details page, the customization by overrides approach must be used.
Assume that your company needs to customize the Create order flow to include the following extra capabilities:
- When you create an order, you want to be able to optionally capture the "customer purchase order number".
- When you search for items to add to an order, you want to be able to search for items with a custom ItemAlias field that you use to represent the item's UPC code, EAN, or manufacturer code.
- You want to change the labels in the UI. Instead of using the existing labels "Requested ship date", "Requested cancel date" and "Requested delivery date", you want to use the labels "Desired ship date", "Desired cancel date" and "Desired delivery date".
Learning objectives
- How to customize pages in the Orders application.
- How to modify existing code in a page to capture extra data and then send the data to the backend API.
- How to add an extra search parameter in a page and an API through customization by configuration.
- How to change labels and messages in the application through customization by configuration.
Time required
This tutorial should take approximately 30 minutes to finish. If you explore other concepts that are related to this tutorial, it might take longer to complete.Skill level
BeginnerAudience
Developers who want to customize Order Hub.Prerequisites
- Set up a developer toolkit environment. For more information, see Getting started with customizing Order Hub.
- Enable customization for the buc-app-order module. For more information, see Customizing existing applications.
Expected results
When a user clicks Create order from the Order search
page, the Create order page loads with your customizations.
- The Order details page includes a custom field Customer purchase
order number.
- The Add lines > Advanced search modal includes a custom search field
Alias value.
- The Manage lines table includes custom table header strings
Desired delivery date, Desired availability date, and
Desired termination date.