From 720ae06d780c42ed0ff7c63f5fbc88f5a7ad8274 Mon Sep 17 00:00:00 2001 From: Sabda Yagra Date: Wed, 10 Dec 2025 18:25:48 +0700 Subject: [PATCH] fix: filter date in convert spit --- .../content/spit/table-spit/table-spit.tsx | 171 ++++++++++++++++-- service/content/content.ts | 26 ++- 2 files changed, 181 insertions(+), 16 deletions(-) diff --git a/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx b/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx index 7006f32d..5c96ea21 100644 --- a/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx +++ b/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx @@ -92,7 +92,7 @@ const TableSPIT = () => { const userId = getCookiesDecrypt("uie"); const userLevelId = getCookiesDecrypt("ulie"); const t = useTranslations("AnalyticsDashboard"); - const [dateFilter, setDateFilter] = React.useState(""); + // const [dateFilter, setDateFilter] = React.useState(""); const [totalData, setTotalData] = React.useState(1); const [sorting, setSorting] = React.useState([]); const [columnFilters, setColumnFilters] = React.useState( @@ -106,6 +106,9 @@ const TableSPIT = () => { }); const [categories, setCategories] = React.useState([]); const roleId = getCookiesDecrypt("urie"); + const [startDate, setStartDate] = React.useState(""); + const [endDate, setEndDate] = React.useState(""); + const columns = useTableColumns(); const table = useReactTable({ data: spitTable, @@ -159,6 +162,15 @@ const TableSPIT = () => { } }, [searchParams]); + React.useEffect(() => { + setPage(1); + setPagination({ + pageIndex: 0, + pageSize: Number(showData), + }); + fetchData(); + }, [startDate, endDate]); + // React.useEffect(() => { // fetchData(); // }, [showData, page, search, statusFilter, dateFilter]); @@ -176,10 +188,38 @@ const TableSPIT = () => { // // endDate, // ]); + const handleResetFilter = () => { + setSearch(""); + setStatusFilter([]); + setStartDate(""); + setEndDate(""); + setShowData("10"); + setPage(1); + + // kalau pakai tanstack pagination + setPagination({ + pageIndex: 0, + pageSize: 10, + }); + + table.resetRowSelection(); + + fetchData(); + }; + React.useEffect(() => { fetchData(); getCategories(); - }, [statusFilter, page, showData, search, dateFilter]); + }, [ + startDate, + endDate, + statusFilter, + showData, + page, + search, + pagination.pageIndex, + pagination.pageSize, + ]); async function getCategories() { const category = await listEnableCategory("4"); @@ -188,11 +228,11 @@ const TableSPIT = () => { } // Panggil fetchData otomatis ketika dateFilter berubah - React.useEffect(() => { - if (dateFilter) { - fetchData(); - } - }, [dateFilter]); + // React.useEffect(() => { + // if (dateFilter) { + // fetchData(); + // } + // }, [dateFilter]); async function fetchData() { let isPublish; @@ -203,18 +243,27 @@ const TableSPIT = () => { } else { isPublish = statusFilter.includes(1) ? false : true; } + const formattedStartDate = startDate + ? format(new Date(startDate), "yyyy-MM-dd") + : ""; - const formattedStartDate = dateFilter - ? format(new Date(dateFilter + "T00:00:00"), "yyyy-MM-dd") + const formattedEndDate = endDate + ? format(new Date(endDate), "yyyy-MM-dd") : ""; try { const res = await listSPIT( + // showData, + // page - 1, + // // limit, + // search, + // formattedStartDate, + // isPublish showData, page - 1, - // limit, search, formattedStartDate, + formattedEndDate, isPublish ); const data = res?.data?.data; @@ -231,6 +280,78 @@ const TableSPIT = () => { } } + // async function fetchData() { + // let isPublish; + // if (statusFilter.length === 0) { + // isPublish = ""; + // } else if (statusFilter.length > 1) { + // isPublish = ""; + // } else { + // isPublish = statusFilter.includes(1) ? false : true; + // } + + // // ✳️ format tanggal dari input (YYYY-MM-DD) + // const formattedStartDate = startDate + // ? format(new Date(startDate), "yyyy-MM-dd") + // : ""; + + // const formattedEndDate = endDate + // ? format(new Date(endDate), "yyyy-MM-dd") + // : ""; + + // try { + // const res = await listSPIT( + // showData, + // page - 1, + // search, + // formattedStartDate, + // formattedEndDate, + // isPublish + // ); + + // const data = res?.data?.data; + // let contentData: any[] = data?.content || []; + + // // 🔒 FRONTEND RANGE FILTER TAMBAHAN (anti bocor November) + // if (formattedStartDate || formattedEndDate) { + // contentData = contentData.filter((item) => { + // if (!item.contentCreatedDate) return false; + + // // jadikan string tanggal lokal 'yyyy-MM-dd' + // const createdDateStr = format( + // new Date(item.contentCreatedDate), + // "yyyy-MM-dd" + // ); + + // if (formattedStartDate && createdDateStr < formattedStartDate) { + // return false; + // } + + // if (formattedEndDate && createdDateStr > formattedEndDate) { + // return false; + // } + + // return true; + // }); + // } + + // // kasih nomor urut + // const newData = contentData.map((item: any, index: number) => ({ + // ...item, + // no: (page - 1) * Number(showData) + index + 1, + // })); + + // setSpitTable(newData); + // setTotalData(data?.totalElements || 0); + // setTotalPage(data?.totalPages || 1); + + // // optional: bersihkan selection + // table.resetRowSelection(); + // } catch (error) { + // console.error("Error fetching tasks:", error); + // } + // } + const handleSearch = (e: React.ChangeEvent) => { setSearch(e.target.value); table.getColumn("judul")?.setFilterValue(e.target.value); @@ -312,6 +433,17 @@ const TableSPIT = () => {

Filter

+
+ +
+ {/*
{ className="max-w-sm" />
*/} -
+ {/*
{ }} className="max-w-sm" /> +
*/} + +
+ + setStartDate(e.target.value)} + /> +
+
+ + setEndDate(e.target.value)} + />
diff --git a/service/content/content.ts b/service/content/content.ts index 85d1e27e..3a83a423 100644 --- a/service/content/content.ts +++ b/service/content/content.ts @@ -78,7 +78,6 @@ export async function listDataSatker( ); } - export async function listDataImage( size: any = "", page: any = "", @@ -160,15 +159,28 @@ export async function listDataAudio( ); } +// export async function listSPIT( +// size: any, +// page: any, +// title = "", +// contentCreatedDate = "", +// isPublish: any +// ) { +// return await httpGetInterceptor( +// `media/spit/pagination?enablePage=1&page=${page}&size=${size}&sort=desc&sortBy=contentTitleId&title=${title}&startDate=${contentCreatedDate}&endDate=${contentCreatedDate}&isPublish=${isPublish}` +// ); +// } + export async function listSPIT( size: any, page: any, title = "", - contentCreatedDate = "", + startDate = "", + endDate = "", isPublish: any ) { return await httpGetInterceptor( - `media/spit/pagination?enablePage=1&page=${page}&size=${size}&sort=desc&sortBy=contentTitleId&title=${title}&startDate=${contentCreatedDate}&endDate=${contentCreatedDate}&isPublish=${isPublish}` + `media/spit/pagination?enablePage=1&page=${page}&size=${size}&sort=desc&sortBy=contentTitleId&title=${title}&startDate=${startDate}&endDate=${endDate}&isPublish=${isPublish}` ); } @@ -190,11 +202,15 @@ export async function getTagsBySubCategoryId(subCategory: any) { } export async function listEnableCategory(type: any, status?: boolean) { - const url = `media/categories/list?enablePage=0&sort=desc&sortBy=id&type=${type}&isInt=true&isPublish=${status || ""}`; + const url = `media/categories/list?enablePage=0&sort=desc&sortBy=id&type=${type}&isInt=true&isPublish=${ + status || "" + }`; return httpGetInterceptor(url); } export async function listEnableCategoryNew(type: any, status?: boolean) { - const url = `media/categories/list/publish?enablePage=0&sort=desc&sortBy=id&type=${type}&isPublish=${status || ""}`; + const url = `media/categories/list/publish?enablePage=0&sort=desc&sortBy=id&type=${type}&isPublish=${ + status || "" + }`; return httpGetInterceptor(url); }