From 1b206d61a248559372a5b1990e31899a3b6a2dc3 Mon Sep 17 00:00:00 2001 From: arteons Date: Mon, 11 Aug 2025 04:31:33 +0800 Subject: [PATCH] add filter date PO --- .../backoffice/purchaseorder/+page.svelte | 135 ++++++++++++------ 1 file changed, 88 insertions(+), 47 deletions(-) diff --git a/src/routes/backoffice/purchaseorder/+page.svelte b/src/routes/backoffice/purchaseorder/+page.svelte index 50e62a1..e41314b 100644 --- a/src/routes/backoffice/purchaseorder/+page.svelte +++ b/src/routes/backoffice/purchaseorder/+page.svelte @@ -250,6 +250,19 @@ let selectedVillaId: string | null = null; let searchTerm: string = ""; let showPreparedModal = false; + let selectedMonth: string = ""; // "01".."12" + let selectedYear: string = ""; // "2022".."2025" + + const months = [ + { label: "Jan", value: "01" }, { label: "Feb", value: "02" }, + { label: "Mar", value: "03" }, { label: "Apr", value: "04" }, + { label: "May", value: "05" }, { label: "Jun", value: "06" }, + { label: "Jul", value: "07" }, { label: "Aug", value: "08" }, + { label: "Sep", value: "09" }, { label: "Oct", value: "10" }, + { label: "Nov", value: "11" }, { label: "Dec", value: "12" }, + ]; + + const years = ["2022","2023","2024","2025"]; let selectedStatus: string | null = null; let selectedPO: string | null = null; let preparedByOptions: any[] = []; @@ -321,7 +334,7 @@ sortColumn = column; sortOrder = "asc"; } - fetchPurchaseOrder(selectedVillaId, searchTerm, sortColumn, sortOrder); + refresh(); } // Function to format numbers as ordinal (1st, 2nd, 3rd, etc.) @@ -376,7 +389,17 @@ return range; } - + function refresh() { + fetchPurchaseOrder( + selectedVillaId, + searchTerm, + sortColumn, + sortOrder, + (currentPage - 1) * rowsPerPage, + rowsPerPage, + selectedStatus + ); + } function changePage(page: number) { if (page < 1 || page > totalPages || page === currentPage) return; currentPage = page; @@ -590,7 +613,7 @@ } showPaymentModal = false; - await fetchPurchaseOrder(); + await refresh(); } // Save approval for purchase order async function saveApproval() { @@ -614,7 +637,7 @@ } showApprovalModal = false; - await fetchPurchaseOrder(); + await refresh(); } // populate dropdowns for adding purchase orders async function fetchDropdowns() { @@ -793,7 +816,7 @@ alert("Saved, but webhook failed."); } showCompletedModal = false; - await fetchPurchaseOrder(); + await refresh(); } // open prepared modal for purchase order async function openPreparedModal(row) { @@ -871,6 +894,28 @@ if (poStatus) { query = query.eq("po_status", poStatus); } + // 🔎 Month/Year filtering using requested_date + if (selectedYear || selectedMonth) { + // If month picked but year not, use current year + const year = selectedYear || String(new Date().getFullYear()); + + if (selectedMonth) { + // Filter just that month (inclusive start, exclusive end) + const start = `${year}-${selectedMonth}-01`; + // Compute next month + const monthIndex = Number(selectedMonth) - 1; // 0..11 + const next = new Date(Number(year), monthIndex + 1, 1); + const end = `${next.getFullYear()}-${String(next.getMonth() + 1).padStart(2,"0")}-01`; + + query = query.gte("requested_date", start).lt("requested_date", end); + } else { + // Year only: Jan 1 .. Jan 1 next year + const start = `${year}-01-01`; + const end = `${Number(year) + 1}-01-01`; + query = query.gte("requested_date", start).lt("requested_date", end); + } + } + const { data, count, error } = await query; @@ -930,7 +975,7 @@ }); $: totalPages = Math.ceil(totalItems / rowsPerPage); - $: currentPage = 1; +// $: currentPage = 1; //fetch all issues async function fetchIssues() { @@ -1033,7 +1078,7 @@ alert("Save worked but webhook failed."); } showPreparedModal = false; - await fetchPurchaseOrder(); + await refresh(); } // Save project function async function saveProject() { @@ -1154,7 +1199,7 @@ alert("Saved, but webhook failed."); } showReceivedModal = false; - await fetchPurchaseOrder(); + await refresh(); } // Save acknowledged purchase order async function saveAcknowledged() { @@ -1202,7 +1247,7 @@ } showAcknowledgedModal = false; - await fetchPurchaseOrder(); + await refresh(); } // Print purchase order async function printPO(row) { @@ -1262,15 +1307,8 @@ searchTerm = ( e.target as HTMLInputElement ).value.toLowerCase(); - fetchPurchaseOrder( - selectedVillaId, - searchTerm, - sortColumn, - sortOrder, - currentPage - 1, - rowsPerPage, - selectedStatus, - ); + currentPage = 1; + refresh(); }} /> @@ -1279,15 +1317,8 @@ class="border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none px-4 py-2 rounded-xl text-sm w-48 transition" bind:value={selectedVillaId} on:change={() => { - fetchPurchaseOrder( - selectedVillaId, - searchTerm, - sortColumn, - sortOrder, - currentPage - 1, - rowsPerPage, - selectedStatus, - ); + currentPage = 1; + refresh(); }} > @@ -1301,16 +1332,9 @@ class="border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none px-4 py-2 rounded-xl text-sm w-48 transition" bind:value={selectedStatus} on:change={(e) => { - selectedStatus = (e.target as HTMLSelectElement).value; - fetchPurchaseOrder( - selectedVillaId, - searchTerm, - sortColumn, - sortOrder, - currentPage - 1, - rowsPerPage, - selectedStatus, - ); + selectedStatus = (e.target as HTMLSelectElement).value; + currentPage = 1; + refresh(); }} > @@ -1543,6 +1567,31 @@
+
+ + + + +
+
Showing {(currentPage - 1) * rowsPerPage + 1}– {Math.min(currentPage * rowsPerPage, totalItems)} of {totalItems} items @@ -1556,16 +1605,8 @@ class="border border-gray-300 px-2 py-1 rounded text-sm" bind:value={rowsPerPage} on:change={() => { - currentPage = 1; // Reset to first page on change - fetchPurchaseOrder( - selectedVillaId, - searchTerm, - sortColumn, - sortOrder, - 0, - rowsPerPage, - selectedStatus, - ); + currentPage = 1; + refresh(); }} > {#each [10, 20, 50, 100] as option}