diff --git a/CHANGELOG.md b/CHANGELOG.md index c10520ed..d7bc25d0 100755 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,17 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [3.17.0] - 2022-07-04 + +### Added +- Support to Magento 2.4.4 with PHP 8.1 +- Default success page of Magento support a Pix payment information + +### Fixed +- Reload credit/debit card base amount on updated cart with coupon +- Document input accept correct characters +- Not sent sponsor id in header request + ## [3.16.0] - 2022-05-05 ### Added diff --git a/README.md b/README.md index 52de1012..57038807 100755 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@

-# Magento 2 - Mercado Pago Module (v3.16.0) +# Magento 2 - Mercado Pago Module (v3.17.0) The Mercado Pago plugin for Magento 2 allows you to expand the functionalities of your online store and offer a unique payment experience for your customers. diff --git a/composer.json b/composer.json index ec8381ca..cbeb4329 100755 --- a/composer.json +++ b/composer.json @@ -8,7 +8,7 @@ } ], "type": "magento2-module", - "version": "3.16.0", + "version": "3.17.0", "license": [ "OSL-3.0", "AFL-3.0" @@ -28,6 +28,7 @@ ] }, "require": { - "ext-json": "*" + "ext-json": "*", + "ext-mbstring": "*" } } diff --git a/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Button.php b/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Button.php index 5c07498d..bf056019 100644 --- a/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Button.php +++ b/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Button.php @@ -74,13 +74,13 @@ public function render(AbstractElement $element) { $element->unsScope()->unsCanUseWebsiteValue()->unsCanUseDefaultValue(); - $siteId = strtoupper( - $this->scopeConfig->getValue( - ConfigData::PATH_SITE_ID, - ScopeInterface::SCOPE_STORE - ) + $getSiteId = $this->scopeConfig->getValue( + ConfigData::PATH_SITE_ID, + ScopeInterface::SCOPE_STORE ); + $siteId = is_string($getSiteId) ? mb_strtoupper($getSiteId) : ''; + if ($this->hideInterestPayment($siteId, $element->getOriginalData())) { return ""; } @@ -136,9 +136,11 @@ public static function changeUrlByCountry() { $objectManager = ObjectManager::getInstance(); - $siteId = strtoupper( - $objectManager->get('Magento\Framework\App\Config\ScopeConfigInterface')->getValue(ConfigData::PATH_SITE_ID) - ); + $getSiteId = $objectManager + ->get('Magento\Framework\App\Config\ScopeConfigInterface') + ->getValue(ConfigData::PATH_SITE_ID); + + $siteId = is_string($getSiteId) ? mb_strtoupper($getSiteId) : ''; $country = Country::getCountryToMp($siteId); diff --git a/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Note.php b/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Note.php index c7e973ae..19022a83 100644 --- a/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Note.php +++ b/src/MercadoPago/Core/Block/Adminhtml/System/Config/InterestPayment/Note.php @@ -52,13 +52,13 @@ public function __construct( */ public function render(AbstractElement $element) { - $siteId = strtoupper( - $this->scopeConfig->getValue( - ConfigData::PATH_SITE_ID, - ScopeInterface::SCOPE_STORE - ) + $getSiteId = $this->scopeConfig->getValue( + ConfigData::PATH_SITE_ID, + ScopeInterface::SCOPE_STORE ); + $siteId = is_string($getSiteId) ? mb_strtoupper($getSiteId) : ''; + if ($this->hideInterestPayment($siteId, $element->getOriginalData())) { return ""; } diff --git a/src/MercadoPago/Core/Helper/Data.php b/src/MercadoPago/Core/Helper/Data.php index 0e4f6ca8..5ab6a4b5 100644 --- a/src/MercadoPago/Core/Helper/Data.php +++ b/src/MercadoPago/Core/Helper/Data.php @@ -22,8 +22,6 @@ use MercadoPago\Core\Lib\Api; use MercadoPago\Core\Lib\RestClient; use MercadoPago\Core\Logger\Logger; -use MercadoPago\Core\Model\Custom\Payment; -use MercadoPago\Core\Helper\PaymentPlaces; /** * Class Data @@ -37,10 +35,12 @@ class Data extends \Magento\Payment\Helper\Data *api platform openplatform */ const PLATFORM_OPENPLATFORM = 'openplatform'; + /** *api platform stdplatform */ const PLATFORM_STD = 'std'; + /** *type */ @@ -50,6 +50,7 @@ class Data extends \Magento\Payment\Helper\Data * payment calculator */ const STATUS_ACTIVE = 'active'; + const PAYMENT_TYPE_CREDIT_CARD = 'credit_card'; /** @@ -83,6 +84,10 @@ class Data extends \Magento\Payment\Helper\Data * @var Switcher */ protected $_switcher; + + /** + * @var ComposerInformation + */ protected $_composerInformation; /** @@ -151,9 +156,8 @@ public function __construct( */ public function log($message, $name = "mercadopago", $array = null) { - //load admin configuration value, default is true $actionLog = $this->scopeConfig->getValue( - \MercadoPago\Core\Helper\ConfigData::PATH_ADVANCED_LOG, + ConfigData::PATH_ADVANCED_LOG, ScopeInterface::SCOPE_STORE ); @@ -166,7 +170,6 @@ public function log($message, $name = "mercadopago", $array = null) $message .= " - " . json_encode($array); } - //set log $this->_mpLogger->setName($name); $this->_mpLogger->debug($message); } @@ -182,7 +185,6 @@ public function getApiInstance($accessToken = null) throw new LocalizedException(__('The ACCESS_TOKEN has not been configured, without this credential the module will not work correctly.')); } - //$api = new Api($accessToken); $api = $this->_api; $api->set_access_token($accessToken); $api->set_platform(self::PLATFORM_OPENPLATFORM); @@ -192,9 +194,6 @@ public function getApiInstance($accessToken = null) RestClient::setUrlStore($this->getUrlStore()); RestClient::setEmailAdmin($this->scopeConfig->getValue('trans_email/ident_sales/email', ScopeInterface::SCOPE_STORE)); RestClient::setCountryInitial($this->getCountryInitial()); - RestClient::setSponsorID($this->scopeConfig->getValue('payment/mercadopago/sponsor_id', ScopeInterface::SCOPE_STORE)); - - //$api->set_so((string)$this->_moduleContext->getVersion()); //TODO tracking return $api; } @@ -202,7 +201,6 @@ public function getApiInstance($accessToken = null) /** * @param $accessToken * @return bool - * @throws LocalizedException */ public function isValidAccessToken($accessToken) { @@ -228,7 +226,7 @@ public function isValidAccessToken($accessToken) */ public function getAccessToken($scopeCode = ScopeInterface::SCOPE_STORE) { - $accessToken = $this->scopeConfig->getValue(\MercadoPago\Core\Helper\ConfigData::PATH_ACCESS_TOKEN, $scopeCode); + $accessToken = $this->scopeConfig->getValue(ConfigData::PATH_ACCESS_TOKEN, $scopeCode); if (empty($accessToken)) { return false; } @@ -272,11 +270,14 @@ public function setOrderSubtotals($data, $order) protected function _getMultiCardValue($data, $field) { $finalValue = 0; + if (!isset($data[$field])) { return $finalValue; } + $amountValues = explode('|', $data[$field]); $statusValues = explode('|', $data['status']); + foreach ($amountValues as $key => $value) { $value = (float)str_replace(' ', '', $value); if (str_replace(' ', '', $statusValues[$key]) === 'approved') { @@ -296,7 +297,6 @@ protected function _getMultiCardValue($data, $field) */ public function getMercadoPagoPaymentMethods($accessToken) { - $this->log('GET /v1/payment_methods', 'mercadopago'); try { @@ -304,13 +304,13 @@ public function getMercadoPagoPaymentMethods($accessToken) $payment_methods = $mp->get("/v1/payment_methods"); - $treated_payments_methods = []; + $treated_payments_methods = []; foreach ($payment_methods['response'] as $payment_method) { - if (!isset($payment_method['payment_places'])) { + if (is_array($payment_method) && isset($payment_method['id']) && !isset($payment_method['payment_places'])) { $payment_method['payment_places'] = PaymentPlaces::getPaymentPlaces($payment_method['id']); } - + array_push($treated_payments_methods, $payment_method); } @@ -413,9 +413,11 @@ public function getFingerPrintLink($localization) 'MPE' => 'https://www.mercadopago.com.pe/ayuda/terminos-y-politicas_194', 'MCO' => 'https://www.mercadopago.com.co/ayuda/terminos-y-politicas_194', ]; + if (array_key_exists($localization, $site_id)) { return $site_id[$localization]; } + return $site_id['MLA']; } } diff --git a/src/MercadoPago/Core/Lib/RestClient.php b/src/MercadoPago/Core/Lib/RestClient.php index 5ff20516..6605ae59 100644 --- a/src/MercadoPago/Core/Lib/RestClient.php +++ b/src/MercadoPago/Core/Lib/RestClient.php @@ -7,12 +7,11 @@ /** * MercadoPago cURL RestClient - * + * * @codeCoverageIgnore */ class RestClient { - /** * API URL */ @@ -68,7 +67,6 @@ private static function get_connect($uri, $method, $content_type, $extra_params return $connect; } - /** * @param $connect * @param $data @@ -187,7 +185,6 @@ public static function delete($uri, $content_type = "application/json", $extra_p return self::exec("DELETE", $uri, null, $content_type, $extra_params); } - /************** * * Error implementation tracking @@ -198,7 +195,6 @@ public static function delete($uri, $content_type = "application/json", $extra_p static $url_store = ""; static $email_admin = ""; static $country_initial = ""; - static $sponsor_id = ""; static $check_loop = 0; public static function getIntegratorID() @@ -207,11 +203,6 @@ public static function getIntegratorID() return $objectManager->get('Magento\Framework\App\Config\ScopeConfigInterface')->getValue(ConfigData::PATH_ADVANCED_INTEGRATOR); } - public static function setSponsorID($sponsor_id) - { - self::$sponsor_id = $sponsor_id; - } - public static function setModuleVersion($module_version) { self::$module_version = $module_version; diff --git a/src/MercadoPago/Core/Model/BasicConfigProvider.php b/src/MercadoPago/Core/Model/BasicConfigProvider.php index 82956ad8..3a6582ed 100644 --- a/src/MercadoPago/Core/Model/BasicConfigProvider.php +++ b/src/MercadoPago/Core/Model/BasicConfigProvider.php @@ -141,7 +141,7 @@ public function makeBannerCheckout() ScopeInterface::SCOPE_STORE ); - $excludePaymentMethods = explode(",", $excludePaymentMethods); + $excludePaymentMethods = is_string($excludePaymentMethods) ? explode(",", $excludePaymentMethods) : []; try { $debit = 0; diff --git a/src/MercadoPago/Core/Model/Core.php b/src/MercadoPago/Core/Model/Core.php index 49aef2d6..871176b4 100644 --- a/src/MercadoPago/Core/Model/Core.php +++ b/src/MercadoPago/Core/Model/Core.php @@ -35,7 +35,7 @@ * Class Core * * @package MercadoPago\Core\Model - * + * * @codeCoverageIgnore */ class Core extends \Magento\Payment\Model\Method\AbstractMethod @@ -397,17 +397,20 @@ public function getMessageByStatus($status, $status_detail) */ protected function getCustomerInfo($customer, $order) { - $email = htmlentities($customer->getEmail()); + $email = $customer->getEmail(); + $email = is_string($email) ? htmlentities($email) : ''; if ($email == "") { $email = $order['customer_email']; } - $first_name = htmlentities($customer->getFirstname()); + $first_name = $customer->getFirstname(); + $first_name = is_string($first_name) ? htmlentities($first_name) : ''; if ($first_name == "") { $first_name = $order->getBillingAddress()->getFirstname(); } - $last_name = htmlentities($customer->getLastname()); + $last_name = $customer->getLastname(); + $last_name = is_string($last_name) ? htmlentities($last_name) : ''; if ($last_name == "") { $last_name = $order->getBillingAddress()->getLastname(); } diff --git a/src/MercadoPago/Core/Model/CustomBankTransfer/Payment.php b/src/MercadoPago/Core/Model/CustomBankTransfer/Payment.php index 0543c3f3..275e4013 100644 --- a/src/MercadoPago/Core/Model/CustomBankTransfer/Payment.php +++ b/src/MercadoPago/Core/Model/CustomBankTransfer/Payment.php @@ -221,7 +221,7 @@ public function preparePostPayment($usingSecondCardInfo = null) public function getPaymentOptions() { $excludePaymentMethods = $this->_scopeConfig->getValue(\MercadoPago\Core\Helper\ConfigData::PATH_CUSTOM_EXCLUDE_PAYMENT_METHODS, \Magento\Store\Model\ScopeInterface::SCOPE_STORE); - $listExclude = explode(',', $excludePaymentMethods); + $listExclude = is_string($excludePaymentMethods) ? explode(',', $excludePaymentMethods) : []; $payment_methods = $this->_coreModel->getPaymentMethods(); $paymentOptions = []; diff --git a/src/MercadoPago/Core/Model/CustomTicket/Payment.php b/src/MercadoPago/Core/Model/CustomTicket/Payment.php index 36935975..8374b842 100644 --- a/src/MercadoPago/Core/Model/CustomTicket/Payment.php +++ b/src/MercadoPago/Core/Model/CustomTicket/Payment.php @@ -203,7 +203,7 @@ public function preparePostPayment($usingSecondCardInfo = null) public function getTicketsOptions() { $excludePaymentMethods = $this->_scopeConfig->getValue(\MercadoPago\Core\Helper\ConfigData::PATH_CUSTOM_EXCLUDE_PAYMENT_METHODS, \Magento\Store\Model\ScopeInterface::SCOPE_STORE); - $listExclude = explode(",", $excludePaymentMethods); + $listExclude = is_string($excludePaymentMethods) ? explode(",", $excludePaymentMethods) : []; $payment_methods = $this->_coreModel->getPaymentMethods(); $tickets = []; diff --git a/src/MercadoPago/Core/Model/Preference/Basic.php b/src/MercadoPago/Core/Model/Preference/Basic.php index 555e38bc..eff3b972 100644 --- a/src/MercadoPago/Core/Model/Preference/Basic.php +++ b/src/MercadoPago/Core/Model/Preference/Basic.php @@ -303,7 +303,7 @@ protected function getExcludedPaymentsMethods($config) { $excludedMethods = []; $excluded_payment_methods = $config['exclude_payment_methods']; - $arr_epm = explode(",", $excluded_payment_methods); + $arr_epm = is_string($excluded_payment_methods) ? explode(",", $excluded_payment_methods) : []; if (count($arr_epm) > 0) { foreach ($arr_epm as $m) { diff --git a/src/MercadoPago/Core/Model/Preference/Wallet.php b/src/MercadoPago/Core/Model/Preference/Wallet.php index b1b0dd9a..c0716dff 100644 --- a/src/MercadoPago/Core/Model/Preference/Wallet.php +++ b/src/MercadoPago/Core/Model/Preference/Wallet.php @@ -429,12 +429,11 @@ protected function getPreference() protected function getExcludedPaymentMethods() { $excluded = []; - $configExcludedPaymentMethods = explode( - ',', - $this->getConfig(ConfigData::PATH_CUSTOM_EXCLUDE_PAYMENT_METHODS) - ); + $configExcludedPaymentMethods = $this->getConfig(ConfigData::PATH_CUSTOM_EXCLUDE_PAYMENT_METHODS); + $excludedPaymentMethods = is_string($configExcludedPaymentMethods) ? + explode(',', $configExcludedPaymentMethods) : []; - foreach ($configExcludedPaymentMethods as $paymentMethod) { + foreach ($excludedPaymentMethods as $paymentMethod) { $excluded[] = ['id' => $paymentMethod]; } diff --git a/src/MercadoPago/Core/composer.json b/src/MercadoPago/Core/composer.json index cfe98c65..01f50232 100644 --- a/src/MercadoPago/Core/composer.json +++ b/src/MercadoPago/Core/composer.json @@ -2,7 +2,7 @@ "name": "mercadopago/core", "description": "Mercado Pago Magento 2 Plugin", "type": "magento2-module", - "version": "3.16.0", + "version": "3.17.0", "license": [ "OSL-3.0", "AFL-3.0" diff --git a/src/MercadoPago/Core/etc/module.xml b/src/MercadoPago/Core/etc/module.xml index be9fb608..3924443c 100644 --- a/src/MercadoPago/Core/etc/module.xml +++ b/src/MercadoPago/Core/etc/module.xml @@ -1,6 +1,6 @@ - + diff --git a/src/MercadoPago/Core/view/frontend/requirejs-config.js b/src/MercadoPago/Core/view/frontend/requirejs-config.js index 044a4b5d..23c5b0ec 100644 --- a/src/MercadoPago/Core/view/frontend/requirejs-config.js +++ b/src/MercadoPago/Core/view/frontend/requirejs-config.js @@ -3,12 +3,19 @@ * @type {{ map: { "*": { Masks: string, CreditCard: string, Ticket: string, MPv2SDKJS: string } } }} */ let config = { - map: { - '*': { - Masks: 'MercadoPago_Core/js/Masks', - Ticket: 'MercadoPago_Core/js/Ticket', - CreditCard: 'MercadoPago_Core/js/CreditCard', - MPv2SDKJS: 'https://sdk.mercadopago.com/js/v2' - } + map: { + '*': { + Masks: 'MercadoPago_Core/js/Masks', + Ticket: 'MercadoPago_Core/js/Ticket', + CreditCard: 'MercadoPago_Core/js/CreditCard', + MPv2SDKJS: 'https://sdk.mercadopago.com/js/v2', } + }, + config: { + mixins: { + 'Magento_SalesRule/js/view/payment/discount': { + 'MercadoPago_Core/js/UpdateCardForm': true + } + } + } }; diff --git a/src/MercadoPago/Core/view/frontend/templates/custom_pix/success.phtml b/src/MercadoPago/Core/view/frontend/templates/custom_pix/success.phtml index b3e58cf9..0e0226a0 100644 --- a/src/MercadoPago/Core/view/frontend/templates/custom_pix/success.phtml +++ b/src/MercadoPago/Core/view/frontend/templates/custom_pix/success.phtml @@ -56,42 +56,74 @@ $link_to_order = '' . -
-

