Files
hipmi/src/app_modules/admin/donasi/component/tampilan_detail_donasi.tsx
2025-02-25 10:46:18 +08:00

66 lines
2.0 KiB
TypeScript

"use client";
import { RouterDonasi } from "@/lib/router_hipmi/router_donasi";
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
import {
Paper,
Stack,
Title,
Box,
AspectRatio,
Group,
Image,
Text,
} from "@mantine/core";
import { Admin_ComponentLoadImageLandscape } from "../../_admin_global";
import ComponentAdminGlobal_TampilanRupiahDonasi from "../../_admin_global/tampilan_rupiah";
import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
export default function ComponentAdminDonasi_TampilanDetailDonasi({
donasi,
}: {
donasi: MODEL_DONASI;
}) {
return (
<>
<Paper radius={"md"} p={"md"} bg={AdminColor.softBlue}>
<Stack>
<Title c={AdminColor.white} order={5}>Detail Data Donasi</Title>
<Stack>
<Box>
<Admin_ComponentLoadImageLandscape fileId={donasi.imageId} />
</Box>
<Stack spacing={0}>
<Title c={AdminColor.white} order={4}>{donasi.title}</Title>
<Text c={AdminColor.white} fz={"xs"}>
Durasi: {donasi.DonasiMaster_Durasi.name} hari
</Text>
</Stack>
<Stack spacing={0}>
<Group>
<Text fz={12} c={AdminColor.white}>Dana dibutuhkan</Text>
<Title order={4} c="blue">
<ComponentGlobal_TampilanRupiah
color={AdminColor.yellow}
nominal={+donasi.target}
/>
</Title>
</Group>
<Group>
<Text c={AdminColor.white} fz={12}>Kategori</Text>
<Title order={4} c="blue">
{donasi.DonasiMaster_Ketegori.name}
</Title>
</Group>
</Stack>
</Stack>
</Stack>
</Paper>
</>
);
}