wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #277 from bipproduction/Nico/05-feb-25

Browse Source 
API ADMIN DASHBOARD DONASI
This commit is contained in:
Bagasbanuna02
2025-02-05 17:53:31 +08:00
committed by GitHub
parent 0d515797f5 ad653c996b
commit 4e1224af8f
12 changed files with 679 additions and 409 deletions
Download Patch File Download Diff File Expand all files Collapse all files

152
src/app/api/admin/donasi/[status]/route.ts Normal file
View File

@@ -0,0 +1,152 @@
import { prisma } from "@/app/lib";
import backendLogger from "@/util/backendLogger";
import { data } from "autoprefixer";
import _, { take } from "lodash";
import moment from "moment";
import { NextResponse } from "next/server";
export async function GET(request: Request,
{ params }: { params: { status: string } }) {
const method = request.method;
if (method !== "GET") {
return NextResponse.json({
succes: false,
message: "Method not allowed"
},
{ status: 405 }
);
}
const { status } = params;
const { searchParams } = new URL(request.url);
const search = searchParams.get("search");
const page = searchParams.get("page");
const takeData = 10;
const skipData = Number(page) * takeData - takeData;
try {
let fixData;
const fixStatus = _.startCase(status);
if (!page && !search) {
fixData = await prisma.donasi.findMany({
orderBy: {
updatedAt: "desc",
},
where: {
active: true,
DonasiMaster_Status: {
name: fixStatus
}
},
include: {
Author: {
select: {
id: true,
username: true,
Profile: {
select: {
name: true
}
}
}
},
DonasiMaster_Status: true,
DonasiMaster_Ketegori: true,
DonasiMaster_Durasi: true
}
})
} else if (!page && search) {
fixData = await prisma.donasi.findMany({
orderBy: {
updatedAt: "desc"
},
where: {
active: true,
DonasiMaster_Status: {
name: fixStatus
},
title: {
contains: search,
mode: "insensitive"
}
},
include: {
Author: {
select: {
id: true,
username: true,
Profile: {
select: {
name: true
}
}
}
},
DonasiMaster_Status: true,
DonasiMaster_Ketegori: true,
DonasiMaster_Durasi: true
}
})
} else if (page && !search) {
const data = await prisma.donasi.findMany({
take: takeData,
skip: skipData,
orderBy: [
{
publishTime: "desc"
}
],
where: {
active: true,
DonasiMaster_Status: {
name: fixStatus
}
},
include: {
Author: true,
imageDonasi: true,
DonasiMaster_Status: true,
DonasiMaster_Ketegori: true,
DonasiMaster_Durasi: true
}
})
const nCount = await prisma.donasi.count({
where: {
active: true,
DonasiMaster_Status: {
name: fixStatus
},
}
})
console.log("data >", data)
fixData = {
data: data,
nCount: _.ceil(nCount / takeData)
}
}
return NextResponse.json({
success: true,
message: "Success",
data: fixData
},
{ status: 200 }
)
} catch (error) {
backendLogger.error("Error geta data table donasi event dashboard>>", error)
return NextResponse.json({
success: false,
message: "Failed get data table donasi dashboard",
reason: (error as Error).message
},
{ status: 500 }
);
} finally {
await prisma.$disconnect();
}
}

8
src/app/dev/admin/donasi/sub-menu/publish/page.tsx
View File

@@ -2,11 +2,11 @@ import { AdminDonasi_TablePublish } from "@/app_modules/admin/donasi";
import adminDonasi_getListPublish from "@/app_modules/admin/donasi/fun/get/get_list_publish";
export default async function Page() {
const listPublish = await adminDonasi_getListPublish({
page: 1,
});
// const listPublish = await adminDonasi_getListPublish({
// page: 1,
// });
// console.log(listPublish)
return<>
<AdminDonasi_TablePublish listPublish={listPublish as any}/>
<AdminDonasi_TablePublish />
</>
}

4
src/app/dev/admin/donasi/sub-menu/reject/page.tsx
View File

