From 692dd2560934782b551c611b25951cbc5a1194b2 Mon Sep 17 00:00:00 2001 From: amel Date: Fri, 20 Dec 2024 17:30:46 +0800 Subject: [PATCH] upd: donasi Deskripsi: - api detail donasi No Issues --- src/app/api/new/donasi/[id]/route.ts | 81 ++++++-- .../dev/donasi/detail/main/[id]/layout.tsx | 28 ++- src/app/dev/donasi/detail/main/[id]/page.tsx | 18 +- .../detail_main/cerita_penggalang_new.tsx | 89 +++++++++ .../detail_main/detail_dana_donasi_new.tsx | 175 ++++++++++++++++++ .../detail_main/informasi_penggalang_new.tsx | 97 ++++++++++ .../skeleton_cerita_penggalang.tsx | 14 ++ .../skeleton_detail_dana_donasi.tsx | 21 +++ .../donasi/detail/detail_main/index_new.tsx | 17 ++ .../donasi/detail/detail_main/layout_new.tsx | 85 +++++++++ .../edit/edit_donasi/edit_donasi_new.tsx | 2 +- src/app_modules/donasi/index.ts | 4 +- src/app_modules/donasi/lib/api_donasi.ts | 4 +- 13 files changed, 588 insertions(+), 47 deletions(-) create mode 100644 src/app_modules/donasi/component/detail_main/cerita_penggalang_new.tsx create mode 100644 src/app_modules/donasi/component/detail_main/detail_dana_donasi_new.tsx create mode 100644 src/app_modules/donasi/component/detail_main/informasi_penggalang_new.tsx create mode 100644 src/app_modules/donasi/component/detail_main/skeleton_cerita_penggalang.tsx create mode 100644 src/app_modules/donasi/component/detail_main/skeleton_detail_dana_donasi.tsx create mode 100644 src/app_modules/donasi/detail/detail_main/index_new.tsx create mode 100644 src/app_modules/donasi/detail/detail_main/layout_new.tsx diff --git a/src/app/api/new/donasi/[id]/route.ts b/src/app/api/new/donasi/[id]/route.ts index 64c367c0..96da4a1e 100644 --- a/src/app/api/new/donasi/[id]/route.ts +++ b/src/app/api/new/donasi/[id]/route.ts @@ -6,25 +6,72 @@ export const dynamic = "force-dynamic"; // GET ONE DATA DONASI export async function GET(request: Request, context: { params: { id: string } }) { try { + let dataFix const { id } = context.params - const data = await prisma.donasi.findFirst({ - where: { - id: id - }, - include: { - Author: true, - imageDonasi: true, - CeritaDonasi: true, - DonasiMaster_Ketegori: true, - DonasiMaster_Durasi: true, - DonasiMaster_Status: true, - Donasi_Invoice: true, - Donasi_Kabar: true, - Donasi_PencairanDana: true, - }, - }); + const { searchParams } = new URL(request.url) + const kategori = searchParams.get("cat") - return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data }, { status: 200 }); + if (kategori == "semua") { + dataFix = await prisma.donasi.findFirst({ + where: { + id: id + }, + include: { + Author: true, + imageDonasi: true, + CeritaDonasi: true, + DonasiMaster_Ketegori: true, + DonasiMaster_Durasi: true, + DonasiMaster_Status: true, + Donasi_Invoice: true, + Donasi_Kabar: true, + Donasi_PencairanDana: true, + }, + }); + + } else if (kategori == "count") { + dataFix = await prisma.donasi_Invoice.count({ + where: { + donasiId: id, + donasiMaster_StatusInvoiceId: { + equals: "1" + } + } + }); + + } else { + let tampil + if (kategori == "author") { + tampil = { + authorId: true, + Author: { + select: { + username: true + } + } + } + } else if (kategori == "cerita") { + tampil = { + id: true, + createdAt: true, + CeritaDonasi: { + select: { + cerita: true + } + } + } + } + + dataFix = await prisma.donasi.findFirst({ + where: { + id: id + }, + select: tampil + }) + } + + + return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: dataFix }, { status: 200 }); } catch (error) { diff --git a/src/app/dev/donasi/detail/main/[id]/layout.tsx b/src/app/dev/donasi/detail/main/[id]/layout.tsx index ad394a61..77eff8c2 100644 --- a/src/app/dev/donasi/detail/main/[id]/layout.tsx +++ b/src/app/dev/donasi/detail/main/[id]/layout.tsx @@ -1,29 +1,25 @@ -import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; -import { LayoutDetailMainDonasi } from "@/app_modules/donasi"; -import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id"; +import { LayoutDetailMainDonasiNew } from "@/app_modules/donasi"; import React from "react"; -export default async function Layout({ - children, - params, -}: { - children: React.ReactNode; - params: { id: string }; -}) { - const donasiId = params.id; - const getData = await Donasi_getOneById(donasiId); - const authorId = getData?.authorId; - const userLoginId = await funGetUserIdByToken(); +export default async function Layout({ children, params, }: { children: React.ReactNode; params: { id: string }; }) { + // const donasiId = params.id; + // const getData = await Donasi_getOneById(donasiId); + // const authorId = getData?.authorId; + // const userLoginId = await funGetUserIdByToken(); return ( <> - {children} - + */} + + + {children} + ); } diff --git a/src/app/dev/donasi/detail/main/[id]/page.tsx b/src/app/dev/donasi/detail/main/[id]/page.tsx index 6ea7e94c..72a2bbd2 100644 --- a/src/app/dev/donasi/detail/main/[id]/page.tsx +++ b/src/app/dev/donasi/detail/main/[id]/page.tsx @@ -1,22 +1,20 @@ -import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; -import { DetailMainDonasi } from "@/app_modules/donasi"; -import { Donasi_getCountDonatur } from "@/app_modules/donasi/fun/count/get_count_donatur"; -import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id"; +import DetailMainDonasiNew from "@/app_modules/donasi/detail/detail_main/index_new"; export default async function Page({ params }: { params: { id: string } }) { - let donasiId = params.id; - const userLoginId = await funGetUserIdByToken(); + // let donasiId = params.id; + // const userLoginId = await funGetUserIdByToken(); - const dataDonasi = await Donasi_getOneById(donasiId); - const countDonatur = await Donasi_getCountDonatur(donasiId); + // const dataDonasi = await Donasi_getOneById(donasiId); + // const countDonatur = await Donasi_getCountDonatur(donasiId); return ( <> - + /> */} + ); } diff --git a/src/app_modules/donasi/component/detail_main/cerita_penggalang_new.tsx b/src/app_modules/donasi/component/detail_main/cerita_penggalang_new.tsx new file mode 100644 index 00000000..d0b52bd4 --- /dev/null +++ b/src/app_modules/donasi/component/detail_main/cerita_penggalang_new.tsx @@ -0,0 +1,89 @@ +"use client"; +import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; +import { AccentColor, MainColor, } from "@/app_modules/_global/color/color_pallet"; +import { ActionIcon, Group, Paper, Stack, Text, Title } from "@mantine/core"; +import { IconCircleChevronRight } from "@tabler/icons-react"; +import { useParams, useRouter } from "next/navigation"; +import { useState } from "react"; +import { apiGetOneDonasiById } from "../../lib/api_donasi"; +import { useShallowEffect } from "@mantine/hooks"; +import SkeletonCeritaPenggalangDonasi from "./skeleton_cerita_penggalang"; + +export default function ComponentDonasi_CeritaPenggalangMainNew() { + const router = useRouter(); + const param = useParams<{ id: string }>(); + const [loading, setLoading] = useState(true) + const [donasi, setDonasi] = useState({}) + + + async function getCeritaDonasi() { + try { + setLoading(true) + const response = await apiGetOneDonasiById(param.id, "cerita") + if (response.success) { + setDonasi(response.data) + }else{ + + } + } catch (error) { + console.error(error); + } finally { + setLoading(false) + } + } + + + useShallowEffect(() => { + getCeritaDonasi() + }, []) + + + return ( + <> + + Cerita Penggalang Dana + + { + loading ? + : + + + + {new Intl.DateTimeFormat("id-ID", { dateStyle: "full" }).format( + new Date(donasi?.createdAt) + )} + + { + router.push(RouterDonasi.cerita_penggalang + `${donasi?.id}`); + }} + > + + + + {donasi?.CeritaDonasi.cerita} + + } + + + + ); +} diff --git a/src/app_modules/donasi/component/detail_main/detail_dana_donasi_new.tsx b/src/app_modules/donasi/component/detail_main/detail_dana_donasi_new.tsx new file mode 100644 index 00000000..dab456bf --- /dev/null +++ b/src/app_modules/donasi/component/detail_main/detail_dana_donasi_new.tsx @@ -0,0 +1,175 @@ +"use client"; +import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; +import { MainColor } from "@/app_modules/_global/color/color_pallet"; +import { ComponentGlobal_CardStyles, ComponentGlobal_LoadImageLandscape, } from "@/app_modules/_global/component"; +import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global"; +import { Divider, Grid, Group, Progress, Stack, Text, Title, } from "@mantine/core"; +import { IconClover, IconMessageChatbot, IconMoneybag, } from "@tabler/icons-react"; +import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime"; +import { useParams, useRouter } from "next/navigation"; +import { Donasi_findDonaturByTokenId } from "../../fun/get/get_donatur_by_token_id"; +import { MODEL_DONASI } from "../../model/interface"; +import ComponentDonasi_TampilanHitungMundur from "../tampilan_hitung_mundur"; +import TampilanRupiahDonasi from "../tampilan_rupiah"; +import { useState } from "react"; +import { apiGetOneDonasiById } from "../../lib/api_donasi"; +import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; +import { useShallowEffect } from "@mantine/hooks"; +import SkeletonDetailDanaDonasi from "./skeleton_detail_dana_donasi"; + +export function ComponentDonasi_DetailDataMainNew() { + const router = useRouter(); + const param = useParams<{ id: string }>(); + const [loading, setLoading] = useState(true); + const [donasi, setDonasi] = useState(); + const [countDonatur, setcountDonatur] = useState(0); + const [userLoginId, setuserLoginId] = useState(""); + + async function getData() { + try { + setLoading(true) + const response = await apiGetOneDonasiById(param.id, "semua") + const response1 = await apiGetOneDonasiById(param.id, "count") + const response2 = await funGetUserIdByToken() + if (response.success) { + setDonasi(response.data) + setcountDonatur(response1.data) + setuserLoginId(response2) + } + } catch (error) { + console.error(error); + } finally { + setLoading(false) + } + } + + useShallowEffect(() => { + getData() + }, []) + + return ( + <> + + { + loading ? + : + + + + {donasi?.title} + + + + + + Dana terkumpul + + <TampilanRupiahDonasi nominal={+donasi?.terkumpul} /> + + + Dari target{" "} + + + + + Kategori + + {donasi?.DonasiMaster_Ketegori.name} + + + + + + + + { + router.push(RouterDonasi.donatur + `${donasi.id}`); + }} + > + + + + {countDonatur} + + + Donatur + + + + + { + router.push(RouterDonasi.daftar_kabar({ id: donasi.id }), { + scroll: false, + }); + }} + > + + + Kabar Terbaru + + + + { + onPencairanDana( + router, + donasi, + userLoginId, + ); + }} + > + + + Pencairan Dana + + + + + } + + + ); +} + +async function onPencairanDana(router: AppRouterInstance, donasi: MODEL_DONASI, userLoginId: string,) { + const cek = await Donasi_findDonaturByTokenId(donasi.id, userLoginId); + if (userLoginId == donasi.authorId) { + return router.push(RouterDonasi.pencairan_dana + `${donasi.id}`); + } + + if (!cek) { + return ComponentGlobal_NotifikasiPeringatan("Halaman khusus donatur"); + } else { + router.push(RouterDonasi.pencairan_dana + `${donasi.id}`); + } +} diff --git a/src/app_modules/donasi/component/detail_main/informasi_penggalang_new.tsx b/src/app_modules/donasi/component/detail_main/informasi_penggalang_new.tsx new file mode 100644 index 00000000..433fff92 --- /dev/null +++ b/src/app_modules/donasi/component/detail_main/informasi_penggalang_new.tsx @@ -0,0 +1,97 @@ +"use client"; +import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; +import { AccentColor, MainColor, } from "@/app_modules/_global/color/color_pallet"; +import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information"; +import { ActionIcon, Avatar, Group, Paper, Skeleton, Stack, Text, Title, } from "@mantine/core"; +import { useShallowEffect } from "@mantine/hooks"; +import { IconCircleChevronRight } from "@tabler/icons-react"; +import _ from "lodash"; +import { useParams, useRouter } from "next/navigation"; +import { useState } from "react"; +import { apiGetOneDonasiById } from "../../lib/api_donasi"; + +export default function ComponentDonasi_InformasiPenggalangMainNew() { + const router = useRouter(); + const param = useParams<{ id: string }>(); + const [loading, setLoading] = useState(true); + const [data, setData] = useState({}) + + + async function getDataAuthor() { + try { + setLoading(true) + const response = await apiGetOneDonasiById(param.id, "author") + if (response.success) { + setData(response.data) + } + } catch (error) { + console.error(error); + } finally { + setLoading(false) + } + } + + useShallowEffect(() => { + getDataAuthor() + }, []) + + return ( + <> + + Informasi Penggalang Dana + + { + loading ? + : + + + Penggalang Dana + { + router.push(RouterDonasi.penggalang_dana + `${data.authorId}`); + }} + > + + + + + + {(() => { + const usr = data?.Author?.username; + const splt = usr?.split(""); + const Up = _.upperCase(splt[0]) + + return Up; + })()} + + {data?.Author?.username} + + + + } + + + + ); +} diff --git a/src/app_modules/donasi/component/detail_main/skeleton_cerita_penggalang.tsx b/src/app_modules/donasi/component/detail_main/skeleton_cerita_penggalang.tsx new file mode 100644 index 00000000..3c3eb2d7 --- /dev/null +++ b/src/app_modules/donasi/component/detail_main/skeleton_cerita_penggalang.tsx @@ -0,0 +1,14 @@ +import { Box, Skeleton } from "@mantine/core"; + +export default function SkeletonCeritaPenggalangDonasi() { + return ( + <> + + + + + + + + ); +} \ No newline at end of file diff --git a/src/app_modules/donasi/component/detail_main/skeleton_detail_dana_donasi.tsx b/src/app_modules/donasi/component/detail_main/skeleton_detail_dana_donasi.tsx new file mode 100644 index 00000000..a8f287a6 --- /dev/null +++ b/src/app_modules/donasi/component/detail_main/skeleton_detail_dana_donasi.tsx @@ -0,0 +1,21 @@ +import { Box, Skeleton } from "@mantine/core"; + +export default function SkeletonDetailDanaDonasi() { + return ( + <> + + + + + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/app_modules/donasi/detail/detail_main/index_new.tsx b/src/app_modules/donasi/detail/detail_main/index_new.tsx new file mode 100644 index 00000000..e2583f4e --- /dev/null +++ b/src/app_modules/donasi/detail/detail_main/index_new.tsx @@ -0,0 +1,17 @@ +"use client"; +import { Stack } from "@mantine/core"; +import ComponentDonasi_CeritaPenggalangMainNew from "../../component/detail_main/cerita_penggalang_new"; +import { ComponentDonasi_DetailDataMainNew } from "../../component/detail_main/detail_dana_donasi_new"; +import ComponentDonasi_InformasiPenggalangMainNew from "../../component/detail_main/informasi_penggalang_new"; + +export default function DetailMainDonasiNew() { + return ( + <> + + + + + + + ); +} diff --git a/src/app_modules/donasi/detail/detail_main/layout_new.tsx b/src/app_modules/donasi/detail/detail_main/layout_new.tsx new file mode 100644 index 00000000..2d85b04f --- /dev/null +++ b/src/app_modules/donasi/detail/detail_main/layout_new.tsx @@ -0,0 +1,85 @@ +"use client"; +import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate"; +import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate"; +import React, { useState } from "react"; +import ButtonDonasi from "../../component/footer_button_donasi"; +import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; +import { IconDotsVertical, IconMessageShare } from "@tabler/icons-react"; +import { UIGlobal_Drawer } from "@/app_modules/_global/ui"; +import { ActionIcon } from "@mantine/core"; +import { useParams } from "next/navigation"; +import { apiGetOneDonasiById } from "../../lib/api_donasi"; +import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; +import { useShallowEffect } from "@mantine/hooks"; + +export default function LayoutDetailMainDonasiNew({ children, }: { children: React.ReactNode; }) { + const [openDrawer, setOpenDrawer] = useState(false); + const param = useParams<{ id: string }>(); + const [loading, setLoading] = useState(true); + const [authorId, setAuthorId] = useState(""); + const [userLogin, setUserLogin] = useState(""); + + const listPage = [ + { + id: "1", + name: "Rekap Kabar", + icon: , + path: RouterDonasi.rekap_kabar({ id: param.id }), + }, + ]; + + async function getDataDonasi() { + try { + setLoading(true) + const response = await apiGetOneDonasiById(param.id, "author") + const response2 = await funGetUserIdByToken() + if (response.success) { + setAuthorId(response.data.authorId) + setUserLogin(response2) + } + } catch (error) { + console.error(error); + } finally { + setLoading(false) + } + } + + useShallowEffect(() => { + getDataDonasi() + }, []) + + return ( + <> + setOpenDrawer(true)} + > + + + ) + } + /> + } + footer={} + > + {children} + + + setOpenDrawer(false)} + component={listPage} + /> + + ); +} diff --git a/src/app_modules/donasi/edit/edit_donasi/edit_donasi_new.tsx b/src/app_modules/donasi/edit/edit_donasi/edit_donasi_new.tsx index 40d136b4..28041831 100644 --- a/src/app_modules/donasi/edit/edit_donasi/edit_donasi_new.tsx +++ b/src/app_modules/donasi/edit/edit_donasi/edit_donasi_new.tsx @@ -51,7 +51,7 @@ export default function EditDonasiNew() { async function onGetData() { try { setLoadingData(true) - const response = await apiGetOneDonasiById(param.id) + const response = await apiGetOneDonasiById(param.id, "semua") if (response.success) { setData(response.data) } diff --git a/src/app_modules/donasi/index.ts b/src/app_modules/donasi/index.ts index 65fde92b..5751445d 100644 --- a/src/app_modules/donasi/index.ts +++ b/src/app_modules/donasi/index.ts @@ -1,3 +1,4 @@ +import LayoutDetailMainDonasiNew from '@/app_modules/donasi/detail/detail_main/layout_new'; import MainDonasi from "./main/beranda"; import MainDonasiNew from "./main/beranda_new"; import LayoutDonasi from "./main/layout"; @@ -106,5 +107,6 @@ export { MainDonasiNew, GalangDanaDonasiNew, CreateDonasiNew, - EditDonasiNew + EditDonasiNew, + LayoutDetailMainDonasiNew }; diff --git a/src/app_modules/donasi/lib/api_donasi.ts b/src/app_modules/donasi/lib/api_donasi.ts index b42ce605..a04b7563 100644 --- a/src/app_modules/donasi/lib/api_donasi.ts +++ b/src/app_modules/donasi/lib/api_donasi.ts @@ -13,7 +13,7 @@ export const apiGetAllDonasiSaya = async (path?: string) => { return await response.json().catch(() => null) } -export const apiGetOneDonasiById = async (path: string) => { - const response = await fetch(`/api/new/donasi/${path}`) +export const apiGetOneDonasiById = async (path: string, kategori: string) => { + const response = await fetch(`/api/new/donasi/${path}?cat=${kategori}`) return await response.json().catch(() => null) } \ No newline at end of file