update(checkout): updated '/order' api call logic

assets/js/checkout.js

@@ -32,54 +32,68 @@ document.addEventListener("DOMContentLoaded", () => {
 	subtotalEl.textContent = `₹${subtotal.toFixed(2)}`;
 	totalEl.textContent = `₹${total.toFixed(2)}`;
 
-	// Unlock QR on valid form submit
+	const orderBtn = document.getElementById("btn-order");
+
+	let billingData = null;
+
 	form.addEventListener("submit", async (e) => {
 		e.preventDefault();
 
 		if (!form.checkValidity()) return;
 
-		const orderBtn = document.getElementById("btn-order");
+		const step = orderBtn.dataset.step;
 
-		orderBtn.classList.add("loading");
+		// STEP 1 — Unlock QR
-		orderBtn.disabled = true;
+		if (step === "unlock") {
+			const formData = Object.fromEntries(new FormData(form));
 
-		const formData = new FormData(form);
+			billingData = formData;
 
-		const orderPayload = {
-			first_name: formData.get("first_name"),
-			last_name: formData.get("last_name"),
-			email: formData.get("email"),
-			phone: formData.get("phone"),
-			address: formData.get("address"),
-			city: formData.get("city"),
-			state: formData.get("state"),
-			post_code: formData.get("post_code"),
-			order: Cart.getCart(),
-		};
-
-		try {
-			const res = await fetch(`${CONFIG.API_BASE_URL}/order`, {
-				method: "POST",
-				headers: {
-					"Content-Type": "application/json",
-				},
-				body: JSON.stringify(orderPayload),
-			});
-
-			console.log(res);
-
-			// if (!res.ok) throw new Error("Order failed");
-
-			// unlock payment QR
 			qrWrapper.classList.remove("blurred");
 
-			console.log("Order created");
+			orderBtn.dataset.step = "confirm";
-		} catch (err) {
+			orderBtn.querySelector(".btn-text").textContent =
-			console.error(err);
+				"I Have Completed Payment";
-			alert("Unable to place order. Please try again.");
+
-		} finally {
+			return;
-			orderBtn.classList.remove("loading");
+		}
-			orderBtn.disabled = false;
+
+		// STEP 2 — Place Order
+		if (step === "confirm") {
+			try {
+				orderBtn.classList.add("loading");
+				orderBtn.disabled = true;
+
+				const orderPayload = {
+					...billingData,
+					order: Cart.getCart(),
+				};
+
+				const res = await fetch(`${CONFIG.API_BASE_URL}/order`, {
+					method: "POST",
+					headers: {
+						"Content-Type": "application/json",
+					},
+					body: JSON.stringify(orderPayload),
+				});
+
+				showToast({
+					title: "Order Placed, Redirecting to home in 3 seconds...",
+					icon: "✓",
+				});
+
+				Cart.clear();
+
+				setTimeout(() => {
+					window.location.href = "index.html";
+				}, 3000);
+			} catch (err) {
+				console.error(err);
+				alert("Unable to place order.");
+			} finally {
+				orderBtn.classList.remove("loading");
+				orderBtn.disabled = false;
+			}
 		}
 	});
 });