diff --git a/components/atoms/a-product-price.vue b/components/atoms/a-product-price.vue index 56ad7b6a5..c4dd49518 100644 --- a/components/atoms/a-product-price.vue +++ b/components/atoms/a-product-price.vue @@ -6,8 +6,9 @@ - - diff --git a/components/organisms/o-product-details.vue b/components/organisms/o-product-details.vue index 5a26cbdeb..de35765be 100644 --- a/components/organisms/o-product-details.vue +++ b/components/organisms/o-product-details.vue @@ -74,7 +74,6 @@ import OCrossSellsProductsSelector from 'theme/components/organisms/o-cross-sell import { ModalList } from 'theme/store/ui/modals'; import getProductImagePlaceholder from '@vue-storefront/core/modules/cart/helpers/getProductImagePlaceholder'; import { mapActions } from 'vuex'; -import { getProductDefaultPrice } from 'src/modules/shared'; export default { inject: { @@ -149,10 +148,6 @@ export default { availability () { return this.product.stock && this.product.stock.is_in_stock ? 'InStock' : 'OutOfStock' }, - productPrice () { - const price = getProductDefaultPrice(this.product, {}, false); - return price.special ? price.special : price.regular - }, sharingData () { // todo may contains html tags const rawDescription = this.product.short_description ? this.product.short_description.replace(/(

