cpq-promotion-item (template)

The cpq-promotion-item template provides the structure for an individual promotion line item in Industries Cart.

In Salesforce Industries Communications, Media, and Energy Summer '18, cpq-promotion-item has been changed to provide multi-language support to translate Promotion Name, Promotion Code, and Promotion Description.

Template Type

Cards

Code

HTML, CSS/SCSS

Image

The 'Enjoy Sports free for 3 Months' promotion is in a table row, with the description, start and end dates, and Add and Delete buttons.

Upgrade from Vlocity CME Winter '18 to Vlocity CME Summer '18

When upgrading from Salesforce Industries Communications, Media, and Energy Winter '18 to Salesforce Industries Communications, Media, and Energy Summer '18, you must make the following changes to the HTML in the Card Designer.

First Change

<div class="slds-col slds-small-size_10-of-12 slds-medium-size_10-of-12 slds-large-size_10-of-12">
  <p class="slds-tile__title slds-truncate cpq-promotion-name">{{::obj.Name}}</p>
</div>
<div class="slds-col slds-small-size_10-of-12 slds-medium-size_10-of-12 slds-large-size_10-of-12">
  <p class="slds-tile__title slds-truncate cpq-promotion-name" cpq-translate="Promotion.Name">{{::obj.Name}}</p>
</div>

Second Change

<div>
  <span class="cpq-promotion-label">{{::importedScope.customLabels.CPQPromoCode | uppercase}}: </span>
  <span class="slds-text-body_small"> {{::obj[$root.nsPrefix+'Code__c']}}</span>
</div>
<div>
  <span class="cpq-promotion-label">{{::importedScope.customLabels.CPQPromoCode | uppercase}}: </span>
  <span class="slds-text-body_small" cpq-translate="Promotion.Code"> {{::obj[$root.nsPrefix+'Code__c']}}</span>
</div>

Third Change

<div>{{::obj.Description__c}}</div>
<div cpq-translate="Promotion.Description">{{::obj.description}}</div>

Fourth Change

<li ng-repeat="msg in obj.messages" class="slds-p-vertical_xx-small">
  <span class="cpq-error-msg" ng-if="msg.severity === 'ERROR'"> {{msg.message}}</span>
  <span class="cpq-warning-msg" ng-if="msg.severity !== 'ERROR'"> {{msg.message}}</span>
</li>
<li ng-repeat="msg in obj.messages" class="slds-p-vertical_xx-small">
  <span class="cpq-error-msg" ng-if="msg.severity === 'ERROR'" cpq-translate="Promotion.Name"> {{msg.message}}</span>
  <span class="cpq-warning-msg" ng-if="msg.severity !== 'ERROR'" cpq-translate="Promotion.Name"> {{msg.message}}</span>
</li>