-
-
- First Name
-
-
-
-
- Last Name
-
-
-
-
- Company (Optional)
-
-
-
-
- Billing ZIP
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Pay ${format_currency(frm.doc.outstanding_amount)}
-
-
+
+
+ First Name
+
- `
+
+ Last Name
+
+
+ Company (Optional)
+
+
+ Billing ZIP
+
+
+
+
+
+
+
+
+
+
+
+ Loading invoices...
+
+
+
+
+
+
+
+ Pay ${format_currency(frm.doc.outstanding_amount)}
+
+
`
}
],
-
primary_action_label: "Close",
-
- primary_action() {
- dialog.hide();
- }
+ primary_action() { dialog.hide(); }
});
dialog.show();
- dialog.$wrapper.on(
- "hidden.bs.modal",
- function () {
-
- document.querySelectorAll(
- ".modal-backdrop"
- ).forEach(el => el.remove());
-
- document.body.classList.remove(
- "modal-open"
- );
-
- document.body.style.overflow = "";
-
- dialog.$wrapper.remove();
-
- window.ns_payment_processing = false;
-
- if (window.CollectJS) {
-
- try {
-
- delete window.CollectJS;
-
- } catch (e) {}
-
- }
-
- }
- );
+ // ── Cleanup on close ─────────────────────────────────────────────────────
+ dialog.$wrapper.on("hidden.bs.modal", function () {
+ document.querySelectorAll(".modal-backdrop").forEach(el => el.remove());
+ document.body.classList.remove("modal-open");
+ document.body.style.overflow = "";
+ dialog.$wrapper.remove();
+ window.ns_payment_processing = false;
+ if (window.CollectJS) { try { delete window.CollectJS; } catch(e) {} }
+ });
+ // ── Prefill billing fields ────────────────────────────────────────────────
setTimeout(() => {
-
- const firstNameEl =
- document.getElementById(
- `first_name_${uid}`
- );
-
- const lastNameEl =
- document.getElementById(
- `last_name_${uid}`
- );
-
- const companyEl =
- document.getElementById(
- `company_${uid}`
- );
-
- const zipEl =
- document.getElementById(
- `billing_zip_${uid}`
- );
-
- const customerName =
- frm.doc.customer_name || "";
-
- const parts =
- customerName.trim().split(" ");
-
- if (firstNameEl) {
- firstNameEl.value = parts[0] || "";
- }
-
- if (lastNameEl) {
- lastNameEl.value =
- parts.slice(1).join(" ") || "";
- }
-
- if (companyEl) {
- companyEl.value =
- frm.doc.customer || "";
- }
-
- if (zipEl) {
-
- zipEl.value =
- frm.doc.billing_zip
- || frm.doc.pincode
- || "";
-
- }
-
+ const parts = (frm.doc.customer_name || "").trim().split(" ");
+ const set = (id, val) => { const el = document.getElementById(id); if (el) el.value = val; };
+ set(`first_name_${uid}`, parts[0] || "");
+ set(`last_name_${uid}`, parts.slice(1).join(" ") || "");
+ set(`company_${uid}`, frm.doc.customer || "");
+ set(`billing_zip_${uid}`, frm.doc.billing_zip || frm.doc.pincode || "");
}, 50);
+ // ── Helpers ───────────────────────────────────────────────────────────────
+ function get_selected_total() {
+ return all_invoices
+ .filter(inv => selected.has(inv.name))
+ .reduce((sum, inv) => sum + inv.outstanding_amount, 0);
+ }
+ function update_pay_button() {
+ const total = selected.size > 0 ? get_selected_total() : frm.doc.outstanding_amount;
+ const btn = document.getElementById(`pay_btn_${uid}`);
+ if (btn && !btn.disabled) btn.innerText = `Pay ${format_currency(total)}`;
+ const totalEl = document.getElementById(`selected_total_${uid}`);
+ if (totalEl) totalEl.innerText = format_currency(total);
+ }
+
+ function render_invoice_table(invoices) {
+ all_invoices = invoices;
+
+ const tbody = document.getElementById(`invoice_tbody_${uid}`);
+ const table = document.getElementById(`invoice_table_${uid}`);
+ const loading = document.getElementById(`invoice_table_loading_${uid}`);
+
+ if (!tbody) return;
+
+ tbody.innerHTML = "";
+ selected.clear();
+
+ invoices.forEach(inv => {
+ if (inv.name === frm.doc.name) selected.add(inv.name);
+
+ const tr = document.createElement("tr");
+ tr.setAttribute("data-invoice", inv.name);
+ tr.innerHTML = `
+
+
+
${inv.name}
+
${frappe.datetime.str_to_user(inv.posting_date)}
+
${inv.customer_name || frm.doc.customer_name}
+
${format_currency(inv.outstanding_amount)}
+ `;
+ tbody.appendChild(tr);
+ });
+
+ // Row checkbox events — use delegation on tbody
+ $(tbody).on("change", `.inv-check-${uid}`, function () {
+ if (this.checked) selected.add(this.dataset.name);
+ else selected.delete(this.dataset.name);
+ update_pay_button();
+
+ const all = tbody.querySelectorAll(`.inv-check-${uid}`);
+ const selectAll = document.getElementById(`select_all_${uid}`);
+ if (selectAll) selectAll.checked = [...all].every(c => c.checked);
+ });
+
+ // Select-all
+ $(dialog.$wrapper).on("change", `#select_all_${uid}`, function () {
+ tbody.querySelectorAll(`.inv-check-${uid}`).forEach(cb => {
+ cb.checked = this.checked;
+ if (this.checked) selected.add(cb.dataset.name);
+ else selected.delete(cb.dataset.name);
+ });
+ update_pay_button();
+ });
+
+ loading.style.display = "none";
+ table.style.display = "";
+ update_pay_button();
+ }
+
+ // ── Multi-invoice checkbox — delegated, no setTimeout needed ─────────────
+ dialog.$wrapper.on("change", `#multi_invoice_${uid}`, function () {
+ const tableWrap = document.getElementById(`invoice_table_wrap_${uid}`);
+ if (!tableWrap) return;
+
+ if (!this.checked) {
+ tableWrap.style.display = "none";
+ selected.clear();
+ update_pay_button();
+ return;
+ }
+
+ tableWrap.style.display = "";
+
+ if (all_invoices.length > 0) {
+ render_invoice_table(all_invoices);
+ return;
+ }
+
+ frappe.call({
+ method: "ns_app.api.payments.get_unpaid_invoices",
+ args: { customer: frm.doc.customer },
+ callback(r) {
+ if (r.message && r.message.length) {
+ render_invoice_table(r.message);
+ } else {
+ const loading = document.getElementById(`invoice_table_loading_${uid}`);
+ if (loading) loading.innerText = "No other unpaid invoices found.";
+ }
+ }
+ });
+ });
+
+ // ── CollectJS ─────────────────────────────────────────────────────────────
function loadCollectJS(callback) {
+ const existing = document.querySelector('script[src*="Collect.js"]');
+ if (existing) existing.remove();
+ if (window.CollectJS) { try { delete window.CollectJS; } catch(e) {} }
- const existingScript = document.querySelector(
- 'script[src*="Collect.js"]'
- );
-
- if (existingScript) {
- existingScript.remove();
- }
-
- if (window.CollectJS) {
-
- try {
-
- delete window.CollectJS;
-
- } catch (e) {}
-
- }
-
- const script =
- document.createElement("script");
-
- script.src =
- "https://secure.nmi.com/token/Collect.js";
-
- script.setAttribute(
- "data-tokenization-key",
- "HKx4XR-G549wT-8bZ2YJ-3kbG28"
- );
-
- script.onload = () => {
-
- console.log(
- "CollectJS loaded fresh"
- );
-
- callback();
- };
-
+ const script = document.createElement("script");
+ script.src = "https://secure.nmi.com/token/Collect.js";
+ script.setAttribute("data-tokenization-key", "HKx4XR-G549wT-8bZ2YJ-3kbG28");
+ script.onload = () => { console.log("CollectJS loaded"); callback(); };
document.body.appendChild(script);
}
-
loadCollectJS(() => {
-
- console.log("CollectJS ready");
-
setTimeout(() => {
-
CollectJS.configure({
-
variant: "inline",
-
styleSniffer: true,
-
fields: {
-
- ccnumber: {
- selector:
- `#cc_number_${uid}`,
-
- placeholder:
- "Card Number"
- },
-
- ccexp: {
- selector:
- `#cc_exp_${uid}`,
-
- placeholder:
- "MM / YY"
- },
-
- cvv: {
- selector:
- `#cc_cvv_${uid}`,
-
- placeholder:
- "CVV"
- }
+ ccnumber: { selector: `#cc_number_${uid}`, placeholder: "Card Number" },
+ ccexp: { selector: `#cc_exp_${uid}`, placeholder: "MM / YY" },
+ cvv: { selector: `#cc_cvv_${uid}`, placeholder: "CVV" }
},
-
- callback: function (response) {
-
- if (
- window.ns_payment_processing
- ) {
- return;
- }
-
+ callback(response) {
+ if (window.ns_payment_processing) return;
window.ns_payment_processing = true;
if (!response.token) {
-
window.ns_payment_processing = false;
-
- frappe.msgprint(
- "Payment failed to tokenize"
- );
-
+ frappe.msgprint("Payment failed to tokenize");
return;
}
- const firstName =
- document.getElementById(
- `first_name_${uid}`
- )?.value?.trim();
+ const get = id => document.getElementById(`${id}_${uid}`)?.value?.trim();
+ const saveCb = document.getElementById(`save_autopay_${uid}`);
+ const multiCb = document.getElementById(`multi_invoice_${uid}`);
- const lastName =
- document.getElementById(
- `last_name_${uid}`
- )?.value?.trim();
+ const invoice_names = (multiCb?.checked && selected.size > 0)
+ ? [...selected]
+ : [frm.doc.name];
- const company =
- document.getElementById(
- `company_${uid}`
- )?.value?.trim();
+ const payBtn = document.getElementById(`pay_btn_${uid}`);
+ if (payBtn) { payBtn.disabled = true; payBtn.innerText = "Processing..."; }
- const billingZip =
- document.getElementById(
- `billing_zip_${uid}`
- )?.value?.trim();
-
- const checkbox =
- document.getElementById(
- `save_autopay_${uid}`
- );
-
- const save_autopay =
- checkbox?.checked ? 1 : 0;
-
- console.log(
- "AUTOPAY CHECKBOX:",
- save_autopay
- );
-
- const payBtn =
- document.getElementById(
- `pay_btn_${uid}`
- );
-
- if (payBtn) {
-
- payBtn.disabled = true;
-
- payBtn.innerText =
- "Processing...";
-
- }
-
- run_token_payment(
- frm,
- response.token,
- dialog,
- {
- first_name: firstName,
- last_name: lastName,
- company: company,
- billing_zip: billingZip,
- save_autopay: save_autopay
- }
- );
+ run_token_payment(frm, response.token, dialog, {
+ first_name: get("first_name"),
+ last_name: get("last_name"),
+ company: get("company"),
+ billing_zip: get("billing_zip"),
+ save_autopay: saveCb?.checked ? 1 : 0,
+ invoice_names
+ });
}
});
- const btn =
- document.getElementById(
- `pay_btn_${uid}`
- );
-
- if (!btn) {
-
- console.error(
- "Pay button not found"
- );
-
- return;
- }
+ const btn = document.getElementById(`pay_btn_${uid}`);
+ if (!btn) { console.error("Pay button not found"); return; }
btn.onclick = function () {
-
- if (
- window.ns_payment_processing
- ) {
- return;
- }
-
+ if (window.ns_payment_processing) return;
btn.disabled = true;
-
btn.innerText = "Processing...";
-
- frappe.show_alert({
- message:
- "Processing payment...",
-
- indicator: "blue"
- });
-
+ frappe.show_alert({ message: "Processing payment...", indicator: "blue" });
CollectJS.startPaymentRequest();
};
-
}, 300);
-
});
-
}
-function run_token_payment(
- frm,
- token,
- dialog,
- extra_data = {}
-) {
-
+function run_token_payment(frm, token, dialog, extra_data = {}) {
frappe.call({
-
- method:
- "ns_app.api.payments.run_token_payment",
-
+ method: "ns_app.api.payments.run_token_payment",
args: {
-
- invoice: frm.doc.name,
-
- token: token,
-
- first_name:
- extra_data.first_name,
-
- last_name:
- extra_data.last_name,
-
- company:
- extra_data.company,
-
- billing_zip:
- extra_data.billing_zip,
-
- save_autopay:
- extra_data.save_autopay || 0
+ invoice: frm.doc.name,
+ invoice_names: extra_data.invoice_names || [frm.doc.name],
+ token,
+ first_name: extra_data.first_name,
+ last_name: extra_data.last_name,
+ company: extra_data.company,
+ billing_zip: extra_data.billing_zip,
+ save_autopay: extra_data.save_autopay || 0
},
-
freeze: true,
-
- freeze_message:
- "Processing payment...",
-
+ freeze_message: "Processing payment...",
callback(r) {
-
if (r.message?.success) {
-
- if (
- extra_data.save_autopay
- && r.message.vault_id
- ) {
-
- frappe.show_alert({
- message:
- `Payment successful + AutoPay enabled (${r.message.vault_id})`,
-
- indicator: "green"
- });
-
- } else {
-
- frappe.show_alert({
- message:
- "Payment successful",
-
- indicator: "green"
- });
-
- }
-
+ frappe.show_alert({
+ message: extra_data.save_autopay && r.message.vault_id
+ ? `Payment successful + AutoPay enabled (${r.message.vault_id})`
+ : "Payment successful",
+ indicator: "green"
+ });
window.ns_payment_processing = false;
-
dialog.hide();
-
frm.reload_doc();
-
} else {
-
window.ns_payment_processing = false;
-
- frappe.msgprint(
- r.message?.error
- || "Payment failed"
- );
-
- const payBtn =
- document.querySelector(
- '[id^="pay_btn_"]'
- );
-
+ frappe.msgprint(r.message?.error || "Payment failed");
+ const payBtn = document.querySelector('[id^="pay_btn_"]');
if (payBtn) {
-
payBtn.disabled = false;
-
- payBtn.innerText =
- `Pay ${format_currency(frm.doc.outstanding_amount)}`;
-
+ payBtn.innerText = `Pay ${format_currency(frm.doc.outstanding_amount)}`;
}
-
}
}
});