|<\/p>)/g, '') : ''; diff --git a/components/storyblok/Product.vue b/components/storyblok/Product.vue index db6df5ebc..1d857deb7 100644 --- a/components/storyblok/Product.vue +++ b/components/storyblok/Product.vue @@ -36,13 +36,13 @@ import { formatProductLink } from '@vue-storefront/core/modules/url/helpers'; import ProductImage from '../core/ProductImage.vue'; import { LocalizedRoute, StoreView } from 'core/lib/types'; import config from 'config'; +import { PRODUCT_PRICE_DICTIONARY } from '@vue-storefront/core/modules/catalog'; import Product from 'core/modules/catalog/types/Product'; import { Blok } from 'src/modules/vsf-storyblok-module/components'; -import { getProductDefaultPrice } from 'src/modules/shared'; +import { PriceHelper } from 'src/modules/shared'; import ProductData from './interfaces/product-data.interface'; import getProductImagePlaceholder from '@vue-storefront/core/modules/cart/helpers/getProductImagePlaceholder'; -import { formatPrice, getFinalPrice } from 'src/modules/shared/helpers/price'; export default Blok.extend({ name: 'StoryblokProductBlock', @@ -56,6 +56,9 @@ export default Blok.extend({ } }, computed: { + productPriceDictionary (): Record { + return this.$store.getters[PRODUCT_PRICE_DICTIONARY]; + }, itemData (): ProductData { return this.item as ProductData; }, @@ -67,16 +70,16 @@ export default Blok.extend({ return undefined; } - const price = getProductDefaultPrice(this.product, {}, false); + const price = this.productPriceDictionary[this.product.id]; - return getFinalPrice(price); + return PriceHelper.getFinalPrice(price); }, formattedPrice (): string { if (!this.price) { return ''; } - return formatPrice(this.price); + return PriceHelper.formatPrice(this.price); }, name (): string { if (!this.product) { diff --git a/helpers/index.ts b/helpers/index.ts index 7d0f3fe38..89441d973 100644 --- a/helpers/index.ts +++ b/helpers/index.ts @@ -4,9 +4,10 @@ import { currentStoreView } from '@vue-storefront/core/lib/multistore' import { productThumbnailPath, getThumbnailPath, isServer } from '@vue-storefront/core/helpers' import { htmlDecode } from '@vue-storefront/core/filters' -import { getProductDefaultPrice, getProductDefaultDiscount } from 'src/modules/shared'; +import { PriceHelper } from 'src/modules/shared'; import getProductImagePlaceholder from '@vue-storefront/core/modules/cart/helpers/getProductImagePlaceholder'; +import Product from 'core/modules/catalog/types/Product'; export function getPathForStaticPage (path: string) { const { storeCode } = currentStoreView() @@ -53,22 +54,27 @@ export function getTopLevelCategories (categoryList) { ) } -export function prepareCategoryProduct (product) { +export function prepareCategoryProduct ( + product, + productPriceDictionary: Record +) { const imagePath = productThumbnailPath(product); const thumbnailPath = !imagePath ? getProductImagePlaceholder() : getThumbnailPath( imagePath, config.products.thumbnails.width, config.products.thumbnails.height ); + const price = productPriceDictionary[product.id]; + const discount = PriceHelper.getProductDiscount(price); return { - discount: getProductDefaultDiscount(product), + discount: PriceHelper.formatProductDiscount(discount).discountPercent, id: product.id, sku: product.sku, title: htmlDecode(product.name), image: thumbnailPath, link: formatProductLink(product, currentStoreView().storeCode), - price: getProductDefaultPrice(product, {}), + price: PriceHelper.formatProductPrice(price), rating: { max: 5, score: 5 diff --git a/helpers/use-related-products.ts b/helpers/use-related-products.ts index f97be333e..258343782 100644 --- a/helpers/use-related-products.ts +++ b/helpers/use-related-products.ts @@ -3,6 +3,7 @@ import config from 'config'; import { SearchQuery } from 'storefront-query-builder'; import rootStore from '@vue-storefront/core/store'; +import { PRODUCT_PRICE_DICTIONARY } from '@vue-storefront/core/modules/catalog'; import Product from '@vue-storefront/core/modules/catalog/types/Product'; import { Dictionary } from 'src/modules/budsies'; @@ -55,10 +56,12 @@ export function useRelatedProducts ( return dictionary; }); const preparedRelatedProducts = computed(() => { + const productPriceDictionary = rootStore.getters[PRODUCT_PRICE_DICTIONARY]; + return relatedProducts.value.map( (item: Product) => ( { - ...prepareCategoryProduct(item), + ...prepareCategoryProduct(item, productPriceDictionary), landing_page_url: item.landing_page_url } ) diff --git a/pages/Category.vue b/pages/Category.vue index d825d697c..aab4c898c 100644 --- a/pages/Category.vue +++ b/pages/Category.vue @@ -233,6 +233,7 @@ import { mapMobileObserver, unMapMobileObserver } from '@storefront-ui/vue/src/utilities/mobile-observer'; +import { PRODUCT_PRICE_DICTIONARY } from '@vue-storefront/core/modules/catalog'; import EventBus from '@vue-storefront/core/compatibility/plugins/event-bus' import getHostFromHeaders from '@vue-storefront/core/helpers/get-host-from-headers.function'; @@ -412,7 +413,14 @@ export default { : this.getCurrentPageProducts; }, preparedProducts () { - return this.products.map(prepareCategoryProduct); + const productPriceDictionary = this.$store.getters[PRODUCT_PRICE_DICTIONARY]; + + return this.products.map( + (product) => prepareCategoryProduct( + product, + productPriceDictionary + ) + ); }, totalPages () { return Math.ceil(this.getCategoryProductsTotal / THEME_PAGE_SIZE); diff --git a/pages/CreativityKitProduct.vue b/pages/CreativityKitProduct.vue index ee1d58a94..8ce3e0174 100644 --- a/pages/CreativityKitProduct.vue +++ b/pages/CreativityKitProduct.vue @@ -202,10 +202,11 @@ import { SfHeading } from '@storefront-ui/vue'; import EventBus from '@vue-storefront/core/compatibility/plugins/event-bus'; import { htmlDecode } from '@vue-storefront/core/filters'; +import { PRODUCT_PRICE_DICTIONARY } from '@vue-storefront/core/modules/catalog'; import { catalogHooksExecutors } from '@vue-storefront/core/modules/catalog-next/hooks'; import { PRODUCT_UNSET_CURRENT } from '@vue-storefront/core/modules/catalog/store/product/mutation-types'; import Product from 'core/modules/catalog/types/Product'; -import { getProductDefaultPrice, PriceHelper, ProductEvent } from 'src/modules/shared'; +import { PriceHelper, ProductEvent } from 'src/modules/shared'; import { ProductStructuredData } from 'src/modules/budsies'; @@ -256,22 +257,25 @@ export default (Vue as VueConstructor).extend({ const productBySku = this.$store.getters['product/getProductBySkuDictionary']; return productBySku[budsieProductSku]; }, + productPriceDictionary (): Record { + return this.$store.getters[PRODUCT_PRICE_DICTIONARY]; + }, budsieProductPrice (): number { - const price = getProductDefaultPrice( - this.getBudsieProduct, - {}, - false - ); + if (!this.getBudsieProduct) { + return budsieShippingPrice; + } + + const price = this.productPriceDictionary[this.getBudsieProduct.id]; const finalPrice = PriceHelper.getFinalPrice(price); return finalPrice + budsieShippingPrice; }, superizedAddonPrice (): number { - const price = getProductDefaultPrice( - this.superizedAddonProduct, - {}, - false - ); + if (!this.superizedAddonProduct) { + return 0; + } + + const price = this.productPriceDictionary[this.superizedAddonProduct.id]; return PriceHelper.getFinalPrice(price); }, diff --git a/pages/DetailedCart.vue b/pages/DetailedCart.vue index 7b57ccab3..392e95d37 100644 --- a/pages/DetailedCart.vue +++ b/pages/DetailedCart.vue @@ -73,9 +73,9 @@ @@ -156,9 +156,10 @@ import { } from '@storefront-ui/vue'; import { OrderSummary } from './DetailedCart/index.js'; import { mapGetters, mapState } from 'vuex'; -import { getCartItemPrice } from 'src/modules/shared'; +import { PriceHelper } from 'src/modules/shared'; import { localizedRoute } from '@vue-storefront/core/lib/multistore'; import { getThumbnailForProduct } from '@vue-storefront/core/modules/cart/helpers'; +import { CART_ITEM_PRICE_DICTIONARY } from '@vue-storefront/core/modules/cart'; import getCartItemKey from 'src/modules/budsies/helpers/get-cart-item-key.function'; import CartEvents from 'src/modules/shared/types/cart-events'; import EventBus from '@vue-storefront/core/compatibility/plugins/event-bus'; @@ -393,6 +394,9 @@ export default { products: 'cart/getCartItems' }), ...mapMobileObserver(), + cartItemPriceDictionary () { + return this.$store.getters[CART_ITEM_PRICE_DICTIONARY]; + }, totalItems () { return this.products.reduce( (totalItems, product) => totalItems + parseInt(product.qty, 10), @@ -407,9 +411,6 @@ export default { }, skinClass () { return getCurrentThemeClass(); - }, - campaignContent () { - return this.$store.getters['promotionPlatform/campaignContent']; } }, async mounted () { @@ -540,13 +541,8 @@ export default { }); } }, - // TODO: campaignContent param is quick fix, need to refactor - getProductRegularPrice (product, campaignContent) { - return getCartItemPrice(product, {}).regular; - }, - // TODO: campaignContent param is quick fix, need to refactor - getProductSpecialPrice (product, campaignContent) { - return getCartItemPrice(product, {}).special; + formatPrice (price) { + return PriceHelper.formatProductPrice(price); }, removeHandler (product) { this.$store.dispatch('cart/removeItem', { product: product });