@@ -2,11 +2,11 @@ import { AdminDonasi_TableReject } from "@/app_modules/admin/donasi";
import adminDonasi_getListReject from "@/app_modules/admin/donasi/fun/get/get_list_reject";
export default async function Page() {
const dataReject = await adminDonasi_getListReject({ page: 1 });
// const dataReject = await adminDonasi_getListReject({ page: 1 });
// console.log(dataReject)
return (
<>
<AdminDonasi_TableReject dataReject={dataReject as any} />
<AdminDonasi_TableReject />
</>
);
}

4
src/app/dev/admin/donasi/sub-menu/review/page.tsx
View File

@@ -2,7 +2,7 @@ import { AdminDonasi_TableReview } from "@/app_modules/admin/donasi";
import adminDonasi_getListReview from "@/app_modules/admin/donasi/fun/get/get_list_review";
export default async function Page() {
const listReview = await adminDonasi_getListReview({page: 1});
// const listReview = await adminDonasi_getListReview({page: 1});
// console.log(listReview);
return <AdminDonasi_TableReview listReview={listReview as any} />;
return <AdminDonasi_TableReview />;
}

4
src/app/dev/admin/investasi/sub-menu/publish/page.tsx
View File

@@ -2,11 +2,11 @@ import { Admin_TablePublishInvestasi } from "@/app_modules/admin/investasi";
import { adminInvestasi_funGetAllPublish } from "@/app_modules/admin/investasi/fun/get/get_all_publish";
export default async function Page() {
const listInvestasi = await adminInvestasi_funGetAllPublish({page: 1});
// const listInvestasi = await adminInvestasi_funGetAllPublish({page: 1});
return (
<>
<Admin_TablePublishInvestasi dataInvestsi={listInvestasi as any} />
<Admin_TablePublishInvestasi />
</>
);
}

44
src/app_modules/admin/donasi/lib/api_fetch_admin_donasi.ts
View File

@@ -1,12 +1,13 @@
export {
apiGetDonasiStatusCountDashboard,
apiGetDonasiKategoriCountDashboard
apiGetAdminDonasiStatusCountDashboard,
apiGetAdminDonasiKategoriCountDashboard,
apiGetAdminDonasiByStatus
};
const apiGetDonasiStatusCountDashboard = async ({ name }:
const apiGetAdminDonasiStatusCountDashboard = async ({ name }:
{ name: "Publish" | "Review" | "Reject" }) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
const response = await fetch(`/api/admin/donasi/dashboard/${name}`, {
method: "GET",
headers: {
@@ -19,7 +20,7 @@ const apiGetDonasiStatusCountDashboard = async ({ name }:
return await response.json().catch(() => null);
};
const apiGetDonasiKategoriCountDashboard = async () => {
const apiGetAdminDonasiKategoriCountDashboard = async () => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
@@ -33,4 +34,35 @@ const apiGetDonasiKategoriCountDashboard = async () => {
}
});
return await response.json().catch(() => null);
}
}
const apiGetAdminDonasiByStatus = async ({
status,
page,
search }: {
status: "Publish" | "Review" | "Reject",
page: string;
search: string;
}) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
console.log("Ini token", token)
console.log("Ini Page", page)
console.log("Ini search", search)
const isPage = page ? `?page=${page}` : "";
const isSearch = search ? `&search=${search}` : "";
const response = await fetch(
`/api/admin/donasi/${status}${isPage}${isSearch}`,
{
headers: {
"Content-Type": "application/json",
Accept: "application/json",
"Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`
}
}
)
console.log("Ini response", response)
return await response.json().catch(() => null);
}

11
src/app_modules/admin/donasi/main/index.tsx
View File

