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

# style:

Browse Source 
- UI Investasi
- UI Donasi
## No issue
This commit is contained in:
Bagasbanuna02
2024-08-01 16:48:54 +08:00
parent 810ce1c00d
commit 2ab3a8abb1
135 changed files with 2222 additions and 1652 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/app_modules/donasi/detail/detail_main/cerita_penggalang/layout.tsx
View File

@@ -10,17 +10,19 @@ import React from "react";
export default function LayoutCeritaPenggalangDonasi({
children,
statusDonasiId,
donasiId
donasiId,
}: {
children: React.ReactNode;
statusDonasiId: string;
donasiId: string
donasiId: string;
}) {
if (statusDonasiId !== "1") {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Cerita Penggalang Dana" />}
header={
<UIGlobal_LayoutHeaderTamplate title="Cerita Penggalang Dana" />
}
>
{children}
</UIGlobal_LayoutTamplate>
@@ -28,11 +30,11 @@ export default function LayoutCeritaPenggalangDonasi({
);
}
return (
<AppComponentGlobal_LayoutTamplate
header={<ComponentDonasi_HeaderTamplate title="Cerita Penggalang Dana" />}
footer={<ButtonDonasi donasiId={donasiId}/>}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Cerita Penggalang Dana" />}
footer={<ButtonDonasi donasiId={donasiId} />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
);
}

93
src/app_modules/donasi/detail/detail_main/donatur/index.tsx
View File

@@ -1,23 +1,13 @@
"use client";
"use dev";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import ComponentDonasi_IsEmptyData from "@/app_modules/donasi/component/is_empty_data";
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
import { MODEL_DONASI_INVOICE } from "@/app_modules/donasi/model/interface";
import {
Avatar,
Center,
Grid,
Group,
Paper,
SimpleGrid,
Stack,
Text,
Title,
} from "@mantine/core";
import { IconMoodSmile, IconMoodSmileBeam } from "@tabler/icons-react";
import _, { size } from "lodash";
import moment from "moment";
import { Center, Grid, Group, Paper, Stack, Text, Title } from "@mantine/core";
import { IconMoodSmileBeam } from "@tabler/icons-react";
import _ from "lodash";
import { useState } from "react";
export default function DonaturDonasi({
@@ -30,44 +20,45 @@ export default function DonaturDonasi({
return (
<>
<SimpleGrid
cols={4}
spacing="md"
breakpoints={[
{ maxWidth: "62rem", cols: 3, spacing: "md" },
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
{donatur.map((e, i) => (
<Paper key={i} bg={"gray.1"} p={"sm"}>
<Grid>
<Grid.Col span={3}>
<Center h={"100%"}>
{/* <Avatar variant="filled" radius={"xl"} size={"md"} /> */}
<IconMoodSmileBeam size={50} />
</Center>
</Grid.Col>
<Grid.Col span={9}>
<Stack spacing={0}>
<Title order={5}>{e.Author.username}</Title>
<Group spacing={"xs"}>
<Text fz={"xs"}>Berdonasi sebesar</Text>
<Text truncate fw={"bold"}>
<TampilanRupiahDonasi nominal={+e.nominal} />
</Text>
</Group>
<Text fz={"xs"}>
{new Intl.DateTimeFormat("id-ID", {
dateStyle: "full",
}).format(e?.createdAt)}
{donatur.map((e, i) => (
<Paper
key={i}
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "10px",
}}
>
<Grid>
<Grid.Col span={3}>
<Center h={"100%"}>
{/* <Avatar variant="filled" radius={"xl"} size={"md"} /> */}
<IconMoodSmileBeam size={50} />
</Center>
</Grid.Col>
<Grid.Col span={9}>
<Stack spacing={0}>
<Title order={5}>{e.Author.username}</Title>
<Group spacing={"xs"}>
<Text fz={"xs"}>Berdonasi sebesar</Text>
<Text truncate fw={"bold"}>
<TampilanRupiahDonasi nominal={+e.nominal} />
</Text>
</Stack>
</Grid.Col>
</Grid>
</Paper>
))}
</SimpleGrid>
</Group>
<Text fz={"xs"}>
{new Intl.DateTimeFormat("id-ID", {
dateStyle: "full",
}).format(e?.createdAt)}
</Text>
</Stack>
</Grid.Col>
</Grid>
</Paper>
))}
</>
);
}

10
src/app_modules/donasi/detail/detail_main/donatur/layout.tsx
View File

@@ -1,8 +1,8 @@
"use client";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentDonasi_HeaderTamplate from "../../../component/header_tamplate";
export default function LayoutDonaturDonasi({
children,
@@ -11,9 +11,11 @@ export default function LayoutDonaturDonasi({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate header={<ComponentDonasi_HeaderTamplate title="Donatur" />}>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Donatur" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

48
src/app_modules/donasi/detail/detail_main/kabar/index.tsx
View File

@@ -1,25 +1,11 @@
"use client";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentDonasi_ListKabar from "@/app_modules/donasi/component/detail_main/list_kabar";
import ComponentDonasi_IsEmptyData from "@/app_modules/donasi/component/is_empty_data";
import { MODEL_DONASI_KABAR } from "@/app_modules/donasi/model/interface";
import {
ActionIcon,
Avatar,
Box,
Group,
Paper,
SimpleGrid,
Spoiler,
Stack,
Text,
Title,
} from "@mantine/core";
import { IconCircleChevronRight } from "@tabler/icons-react";
import { Box } from "@mantine/core";
import _ from "lodash";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
export default function KabarDonasi({
@@ -27,31 +13,21 @@ export default function KabarDonasi({
}: {
listKabar: MODEL_DONASI_KABAR[];
}) {
const router = useRouter();
const [kabar, setKabar] = useState(listKabar);
if (_.isEmpty(kabar)) return <ComponentDonasi_IsEmptyData />;
if (_.isEmpty(kabar)) return <ComponentGlobal_IsEmptyData />;
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" },
]}
>
{kabar.map((e, i) => (
<Box key={i}>
<ComponentDonasi_ListKabar
kabar={e}
route={RouterDonasi.detail_kabar}
/>
</Box>
))}
</SimpleGrid>
{kabar.map((e, i) => (
<Box key={i}>
<ComponentDonasi_ListKabar
kabar={e}
route={RouterDonasi.detail_kabar}
/>
</Box>
))}
</>
);
}

11
src/app_modules/donasi/detail/detail_main/kabar/layout.tsx
View File

@@ -1,9 +1,8 @@
"use client";
import { AppShell } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentDonasi_HeaderTamplate from "../../../component/header_tamplate";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
export default function LayoutKabarDonasi({
children,
@@ -12,11 +11,11 @@ export default function LayoutKabarDonasi({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentDonasi_HeaderTamplate title="Kabar Terbaru" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Kabar Terbaru" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}