mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-08-31 06:52:50 +08:00
Rename component filename
This commit is contained in:
parent
a42488b41d
commit
de3fd75f69
3 changed files with 47 additions and 45 deletions
|
@ -7,6 +7,7 @@ import {
|
|||
} from "@paypal/react-paypal-js";
|
||||
|
||||
import {CheckoutHandler} from "./checkout-handler";
|
||||
import {createOrder, onApprove} from "../card-fields-config";
|
||||
|
||||
export function CardFields({config, eventRegistration, emitResponse}) {
|
||||
const {onPaymentSetup} = eventRegistration;
|
||||
|
@ -14,47 +15,6 @@ export function CardFields({config, eventRegistration, emitResponse}) {
|
|||
|
||||
const [cardFieldsForm, setCardFieldsForm] = useState();
|
||||
|
||||
async function createOrder() {
|
||||
return fetch(config.scriptData.ajax.create_order.endpoint, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
nonce: config.scriptData.ajax.create_order.nonce,
|
||||
context: config.scriptData.context,
|
||||
payment_method: 'ppcp-credit-card-gateway',
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((order) => {
|
||||
return order.data.id;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
function onApprove(data) {
|
||||
fetch(config.scriptData.ajax.approve_order.endpoint, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
order_id: data.orderID,
|
||||
nonce: config.scriptData.ajax.approve_order.nonce,
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
console.log(data)
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
const getCardFieldsForm = (cardFieldsForm) => {
|
||||
setCardFieldsForm(cardFieldsForm)
|
||||
}
|
||||
|
@ -67,7 +27,7 @@ export function CardFields({config, eventRegistration, emitResponse}) {
|
|||
resolve()
|
||||
}, milliseconds)
|
||||
})
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(
|
||||
() =>
|
||||
|
@ -75,7 +35,7 @@ export function CardFields({config, eventRegistration, emitResponse}) {
|
|||
async function handlePaymentProcessing() {
|
||||
await cardFieldsForm.submit();
|
||||
|
||||
// TODO temporary workaround to wait for PayPal order in the session
|
||||
// TODO temporary workaround to wait for onApprove to resolve
|
||||
await wait(3000)
|
||||
|
||||
return {
|
|
@ -1,5 +1,5 @@
|
|||
import { registerPaymentMethod } from '@woocommerce/blocks-registry';
|
||||
import {CardFields} from "./Components/CardFields";
|
||||
import {CardFields} from "./Components/card-fields";
|
||||
|
||||
const config = wc.wcSettings.getSetting('ppcp-credit-card-gateway_data');
|
||||
|
||||
|
@ -7,7 +7,7 @@ registerPaymentMethod({
|
|||
name: config.id,
|
||||
label: <div dangerouslySetInnerHTML={{__html: config.title}}/>,
|
||||
content: <CardFields config={config}/>,
|
||||
edit: <p>edit...</p>,
|
||||
edit: <div></div>,
|
||||
ariaLabel: config.title,
|
||||
canMakePayment: () => {return true},
|
||||
})
|
||||
|
|
42
modules/ppcp-blocks/resources/js/card-fields-config.js
Normal file
42
modules/ppcp-blocks/resources/js/card-fields-config.js
Normal file
|
@ -0,0 +1,42 @@
|
|||
const config = wc.wcSettings.getSetting('ppcp-credit-card-gateway_data');
|
||||
|
||||
export async function createOrder() {
|
||||
return fetch(config.scriptData.ajax.create_order.endpoint, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
nonce: config.scriptData.ajax.create_order.nonce,
|
||||
context: config.scriptData.context,
|
||||
payment_method: 'ppcp-credit-card-gateway',
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((order) => {
|
||||
return order.data.id;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
export function onApprove(data) {
|
||||
fetch(config.scriptData.ajax.approve_order.endpoint, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
order_id: data.orderID,
|
||||
nonce: config.scriptData.ajax.approve_order.nonce,
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
console.log(data)
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue