From 8eb87250b401998f87434c2c2402b91b2052a8e4 Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Tue, 15 Apr 2025 11:40:54 +0800 Subject: [PATCH] fix responsive admin collaboration --- .../dev/admin/colab/sub-menu/publish/page.tsx | 1 - .../dev/admin/colab/sub-menu/reject/page.tsx | 1 - .../admin/_components_v3/comp_detail_data.tsx | 12 +- .../comp_pagination_breakpoint.tsx | 4 +- .../comp_simple_grid_breakpoint.tsx | 4 +- .../comp_skeleton_breakpoint.tsx | 10 +- .../admin/colab/detail/detail_group.tsx | 131 ++++++++---------- .../admin/colab/detail/detail_publish.tsx | 56 +++----- .../admin/colab/detail/detail_reject.tsx | 62 ++++----- .../admin/colab/sub_menu/group.tsx | 118 ++++++---------- .../admin/colab/sub_menu/publish.tsx | 100 ++++++------- .../admin/colab/sub_menu/reject.tsx | 114 ++++++--------- 12 files changed, 258 insertions(+), 355 deletions(-) diff --git a/src/app/dev/admin/colab/sub-menu/publish/page.tsx b/src/app/dev/admin/colab/sub-menu/publish/page.tsx index b177e938..df606eb3 100644 --- a/src/app/dev/admin/colab/sub-menu/publish/page.tsx +++ b/src/app/dev/admin/colab/sub-menu/publish/page.tsx @@ -1,5 +1,4 @@ import { AdminColab_TablePublish } from "@/app_modules/admin/colab"; -import adminColab_getListAllPublish from "@/app_modules/admin/colab/fun/get/get_list_all_publish"; export default async function Page() { return ( diff --git a/src/app/dev/admin/colab/sub-menu/reject/page.tsx b/src/app/dev/admin/colab/sub-menu/reject/page.tsx index 898b9f62..98928960 100644 --- a/src/app/dev/admin/colab/sub-menu/reject/page.tsx +++ b/src/app/dev/admin/colab/sub-menu/reject/page.tsx @@ -1,5 +1,4 @@ import { AdminColab_TableRejected } from "@/app_modules/admin/colab"; -import adminColab_getListAllRejected from "@/app_modules/admin/colab/fun/get/get_list_all_reject"; export default async function Page() { diff --git a/src/app_modules/admin/_components_v3/comp_detail_data.tsx b/src/app_modules/admin/_components_v3/comp_detail_data.tsx index 93d30221..258f86da 100644 --- a/src/app_modules/admin/_components_v3/comp_detail_data.tsx +++ b/src/app_modules/admin/_components_v3/comp_detail_data.tsx @@ -1,16 +1,22 @@ import { MainColor } from "@/app_modules/_global/color"; import { Grid, Text } from "@mantine/core"; -export function Admin_V3_ComponentDetail({ item }: { item: Record }) { +export function Admin_V3_ComponentDetail({ + item, +}: { + item: Record; +}) { return ( <> - {item.title} + {item.title || item.label} - {item.value} + + {item.value} + diff --git a/src/app_modules/admin/_components_v3/comp_pagination_breakpoint.tsx b/src/app_modules/admin/_components_v3/comp_pagination_breakpoint.tsx index 0bf7492a..80723cb3 100644 --- a/src/app_modules/admin/_components_v3/comp_pagination_breakpoint.tsx +++ b/src/app_modules/admin/_components_v3/comp_pagination_breakpoint.tsx @@ -17,7 +17,7 @@ export function Admin_V3_ComponentPaginationBreakpoint({ return ( <> { @@ -32,4 +32,4 @@ export function Admin_V3_ComponentPaginationBreakpoint({ /> ); -} \ No newline at end of file +} diff --git a/src/app_modules/admin/_components_v3/comp_simple_grid_breakpoint.tsx b/src/app_modules/admin/_components_v3/comp_simple_grid_breakpoint.tsx index 3e8a24d7..16645ab7 100644 --- a/src/app_modules/admin/_components_v3/comp_simple_grid_breakpoint.tsx +++ b/src/app_modules/admin/_components_v3/comp_simple_grid_breakpoint.tsx @@ -2,13 +2,15 @@ import { SimpleGrid } from "@mantine/core"; export function Admin_V3_ComponentBreakpoint({ children, + cols }: { children: React.ReactNode; + cols?: number; }) { return ( <> - + {Array.from({ length: skeletonRequest || 1 }, (_, index) => ( + + ))} ); diff --git a/src/app_modules/admin/colab/detail/detail_group.tsx b/src/app_modules/admin/colab/detail/detail_group.tsx index c4f95ea2..0d1aa650 100644 --- a/src/app_modules/admin/colab/detail/detail_group.tsx +++ b/src/app_modules/admin/colab/detail/detail_group.tsx @@ -22,6 +22,9 @@ import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamp import { apiGetAdminCollaborationGroupById } from "../lib/api_fetch_admin_collaboration"; import { Admin_ComponentBoxStyle } from "../../_admin_global/_component/comp_admin_boxstyle"; import { IconCaretRight } from "@tabler/icons-react"; +import { Admin_V3_ComponentSkeletonBreakpoint } from "../../_components_v3/comp_skeleton_breakpoint"; +import { Admin_V3_ComponentBreakpoint } from "../../_components_v3/comp_simple_grid_breakpoint"; +import { Admin_V3_ComponentDetail } from "../../_components_v3/comp_detail_data"; function DetailGroup() { const params = useParams<{ id: string }>(); @@ -84,33 +87,22 @@ function DetailGroup() { - - - {!data ? ( - - ) : ( - - - - {listData.map((e, i) => ( - - - - {e.label} - - - : - - {e.value} - - - ))} + {!data ? ( + + ) : ( + + + + + {listData.map((e, i) => ( + + ))} - {/* + {/* */} - - {/* */} @@ -168,17 +130,17 @@ function TableMenu({ listGroup }: { listGroup: any }) { - */} + - {tableRow}
+ {/*
No
+ 		+ Admin Room -
Admin Room
+ Nama Group 		-
Nama Group
- 		-
Industri
+ Industri
Anggota Group
@@ -191,8 +153,7 @@ function TableMenu({ listGroup }: { listGroup: any }) {
- { @@ -246,7 +207,6 @@ function TableMenu({ listGroup }: { listGroup: any }) { - {/* 
{JSON.stringify(detailData, null, 2)}
*/} ); } diff --git a/src/app_modules/admin/colab/sub_menu/publish.tsx b/src/app_modules/admin/colab/sub_menu/publish.tsx index 67732de6..1e01220d 100644 --- a/src/app_modules/admin/colab/sub_menu/publish.tsx +++ b/src/app_modules/admin/colab/sub_menu/publish.tsx @@ -1,42 +1,31 @@ "use client"; +import { AdminColor } from "@/app_modules/_global/color/color_pallet"; +import { MODEL_COLLABORATION } from "@/app_modules/colab/model/interface"; import { - Stack, + Box, + Button, + Center, Group, - Title, + Pagination, Paper, ScrollArea, + Stack, Table, - Center, Text, - Badge, - Spoiler, - Pagination, - Button, - Modal, - TextInput, - Textarea, - Box, + Title, } from "@mantine/core"; -import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate"; -import { MODEL_COLLABORATION } from "@/app_modules/colab/model/interface"; -import { useState } from "react"; -import { useDisclosure, useShallowEffect } from "@mantine/hooks"; -import adminColab_getListAllPublish from "../fun/get/get_list_all_publish"; -import ComponentAdminColab_DetailData from "../component/detail_data"; -import adminColab_getOneByColabId from "../fun/get/get_one_by_colab_id"; -import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan"; -import _ from "lodash"; -import { IconBan, IconCheck, IconEye } from "@tabler/icons-react"; -import adminColab_funReportProjectById from "../fun/edit/fun_report_project_by_id"; -import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; -import { AdminColor } from "@/app_modules/_global/color/color_pallet"; +import { useShallowEffect } from "@mantine/hooks"; +import { IconEye } from "@tabler/icons-react"; import { useRouter } from "next/navigation"; +import { useState } from "react"; +import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate"; -import { clientLogger } from "@/util/clientLogger"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; -import { apiGetAdminCollaborationPublish } from "../lib/api_fetch_admin_collaboration"; import { RouterAdminColab } from "@/lib/router_admin/router_admin_colab"; +import { clientLogger } from "@/util/clientLogger"; +import { apiGetAdminCollaborationPublish } from "../lib/api_fetch_admin_collaboration"; +import { Admin_V3_ComponentPaginationBreakpoint } from "../../_components_v3/comp_pagination_breakpoint"; export default function AdminColab_TablePublish() { return ( @@ -65,24 +54,24 @@ function TableMenu() { try { const response = await apiGetAdminCollaborationPublish({ page: `${activePage}`, - }) + }); if (response?.success && response?.data?.data) { setData(response.data.data); setNPage(response.data.nPage || 1); } else { console.error("Invalid data format recieved", response); - setData([]) + setData([]); } } catch (error) { clientLogger.error("Invalid data table publish", error); setData([]); } - } + }; const onPageCLick = (page: number) => { setActivePage(page); - } + }; const renderTableBody = () => { if (!Array.isArray(data) || data.length === 0) { @@ -94,29 +83,32 @@ function TableMenu() { - ) + ); } return data.map((e, i) => ( - + -
- {e?.Author?.Profile?.name} -
+ + + {e?.Author?.username} + + -
- -
- {e?.title} -
- -
+ + {e?.title} + -
+ {e?.ProjectCollaborationMaster_Industri.name} -
+
@@ -143,7 +135,7 @@ function TableMenu() { )); - } + }; // async function onReport() { // if (report === "") @@ -184,25 +176,20 @@ function TableMenu() { {!data ? ( ) : ( - + - +
{renderTableBody()}
-
Username
+ Username 		-
Title
+ Title 		-
Industri
+ Industri
Jumlah Partisipan
@@ -215,8 +202,7 @@ function TableMenu() {
- { diff --git a/src/app_modules/admin/colab/sub_menu/reject.tsx b/src/app_modules/admin/colab/sub_menu/reject.tsx index ee816e8c..fe649d00 100644 --- a/src/app_modules/admin/colab/sub_menu/reject.tsx +++ b/src/app_modules/admin/colab/sub_menu/reject.tsx @@ -1,31 +1,27 @@ "use client"; +import { AdminColor } from "@/app_modules/_global/color/color_pallet"; +import { MODEL_COLLABORATION } from "@/app_modules/colab/model/interface"; +import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; +import { clientLogger } from "@/util/clientLogger"; import { - Stack, + Box, + Center, Group, - Title, + Pagination, Paper, ScrollArea, + Stack, Table, - Center, Text, - Badge, - Spoiler, - Box, - Pagination, - Button, + Title, } from "@mantine/core"; -import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate"; -import { useState } from "react"; -import { MODEL_COLLABORATION } from "@/app_modules/colab/model/interface"; -import adminColab_getListAllRejected from "../fun/get/get_list_all_reject"; -import { AdminColor } from "@/app_modules/_global/color/color_pallet"; -import { clientLogger } from "@/util/clientLogger"; import { useShallowEffect } from "@mantine/hooks"; -import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; -import { IconEye } from "@tabler/icons-react"; -import { apiGetAdminCollaborationReject } from "../lib/api_fetch_admin_collaboration"; +import { useState } from "react"; import Admin_DetailButton from "../../_admin_global/_component/button/detail_button"; +import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate"; +import { apiGetAdminCollaborationReject } from "../lib/api_fetch_admin_collaboration"; +import { Admin_V3_ComponentPaginationBreakpoint } from "../../_components_v3/comp_pagination_breakpoint"; export default function AdminColab_TableRejected() { return ( @@ -41,35 +37,32 @@ function TableMenu() { const [data, setData] = useState(null); const [isNPage, setNPage] = useState(1); const [activePage, setActivePage] = useState(1); - const [loading, setLoading] = useState(false); - const [idData, setIdData] = useState(""); useShallowEffect(() => { - loadInitialData() - }, [activePage]) + loadInitialData(); + }, [activePage]); const loadInitialData = async () => { try { const response = await apiGetAdminCollaborationReject({ page: `${activePage}`, - }) - + }); + if (response?.success && response?.data?.data) { setData(response.data.data); setNPage(response.data.nPage || 1); } else { console.error("Invalid data format recieved", response); - setData([]) + setData([]); } - } catch (error) { clientLogger.error("Error get data table reject", error); setData([]); } - } + }; const onPageClick = (page: number) => { setActivePage(page); - } + }; const renderTableBody = () => { if (!Array.isArray(data) || data.length === 0) { @@ -81,31 +74,27 @@ function TableMenu() {
- ) + ); } return data.map((e, i) => ( - + -
+ {e?.Author.username} -
+ -
- -
- {e?.title} -
- -
+ + {e?.title} + -
+ {e?.ProjectCollaborationMaster_Industri.name} -
+ @@ -115,25 +104,14 @@ function TableMenu() {
- {/* */} - +
- + )); - } + }; return ( <> @@ -143,7 +121,9 @@ function TableMenu() { p={"xs"} style={{ borderRadius: "6px" }} > - Reject + + Reject + {!data ? ( @@ -151,22 +131,17 @@ function TableMenu() { - +
{renderTableBody()}
-
Username
+ Username 		-
Title
+ Title 		-
Industri
+ Industri
Jumlah Partisipan
@@ -179,10 +154,9 @@ function TableMenu() {
- { onPageClick(val); }} @@ -193,4 +167,4 @@ function TableMenu() { ); -} \ No newline at end of file +}