@@ -25,7 +25,8 @@ import { clientLogger } from "@/util/clientLogger";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import global_limit from "@/app/lib/limit";
import { useShallowEffect } from "@mantine/hooks";
import { apiGetDonasiKategoriCountDashboard, apiGetDonasiStatusCountDashboard } from "../lib/api_fetch_admin_donasi";
import { apiGetAdminDonasiKategoriCountDashboard, apiGetAdminDonasiStatusCountDashboard } from "../lib/api_fetch_admin_donasi";
export default function AdminDonasi_Main({
// countPublish,
@@ -62,7 +63,7 @@ export default function AdminDonasi_Main({
}
async function onLoadCountPublish() {
try {
const response = await apiGetDonasiStatusCountDashboard({
const response = await apiGetAdminDonasiStatusCountDashboard({
name: "Publish",
})
@@ -75,7 +76,7 @@ export default function AdminDonasi_Main({
}
async function onLoadCountReview() {
try {
const response = await apiGetDonasiStatusCountDashboard({
const response = await apiGetAdminDonasiStatusCountDashboard({
name: "Review",
})
if (response) {
@@ -87,7 +88,7 @@ export default function AdminDonasi_Main({
}
async function onLoadCountReject() {
try {
const response = await apiGetDonasiStatusCountDashboard({
const response = await apiGetAdminDonasiStatusCountDashboard({
name: "Reject",
})
if (response) {
@@ -99,7 +100,7 @@ export default function AdminDonasi_Main({
}
async function onLoadCountKategori() {
try {
const response = await apiGetDonasiKategoriCountDashboard()
const response = await apiGetAdminDonasiKategoriCountDashboard()
if (response) {
setCountKategori(response.data);
}

270
src/app_modules/admin/donasi/sub_menu/table_publish.tsx
View File

@@ -12,6 +12,7 @@ import {
ScrollArea,
Stack,
Table,
Text,
TextInput,
Title
} from "@mantine/core";
@@ -23,94 +24,120 @@ import adminDonasi_getListPublish from "../fun/get/get_list_publish";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { useShallowEffect } from "@mantine/hooks";
import { clientLogger } from "@/util/clientLogger";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminDonasi_TablePublish({
listPublish,
}: {
listPublish: any;
}) {
export default function AdminDonasi_TablePublish() {
return (
<>
<Stack h={"100%"}>
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
<TableStatus listPublish={listPublish as any} />
<TableStatus />
</Stack>
</>
);
}
function TableStatus({ listPublish }: { listPublish: any }) {
function TableStatus() {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
const [idData, setIdData] = useState("");
const [data, setData] = useState<MODEL_DONASI[]>(listPublish.data);
const [isNPage, setNPage] = useState(listPublish.nPage);
const [data, setData] = useState<MODEL_DONASI[] | null>(null);
const [isNPage, setNPage] = useState<number>(1);
const [isActivePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState("");
async function onSearch(s: string) {
setSearch(s);
const loadData = await adminDonasi_getListPublish({
page: 1,
search: s,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
useShallowEffect(() => {
const loadInitialData = async () => {
try {
const response = await apiGetAdminDonasiByStatus({
status: "Publish",
page: `${isActivePage}`,
search: isSearch
})
if (response?.success && response?.data.data) {
setData(response.data.data);
setNPage(response.data.nPage || 1);
} else {
console.error("Invalid data format recieved:", response);
setData([]);
}
} catch (error) {
clientLogger.error("Invalid data format recieved:", error);
setData([]);
}
}
loadInitialData();
}, [isActivePage, isSearch])
const onSearch = (searchTerm: string) => {
setSearch(searchTerm);
setActivePage(1);
}
async function onPageClick(p: any) {
setActivePage(p);
const loadData = await adminDonasi_getListPublish({
search: isSearch,
page: p,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
const onPageClick = (page: number) => {
setActivePage(page);
}
const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) {
return (
<tr>
<td colSpan={12}>
<Center>
<Text color="gray">Tidak ada data</Text>
</Center>
</td>
</tr>
)
}
return data.map((e, i) => (
<tr key={i}>
<td>
<Center c={AccentColor.white}>{e.title}</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.target} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.terkumpul} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>{e.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
loaderPosition="center"
loading={isLoading && e?.id === idData ? true : false}
style={{ backgroundColor: MainColor.green, }}
c={AccentColor.white}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() => {
setLoading(true);
setIdData(e?.id);
router.push(RouterAdminDonasi_OLD.detail_publish + `${e.id}`);
}}
>
Tampilkan
</Button>
</Center>
</td>
</tr>
));
}
const TableRows = data.map((e, i) => (
<tr key={i}>
<td>
<Center c={AccentColor.white}>{e.title}</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.target} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.terkumpul} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>{e.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
loaderPosition="center"
loading={isLoading && e?.id === idData ? true : false}
style={{ backgroundColor: MainColor.green, }}
c={AccentColor.white}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() => {
setLoading(true);
setIdData(e?.id);
router.push(RouterAdminDonasi_OLD.detail_publish + `${e.id}`);
}}
>
Tampilkan
</Button>
</Center>
</td>
</tr>
));
return (
<>
@@ -121,13 +148,13 @@ function TableStatus({ listPublish }: { listPublish: any }) {
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
}
/>
{/* <Group
@@ -147,52 +174,57 @@ function TableStatus({ listPublish }: { listPublish: any }) {
/>
</Group> */}
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
>
<thead>
<tr>
<th>
<Center c={AccentColor.white}>Judul</Center>
</th>
<th>
<Center c={AccentColor.white}>Target</Center>
</th>
<th>
<Center c={AccentColor.white}>Terkumpul</Center>
</th>
<th>
<Center c={AccentColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AccentColor.white}>Durasi</Center>
</th>
<th>
<Center c={AccentColor.white}>Aksi</Center>
</th>
</tr>
</thead>
<tbody>{TableRows}</tbody>
</Table>
</ScrollArea>
{/* <ScrollArea>
{!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} />
) : (
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
>
<thead>
<tr>
<th>
<Center c={AccentColor.white}>Judul</Center>
</th>
<th>
<Center c={AccentColor.white}>Target</Center>
</th>
<th>
<Center c={AccentColor.white}>Terkumpul</Center>
</th>
<th>
<Center c={AccentColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AccentColor.white}>Durasi</Center>
</th>
<th>
<Center c={AccentColor.white}>Aksi</Center>
</th>
</tr>
</thead>
<tbody>{renderTableBody()}</tbody>
</Table>
</ScrollArea>
{/* <ScrollArea>
</ScrollArea> */}
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
)}
</Stack>
</>
);

271
src/app_modules/admin/donasi/sub_menu/table_reject.tsx
View File

@@ -18,7 +18,7 @@ import {
TextInput,
Title
} from "@mantine/core";
import { useDisclosure } from "@mantine/hooks";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconEyeEdit, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
@@ -26,90 +26,118 @@ import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import adminDonasi_getListReject from "../fun/get/get_list_reject";
import { IconEyeCheck } from "@tabler/icons-react";
import { clientLogger } from "@/util/clientLogger";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminDonasi_TableReject({
dataReject,
}: {
dataReject: any;
}) {
export default function AdminDonasi_TableReject() {
return (
<>
<Stack h={"100%"}>
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
<TableStatus dataReject={dataReject} />
<TableStatus />
</Stack>
</>
);
}
function TableStatus({ dataReject }: { dataReject: any }) {
function TableStatus() {
const router = useRouter();
const [opened, { open, close }] = useDisclosure(false);
const [isLoading, setLoading] = useState(false);
const [idData, setIdData] = useState("");
const [data, setData] = useState<MODEL_DONASI[]>(dataReject.data);
const [isNPage, setNPage] = useState(dataReject.nPage);
const [data, setData] = useState<MODEL_DONASI[] | null>(null);
const [isNPage, setNPage] = useState<number>(1);
const [isActivePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState("");
async function onSearch(s: string) {
setSearch(s);
const loadData = await adminDonasi_getListReject({
page: 1,
search: s,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
useShallowEffect(() => {
const loadInitialData = async () => {
try {
const response = await apiGetAdminDonasiByStatus({
status: "Reject",
page: `${isActivePage}`,
search: isSearch
})
if (response?.success && response?.data.data) {
setData(response.data.data);
setNPage(response.data.nPage || 1);
} else {
console.error("Invalid data format recieved:", response);
setData([]);
}
} catch (error) {
clientLogger.error("Invalid data format recieved:", error);
setData([]);
}
}
loadInitialData();
}, [isActivePage, isSearch])
const onSearch = (searchTerm: string) => {
setSearch(searchTerm);
setActivePage(1);
}
async function onPageClick(p: any) {
setActivePage(p);
const loadData = await adminDonasi_getListReject({
search: isSearch,
page: p,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
const onPageClick = (page: number) => {
setActivePage(page);
}
const TableRows = data.map((e, i) => (
<tr key={i}>
<td>
<Center c={AccentColor.white}>{e?.Author?.username}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.title}</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah color="black" nominal={+e.target} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
style={{ backgroundColor: MainColor.green }}
color={AccentColor.white}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() =>
router.push(RouterAdminDonasi_OLD.detail_reject + `${e.id}`)
}
>
Lihat Alasan
</Button>
</Center>
const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) {
return (
<tr>
<td colSpan={12}>
<Center>
<Text color="gray">Tidak ada data</Text>
</Center>
</td>
</tr>
)
}
return data.map((e, i) => (
<tr key={i}>
<td>
<Center c={AccentColor.white}>{e?.Author?.username}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.title}</Center>
</td>
<td>
<Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.target} />
</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
style={{ backgroundColor: MainColor.green }}
color={AccentColor.white}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() =>
router.push(RouterAdminDonasi_OLD.detail_reject + `${e.id}`)
}
>
Lihat Alasan
</Button>
</Center>
{/* <ModalReject opened={opened} close={close} /> */}
</td>
</tr>
));
}
{/* <ModalReject opened={opened} close={close} /> */}
</td>
</tr>
));
return (
<>
@@ -120,13 +148,13 @@ function TableStatus({ dataReject }: { dataReject: any }) {
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
}
/>
{/* <Group
@@ -146,55 +174,60 @@ function TableStatus({ dataReject }: { dataReject: any }) {
/>
</Group> */}
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
>
<thead>
<tr>
<th>
<Center c={AccentColor.white}>Username</Center>
</th>
<th>
<Center c={AccentColor.white}>Judul</Center>
</th>
<th>
<Center c={AccentColor.white}>Target</Center>
</th>
<th>
<Center c={AccentColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AccentColor.white}>Durasi</Center>
</th>
<th>
<Center c={AccentColor.white}>Alasan</Center>
</th>
</tr>
</thead>
<tbody>{TableRows}</tbody>
</Table>
</ScrollArea>
{/* <ScrollArea>
</ScrollArea> */}
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
</Stack>
{!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} />
) : (
{data.map((e, i) => (
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
>
<thead>
<tr>
<th>
<Center c={AccentColor.white}>Username</Center>
</th>
<th>
<Center c={AccentColor.white}>Judul</Center>
</th>
<th>
<Center c={AccentColor.white}>Target</Center>
</th>
<th>
<Center c={AccentColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AccentColor.white}>Durasi</Center>
</th>
<th>
<Center c={AccentColor.white}>Alasan</Center>
</th>
</tr>
</thead>
<tbody>{renderTableBody()}</tbody>
</Table>
</ScrollArea>
{/* <ScrollArea>
</ScrollArea> */}
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
)}
</Stack>
{/* {data.map((e, i) => (
<Modal
key={e.id}
opened={opened}
@@ -207,7 +240,7 @@ function TableStatus({ dataReject }: { dataReject: any }) {
<Text>{i}</Text>
</Stack>
</Modal>
))}
))} */}
</>
);
}

304
src/app_modules/admin/donasi/sub_menu/table_review.tsx
View File

@@ -16,6 +16,7 @@ import {
ScrollArea,
Stack,
Table,
Text,
TextInput,
Title,
} from "@mantine/core";
@@ -28,28 +29,28 @@ import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamp
import adminDonasi_getListReview from "../fun/get/get_list_review";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import { error } from "console";
import { clientLogger } from "@/util/clientLogger";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminDonasi_TableReview({
listReview,
}: {
listReview: MODEL_DONASI[];
}) {
export default function AdminDonasi_TableReview() {
return (
<>
<Stack h={"100%"}>
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
<TableStatus listReview={listReview} />
<TableStatus />
</Stack>
</>
);
}
function TableStatus({ listReview }: { listReview: any }) {
function TableStatus() {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
const [idData, setIdData] = useState("");
const [data, setData] = useState<MODEL_DONASI[]>(listReview.data);
const [isNPage, setNPage] = useState(listReview.nPage);
const [data, setData] = useState<MODEL_DONASI[] | null>(null);
const [isNPage, setNPage] = useState<number>(1);
const [isActivePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState("");
@@ -61,80 +62,100 @@ function TableStatus({ listReview }: { listReview: any }) {
const [isLoadingReload, setLoadingReload] = useState(false);
useShallowEffect(() => {
if (isAdminDonasi_TriggerReview) {
setIsShowReload(true);
loadInitialData();
}, [isActivePage, isSearch]);
const loadInitialData = async () => {
try {
const response = await apiGetAdminDonasiByStatus({
status: "Review",
page: `${isActivePage}`,
search: isSearch
})
console.log("IniData", response)
if (response?.success && response?.data?.data) {
setData(response.data.data);
setNPage(response.data.nPage || 1);
} else {
console.error("Invalid data format received:", response);
setData([]);
}
} catch (error) {
clientLogger.error("Error get data table publish", error);
setData([]);
}
}, [isAdminDonasi_TriggerReview, setIsShowReload]);
}
async function onLoadData() {
const loadData = await adminDonasi_getListReview({ page: 1 });
setData(loadData.data as any);
setNPage(loadData.nPage);
loadInitialData();
setLoadingReload(false);
setIsShowReload(false);
setIsAdminDonasi_TriggerReview(false);
}
async function onSearch(s: string) {
setSearch(s);
const loadData = await adminDonasi_getListReview({
page: 1,
search: s,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
const onSearch = async (searchTerm: string) => {
setSearch(searchTerm);
setActivePage(1);
}
async function onPageClick(p: any) {
setActivePage(p);
const loadData = await adminDonasi_getListReview({
search: isSearch,
page: p,
});
setData(loadData.data as any);
setNPage(loadData.nPage);
const onPageClick = (page: number) => {
setActivePage(page);
}
const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) {
return (
<tr>
<td colSpan={12}>
<Center>
<Text color="gray">Tidak ada data</Text>
</Center>
</td>
</tr>
)
}
return data.map((e, i) => (
<tr key={i}>
<td>
<Center c={AdminColor.white}>{e?.Author?.username}</Center>
</td>
<td>
<Center c={AdminColor.white}>{e?.title}</Center>
</td>
<td>
<Center c={AdminColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.target} />
</Center>
</td>
<td>
<Center c={AdminColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center c={AdminColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
loaderPosition="center"
loading={isLoading && e?.id == idData ? true : false}
style={{ backgroundColor: MainColor.green, color: AccentColor.white }}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() => {
setLoading(true);
setIdData(e?.id);
router.push(RouterAdminDonasi_OLD.detail_review + `${e?.id}`);
}}
>
Tampilkan
</Button>
</Center>
</td>
</tr>
));
}
const TableRows = data.map((e, i) => (
<tr key={i}>
<td>
<Center>{e?.Author?.username}</Center>
</td>
<td>
<Center>{e?.title}</Center>
</td>
<td>
<Center>
<ComponentGlobal_TampilanRupiah color="black" nominal={+e.target} />
</Center>
</td>
<td>
<Center>{e?.DonasiMaster_Ketegori.name}</Center>
</td>
<td>
<Center>{e?.DonasiMaster_Durasi.name} hari</Center>
</td>
<td>
<Center>
<Button
loaderPosition="center"
loading={isLoading && e?.id == idData ? true : false}
style={{ backgroundColor: MainColor.green, color: AccentColor.white }}
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() => {
setLoading(true);
setIdData(e?.id);
router.push(RouterAdminDonasi_OLD.detail_review + `${e?.id}`);
}}
>
Tampilkan
</Button>
</Center>
</td>
</tr>
));
return (
<>
@@ -142,7 +163,7 @@ function TableStatus({ listReview }: { listReview: any }) {
{/* <pre>{JSON.stringify(listUser, null, 2)}</pre> */}
<ComponentAdminGlobal_TitlePage
name="Review"
color={AdminColor.orange}
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
@@ -170,74 +191,77 @@ function TableStatus({ listReview }: { listReview: any }) {
}}
/>
</Group> */}
{!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} />
) : (
<Paper p={"md"} bg={AdminColor.softBlue} h={"80vh"}>
{isShowReload && (
<Affix position={{ top: rem(200) }} w={"100%"}>
<Center>
<Button
style={{
transition: "0.5s",
border: `1px solid ${AccentColor.skyblue}`,
}}
bg={AccentColor.blue}
loaderPosition="center"
loading={isLoadingReload}
radius={"xl"}
opacity={0.8}
onClick={() => onLoadData()}
leftIcon={<IconRefresh />}
>
Update Data
</Button>
</Center>
</Affix>
)}
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
h={"100%"}
>
<thead>
<tr>
<th>
<Center c={AdminColor.white}>Username</Center>
</th>
<th>
<Center c={AdminColor.white}>Judul</Center>
</th>
<th>
<Center c={AdminColor.white}>Target</Center>
</th>
<th>
<Center c={AdminColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AdminColor.white}>Durasi</Center>
</th>
<th>
<Center c={AdminColor.white}>Aksi</Center>
</th>
</tr>
</thead>
<tbody>{renderTableBody()}</tbody>
</Table>
</ScrollArea>
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
)}
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
{isShowReload && (
<Affix position={{ top: rem(200) }} w={"100%"}>
<Center>
<Button
style={{
transition: "0.5s",
border: `1px solid ${AccentColor.skyblue}`,
}}
bg={AccentColor.blue}
loaderPosition="center"
loading={isLoadingReload}
radius={"xl"}
opacity={0.8}
onClick={() => onLoadData()}
leftIcon={<IconRefresh />}
>
Update Data
</Button>
</Center>
</Affix>
)}
<ScrollArea w={"100%"} h={"90%"}>
<Table
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1500}
h={"100%"}
striped
highlightOnHover
>
<thead>
<tr>
<th>
<Center>Username</Center>
</th>
<th>
<Center>Judul</Center>
</th>
<th>
<Center>Target</Center>
</th>
<th>
<Center>Ketegori</Center>
</th>
<th>
<Center>Durasi</Center>
</th>
<th>
<Center>Aksi</Center>
</th>
</tr>
</thead>
<tbody>{TableRows}</tbody>
</Table>
</ScrollArea>
<Center mt={"xl"}>
<Pagination
value={isActivePage}
total={isNPage}
onChange={(val) => {
onPageClick(val);
}}
/>
</Center>
</Paper>
</Stack>
</>
);

14
src/app_modules/admin/investasi/main/table_publish.tsx
View File

@@ -30,26 +30,22 @@ import { useShallowEffect } from "@mantine/hooks";
import { clientLogger } from "@/util/clientLogger";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function Admin_TablePublishInvestasi({
dataInvestsi,
}: {
dataInvestsi: MODEL_INVESTASI[];
}) {
export default function Admin_TablePublishInvestasi() {
return (
<>
<Stack>
<ComponentAdminGlobal_HeaderTamplate name="Investasi" />
<TableView listData={dataInvestsi} />
<TableView />
{/* <pre>{JSON.stringify(listPublish, null, 2)}</pre> */}
</Stack>
</>
);
}
function TableView({ listData }: { listData: any }) {
function TableView() {
const router = useRouter();
const [data, setData] = useState<MODEL_INVESTASI[]>(listData.data);
const [nPage, setNPage] = useState(listData.nPage);
const [data, setData] = useState<MODEL_INVESTASI[] | null>(null);
const [nPage, setNPage] = useState<number>(1);
const [activePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState("");
const [isLoading, setLoading] = useState(false);

2
src/middleware.ts
View File

@@ -39,7 +39,7 @@ const middlewareConfig: MiddlewareConfig = {
// ADMIN API
// "/api/admin/event/*",
// "/api/admin/investasi/*",
// "/api/admin/donasi/dashboard/*",
"/api/admin/donasi/*",
// "/api/admin/voting/dashboard/*",
// "/api/admin/job/dashboard/*",
// "/api/admin/forum/dashboard/*",