Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(storefront): BCTHEME-1941 Cornerstone changes to support inc/ex tax price lists on PDP #2486

Merged
merged 2 commits into from
Sep 27, 2024
Merged

fix(storefront): BCTHEME-1941 Cornerstone changes to support inc/ex tax price lists on PDP #2486

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e730f0a
fix(storefront): BCTHEME-1941 Cornerstone changes to support inc/ex t…
bc-yevhenii-buliuk Sep 24, 2024
8e25c1a
Merge branch 'master' into BCTHEME-1941
bc-yevhenii-buliuk Sep 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

## Draft
- Cornerstone changes to support inc/ex tax price lists on PDP [#2486](https://github.com/bigcommerce/cornerstone/pull/2486)
- Viewing Orders after logging into customer account displays incorrect quantity of products ordered compared to Order details page. [#2482](https://github.com/bigcommerce/cornerstone/pull/2482)
- High severity security issue [#2477](https://github.com/bigcommerce/cornerstone/pull/2477)
- Date Field Modifier - February showing 30th and 31st [#2473](https://github.com/bigcommerce/cornerstone/pull/2473)
Expand Down
24 changes: 18 additions & 6 deletions assets/js/theme/common/product-details-base.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,13 @@ const optionsTypesMap = {
PRODUCT_LIST: 'product-list',
};

export function optionChangeDecorator(areDefaultOtionsSet) {
export function optionChangeDecorator(areDefaultOptionsSet) {
return (err, response) => {
const attributesData = response.data || {};
const attributesContent = response.content || {};

this.updateProductAttributes(attributesData);
if (areDefaultOtionsSet) {
if (areDefaultOptionsSet) {
this.updateView(attributesData, attributesContent);
} else {
this.updateDefaultAttributesForOOS(attributesData);
Expand Down Expand Up @@ -145,8 +145,14 @@ export default class ProductDetailsBase {
*/
getViewModel($scope) {
return {
$priceWithTax: $('[data-product-price-with-tax]', $scope),
$priceWithoutTax: $('[data-product-price-without-tax]', $scope),
priceWithTax: {
$div: $('.price--withTax', $scope),
$span: $('[data-product-price-with-tax]', $scope),
bc-yevhenii-buliuk marked this conversation as resolved.
Show resolved Hide resolved
},
priceWithoutTax: {
$div: $('.price--withoutTax', $scope),
$span: $('[data-product-price-without-tax]', $scope),
},
rrpWithTax: {
$div: $('.rrp-price--withTax', $scope),
$span: $('[data-product-rrp-with-tax]', $scope),
Expand Down Expand Up @@ -210,6 +216,8 @@ export default class ProductDetailsBase {
viewModel.priceSaved.$div.hide();
viewModel.priceNowLabel.$span.hide();
viewModel.priceLabel.$span.hide();
viewModel.priceWithTax.$div.hide();
viewModel.priceWithoutTax.$div.hide();
}

/**
Expand All @@ -223,6 +231,8 @@ export default class ProductDetailsBase {

if (data.price instanceof Object) {
this.updatePriceView(viewModel, data.price);
} else {
this.clearPricingNotFound(viewModel);
}

if (data.weight instanceof Object) {
Expand Down Expand Up @@ -292,15 +302,17 @@ export default class ProductDetailsBase {
`${price.price_range.min.with_tax.formatted} - ${price.price_range.max.with_tax.formatted}`
: price.with_tax.formatted;
viewModel.priceLabel.$span.show();
viewModel.$priceWithTax.html(updatedPrice);
viewModel.priceWithTax.$div.show();
viewModel.priceWithTax.$span.html(updatedPrice);
}

if (price.without_tax) {
const updatedPrice = price.price_range ?
`${price.price_range.min.without_tax.formatted} - ${price.price_range.max.without_tax.formatted}`
: price.without_tax.formatted;
viewModel.priceLabel.$span.show();
viewModel.$priceWithoutTax.html(updatedPrice);
viewModel.priceWithoutTax.$div.show();
viewModel.priceWithoutTax.$span.html(updatedPrice);
}

if (price.rrp_with_tax) {
Expand Down
8 changes: 4 additions & 4 deletions templates/components/products/price-range.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,15 +36,15 @@
{{price.non_sale_price_with_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withTax">
<div class="price-section price-section--withTax price--withTax">
<span class="price-label">{{theme_settings.pdp-price-label}}</span>
<span class="price-now-label" style="display: none;">
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-with-tax class="price price--withTax">{{price.price_range.min.with_tax.formatted}} - {{price.price_range.max.with_tax.formatted}}</span>
<span data-product-price-with-tax class="price">{{price.price_range.min.with_tax.formatted}} - {{price.price_range.max.with_tax.formatted}}</span>
{{#and price.price_range.min.without_tax price.price_range.max.without_tax}}
<abbr title="{{lang 'products.including_tax'}}">{{lang 'products.price_with_tax' tax_label=price.price_range.min.tax_label}}</abbr>
{{/and}}
Expand Down Expand Up @@ -88,15 +88,15 @@
{{price.non_sale_price_without_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withoutTax{{#and price_range.min.with_tax price_range.max.with_tax}} price-section--minor{{/and}}">
<div class="price-section price-section--withoutTax price--withoutTax{{#and price_range.min.with_tax price_range.max.with_tax}} price-section--minor{{/and}}">
<span class="price-label">{{theme_settings.pdp-price-label}}</span>
<span class="price-now-label" style="display: none;">
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-without-tax class="price price--withoutTax">{{price.price_range.min.without_tax.formatted}} - {{price.price_range.max.without_tax.formatted}}</span>
<span data-product-price-without-tax class="price">{{price.price_range.min.without_tax.formatted}} - {{price.price_range.max.without_tax.formatted}}</span>
{{#and price.price_range.min.with_tax price.price_range.max.with_tax}}
<abbr title="{{lang 'products.excluding_tax'}}">{{lang 'products.price_without_tax' tax_label=price.price_range.min.tax_label}}</abbr>
{{/and}}
Expand Down
152 changes: 74 additions & 78 deletions templates/components/products/price.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,84 +7,80 @@
{{#and price.price_range (if theme_settings.price_ranges '==' true)}}
{{> components/products/price-range price=price}}
{{else}}
{{#if price.with_tax}}
<div class="price-section price-section--withTax rrp-price--withTax" {{#unless price.rrp_with_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-retail-price-label
fallback=(lang "page_builder.pdp-retail-price-label")
}}
</span>
<span data-product-rrp-with-tax class="price price--rrp">
{{price.rrp_with_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withTax non-sale-price--withTax" {{#unless price.non_sale_price_with_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-non-sale-price-label
fallback=(lang "page_builder.pdp-non-sale-price-label")
}}
</span>
<span data-product-non-sale-price-with-tax class="price price--non-sale">
{{price.non_sale_price_with_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withTax">
<span class="price-label" {{#if price.non_sale_price_with_tax}}style="display: none;"{{/if}}>
{{theme_settings.pdp-price-label}}
</span>
<span class="price-now-label" {{#unless price.non_sale_price_with_tax}}style="display: none;"{{/unless}}>
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-with-tax class="price price--withTax">{{price.with_tax.formatted}}</span>
{{#if price.without_tax}}
<abbr title="{{lang 'products.including_tax'}}">{{lang 'products.price_with_tax' tax_label=price.tax_label}}</abbr>
{{/if}}
</div>
{{/if}}
{{#if price.without_tax}}
<div class="price-section price-section--withoutTax rrp-price--withoutTax{{#if price.with_tax}} price-section--minor{{/if}}" {{#unless price.rrp_without_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-retail-price-label
fallback=(lang "page_builder.pdp-retail-price-label")
}}
</span>
<span data-product-rrp-price-without-tax class="price price--rrp">
{{price.rrp_without_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withoutTax non-sale-price--withoutTax{{#if price.with_tax}} price-section--minor{{/if}}" {{#unless price.non_sale_price_without_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-non-sale-price-label
fallback=(lang "page_builder.pdp-non-sale-price-label")
}}
</span>
<span data-product-non-sale-price-without-tax class="price price--non-sale">
{{price.non_sale_price_without_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withoutTax">
<span class="price-label" {{#if price.non_sale_price_without_tax}}style="display: none;"{{/if}}>
{{theme_settings.pdp-price-label}}
</span>
<span class="price-now-label" {{#unless price.non_sale_price_without_tax}}style="display: none;"{{/unless}}>
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-without-tax class="price price--withoutTax{{#if price.with_tax}} price-section--minor{{/if}}">{{price.without_tax.formatted}}</span>
{{#if price.with_tax}}
<abbr title="{{lang 'products.excluding_tax'}}">{{lang 'products.price_without_tax' tax_label=price.tax_label}}</abbr>
{{/if}}
</div>
{{/if}}
<div class="price-section price-section--withTax rrp-price--withTax" {{#unless price.rrp_with_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-retail-price-label
fallback=(lang "page_builder.pdp-retail-price-label")
}}
</span>
<span data-product-rrp-with-tax class="price price--rrp">
{{price.rrp_with_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withTax non-sale-price--withTax" {{#unless price.non_sale_price_with_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-non-sale-price-label
fallback=(lang "page_builder.pdp-non-sale-price-label")
}}
</span>
<span data-product-non-sale-price-with-tax class="price price--non-sale">
{{price.non_sale_price_with_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withTax price--withTax" {{#unless price.with_tax}}style="display: none;{{/unless}}>
bc-yevhenii-buliuk marked this conversation as resolved.
Show resolved Hide resolved
<span class="price-label" {{#if price.non_sale_price_with_tax}}style="display: none;"{{/if}}>
{{theme_settings.pdp-price-label}}
</span>
<span class="price-now-label" {{#unless price.non_sale_price_with_tax}}style="display: none;"{{/unless}}>
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-with-tax class="price">{{price.with_tax.formatted}}</span>
{{#if price.without_tax}}
<abbr title="{{lang 'products.including_tax'}}">{{lang 'products.price_with_tax' tax_label=price.tax_label}}</abbr>
{{/if}}
</div>
<div class="price-section price-section--withoutTax rrp-price--withoutTax{{#if price.with_tax}} price-section--minor{{/if}}" {{#unless price.rrp_without_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-retail-price-label
fallback=(lang "page_builder.pdp-retail-price-label")
}}
</span>
<span data-product-rrp-price-without-tax class="price price--rrp">
{{price.rrp_without_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withoutTax non-sale-price--withoutTax{{#if price.with_tax}} price-section--minor{{/if}}" {{#unless price.non_sale_price_without_tax}}style="display: none;"{{/unless}}>
<span>
{{> components/products/price-label
label_value=theme_settings.pdp-non-sale-price-label
fallback=(lang "page_builder.pdp-non-sale-price-label")
}}
</span>
<span data-product-non-sale-price-without-tax class="price price--non-sale">
{{price.non_sale_price_without_tax.formatted}}
</span>
</div>
<div class="price-section price-section--withoutTax price--withoutTax" {{#unless price.without_tax}}style="display: none;"{{/unless}}>
<span class="price-label" {{#if price.non_sale_price_without_tax}}style="display: none;"{{/if}}>
{{theme_settings.pdp-price-label}}
</span>
<span class="price-now-label" {{#unless price.non_sale_price_without_tax}}style="display: none;"{{/unless}}>
{{> components/products/price-label
label_value=theme_settings.pdp-sale-price-label
fallback=(lang "page_builder.pdp-sale-price-label")
}}
</span>
<span data-product-price-without-tax class="price{{#if price.with_tax}} price-section--minor{{/if}}">{{price.without_tax.formatted}}</span>
{{#if price.with_tax}}
<abbr title="{{lang 'products.excluding_tax'}}">{{lang 'products.price_without_tax' tax_label=price.tax_label}}</abbr>
{{/if}}
</div>
{{#if page_type '===' 'product'}}
<div class="price-section price-section--saving price" {{#unless price.saved}}style="display: none;"{{/unless}}>
<span class="price">{{lang 'products.you_save_opening_text'}}</span>
Expand Down
Loading