diff --git a/view/frontend/web/js/applepay/button.js b/view/frontend/web/js/applepay/button.js index 1625fd4..b1e03d7 100644 --- a/view/frontend/web/js/applepay/button.js +++ b/view/frontend/web/js/applepay/button.js @@ -26,7 +26,8 @@ define([ 'Adyen_ExpressCheckout/js/helpers/validatePdpForm', 'Adyen_ExpressCheckout/js/model/config', 'Adyen_ExpressCheckout/js/model/countries', - 'Adyen_ExpressCheckout/js/model/totals' + 'Adyen_ExpressCheckout/js/model/totals', + 'Adyen_ExpressCheckout/js/model/currency' ], function ( Component, @@ -56,7 +57,8 @@ define([ validatePdpForm, configModel, countriesModel, - totalsModel + totalsModel, + currencyModel ) { 'use strict'; @@ -87,6 +89,7 @@ define([ setExpressMethods(response); totalsModel().setTotal(response.totals.grand_total); + currencyModel().setCurrency(response.totals.quote_currency_code) const $priceBox = getPdpPriceBox(); const pdpForm = getPdpForm(element); @@ -142,6 +145,11 @@ define([ }); const applePayConfiguration = this.getApplePayConfiguration(applePaymentMethod, element); + if (this.isProductView) { + applePayConfiguration.currencyCode = currencyModel().getCurrency(); + applePayConfiguration.amount.currency = currencyModel().getCurrency(); + } + this.applePayComponent = adyenCheckoutComponent.create( 'applepay', applePayConfiguration @@ -186,10 +194,20 @@ define([ const config = configModel().getConfig(); const countryCode = config.countryCode === 'UK' ? 'GB' : config.countryCode; const pdpForm = getPdpForm(element); + let currency; + + if (this.isProductView) { + currency = currencyModel().getCurrency(); + } else { + const cartData = customerData.get('cart'); + const adyenMethods = cartData()['adyen_payment_methods']; + const paymentMethodExtraDetails = adyenMethods.paymentMethodsExtraDetails[applePaymentMethod.type]; + currency = paymentMethodExtraDetails.configuration.amount.currency; + } return { countryCode: countryCode, - currencyCode: config.currency, + currencyCode: currency, totalPriceLabel: $t('Grand Total'), configuration: { domainName: window.location.hostname, @@ -200,7 +218,7 @@ define([ value: this.isProductView ? formatAmount(totalsModel().getTotal() * 100) : formatAmount(getCartSubtotal() * 100), - currency: config.currency + currency: currency }, supportedNetworks: getSupportedNetworks(), merchantCapabilities: ['supports3DS'], @@ -285,7 +303,7 @@ define([ applePayShippingContactUpdate.newShippingMethods = shippingMethods; applePayShippingContactUpdate.newTotal = { label: $t('Grand Total'), - amount: response.base_grand_total.toString() + amount: response.grand_total.toString() }; applePayShippingContactUpdate.newLineItems = [ { @@ -332,7 +350,7 @@ define([ applePayShippingMethodUpdate.newTotal = { type: 'final', label: $t('Grand Total'), - amount: response.base_grand_total.toString() + amount: response.grand_total.toString() }; applePayShippingMethodUpdate.newLineItems = [ { diff --git a/view/frontend/web/js/googlepay/button.js b/view/frontend/web/js/googlepay/button.js index 8619641..736d841 100644 --- a/view/frontend/web/js/googlepay/button.js +++ b/view/frontend/web/js/googlepay/button.js @@ -25,7 +25,8 @@ define([ 'Adyen_ExpressCheckout/js/helpers/validatePdpForm', 'Adyen_ExpressCheckout/js/model/config', 'Adyen_ExpressCheckout/js/model/countries', - 'Adyen_ExpressCheckout/js/model/totals' + 'Adyen_ExpressCheckout/js/model/totals', + 'Adyen_ExpressCheckout/js/model/currency' ], function ( Component, @@ -54,7 +55,8 @@ define([ validatePdpForm, configModel, countriesModel, - totalsModel + totalsModel, + currencyModel ) { 'use strict'; @@ -111,6 +113,7 @@ define([ setExpressMethods(response); totalsModel().setTotal(response.totals.grand_total); + currencyModel().setCurrency(response.totals.quote_currency_code) const $priceBox = getPdpPriceBox(); const pdpForm = getPdpForm(element); @@ -192,6 +195,16 @@ define([ const googlePayStyles = getGooglePayStyles(); const config = configModel().getConfig(); const pdpForm = getPdpForm(element); + let currency; + + if (this.isProductView) { + currency = currencyModel().getCurrency(); + } else { + const cartData = customerData.get('cart'); + const adyenMethods = cartData()['adyen_payment_methods']; + const paymentMethodExtraDetails = adyenMethods.paymentMethodsExtraDetails[googlePaymentMethod.type]; + currency = paymentMethodExtraDetails.configuration.amount.currency; + } return { showPayButton: true, @@ -215,7 +228,7 @@ define([ totalPrice: this.isProductView ? formatAmount(totalsModel().getTotal()) : formatAmount(getCartSubtotal()), - currencyCode: config.currency + currencyCode: currency }, paymentDataCallbacks: { onPaymentDataChanged: this.onPaymentDataChanged.bind(this) @@ -254,18 +267,6 @@ define([ return; } - const shippingMethods = response.map((shippingMethod) => { - const label = shippingMethod.price_incl_tax - ? formatCurrency(shippingMethod.price_incl_tax) + ' - ' + shippingMethod.method_title - : shippingMethod.method_title; - - return { - id: shippingMethod.method_code, - label: label, - description: shippingMethod.carrier_title - }; - }); - this.shippingMethods = response; const selectedShipping = data.shippingOptionData.id === 'shipping_option_unselected' ? response[0] @@ -287,6 +288,18 @@ define([ setTotalsInfo(totalsPayload, this.isProductView) .done(function (totals) { + const shippingMethods = response.map((shippingMethod) => { + const label = shippingMethod.price_incl_tax + ? formatCurrency(shippingMethod.price_incl_tax, totals.quote_currency_code) + ' - ' + shippingMethod.method_title + : shippingMethod.method_title; + + return { + id: shippingMethod.method_code, + label: label, + description: shippingMethod.carrier_title + }; + }); + const paymentDataRequestUpdate = { newShippingOptionParameters: { defaultSelectedOptionId: selectedShipping.method_code, @@ -301,9 +314,9 @@ define([ status: 'FINAL' } ], - currencyCode: totals.base_currency_code, + currencyCode: totals.quote_currency_code, totalPriceStatus: 'FINAL', - totalPrice: totals.base_grand_total.toString(), + totalPrice: totals.grand_total.toString(), totalPriceLabel: 'Total', countryCode: configModel().getConfig().countryCode } diff --git a/view/frontend/web/js/helpers/formatCurrency.js b/view/frontend/web/js/helpers/formatCurrency.js index 46b701e..a033fd2 100644 --- a/view/frontend/web/js/helpers/formatCurrency.js +++ b/view/frontend/web/js/helpers/formatCurrency.js @@ -1,12 +1,12 @@ define(['Adyen_ExpressCheckout/js/model/config'], function (configModel) { 'use strict'; - return function (amount) { + return function (amount, currency) { const config = configModel().getConfig(); const locale = config.locale.replace('_', '-'); const options = { style: 'currency', - currency: config.currency + currency: currency }; return new Intl.NumberFormat(locale, options).format(amount); diff --git a/view/frontend/web/js/model/currency.js b/view/frontend/web/js/model/currency.js new file mode 100644 index 0000000..f97a1ef --- /dev/null +++ b/view/frontend/web/js/model/currency.js @@ -0,0 +1,19 @@ +define([ + 'uiComponent', + 'ko' +], function (Component, ko) { + 'use strict'; + return Component.extend({ + defaults: { + currency: ko.observable(0).extend({notify: 'always'}) + }, + + getCurrency: function () { + return this.currency(); + }, + + setCurrency: function (currency) { + return this.currency(currency); + } + }); +});