VlocityDCOffersList

VlocityDCOffersList

vlocity-dc-offers-list is the container component for offer list view and grid view.

Constructor

new VlocityDCOffersList()

Properties:
Name Type Description
offers Object indicates an object which contains a list of the all the offers.
activeIndex Number currently selected view
Example
Sample Usage -

Include the component in your template simply by adding vlocity-dc-offers-list custom tag

<vlocity-dc-offers-list></vlocity-dc-offers-list>

| Attribute Name    | Type Expected                                                                   | Required |
|-------------------|---------------------------------------------------------------------------------|----------|
| catalogCode       | It expects a String which denotes Catalog Code                                  |   Yes    |
| pageSize          | It expects a Number which denotes how many offer to load in one api call        |   Yes    |

 KEY INFO -

 events fired : vlocity-dc-route-navigation

 events registered : vlocity-dc-filter-list-updated and vlocity-dc-offer-selected

               | Event Name                         | Event source component                                                                                  | Callback Function            |
               |------------------------------------|---------------------------------------------------------------------------------------------------------|------------------------------|
               |                                    |  Event Source:                                                                                          |                              |
               |                                    |      | Component Name                        | Description                                         |    |                              |
               | vlocity-dc-filter-list-updated     |      |---------------------------------------|-----------------------------------------------------|    | refreshOffersList()          |
               |                                    |      | vlocity-dc-filter                     | Event for refreshing offer list                     |    |                              |
               |                                    |                                                                                                         |                              |
               |                                    |  Multiple Event Sources:                                                                                |                              |
               |                                    |      | Component Name                        | Description                                         |    |                              |
               | vlocity-dc-offer-selected          |      |---------------------------------------|-----------------------------------------------------|    | redirectToRouteNavigation()  |
               |                                    |      | vlocity-dc-offer-grid-view             | Event triggered on offer selection                 |    |                              |
               |                                    |      | vlocity-dc-offer-list-view             |                                                    |    |                              |

 Dependency - vlocity-dc-offers-list is a container component which contains offer list view and grid view.
 It is commonly used as a child of vlocity-dc-home-page but can also be used as an independent component.

             | Parent Component      | Expected Children Components  |
             |-----------------------|-------------------------------|
             | vlocity-dc-home-page  | vlocity-dc-offer-grid-view    |
             |                       | vlocity-dc-offers-list-view   |

Sample with slots -

<vlocity-dc-offers-list>
   <span slot="{slot_name}">
     Custom HTML elements goes here
   </span>
</vlocity-dc-offers-list>

List of available slots -

| Slot names                 | Dynamic     | Description                 | Impact               |
|----------------------------|-------------|----------------------------------------------------|
| dc-offer-list-toggle-view  | -           | Toggle view buttons         | Replaces DOM         |
| dc-not-found               | -           | Not found message           | Replaces DOM         |
| dc-load-more-btn           | -           | Each Child catalog menu     | Replaces DOM         |
| dc-loading-message         | -           | Each Child catalog menu     | Adds DOM             |

Extends

  • LitElement

Members

(static, readonly) properties

Properties that will be available in the template binding
Properties:
Name Type Description
offers Object indicates an object which contains a list of the all the offers.
activeIndex Number currently selected view

Methods

(async, static) addToCart(promoCode)

callback function for event vlocity-dc-save-child-offers.
Parameters:
Name Type Description
promoCode OfferObject promotion to be added to basket.

(static) addToCartGetInput(childProduct)

This function is used to get addToCart input object
Parameters:
Name Type Description
childProduct object An object denoting current child product.

(static) addToCartHandleFailure(error)

This function is used to handle addToCart failure
Parameters:
Name Type Description
error object Error Object from SDK call.

(static) addToCartPostHook(response)

A custom function to be used by customers for customisation, any custom action after addToCart call is successfull can be written here
Parameters:
Name Type Description
response object SDK Response object.

(static) addToCartPreHook(input)

A custom function to be used by customers for customisation, any custom action prior to addToCart call can be written here
Parameters:
Name Type Description
input object Current Input Object.

(static) addToCartPreSDKCalls()

This function is used to execute any action before addToCart SDK call is made.

(static) addToCartSDKCall(input)

This function is used to make SDK call for addToCart
Parameters:
Name Type Description
input object Current Input Object.

(async, static) fetchOffers(catalogCode)

This function is used to fetch all the offers
Parameters:
Name Type Description
catalogCode object An object containing current catalog.

(static) fetchOffersGetInput(catalogCode)

This function is used to get fetchOffers input object
Parameters:
Name Type Description
catalogCode object An object containing current catalog.

(static) fetchOffersHandleFailure(error)

This function is used to handle fetchOffers failure
Parameters:
Name Type Description
error object Error Object from SDK call.

(static) fetchOffersPostHook(response)

A custom function to be used by customers for customisation, any custom action after fetch offers call is successfull can be written here
Parameters:
Name Type Description
response object SDK Response object.

(static) fetchOffersPreHook(input)

A custom function to be used by customers for customisation, any custom action prior to fetch offers call can be written here
Parameters:
Name Type Description
input object Current Input Object.

(static) fetchOffersPreSDKCalls(input)

This function is used to execute any action before fetchOffers SDK call is made.
Parameters:
Name Type Description
input object Current Input Object.

(static) fetchOffersProcessResponse(response)

This function is used to process fetchOffers response
Parameters:
Name Type Description
response object Response Object from SDK call.

(static) fetchOffersSdkCall(input)

This function is used to make SDK call for fetchOffers
Parameters:
Name Type Description
input object Current Input Object.

(async, static) fetchPromotions(catalogCode, offerCode)

This function is used to fetch all the offers
Parameters:
Name Type Description
catalogCode string current catalog code.
offerCode string offer code.

(static) fetchPromotionsGetInput(catalogCode)

This function is used to get fetchPromotions input object
Parameters:
Name Type Description
catalogCode object An object containing current catalog.

(static) fetchPromotionsHandleFailure(error)

This function is used to handle fetchPromotions failure
Parameters:
Name Type Description
error object Error Object from SDK call.

(static) fetchPromotionsPostHook(response)

A custom function to be used by customers for customisation, any custom action after fetch offers call is successfull can be written here
Parameters:
Name Type Description
response object SDK Response object.

(static) fetchPromotionsPreHook(input)

A custom function to be used by customers for customisation, any custom action prior to fetch offers call can be written here
Parameters:
Name Type Description
input object Current Input Object.

(static) fetchPromotionsPreSDKCalls(input)

This function is used to execute any action before fetchPromotions SDK call is made.
Parameters:
Name Type Description
input object Current Input Object.

(static) fetchPromotionsProcessResponse(response)

This function is used to process fetchPromotions response
Parameters:
Name Type Description
response object Response Object from SDK call.

(static) fetchPromotionsSdkCall(input)

This function is used to make SDK call for fetchPromotions
Parameters:
Name Type Description
input object Current Input Object.

(static) getProductUrl(item)

Parameters:
Name Type Description
item object An object containing navigation info Returns the url from the offerDetailsAction, so that details page will have this url

(static) offersLoaded(result)

This callback function is called when offers are loaded
Parameters:
Name Type Description
result object An object containing list of offers

(static) onSelectView()

This function is used for switching offer list view