Skip to content

Commit 7b7072a

Browse files
fascinosumfascinosum
committed
MC-41704: PP PayLater for Checkout Page
-- fix merge conflicts
1 parent 72f58b8 commit 7b7072a

File tree

7 files changed

+164
-13
lines changed

7 files changed

+164
-13
lines changed

‎app/code/Magento/Paypal/Block/PayLater/Banner.php

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,8 @@ protected function _toHtml(): string
7575
*/
7676
public function getJsLayout()
7777
{
78-
$jsComponent = $this->jsLayout['components']['payLater']['component'] ?? 'Magento_Paypal/js/view/paylater';
78+
$jsComponent = $this->jsLayout['components']['payLater']['component']
79+
?? 'Magento_Paypal/js/view/paylater-default';
7980

8081
//Extend block component config with defaults
8182
$componentConfig = $this->jsLayout['components']['payLater']['config'] ?? [];
@@ -86,6 +87,7 @@ public function getJsLayout()
8687
$componentAttributes = $this->jsLayout['components']['payLater']['config']['attributes'] ?? [];
8788
$config['attributes'] = array_replace($this->getStyleAttributesConfig(), $componentAttributes);
8889
$config['attributes']['data-pp-placement'] = $this->placement;
90+
$config['sdkUrl'] = $this->getPayPalSdkUrl();
8991

9092
$this->jsLayout = [
9193
'components' => [

‎app/code/Magento/Paypal/Model/PayLaterConfig.php

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,11 @@ class PayLaterConfig
2424
*/
2525
const CONFIG_KEY_POSITION = 'position';
2626

27+
/**
28+
* Checkout payment step placement
29+
*/
30+
const CHECKOUT_PAYMENT_PLACEMENT = 'checkout_payment';
31+
2732
/**
2833
* @var Config
2934
*/
@@ -95,30 +100,33 @@ private function isPPCreditEnabled()
95100
public function getSectionConfig(string $section, string $key)
96101
{
97102
if (!array_key_exists($section, $this->configData)) {
103+
$sectionName = $section === self::CHECKOUT_PAYMENT_PLACEMENT
104+
? self::CHECKOUT_PAYMENT_PLACEMENT : "${section}page";
105+
98106
$this->configData[$section] = [
99-
'display' => (boolean)$this->config->getPayLaterConfigValue("${section}page_display"),
100-
'position' => $this->config->getPayLaterConfigValue("${section}page_position"),
107+
'display' => (boolean)$this->config->getPayLaterConfigValue("${sectionName}_display"),
108+
'position' => $this->config->getPayLaterConfigValue("${sectionName}_position"),
101109
'style' => [
102110
'data-pp-style-layout' => $this->config->getPayLaterConfigValue(
103-
"${section}page_stylelayout"
111+
"${sectionName}_stylelayout"
104112
),
105113
'data-pp-style-logo-type' => $this->config->getPayLaterConfigValue(
106-
"${section}page_logotype"
114+
"${sectionName}_logotype"
107115
),
108116
'data-pp-style-logo-position' => $this->config->getPayLaterConfigValue(
109-
"${section}page_logoposition"
117+
"${sectionName}_logoposition"
110118
),
111119
'data-pp-style-text-color' => $this->config->getPayLaterConfigValue(
112-
"${section}page_textcolor"
120+
"${sectionName}_textcolor"
113121
),
114122
'data-pp-style-text-size' => $this->config->getPayLaterConfigValue(
115-
"${section}page_textsize"
123+
"${sectionName}_textsize"
116124
),
117125
'data-pp-style-color' => $this->config->getPayLaterConfigValue(
118-
"${section}page_color"
126+
"${sectionName}_color"
119127
),
120128
'data-pp-style-ratio' => $this->config->getPayLaterConfigValue(
121-
"${section}page_ratio"
129+
"${sectionName}_ratio"
122130
)
123131
]
124132
];

‎app/code/Magento/Paypal/Model/System/Config/Source/PayLater/Position.php

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,4 +37,16 @@ public function getPositionsHP(): array
3737
'sidebar' => __('Sidebar')
3838
];
3939
}
40+
41+
/**
42+
* PayLater positions source getter for Checkout Page
43+
*
44+
* @return array
45+
*/
46+
public function getPositionsCheckout(): array
47+
{
48+
return [
49+
'near_pp_button' => __('Near PayPal Credit checkout button')
50+
];
51+
}
4052
}

‎app/code/Magento/Paypal/etc/config.xml

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -202,6 +202,13 @@
202202
<homepage_stylelayout>flex</homepage_stylelayout>
203203
<homepage_ratio>1x1</homepage_ratio>
204204
<homepage_color>blue</homepage_color>
205+
<checkout_payment_display>0</checkout_payment_display>
206+
<checkout_payment_position>header</checkout_payment_position>
207+
<checkout_payment_stylelayout>text</checkout_payment_stylelayout>
208+
<checkout_payment_logotype>primary</checkout_payment_logotype>
209+
<checkout_payment_logoposition>left</checkout_payment_logoposition>
210+
<checkout_payment_textcolor>black</checkout_payment_textcolor>
211+
<checkout_payment_textsize>12</checkout_payment_textsize>
205212
</paypal_paylater>
206213
</payment>
207214
</default>

‎app/code/Magento/Paypal/i18n/en_US.csv

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -764,3 +764,4 @@ User,User
764764
"Monochrome","Monochrome"
765765
"Grayscale","Grayscale"
766766
"Sidebar","Sidebar"
767+
"Checkout Payment Step","Checkout Payment Step"

‎app/code/Magento/Paypal/view/frontend/web/js/view/paylater-default.js

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ define([
2626
amount: ko.observable(),
2727
style: '',
2828
},
29+
paypal: null,
2930

3031
/**
3132
* Initialize
@@ -36,7 +37,8 @@ define([
3637
this._super();
3738

3839
if ( this.sdkUrl !== '') {
39-
this.loadPayPalSdk(this.sdkUrl);
40+
this.loadPayPalSdk(this.sdkUrl)
41+
.then(this._setPayPalObject.bind(this));
4042
}
4143

4244
return this;
@@ -59,7 +61,17 @@ define([
5961
* @param {String} sdkUrl
6062
*/
6163
loadPayPalSdk: function (sdkUrl) {
62-
paypalSdk(sdkUrl);
63-
}
64+
return paypalSdk(sdkUrl);
65+
},
66+
67+
/**
68+
* Set reference to paypal Sdk object
69+
*
70+
* @param {Object} paypal
71+
* @private
72+
*/
73+
_setPayPalObject: function (paypal) {
74+
this.paypal = paypal;
75+
},
6476
});
6577
});

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

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
/**
2+
* Copyright © Magento, Inc. All rights reserved.
3+
* See COPYING.txt for license details.
4+
*/
5+
6+
define([
7+
'jquery',
8+
'ko',
9+
'Magento_Paypal/js/view/paylater-default',
10+
'priceBox',
11+
'domReady!'
12+
], function (
13+
$,
14+
ko,
15+
Component,
16+
) {
17+
'use strict';
18+
19+
return Component.extend({
20+
21+
defaults: {
22+
priceBoxSelector: '.price-box',
23+
qtyFieldSelector: '#product_addtocart_form [name="qty"]',
24+
refreshSelector: ''
25+
},
26+
qty: 1,
27+
price: 0,
28+
29+
/**
30+
* Initialize
31+
*
32+
* @returns {*}
33+
*/
34+
initialize: function () {
35+
var priceBox;
36+
37+
this._super();
38+
39+
priceBox = $(this.priceBoxSelector);
40+
priceBox.on('priceUpdated', this._onPriceChange.bind(this));
41+
42+
if (priceBox.priceBox('option') &&
43+
priceBox.priceBox('option').prices &&
44+
priceBox.priceBox('option').prices.finalPrice
45+
) {
46+
this.price = priceBox.priceBox('option').prices.finalPrice.amount;
47+
}
48+
49+
$(this.qtyFieldSelector).on('change', this._onQtyChange.bind(this));
50+
51+
if (this.refreshSelector) {
52+
$(this.refreshSelector).on('click', this._refreshMessages.bind(this));
53+
}
54+
55+
this._updateAmount();
56+
57+
return this;
58+
},
59+
60+
/**
61+
* Handle changed product qty
62+
*
63+
* @param {jQuery.Event} event
64+
* @private
65+
*/
66+
_onQtyChange: function (event) {
67+
var qty = parseFloat($(event.target).val());
68+
69+
this.qty = !isNaN(qty) && qty ? qty : 1;
70+
this._updateAmount();
71+
},
72+
73+
/**
74+
* Handle product price change
75+
*
76+
* @param {jQuery.Event} event
77+
* @param {Object} data
78+
* @private
79+
*/
80+
_onPriceChange: function (event, data) {
81+
this.price = data.finalPrice.amount;
82+
this._updateAmount();
83+
},
84+
85+
/**
86+
* Calculate and update amount
87+
*
88+
* @private
89+
*/
90+
_updateAmount: function () {
91+
var amount = this.price * this.qty;
92+
93+
if (amount !== 0) {
94+
this.amount(amount);
95+
}
96+
},
97+
98+
/**
99+
* Render messages
100+
*
101+
* @private
102+
*/
103+
_refreshMessages: function () {
104+
if (this.paypal) {
105+
this.paypal.Messages.render();
106+
}
107+
}
108+
});
109+
});

0 commit comments

Comments
 (0)