diff --git a/src/javascript/billing.js b/src/javascript/billing.js index f3f6573..88fb099 100644 --- a/src/javascript/billing.js +++ b/src/javascript/billing.js @@ -85,6 +85,13 @@ $(document).ready(function () { checkCart(); } + function resetTenderedAmountInput() { + $("#tenderedAmount").val(""); // Clear the input field + $("#proceedOrder").prop("disabled", true); // Disable the Proceed Order button + $("#changeDisplay").html(""); // Clear the change display + } + + // Run the checkCart function on page load checkCart(); @@ -191,6 +198,8 @@ $(document).ready(function () { }, }); + resetTenderedAmountInput(); + $("#orderConfirmationModal").modal("hide"); $("#receiptModal").modal("show"); @@ -205,6 +214,11 @@ $(document).ready(function () { checkCart(); }); + + $("#orderConfirmationModal").on("hidden.bs.modal", function () { + resetTenderedAmountInput(); + }); + function printOrderConfirmation(tenderedAmount) { const printableContent = generatePrintableContent(tenderedAmount); clearOrdersAndSubtotal(); @@ -222,69 +236,72 @@ $(document).ready(function () { function generatePrintableContent(tenderedAmount) { const processedBy = currentUser; const orderDetails = { - items: [], - subtotal: parseFloat($("#subtotalValue").text().replace(/,/g, "")), - discountPercentage: parseFloat($("#discountInput").val()) || 0, // Set to 0 if NaN - grandTotal: parseFloat($("#grandTotalValue").text()), - tenderedAmount: tenderedAmount, + items: [], + subtotal: parseFloat($("#subtotalValue").text().replace(/,/g, "")), + discountPercentage: parseFloat($("#discountInput").val()) || 0, // Set to 0 if NaN + grandTotal: parseFloat($("#grandTotalValue").text()), + tenderedAmount: tenderedAmount, }; const change = tenderedAmount - orderDetails.grandTotal; const discountAmount = orderDetails.subtotal * (orderDetails.discountPercentage / 100); $("#orderCart tr").each(function () { - const cells = $(this).find("td"); - orderDetails.items.push({ - productName: cells.eq(1).find(".text-capitalize").text().trim(), - quantity: cells.eq(0).find("p").text().trim().slice(1), - price: parseFloat( - cells - .eq(2) - .find(".text-carbon-grey") - .text() - .trim() - .replace(/[^\d.]/g, "") - ), - }); + const cells = $(this).find("td"); + const productName = cells.eq(1).text().trim(); + const quantity = cells.eq(0).text().trim().slice(1); + const price = parseFloat( + cells + .eq(2) + .text() + .trim() + .replace(/[^\d.]/g, "") + ); + + orderDetails.items.push({ + productName: productName, + quantity: quantity, + price: price, + }); }); return ` - - - Receipt - - - -
+ + + +
@@ -322,28 +339,28 @@ $(document).ready(function () {

${new Date().toLocaleString()}


- - - - +
Product
+ + + - - - + + + - ${orderDetails.items - .map( - (item) => ` - - - - - - ` - ) - .join("")} - -
Product QuantityPrice
Price
${capitalizeEachWord(item.productName)}${item.quantity}₱${item.price.toFixed(2)}
+ ${orderDetails.items + .map( + (item) => ` + + ${capitalizeEachWord(item.productName)} + ${item.quantity} + ₱${item.price.toFixed(2)} + + ` + ) + .join("")} + +

Subtotal: ₱${orderDetails.subtotal.toFixed(2)}

@@ -360,109 +377,111 @@ $(document).ready(function () {

Thank you for your patronage. We’d love to see you again soon. You're always welcome here!

-
- - +
+ + `; -} - -function capitalizeEachWord(str) { - return str.replace(/\b\w/g, char => char.toUpperCase()); -} - - // Calculate grand total - function calculateGrandTotal() { - const subtotal = parseFloat($("#subtotalValue").text().replace(/,/g, "")); - let discount = parseFloat($("#discountInput").val()) || 0; + } - if (isNaN(discount) || discount < 0 || discount > 20) { - alert("Please enter a valid discount percentage (0-20)."); - $("#discountInput").val(0); - discount = 0; + function capitalizeEachWord(str) { + return str.replace(/\b\w/g, char => char.toUpperCase()); } - const grandTotal = (subtotal - subtotal * (discount / 100)).toFixed(2); - $("#grandTotalValue").text(grandTotal); - } + // Calculate grand total + function calculateGrandTotal() { + const subtotal = parseFloat($("#subtotalValue").text().replace(/,/g, "")); + let discount = parseFloat($("#discountInput").val()) || 0; - function capitalizeEachWord(string) { - return string.replace(/\b\w/g, (char) => char.toUpperCase()); - } + if (isNaN(discount) || discount < 0 || discount > 20) { + alert("Please enter a valid discount percentage (0-20)."); + $("#discountInput").val(0); + discount = 0; + } - function validateDiscountInput(event) { - const input = event.target.value; + const grandTotal = (subtotal - subtotal * (discount / 100)).toFixed(2); + $("#grandTotalValue").text(grandTotal); + } - // Remove non-digit characters - const cleanedInput = input.replace(/[^\d]/g, ""); + function capitalizeEachWord(string) { + return string.replace(/\b\w/g, (char) => char.toUpperCase()); + } - // Reset input value - event.target.value = cleanedInput; + function validateDiscountInput(event) { + const input = event.target.value; - // Calculate grand total with the validated input - calculateGrandTotal(); - } + // Remove non-digit characters + const cleanedInput = input.replace(/[^\d]/g, ""); - // Set discount to 0 if the input is blank on blur - function resetDiscountIfBlank(event) { - if (event.target.value === "") { - event.target.value = 0; + // Reset input value + event.target.value = cleanedInput; + + // Calculate grand total with the validated input calculateGrandTotal(); } - } - - // Attach the validation function to the input event - $("#discountInput").on("input", validateDiscountInput); - // Attach the reset function to the blur event - $("#discountInput").on("blur", resetDiscountIfBlank); + // Set discount to 0 if the input is blank on blur + function resetDiscountIfBlank(event) { + if (event.target.value === "") { + event.target.value = 0; + calculateGrandTotal(); + } + } - // Initial calculation of the grand total - calculateGrandTotal(); + // Attach the validation function to the input event + $("#discountInput").on("input", validateDiscountInput); - // Tendered amount validation and change calculation - function enforceTenDigits(event) { - const input = event.target.value; - if (input.length > 10) { - event.target.value = input.slice(0, 10); - } - } + // Attach the reset function to the blur event + $("#discountInput").on("blur", resetDiscountIfBlank); - function calculateChange() { - const grandTotal = parseFloat($("#grandTotalValue").text()); - const tenderedAmount = parseFloat($("#tenderedAmount").val()); + // Initial calculation of the grand total + calculateGrandTotal(); - if (isNaN(tenderedAmount)) { - $("#changeDisplay").html( - "

Please enter a valid amount

" - ); - return; + // Tendered amount validation and change calculation + function enforceTenDigits(event) { + const input = event.target.value; + if (input.length > 21) { + event.target.value = input.slice(0, 21); + } } - const change = tenderedAmount - grandTotal; - if (change >= 0) { - $("#changeDisplay").html( - "

Change: " + change.toFixed(2) + "

" - ); - } else { - $("#changeDisplay").html( - "

Insufficient amount tendered

" - ); - } + function calculateChange() { + const grandTotal = parseFloat($("#grandTotalValue").text()); + const tenderedAmount = parseFloat($("#tenderedAmount").val()); + + if (isNaN(tenderedAmount)) { + $("#changeDisplay").html(""); + $("#proceedOrder").prop("disabled", true); + return; + } + + const change = tenderedAmount - grandTotal; + if (change >= 0) { + $("#changeDisplay").html( + "

Change: " + change.toFixed(2) + "

" + ); + $("#proceedOrder").prop("disabled", false); + } else { + $("#changeDisplay").html( + "

Insufficient amount tendered

" + ); + $("#proceedOrder").prop("disabled", true); + } } + - $("#tenderedAmount") - .on("input", enforceTenDigits) - .on("input", calculateChange); + $("#tenderedAmount") + .on("input", enforceTenDigits) + .on("input", calculateChange); - // Remove order item - $(document).on("click", ".remove-order", function (event) { - event.preventDefault(); - const row = $(this).closest("tr"); - const productName = row.find(".text-capitalize").text().trim(); + // Remove order item + $(document).on("click", ".remove-order", function (event) { + event.preventDefault(); + const row = $(this).closest("tr"); + const productName = row.find(".text-capitalize").text().trim(); - $.post("remove_order.php", { product_name: productName }, function () { - row.remove(); - window.location.reload(); + $.post("remove_order.php", { product_name: productName }, function () { + row.remove(); + window.location.reload(); + }); }); - }); }); \ No newline at end of file