From 581712953ee4c3e92ba6266ec762b45baad48a60 Mon Sep 17 00:00:00 2001 From: Rama Priyanto Date: Fri, 13 Jun 2025 15:01:48 +0700 Subject: [PATCH] [QUDO-221, 195] feat:new ui rekap admin dashboard, fix:landing mobile ver --- components/landing/banner-new.tsx | 4 +- .../main/dashboard/dashboard-container.tsx | 153 ++++++++++++++++-- services/article.ts | 25 ++- .../http-config/http-interceptor-services.ts | 8 +- 4 files changed, 165 insertions(+), 25 deletions(-) diff --git a/components/landing/banner-new.tsx b/components/landing/banner-new.tsx index 014b476..7bcfb93 100644 --- a/components/landing/banner-new.tsx +++ b/components/landing/banner-new.tsx @@ -222,7 +222,7 @@ export default function BannerHumasNew() { return (
{jumbotronList?.length > 0 ? ( @@ -241,7 +241,7 @@ export default function BannerHumasNew() { alt={`humasbanner-${index}`} width={1960} height={1080} - className="w-screen h-[45vh] lg:h-[93vh] object-cover object-center opacity-[25] dark:opacity-70 rounded-none" + className="w-screen h-[60vh] lg:h-[93vh] object-cover object-center opacity-[25] dark:opacity-70 rounded-none" /> )) diff --git a/components/main/dashboard/dashboard-container.tsx b/components/main/dashboard/dashboard-container.tsx index fc027bd..ac0a2d6 100644 --- a/components/main/dashboard/dashboard-container.tsx +++ b/components/main/dashboard/dashboard-container.tsx @@ -9,6 +9,8 @@ import { } from "@/components/icons/dashboard-icon"; import { Submenu1Icon } from "@/components/icons/sidebar-icon"; import { + Accordion, + AccordionItem, Button, Calendar, Checkbox, @@ -21,6 +23,7 @@ import { Select, SelectItem, SelectSection, + Skeleton, } from "@heroui/react"; import ApexChartColumn from "./chart/column-chart"; import ApexChartDonut from "./chart/donut-chart"; @@ -103,6 +106,10 @@ export default function DashboardContainer() { const [topPages, setTopPages] = useState([]); const [postCount, setPostCount] = useState([]); + const [polresData, setPolresData] = useState({}); + const [selectedAccordion, setSelectedAccordion] = useState(new Set([])); + + const roleId = Cookies.get("urie"); useEffect(() => { fetchSummary(); @@ -171,7 +178,7 @@ export default function DashboardContainer() { getDate(postContentDate.startDate), getDate(postContentDate.endDate) ); - setPostCount(getTableNumber(10, res?.data?.data)); + setPostCount(getTableNumberStats(res?.data?.data)); } const getTableNumber = (limit: number, data: any) => { @@ -187,6 +194,18 @@ export default function DashboardContainer() { } }; + const getTableNumberStats = (data: any) => { + if (data) { + let iterate = 0; + const newData = data.map((value: any) => { + iterate++; + value.no = iterate; + return value; + }); + return newData; + } + }; + const getMonthYear = (date: any) => { return date.month + " " + date.year; }; @@ -213,6 +232,50 @@ export default function DashboardContainer() { return month + " " + year; }; + useEffect(() => { + const temp = Array.from(selectedAccordion); + console.log("selecette", temp); + if (temp.length > 0) { + for (const element of temp) { + getPolresData(Number(element)); + } + } + }, [postContentDate]); + + const getPolresData = async (id: number) => { + const getDate = (data: any) => { + return `${data.year}-${data.month < 10 ? `0${data.month}` : data.month}-${ + data.day < 10 ? `0${data.day}` : data.day + }`; + }; + const res = await getUserLevelDataStat( + getDate(postContentDate.startDate), + getDate(postContentDate.endDate), + id + ); + const polresNowData = getTableNumberStats(res?.data?.data); + + setPolresData((prev: any) => ({ + ...prev, + [id]: polresNowData, + })); + }; + + const handleSelectionChange = (e: any) => { + const prev = selectedAccordion; + const current = e; + + const currentArray = Array.from(current); + + const added = Number(currentArray.filter((item) => !prev.has(item))[0]); + + setSelectedAccordion(current); + + if (added) { + getPolresData(added); + } + }; + return (
@@ -330,22 +393,86 @@ export default function DashboardContainer() {
- {postCount?.map((list) => ( -
handleSelectionChange(e)} + selectionMode="multiple" + className="w-full" > -
{list?.no}
-
{list?.userLevelName}
+ {postCount?.map((list) => ( + +
{list?.no}
+
{list?.userLevelName}
+
+ {list?.totalArticle} +
+
+ } + > + {polresData[list?.userLevelId] ? ( + polresData[list?.userLevelId]?.map( + (child: any, index: number) => ( +
+
+
+ {child?.userLevelName} +
+
+ {child?.totalArticle} +
+
+ ) + ) + ) : ( + + )} + + ))} + + ) : ( + postCount?.map((list) => (
- {list?.totalArticle} +
{list?.no}
+
{list?.userLevelName}
+
+ {list?.totalArticle} +
-
- ))} + )) + )}
diff --git a/services/article.ts b/services/article.ts index 71102cc..a1bd358 100644 --- a/services/article.ts +++ b/services/article.ts @@ -7,6 +7,10 @@ import { } from "./http-config/axios-base-service"; import Cookies from "js-cookie"; import { stat } from "fs"; +import { + httpGetInterceptor, + httpPostInterceptor, +} from "./http-config/http-interceptor-services"; const token = Cookies.get("access_token"); export async function getListArticle(props: PaginationRequest) { @@ -184,14 +188,19 @@ export async function deleteArticleFiles(id: number) { return await httpPut(`article-files/delete/${id}`, headers); } -export async function getUserLevelDataStat(startDate: string, endDate: string) { - const headers = { - "content-type": "application/json", - Authorization: `Bearer ${token}`, - }; - return await httpGet( - `/articles/statistic/user-levels?startDate=${startDate}&endDate=${endDate}`, - headers +export async function getUserLevelDataStat( + startDate: string, + endDate: string, + levelId?: number +) { + // const headers = { + // "content-type": "application/json", + // Authorization: `Bearer ${token}`, + // }; + return await httpGetInterceptor( + `/articles/statistic/user-levels?startDate=${startDate}&endDate=${endDate}&userLevelId=${ + levelId || "" + }` ); } export async function getStatisticMonthly(year: string) { diff --git a/services/http-config/http-interceptor-services.ts b/services/http-config/http-interceptor-services.ts index ff772b2..3fcd2ca 100644 --- a/services/http-config/http-interceptor-services.ts +++ b/services/http-config/http-interceptor-services.ts @@ -1,6 +1,6 @@ import { useRouter } from "next/navigation"; -import axiosInterceptorInstance from "./axios-interceptor-instance"; import Cookies from "js-cookie"; +import axiosInterceptorInstance from "./axios-interceptor-service"; export async function httpGetInterceptor(pathUrl: any) { const response = await axiosInterceptorInstance @@ -28,7 +28,11 @@ export async function httpGetInterceptor(pathUrl: any) { } } -export async function httpPostInterceptor(pathUrl: any, data: any, headers?: any) { +export async function httpPostInterceptor( + pathUrl: any, + data: any, + headers?: any +) { const response = await axiosInterceptorInstance .post(pathUrl, data, { headers }) .catch((error) => error.response);