- - - - - - -

-

- -

- - - -

- -

-
-

- -

-
- - - +
+
+
+
+

Quase lá! Pague via Pix para concluir sua compra

+
+
+
+
+
Valor:
+
R$ 
+
+
+
+
+
Vencimento:
+
+
+
+
+
+
+
+

Escaneie este código QR para pagar

+
+ Important + + Antes de confirmar a compra, você verá o valor a pagar e as informações do vendedor. + +
+
+

1. Acesse o seu banco ou aplicativo de pagamentos

+

2. Escolha pagar via Pix com código QR

+

3. Escaneie o seguinte código

+
+
+ + + +
+
+
+
+
+

Ou pague com o código Pix Copia e Cola

+

Acesse o seu banco ou aplicativo de pagamentos e escolha pagar via Pix. Em seguida, cole o seguinte código de pagamento:

+
+
+ + + + +
+
+ + +
+
-
+
diff --git a/src/MercadoPago/Core/view/frontend/web/css/style-success.css b/src/MercadoPago/Core/view/frontend/web/css/style-success.css index f6dd6c95..3d232156 100644 --- a/src/MercadoPago/Core/view/frontend/web/css/style-success.css +++ b/src/MercadoPago/Core/view/frontend/web/css/style-success.css @@ -1,426 +1,702 @@ /* Styles for success page */ .checkout-success #box-mercadopago { - width: 50%; - flex: none; -} -.checkout-success .mp-col-md-4 { - flex: none; - width: 100%; -} - -.checkout-success .mp-col-md-8 { - flex: none; - width: 100%; -} - -.checkout-success .mp-pix-right { - border-right: none; - border-top: solid 1px #e5e5e5; - margin-bottom: 32px; -} - -.checkout-success .mp-qr-code { - width: 100%; - margin: 0 0 24px 0; -} - -.checkout-success .mp-details-pix-button { - width: 100%; - display: inline-block; -} - -.checkout-success .mp-row-checkout-pix-container { - display: block; -} - -.checkout-success .mp-details-pix-img { - padding: 0; - margin: 64px auto 0; -} - -.checkout-success .mp-details-pix-title { - margin: 40px auto 0; - text-align: center; - padding: 0; -} - -.checkout-success .mp-qr-input { - height: 38px; - width: 95%; - margin-bottom: 24px; - padding: 6.3px 0 5.7px 12px; -} - -#box-mercadopago, #logo-mercadopago { - padding: 0; - text-align: left; -} - -#box-mercadopago>p { - text-transform: unset; - line-height: normal; -} - -#box-mercadopago { - margin-top: 20px; -} - -.mercadopago-title { - margin: 0 0 10px 0; - font-weight: bold; -} - -.mercadopago-title-info-payment { - margin: 20px 0 10px 0; - text-transform: uppercase; -} - -#btn-boleto-mercadopago { - font-size: 1.25em; - text-align: center; - line-height: 1.25em; - padding: 6px 12px; - font-family: 'Lato', sans-serif; - font-weight: 400; - background-color: #36A1F1; - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36A1F1), color-stop(100%, #0F79C9)); - background-image: -webkit-linear-gradient(#36A1F1, #0F79C9); - background-image: -moz-linear-gradient(#36A1F1, #0F79C9); - background-image: -o-linear-gradient(#36A1F1, #0F79C9); - background-image: linear-gradient(#36A1F1, #0F79C9); - -webkit-box-shadow: inset 0 1px #97DCFF; - box-shadow: 0 1px #97DCFF inset; - color: #FFF !important; - border: 1px solid #0D6FB9; - border-radius: 4px 4px 4px 4px; - cursor: pointer; - display: inline-block; - text-decoration: none; -} - -#btn-boleto-mercadopago:hover { - background-color: #4CBFF8; - background-image: linear-gradient(#4CBFF8, #1699DF); - box-shadow: 0 1px #B6EBFF inset; - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4CBFF8), color-stop(100%, #1699DF)); - background-image: -webkit-linear-gradient(#4CBFF8, #1699DF); - background-image: -moz-linear-gradient(#4CBFF8, #1699DF); - background-image: -o-linear-gradient(#4CBFF8, #1699DF); - background-image: linear-gradient(#4CBFF8, #1699DF); - -webkit-box-shadow: inset 0 1px #B6EBFF; - border: 1px solid #1890D3; - color: #FFF; - text-decoration: none; -} - -#logo-mercadopago { - margin: 20px 0; - width: 100px; - /*float: left;*/ -} - -#logo-mercadopago img { - /* float: left;*/ - width: 100%; -} - -.checkout-success .button-success { - display: none; -} - -.button-success { - text-align: left; - margin: 20px 0 20px 0; -} - -.mp-details-title { + width: 50%; + flex: none; + } + .checkout-success .mp-col-md-4 { + flex: none; width: 100%; - margin: 32px 358px 32px 0px; - font-family: sans-serif; - font-size: 28px; - font-weight: normal; - font-stretch: normal; - font-style: normal; - line-height: normal; - letter-spacing: normal; - color: #333333; -} - -.mp-details-pix { + } + + .checkout-success .mp-col-md-8 { + flex: none; width: 100%; - height: auto; - display: inline-block; - border-radius: 6px; - box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.1); - background-color: #ffffff; - margin-bottom: 30px; -} - -.mp-details-pix-title { - width:100%; - opacity: 0.8; - font-family: sans-serif; - font-size: 18px; - font-weight: bold; - font-stretch: normal; - font-style: normal; - line-height: 1.67; - letter-spacing: normal; - color: rgba(0, 0, 0, 0.8); + } + + .checkout-success .mp-pix-right { + border-right: none; + border-top: solid 1px #e5e5e5; + margin-bottom: 32px; + } + + .checkout-success .mp-qr-code { + width: 100%; + margin: 0 0 0 0; + } + + .checkout-success .mp-details-pix-button { + width: 100%; + display: inline-block; + } + + .checkout-success .mp-row-checkout-pix-container { display: block; - margin: 40px 0 0 0; - padding: 0 0 0 32px; -} - -.mp-pix-left { - padding: 0 0 0 32px; -} - -.mp-details-list { - display: flex; - margin-bottom: 28px; -} - -.mp-details-pix-number-p { - border-radius: 100%; - width: 26px; - height: 24px; - padding: 2px 0 0 0; - border: solid 1px #009ee3; - color: #009ee3; + } + + .checkout-success .mp-details-pix-img { + padding: 0; + margin: 64px auto 0; + } + + .checkout-success .mp-details-pix-title { + margin: 40px auto 0; text-align: center; - font-size: 16px; - margin: 0 13px 0 0; - font-family: sans-serif; -} - -.mp-details-list-description { - padding-top: 4px; - font-family: sans-serif; - font-size: 16px; - font-weight: normal; - font-stretch: normal; - font-style: normal; + padding: 0; + } + + .checkout-success .mp-qr-input { + height: 38px; + width: 95%; + margin-bottom: 24px; + padding: 6.3px 0 5.7px 12px; + } + + #box-mercadopago, #logo-mercadopago { + padding: 0; + text-align: left; + } + + #box-mercadopago>p { + text-transform: unset; line-height: normal; - letter-spacing: normal; - color: rgba(0, 0, 0, 0.8); - display: block; - width: 70%; -} - -.mp-col-md-4 { - flex: 0 0 33.333333%; - width: 33.333333%; - float: left; -} - -.mp-col-md-8 { - flex: 0 0 66.666667%; - width: 65.666667%; - float: left; -} - -.mp-text-center { - text-align: center !important; -} - -.mp-pix-right { - border-left: solid 1px #e5e5e5; -} - -.mp-details-pix-amount { - margin: 32px auto 0; - text-align: center; - width: 100%; - color: rgba(0, 0, 0, 0.8); - font-size: 18px; - font-family: sans-serif; -} - -.mp-steps-congrats { - margin: 24px 0 16px 0 !important; - list-style-type: none; -} - - - -.mp-details-pix-qr { - padding: 0 4px 0 0; -} - -.mp-details-pix-qr-value { - font-weight: bold; - -} - -.mp-details-pix-qr-title { - margin: 24px 0 0 0; - font-family: sans-serif; - font-size: 16px; - font-weight: bold; - font-stretch: normal; - font-style: normal; - line-height: 1.88; - letter-spacing: normal; - text-align: center; - color: rgba(0, 0, 0, 0.8); -} - -.mp-details-pix-qr-value { - font-weight: bold; -} - -.mp-details-pix-qr-title { - margin: 24px 0 0 0; - font-family: sans-serif; - font-size: 16px; + } + + #box-mercadopago { + margin-top: 20px; + } + + .mercadopago-title { + margin: 0 0 10px 0; font-weight: bold; - font-stretch: normal; - font-style: normal; - line-height: 1.88; - letter-spacing: normal; - text-align: center; - color: rgba(0, 0, 0, 0.8); -} - -.mp-details-pix-qr-img { - width: 168px; - height: 168px; - display: block; - margin: 16px auto 0 auto; -} - -.mp-details-pix-img { - width: 190px; - height: 56px; - object-fit: contain; - display: block; - margin: 64px 0 0 0; - padding: 0 0 0 32px; -} - -.mp-details-pix-qr-subtitle { - margin: 12px 0 32px 0; - font-family: sans-serif; - font-size: 14px; - font-weight: normal; - font-stretch: normal; - font-style: normal; - line-height: 1.29; - letter-spacing: normal; - text-align: center; - color: rgba(0, 0, 0, 0.45); -} - -.mp-details-pix-qr-description { - margin: 32px 15px 16px 16px; - font-family: sans-serif; - font-size: 16px; - font-weight: normal; - font-stretch: normal; - font-style: normal; - line-height: 1.25; - letter-spacing: normal; + } + + .mercadopago-title-info-payment { + margin: 20px 0 10px 0; + text-transform: uppercase; + } + + #btn-boleto-mercadopago { + font-size: 1.25em; text-align: center; - color: rgba(0, 0, 0, 0.8); -} - -.mp-row-checkout-pix { + line-height: 1.25em; + padding: 6px 12px; + font-family: 'Lato', sans-serif; + font-weight: 400; + background-color: #36A1F1; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #36A1F1), color-stop(100%, #0F79C9)); + background-image: -webkit-linear-gradient(#36A1F1, #0F79C9); + background-image: -moz-linear-gradient(#36A1F1, #0F79C9); + background-image: -o-linear-gradient(#36A1F1, #0F79C9); + background-image: linear-gradient(#36A1F1, #0F79C9); + -webkit-box-shadow: inset 0 1px #97DCFF; + box-shadow: 0 1px #97DCFF inset; + color: #FFF !important; + border: 1px solid #0D6FB9; + border-radius: 4px 4px 4px 4px; + cursor: pointer; + display: inline-block; + text-decoration: none; + } + + #btn-boleto-mercadopago:hover { + background-color: #4CBFF8; + background-image: linear-gradient(#4CBFF8, #1699DF); + box-shadow: 0 1px #B6EBFF inset; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4CBFF8), color-stop(100%, #1699DF)); + background-image: -webkit-linear-gradient(#4CBFF8, #1699DF); + background-image: -moz-linear-gradient(#4CBFF8, #1699DF); + background-image: -o-linear-gradient(#4CBFF8, #1699DF); + background-image: linear-gradient(#4CBFF8, #1699DF); + -webkit-box-shadow: inset 0 1px #B6EBFF; + border: 1px solid #1890D3; + color: #FFF; + text-decoration: none; + } + + #logo-mercadopago { + margin: 20px 0; + width: 100px; + /*float: left;*/ + } + + #logo-mercadopago img { + /* float: left;*/ width: 100%; -} - -.mp-row-checkout-pix-container { - display: flex; - padding: 16px 47px 48px 47px; -} - -.mp-qr-input { - width: 70%; - padding: 6.3px 0 5.7px 12px; - border-radius: 6px; - border: solid 1px rgba(0, 0, 0, 0.2); - background-color: #ffffff; - margin: 0 12px 0 0; -} - -.mp-details-pix-button { - width: 30%; - height: 48px; - padding: 16px 24px; - border-radius: 6px; - box-shadow: none !important; - background-color: #009ee3; - border: 1px solid #009ee3 !important; - font-family: sans-serif; - font-size: 16px; - font-weight: 600; - font-stretch: normal; - font-style: normal; - line-height: 1; - letter-spacing: normal; - text-align: center; - color: #ffffff; -} - -.mp-details-pix-button:hover { - background: #006bb4; - border: 1px solid #006bb4; - color: #fff; -} - -@media (max-width: 767.98px) { - .checkout-success #box-mercadopago { - width: 100%; - flex: none; } - - .mp-col-md-4 { - width: 100%; - flex: none; - } - - .mp-col-md-8 { - width: 100%; - flex: none; - } - - .mp-pix-right { - border-right: none; - border-top: solid 1px #e5e5e5; - margin-bottom: 32px; - } - - .mp-qr-code { - width: 100%; - margin: 0 0 24px 0; - } - - .mp-details-pix-button { - width: 100%; - display: inline-block; - } - - .mp-row-checkout-pix-container { - display: block; - } - - .mp-details-pix-img { - margin: 64px auto 0; - padding: 0; - } - - .mp-details-pix-title { - margin: 40px auto 0; + + .checkout-success .button-success { + display: none; + } + + .button-success { + text-align: left; + margin: 20px 0 20px 0; + } + + .mp-details-title { + width: 100%; + margin: 32px 358px 32px 0px; + font-family: sans-serif; + font-size: 28px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: normal; + letter-spacing: normal; + color: #333333; + } + + .mp-details-pix { + width: 100%; + height: auto; + display: inline-block; + border-radius: 6px; + box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.1); + background-color: #ffffff; + margin-bottom: 30px; + } + + .mp-details-pix-title { + width:100%; + opacity: 0.8; + font-family: sans-serif; + font-size: 18px; + font-weight: bold; + font-stretch: normal; + font-style: normal; + line-height: 1.67; + letter-spacing: normal; + color: rgba(0, 0, 0, 0.8); + display: block; + margin: 40px 0 0 0; + padding: 0 0 0 32px; + } + + .mp-pix-left { + padding: 0 0 0 32px; + } + + .mp-details-list { + display: flex; + margin-bottom: 28px; + } + + .mp-details-pix-number-p { + border-radius: 100%; + width: 26px; + height: 24px; + padding: 2px 0 0 0; + border: solid 1px #009ee3; + color: #009ee3; + text-align: center; + font-size: 16px; + margin: 0 13px 0 0; + font-family: sans-serif; + } + + .mp-details-list-description { + padding-top: 4px; + font-family: sans-serif; + font-size: 16px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: normal; + letter-spacing: normal; + color: rgba(0, 0, 0, 0.8); + display: block; + width: 70%; + } + + .mp-col-md-4 { + flex: 0 0 33.333333%; + width: 33.333333%; + float: left; + } + + .mp-col-md-8 { + flex: 0 0 66.666667%; + width: 65.666667%; + float: left; + } + + .mp-text-center { + text-align: center !important; + } + + .mp-pix-right { + border-left: solid 1px #e5e5e5; + } + + .mp-details-pix-amount { + margin: 32px auto 0; text-align: center; - padding: 0; - } - + width: 100%; + color: rgba(0, 0, 0, 0.8); + font-size: 18px; + font-family: sans-serif; + } + + .mp-steps-congrats { + margin: 24px 0 16px 0 !important; + list-style-type: none; + } + + + + .mp-details-pix-qr { + padding: 0 4px 0 0; + } + + .mp-details-pix-qr-value { + font-weight: bold; + + } + + .mp-details-pix-qr-title { + margin: 24px 0 0 0; + font-family: sans-serif; + font-size: 16px; + font-weight: bold; + font-stretch: normal; + font-style: normal; + line-height: 1.88; + letter-spacing: normal; + text-align: center; + color: rgba(0, 0, 0, 0.8); + } + + .mp-details-pix-qr-value { + font-weight: bold; + } + + .mp-details-pix-qr-title { + margin: 24px 0 0 0; + font-family: sans-serif; + font-size: 16px; + font-weight: bold; + font-stretch: normal; + font-style: normal; + line-height: 1.88; + letter-spacing: normal; + text-align: center; + color: rgba(0, 0, 0, 0.8); + } + + .mp-details-pix-qr-img { + width: 200px; + height: 200px; + display: block; + margin: 16px auto 0 auto; + } + + .mp-details-pix-img { + width: 190px; + height: 56px; + object-fit: contain; + display: block; + margin: 64px 0 0 0; + padding: 0 0 0 32px; + } + + .mp-details-pix-qr-subtitle { + margin: 12px 0 32px 0; + font-family: sans-serif; + font-size: 14px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: 1.29; + letter-spacing: normal; + text-align: center; + color: rgba(0, 0, 0, 0.45); + } + + .mp-details-pix-qr-description { + margin: 32px 15px 16px 16px; + font-family: sans-serif; + font-size: 16px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: 1.25; + letter-spacing: normal; + text-align: center; + color: rgba(0, 0, 0, 0.8); + } + + .mp-row-checkout-pix { + width: 100%; + } + + .mp-row-checkout-pix-container { + display: flex; + padding: 16px 47px 48px 47px; + } + .mp-qr-input { - width: 95%; - height: 38px; - padding: 6.3px 0 5.7px 12px; - margin-bottom: 24px; + width: 70%; + padding: 6.3px 0 5.7px 12px; + border-radius: 6px; + border: solid 1px rgba(0, 0, 0, 0.2); + background-color: #ffffff; + margin: 0 12px 0 0; } - -} + + .mp-details-pix-button { + width: 30%; + height: 48px; + padding: 16px 24px; + border-radius: 6px; + box-shadow: none !important; + background-color: #009ee3; + border: 1px solid #009ee3 !important; + font-family: sans-serif; + font-size: 16px; + font-weight: 600; + font-stretch: normal; + font-style: normal; + line-height: 1; + letter-spacing: normal; + text-align: center; + color: #ffffff; + } + + .mp-details-pix-button:hover { + background: #006bb4; + border: 1px solid #006bb4; + color: #fff; + } + + h1, h2, h3, h4, h5, h6 { + font-weight: normal; + margin: 0; + /* line-height: 1em; */ + } + + h2 { + display: block; + margin-block-start: 0.83em; + margin-block-end: 0.83em; + margin-inline-start: 0px; + margin-inline-end: 0px; + } + + .mp-flex { + display: flex; + } + + .mp-tooltip { + display: inline-block; + position: relative; + } + + .mp-img-fix-width { + flex-basis: auto; + flex-grow: 0; + flex-shrink: 0; + } + + .mp-tooltip:hover .mp-tooltiptext { + opacity: 1; + visibility: visible; + } + + .mp-tooltip .mp-tooltiptext { + background-color: #fff; + border-radius: 6px; + box-shadow: 0 0 6px rgb(0 0 0 / 10%), 0 6px 16px rgb(0 0 0 / 10%); + color: #545454; + left: -10px; + padding: 16px; + position: absolute; + text-align: left; + top: 150%; + vertical-align: middle; + visibility: hidden; + width: 312px; + z-index: 1; + } + + .mp-stretch-item { + align-items: stretch; + } + + .background-default, .mp-flex-flow-row-wrap, .mp-stretch-item { + background: #fff; + } + + .mp-flex-item-round-border { + border-radius: 5px; + flex: 1; + } + + .mp-ta-center { + text-align: center; + } + + .mp-bg-light-grey { + background: #f5f5f5; + } + + .mp-padding-24 { + padding: 24px; + } + + .mp-mr-8 { + margin-right: 8px; + } + + .mp-flex-item-column { + display: inline-block; + flex-direction: column; + flex-grow: 1; + width: auto; + } + + .mp-fc-black { + color: rgba(0,0,0,.9); + } + + .mp-lh-120 { + line-height: 120%; + } + + .mp-mp-fw-normal { + font-weight: 400; + } + + .mp-fs-16 { + font-size: 16px; + } + + .mp-fw-600 { + font-weight: 600; + } + + .mp-fs-24 { + font-size: 24px; + } + + .mp-bottom-line { + background-color: #e6e6e6; + border: none; + color: #e6e6e6; + height: 1px; + } + + .mp-mb-8 { + margin-bottom: 8px; + } + + .mp-mb-16 { + margin-bottom: 16px; + } + + .mp-mt-16{ + margin-top: 16px; + } + + .mp-mb-24 { + margin-bottom: 24px; + } + + .mp-mt-24{ + margin-top: 24px; + } + + .content-box h3, .content-box .heading-3 { + color: #333333; + } + + .content-box h2, .content-box .heading-2 { + color: #333333; + } + + .main h2, .main .heading-2 { + color: #333333; + } + + h2, .heading-2 { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; + font-size: 1.2857142857em; + line-height: 1.3em; + } + + h3, .heading-3 { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; + font-size: 1em; + font-weight: 500; + line-height: 1.3em; + } + + h3 { + display: block; + font-size: 1.17em; + margin-block-start: 1em; + margin-block-end: 1em; + margin-inline-start: 0px; + margin-inline-end: 0px; + font-weight: bold; + } + + .mp-mt-0 { + margin-top: 0!important; + } + + p { + line-height: 1.5em; + } + + p { + margin: 0; + } + + .mp-hidden-block { + background-color: #fff; + border: 1px solid #00000040; + border-radius: 5px; + overflow: hidden; + padding: 18px 16px; + position: relative; + white-space: nowrap; + } + + .mp-fade-out-gradient { + background-image: linear-gradient(90deg,hsla(0,0%,100%,0),#fff); + height: 56px; + position: absolute; + right: 0; + top: 0; + width: 3em; + } + + .mp-img-center { + display: block; + margin-left: auto; + margin-right: auto; + } + + .mp-width-100px { + width: 100px; + } + + .mp-height-100px { + height: 100px; + } + + .content-box__row:last-child { + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; + } + .content-box__row:first-child { + border-top-left-radius: 4px; + border-top-right-radius: 4px; + } + .display-table .content-box__row { + display: table; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + } + .content-box__row { + padding: 1.1428571429em; + position: relative; + zoom: 1; + } + .content-box__row:after, .content-box__row:before { + content: ""; + display: table; + } + .content-box__row:after { + clear: both; + } + + .content-box { + background: #fff; + background-clip: padding-box; + border: 1px solid; + border-radius: 5px; + color: #545454; + } + + .content-box, .content-box-spacing { + margin-top: 1em; + } + + .main .content-box { + border-color: #d9d9d9; + } + + .img { + width: 15.6px; + aspect-ratio: auto 15.6 / 15.6; + height: 15.6px; + } + + @media (max-width: 767.98px) { + + .mp-mobile-fs-14 { + font-size: 14px!important; + } + + .mp-mobile-fs-16 { + font-size: 16px!important; + } + + .checkout-success #box-mercadopago { + width: 100%; + flex: none; + } + + .mp-col-md-4 { + width: 100%; + flex: none; + } + + .mp-col-md-8 { + width: 100%; + flex: none; + } + + .mp-pix-right { + border-right: none; + border-top: solid 1px #e5e5e5; + margin-bottom: 32px; + } + + .mp-qr-code { + width: 100%; + margin: 0 0 0 0; + } + + .mp-details-pix-button { + width: 100%; + display: inline-block; + } + + .mp-row-checkout-pix-container { + display: block; + } + + .mp-details-pix-img { + margin: 64px auto 0; + padding: 0; + } + + .mp-details-pix-title { + margin: 40px auto 0; + text-align: center; + padding: 0; + } + + .mp-qr-input { + width: 95%; + height: 38px; + padding: 6.3px 0 5.7px 12px; + margin-bottom: 24px; + } + + } + \ No newline at end of file diff --git a/src/MercadoPago/Core/view/frontend/web/js/CreditCard.js b/src/MercadoPago/Core/view/frontend/web/js/CreditCard.js index 624a9773..635fa9c7 100644 --- a/src/MercadoPago/Core/view/frontend/web/js/CreditCard.js +++ b/src/MercadoPago/Core/view/frontend/web/js/CreditCard.js @@ -3,6 +3,88 @@ window.cvvLength = null; window.additionalInfoNeeded = {}; + var mp = null; + var mpCardForm = null; + + + window.initCardForm = function (pk, quote, processMode, country, customMethod) { + mp = new MercadoPago(pk); + + // Instance SDK v2 + mpCardForm = mp.cardForm({ + amount: String(quote.totals().base_grand_total), + autoMount: true, + processingMode: processMode, + form: { + id: 'co-mercadopago-form', + cardNumber: { id: 'mpCardNumber' }, + cardholderName: { id: 'mpCardholderName' }, + cardExpirationMonth: { id: 'mpCardExpirationMonth' }, + cardExpirationYear: { id: 'mpCardExpirationYear' }, + securityCode: { id: 'mpSecurityCode' }, + installments: { id: 'mpInstallments' }, + identificationType: { id: 'mpDocType' }, + identificationNumber: { id: 'mpDocNumber' }, + issuer: { id: 'mpIssuer' } + }, + callbacks: { + onFormMounted: error => { + if (error) return console.warn('FormMounted handling error: ', error); + }, + onFormUnmounted: error => { + if (error) return console.warn('FormMounted handling error: ', error); + fullClearInputs() + setTimeout(() => { + initCardForm(pk, quote, processMode, country, customMethod) + }, 5000); + }, + onIdentificationTypesReceived: (error, identificationTypes) => { + if (error) return console.warn('IdentificationTypes handling error: ', error); + }, + onInstallmentsReceived: (error, installments) => { + if (error) { + return console.warn('Installments handling error: ', error) + } + + setChangeEventOnInstallments(country, installments.payer_costs); + }, + onCardTokenReceived: (error, token) => { + if (error) { + showErrors(error); + return console.warn('Token handling error: ', error); + } + + customMethod.placeOrder(); + }, + onPaymentMethodsReceived: (error, paymentMethods) => { + clearInputs(); + + if (error) { + return console.warn('PaymentMethods handling error: ', error); + } + + setImageCard(paymentMethods[0].thumbnail); + setCvvLength(paymentMethods[0].settings[0].security_code.length); + handleInstallments(paymentMethods[0].payment_type_id); + loadAdditionalInfo(paymentMethods[0].additional_info_needed); + additionalInfoHandler(); + }, + }, + }); + } + + window.mpDeleteCardForm = function () { + mpCardForm.unmount() + } + + window.getMpCardFormData = function () { + return mpCardForm.getCardFormData(); + } + + window.mpCreateCardToken = function () { + mpCardForm.createCardToken(); + } + window.getFormCustom = function () { return document.querySelector('#co-mercadopago-form'); } @@ -109,6 +191,12 @@ document.getElementById('mpCardholderName').value = ''; } + window.fullClearInputs = function () { + clearInputs() + document.getElementById('mpCardNumber').value = ''; + document.getElementById("mpInstallments").value = '' + } + window.validateFixedInputs = function () { var emptyInputs = false; var form = this.getFormCustom(); @@ -234,7 +322,7 @@ window.handleInstallments = function (payment_type_id) { if (payment_type_id === 'debit_card') { - document.getElementById('mpInstallments').setAttribute("disabled","disabled"); + document.getElementById('mpInstallments').setAttribute("disabled", "disabled"); } else { document.getElementById('mpInstallments').removeAttribute("disabled"); } diff --git a/src/MercadoPago/Core/view/frontend/web/js/Masks.js b/src/MercadoPago/Core/view/frontend/web/js/Masks.js index 0ec45ab2..51e76bc1 100644 --- a/src/MercadoPago/Core/view/frontend/web/js/Masks.js +++ b/src/MercadoPago/Core/view/frontend/web/js/Masks.js @@ -28,6 +28,11 @@ return v.replace(/\D/g, ''); } + // eslint-disable-next-line no-unused-vars -- hugo + window.mintegerletter = function (v) { + return v.replace(/[^A-Za-z0-9]+/g, ''); + } + // eslint-disable-next-line no-unused-vars window.mcc = function (v) { v = v.replace(/\D/g, ''); diff --git a/src/MercadoPago/Core/view/frontend/web/js/UpdateCardForm.js b/src/MercadoPago/Core/view/frontend/web/js/UpdateCardForm.js new file mode 100644 index 00000000..cc82daf6 --- /dev/null +++ b/src/MercadoPago/Core/view/frontend/web/js/UpdateCardForm.js @@ -0,0 +1,30 @@ +define([ + 'Magento_SalesRule/js/action/set-coupon-code', + 'Magento_SalesRule/js/action/cancel-coupon', + 'Magento_SalesRule/js/model/coupon', +], function (setCouponCodeAction, cancelCouponAction, coupon) { + 'use strict'; + + var couponCode = coupon.getCouponCode(); + var isApplied = coupon.getIsApplied(); + + var mixin = { + apply: function () { + if (this.validate()) { + setCouponCodeAction(couponCode(), isApplied); + mpDeleteCardForm(); + } + }, + cancel: function () { + if (this.validate()) { + couponCode(''); + cancelCouponAction(isApplied); + mpDeleteCardForm(); + } + }, + } + return function (origin) { + + return origin.extend(mixin); + }; +}); diff --git a/src/MercadoPago/Core/view/frontend/web/js/view/method-renderer/custom-method.js b/src/MercadoPago/Core/view/frontend/web/js/view/method-renderer/custom-method.js index d10250c1..955f1a53 100644 --- a/src/MercadoPago/Core/view/frontend/web/js/view/method-renderer/custom-method.js +++ b/src/MercadoPago/Core/view/frontend/web/js/view/method-renderer/custom-method.js @@ -36,8 +36,7 @@ define( ) { 'use strict'; - var mp = null; - var mpCardForm = null; + return Component.extend({ defaults: { @@ -52,64 +51,13 @@ define( if (window.checkoutConfig.payment[this.getCode()] !== undefined) { setChangeEventOnCardNumber(); setChangeEventExpirationDate(); - - // Initialize SDK v2 - mp = new MercadoPago(this.getPublicKey()); - - // Instance SDK v2 - mpCardForm = mp.cardForm({ - amount: String(this.getGrandTotal()), - autoMount: true, - processingMode: this.getProcessingMode(), - form: { - id: 'co-mercadopago-form', - cardNumber: { id: 'mpCardNumber' }, - cardholderName: { id: 'mpCardholderName' }, - cardExpirationMonth: { id: 'mpCardExpirationMonth' }, - cardExpirationYear: { id: 'mpCardExpirationYear' }, - securityCode: { id: 'mpSecurityCode' }, - installments: { id: 'mpInstallments' }, - identificationType: { id: 'mpDocType' }, - identificationNumber: { id: 'mpDocNumber' }, - issuer: { id: 'mpIssuer' } - }, - callbacks: { - onFormMounted: error => { - if (error) return console.warn('FormMounted handling error: ', error); - }, - onIdentificationTypesReceived: (error, identificationTypes) => { - if (error) return console.warn('IdentificationTypes handling error: ', error); - }, - onInstallmentsReceived: (error, installments) => { - if (error) { - return console.warn('Installments handling error: ', error) - } - - setChangeEventOnInstallments(this.getCountry(), installments.payer_costs); - }, - onCardTokenReceived: (error, token) => { - if (error) { - showErrors(error); - return console.warn('Token handling error: ', error); - } - - this.placeOrder(); - }, - onPaymentMethodsReceived: (error, paymentMethods) => { - clearInputs(); - - if (error) { - return console.warn('PaymentMethods handling error: ', error); - } - - setImageCard(paymentMethods[0].thumbnail); - setCvvLength(paymentMethods[0].settings[0].security_code.length); - handleInstallments(paymentMethods[0].payment_type_id); - loadAdditionalInfo(paymentMethods[0].additional_info_needed); - additionalInfoHandler(); - }, - }, - }); + initCardForm( + this.getPublicKey(), + quote, + this.getProcessingMode(), + this.getCountry(), + this + ); } }, @@ -261,7 +209,7 @@ define( var self = this; setPaymentInformationAction(this.messageContainer, { method: 'mercadopago_custom' }).done(() => { - $.getJSON('/mercadopago/wallet/preference').done(function (response){ + $.getJSON('/mercadopago/wallet/preference').done(function (response) { var preferenceId = response.preference.id self.toogleWalletButton(); @@ -322,7 +270,7 @@ define( * @override */ getData: function () { - var formData = mpCardForm.getCardFormData(); + var formData = getMpCardFormData() var dataObj = { 'method': this.item.method, @@ -358,11 +306,11 @@ define( return false; } - if(!validateCvv()){ + if (!validateCvv()) { return false; } - mpCardForm.createCardToken(); + mpCreateCardToken() }, placeOrder: function () { @@ -433,11 +381,11 @@ define( }, getProcessingMode: function () { - if (Number(this.getMpGatewayMode())) { - return 'gateway'; - } + if (Number(this.getMpGatewayMode())) { + return 'gateway'; + } - return 'aggregator'; + return 'aggregator'; }, }); } diff --git a/src/MercadoPago/Core/view/frontend/web/template/payment/custom_bank_transfer.html b/src/MercadoPago/Core/view/frontend/web/template/payment/custom_bank_transfer.html index 0ccb78a0..f59ab461 100644 --- a/src/MercadoPago/Core/view/frontend/web/template/payment/custom_bank_transfer.html +++ b/src/MercadoPago/Core/view/frontend/web/template/payment/custom_bank_transfer.html @@ -113,7 +113,8 @@ data-bind="attr: { title: $t('Identification Number'), 'data-validate': JSON.stringify({required:true}) - }"> + }" + onkeyup="maskInput(this, mintegerletter);"> diff --git a/src/MercadoPago/Core/view/frontend/web/template/payment/custom_method.html b/src/MercadoPago/Core/view/frontend/web/template/payment/custom_method.html index d86cc4c9..7777c5a5 100644 --- a/src/MercadoPago/Core/view/frontend/web/template/payment/custom_method.html +++ b/src/MercadoPago/Core/view/frontend/web/template/payment/custom_method.html @@ -201,6 +201,7 @@ data-checkout="mpDocNumber" name="mercadopago_custom[docNumber]" autocomplete="off" + onkeyup="maskInput(this, mintegerletter);" />