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

feat

Browse Source 
Desc:
- Fitur metode transfer

fix
Desc:
- Perubahan minor

#No issue
This commit is contained in:
Bagasbanuna02
2023-10-26 17:41:11 +08:00
parent aec05b5a97
commit c0fcfc6096
19 changed files with 541 additions and 171 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/aset/dummy_file.pdf Normal file
View File

Binary file not shown.

14
src/app/dev/investasi/metode_transfer/layout.tsx Normal file
View File

@@ -0,0 +1,14 @@
import { LayoutMetodeTransferInvestasi } from "@/app_modules/investasi";
import React from "react";
export default async function Layout({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
<LayoutMetodeTransferInvestasi>{children}</LayoutMetodeTransferInvestasi>
</>
);
}

9
src/app/dev/investasi/metode_transfer/page.tsx Normal file
View File

@@ -0,0 +1,9 @@
import { MetodeTransferInvestasi } from "@/app_modules/investasi";
export default async function Page() {
return (
<>
<MetodeTransferInvestasi />
</>
);
}

4
src/app/dev/investasi/upload_bukti/page.tsx
View File

@@ -1,5 +1,5 @@
import { UploadBuktiTransferInvestasi } from "@/app_modules/investasi";
export default async function Page() {
return <UploadBuktiTransferInvestasi/>
}
return <UploadBuktiTransferInvestasi />;
}

4
src/app/lib/app_route.ts
View File

