Cutlery/invoiceninja
1
0
Fork 0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2025-07-09 03:14:30 -04:00
Code Issues Packages Projects Releases Wiki Activity

Refactor Payment class to handle additional steps

Browse Source
This commit is contained in:
Benjamin Beganović 2024-01-31 18:47:43 +01:00
parent a93b452c39
commit 290827b2d8
1 changed files with 66 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
resources/js/clients/invoices/payment.js vendored
View File

@ -9,11 +9,57 @@
*/ */
class Payment { class Payment {
constructor(displayTerms, displaySignature) { constructor(displayTerms, displaySignature, displayRff) {
this.shouldDisplayTerms = displayTerms; this.shouldDisplayTerms = displayTerms;
this.shouldDisplaySignature = displaySignature; this.shouldDisplaySignature = displaySignature;
this.termsAccepted = false; this.shouldDisplayRff = displayRff;
this.submitting = false; this.submitting = false;
this.steps = new Map()
if (this.shouldDisplayRff) {
this.steps.set("rff", {
element: document.getElementById('displayRequiredFieldsModal'),
callback: () => {
const fields = {
firstName: document.querySelector('input[name="rff_first_name"]'),
lastName: document.querySelector('input[name="rff_last_name"]'),
email: document.querySelector('input[name="rff_email"]'),
}
if (fields.firstName) {
document.querySelector('input[name="contact_first_name"]').value = fields.firstName.value;
}
if (fields.lastName) {
document.querySelector('input[name="contact_last_name"]').value = fields.lastName.value;
}
if (fields.email) {
document.querySelector('input[name="contact_email"]').value = fields.email.value;
}
}
});
}
if (this.shouldDisplaySignature) {
this.steps.set("signature", {
element: document.getElementById('displaySignatureModal'),
boot: () => this.signaturePad = new SignaturePad(
document.getElementById("signature-pad"),
{
penColor: "rgb(0, 0, 0)"
}
),
callback: () => document.querySelector('input[name="signature"').value = this.signaturePad.toDataURL(),
});
}
if (this.shouldDisplayTerms) {
this.steps.set("terms", {
element: document.getElementById('displayTermsModal'),
});
}
} }
handleMethodSelect(element) { handleMethodSelect(element) {
@ -23,53 +69,29 @@ class Payment {
document.getElementById("payment_method_id").value = document.getElementById("payment_method_id").value =
element.dataset.gatewayTypeId; element.dataset.gatewayTypeId;
if (this.shouldDisplaySignature && !this.shouldDisplayTerms) { if (this.steps.size === 0) {
return this.submitForm();
if(this.signaturePad && this.signaturePad.isEmpty())
alert("Please sign");
this.displayTerms();
document
.getElementById("accept-terms-button")
.addEventListener("click", () => {
this.termsAccepted = true;
this.submitForm();
});
} }
if (!this.shouldDisplaySignature && this.shouldDisplayTerms) { const next = this.steps.values().next().value;
this.displaySignature();
document next.element.removeAttribute("style");
.getElementById("signature-next-step")
.addEventListener("click", () => { if (next.boot) {
document.querySelector('input[name="signature"').value = this.signaturePad.toDataURL(); next.boot();
this.submitForm();
});
} }
if (this.shouldDisplaySignature && this.shouldDisplayTerms) { next.element.querySelector('#next-step').addEventListener('click', () => {
this.displaySignature(); next.element.setAttribute("style", "display: none;");
document this.steps = new Map(Array.from(this.steps.entries()).slice(1));
.getElementById("signature-next-step")
.addEventListener("click", () => {
this.displayTerms();
document if (next.callback) {
.getElementById("accept-terms-button") next.callback();
.addEventListener("click", () => {
document.querySelector('input[name="signature"').value = this.signaturePad.toDataURL();
this.termsAccepted = true;
this.submitForm();
});
});
} }
if (!this.shouldDisplaySignature && !this.shouldDisplayTerms) { this.handleMethodSelect(element);
this.submitForm(); });
}
} }
submitForm() { submitForm() {
@ -78,33 +100,6 @@ class Payment {
document.getElementById("payment-form").submit(); document.getElementById("payment-form").submit();
} }
displayTerms() {
let displayTermsModal = document.getElementById("displayTermsModal");
displayTermsModal.removeAttribute("style");
}
displaySignature() {
document.getElementById("signature-next-step").disabled = true;
let displaySignatureModal = document.getElementById(
"displaySignatureModal"
);
displaySignatureModal.removeAttribute("style");
const signaturePad = new SignaturePad(
document.getElementById("signature-pad"),
{
penColor: "rgb(0, 0, 0)"
}
);
signaturePad.onEnd = function(){
document.getElementById("signature-next-step").disabled = false;
};
this.signaturePad = signaturePad;
}
handle() { handle() {
document document
@ -124,5 +119,6 @@ const signature = document.querySelector(
).content; ).content;
const terms = document.querySelector('meta[name="show-invoice-terms"]').content; const terms = document.querySelector('meta[name="show-invoice-terms"]').content;
const rff = document.querySelector('meta[name="show-required-fields-form"]').content;
new Payment(Boolean(+signature), Boolean(+terms)).handle(); new Payment(Boolean(+terms), Boolean(+signature), Boolean(+rff)).handle();