diff --git a/resources/js/blocks/molliePaymentMethod.js b/resources/js/blocks/molliePaymentMethod.js index 39303c61..83de427e 100644 --- a/resources/js/blocks/molliePaymentMethod.js +++ b/resources/js/blocks/molliePaymentMethod.js @@ -191,6 +191,36 @@ const MollieComponent = (props) => { }, [activePaymentMethod, onCheckoutValidation, billing.billingData, shippingData.shippingAddress, item, phoneString, inputBirthdate, inputPhone]); + useEffect(() => { + let phoneLabel = getPhoneField()?.labels?.[0] ?? null; + if (!phoneLabel || phoneLabel.length === 0) { + return + } + if (activePaymentMethod === 'mollie_wc_gateway_bancomatpay') { + phoneLabel.innerText = item.phonePlaceholder + } else { + if (phoneString !== false) { + phoneLabel.innerText = phoneString + } + } + let isPhoneEmpty = (billing.billingData.phone === '' && shippingData.shippingAddress.phone === '') && inputPhone === ''; + const unsubscribeProcessing = onCheckoutValidation( + + () => { + if (activePaymentMethod === 'mollie_wc_gateway_bancomatpay' && isPhoneEmpty) { + return { + errorMessage: item.errorMessage, + }; + } + } + ); + return () => { + unsubscribeProcessing() + }; + + }, [activePaymentMethod, onCheckoutValidation, billing.billingData, shippingData.shippingAddress, item, phoneString, inputPhone]); + + onSubmitLocal = onSubmit const updateIssuer = ( changeEvent ) => { selectIssuer( changeEvent.target.value ) @@ -214,7 +244,9 @@ const MollieComponent = (props) => { } function fieldMarkup(id, fieldType, label, action, value) { - return
+ const className = "wc-block-components-text-input wc-block-components-address-form__" + id; + return
+
} if (item.name === "mollie_wc_gateway_billie"){ @@ -231,7 +263,17 @@ const MollieComponent = (props) => { fields.push(fieldMarkup("billing-birthdate", "date", birthdateField, updateBirthdate, inputBirthdate)); if (!isPhoneFieldVisible) { const phoneField = item.phonePlaceholder ? item.phonePlaceholder : "Phone"; - fields.push(fieldMarkup("billing-phone", "tel", phoneField, updatePhone, inputPhone)); + fields.push(fieldMarkup("billing-phone-in3", "tel", phoneField, updatePhone, inputPhone)); + } + + return <>{fields}; + } + + if (item.name === "mollie_wc_gateway_bancomatpay"){ + let fields = []; + if (!isPhoneFieldVisible) { + const phoneField = item.phonePlaceholder ? item.phonePlaceholder : "Phone"; + fields.push(fieldMarkup("billing-phone-bancomatpay", "tel", phoneField, updatePhone, inputPhone)); } return <>{fields}; diff --git a/src/Gateway/GatewayModule.php b/src/Gateway/GatewayModule.php index 8981bee3..2a7d2dce 100644 --- a/src/Gateway/GatewayModule.php +++ b/src/Gateway/GatewayModule.php @@ -274,6 +274,8 @@ static function () { [$this, 'switchFields'], 11 ); + add_action( 'woocommerce_rest_checkout_process_payment_with_context', [$this, 'addPhoneWhenRest'],11 ); + } $isBancomatPayEnabled = mollieWooCommerceIsGatewayEnabled('mollie_wc_gateway_bancomatpay_settings', 'enabled'); if ($isBancomatPayEnabled) { @@ -293,6 +295,7 @@ static function () { [$this, 'switchFields'], 11 ); + add_action( 'woocommerce_rest_checkout_process_payment_with_context', [$this, 'addPhoneWhenRest'],11 ); } // Set order to paid and processed when eventually completed without Mollie add_action('woocommerce_payment_complete', [$this, 'setOrderPaidByOtherGateway'], 10, 1); @@ -872,4 +875,18 @@ private function isPhoneValid($billing_phone) { return preg_match('/^\+[1-9]\d{1,14}$/', $billing_phone); } + + public function addPhoneWhenRest($arrayContext) + { + $context = $arrayContext; + $phoneMandatoryGateways = ['mollie_wc_gateway_in3', 'mollie_wc_gateway_bancomatpay']; + $paymentMethod = $context->payment_data['payment_method']; + if (in_array($paymentMethod, $phoneMandatoryGateways)) { + $billingPhone = $context->payment_data['billing_phone']; + if ($billingPhone) { + $context->order->set_billing_phone($billingPhone); + $context->order->save(); + } + } + } }