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

fix button detail

Browse Source 
- fix admin table donasi
- fix admin event status on detail data
This commit is contained in:
Bagasbanuna02
2025-03-26 14:45:09 +08:00
parent a779278ba6
commit 0dcdfa6df3
9 changed files with 242 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/dev/admin/donasi/detail/publish/[id]/page.tsx
View File

@@ -1,29 +1,18 @@
import { AdminDonasi_DetailPublish } from "@/app_modules/admin/donasi"; import { AdminDonasi_DetailPublish } from "@/app_modules/admin/donasi";
import { AdminDonasi_funCountDonatur } from "@/app_modules/admin/donasi/fun/count/fun_count_donatur"; import { AdminDonasi_funCountDonatur } from "@/app_modules/admin/donasi/fun/count/fun_count_donatur";
import { adminDonasi_getListDonatur } from "@/app_modules/admin/donasi/fun/get/get_list_donatur_by_id";
import { AdminDonasi_getListPencairanDana } from "@/app_modules/admin/donasi/fun/get/get_list_pencairan_dana_by_id"; import { AdminDonasi_getListPencairanDana } from "@/app_modules/admin/donasi/fun/get/get_list_pencairan_dana_by_id";
import { AdminDonasi_getOneById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
import adminDonasi_getMasterStatus from "@/app_modules/admin/donasi/fun/master/get_status_id";
export default async function Page({ params }: { params: { id: string } }) { export default async function Page({ params }: { params: { id: string } }) {
let donasiId = params.id; let donasiId = params.id;
// const dataPublish = await AdminDonasi_getOneById(params.id); // const dataPublish = await AdminDonasi_getOneById(params.id);
const countDonatur = await AdminDonasi_funCountDonatur(params.id); const countDonatur = await AdminDonasi_funCountDonatur(params.id);
const listMasterStatus = await adminDonasi_getMasterStatus();
const listDonatur = await adminDonasi_getListDonatur({
donasiId: donasiId,
page: 1,
});
const listPencairan = await AdminDonasi_getListPencairanDana(params.id); const listPencairan = await AdminDonasi_getListPencairanDana(params.id);
return ( return (
<> <>
<AdminDonasi_DetailPublish <AdminDonasi_DetailPublish
// dataPublish={dataPublish as any}
// listDonatur={listDonatur as any}
countDonatur={countDonatur} countDonatur={countDonatur}
listPencairan={listPencairan as any} listPencairan={listPencairan as any}
// listMasterStatus={listMasterStatus as any}
/> />
</> </>
); );

9
src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx
View File

@@ -8,12 +8,16 @@ export function Admin_ComponentModal({
onClose, onClose,
title, title,
size, size,
withCloseButton,
closeOnClickOutside,
}: { }: {
children: React.ReactNode; children: React.ReactNode;
opened: boolean; opened: boolean;
onClose: () => void; onClose: () => void;
size?: "sm" | "md" | "lg" | "xl"; size?: "sm" | "md" | "lg" | "xl";
title: string title: any;
withCloseButton?: boolean | undefined;
closeOnClickOutside?: boolean | undefined;
}) { }) {
return ( return (
<> <>
@@ -25,10 +29,11 @@ export function Admin_ComponentModal({
}} }}
opened={opened} opened={opened}
onClose={onClose} onClose={onClose}
withCloseButton={false}
size={size ? size : "sm"} size={size ? size : "sm"}
centered centered
title={title} title={title}
withCloseButton={withCloseButton ? withCloseButton : false}
closeOnClickOutside={closeOnClickOutside}
> >
{children} {children}
</Modal> </Modal>

36
src/app_modules/admin/_admin_global/_component/comp_button_user_on_navbar.tsx
View File

@@ -22,6 +22,7 @@ import {
import { IconPhone, IconUser, IconUserCircle } from "@tabler/icons-react"; import { IconPhone, IconUser, IconUserCircle } from "@tabler/icons-react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { Admin_ComponentModal } from "./comp_admin_modal";
export function Admin_ComponentButtonUserCircle({ export function Admin_ComponentButtonUserCircle({
dataUser, dataUser,
@@ -102,7 +103,7 @@ export function Admin_ComponentButtonUserCircle({
</Popover.Dropdown> </Popover.Dropdown>
</Popover> </Popover>
<Modal {/* <Modal
opened={openModal} opened={openModal}
onClose={() => setOpenModal(false)} onClose={() => setOpenModal(false)}
centered centered
@@ -132,7 +133,38 @@ export function Admin_ComponentButtonUserCircle({
</Button> </Button>
</Group> </Group>
</Stack> </Stack>
</Modal> </Modal> */}
<Admin_ComponentModal
opened={openModal}
onClose={() => setOpenModal(false)}
title={"Anda yakin ingin keluar ?"}
withCloseButton={false}
closeOnClickOutside={false}
>
<Stack>
<Group align="center" position="center">
<Button
onClick={() => {
setOpenModal(false);
}}
radius={50}
>
Batal
</Button>
<Button
loaderPosition="center"
loading={loadingLogout ? true : false}
radius={50}
bg={Warna.merah}
color="red"
onClick={() => onClickLogout()}
>
Keluar
</Button>
</Group>
</Stack>
</Admin_ComponentModal>
</> </>
); );

163
src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
View File

@@ -1,56 +1,34 @@
"use client"; "use client";
import { AccentColor, AdminColor } from "@/app_modules/_global/color/color_pallet"; import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component"; import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import { apiGetMasterStatusTransaksi } from "@/app_modules/_global/lib/api_fetch_master";
import { globalStatusTransaksi } from "@/app_modules/_global/lib/master_list_app";
import { Admin_ComponentLoadImageLandscape } from "@/app_modules/admin/_admin_global"; import { Admin_ComponentLoadImageLandscape } from "@/app_modules/admin/_admin_global";
import { ComponentAdminGlobal_TitlePage } from "@/app_modules/admin/_admin_global/_component";
import CustomSkeletonAdmin from "@/app_modules/admin/_admin_global/_component/skeleton/customSkeletonAdmin"; import CustomSkeletonAdmin from "@/app_modules/admin/_admin_global/_component/skeleton/customSkeletonAdmin";
import { ComponentAdminGlobal_NotifikasiBerhasil } from "@/app_modules/admin/_admin_global/admin_notifikasi/notifikasi_berhasil";
import { ComponentAdminGlobal_NotifikasiGagal } from "@/app_modules/admin/_admin_global/admin_notifikasi/notifikasi_gagal";
import AdminGlobal_ComponentBackButton from "@/app_modules/admin/_admin_global/back_button"; import AdminGlobal_ComponentBackButton from "@/app_modules/admin/_admin_global/back_button";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
import { import {
MODEL_DONASI, MODEL_DONASI,
MODEL_DONASI_PENCAIRAN_DANA MODEL_DONASI_PENCAIRAN_DANA,
} from "@/app_modules/donasi/model/interface"; } from "@/app_modules/donasi/model/interface";
import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
import { RouterAdminGlobal } from "@/lib";
import { RouterAdminDonasi } from "@/lib/router_admin/router_admin_donasi"; import { RouterAdminDonasi } from "@/lib/router_admin/router_admin_donasi";
import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin"; import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
import { clientLogger } from "@/util/clientLogger"; import { clientLogger } from "@/util/clientLogger";
import mqtt_client from "@/util/mqtt_client";
import { import {
ActionIcon,
Badge,
Box,
Button, Button,
Center, Center,
Grid, Grid,
Group,
Modal, Modal,
Pagination,
Paper, Paper,
ScrollArea,
Select,
SimpleGrid, SimpleGrid,
Spoiler,
Stack, Stack,
Table,
Text, Text,
TextInput, TextInput,
Title, Title,
} from "@mantine/core"; } from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks"; import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconReload } from "@tabler/icons-react";
import { toNumber } from "lodash"; import { toNumber } from "lodash";
import moment from "moment";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import adminDonasi_funUpdateStatusDanTotal from "../../fun/update/fun_update_status_dan_total"; import { apiGetAdminDonasiById } from "../../lib/api_fetch_admin_donasi";
import { apiGetAdminAllDaftarDonatur, apiGetAdminDonasiById } from "../../lib/api_fetch_admin_donasi";
import TampilanListDonatur from "./detail_list_donatur"; import TampilanListDonatur from "./detail_list_donatur";
import TampilanListPencairan from "./detail_list_pencairan"; import TampilanListPencairan from "./detail_list_pencairan";
@@ -65,31 +43,28 @@ export default function AdminDonasi_DetailPublish({
const [isReload, setReload] = useState(false); const [isReload, setReload] = useState(false);
const params = useParams<{ id: string }>(); const params = useParams<{ id: string }>();
const [data, setData] = useState<MODEL_DONASI | null>(null); const [data, setData] = useState<MODEL_DONASI | null>(null);
console.log("Ini data", data)
//
useShallowEffect(() => { useShallowEffect(() => {
loadInitialData(); loadInitialData();
}, [isReload]) }, [isReload]);
const loadInitialData = async () => { const loadInitialData = async () => {
try { try {
const response = await apiGetAdminDonasiById({ const response = await apiGetAdminDonasiById({
id: params.id, id: params.id,
}) });
if (response?.success && response?.data) { if (response?.success && response?.data) {
setData(response.data) setData(response.data);
setReload(false) setReload(false);
} else { } else {
setData(null) setData(null);
} }
} catch (error) { } catch (error) {
clientLogger.error("Invalid data format recieved:", error); clientLogger.error("Invalid data format recieved:", error);
setData(null); setData(null);
} }
} };
return ( return (
<> <>
@@ -99,19 +74,23 @@ export default function AdminDonasi_DetailPublish({
<AdminGlobal_ComponentBackButton <AdminGlobal_ComponentBackButton
path={RouterAdminDonasi.table_publish} path={RouterAdminDonasi.table_publish}
/> />
{!data ? (<CustomSkeletonAdmin height={"40vh"} />) : ( {!data ? (
<TampilanDetailDonasi <CustomSkeletonAdmin height={"40vh"} />
countDonatur={countDonatur} donasi={data} /> ) : (
<TampilanDetailDonasi countDonatur={countDonatur} donasi={data} />
)} )}
{!data ? (<CustomSkeletonAdmin height={"80vh"} />) : ( {!data ? (
<CustomSkeletonAdmin height={"80vh"} />
) : (
<TampilanListDonatur <TampilanListDonatur
setReloadDonasi={(val) => { setReloadDonasi={(val) => {
setReload(val) setReload(val);
}} }}
donasi={data} donasi={data}
isReload={isReload} isReload={isReload}
/>)} />
<TampilanListPencairan pencairan={pencairan} /> )}
<TampilanListPencairan pencairan={pencairan} />
</> </>
</Stack> </Stack>
</> </>
@@ -120,20 +99,15 @@ export default function AdminDonasi_DetailPublish({
function TampilanDetailDonasi({ function TampilanDetailDonasi({
countDonatur, countDonatur,
donasi donasi,
}: { }: {
countDonatur: number; countDonatur: number;
donasi: MODEL_DONASI; donasi: MODEL_DONASI;
}) { }) {
const [opened, { open, close }] = useDisclosure(false); const [opened, { open, close }] = useDisclosure(false);
const router = useRouter(); const router = useRouter();
const [isLoadingPencairanDana, setIsLoadingPencairanDana] = useState(false); const [isLoadingPencairanDana, setIsLoadingPencairanDana] = useState(false);
return ( return (
<> <>
<Paper bg={AdminColor.softBlue} radius={"md"} p={"md"}> <Paper bg={AdminColor.softBlue} radius={"md"} p={"md"}>
@@ -158,12 +132,18 @@ function TampilanDetailDonasi({
<Paper p={"sm"} bg={AdminColor.softBlue}> <Paper p={"sm"} bg={AdminColor.softBlue}>
<Stack spacing={5}> <Stack spacing={5}>
<Title c={AdminColor.white} order={4}>Detail Donasi</Title> <Title c={AdminColor.white} order={4}>
Detail Donasi
</Title>
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Judul</Text> <Text c={AdminColor.white} fz={"xs"}>
Judul
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title order={5} c={AdminColor.white}> <Title order={5} c={AdminColor.white}>
{donasi?.title} {donasi?.title}
@@ -173,9 +153,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Penggalang Dana</Text> <Text c={AdminColor.white} fz={"xs"}>
Penggalang Dana
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title order={5} c={AdminColor.white}> <Title order={5} c={AdminColor.white}>
{donasi?.Author.username} {donasi?.Author.username}
@@ -185,9 +169,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Durasi</Text> <Text c={AdminColor.white} fz={"xs"}>
Durasi
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title c={AdminColor.white} order={5}> <Title c={AdminColor.white} order={5}>
{donasi?.DonasiMaster_Durasi.name} hari {donasi?.DonasiMaster_Durasi.name} hari
@@ -197,9 +185,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Dana dibutuhkan</Text> <Text c={AdminColor.white} fz={"xs"}>
Dana dibutuhkan
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<ComponentGlobal_TampilanRupiah <ComponentGlobal_TampilanRupiah
nominal={+donasi?.target} nominal={+donasi?.target}
@@ -210,9 +202,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Kategori</Text> <Text c={AdminColor.white} fz={"xs"}>
Kategori
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title c={AdminColor.white} order={5}> <Title c={AdminColor.white} order={5}>
{donasi?.DonasiMaster_Ketegori?.name} {donasi?.DonasiMaster_Ketegori?.name}
@@ -222,9 +218,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={"xs"}>Total donatur</Text> <Text c={AdminColor.white} fz={"xs"}>
Total donatur
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title order={5} c={AdminColor.white}> <Title order={5} c={AdminColor.white}>
{countDonatur} {countDonatur}
@@ -234,9 +234,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={12}>Progres</Text> <Text c={AdminColor.white} fz={12}>
Progres
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Title order={5} c={AdminColor.white}> <Title order={5} c={AdminColor.white}>
{toNumber(donasi.progres).toFixed(2)} % {toNumber(donasi.progres).toFixed(2)} %
@@ -246,9 +250,13 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={4}> <Grid.Col span={4}>
<Text c={AdminColor.white} fz={12}>Dana terkumpul</Text> <Text c={AdminColor.white} fz={12}>
Dana terkumpul
</Text>
</Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>
:
</Grid.Col> </Grid.Col>
<Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<ComponentGlobal_TampilanRupiah <ComponentGlobal_TampilanRupiah
nominal={+donasi?.terkumpul} nominal={+donasi?.terkumpul}
@@ -263,12 +271,16 @@ function TampilanDetailDonasi({
<Paper bg={AdminColor.softBlue} p={"sm"}> <Paper bg={AdminColor.softBlue} p={"sm"}>
<Stack spacing={"xl"}> <Stack spacing={"xl"}>
<Center> <Center>
<Title c={AdminColor.white} order={4}>Pencairan Dana</Title> <Title c={AdminColor.white} order={4}>
Pencairan Dana
</Title>
</Center> </Center>
<Grid> <Grid>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Stack spacing={0}> <Stack spacing={0}>
<Text c={AdminColor.white} fz={"xs"}>Total Dana Dicairkan</Text> <Text c={AdminColor.white} fz={"xs"}>
Total Dana Dicairkan
</Text>
<ComponentGlobal_TampilanRupiah <ComponentGlobal_TampilanRupiah
nominal={donasi?.totalPencairan} nominal={donasi?.totalPencairan}
color={AdminColor.yellow} color={AdminColor.yellow}
@@ -277,7 +289,9 @@ function TampilanDetailDonasi({
</Grid.Col> </Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Stack spacing={0}> <Stack spacing={0}>
<Text c={AdminColor.white} fz={"xs"}>Bank Tujuan</Text> <Text c={AdminColor.white} fz={"xs"}>
Bank Tujuan
</Text>
<Title order={6} c={AdminColor.white}> <Title order={6} c={AdminColor.white}>
{donasi?.namaBank} {donasi?.namaBank}
</Title> </Title>
@@ -287,7 +301,9 @@ function TampilanDetailDonasi({
<Grid> <Grid>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Stack spacing={0}> <Stack spacing={0}>
<Text c={AdminColor.white} fz={"xs"}>Akumulasi Pencairan</Text> <Text c={AdminColor.white} fz={"xs"}>
Akumulasi Pencairan
</Text>
<Title order={6} c={AdminColor.white}> <Title order={6} c={AdminColor.white}>
{donasi?.akumulasiPencairan} Kali {donasi?.akumulasiPencairan} Kali
</Title> </Title>
@@ -295,7 +311,9 @@ function TampilanDetailDonasi({
</Grid.Col> </Grid.Col>
<Grid.Col span={"auto"}> <Grid.Col span={"auto"}>
<Stack spacing={0}> <Stack spacing={0}>
<Text fz={"xs"} c={AdminColor.white}>Nomor Rekening</Text> <Text fz={"xs"} c={AdminColor.white}>
Nomor Rekening
</Text>
<Title order={6} c={AdminColor.white}> <Title order={6} c={AdminColor.white}>
{donasi?.rekening} {donasi?.rekening}
</Title> </Title>
@@ -304,7 +322,9 @@ function TampilanDetailDonasi({
</Grid> </Grid>
<Stack align="center" spacing={0}> <Stack align="center" spacing={0}>
<Text c={AdminColor.white} fz={"xs"}>Sisa Dana</Text> <Text c={AdminColor.white} fz={"xs"}>
Sisa Dana
</Text>
<ComponentGlobal_TampilanRupiah <ComponentGlobal_TampilanRupiah
nominal={ nominal={
toNumber(donasi.terkumpul) - toNumber(donasi.terkumpul) -
@@ -348,6 +368,3 @@ function PencairanDana() {
</> </>
); );
} }

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

@@ -1,33 +1,31 @@
"use client"; "use client";
import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin"; import { AccentColor } from "@/app_modules/_global/color";
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component"; import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface"; import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
import { clientLogger } from "@/util/clientLogger";
import { import {
Button, Box,
Center, Center,
Group,
Pagination, Pagination,
Paper, Paper,
ScrollArea, ScrollArea,
Stack, Stack,
Table, Table,
Text, Text,
TextInput, TextInput
Title
} from "@mantine/core"; } from "@mantine/core";
import { IconEyeCheck, IconSearch } from "@tabler/icons-react"; import { useShallowEffect } from "@mantine/hooks";
import { IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import adminDonasi_getListPublish from "../fun/get/get_list_publish";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component"; import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { AccentColor, MainColor } from "@/app_modules/_global/color"; import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import { useShallowEffect } from "@mantine/hooks";
import { clientLogger } from "@/util/clientLogger";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi"; import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminDonasi_TablePublish() { export default function AdminDonasi_TablePublish() {
return ( return (
@@ -56,8 +54,8 @@ function TableStatus() {
const response = await apiGetAdminDonasiByStatus({ const response = await apiGetAdminDonasiByStatus({
name: "Publish", name: "Publish",
page: `${isActivePage}`, page: `${isActivePage}`,
search: isSearch search: isSearch,
}) });
if (response?.success && response?.data.data) { if (response?.success && response?.data.data) {
setData(response.data.data); setData(response.data.data);
@@ -70,18 +68,18 @@ function TableStatus() {
clientLogger.error("Invalid data format recieved:", error); clientLogger.error("Invalid data format recieved:", error);
setData([]); setData([]);
} }
} };
loadInitialData(); loadInitialData();
}, [isActivePage, isSearch]) }, [isActivePage, isSearch]);
const onSearch = (searchTerm: string) => { const onSearch = (searchTerm: string) => {
setSearch(searchTerm); setSearch(searchTerm);
setActivePage(1); setActivePage(1);
} };
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
return ( return (
@@ -92,12 +90,23 @@ function TableStatus() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data.map((e, i) => ( return data.map((e, i) => (
<tr key={i}> <tr key={i}>
<td> <td>
<Center c={AccentColor.white}>{e.title}</Center> <Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={1}>{e?.Author?.username}</Text>
</Box>
</Center>
</td>
<td>
<Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={2}>{e.title}</Text>
</Box>
</Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}> <Center c={AccentColor.white}>
@@ -109,15 +118,15 @@ function TableStatus() {
<ComponentGlobal_TampilanRupiah nominal={+e.terkumpul} /> <ComponentGlobal_TampilanRupiah nominal={+e.terkumpul} />
</Center> </Center>
</td> </td>
<td> {/* <td>
<Center c={AccentColor.white}>{e.DonasiMaster_Ketegori.name}</Center> <Center c={AccentColor.white}>{e.DonasiMaster_Ketegori.name}</Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}>{e.DonasiMaster_Durasi.name} hari</Center> <Center c={AccentColor.white}>{e.DonasiMaster_Durasi.name} hari</Center>
</td> </td> */}
<td> <td>
<Center> <Center>
<Button {/* <Button
loaderPosition="center" loaderPosition="center"
loading={isLoading && e?.id === idData ? true : false} loading={isLoading && e?.id === idData ? true : false}
style={{ backgroundColor: MainColor.green, }} style={{ backgroundColor: MainColor.green, }}
@@ -131,13 +140,15 @@ function TableStatus() {
}} }}
> >
Tampilkan Tampilkan
</Button> </Button> */}
<Admin_DetailButton
path={RouterAdminDonasi_OLD.detail_publish + e.id}
/>
</Center> </Center>
</td> </td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -179,15 +190,12 @@ function TableStatus() {
) : ( ) : (
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}> <Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}> <ScrollArea w={"100%"} h={"90%"}>
<Table <Table verticalSpacing={"md"} horizontalSpacing={"md"} p={"md"}>
verticalSpacing={"md"}
horizontalSpacing={"md"}
p={"md"}
w={1120}
>
<thead> <thead>
<tr> <tr>
<th>
<Center c={AccentColor.white}>Username</Center>
</th>
<th> <th>
<Center c={AccentColor.white}>Judul</Center> <Center c={AccentColor.white}>Judul</Center>
</th> </th>
@@ -197,12 +205,6 @@ function TableStatus() {
<th> <th>
<Center c={AccentColor.white}>Terkumpul</Center> <Center c={AccentColor.white}>Terkumpul</Center>
</th> </th>
<th>
<Center c={AccentColor.white}>Ketegori</Center>
</th>
<th>
<Center c={AccentColor.white}>Durasi</Center>
</th>
<th> <th>
<Center c={AccentColor.white}>Aksi</Center> <Center c={AccentColor.white}>Aksi</Center>
</th> </th>
@@ -224,7 +226,6 @@ function TableStatus() {
</Center> </Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>
</> </>
); );

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

@@ -6,6 +6,7 @@ import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component"; import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface"; import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
import { import {
Box,
Button, Button,
Center, Center,
Modal, Modal,
@@ -16,7 +17,7 @@ import {
Table, Table,
Text, Text,
TextInput, TextInput,
Title Title,
} from "@mantine/core"; } from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks"; import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconEyeEdit, IconSearch } from "@tabler/icons-react"; import { IconEyeEdit, IconSearch } from "@tabler/icons-react";
@@ -29,6 +30,7 @@ import { IconEyeCheck } from "@tabler/icons-react";
import { clientLogger } from "@/util/clientLogger"; import { clientLogger } from "@/util/clientLogger";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi"; import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
export default function AdminDonasi_TableReject() { export default function AdminDonasi_TableReject() {
return ( return (
@@ -51,15 +53,14 @@ function TableStatus() {
const [isActivePage, setActivePage] = useState(1); const [isActivePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState(""); const [isSearch, setSearch] = useState("");
useShallowEffect(() => { useShallowEffect(() => {
const loadInitialData = async () => { const loadInitialData = async () => {
try { try {
const response = await apiGetAdminDonasiByStatus({ const response = await apiGetAdminDonasiByStatus({
name: "Reject", name: "Reject",
page: `${isActivePage}`, page: `${isActivePage}`,
search: isSearch search: isSearch,
}) });
if (response?.success && response?.data.data) { if (response?.success && response?.data.data) {
setData(response.data.data); setData(response.data.data);
@@ -72,19 +73,18 @@ function TableStatus() {
clientLogger.error("Invalid data format recieved:", error); clientLogger.error("Invalid data format recieved:", error);
setData([]); setData([]);
} }
} };
loadInitialData(); loadInitialData();
}, [isActivePage, isSearch]) }, [isActivePage, isSearch]);
const onSearch = (searchTerm: string) => { const onSearch = (searchTerm: string) => {
setSearch(searchTerm); setSearch(searchTerm);
setActivePage(1); setActivePage(1);
} };
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
@@ -96,48 +96,49 @@ function TableStatus() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data.map((e, i) => ( return data.map((e, i) => (
<tr key={i}> <tr key={i}>
<td> <td>
<Center c={AccentColor.white}>{e?.Author?.username}</Center> <Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={1}>{e?.Author?.username}</Text>
</Box>
</Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}>{e?.title}</Center> <Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={2}>{e.title}</Text>
</Box>
</Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}> <Center c={AccentColor.white}>
<ComponentGlobal_TampilanRupiah nominal={+e.target} /> <ComponentGlobal_TampilanRupiah nominal={+e.target} />
</Center> </Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Ketegori.name}</Center> <Center c={AccentColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
</td> </td>
<td> <td>
<Center c={AccentColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center> <Center c={AccentColor.white}>
{e?.DonasiMaster_Durasi.name} hari
</Center>
</td> </td>
<td> <td>
<Center> <Center>
<Button <Admin_DetailButton
style={{ backgroundColor: MainColor.green }} path={RouterAdminDonasi_OLD.detail_reject + e.id}
color={AccentColor.white} />
leftIcon={<IconEyeCheck />}
radius={"xl"}
onClick={() =>
router.push(RouterAdminDonasi_OLD.detail_reject + `${e.id}`)
}
>
Lihat Alasan
</Button>
</Center> </Center>
{/* <ModalReject opened={opened} close={close} /> */} {/* <ModalReject opened={opened} close={close} /> */}
</td> </td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -177,16 +178,12 @@ function TableStatus() {
{!data ? ( {!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} /> <CustomSkeleton height={"80vh"} width={"100%"} />
) : ( ) : (
<Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}> <Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}> <ScrollArea w={"100%"} h={"90%"}>
<Table <Table
verticalSpacing={"md"} verticalSpacing={"md"}
horizontalSpacing={"md"} horizontalSpacing={"md"}
p={"md"} p={"md"}
w={1125}
> >
<thead> <thead>
<tr> <tr>
@@ -206,7 +203,7 @@ function TableStatus() {
<Center c={AccentColor.white}>Durasi</Center> <Center c={AccentColor.white}>Durasi</Center>
</th> </th>
<th> <th>
<Center c={AccentColor.white}>Alasan</Center> <Center c={AccentColor.white}>Aksi</Center>
</th> </th>
</tr> </tr>
</thead> </thead>

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

@@ -1,15 +1,18 @@
"use client"; "use client";
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
import { gs_adminDonasi_triggerReview } from "@/lib/global_state"; import { gs_adminDonasi_triggerReview } from "@/lib/global_state";
import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin"; import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
import { AccentColor, MainColor } from "@/app_modules/_global/color"; import { clientLogger } from "@/util/clientLogger";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
import { import {
Affix, Affix,
Box,
Button, Button,
Center, Center,
Group,
Pagination, Pagination,
Paper, Paper,
rem, rem,
@@ -18,21 +21,16 @@ import {
Table, Table,
Text, Text,
TextInput, TextInput,
Title,
} from "@mantine/core"; } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { IconEyeCheck, IconRefresh, IconSearch } from "@tabler/icons-react"; import { IconEyeCheck, IconRefresh, IconSearch } from "@tabler/icons-react";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import adminDonasi_getListReview from "../fun/get/get_list_review";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component"; import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi"; import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
import { error } from "console"; import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
import { clientLogger } from "@/util/clientLogger";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminDonasi_TableReview() { export default function AdminDonasi_TableReview() {
return ( return (
@@ -70,9 +68,8 @@ function TableStatus() {
const response = await apiGetAdminDonasiByStatus({ const response = await apiGetAdminDonasiByStatus({
name: "Review", name: "Review",
page: `${isActivePage}`, page: `${isActivePage}`,
search: isSearch search: isSearch,
}) });
if (response?.success && response?.data?.data) { if (response?.success && response?.data?.data) {
setData(response.data.data); setData(response.data.data);
@@ -85,7 +82,7 @@ function TableStatus() {
clientLogger.error("Error get data table publish", error); clientLogger.error("Error get data table publish", error);
setData([]); setData([]);
} }
} };
async function onLoadData() { async function onLoadData() {
loadInitialData(); loadInitialData();
setLoadingReload(false); setLoadingReload(false);
@@ -96,11 +93,11 @@ function TableStatus() {
const onSearch = async (searchTerm: string) => { const onSearch = async (searchTerm: string) => {
setSearch(searchTerm); setSearch(searchTerm);
setActivePage(1); setActivePage(1);
} };
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
@@ -112,16 +109,24 @@ function TableStatus() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data.map((e, i) => ( return data.map((e, i) => (
<tr key={i}> <tr key={i}>
<td> <td>
<Center c={AdminColor.white}>{e?.Author?.username}</Center> <Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={1}>{e?.Author?.username}</Text>
</Box>
</Center>
</td> </td>
<td> <td>
<Center c={AdminColor.white}>{e?.title}</Center> <Center c={AdminColor.white}>
<Box w={100}>
<Text lineClamp={2}>{e.title}</Text>
</Box>
</Center>
</td> </td>
<td> <td>
<Center c={AdminColor.white}> <Center c={AdminColor.white}>
@@ -132,14 +137,19 @@ function TableStatus() {
<Center c={AdminColor.white}>{e?.DonasiMaster_Ketegori.name}</Center> <Center c={AdminColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
</td> </td>
<td> <td>
<Center c={AdminColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center> <Center c={AdminColor.white}>
{e?.DonasiMaster_Durasi.name} hari
</Center>
</td> </td>
<td> <td>
<Center> <Center>
<Button {/* <Button
loaderPosition="center" loaderPosition="center"
loading={isLoading && e?.id == idData ? true : false} loading={isLoading && e?.id == idData ? true : false}
style={{ backgroundColor: MainColor.green, color: AccentColor.white }} style={{
backgroundColor: MainColor.green,
color: AccentColor.white,
}}
leftIcon={<IconEyeCheck />} leftIcon={<IconEyeCheck />}
radius={"xl"} radius={"xl"}
onClick={() => { onClick={() => {
@@ -149,13 +159,16 @@ function TableStatus() {
}} }}
> >
Tampilkan Tampilkan
</Button> </Button> */}
<Admin_DetailButton
path={RouterAdminDonasi_OLD.detail_review + e?.id}
/>
</Center> </Center>
</td> </td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -221,9 +234,7 @@ function TableStatus() {
verticalSpacing={"md"} verticalSpacing={"md"}
horizontalSpacing={"md"} horizontalSpacing={"md"}
p={"md"} p={"md"}
w={1120}
h={"100%"} h={"100%"}
> >
<thead> <thead>
<tr> <tr>
@@ -261,7 +272,6 @@ function TableStatus() {
</Center> </Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>
</> </>
); );

1
src/app_modules/admin/event/_ui/ui_new_detail.tsx
View File

@@ -31,7 +31,6 @@ export function AdminEvent_UiNewDetail() {
}); });
if (response?.success && response?.data) { if (response?.success && response?.data) {
console.log("res >>", response.data);
setData(response.data); setData(response.data);
} else { } else {
console.error("Invalid data format received:", response); console.error("Invalid data format received:", response);

2
src/app_modules/admin/vote/component/comp_detail.tsx
View File

@@ -35,7 +35,7 @@ export function AdminVoting_ComponentDetail({ data }: Props) {
{ {
title: "Status", title: "Status",
value: ( value: (
<Badge variant="light">{cekHari < 0 ? "Riwayat" : "Publish"}</Badge> <Badge variant="light">{data.Voting_Status.name === "Publish" && cekHari < 0 ? "Riwayat" : data.Voting_Status.name}</Badge>
), ),
}, },
]; ];