VlocityDCOfferGridView

vlocity-dc-offer-grid-view is the component for offer grid view.

Constructor

new VlocityDCOfferGridView()

Properties:

Name	Type	Description
`offers`	Object	indicates an object which contains a list of all the offers.

Example

Sample Usage -

Include the component in your template simply by adding vlocity-dc-offer-grid-view custom tag

<vlocity-dc-offer-grid-view .offers="${productList}"></vlocity-dc-offer-grid-view>

| Attribute Name    | Type Expected                                                                   | Required |
|-------------------|---------------------------------------------------------------------------------|----------|
| offers            | An object which contains a list of all the offers                               | Required |


 KEY INFO -

 events fired : "vlocity-dc-offer-selected"

 events registered : none

 Dependency - vlocity-offer-grid-view is a component used to render grid view of offer list and is commonly used as a child of vlocity-dc-offers-list component.

               | Parent Component        | Expected Children Components           |
               |-------------------------|----------------------------------------|
               | vlocity-dc-offers-list  | vlocity-dc-offer-list-view-image       |
               |                         | vlocity-dc-offer-list-view-price       |
               |                         | vlocity-dc-offer-list-view-attribute   |


Sample with slots -

<vlocity-dc-offer-grid-view>
   <span slot="{slot_name}">
     Custom HTML elements goes here
   </span>
</vlocity-dc-offer-grid-view>

List of available slots -

| Slot names                 | Dynamic     | Description                 | Impact               |
|----------------------------|-------------|----------------------------------------------------|
| dc-offer-grid-view-wrapper | -           | Wrapper for template        | Replaces DOM         |
| dc-attributes              | -           | Offer attributes            | Replaces DOM         |
| dc-offer-desc              | -           | Ofeer description           | Replaces 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 all the offers.

Methods

(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) offerSelected(offer)

Parameters:

Name	Type	Description
`offer`	object	An object selected offer Fires "vlocity-dc-route-navigation" which register in 'dc-main' to update selected offer code & Navigate to config page Navigates to config page with selected offer