QC Investasi

# fix
Tampilan admin investasi
Tampilan admin donasi
## No issuee
This commit is contained in:
2024-05-31 16:41:34 +08:00
parent c28cceb46f
commit 5b8cd3a4b6
175 changed files with 4785 additions and 2296 deletions

View File

@@ -20,6 +20,8 @@ import { MODEL_DONASI } from "../model/interface";
import { useViewportSize } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react";
import _ from "lodash";
import ComponentDonasi_IsEmptyData from "./is_empty_data";
export default function ComponentDonasi_BoxPublish({
dataDonasi,
@@ -33,62 +35,66 @@ export default function ComponentDonasi_BoxPublish({
const [donasi, setDonasi] = useState(dataDonasi);
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" },
]}
>
{donasi.map((e, i) => (
<Box
key={i}
onClick={() => {
router.push(path + `${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"}>
<Stack spacing={0}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
{e.title}
</Text>
<ComponentDonasi_TampilanHitungMundur
durasi={e.DonasiMaster_Durasi.name}
publishTime={e.publishTime}
textSize={10}
/>
{_.isEmpty(dataDonasi) ? (
<ComponentDonasi_IsEmptyData text="Tidak ada data" />
) : (
<SimpleGrid
cols={4}
spacing="lg"
breakpoints={[
{ maxWidth: "62rem", cols: 3, spacing: "md" },
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{donasi.map((e, i) => (
<Box
key={i}
onClick={() => {
router.push(path + `${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"}>
<Stack spacing={0}>
<Text fz={"sm"} fw={"bold"} lineClamp={2}>
{e.title}
</Text>
<ComponentDonasi_TampilanHitungMundur
durasi={e.DonasiMaster_Durasi.name}
publishTime={e.publishTime}
textSize={10}
/>
</Stack>
<Progress value={+e.progres} color="orange" />
<Stack spacing={0}>
<Text fz={"sm"}>Terkumpul</Text>
<Text fz={"sm"} fw={"bold"} c={"orange"} truncate>
<TampilanRupiahDonasi nominal={+e.terkumpul} />
</Text>
</Stack>
</Stack>
<Progress value={+e.progres} color="orange" />
<Stack spacing={0}>
<Text fz={"sm"}>Terkumpul</Text>
<Text fz={"sm"} fw={"bold"} c={"orange"} truncate>
<TampilanRupiahDonasi nominal={+e.terkumpul} />
</Text>
</Stack>
</Stack>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
</Grid.Col>
</Grid>
{width > 575 ? "" : <Divider />}
</Stack>
</Box>
))}
</SimpleGrid>
)}
</>
);
}

View File

@@ -14,25 +14,25 @@ import {
} from "@mantine/core";
import TampilanRupiahDonasi from "../tampilan_rupiah";
export default function ComponentDonasi_DetailDataGalangDana({ donasi }: { donasi: MODEL_DONASI }) {
export default function ComponentDonasi_DetailDataGalangDana({
donasi,
}: {
donasi: MODEL_DONASI;
}) {
const router = useRouter();
return (
<>
<Stack>
<Stack px={"xs"}>
<Stack>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
/>
</Paper>
</AspectRatio>
<Image
alt="Foto"
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
/>
{/* <AspectRatio ratio={9 / 16} maw={500} mah={1000} bg={"blue"}>
</AspectRatio> */}
<Stack spacing={0}>
<Title order={4}>{donasi.title}</Title>
<Text fz={10}>
Durasi: {donasi.DonasiMaster_Durasi.name} hari
</Text>
<Text fz={10}>Durasi: {donasi.DonasiMaster_Durasi.name} hari</Text>
</Stack>
<Stack spacing={0}>
<Group position="apart">

View File

@@ -6,6 +6,7 @@ import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import { Stack, Title, Paper, Group, ActionIcon, Text } from "@mantine/core";
import { IconCircleChevronRight } from "@tabler/icons-react";
import moment from "moment";
import { useState } from "react";
export default function ComponentDonasi_CeritaPenggalangMain({
donasi,
@@ -13,6 +14,7 @@ export default function ComponentDonasi_CeritaPenggalangMain({
donasi: MODEL_DONASI;
}) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
return (
<>
<Stack spacing={"xs"}>
@@ -20,12 +22,18 @@ export default function ComponentDonasi_CeritaPenggalangMain({
<Paper p={"sm"} withBorder>
<Stack>
<Group position="apart">
<Text>{moment(donasi.createdAt).format("ll")}</Text>
<Text>
{new Intl.DateTimeFormat("id-ID", { dateStyle: "full" }).format(
donasi.createdAt
)}
</Text>
<ActionIcon
loading={isLoading ? true : false}
variant="transparent"
onClick={() =>
router.push(RouterDonasi.cerita_penggalang + `${donasi.id}`)
}
onClick={() => {
setLoading(true);
router.push(RouterDonasi.cerita_penggalang + `${donasi.id}`);
}}
>
<IconCircleChevronRight />
</ActionIcon>

View File

@@ -14,6 +14,8 @@ import {
Divider,
Image,
Text,
Center,
Loader,
} from "@mantine/core";
import {
IconClover,
@@ -26,6 +28,8 @@ import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.share
import { NotifPeringatan } from "../notifikasi/notif_peringatan";
import { NotifBerhasil } from "../notifikasi/notif_berhasil";
import { Donasi_findDonaturByTokenId } from "../../fun/get/get_donatur_by_token_id";
import { useState } from "react";
import ComponentGlobal_CardLoadingOverlay from "@/app_modules/component_global/loading_card";
export function ComponentDonasi_DetailDataMain({
donasi,
@@ -37,19 +41,28 @@ export function ComponentDonasi_DetailDataMain({
userLoginId?: string | any;
}) {
const router = useRouter();
const [isLoadingDonatur, setLoadingDonatur] = useState(false);
const [isLoadingKabar, setLoadingKabar] = useState(false);
const [isLoadingPencairan, setLoadingPencairan] = useState(false);
return (
<>
<Stack>
<Stack px={"xs"}>
<Stack>
<AspectRatio ratio={16 / 9}>
<Center>
<Image
mah={500}
maw={"auto"}
radius={"md"}
alt="Foto"
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
/>
</Center>
{/* <AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt="Foto"
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
/>
</Paper>
</AspectRatio>
<Stack spacing={0}>
</AspectRatio> */}
<Stack spacing={0} mt={"lg"}>
<Title order={4}>{donasi.title}</Title>
<ComponentDonasi_TampilanHitungMundur
durasi={donasi.DonasiMaster_Durasi.name}
@@ -84,11 +97,19 @@ export function ComponentDonasi_DetailDataMain({
<Grid>
<Grid.Col
span={"auto"}
onClick={() => router.push(RouterDonasi.donatur + `${donasi.id}`)}
onClick={() => {
setLoadingDonatur(true);
router.push(RouterDonasi.donatur + `${donasi.id}`);
}}
>
<Stack align="center" spacing={"xs"}>
<Group>
<IconClover color="skyblue" />
{isLoadingDonatur ? (
<Loader size={25} />
) : (
<IconClover color="skyblue" />
)}
<Title order={6} c={"blue"}>
{countDonatur}
</Title>
@@ -99,20 +120,34 @@ export function ComponentDonasi_DetailDataMain({
<Divider orientation="vertical" />
<Grid.Col
span={"auto"}
onClick={() => router.push(RouterDonasi.kabar + `${donasi.id}`)}
onClick={() => {
setLoadingKabar(true);
router.push(RouterDonasi.kabar + `${donasi.id}`);
}}
>
<Stack spacing={"sm"} align="center">
<IconMessageChatbot color="skyblue" />
{isLoadingKabar ? (
<Loader size={25} />
) : (
<IconMessageChatbot color="skyblue" />
)}
<Text fz={"xs"}>Kabar Terbaru</Text>
</Stack>
</Grid.Col>
<Divider orientation="vertical" />
<Grid.Col
span={"auto"}
onClick={() => onPencairanDana(router, donasi, userLoginId)}
onClick={() => {
setLoadingPencairan(true);
onPencairanDana(router, donasi, userLoginId);
}}
>
<Stack spacing={"sm"} align="center">
<IconMoneybag color="skyblue" />
{isLoadingPencairan ? (
<Loader size={25} />
) : (
<IconMoneybag color="skyblue" />
)}
<Text fz={"xs"}>Pencairan Dana</Text>
</Stack>
</Grid.Col>
@@ -132,10 +167,10 @@ async function onPencairanDana(
// console.log(donasi.authorId)
const cek = await Donasi_findDonaturByTokenId(donasi.id, userLoginId);
if(userLoginId == donasi.authorId)
return router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
if (userLoginId == donasi.authorId)
return router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
if (!cek ) return NotifPeringatan("Halaman khusus donatur");
if (!cek) return NotifPeringatan("Halaman khusus donatur");
router.push(RouterDonasi.pencairan_dana + `${donasi.id}`);
// if (userLoginId != donasi.authorId)

View File

@@ -1,50 +1,68 @@
"use client"
"use client";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import { MODEL_USER } from "@/app_modules/home/model/interface";
import { Stack, Title, Paper, Group, ActionIcon, Avatar, Text } from "@mantine/core";
import {
Stack,
Title,
Paper,
Group,
ActionIcon,
Avatar,
Text,
} from "@mantine/core";
import { IconCircleChevronRight } from "@tabler/icons-react";
import _ from "lodash";
import { useRouter } from "next/navigation";
import ComponentDonasi_NotedBox from "../noted_box";
import { useState } from "react";
export default function ComponentDonasi_InformasiPenggalangMain({ author }: { author: MODEL_USER}) {
const router = useRouter();
return (
<>
export default function ComponentDonasi_InformasiPenggalangMain({
author,
}: {
author: MODEL_USER;
}) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
return (
<>
{/* <pre>{JSON.stringify(author, null, 2)}</pre> */}
<Stack spacing={"xs"}>
<Title order={4}>Informasi Penggalang Dana</Title>
<Paper p={"sm"} withBorder>
<Stack>
<Group position="apart">
<Title order={5}>Penggalang Dana</Title>
<ActionIcon
variant="transparent"
onClick={() => router.push(RouterDonasi.penggalang_dana + `${author.id}`)}
>
<IconCircleChevronRight />
</ActionIcon>
</Group>
<Group>
<Avatar radius={"xl"} variant="filled" bg={"blue"}>
{(() => {
const usr = author.username;
const splt = usr.split("");
const Up = _.upperCase(splt[0]);
return Up;
})()}
</Avatar>
<Text>{author.username}</Text>
</Group>
<ComponentDonasi_NotedBox
informasi="Semua dana yang terkumpul akan disalurkan ke penggalang dana,
<Stack spacing={"xs"}>
<Title order={4}>Informasi Penggalang Dana</Title>
<Paper p={"sm"} withBorder>
<Stack>
<Group position="apart">
<Title order={5}>Penggalang Dana</Title>
<ActionIcon
loading={isLoading ? true : false}
variant="transparent"
onClick={() => {
setLoading(true);
router.push(RouterDonasi.penggalang_dana + `${author.id}`);
}}
>
<IconCircleChevronRight />
</ActionIcon>
</Group>
<Group>
<Avatar radius={"xl"} variant="filled" bg={"blue"}>
{(() => {
const usr = author.username;
const splt = usr.split("");
const Up = _.upperCase(splt[0]);
return Up;
})()}
</Avatar>
<Text>{author.username}</Text>
</Group>
<ComponentDonasi_NotedBox
informasi="Semua dana yang terkumpul akan disalurkan ke penggalang dana,
kabar penyaluran dapat dilihat di halaman kabar terbaru."
/>
</Stack>
</Paper>
</Stack>
</>
);
}
/>
</Stack>
</Paper>
</Stack>
</>
);
}

View File

@@ -4,9 +4,11 @@ import { Footer, Center, Button } from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_proses_donasi } from "../global_state";
import { useState } from "react";
export default function ButtonDonasi({ donasiId }: { donasiId: string }) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
const [prosesDonasi, setProsesDonasi] = useAtom(gs_proses_donasi);
async function onClick() {
@@ -16,6 +18,7 @@ export default function ButtonDonasi({ donasiId }: { donasiId: string }) {
nominal: "",
norek: "",
});
setLoading(true);
router.push(RouterDonasi.masukan_donasi + `${donasiId}`);
}
@@ -23,7 +26,13 @@ export default function ButtonDonasi({ donasiId }: { donasiId: string }) {
<>
<Footer height={70} px={"md"} sx={{ borderStyle: "none" }}>
<Center h={70}>
<Button w={"100%"} radius={"xl"} onClick={() => onClick()}>
<Button
loaderPosition="center"
loading={isLoading ? true : false}
w={"100%"}
radius={"xl"}
onClick={() => onClick()}
>
Donasi
</Button>
</Center>

View File

@@ -15,7 +15,7 @@ export default function ComponentDonasi_HeaderTamplate({
bg,
}: {
hideBack?: boolean;
changeIconBack?: any
changeIconBack?: any;
route?: any;
route2?: any;
title: string;
@@ -23,6 +23,9 @@ export default function ComponentDonasi_HeaderTamplate({
bg?: any;
}) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
const [isRightLoading, setRightLoading] = useState(false);
return (
<>
<Header
@@ -35,8 +38,10 @@ export default function ComponentDonasi_HeaderTamplate({
<ActionIcon variant="transparent" disabled></ActionIcon>
) : (
<ActionIcon
loading={isLoading ? true : false}
variant="transparent"
onClick={() => {
setLoading(true);
if (route === null || route === undefined) {
return router.back();
} else {
@@ -44,7 +49,7 @@ export default function ComponentDonasi_HeaderTamplate({
}
}}
>
{changeIconBack ? changeIconBack: <IconChevronLeft />}
{changeIconBack ? changeIconBack : <IconChevronLeft />}
</ActionIcon>
)}
<Title order={5}>{title}</Title>
@@ -54,8 +59,12 @@ export default function ComponentDonasi_HeaderTamplate({
} else {
return (
<ActionIcon
loading={isRightLoading ? true : false}
variant="transparent"
onClick={() => router.push(route2)}
onClick={() => {
setRightLoading(true);
router.push(route2);
}}
>
{icon}
</ActionIcon>

View File

@@ -0,0 +1,17 @@
"use client";
import { Center } from "@mantine/core";
export default function ComponentDonasi_IsEmptyData({
text,
}: {
text?: string;
}) {
return (
<>
<Center h={"50vh"} fz={"sm"} c="gray" fw={"bold"} style={{ zIndex: 1 }}>
{text ? text : "Tidak ada data"}
</Center>
</>
);
}