From 2be8c7c1fd684bdd09227b79ff71abd26f1d7e79 Mon Sep 17 00:00:00 2001 From: ext-vradulescu Date: Thu, 26 Sep 2024 11:37:05 +0300 Subject: [PATCH] options fix --- _src/blocks/new-prod-boxes/new-prod-boxes.js | 30 ++++---- .../product-comparison-table.js | 5 +- .../products-sideview/products-sideview.js | 5 +- _src/blocks/products/products.js | 69 +++++++++++++------ _src/scripts/utils/utils.js | 5 +- 5 files changed, 71 insertions(+), 43 deletions(-) diff --git a/_src/blocks/new-prod-boxes/new-prod-boxes.js b/_src/blocks/new-prod-boxes/new-prod-boxes.js index 11b3adbfa..5f6d15b75 100644 --- a/_src/blocks/new-prod-boxes/new-prod-boxes.js +++ b/_src/blocks/new-prod-boxes/new-prod-boxes.js @@ -81,20 +81,6 @@ async function updateProductPrice(prodName, prodUsers, prodYears, saveText, pid let updatedBuyLinkSelector = buyLinkSelector; if (updatedBuyLinkSelector) { updatedBuyLinkSelector.href = dynamicBuyLink(updatedBuyLinkSelector, prodName, prodUsers, prodYears, pid); - - const dataInfo = { - productId: prodName, - variation: { - price: discount - ? +newPrice : +oldPrice, - discounted_price: discount.discounted_price, - variation_name: variant, - currency_label: currencyLabel, - region_id: product.region_id, - }, - }; - - setDataOnBuyLinks(updatedBuyLinkSelector, dataInfo); } let priceElement = document.createElement('div'); priceElement.classList.add('hero-aem__prices__box'); @@ -130,6 +116,22 @@ async function updateProductPrice(prodName, prodUsers, prodYears, saveText, pid newPriceListed = formatPrice(newPrice, product.currency_iso, product.region_id); } + const dataInfo = { + productId: prodName, + variation: { + price: newPrice, + oldPrice, + variation_name: variant, + currency_label: currencyLabel, + region_id: product.region_id, + }, + }; + + setDataOnBuyLinks(updatedBuyLinkSelector, dataInfo); + + // const currentDomain = getDomain(); + // const formattedPriceParams = [mv.model.currency_iso, null, currentDomain]; + priceElement.innerHTML = `
diff --git a/_src/blocks/product-comparison-table/product-comparison-table.js b/_src/blocks/product-comparison-table/product-comparison-table.js index f5ae04cfd..6813fa153 100644 --- a/_src/blocks/product-comparison-table/product-comparison-table.js +++ b/_src/blocks/product-comparison-table/product-comparison-table.js @@ -62,9 +62,8 @@ createNanoBlock('priceComparison', (code, variant, label, block, productIndex, c const dataInfo = { productId: currentProduct.code, variation: { - price: currentProduct.product.discount - ? +currentProduct.product.discount.discounted_price : +currentProduct.product.price, - discounted_price: currentProduct.product.discount?.discounted_price, + price: discounted, + oldPrice: price, variation_name: currentProduct.variant, currency_label: currentProduct.product.currency_label, region_id: currentProduct.product.region_id, diff --git a/_src/blocks/products-sideview/products-sideview.js b/_src/blocks/products-sideview/products-sideview.js index e658debf1..b2612ae69 100644 --- a/_src/blocks/products-sideview/products-sideview.js +++ b/_src/blocks/products-sideview/products-sideview.js @@ -151,9 +151,9 @@ function updateBuyLink(block) { const dataInfo = { productId: productCode, variation: { - price: state.currentProduct.discount + price: state.currentProduct.discount?.discounted_price, + oldPrice: state.currentProduct.discount ? +state.currentProduct.discount.discounted_price : +state.currentProduct.price, - discounted_price: state.currentProduct.discount?.discounted_price, variation_name: state.currentProduct.variation.variation_name, currency_label: state.currentProduct.currency_label, region_id: state.currentProduct.region_id, @@ -179,6 +179,7 @@ function updatePrice(block) { const formattedPrice = formatPrice(resp.price, resp.currency_iso, null, getDomain()); + priceEl.dataset.price = resp.price; priceEl.textContent = `${formattedPrice}`; })(); } diff --git a/_src/blocks/products/products.js b/_src/blocks/products/products.js index c8a618cba..09f85a887 100644 --- a/_src/blocks/products/products.js +++ b/_src/blocks/products/products.js @@ -45,8 +45,6 @@ function customRound(value) { * @returns a model */ function toModel(productCode, variantId, v) { - const currentDomain = getDomain(); - const formattedPriceParams = [v.currency_iso, null, currentDomain]; return { productCode, variantId, @@ -55,22 +53,24 @@ function toModel(productCode, variantId, v) { devices: +v.variation.dimension_value, subscription: v.variation.years * 12, version: v.variation.years ? 'yearly' : 'monthly', - basePrice: formatPrice(+v.price, ...formattedPriceParams), + basePrice: +v.price, // eslint-disable-next-line max-len - actualPrice: formatPrice(v.discount ? +v.discount.discounted_price : +v.price, ...formattedPriceParams), - monthlyBasePrice: formatPrice(customRound(v.price / 12), ...formattedPriceParams), - discountedPrice: formatPrice(v.discount?.discounted_price, ...formattedPriceParams), - discountedMonthlyPrice: formatPrice(v.discount - ? customRound(v.discount.discounted_price / 12) - : 0, ...formattedPriceParams), - discount: formatPrice(v.discount + actualPrice: v.discount ? +v.discount.discounted_price : +v.price, + monthlyBasePrice: customRound(v.price / 12), + discountedPrice: v.discount?.discounted_price, + discountedMonthlyPrice: v.discount + ? v.discount.discounted_price / 12 + : 0, + discount: v.discount ? customRound((v.price - v.discount.discounted_price) * 100) / 100 - : 0, ...formattedPriceParams), + : 0, discountRate: v.discount ? Math.floor(((v.price - v.discount.discounted_price) / v.price) * 100) : 0, currency: v.currency_label, + currency_iso: v.currency_iso, url: generateProductBuyLink(v, productCode), + test: {}, }; } @@ -186,14 +186,25 @@ function renderOldPrice(mv, text = '', monthly = '') { const oldPriceElt = root.querySelector('span'); mv.subscribe(() => { + const currentDomain = getDomain(); + const formattedPriceParams = [mv.model.currency_iso, null, currentDomain]; + + let oldPrice = 0; + if (mv.model.discountedPrice) { - oldPriceElt.innerHTML = monthly.toLowerCase() === 'monthly' - ? `${text} ${mv.model.monthlyBasePrice} /mo` - : `${text} ${mv.model.basePrice}`; + if (monthly.toLowerCase() === 'monthly') { + oldPrice = mv.model.monthlyBasePrice; + oldPriceElt.innerHTML = `${text} ${formatPrice(mv.model.monthlyBasePrice, ...formattedPriceParams)} /mo`; + } else { + oldPrice = mv.model.basePrice; + oldPriceElt.innerHTML = `${text} ${formatPrice(mv.model.basePrice, ...formattedPriceParams)}`; + } oldPriceElt.style.visibility = 'visible'; } else { oldPriceElt.style.visibility = 'hidden'; } + + mv.model.test.oldPrice = oldPrice; }); return root; @@ -219,18 +230,28 @@ function renderPrice(mv, text = '', monthly = '', monthTranslation = 'mo') { const priceElt = root.querySelector('strong'); mv.subscribe(() => { + const currentDomain = getDomain(); + const formattedPriceParams = [mv.model.currency_iso, null, currentDomain]; + + let price; if (monthly.toLowerCase() === 'monthly') { if (mv.model.discountedPrice) { - priceElt.innerHTML = `${text} ${mv.model.discountedMonthlyPrice} /${monthTranslation}`; + price = mv.model.discountedMonthlyPrice; + priceElt.innerHTML = `${text} ${formatPrice(mv.model.discountedMonthlyPrice, ...formattedPriceParams)} /${monthTranslation}`; } else { - priceElt.innerHTML = `${text} ${mv.model.monthlyBasePrice} /${monthTranslation}`; + price = mv.model.monthlyBasePrice; + priceElt.innerHTML = `${text} ${formatPrice(mv.model.monthlyBasePrice, ...formattedPriceParams)} /${monthTranslation}`; } } else if (mv.model.discountedPrice) { - priceElt.innerHTML = `${text} ${mv.model.discountedPrice}`; + price = mv.model.discountedPrice; + priceElt.innerHTML = `${text} ${formatPrice(mv.model.discountedPrice, ...formattedPriceParams)}`; } else { - priceElt.innerHTML = `${text} ${mv.model.basePrice}`; + price = mv.model.basePrice; + priceElt.innerHTML = `${text} ${formatPrice(mv.model.basePrice, ...formattedPriceParams)}`; } + mv.model.test.price = price; + trackProduct(mv.model); }); @@ -375,11 +396,13 @@ function renderFeaturedSavings(mv, text = 'Save', percent = '') { */ function renderLowestPrice(code, variant, monthly = '', text = '') { const root = document.createElement('p'); - fetchProduct(code, variant).then((product) => { + const currentDomain = getDomain(); + const formattedPriceParams = [product.currency_iso, null, currentDomain]; const m = toModel(code, variant, product); const isMonthly = monthly.toLowerCase() === 'monthly'; - const price = isMonthly ? customRound(m.actualPrice / 12) : m.actualPrice; + // eslint-disable-next-line max-len + const price = formatPrice(isMonthly ? customRound(m.actualPrice / 12) : m.actualPrice, ...formattedPriceParams); root.innerHTML = `${text.replace('0', `${price}`)}`; }); @@ -431,11 +454,13 @@ export default function decorate(block) { col.querySelectorAll('.button-container a').forEach((link) => { if (link && (link.href.includes('/site/Store/buy/') || link.href.includes('checkout.bitdefender.com'))) { link.href = card.url; + // console.log('test', mv.model.test) + const dataInfo = { productId: card.productCode, variation: { - price: card.actualPrice, - discounted_price: card.discountedPrice, + price: card.test.price, + oldPrice: card.test.oldPrice, variation_name: card.variantId, currency_label: card.currency, region_id: card.regionId, diff --git a/_src/scripts/utils/utils.js b/_src/scripts/utils/utils.js index 0c7b6ff0b..88a589c9f 100644 --- a/_src/scripts/utils/utils.js +++ b/_src/scripts/utils/utils.js @@ -328,9 +328,10 @@ export function setDataOnBuyLinks(element, dataInfo) { const { productId, variation } = dataInfo; if (productId) element.dataset.product = productId; - element.dataset.buyPrice = variation.discounted_price || variation.price || 0; + // element.dataset.buyPrice = variation.discounted_price || variation.price || 0; - if (variation.price) element.dataset.oldPrice = variation.price; + if (variation.price) element.dataset.buyPrice = variation.price; + if (variation.oldPrice) element.dataset.oldPrice = variation.oldPrice; if (variation.currency_label) element.dataset.currency = variation.currency_label; if (variation.region_id) element.dataset.region = variation.region_id; if (variation.variation_name) element.dataset.variation = variation.variation_name;