@@ -1,5 +1,9 @@
export const RouteInvestasi = {
//INVESTASI
// portofolio
portofolio: "/dev/investasi/main/portofolio",
// proses beli saham
metode_transfer: "/dev/investasi/metode_transfer",
// edit //
edit_intro: "/dev/investasi/edit_intro/",
edit_prospektus: "/dev/investasi/edit_prospektus/",

7
src/app_modules/crowd/main/view.tsx
View File

@@ -1,5 +1,6 @@
"use client";
import { Warna } from "@/app/lib/warna";
import { Button, Center, Stack, Text, Title } from "@mantine/core";
import { useRouter } from "next/navigation";
import toast from "react-simple-toasts";
@@ -14,14 +15,16 @@ export default function MainCrowd() {
<Text>HIPMI Crowd Funding</Text>
<Button
w={300}
bg={"green"}
radius={50}
bg={Warna.hijau_tua}
onClick={() => router.push("/dev/investasi/main")}
>
Investasi
</Button>
<Button
w={300}
bg={"grape"}
bg={Warna.biru}
radius={50}
onClick={() => toast("Cooming Soon Feature...")}
>
Donasi

7
src/app_modules/investasi/create/view.tsx
View File

@@ -20,6 +20,7 @@ import { useRouter } from "next/navigation";
import { useState } from "react";
import { funCreateInvestasi } from "../fun/fun_create_investasi";
import toast from "react-simple-toasts";
import { RouteInvestasi } from "@/app/lib/app_route";
export default function InvestasiCreate({
id,
@@ -58,13 +59,15 @@ export default function InvestasiCreate({
masterPembagianDevidenId: value.pembagianDevidenId,
masterPencarianInvestorId: value.pencarianInvestorId,
};
toast("Berhasil disimpan")
return setTimeout(() => router.push(RouteInvestasi.portofolio), 2000);
// if (_.values(body).includes("")) return toast("Lengkapi data");
// if (!fl) return toast("File Kosong");
// const fd = new FormData();
// fd.append("file", fl);
return router.push("/dev/investasi/main");
// await funCreateInvestasi(fd, body as any).then((res) => {
// if (res.status === 201) {
// toast(res.message);

65
src/app_modules/investasi/detail_dokumen/view.tsx
View File

@@ -1,35 +1,36 @@
"use client"
"use client";
import { Paper, Grid, Center, Text } from "@mantine/core"
import { IconChevronRight } from "@tabler/icons-react"
import Link from "next/link"
import { Paper, Grid, Center, Text } from "@mantine/core";
import { IconChevronRight } from "@tabler/icons-react";
import Link from "next/link";
export default function DetailDokumenInvestasi(){
return<>
<Link
href={"https://pii.or.id/uploads/dummies.pdf"}
target="_blank"
style={{ textDecorationLine: "none" }}
>
<Paper w={"100%"} h={50} bg={"gray"} mb={"md"}>
<Grid
align="center"
justify="center"
h={50}
px={"sm"}
onClick={() => ""}
>
<Grid.Col span={10}>
<Text>Nama File.pdf</Text>
</Grid.Col>
<Grid.Col span={2}>
<Center>
<IconChevronRight />
</Center>
</Grid.Col>
</Grid>
</Paper>
</Link>
export default function DetailDokumenInvestasi() {
return (
<>
<Link
href={"/aset/dummy_file.pdf"}
target="_blank"
style={{ textDecorationLine: "none" }}
>
<Paper w={"100%"} h={50} bg={"gray"} mb={"md"}>
<Grid
align="center"
justify="center"
h={50}
px={"sm"}
onClick={() => ""}
>
<Grid.Col span={10}>
<Text>Nama File.pdf</Text>
</Grid.Col>
<Grid.Col span={2}>
<Center>
<IconChevronRight />
</Center>
</Grid.Col>
</Grid>
</Paper>
</Link>
</>
}
);
}

2
src/app_modules/investasi/detail_prospektus/view.tsx
View File

@@ -8,7 +8,7 @@ export default function DetailPropektus() {
return (
<>
<Link
href={"https://pii.or.id/uploads/dummies.pdf"}
href={"/aset/dummy_file.pdf"}
target="_blank"
style={{ textDecorationLine: "none" }}
>

80
src/app_modules/investasi/dummy/data_dummy.json
View File

@@ -14,7 +14,12 @@
"masterPembagianDevidenId": 3,
"masterPencarianInvestorId": 60,
"imagesId": "clny2l8dj0000tlagcpsi9dmz",
"persentase": 40
"persentase": 40,
"saham_beli": 1,
"statusPorto": {
"id": 1,
"status": "Draft"
}
},
{
"id": "clnxyjc0r0002tlamg8fn9ubk",
@@ -31,6 +36,77 @@
"masterPembagianDevidenId": 6,
"masterPencarianInvestorId": 4,
"imagesId": "clnxyjc070000tlamc5jmsqse",
"persentase": 60
"persentase": 60,
"saham_beli": 0,
"statusPorto": {
"id": 2,
"status": "Review"
}
},
{
"id": "clnwzrcqz0002tlqlrb3b8kif",
"title": "Weeding EO",
"targetDana": "300000",
"hargaLembar": "1000",
"totalLembar": "3000",
"roi": "6",
"active": true,
"createdAt": "2023-10-19T09:40:20.171Z",
"updatedAt": "2023-10-19T09:40:20.171Z",
"authorId": "clntxvesu0002tlnbz030gx30",
"masterPeriodeDevidenId": "Selamanya",
"masterPembagianDevidenId": 6,
"masterPencarianInvestorId": 30,
"imagesId": "clnwzrcqs0000tlqlfr2cmbo5",
"persentase": 30,
"saham_beli": 1,
"statusPorto": {
"id": 3,
"status": "Accept"
}
},
{
"id": "clnwzmah00005tlwdn1h7htp6",
"title": "Exi EO",
"targetDana": "100000",
"hargaLembar": "1000",
"totalLembar": "1000",
"roi": "3",
"active": true,
"createdAt": "2023-10-19T09:36:23.940Z",
"updatedAt": "2023-10-19T09:36:23.940Z",
"authorId": "clntxvesu0002tlnbz030gx30",
"masterPeriodeDevidenId": "Selamanya",
"masterPembagianDevidenId": 3,
"masterPencarianInvestorId": 60,
"imagesId": "clnwzmagq0003tlwd2gldlzgb",
"persentase": 50,
"saham_beli": 1,
"statusPorto": {
"id": 2,
"status": "Review"
}
},
{
"id": "clnwyvtlx0002tlfopdvez4yr",
"title": "Party EO",
"targetDana": "30000",
"hargaLembar": "1000",
"totalLembar": "30",
"roi": "1",
"active": true,
"createdAt": "2023-10-19T09:15:49.030Z",
"updatedAt": "2023-10-19T09:15:49.030Z",
"authorId": "clntxvesu0002tlnbz030gx30",
"masterPeriodeDevidenId": "Selamanya",
"masterPembagianDevidenId": 3,
"masterPencarianInvestorId": 90,
"imagesId": "clnwyvtlh0000tlfof0ec1x9k",
"persentase": 80,
"saham_beli": 0,
"statusPorto": {
"id": 3,
"status": "Accept"
}
}
]

2
src/app_modules/investasi/edit_propektus/view.tsx
View File

@@ -20,7 +20,7 @@ export default function EditProspektusInvestasi() {
<>
{edit ? (
<Link
href={"https://pii.or.id/uploads/dummies.pdf"}
href={"/aset/dummy_file.pdf"}
target="_blank"
style={{ textDecorationLine: "none" }}
>

5
src/app_modules/investasi/index.ts
View File

@@ -34,6 +34,8 @@ import DetailBeritaInvestasi from "./detail_berita/view";
import LayoutDetailBeritaInvestasi from "./detail_berita/layout";
import BeritaInvestasi from "./berita/view";
import LayoutBeritaInvestasi from "./berita/layout";
import MetodeTransferInvestasi from "./metode_transfer/view";
import LayoutMetodeTransferInvestasi from "./metode_transfer/layout";
export {
MainInvestasi,
@@ -72,5 +74,6 @@ export {
LayoutDetailBeritaInvestasi,
BeritaInvestasi,
LayoutBeritaInvestasi as LayoutBeritaInvestasi,
MetodeTransferInvestasi,
LayoutMetodeTransferInvestasi,
};

80
src/app_modules/investasi/main/view.tsx
View File

@@ -5,6 +5,7 @@ import { INVESTASI } from "@/app_modules/models/investasi";
import { MODEL_ALL_MASTER } from "@/app_modules/models/model_AllMaster";
import {
AspectRatio,
Badge,
Box,
Button,
Card,
@@ -36,6 +37,7 @@ export default function MainInvestasi({
pembagianDeviden: MODEL_ALL_MASTER[];
}) {
const router = useRouter();
return (
<>
{/* <pre>{JSON.stringify(listData, null, 2)}</pre> */}
@@ -57,7 +59,8 @@ export default function MainInvestasi({
</CardSection>
<CardSection p={"lg"}>
<Box mt={"md"}>
<Box mb={"md"}>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
@@ -65,9 +68,10 @@ export default function MainInvestasi({
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
<Title order={4}>{e.title}</Title>
</Box>
<Box mt={"md"}>
</CardSection>
<CardSection p={"md"} >
<Box>
<Grid>
<Grid.Col span={6}>
<Stack>
@@ -98,33 +102,49 @@ export default function MainInvestasi({
</CardSection>
<Divider />
<CardSection p={"md"}>
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (
<>
<Group position="right">
<IconCircleCheck/>
<Text>Selesai</Text>
</Group>
</>
);
} else {
return<>
<Group position="right" spacing={"xs"}>
<Text>Sisa waktu:</Text>
<Text>
{e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days")}
</Text>
<Text>Hari</Text>
</Group>
</>
}
})()}
<Group position="apart" px={"sm"}>
<Box>
{e.saham_beli === 0 ? (
""
) : (
<Badge variant="filled" color="teal">
Saham Anda
</Badge>
)}
</Box>
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (
<>
<Group position="right">
<IconCircleCheck />
<Text>Selesai</Text>
</Group>
</>
);
} else {
return (
<>
<Group position="right" spacing={"xs"}>
<Text>Sisa waktu:</Text>
<Text>
{e.masterPencarianInvestorId -
moment(new Date()).diff(
new Date(e.createdAt),
"days"
)}
</Text>
<Text>Hari</Text>
</Group>
</>
);
}
})()}
</Group>
</CardSection>
</Card>
))}

19
src/app_modules/investasi/metode_transfer/layout.tsx Normal file
View File

@@ -0,0 +1,19 @@
"use client";
import HeaderTamplate from "@/app_modules/component/header_tamplate";
import { AppShell } from "@mantine/core";
import React from "react";
export default function LayoutMetodeTransferInvestasi({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
<AppShell header={<HeaderTamplate title="Pilih Metode Transfer" />}>
{children}
</AppShell>
</>
);
}

106
src/app_modules/investasi/metode_transfer/view.tsx Normal file
View File

@@ -0,0 +1,106 @@
"use client";
import { Warna } from "@/app/lib/warna";
import {
Box,
Button,
Center,
Flex,
Group,
Paper,
Radio,
Text,
Title,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react";
import toast from "react-simple-toasts";
const listNoRekening = [
{
id: 1,
name: "BRI",
norek: "9065456754325643",
},
{
id: 2,
name: "BCA",
norek: "2304235678854332",
},
{
id: 3,
name: "BNI",
norek: "1104786754324564",
},
{
id: 4,
name: "BSI",
norek: "7076543567898976",
},
];
export default function MetodeTransferInvestasi() {
const [total, setTotal] = useState<any | null>(null);
const [checked, setChecked] = useState(false);
const [bank, setBank] = useState("");
const router = useRouter();
useShallowEffect(() => {
if (typeof window !== undefined) {
const data = localStorage.getItem("total_harga");
setTotal(data);
}
}, []);
async function onSubmit() {
router.push("/dev/investasi/upload_bukti");
localStorage.setItem("bank", bank);
}
return (
<>
{/* Box judul */}
<Paper h={70} bg={"gray"} p={"xs"} shadow="lg" mb={"md"}>
<Title order={5}>Judul Proyek Investasi</Title>
<Text fz={"sm"}>Total Transfer : Rp.{total}</Text>
</Paper>
{/* Metode transfer */}
<Radio.Group
name="Metode Trf"
label="Metode Transfer"
description="Pilih salah satu bank"
withAsterisk
my={"md"}
onChange={setBank}
>
<Flex direction={"column"} gap={"lg"} mt="xs">
{listNoRekening.map((e) => (
<Box key={e.id}>
<Radio value={e.norek} label={e.name + ": " + e.norek} />
</Box>
))}
</Flex>
</Radio.Group>
<Center>
{bank === "" ? (
<Button my={"md"} w={300} disabled radius={50}>
Pilih
</Button>
) : (
<Button
my={"md"}
w={300}
bg={Warna.biru}
radius={50}
onClick={() => {
onSubmit();
}}
>
Pilih
</Button>
)}
</Center>
</>
);
}

5
src/app_modules/investasi/model/dummy.ts
View File

@@ -14,4 +14,9 @@ export interface DUMMY_INVESTASI {
createdAt: Date;
updatedAt: Date;
persentase: number;
saham_beli: number;
statusPorto: {
id: number;
status: string;
};
}

129
src/app_modules/investasi/portofolio/view.tsx
View File

@@ -3,6 +3,7 @@
import {
AspectRatio,
Avatar,
Badge,
Box,
Button,
Card,
@@ -46,20 +47,14 @@ function MyPortofolioInvestasi() {
const router = useRouter();
return (
<Box mx="auto">
<Paper mb={5} onClick={toggle} bg={Warna.biru} px={"md"} h={40}>
<Group position="apart" align="center" h={40}>
<Title order={6}>Portofolio Saya</Title>
<IconCaretDown />
</Group>
</Paper>
<Collapse in={opened} transitionDuration={700}>
<>
<Carousel showThumbs={false} infiniteLoop={true} showArrows={false} showStatus={false} swipeable={true}>
{dataDummy.map((e) => (
<Card
key={e.id}
withBorder
mb={"lg"}
mb={40}
bg={"gray"}
onClick={() => router.push(`/dev/investasi/detail_porto/${e.id}`)}
>
<CardSection p={"xs"}>
@@ -74,7 +69,8 @@ function MyPortofolioInvestasi() {
</CardSection>
<CardSection p={"lg"}>
<Box mt={"md"}>
<Box mb={"md"}>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
@@ -82,48 +78,75 @@ function MyPortofolioInvestasi() {
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
<Title order={4}>{e.title}</Title>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") ===
0
) {
return (
<>
<Group position="right">
<IconCircleCheck />
<Text>Selesai</Text>
</Group>
</>
);
} else {
return (
<>
<Group position="right" spacing={"xs"}>
<Text>Sisa waktu:</Text>
<Text>
{e.masterPencarianInvestorId -
moment(new Date()).diff(
new Date(e.createdAt),
"days"
)}
</Text>
<Text>Hari</Text>
</Group>
</>
);
}
})()}
<Group position="apart">
{(() => {
if (e.statusPorto.id === 1) {
return (
<Badge color="yellow" variant="filled">
{e.statusPorto.status}
</Badge>
);
} else {
if (e.statusPorto.id === 2) {
return (
<Badge color="red" variant="filled">
{e.statusPorto.status}
</Badge>
);
} else {
return (
<Badge color="green" variant="filled">
{e.statusPorto.status}
</Badge>
);
}
}
})()}
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (
<>
<Group position="right">
<IconCircleCheck />
<Text>Selesai</Text>
</Group>
</>
);
} else {
return (
<>
<Group position="right" spacing={"xs"}>
<Text>Sisa waktu:</Text>
<Text>
{e.masterPencarianInvestorId -
moment(new Date()).diff(
new Date(e.createdAt),
"days"
)}
</Text>
<Text>Hari</Text>
</Group>
</>
);
}
})()}
</Group>
</CardSection>
</Card>
))}
</Collapse>
</Box>
</Carousel>
</>
);
}
@@ -133,7 +156,7 @@ function SahamTerbeli() {
return (
<>
<Box maw={400} mx="auto">
<Box maw={400} mx="auto" mt={"xs"}>
<Paper mb={5} onClick={toggle} bg={Warna.hijau_tua} px={"md"} h={40}>
<Group position="apart" align="center" h={40}>
<Title order={6}>Saham Saya</Title>
@@ -146,6 +169,7 @@ function SahamTerbeli() {
<Card
key={e.id}
withBorder
bg={"gray"}
mb={"lg"}
onClick={() =>
router.push(RouteInvestasi.detail_saham_terbeli + `${e.id}`)
@@ -157,7 +181,6 @@ function SahamTerbeli() {
<Avatar src={"/aset/avatar.png"} />
<Text>Username</Text>
</Flex>
</Group>
</CardSection>
<CardSection p={"xs"}>
@@ -172,7 +195,8 @@ function SahamTerbeli() {
</CardSection>
<CardSection p={"lg"}>
<Box mt={"md"}>
<Box>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
@@ -180,9 +204,10 @@ function SahamTerbeli() {
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
<Title order={4}>{e.title}</Title>
</Box>
<Box mt={"md"}>
</CardSection>
<CardSection p={"md"}>
<Box>
<Grid>
<Grid.Col span={6}>
<Stack>
@@ -216,7 +241,7 @@ function SahamTerbeli() {
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") ===
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (

105
src/app_modules/investasi/proses_investasi/view.tsx
View File

@@ -1,5 +1,6 @@
"use client";
import { RouteInvestasi } from "@/app/lib/app_route";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
@@ -9,6 +10,7 @@ import {
Divider,
Grid,
Group,
NumberInput,
Text,
Title,
} from "@mantine/core";
@@ -26,9 +28,11 @@ import toast from "react-simple-toasts";
export default function ProsesInvestasi() {
const router = useRouter();
const [count, handlers] = useCounter(0, { min: 1, max: 1000 });
// const [count, handlers] = useCounter(0, { min: 1, max: 1000 });
const [sisaLembar, setSisaLembar] = useState(5000);
const [hargaLembar, setHargaLembar] = useState(1000);
const [beli, setBeli] = useState(0);
const [total, setTotal] = useState(0);
// const formatter = new Intl.NumberFormat("", {
// style: 'currency',
@@ -36,14 +40,47 @@ export default function ProsesInvestasi() {
// });
async function onProses() {
if (beli === 0) return toast("Masukan jumlah pembelian saham");
if (beli < 10) return toast("Minimal pemebelian 10 Lembar");
const hasil = hargaLembar * beli;
setTotal(hasil);
}
async function onBeli() {
router.push(RouteInvestasi.metode_transfer);
localStorage.setItem("total_harga", total as any);
}
return (
<>
<Box px={"md"}>
{/* Sisa Lembar Saham */}
<Group position="apart" mb={"md"}>
<Text>Lembar Saham</Text>
<Group position="center">
<Text>Sisa Lembar Saham</Text>
<Text fz={23}>{sisaLembar} </Text>
</Group>
{/* Harga perlembar saham */}
<Group position="apart" mb={"md"}>
<Text>Harga Perlembar</Text>
<Text fz={23}>Rp.{hargaLembar} </Text>
</Group>
{/* Lembar saham */}
<Group position="apart" mb={"md"}>
<Box>
<Text>Jumlah Pembelian</Text>
<Text fs={"italic"} fz={"xs"}>
minimal pembelian 10 lembar
</Text>
</Box>
<NumberInput
w={100}
value={beli}
onChange={(val: number) => setBeli(val)}
/>
{/* <Group position="center">
<ActionIcon variant="filled" radius={50} onClick={handlers.reset}>
<IconRefresh />
</ActionIcon>
@@ -55,7 +92,7 @@ export default function ProsesInvestasi() {
>
<IconMinus />
</ActionIcon>
{/* Jumlah saham */}
<Text>{count}</Text>
<ActionIcon
variant="filled"
@@ -71,37 +108,49 @@ export default function ProsesInvestasi() {
>
<IconNumber10Small />
</ActionIcon>
</Group>
</Group> */}
</Group>
<Group position="apart" mb={"md"}>
<Text>Harga Perlembar</Text>
<Text fz={23}>Rp.{hargaLembar} </Text>
</Group>
<Divider />
<Group position="apart" mb={"md"}>
<Text>Total Harga</Text>
<Text fz={25}>Rp.{hargaLembar * count} </Text>
</Group>
{/* Tombol Proses */}
<Center>
<Button
w={350}
w={100}
compact
radius={50}
bg={Warna.biru}
onClick={() => {
if(hargaLembar * count === 1000){
return toast("Minimal pembelian 10.000")
} else {
router.push("/dev/investasi/upload_bukti");
localStorage.setItem("total_harga", (hargaLembar * count) as any)
}
}}
bg={Warna.hijau_tua}
color="green"
onClick={onProses}
>
Proses
</Button>
</Center>
<Divider my={"lg"} />
<Group position="apart" mb={"md"}>
<Box>
<Text>Total Harga</Text>
</Box>
<Text fz={25}>Rp.{total} </Text>
</Group>
<Center>
{total < 10000 ? (
<Button w={350} radius={50} bg={"gray"} disabled>
Beli Saham
</Button>
) : (
<Button
w={350}
radius={50}
bg={Warna.biru}
onClick={() => {
onBeli();
}}
>
Beli Saham
</Button>
)}
</Center>
</Box>
</>
);

69
src/app_modules/investasi/upload_bukti/view.tsx
View File

@@ -12,49 +12,75 @@ import {
Image,
Text,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconCamera } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import toast from "react-simple-toasts";
export default function UploadBuktiTransferInvestasi() {
const router = useRouter()
const router = useRouter();
const [fl, setFl] = useState<File | null>(null);
const [img, setImg] = useState<any | null>(null);
const [total, setTotal] = useState<any | null>(null);
const [bank, setBank] = useState<any | null>(null);
useShallowEffect(() => {
if (typeof window !== undefined) {
const totalHarga = localStorage.getItem("total_harga");
const pilihBank = localStorage.getItem("bank")
setTotal(totalHarga);
setBank(pilihBank)
}
}, []);
const totalHarga = localStorage.getItem("total_harga")
return (
<>
{/* Nama Rekening */}
<Grid align="center">
<Grid.Col span={"auto"}>
<Text>Rekening</Text>
<Grid.Col span={5}>
<Text>Nama Rekening</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>908765467897654567</Text>
<Grid.Col span={7}>
<Text fw={"bold"}>Xendit</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
</Grid>
{/* Nomor rekening */}
<Grid align="center">
<Grid.Col span={5}>
<Text>Nomor Rekening</Text>
</Grid.Col>
<Grid.Col span={7} >
<Text fw={"bold"}>{bank}</Text>
</Grid.Col>
{/* <Grid.Col span={"auto"}>
<CopyButton value="908765467897654567">
{({ copied, copy }) => (
<Button
compact
radius={50}
color={copied ? "teal" : "blue"}
color={copied ? "teal" : "indigo"}
onClick={copy}
>
{copied ? "Copied url" : "Copy url"}
</Button>
)}
</CopyButton>
</Grid.Col>
</Grid.Col> */}
</Grid>
{/* Total Bayar */}
<Grid align="center">
<Grid.Col span={"auto"}>
<Text>Total Harga</Text>
<Grid.Col span={5}>
<Text>Total Bayar</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>Rp. {totalHarga}</Text>
<Grid.Col span={7}>
<Text fw={"bold"}>Rp. {total}</Text>
</Grid.Col>
<Grid.Col span={"auto"}></Grid.Col>
</Grid>
{/* Upload */}
@@ -93,14 +119,21 @@ export default function UploadBuktiTransferInvestasi() {
<Center>
{img === null ? (
<Button w={350} radius={50} bg={"gray"}
onClick={() => toast("Masukan Bukti Transfer")}
<Button
disabled
w={350}
radius={50}
bg={"gray"}
onClick={() => toast("Masukan Bukti Transfer")}
>
Selesai
</Button>
) : (
<Button w={350} radius={50} bg={"blue"}
onClick={() => router.push("/dev/investasi/konfirmasi")}
<Button
w={350}
radius={50}
bg={"blue"}
onClick={() => router.push("/dev/investasi/konfirmasi")}
>
Selesai
</Button>