mirror of
https://github.com/invoiceninja/invoiceninja.git
synced 2025-06-23 20:00:33 -04:00
working on payment flow
This commit is contained in:
David Bomba
parent
c7cc0e084f
commit
a83cb0c3b2
@ -1,9 +0,0 @@
|
||||
/**
|
||||
* Invoice Ninja (https://invoiceninja.com)
|
||||
*
|
||||
* @link https://github.com/invoiceninja/invoiceninja source repository
|
||||
*
|
||||
* @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
|
||||
*
|
||||
* @license https://www.elastic.co/licensing/elastic-license
|
||||
*/class l{constructor(e,t,n,d){this.key=e,this.secret=t,this.onlyAuthorization=n,this.stripeConnect=d}setupStripe(){return this.stripeConnect?this.stripe=Stripe(this.key,{stripeAccount:this.stripeConnect}):this.stripe=Stripe(this.key),this.elements=this.stripe.elements(),this}createElement(){var e;return this.cardElement=this.elements.create("card",{hidePostalCode:((e=document.querySelector("meta[name=stripe-require-postal-code]"))==null?void 0:e.content)==="0",value:{postalCode:document.querySelector("meta[name=client-postal-code]").content},hideIcon:!1}),this}mountCardElement(){return this.cardElement.mount("#card-element"),this}completePaymentUsingToken(){let e=document.querySelector("input[name=token]").value,t=document.getElementById("pay-now");this.payNowButton=t,this.payNowButton.disabled=!0,this.payNowButton.querySelector("svg").classList.remove("hidden"),this.payNowButton.querySelector("span").classList.add("hidden"),this.stripe.handleCardPayment(this.secret,{payment_method:e}).then(n=>n.error?this.handleFailure(n.error.message):this.handleSuccess(n))}completePaymentWithoutToken(){let e=document.getElementById("pay-now");this.payNowButton=e,this.payNowButton.disabled=!0,this.payNowButton.querySelector("svg").classList.remove("hidden"),this.payNowButton.querySelector("span").classList.add("hidden");let t=document.getElementById("cardholder-name");this.stripe.handleCardPayment(this.secret,this.cardElement,{payment_method_data:{billing_details:{name:t.value}}}).then(n=>n.error?this.handleFailure(n.error.message):this.handleSuccess(n))}handleSuccess(e){document.querySelector('input[name="gateway_response"]').value=JSON.stringify(e.paymentIntent);let t=document.querySelector('input[name="token-billing-checkbox"]:checked');t&&(document.querySelector('input[name="store_card"]').value=t.value),document.getElementById("server-response").submit()}handleFailure(e){let t=document.getElementById("errors");t.textContent="",t.textContent=e,t.hidden=!1,this.payNowButton.disabled=!1,this.payNowButton.querySelector("svg").classList.add("hidden"),this.payNowButton.querySelector("span").classList.remove("hidden")}handleAuthorization(){let e=document.getElementById("cardholder-name"),t=document.getElementById("authorize-card");this.payNowButton=t,this.payNowButton.disabled=!0,this.payNowButton.querySelector("svg").classList.remove("hidden"),this.payNowButton.querySelector("span").classList.add("hidden"),this.stripe.handleCardSetup(this.secret,this.cardElement,{payment_method_data:{billing_details:{name:e.value}}}).then(n=>n.error?this.handleFailure(n.error.message):this.handleSuccessfulAuthorization(n))}handleSuccessfulAuthorization(e){document.getElementById("gateway_response").value=JSON.stringify(e.setupIntent),document.getElementById("server_response").submit()}handle(){this.setupStripe(),this.onlyAuthorization?(this.createElement().mountCardElement(),document.getElementById("authorize-card").addEventListener("click",()=>this.handleAuthorization())):(Array.from(document.getElementsByClassName("toggle-payment-with-token")).forEach(e=>e.addEventListener("click",t=>{document.getElementById("stripe--payment-container").classList.add("hidden"),document.getElementById("save-card--container").style.display="none",document.querySelector("input[name=token]").value=t.target.dataset.token})),document.getElementById("toggle-payment-with-credit-card").addEventListener("click",e=>{document.getElementById("stripe--payment-container").classList.remove("hidden"),document.getElementById("save-card--container").style.display="grid",document.querySelector("input[name=token]").value=""}),this.createElement().mountCardElement(),document.getElementById("pay-now").addEventListener("click",()=>{try{return document.querySelector("input[name=token]").value?this.completePaymentUsingToken():this.completePaymentWithoutToken()}catch(e){console.log(e.message)}}))}}var o;const c=((o=document.querySelector('meta[name="stripe-publishable-key"]'))==null?void 0:o.content)??"";var r;const u=((r=document.querySelector('meta[name="stripe-secret"]'))==null?void 0:r.content)??"";var a;const m=((a=document.querySelector('meta[name="only-authorization"]'))==null?void 0:a.content)??"";var s;const h=((s=document.querySelector('meta[name="stripe-account-id"]'))==null?void 0:s.content)??"";let i=new l(c,u,m,h);i.handle();document.addEventListener("livewire:init",()=>{Livewire.on("passed-required-fields-check",()=>i.handle())});
|
||||
@ -146,7 +146,7 @@
|
||||
"src": "resources/js/clients/payments/stripe-browserpay.js"
|
||||
},
|
||||
"resources/js/clients/payments/stripe-credit-card.js": {
|
||||
"file": "assets/stripe-credit-card-75322a3b.js",
|
||||
"file": "assets/stripe-credit-card-c690d3d4.js",
|
||||
"isEntry": true,
|
||||
"src": "resources/js/clients/payments/stripe-credit-card.js"
|
||||
},
|
||||
|
||||
@ -18,10 +18,10 @@ class StripeCreditCard {
|
||||
|
||||
setupStripe() {
|
||||
|
||||
if (this.stripeConnect){
|
||||
if (this.stripeConnect) {
|
||||
|
||||
this.stripe = Stripe(this.key, {
|
||||
stripeAccount: this.stripeConnect,
|
||||
this.stripe = Stripe(this.key, {
|
||||
stripeAccount: this.stripeConnect,
|
||||
});
|
||||
|
||||
}
|
||||
@ -90,7 +90,7 @@ class StripeCreditCard {
|
||||
this.stripe
|
||||
.handleCardPayment(this.secret, this.cardElement, {
|
||||
payment_method_data: {
|
||||
billing_details: {name: cardHolderName.value},
|
||||
billing_details: { name: cardHolderName.value },
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
@ -145,7 +145,7 @@ class StripeCreditCard {
|
||||
this.stripe
|
||||
.handleCardSetup(this.secret, this.cardElement, {
|
||||
payment_method_data: {
|
||||
billing_details: {name: cardHolderName.value},
|
||||
billing_details: { name: cardHolderName.value },
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
@ -199,41 +199,47 @@ class StripeCreditCard {
|
||||
.getElementById('pay-now')
|
||||
.addEventListener('click', () => {
|
||||
|
||||
try {
|
||||
let tokenInput = document.querySelector('input[name=token]');
|
||||
try {
|
||||
let tokenInput = document.querySelector('input[name=token]');
|
||||
|
||||
if (tokenInput.value) {
|
||||
return this.completePaymentUsingToken();
|
||||
if (tokenInput.value) {
|
||||
return this.completePaymentUsingToken();
|
||||
}
|
||||
|
||||
return this.completePaymentWithoutToken();
|
||||
} catch (error) {
|
||||
console.log(error.message);
|
||||
}
|
||||
|
||||
return this.completePaymentWithoutToken();
|
||||
}catch(error){
|
||||
console.log(error.message);
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const publishableKey =
|
||||
document.querySelector('meta[name="stripe-publishable-key"]')?.content ?? '';
|
||||
|
||||
const secret =
|
||||
document.querySelector('meta[name="stripe-secret"]')?.content ?? '';
|
||||
Livewire.hook('component.init', () => {
|
||||
|
||||
const onlyAuthorization =
|
||||
document.querySelector('meta[name="only-authorization"]')?.content ?? '';
|
||||
console.log("running now");
|
||||
|
||||
const stripeConnect =
|
||||
document.querySelector('meta[name="stripe-account-id"]')?.content ?? '';
|
||||
const publishableKey =
|
||||
document.querySelector('meta[name="stripe-publishable-key"]')?.content ?? '';
|
||||
|
||||
let s = new StripeCreditCard(publishableKey, secret, onlyAuthorization, stripeConnect);
|
||||
const secret =
|
||||
document.querySelector('meta[name="stripe-secret"]')?.content ?? '';
|
||||
|
||||
s.handle();
|
||||
const onlyAuthorization =
|
||||
document.querySelector('meta[name="only-authorization"]')?.content ?? '';
|
||||
|
||||
document.addEventListener('livewire:init', () => {
|
||||
const stripeConnect =
|
||||
document.querySelector('meta[name="stripe-account-id"]')?.content ?? '';
|
||||
|
||||
Livewire.on('passed-required-fields-check', () => s.handle());
|
||||
let s = new StripeCreditCard(publishableKey, secret, onlyAuthorization, stripeConnect);
|
||||
|
||||
});
|
||||
s.handle();
|
||||
|
||||
document.addEventListener('livewire:init', () => {
|
||||
|
||||
Livewire.on('passed-required-fields-check', () => s.handle());
|
||||
|
||||
});
|
||||
})
|
||||
@ -1,23 +1,5 @@
|
||||
<style>
|
||||
.spinner {
|
||||
/* Simple spinner styling */
|
||||
border: 4px solid rgba(0, 0, 0, 0.1);
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
border-left-color: #09f;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>
|
||||
|
||||
|
||||
|
||||
@if($stripe_account_id)
|
||||
<meta name="stripe-account-id" content="{{ $stripe_account_id }}">
|
||||
<meta name="stripe-publishable-key" content="{{ config('ninja.ninja_stripe_publishable_key') }}">
|
||||
@ -86,9 +68,10 @@
|
||||
@include('portal.ninja2020.gateways.includes.pay_now')
|
||||
|
||||
|
||||
@script
|
||||
@assets
|
||||
<script src="https://js.stripe.com/v3/"></script>
|
||||
@endassets
|
||||
|
||||
@vite('resources/js/clients/payments/stripe-credit-card.js')
|
||||
@endscript
|
||||
|
||||
</div>
|
||||
Loading…
x
Reference in New Issue
Block a user