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

Alur pembayaran donasi

Browse Source 
# feat
- Tampilan invoce
- Proses acc admin
- Transaksi berhasil
# Issue: Hitungan progres masih salah
This commit is contained in:
Bagasbanuna02
2024-01-08 13:56:14 +08:00
parent 4fc158bdc5
commit b4fe35e7d8
113 changed files with 2840 additions and 1274 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/app_modules/donasi/main/beranda.tsx
View File

@@ -24,59 +24,19 @@ import {
} from "@mantine/core";
import { useViewportSize } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { MODEL_DONASI } from "../model/interface";
import { useState } from "react";
import ComponentDonasi_BoxPublish from "../component/box_publish";
export default function MainDonasi() {
const router = useRouter();
const { height, width } = useViewportSize();
export default function MainDonasi({
listDonasi,
}: {
listDonasi: MODEL_DONASI[];
}) {
return (
<>
<SimpleGrid
cols={4}
spacing="lg"
breakpoints={[
{ maxWidth: "62rem", cols: 3, spacing: "md" },
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{Array(5)
.fill(0)
.map((e, i) => (
<Box key={i} onClick={() => router.push(RouterDonasi.detail_main)}>
<Stack>
<Grid>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={"/aset/no-img.png"}
radius={"md"}
/>
</Paper>
</AspectRatio>
</Grid.Col>
<Grid.Col span={5}>
<Stack spacing={"xs"}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
Judul Donasi Bisa Dilihat Disini Untuk Contoh
</Text>
<Progress value={50} color="orange" />
<Stack spacing={0}>
<Text fz={"sm"}>Terkumpul</Text>
<Text fz={"sm"} fw={"bold"} c={"orange"} truncate>
Rp. 100.000.000
</Text>
</Stack>
</Stack>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
<ComponentDonasi_BoxPublish dataDonasi={listDonasi} path={RouterDonasi.detail_main}/>
</>
);
}

151
src/app_modules/donasi/main/donasi_saya.tsx
View File

@@ -22,12 +22,29 @@ import {
} from "@mantine/core";
import { useViewportSize } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { MODEL_DONASI_INVOICE } from "../model/interface";
import { useState } from "react";
import TampilanRupiahDonasi from "../component/tampilan_rupiah";
import ComponentDonasi_TampilanHitungMundur from "../component/tampilan_hitung_mundur";
import moment from "moment";
import toast from "react-simple-toasts";
import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
import _ from "lodash";
export default function DonasiSayaDonasi() {
export default function DonasiSayaDonasi({
listInvoice,
}: {
listInvoice: MODEL_DONASI_INVOICE[];
}) {
const [invoice, setInvoice] = useState(listInvoice);
const router = useRouter();
const { height, width } = useViewportSize();
if (_.isEmpty(invoice))
return (
<>
<Center h={"80vh"}>Belum Ada Donasi</Center>
</>
);
return (
<>
<SimpleGrid
@@ -39,49 +56,103 @@ export default function DonasiSayaDonasi() {
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{Array(5)
.fill(0)
.map((e, i) => (
<Box
key={i}
onClick={() =>
router.push(RouterDonasi.detail_donasi_saya)
}
>
<Stack>
<Grid>
<Grid.Col span={5}>
<Stack spacing={"xs"}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
Judul Donasi Bisa Dilihat Disini Untuk Contoh
{invoice.map((e, i) => (
<Box
key={i}
onClick={() =>
onClick(router, e.donasiMaster_StatusInvoiceId, e.id, e.Donasi.id)
}
>
<Stack>
<Grid>
<Grid.Col span={5}>
<Stack spacing={5}>
<Stack spacing={0}>
<Text fz={"xs"} fw={"bold"} truncate>
{e.Donasi.title}
</Text>
<Progress value={50} color="orange" />
<ComponentDonasi_TampilanHitungMundur
durasi={e.Donasi.DonasiMaster_Durasi.name}
publishTime={e.Donasi.publishTime}
textSize={10}
/>
</Stack>
<Progress value={+e.Donasi.progres} color="orange" />
<Group position="apart">
<Stack spacing={0}>
<Text fz={"sm"}>Donasi Saya</Text>
<Text fz={"sm"} fw={"bold"} c={"orange"} truncate>
Rp. 25.000.000
<Text fz={10}>Donasi Saya</Text>
<Text fz={10} fw={"bold"} c={"orange"} truncate>
<TampilanRupiahDonasi nominal={+e.nominal} />
</Text>
</Stack>
</Stack>
</Grid.Col>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={"/aset/no-img.png"}
radius={"md"}
/>
</Paper>
</AspectRatio>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</Group>
<Badge size="xs" variant="dot">
<Text>{e.DonasiMaster_StatusInvoice.name}</Text>
</Badge>
</Stack>
</Grid.Col>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={RouterDonasi.api_gambar + `${e.Donasi.imagesId}`}
radius={"md"}
/>
</Paper>
</AspectRatio>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
</>
);
}
function HitungMundur({
durasi,
publishTime,
}: {
durasi: string;
publishTime: Date;
}) {
return (
<>
<Stack spacing={0} align="center">
<Text fz={"xs"}>Sisa hari </Text>
<Text span inherit fw={"bold"} fz={"xs"}>
{Number(durasi) -
moment(new Date()).diff(new Date(publishTime), "days") <=
0
? 0
: Number(durasi) -
moment(new Date()).diff(new Date(publishTime), "days")}
</Text>
</Stack>
</>
);
}
async function onClick(
router: AppRouterInstance,
status: string,
invoiceId: string,
donasiId: string
) {
if (status === "1") {
return router.push(RouterDonasi.detail_donasi_saya + `${invoiceId}`);
} else {
if (status === "2") {
return router.push(RouterDonasi.proses_transaksi + `${invoiceId}`);
} else {
if (status === "3") {
return router.push(RouterDonasi.invoice + `${invoiceId}`);
} else {
toast("gagal");
}
}
}
}

56
src/app_modules/donasi/main/galang_dana.tsx
View File

@@ -23,7 +23,17 @@ import { Warna } from "@/app/lib/warna";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import PostingDraftDonasi from "./galang_dana/draft";
export default function GalangDanaDonasi({listReview, listDraft}: {listReview: any, listDraft: any}) {
export default function GalangDanaDonasi({
listPublish,
listReview,
listDraft,
listReject
}: {
listPublish: any;
listReview: any;
listDraft: any;
listReject: any
}) {
const router = useRouter();
const [tabsPostingDonasi, setTabsPostingDonasi] = useAtom(
gs_donasi_tabs_posting
@@ -33,7 +43,7 @@ export default function GalangDanaDonasi({listReview, listDraft}: {listReview: a
{
id: 1,
value: "Publish",
path: <PostingPublishDonasi data={"1"} />,
path: <PostingPublishDonasi listPublish={listPublish} />,
color: "green",
},
{
@@ -51,7 +61,7 @@ export default function GalangDanaDonasi({listReview, listDraft}: {listReview: a
{
id: 4,
value: "Reject",
path: <PostingRejectDonasi data={"4"} />,
path: <PostingRejectDonasi listReject={listReject} />,
color: "red",
},
];
@@ -69,7 +79,7 @@ export default function GalangDanaDonasi({listReview, listDraft}: {listReview: a
Galang Dana
</Button>
</Affix>
<Stack >
<Stack>
<Tabs
color="orange"
variant="pills"
@@ -79,27 +89,27 @@ export default function GalangDanaDonasi({listReview, listDraft}: {listReview: a
onTabChange={setTabsPostingDonasi}
>
<Stack>
<Tabs.List grow>
{listPosting.map((e, i) => (
<Tabs.Tab
key={e.id}
value={e.value}
bg={tabsPostingDonasi === e.value ? e.color : "gray.1"}
>
<Text
c={tabsPostingDonasi === e.value ? "white" : "gray"}
fw={tabsPostingDonasi === e.value ? 900 : "normal"}
<Tabs.List grow>
{listPosting.map((e, i) => (
<Tabs.Tab
key={e.id}
value={e.value}
bg={tabsPostingDonasi === e.value ? e.color : "gray.1"}
>
{e.value}
</Text>
</Tabs.Tab>
<Text
c={tabsPostingDonasi === e.value ? "white" : "gray"}
fw={tabsPostingDonasi === e.value ? 900 : "normal"}
>
{e.value}
</Text>
</Tabs.Tab>
))}
</Tabs.List>
{listPosting.map((e, i) => (
<Tabs.Panel key={e.id} value={e.value} pt="xs">
{e.path}
</Tabs.Panel>
))}
</Tabs.List>
{listPosting.map((e, i) => (
<Tabs.Panel key={e.id} value={e.value} pt="xs">
{e.path}
</Tabs.Panel>
))}
</Stack>
</Tabs>
</Stack>

66
src/app_modules/donasi/main/galang_dana/publish.tsx
View File

@@ -21,64 +21,20 @@ import {
import { useViewportSize } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import toast from "react-simple-toasts";
import { MODEL_DONASI } from "../../model/interface";
import { useState } from "react";
import TampilanRupiahDonasi from "../../component/tampilan_rupiah";
import ComponentDonasi_TampilanHitungMundur from "../../component/tampilan_hitung_mundur";
import ComponentDonasi_BoxPublish from "../../component/box_publish";
export default function PostingPublishDonasi({ data }: { data: any }) {
const router = useRouter();
const { height, width } = useViewportSize();
export default function PostingPublishDonasi({
listPublish,
}: {
listPublish: MODEL_DONASI[];
}) {
return (
<>
<SimpleGrid
cols={4}
spacing="lg"
breakpoints={[
{ maxWidth: "62rem", cols: 3, spacing: "md" },
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{Array(5)
.fill(0)
.map((e, i) => (
<Box
key={i}
onClick={() =>
router.push(RouterDonasi.detail_publish)
// toast("Cooming soon")
}
>
<Stack>
<Grid>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={"/aset/no-img.png"}
radius={"md"}
/>
</Paper>
</AspectRatio>
</Grid.Col>
<Grid.Col span={5}>
<Stack spacing={"xs"}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
Judul Donasi Bisa Dilihat Disini Untuk Contoh
</Text>
<Progress value={50} color="orange" />
<Stack spacing={0}>
<Text fz={"sm"}>Terkumpul</Text>
<Text fz={"sm"} fw={"bold"} c={"orange"} truncate>
Rp. 100.000.000
</Text>
</Stack>
</Stack>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
<ComponentDonasi_BoxPublish dataDonasi={listPublish} path={RouterDonasi.detail_publish} />
</>
);
}

83
src/app_modules/donasi/main/galang_dana/reject.tsx
View File

@@ -19,15 +19,19 @@ import {
import { useViewportSize } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import toast from "react-simple-toasts";
import { MODEL_DONASI } from "../../model/interface";
import { useState } from "react";
export default function PostingRejectDonasi({ data }: { data: any }) {
export default function PostingRejectDonasi({
listReject,
}: {
listReject: MODEL_DONASI[];
}) {
const { height, width } = useViewportSize();
const router = useRouter()
const router = useRouter();
const [donasi, setDonasi] = useState(listReject)
return (
<>
<SimpleGrid
cols={4}
spacing="lg"
@@ -37,45 +41,44 @@ export default function PostingRejectDonasi({ data }: { data: any }) {
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{Array(5)
.fill(0)
{donasi
.map((e, i) => (
<Box
key={i}
onClick={() =>
router.push(RouterDonasi.detail_reject)
}
>
<Stack>
<Grid>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image alt="Foto" src={"/aset/no-img.png"} radius={"md"} />
</Paper>
</AspectRatio>
</Grid.Col>
<Grid.Col span={5}>
<Stack spacing={"xs"}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
Judul Donasi Bisa Dilihat Disini Untuk Contoh
</Text>
<Stack spacing={0}>
<Text fz={"sm"} fw={"bold"}>Alasan ditolak</Text>
<Text fz={"sm"} lineClamp={2}>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Expedita inventore rem iure praesentium delectus consectetur
alias, veniam, fugit in ab esse recusandae mollitia quasi
perferendis tenetur suscipit architecto saepe! Animi.
key={i}
onClick={() => router.push(RouterDonasi.detail_reject + `${e.id}`)}
>
<Stack>
<Grid>
<Grid.Col span={7}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={RouterDonasi.api_gambar + `${e.imagesId}`}
radius={"md"}
/>
</Paper>
</AspectRatio>
</Grid.Col>
<Grid.Col span={5}>
<Stack spacing={"xs"}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
{e.title}
</Text>
<Stack spacing={0}>
<Text fz={"sm"} fw={"bold"}>
Alasan ditolak
</Text>
<Text fz={"sm"} lineClamp={2}>
{e.catatan}
</Text>
</Stack>
</Stack>
</Stack>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
</>