Skip to content

Commit ea92309

Browse files
krissyhiserotekrissyhiserote
committed
MC-42209: Pay Later message amount change does not work on Grouped Product page
1 parent 45a40fd commit ea92309

File tree

2 files changed

+185
-0
lines changed

2 files changed

+185
-0
lines changed

‎app/code/Magento/Paypal/view/frontend/layout/catalog_product_view_type_grouped.xml

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<?xml version="1.0"?>
2+
<!--
3+
/**
4+
* Copyright © Magento, Inc. All rights reserved.
5+
* See COPYING.txt for license details.
6+
*/
7+
-->
8+
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
9+
<body>
10+
<referenceContainer name="top.container">
11+
<block class="Magento\Paypal\Block\PayLater\Banner" name="top.container.paylater"
12+
template="Magento_Paypal::paylater/banner.phtml">
13+
<arguments>
14+
<argument name="placement" xsi:type="string">product</argument>
15+
<argument name="position" xsi:type="string">header</argument>
16+
<argument name="jsLayout" xsi:type="array">
17+
<item name="components" xsi:type="array">
18+
<item name="payLater" xsi:type="array">
19+
<item name="config" xsi:type="array">
20+
<item name="displayAmount" xsi:type="boolean">true</item>
21+
<item name="amountComponentConfig" xsi:type="array">
22+
<item name="component" xsi:type="string">
23+
Magento_Paypal/js/view/amountProviders/product-grouped
24+
</item>
25+
</item>
26+
</item>
27+
</item>
28+
</item>
29+
</argument>
30+
</arguments>
31+
</block>
32+
</referenceContainer>
33+
<referenceContainer name="product.info.addtocart">
34+
<block class="Magento\Paypal\Block\PayLater\Banner" name="product.info.addtocart.paylater"
35+
template="Magento_Paypal::paylater/banner.phtml">
36+
<arguments>
37+
<argument name="placement" xsi:type="string">product</argument>
38+
<argument name="position" xsi:type="string">near_pp_button</argument>
39+
<argument name="jsLayout" xsi:type="array">
40+
<item name="components" xsi:type="array">
41+
<item name="payLater" xsi:type="array">
42+
<item name="config" xsi:type="array">
43+
<item name="displayAmount" xsi:type="boolean">true</item>
44+
<item name="amountComponentConfig" xsi:type="array">
45+
<item name="component" xsi:type="string">
46+
Magento_Paypal/js/view/amountProviders/product-grouped
47+
</item>
48+
</item>
49+
</item>
50+
</item>
51+
</item>
52+
</argument>
53+
</arguments>
54+
</block>
55+
</referenceContainer>
56+
<referenceBlock name="product.info.addtocart.additional">
57+
<block class="Magento\Paypal\Block\PayLater\Banner" name="product.info.addtocart.additional.paylater"
58+
template="Magento_Paypal::paylater/banner.phtml">
59+
<arguments>
60+
<argument name="placement" xsi:type="string">product</argument>
61+
<argument name="position" xsi:type="string">near_pp_button</argument>
62+
<argument name="jsLayout" xsi:type="array">
63+
<item name="components" xsi:type="array">
64+
<item name="payLater" xsi:type="array">
65+
<item name="config" xsi:type="array">
66+
<item name="displayAmount" xsi:type="boolean">true</item>
67+
<item name="amountComponentConfig" xsi:type="array">
68+
<item name="component" xsi:type="string">
69+
Magento_Paypal/js/view/amountProviders/product-grouped
70+
</item>
71+
</item>
72+
</item>
73+
</item>
74+
</item>
75+
</argument>
76+
</arguments>
77+
</block>
78+
</referenceBlock>
79+
</body>
80+
</page>

‎app/code/Magento/Paypal/view/frontend/web/js/view/amountProviders/product-grouped.js

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
/**
2+
* Copyright © Magento, Inc. All rights reserved.
3+
* See COPYING.txt for license details.
4+
*/
5+
6+
define([
7+
'jquery',
8+
'uiElement',
9+
'uiRegistry',
10+
'domReady!'
11+
], function (
12+
$,
13+
Component,
14+
registry
15+
) {
16+
'use strict';
17+
18+
return Component.extend({
19+
20+
defaults: {
21+
tableWrapperSelector: '.table-wrapper.grouped',
22+
priceBoxSelector: '[data-role="priceBox"]',
23+
qtyFieldSelector: '.input-text.qty',
24+
amount: null
25+
},
26+
priceInfo: {},
27+
28+
/**
29+
* Initialize
30+
*
31+
* @returns {*}
32+
*/
33+
initialize: function () {
34+
var self = this;
35+
36+
this._super();
37+
38+
$('tbody tr', this.tableWrapperSelector).each(function (index, element) {
39+
var priceBox = $(self.priceBoxSelector, element),
40+
qtyElement = $(self.qtyFieldSelector, element),
41+
productId = priceBox.data('productId'),
42+
priceElement = $('#product-price-' + productId);
43+
44+
self.priceInfo[productId] = {
45+
qty: self._getQty(qtyElement),
46+
price: priceElement.data('priceAmount')
47+
};
48+
});
49+
50+
$(this.qtyFieldSelector).on('change', this._onQtyChange.bind(this));
51+
52+
this._updateAmount();
53+
54+
return this;
55+
},
56+
57+
/**
58+
* Get product quantity
59+
*
60+
* @param {jQuery.Element} element
61+
* @private
62+
*/
63+
_getQty: function (element) {
64+
var qty = parseFloat(element.val());
65+
66+
return !isNaN(qty) && qty ? qty : 0;
67+
},
68+
69+
/**
70+
* Handle changed product quantity
71+
*
72+
* @param {jQuery.Event} event
73+
* @private
74+
*/
75+
_onQtyChange: function (event) {
76+
var qtyElement = $(event.target),
77+
parent = qtyElement.parents('tr'),
78+
priceBox = $(this.priceBoxSelector, parent),
79+
productId = priceBox.data('productId');
80+
81+
if (this.priceInfo[productId]) {
82+
this.priceInfo[productId].qty = this._getQty(qtyElement);
83+
}
84+
85+
this._updateAmount();
86+
},
87+
88+
/**
89+
* Calculate and update amount
90+
*
91+
* @private
92+
*/
93+
_updateAmount: function () {
94+
var productId,
95+
amount = 0,
96+
payLater = registry.get(this.parentName);
97+
98+
for (productId in this.priceInfo) {
99+
amount += this.priceInfo[productId].price * this.priceInfo[productId].qty;
100+
}
101+
102+
payLater.amount(amount);
103+
}
104+
});
105+
});

0 commit comments

Comments
 (0)