Retail Order LWC
Namespace
The orderExtensionUtils LWC exposes events and methods to get the order state and extract data from the order, and push new data to the order.
cgcloud
Supported Methods
Here are all the available methods in the orderExtensionUtils service component. You can import these methods in your custom LWC.
getOrderData
Get the order data.
- API Version
- 59.0
- Signature
- getOrderData(recordId)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); } }
updateOrderData
Update the managed packaged Order sObject (Order__c) fields.
- API Version
- 59.0
- Signature
- updateOrderData(recordId, srcThisRef, fieldApiName, value)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData, updateOrderData } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); } // You can invoke this method with the click of a button updateOrderFieldValue() { const fieldName = 'cgcloud__Delivery_Note__c'; const newValue = 'test-note'; updateOrderData(this.recordId, this, fieldName, newValue); } }
getOrderItemData
Get the order item data.
- API Version
- 59.0
- Signature
- getOrderItemData(recordId)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderItemData } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderItemsData = []; connectedCallback() { getOrderItemData(this.recordId).then((data) => { this.initialOrderItemsData = data; }); } }
updateOrderItemData
Update the managed packaged Order Item sObject (Order_Item__c) fields.
- API Version
- 59.0
- Signature
- updateOrderItemData(recordId, srcThisRef, itemId, fieldApiName, value)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderItemData, updateOrderItemData } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderItemsData = []; connectedCallback() { getOrderItemData(this.recordId).then((data) => { this.initialOrderItemsData = data; }); } updateOrderItemFieldData() { const orderItemId = this.initialOrderItemsData[0].Id; const fieldName = 'cgcloud__Discount__c'; const value = 9; updateOrderItemData(this.recordId, this, orderItemId, fieldName, value); } }
setCustomState
Sets a custom state for the order that is saved. Using the custom state, you can set up additional data to be saved along the order data in the same transaction as the order. This custom state gets forwarded to the Apex class that handles order save customizations.
- API Version
- 59.0
- Signature
- setCustomState(recordId, customState)
- Example
-
import { LightningElement, api } from 'lwc'; import { setCustomState } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; connectedCallback() {} setOrderCustomState() { setCustomState(this.recordId, { customProp: 'Test' }); } }
getIsOrderInEditMode
Check if the order is in the edit mode or read-only mode. Use this method to render custom LWC components in the read-only or edit mode.
- API Version
- 59.0
- Signature
- getIsOrderInEditMode()
- Example
-
import { LightningElement, api, track } from 'lwc'; import { getIsOrderInEditMode } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; @track isOrderInEditMode = false; connectedCallback() { this.isOrderInEditMode = getIsOrderInEditMode(); } }
registerListenerForOrderDataUpdates
Listen for the order data changes. Register a callback method, which gets invoked when an order field changes.
- API Version
- 59.0
- Signature
- registerListenerForOrderDataUpdates(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData, registerListenerForOrderDataUpdates } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderData = {}; orderDataUpdates = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); registerListenerForOrderDataUpdates( this.recordId, this, this.handleOrderDataUpdates ); } handleOrderDataUpdates(fieldApiName, value) { this.orderDataUpdates[fieldApiName] = value; } }
registerOrderDataInlineValidator
Validate the order data changes. Register a callback method, which gets invoked when an order field changes. The method returns an error message if any validation fails.
- API Version
- 59.0
- Signature
- registerOrderDataInlineValidator(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData, registerOrderDataInlineValidator } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); registerOrderDataInlineValidator( this.recordId, this, this.validateOrderDataChanges ); } validateOrderDataChanges(fieldName, value) { switch (fieldName) { case 'cgcloud__Invoice_Note__c': case 'cgcloud__Delivery_Note__c': return this.validateNoteFields(value); default: return ''; } } validateNoteFields(value) { if (value && value.length > 100) { return 'This text should be less than 100 characters'; } } }
registerListenerForOrderItemDataUpdates
Listen for the order item data changes. Register a callback method, which gets invoked whenever any order item field changes.
- API Version
- 59.0
- Signature
- registerListenerForOrderItemDataUpdates(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderItemData, registerListenerForOrderItemDataUpdates } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderItemsData = []; connectedCallback() { getOrderItemData(this.recordId).then((data) => { this.initialOrderItemsData = data; }); registerListenerForOrderItemDataUpdates( this.recordId, this, this.handleOrderItemDataUpdates ); } handleOrderItemDataUpdates(itemId, fieldApiName, value) { const orderItem = this.initialOrderItemsData.find( (_orderItem) => _orderItem.Id === itemId ); orderItem[fieldApiName] = value; } }
registerOrderItemDataInlineValidator
Validate the order item data changes. Register a callback method, which gets invoked whenever any order item field changes. The method returns an error message if any validation fails.
- API Version
- 59.0
- Signature
- registerOrderItemDataInlineValidator(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderItemData, registerOrderItemDataInlineValidator } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderItemsData = []; connectedCallback() { getOrderItemData(this.recordId).then((data) => { this.initialOrderItemsData = data; }); registerOrderItemDataInlineValidator( this.recordId, this, this.validateOrderItemDataChanges ); } validateOrderItemDataChanges(itemId, fieldName, value) { switch (fieldName) { case 'Discount__c': return this.validateDiscount(value); default: return ''; } } validateDiscount(value) { if (value > 10) { return 'Item discount should not be more than 10%'; } return ''; } }
registerBeforeAddItemActionHandler
Register callbacks before adding items.
- API Version
- 59.0
- Signature
- registerBeforeAddItemActionHandler(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData, registerListenerForOrderDataUpdates, registerBeforeAddItemActionHandler } from 'cgcloud/orderExtensionUtils'; export default class CustomLWC extends LightningElement { @api recordId; initialOrderData = {}; orderDataUpdates = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); registerListenerForOrderDataUpdates( this.recordId, this, this.handleOrderDataUpdates ); registerBeforeAddItemActionHandler( this.recordId, this, this.handleBeforeAddItemCB ); } handleOrderDataUpdates(fieldApiName, value) { this.orderDataUpdates[fieldApiName] = value; } handleBeforeAddItemCB(newOrderItems) { const orderData = { ...this.initialOrderData, ...this.orderDataUpdates }; newOrderItems = newOrderItems.map((orderItem) => { if ( orderData.cgcloud__Order_Account__r.Name === '*NTO Store #201' && orderItem['Product__r.Description_1__c'] === 'BBQ' ) { throw new Error("You can't add BBQ product"); } orderItem.Quantity__c = 2; orderItem.Number__c = 10; return orderItem; }); } }
registerBeforeSaveActionHandler
Register a callback before the save action.
- API Version
- 59.0
- Signature
- registerBeforeSaveActionHandler(recordId, thisRef, callback)
- Example
-
import { LightningElement, api } from 'lwc'; import { getOrderData, registerBeforeSaveActionHandler } from 'cgcloud/orderExtensionUtils'; export default class CustomLWC extends LightningElement { @api recordId; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); registerBeforeSaveActionHandler( this.recordId, this, this.handleBeforeSaveCB ); } handleBeforeSaveCB(savePayload) { const { orderItemsToBeUpserted: orderItems, updatedOrder: orderData } = savePayload; for (let i = 0; i < orderItems.length; i++) { const orderItem = orderItems[i]; if (orderItem.cgcloud__Quantity__c > 90) { throw new Error("Order Item Quantity shouldn't be more than 90"); } } let headerDiscount = orderData.cgcloud__Header_Discount_Percentage__c; headerDiscount = headerDiscount && Number(headerDiscount); if (headerDiscount && headerDiscount > 15) { throw new Error("Header discount can't be greater than 15"); } let deliveryDate = orderData.cgcloud__Delivery_Date__c; if (deliveryDate) { deliveryDate = new Date(deliveryDate); deliveryDate.setDate(deliveryDate.getDate() + 1); orderData.cgcloud__Delivery_Date__c = deliveryDate; } } }
registerListenerForEnablingOrDisablingEditMode
Register a callback for the edit action. Render the custom LWC component in the read-only or edit mode.
- API Version
- 59.0
- Signature
- registerListenerForEnablingOrDisablingEditMode(recordId, thisRef, callback)
- Example
-
import { LightningElement, api, track } from 'lwc'; import { getOrderData, registerListenerForEnablingOrDisablingEditMode } from 'cgcloud/orderExtensionUtils'; export default class CustomLWC extends LightningElement { @api recordId; @track isOrderInEditMode = false; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); registerListenerForEnablingOrDisablingEditMode( this.recordId, this, (isOrderInEditMode) => { this.isOrderInEditMode = isOrderInEditMode; } ); } }
- orderExtensionUtils Component Example
-
<!-- CustomComponent.html --> <template> <!-- Sample button --> <lightning-button variant="neutral" label="Update Order Field" onclick={updateOrderFieldValue}></lightning-button> </template> <!-- CustomComponent.js --> import { LightningElement, api } from 'lwc'; import { getOrderData, updateOrderData } from 'cgcloud/orderExtensionUtils'; export default class CustomComponent extends LightningElement { @api recordId; initialOrderData = {}; connectedCallback() { getOrderData(this.recordId).then((data) => { this.initialOrderData = data; }); } // You can invoke this method with the click of a button updateOrderFieldValue() { const fieldName = 'cgcloud__Delivery_Note__c'; const newValue = 'test-note'; updateOrderData(this.recordId, this, fieldName, newValue); } } <!-- CustomComponent.js-meta.xml --> <?xml version="1.0" encoding="UTF-8"?> <LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata"> <apiVersion>59.0</apiVersion> <isExposed>true</isExposed> <targets> <target>lightning__RecordPage</target> </targets> <targetConfigs> <targetConfig targets="lightning__RecordPage"> <objects> <object>cgcloud__Order__c</object> </objects> </targetConfig> </targetConfigs> <runtimeNamespace>cgcloud</runtimeNamespace> </LightningComponentBundle>
When setting the runtimeNamespace property in the metadata file, your component can’t use modules from the @salesforce package (any import whose route starts with @salesforce).