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

feat:

Browse Source 
- Fitur hot menu ditambah
- Fitur portofolio khusus status investasi
- Fitur halaman transaksi
### No Issue
#fix:
- Perubahan minor
This commit is contained in:
Bagasbanuna02
2023-11-03 16:28:05 +08:00
parent c90aca8e8f
commit 33e363af89
51 changed files with 1953 additions and 408 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
prisma/schema.prisma
View File

@@ -22,6 +22,7 @@ model User {
UserSession UserSession?
Profile Profile?
Investasi Investasi[]
SahamTerbeli SahamTerbeli[]
}
model MasterUserRole {
@@ -61,13 +62,14 @@ model Profile {
}
model Images {
id String @id @default(cuid())
url String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
Profile Profile?
Investasi Investasi?
id String @id @default(cuid())
url String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
Profile Profile?
Investasi Investasi?
BeritaInvestasi BeritaInvestasi[]
}
model Katalog {
@@ -94,6 +96,8 @@ model MasterBidangBisnis {
Katalog Katalog[]
}
// -------------------- INVESTASI --------------------- //
// Table investasi / saham
model Investasi {
id String @id @default(cuid())
title String
@@ -105,7 +109,7 @@ model Investasi {
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
author User? @relation(fields: [authorId], references: [id])
authorId String?
authorId String?
MasterPeriodeDeviden MasterPeriodeDeviden? @relation(fields: [masterPeriodeDevidenId], references: [id])
masterPeriodeDevidenId String?
@@ -116,6 +120,16 @@ model Investasi {
ImageInvestasi Images? @relation(fields: [imagesId], references: [id])
imagesId String? @unique
ProspektusInvestasi ProspektusInvestasi?
DokumenInvestasi DokumenInvestasi? @relation(fields: [dokumenInvestasiId], references: [id])
dokumenInvestasiId String?
BeritaInvestasi BeritaInvestasi? @relation(fields: [beritaInvestasiId], references: [id])
beritaInvestasiId String?
SahamTerbeli SahamTerbeli? @relation(fields: [sahamTerbeliId], references: [id])
sahamTerbeliId String?
MasterStatusInvestasi MasterStatusInvestasi? @relation(fields: [masterStatusInvestasiId], references: [id])
masterStatusInvestasiId String? @default("1")
}
model MasterPencarianInvestor {
@@ -144,3 +158,57 @@ model MasterPembagianDeviden {
updatedAt DateTime @default(now()) @updatedAt
investasi Investasi[]
}
model MasterStatusInvestasi {
id String @id @default(cuid())
name String
color String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
investasi Investasi[]
}
model ProspektusInvestasi {
id String @id @default(cuid())
url String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
investasi Investasi @relation(fields: [investasiId], references: [id])
investasiId String @unique
}
model DokumenInvestasi {
id String @id @default(cuid())
url String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
investasi Investasi[]
}
model BeritaInvestasi {
id String @id @default(cuid())
title String
deskripsi String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
investasi Investasi[]
ImageBerita Images? @relation(fields: [imagesId], references: [id])
imagesId String?
}
model SahamTerbeli {
id String @id @default(cuid())
totalBeli String
jumlahLembar String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @default(now()) @updatedAt
author User @relation(fields: [authorId], references: [id])
authorId String
investasi Investasi[]
}

19
src/app/api/seeder/route.ts
View File

@@ -5,6 +5,7 @@ import bidangBisnis from "../../../bin/seeder/bidang_bisnis.json";
import pencarianInvestor from "./../../../bin/seeder/investasi/pencarian_investor.json";
import periodeDeviden from "./../../../bin/seeder/investasi/periode_deviden.json";
import pembagianDeviden from "./../../../bin/seeder/investasi/pembagian_deviden.json";
import statusInvestasi from "./../../../bin/seeder/investasi/status_investasi.json";
export async function GET(req: Request) {
const dev = new URL(req.url).searchParams.get("dev");
@@ -89,6 +90,24 @@ export async function GET(req: Request) {
});
}
// for (let i of statusInvestasi) {
// await prisma.masterStatusInvestasi.upsert({
// where: {
// id: i.id,
// },
// create: {
// id: i.id,
// name: i.name,
// color: i.color,
// },
// update: {
// id: i.id,
// name: i.name,
// color: i.color,
// },
// });
// }
return NextResponse.json({ success: true });
}

8
src/app/dev/investasi/detail_portofolio/draft/layout.tsx Normal file
View File

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

8
src/app/dev/investasi/detail_portofolio/draft/page.tsx Normal file
View File

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

9
src/app/dev/investasi/detail_portofolio/publish/layout.tsx Normal file
View File

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

7
src/app/dev/investasi/detail_portofolio/publish/page.tsx Normal file
View File

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

8
src/app/dev/investasi/detail_portofolio/reject/layout.tsx Normal file
View File

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

7
src/app/dev/investasi/detail_portofolio/reject/page.tsx Normal file
View File

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

8
src/app/dev/investasi/detail_portofolio/review/layout.tsx Normal file
View File

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

7
src/app/dev/investasi/detail_portofolio/review/page.tsx Normal file
View File

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

2
src/app/dev/investasi/main/portofolio/page.tsx
View File

@@ -1,6 +1,6 @@
import { PortofolioInvestasi } from "@/app_modules/investasi";
export default async function Page() {
export default async function Page({params}: {params: {id: string}}) {
return<>
<PortofolioInvestasi/>
</>

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

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

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

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

0
src/app/dev/investasi/status_transaksi/layout.tsx → src/app/dev/investasi/status_transaksi/berhasil/layout.tsx
View File

0
src/app/dev/investasi/status_transaksi/page.tsx → src/app/dev/investasi/status_transaksi/berhasil/page.tsx
View File

16
src/app/dev/investasi/status_transaksi/gagal/layout.tsx Normal file
View File

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

7
src/app/dev/investasi/status_transaksi/gagal/page.tsx Normal file
View File

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

16
src/app/lib/router_hipmi/router_investasi.ts
View File

@@ -1,12 +1,19 @@
export const RouterInvestasi = {
//INVESTASI
main: "/dev/investasi/main",
main_porto: "/dev/investasi/main/portofolio",
main_investasi: "/dev/investasi/main/saham_saya",
main_transaksi: "/dev/investasi/main/transaksi",
transfer: "/dev/investasi/transfer",
dialog_transaksi: "/dev/investasi/dialog_page/transaksi_saham",
dialog_create: "/dev/investasi/dialog_page/create",
// portofolio
portofolio: "/dev/investasi/main/portofolio",
// proses beli saham
status_transaksi: "/dev/investasi/status_transaksi",
status_transaksi: "/dev/investasi/status_transaksi/berhasil",
status_transaksi_gagal: "/dev/investasi/status_transaksi/gagal",
metode_transfer: "/dev/investasi/metode_transfer",
// edit //
edit_intro: "/dev/investasi/edit_intro/",
@@ -18,8 +25,13 @@ export const RouterInvestasi = {
detail_prospektus: "/dev/investasi/detail_prospektus/",
detail_dokumen: "/dev/investasi/detail_dokumen/",
detail_berita: "/dev/investasi/detail_berita/",
detail_draft: "/dev/investasi/detail_portofolio/draft",
detail_publish: "/dev/investasi/detail_portofolio/publish",
detail_review: "/dev/investasi/detail_portofolio/review",
detail_reject: "/dev/investasi/detail_portofolio/reject",
// berita
berita: "/dev/investasi/berita/",
create_berita: "/dev/investasi/create_berita",
list_edit_berita: "/dev/investasi/list_edit_berita/"
list_edit_berita: "/dev/investasi/list_edit_berita/",
};

118
src/app_modules/admin/investasi/konfirmasi/view.tsx
View File

@@ -18,9 +18,15 @@ import {
Button,
Text,
Image,
Collapse,
Textarea,
} from "@mantine/core";
import { useDisclosure } from "@mantine/hooks";
import {
IconBookDownload,
IconChevronDown,
IconChevronLeft,
IconChevronRight,
IconFileDescription,
IconSpeakerphone,
} from "@tabler/icons-react";
@@ -31,6 +37,8 @@ import toast from "react-simple-toasts";
export default function Admin_KonfirmasiInvestasi({ id }: { id: string }) {
const router = useRouter();
const [publish, setPublish] = useState(true);
const [opened, { toggle }] = useDisclosure(false);
const listBox = [
{
id: 1,
@@ -125,7 +133,7 @@ export default function Admin_KonfirmasiInvestasi({ id }: { id: string }) {
</Grid>
{/* List Box */}
<Grid mb={"md"}>
<Grid mb={"xl"}>
{listBox.map((e) => (
<Grid.Col
span={"auto"}
@@ -144,35 +152,85 @@ export default function Admin_KonfirmasiInvestasi({ id }: { id: string }) {
))}
</Grid>
<Center mb={100}>
{publish ? (
<Button
radius={50}
w={350}
bg={"green"}
color="green"
onClick={() => {
setTimeout(() => setPublish(false), 1000)
toast("Proyek Investasi Di Publish")
}}
>
Publish
</Button>
) : (
<Button
radius={50}
w={350}
bg={"red"}
color="red"
onClick={() => {
setTimeout(() => setPublish(true), 1000)
toast("Proyek Investasi Di Non-Aktifkan")
}}
>
Non - aktif
</Button>
)}
</Center>
<Stack mb={40}>
{/* Button publish dan reject */}
<Grid>
{/* Publish */}
<Grid.Col span={6}>
<Center>
{publish ? (
<Button
radius={50}
w={200}
bg={"green"}
color="green"
onClick={() => {
setTimeout(() => setPublish(false), 1000);
toast("Proyek Investasi Di Publish");
}}
>
Publish
</Button>
) : (
<Button
radius={50}
w={200}
bg={"orange"}
color="orange"
onClick={() => {
setTimeout(() => setPublish(true), 1000);
toast("Proyek Investasi Di Non-Aktifkan");
}}
>
Non - aktif
</Button>
)}
</Center>
</Grid.Col>
{/* Reject */}
<Grid.Col span={6}>
<Center>
<Button
w={200}
radius={50}
bg={"red"}
color="red"
onClick={toggle}
rightIcon={!opened ? <IconChevronLeft /> : <IconChevronDown />}
>
Reject
</Button>
</Center>
</Grid.Col>
</Grid>
{/* Text area reject */}
<Collapse in={opened}>
<Paper bg={"gray.4"} p={"xs"}>
<Stack>
<Textarea
withAsterisk
label="Alasan:"
placeholder="Masukan alasan penolakan"
autosize
minRows={2}
maxRows={4}
/>
<Group position="right">
<Button
w={100}
radius={50}
bg={Warna.biru}
compact
onClick={toggle}
>
Kirim
</Button>
</Group>
</Stack>
</Paper>
</Collapse>
</Stack>
</>
);
}

4
src/app_modules/admin/investasi/main/view.tsx
View File

@@ -52,7 +52,7 @@ const listTable = [
id: 2,
status: {
id: 2,
name: "Menunggu Konfirmasi",
name: "Review",
},
name: "Event MCD",
},
@@ -60,7 +60,7 @@ const listTable = [
id: 3,
status: {
id: 2,
name: " Menunggu Konfirmasi",
name: " Review",
},
name: "Villa Batubulan",
},

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

@@ -36,7 +36,7 @@ export default function MainCrowd() {
color="green"
onClick={() => {
router.push("/dev/investasi/main");
setChangeColor(false);
setChangeColor(0);
}}
>
Investasi

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

@@ -22,7 +22,8 @@ import { funCreateInvestasi } from "../fun/fun_create_investasi";
import toast from "react-simple-toasts";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { useAtom } from "jotai";
import { gs_investasiFooter } from "../g_state";
import { gs_TabPortoInvestasi, gs_investasiFooter } from "../g_state";
import { useShallowEffect } from "@mantine/hooks";
export default function InvestasiCreate({
id,
@@ -38,7 +39,10 @@ export default function InvestasiCreate({
const router = useRouter();
const [fl, setFl] = useState<File | null>(null);
const [img, setImg] = useState<any | null>();
const [changeColor, setChangeColor] = useAtom(gs_investasiFooter)
const [changeColor, setChangeColor] = useAtom(gs_investasiFooter);
const [activeTab, setActiveTab] = useAtom(gs_TabPortoInvestasi)
const [value, setValue] = useState({
title: "",
targetDana: "",
@@ -63,10 +67,10 @@ export default function InvestasiCreate({
masterPencarianInvestorId: value.pencarianInvestorId,
};
// toast("Berhasil disimpan")
setChangeColor(true)
setChangeColor(1);
setActiveTab("Draft")
return setTimeout(() => router.push(RouterInvestasi.dialog_create), 1000);
// if (_.values(body).includes("")) return toast("Lengkapi data");
// if (!fl) return toast("File Kosong");
@@ -105,10 +109,11 @@ export default function InvestasiCreate({
>
{(props) => (
<Button
compact
{...props}
w={350}
w={100}
radius={50}
// bg={Warna.biru}
bg={Warna.hijau_muda}
// onClick={() => router.push("/dev/investasi/upload")}
>
<IconCamera />
@@ -141,16 +146,24 @@ export default function InvestasiCreate({
<TextInput
label="Harga Per Lember"
type="number"
onChange={(val) => {
onChange={(val: any) => {
setValue({
...value,
hargaLembar: val.target.value,
});
const data : any = (value.targetDana as any) / val.target.value;
// setTL(data);
setValue({
...value,
totalLembar: data
});
}}
/>
<TextInput
label="Total Lembar"
type="number"
value={Math.floor(value.totalLembar as any)}
onChange={(val) => {
setValue({
...value,
@@ -207,7 +220,12 @@ export default function InvestasiCreate({
</Box>
</Center>
<Center my={"lg"}>
<Button w={200} radius={50} onClick={() => onSubmit()}>
<Button
w={300}
radius={50}
bg={Warna.biru}
onClick={() => onSubmit()}
>
Simpan
</Button>
</Center>

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

@@ -47,13 +47,6 @@ export default function PortofolioDetailInvestasi({id}: {id: string}) {
];
return (
<>
{/* <Group position="apart" mb={"md"}>
<Flex align={"center"} gap={"xs"}>
<Avatar src={"/aset/avatar.png"} />
<Text>Username</Text>
</Flex>
<Text>Sisa waktu : 20 Hari</Text>
</Group> */}
<Center mb={'sm'}>
<Text>Sisa waktu : 20 Hari</Text>
</Center>

28
src/app_modules/investasi/detail_portofolio/draft/layout.tsx Normal file
View File

@@ -0,0 +1,28 @@
"use client";
import HeaderTamplate from "@/app_modules/component/header_tamplate";
import { AppShell } from "@mantine/core";
import { IconEdit } from "@tabler/icons-react";
import React from "react";
export default function LayoutDetailDraftInvestasi({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
<AppShell
header={
<HeaderTamplate
title="Detail Draft"
icon={<IconEdit />}
route2={`/dev/investasi/edit/${1}`}
/>
}
>
{children}
</AppShell>
</>
);
}

152
src/app_modules/investasi/detail_portofolio/draft/page.tsx Normal file
View File

@@ -0,0 +1,152 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
AspectRatio,
Avatar,
Box,
Button,
Center,
Flex,
Grid,
Group,
Image,
Paper,
Slider,
Stack,
Text,
Title,
} from "@mantine/core";
import {
IconBookDownload,
IconFileDescription,
IconSpeakerphone,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_TabPortoInvestasi } from "../../g_state";
import toast from "react-simple-toasts";
export default function DetailDraftInvestasi() {
const router = useRouter();
const [activeTab, setActiveTab] = useAtom(gs_TabPortoInvestasi)
const listBox = [
{
id: 1,
name: "Prospektus",
icon: <IconBookDownload size={70} />,
route: RouterInvestasi.edit_prospektus,
},
{
id: 2,
name: "Dokumen",
icon: <IconFileDescription size={70} />,
route: RouterInvestasi.edit_dokumen,
},
{
id: 3,
name: "Berita",
icon: <IconSpeakerphone size={70} />,
route: RouterInvestasi.edit_berita,
},
];
async function onsubmit() {
toast("Review Berhasil Diajukan")
router.push(RouterInvestasi.portofolio)
setActiveTab("Review")
}
return (
<>
<Paper withBorder mb={"md"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</Paper>
{/* Title dan Persentase */}
<Box mb={"md"}>
<Title order={4} mb={"xs"}>
Judul Proyek
</Title>
<Slider
disabled
size={10}
value={60}
marks={[{ value: 60, label: "60%" }]}
/>
</Box>
{/* Rincian Data */}
<Grid p={"md"} mb={"md"}>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Jadwal Pembagian</Text>
<Text>3 Bulan </Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>ROI</Text>
<Text>%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>0</Text>
</Box>
<Box>
<Text>Pembagian Deviden</Text>
<Text>Selamanya</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
<Center>
<Button
w={300}
radius={50}
bg={"yellow.7"}
color="yellow"
onClick={() => onsubmit()}
>
Ajukan Review
</Button>
</Center>
{/* List Box */}
{/* <Grid mb={"md"}>
{listBox.map((e) => (
<Grid.Col span={"auto"} key={e.id} onClick={() => router.push(e.route + `${id}`)}>
<Paper h={100} w={100} bg={"gray.4"} withBorder py={"xs"}>
<Flex direction={"column"} align={"center"} justify={"center"}>
<Text fz={12}>{e.name}</Text>
<ActionIcon variant="transparent" size={60}>
{e.icon}
</ActionIcon>
</Flex>
</Paper>
</Grid.Col>
))}
</Grid> */}
</>
);
}

19
src/app_modules/investasi/detail_portofolio/publish/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 LayoutDetailPublishInvestasi({children}: {children: React.ReactNode}){
return<>
<AppShell
header={
<HeaderTamplate title="Detail Publish"/>
}
>
{children}
</AppShell>
</>
}

144
src/app_modules/investasi/detail_portofolio/publish/page.tsx Normal file
View File

@@ -0,0 +1,144 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
AspectRatio,
Avatar,
Box,
Button,
Center,
Flex,
Grid,
Group,
Image,
Paper,
Slider,
Stack,
Text,
Title,
} from "@mantine/core";
import {
IconBookDownload,
IconFileDescription,
IconSpeakerphone,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import toast from "react-simple-toasts";
export default function DetailPublishInvestasi() {
const router = useRouter();
const listBox = [
{
id: 1,
name: "Prospektus",
icon: <IconBookDownload size={70} />,
route: RouterInvestasi.edit_prospektus,
},
{
id: 2,
name: "Dokumen",
icon: <IconFileDescription size={70} />,
route: RouterInvestasi.edit_dokumen,
},
{
id: 3,
name: "Berita",
icon: <IconSpeakerphone size={70} />,
route: RouterInvestasi.edit_berita,
},
];
return (
<>
<Center mb={"sm"}>
<Text>Sisa waktu : 20 Hari</Text>
</Center>
<Paper withBorder mb={"md"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</Paper>
{/* Title dan Persentase */}
<Box mb={"md"}>
<Title order={4} mb={"xs"}>
Judul Proyek
</Title>
<Slider
disabled
size={10}
value={60}
marks={[{ value: 60, label: "60%" }]}
/>
</Box>
{/* Rincian Data */}
<Grid p={"md"} mb={"md"}>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Terkumpul</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Jadwal Pembagian</Text>
<Text>3 Bulan </Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Investor</Text>
<Text>4657</Text>
</Box>
<Box>
<Text>ROI</Text>
<Text>%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>0</Text>
</Box>
<Box>
<Text>Pembagian Deviden</Text>
<Text>Selamanya</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
{/* List Box */}
<Grid mb={"md"}>
{listBox.map((e) => (
<Grid.Col
span={"auto"}
key={e.id}
onClick={() => router.push(e.route + `${1}`)}
>
<Paper h={100} w={100} bg={"gray.4"} withBorder py={"xs"}>
<Flex direction={"column"} align={"center"} justify={"center"}>
<Text fz={12}>{e.name}</Text>
<ActionIcon variant="transparent" size={60}>
{e.icon}
</ActionIcon>
</Flex>
</Paper>
</Grid.Col>
))}
</Grid>
</>
);
}

23
src/app_modules/investasi/detail_portofolio/reject/layout.tsx Normal file
View File

@@ -0,0 +1,23 @@
"use client"
import HeaderTamplate from "@/app_modules/component/header_tamplate"
import { AppShell } from "@mantine/core"
import { IconEdit } from "@tabler/icons-react"
import React from "react"
export default function LayoutDetailRejecttInvestasi({children}: {children: React.ReactNode}){
return<>
<AppShell
header={
<HeaderTamplate title="Detail Reject"
icon={<IconEdit />}
route2={`/dev/investasi/edit/${1}`}
/>
}
>
{children}
</AppShell>
</>
}

199
src/app_modules/investasi/detail_portofolio/reject/page.tsx Normal file
View File

@@ -0,0 +1,199 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
AspectRatio,
Avatar,
Box,
Button,
Center,
Divider,
Flex,
Grid,
Group,
Image,
Paper,
Slider,
Stack,
Text,
Title,
} from "@mantine/core";
import {
IconBookDownload,
IconFileDescription,
IconSpeakerphone,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_TabPortoInvestasi } from "../../g_state";
import toast from "react-simple-toasts";
export default function DetailRejectInvestasi() {
const router = useRouter();
const [activeTab, setActiveTab] = useAtom(gs_TabPortoInvestasi);
const listBox = [
{
id: 1,
name: "Prospektus",
icon: <IconBookDownload size={70} />,
route: RouterInvestasi.edit_prospektus,
},
{
id: 2,
name: "Dokumen",
icon: <IconFileDescription size={70} />,
route: RouterInvestasi.edit_dokumen,
},
{
id: 3,
name: "Berita",
icon: <IconSpeakerphone size={70} />,
route: RouterInvestasi.edit_berita,
},
];
async function onAjukan() {
toast("Project Diajukan Kembali");
router.push(RouterInvestasi.portofolio);
setActiveTab("Review");
}
async function onBatal() {
toast("Project Dibatalkan");
router.push(RouterInvestasi.portofolio);
setActiveTab("Reject");
}
return (
<>
{/* Alasan */}
<Box mb={"sm"}>
<Title order={6}>Alasan :</Title>
<Box>
<Paper>
<Text>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab
necessitatibus dolores, doloribus porro quis velit unde voluptatem
delectus, nesciunt laboriosam non quae numquam sed tenetur! Minus
earum odio possimus dolore?
</Text>
</Paper>
</Box>
</Box>
{/* Tombol Ajukan */}
<Grid>
<Grid.Col span={6}>
<Center>
<Button
mb={"xl"}
radius={50}
bg={"orange.7"}
color="yellow"
onClick={() => onAjukan()}
>
Ajukan Kembali
</Button>
</Center>
</Grid.Col>
<Grid.Col span={6}>
<Center>
{" "}
<Button
mb={"xl"}
radius={50}
bg={"red.7"}
color="yellow"
onClick={() => onBatal()}
>
Batalkan Project
</Button>
</Center>
</Grid.Col>
</Grid>
<Paper withBorder mb={"md"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</Paper>
{/* Title dan Persentase */}
<Box mb={"md"}>
<Title order={4} mb={"xs"}>
Judul Proyek
</Title>
<Slider
disabled
size={10}
value={60}
marks={[{ value: 60, label: "60%" }]}
/>
</Box>
{/* Rincian Data */}
<Grid p={"md"} mb={"md"}>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Jadwal Pembagian</Text>
<Text>3 Bulan </Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>ROI</Text>
<Text>%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>0</Text>
</Box>
<Box>
<Text>Pembagian Deviden</Text>
<Text>Selamanya</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
{/* List Box */}
<Grid mb={"md"}>
{listBox.map((e) => (
<Grid.Col
span={"auto"}
key={e.id}
onClick={() => router.push(e.route + `${"1"}`)}
>
<Paper h={100} w={100} bg={"gray.4"} withBorder py={"xs"}>
<Flex direction={"column"} align={"center"} justify={"center"}>
<Text fz={12}>{e.name}</Text>
<ActionIcon variant="transparent" size={60}>
{e.icon}
</ActionIcon>
</Flex>
</Paper>
</Grid.Col>
))}
</Grid>
</>
);
}

19
src/app_modules/investasi/detail_portofolio/review/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 LayoutDetailReviewInvestasi({children}: {children: React.ReactNode}){
return<>
<AppShell
header={
<HeaderTamplate title="Detail Review"/>
}
>
{children}
</AppShell>
</>
}

155
src/app_modules/investasi/detail_portofolio/review/page.tsx Normal file
View File

@@ -0,0 +1,155 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
AspectRatio,
Avatar,
Box,
Button,
Center,
Flex,
Grid,
Group,
Image,
Paper,
Slider,
Stack,
Text,
Title,
} from "@mantine/core";
import {
IconBookDownload,
IconFileDescription,
IconSpeakerphone,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_TabPortoInvestasi } from "../../g_state";
import toast from "react-simple-toasts";
export default function DetailReviewInvestasi() {
const router = useRouter();
const [activeTab, setActiveTab] = useAtom(gs_TabPortoInvestasi);
const listBox = [
{
id: 1,
name: "Prospektus",
icon: <IconBookDownload size={70} />,
route: RouterInvestasi.edit_prospektus,
},
{
id: 2,
name: "Dokumen",
icon: <IconFileDescription size={70} />,
route: RouterInvestasi.edit_dokumen,
},
{
id: 3,
name: "Berita",
icon: <IconSpeakerphone size={70} />,
route: RouterInvestasi.edit_berita,
},
];
async function onsubmit() {
toast("Review Dibatalkan");
router.push(RouterInvestasi.portofolio);
setActiveTab("Draft");
}
return (
<>
<Paper withBorder mb={"md"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</Paper>
{/* Title dan Persentase */}
<Box mb={"md"}>
<Title order={4} mb={"xs"}>
Judul Proyek
</Title>
<Slider
disabled
size={10}
value={60}
marks={[{ value: 60, label: "60%" }]}
/>
</Box>
{/* Rincian Data */}
<Grid p={"md"} mb={"md"}>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. </Text>
</Box>
<Box>
<Text>Jadwal Pembagian</Text>
<Text>3 Bulan </Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>ROI</Text>
<Text>%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>0</Text>
</Box>
<Box>
<Text>Pembagian Deviden</Text>
<Text>Selamanya</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
{/* List Box */}
<Grid mb={"md"}>
{listBox.map((e) => (
<Grid.Col
span={"auto"}
key={e.id}
onClick={() => router.push(e.route + `${"1"}`)}
>
<Paper h={100} w={100} bg={"gray.4"} withBorder py={"xs"}>
<Flex direction={"column"} align={"center"} justify={"center"}>
<Text fz={12}>{e.name}</Text>
<ActionIcon variant="transparent" size={60}>
{e.icon}
</ActionIcon>
</Flex>
</Paper>
</Grid.Col>
))}
</Grid>
{/* Tombol Ajukan */}
<Center>
<Button
w={300}
mb={"xl"}
radius={50}
bg={"red.7"}
color="yellow"
onClick={() => onsubmit()}
>
Batalkan Review
</Button>
</Center>
</>
);
}

8
src/app_modules/investasi/dialog_page/transaksi_saham/layout.tsx
View File

@@ -2,8 +2,10 @@
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { AppShell, CloseButton, Group, Header, Text } from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import React from "react";
import { gs_investasiFooter } from "../../g_state";
export default function LayoutCountDownTransaksiInvestasi({
children,
@@ -11,6 +13,7 @@ export default function LayoutCountDownTransaksiInvestasi({
children: React.ReactNode;
}) {
const router = useRouter();
const [hotMenu, setHotMenu] = useAtom(gs_investasiFooter)
return (
<>
<AppShell
@@ -19,7 +22,10 @@ export default function LayoutCountDownTransaksiInvestasi({
<Group h={50} align="center">
<CloseButton
size={"md"}
onClick={() => router.push(RouterInvestasi.portofolio)}
onClick={() => {
router.push(RouterInvestasi.main_transaksi),
setHotMenu(3)
}}
/>
<Text>Status Transfer</Text>
</Group>

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

@@ -22,7 +22,7 @@
},
"statusSaham": {
"id": 2,
"status": "Menunggu Konfirmasi"
"status": "Menunggu konfirmasi"
}
},
{
@@ -44,7 +44,7 @@
"saham_beli": 0,
"statusPorto": {
"id": 3,
"status": "Accept"
"status": "Publish"
},
"statusSaham": {
"id": 1,
@@ -69,8 +69,8 @@
"persentase": 30,
"saham_beli": 1,
"statusPorto": {
"id": 3,
"status": "Accept"
"id": 2,
"status": "Review"
},
"statusSaham": {
"id": 1,
@@ -121,12 +121,12 @@
"persentase": 80,
"saham_beli": 0,
"statusPorto": {
"id": 3,
"status": "Accept"
"id": 4,
"status": "Reject"
},
"statusSaham": {
"id": 2,
"status": "Menunggu Konfirmasi"
"status": "Menunggu konfirmasi"
}
}
]

3
src/app_modules/investasi/g_state/index.ts
View File

@@ -1,3 +1,4 @@
import { atomWithStorage } from "jotai/utils";
export const gs_investasiFooter = atomWithStorage<any>("changeColor", false)
export const gs_investasiFooter = atomWithStorage<number>("changeColor", 0)
export const gs_TabPortoInvestasi = atomWithStorage<any | string>("gs_TabPortoInvestasi" , "Draft")

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

@@ -11,8 +11,9 @@ import LayoutProsesInvestasi from "./proses_investasi/layout";
import UploadBuktiTransferInvestasi from "./upload_bukti/view";
import LayoutBuktiTransferInvestasi from "./upload_bukti/layout";
import CountDownTransaksiInvestasi from "./dialog_page/transaksi_saham/view";
import LayoutCountDownTransaksiInvestasi from "./dialog_page/transaksi_saham/layout";
import LayoutCountDownTransaksiInvestasi from "./dialog_page/transaksi_saham/layout";
import PortofolioInvestasi from "./portofolio/view";
import LayoutPortofolioInvestasi from "./portofolio/layout";
import PortofolioDetailInvestasi from "./detail_porto/view";
import LayoutPortofolioDetailInvestasi from "./detail_porto/layout";
import EditInvestasi from "./edit/view";
@@ -47,6 +48,19 @@ import CreateBeritaInvestasi from "./create_berita/view";
import LayoutCreateBeritaInvestasi from "./create_berita/layout";
import ListEditBeritaInvestasi from "./list_edit_berita/page";
import LayoutListEditBeritaInvestasi from "./list_edit_berita/layout";
import InvestasiSahamTerbeli from "./main/saham_saya";
import DetailDraftInvestasi from "./detail_portofolio/draft/page";
import LayoutDetailDraftInvestasi from "./detail_portofolio/draft/layout";
import DetailReviewInvestasi from "./detail_portofolio/review/page";
import LayoutDetailReviewInvestasi from "./detail_portofolio/review/layout";
import DetailPublishInvestasi from "./detail_portofolio/publish/page";
import LayoutDetailPublishInvestasi from "./detail_portofolio/publish/layout";
import DetailRejectInvestasi from "./detail_portofolio/reject/page";
import LayoutDetailRejectInvestasi from "./detail_portofolio/reject/layout";
import TransaksiInvestasi from "./transaksi/page";
import LayoutTransaksiInvestasi from "./transaksi/layout";
import StatusTransaksiInvestasi_Gagal from "./status_transaksi/gagal/view";
import LayoutStatusTransaksiInvestasi_Gagal from "./status_transaksi/gagal/layout";
export {
MainInvestasi,
@@ -64,6 +78,7 @@ export {
CountDownTransaksiInvestasi as KonfirmasiBuktiInvestasi,
LayoutCountDownTransaksiInvestasi as LayoutKonfirmasiBuktiInvestasi,
PortofolioInvestasi,
LayoutPortofolioInvestasi,
PortofolioDetailInvestasi,
LayoutPortofolioDetailInvestasi,
EditInvestasi,
@@ -96,6 +111,19 @@ export {
LayoutDialogPageCreateInvestasi,
CreateBeritaInvestasi,
LayoutCreateBeritaInvestasi,
ListEditBeritaInvestasi ,
ListEditBeritaInvestasi,
LayoutListEditBeritaInvestasi,
InvestasiSahamTerbeli,
DetailDraftInvestasi,
LayoutDetailDraftInvestasi,
DetailReviewInvestasi,
LayoutDetailReviewInvestasi,
DetailPublishInvestasi,
LayoutDetailPublishInvestasi,
DetailRejectInvestasi,
LayoutDetailRejectInvestasi,
TransaksiInvestasi,
LayoutTransaksiInvestasi,
StatusTransaksiInvestasi_Gagal,
LayoutStatusTransaksiInvestasi_Gagal
};

85
src/app_modules/investasi/main/layout.tsx
View File

@@ -13,15 +13,19 @@ import {
Text,
} from "@mantine/core";
import {
IconCash,
IconChartHistogram,
IconChartPie,
IconChartPieFilled,
IconMoneybag,
IconNotes,
IconPencilPlus,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { gs_investasiFooter } from "../g_state";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
export default function LayoutMainInvestasi({
children,
@@ -29,7 +33,34 @@ export default function LayoutMainInvestasi({
children: React.ReactNode;
}) {
const router = useRouter();
const [changeColor, setChangeColor] = useAtom(gs_investasiFooter);
const [active, setActive] = useAtom(gs_investasiFooter);
const listFooter = [
{
id: 1,
name: "Bursa",
route: RouterInvestasi.main,
icon: <IconChartHistogram />,
},
{
id: 2,
name: "Portofolio",
route: RouterInvestasi.main_porto,
icon: <IconChartPie />,
},
{
id: 3,
name: "Investasi",
route: RouterInvestasi.main_investasi,
icon: <IconCash />,
},
{
id: 4,
name: "Transaksi",
route: RouterInvestasi.main_transaksi,
icon: <IconNotes />,
},
];
return (
<>
@@ -43,42 +74,26 @@ export default function LayoutMainInvestasi({
/>
}
footer={
<Footer height={70} bg={"dark"}>
<Footer height={70} bg={"dark.4"}>
<Grid align="center" h={60} pt={"xs"}>
{/* Tampilan Bursa */}
<Grid.Col
span={6}
onClick={() => {
router.push("/dev/investasi/main");
setChangeColor(false);
}}
>
<Center>
<Flex direction={"column"} align={"center"} w={"100%"}>
<ActionIcon variant="transparent">
<IconChartHistogram color={changeColor ? "white" : "green"}/>
</ActionIcon>
<Text c={changeColor ? "white" : "green"}>Bursa</Text>
</Flex>
</Center>
</Grid.Col>
{/* Tampilan Portofolio */}
<Grid.Col
span={6}
onClick={() => {
router.push("/dev/investasi/main/portofolio");
setChangeColor(true);
}}
>
<Center>
<Flex direction={"column"} align={"center"} w={"100%"}>
<ActionIcon variant="transparent">
<IconChartPie color={changeColor ? "green" : "white"}/>
</ActionIcon>
<Text c={changeColor ? "green" : "white"}>Portofolio</Text>
</Flex>
</Center>
</Grid.Col>
{listFooter.map((e, k) => (
<Grid.Col
key={e.id}
span={3}
onClick={() => {
router.push(e.route);
setActive(k)
}}
>
<Center>
<Flex direction={"column"} align={"center"} w={"100%"}>
<ActionIcon variant="transparent" c={active === k ? "green" : "white"}>{e.icon}</ActionIcon>
<Text c={active === k ? "green" : "white"}>{e.name}</Text>
</Flex>
</Center>
</Grid.Col>
))}
</Grid>
</Footer>
}

151
src/app_modules/investasi/main/saham_saya.tsx Normal file
View File

@@ -0,0 +1,151 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import {
Title,
Card,
CardSection,
Group,
Flex,
Avatar,
AspectRatio,
Box,
Slider,
Grid,
Stack,
Divider,
Badge,
Image,
Text,
} from "@mantine/core";
import { IconCircleCheck } from "@tabler/icons-react";
import moment from "moment";
import { useRouter } from "next/navigation";
import dataDummy from "../dummy/data_dummy.json";
export default function InvestasiSahamTerbeli() {
const router = useRouter();
return (
<>
{dataDummy.map((e) => (
<Card
key={e.id}
withBorder
bg={"gray.5"}
mb={"lg"}
onClick={() =>
router.push(RouterInvestasi.detail_saham_terbeli + `${e.id}`)
}
>
<CardSection>
<Group position="left" mt={"sm"} px={"md"}>
<Flex align={"center"} gap={"xs"}>
<Avatar src={"/aset/avatar.png"} />
<Text>Username</Text>
</Flex>
</Group>
</CardSection>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
{/* {e.imagesId ? (
<Image alt="" src={`/api/investasi/gambar/${e.imagesId}`} />
) : (
<Image alt="" src={"/aset/no-img.png"} />
)} */}
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box mb={"md"}>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
labelAlwaysOn
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
</Box>
</CardSection>
<CardSection p={"md"}>
<Box>
<Grid>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. {e.targetDana}</Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. {e.hargaLembar}</Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>ROI</Text>
<Text>{e.roi}%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>{e.totalLembar}</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="apart">
{e.statusSaham.id === 1 ? (
<Badge variant="dot">{e.statusSaham.status}</Badge>
) : (
<Badge variant="dot" color="red">
{e.statusSaham.status}
</Badge>
)}
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (
<>
<Group position="center">
<IconCircleCheck color="green" />
<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>
))}
</>
);
}

4
src/app_modules/investasi/metode_transfer/view.tsx
View File

@@ -3,6 +3,7 @@
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
Avatar,
Box,
Button,
Center,
@@ -78,7 +79,8 @@ export default function MetodeTransferInvestasi() {
<Flex direction={"column"} gap={"lg"} mt="xs">
{listNoRekening.map((e) => (
<Box key={e.id}>
<Radio value={e.norek} label={e.name + ": " + e.norek} />
<Radio value={e.norek} label={e.name}/>
</Box>
))}
</Flex>

29
src/app_modules/investasi/portofolio/layout.tsx Normal file
View File

@@ -0,0 +1,29 @@
"use client";
import {
AppShell,
Box,
Button,
Group,
Header,
ScrollArea,
} from "@mantine/core";
import React, { useState } from "react";
export default function LayoutPortofolioInvestasi({
children,
}: {
children: React.ReactNode;
}) {
const [active, setActive] = useState(0);
return (
<>
<AppShell
>
{children}
</AppShell>
</>
);
}

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

@@ -15,8 +15,11 @@ import {
Group,
Image,
Paper,
ScrollArea,
Select,
Slider,
Stack,
Tabs,
Text,
Title,
} from "@mantine/core";
@@ -31,260 +34,245 @@ import { Carousel } from "react-responsive-carousel";
import { useDisclosure } from "@mantine/hooks";
import { Warna } from "@/app/lib/warna";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import {
IconPhoto,
IconMessageCircle,
IconSettings,
} from "@tabler/icons-react";
import { atomWithStorage } from "jotai/utils";
import { useAtom } from "jotai";
import { gs_TabPortoInvestasi } from "../g_state";
export default function PortofolioInvestasi() {
const router = useRouter();
const [activeTab, setActiveTab] = useAtom(gs_TabPortoInvestasi)
const listButton = [
{
id: 1,
name: "Draft",
color: "yellow",
},
{
id: 2,
name: "Review",
color: "orange",
},
{
id: 3,
name: "Publish",
color: "green",
},
{
id: 4,
name: "Reject",
color: "red",
},
];
return (
<>
<MyPortofolioInvestasi />
<Divider my={"lg"} />
<SahamTerbeli />
</>
);
}
<Tabs variant="pills" radius="xl" defaultValue="Draft" value={activeTab} onTabChange={setActiveTab}>
<Tabs.List>
{listButton.map((e) => (
<Tabs.Tab key={e.id} value={e.name} color={!activeTab ? "gray" : e.color} >
{e.name}
</Tabs.Tab>
))}
</Tabs.List>
function MyPortofolioInvestasi() {
const [opened, { toggle }] = useDisclosure(false);
const router = useRouter();
<Divider my={"xs"}/>
return (
<>
<Title mb={"md"} order={4}>
Portofolio Saya
</Title>
<Carousel
showThumbs={false}
infiniteLoop={true}
showArrows={false}
showStatus={false}
swipeable={true}
>
{dataDummy.map((e) => (
<Card
key={e.id}
withBorder
mb={40}
bg={"gray.5"}
onClick={() => router.push(`/dev/investasi/detail_porto/${e.id}`)}
>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
{/* {e.imagesId ? (
<Image alt="" src={`/api/investasi/gambar/${e.imagesId}`} />
) : (
<Image alt="" src={"/aset/no-img.png"} />
)} */}
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box mb={"md"}>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
labelAlwaysOn
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="apart">
{(() => {
if (e.statusPorto.id === 1) {
return (
<Badge color="yellow" variant="outline">
{e.statusPorto.status}
</Badge>
);
} else {
if (e.statusPorto.id === 2) {
return (
<Badge color="red" variant="outline">
{e.statusPorto.status}
</Badge>
);
} else {
return (
<Badge color="green" variant="outline">
{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>
{listButton.map((e) => (
<Tabs.Panel key={e.id} value={e.name} pt="xs">
<StatusPortofolio data={e} />
</Tabs.Panel>
))}
</Carousel>
</Tabs>
</>
);
}
function SahamTerbeli() {
const router = useRouter();
const [opened, { toggle }] = useDisclosure(true);
function StatusPortofolio({ data }: { data: any }) {
return (
<>
<Title mb={"md"} order={4}>
Saham Saya
</Title>
{dataDummy.map((e) => (
<Card
key={e.id}
withBorder
bg={"gray.5"}
mb={"lg"}
onClick={() =>
router.push(RouterInvestasi.detail_saham_terbeli + `${e.id}`)
{(() => {
if (data.id === 1) {
return (
<>
<Draft data={data} />
</>
);
} else {
if (data.id === 2) {
return (
<>
<Review data={data} />
</>
);
} else {
if (data.id === 3) {
return (
<>
<Publish data={data} />
</>
);
} else {
return (
<>
<Reject data={data} />
</>
);
}
}
>
<CardSection>
<Group position="left" mt={"sm"} px={"md"}>
<Flex align={"center"} gap={"xs"}>
<Avatar src={"/aset/avatar.png"} />
<Text>Username</Text>
</Flex>
</Group>
</CardSection>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
{/* {e.imagesId ? (
<Image alt="" src={`/api/investasi/gambar/${e.imagesId}`} />
) : (
<Image alt="" src={"/aset/no-img.png"} />
)} */}
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box mb={"md"}>
<Title order={4}>{e.title}</Title>
<Slider
size={10}
disabled
labelAlwaysOn
value={e.persentase}
marks={[{ value: e.persentase, label: e.persentase + `%` }]}
/>
</Box>
</CardSection>
<CardSection p={"md"}>
<Box>
<Grid>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>Dana Dibutuhkan</Text>
<Text>Rp. {e.targetDana}</Text>
</Box>
<Box>
<Text>Harga Per Lembar</Text>
<Text>Rp. {e.hargaLembar}</Text>
</Box>
</Stack>
</Grid.Col>
<Grid.Col span={6}>
<Stack>
<Box>
<Text>ROI</Text>
<Text>{e.roi}%</Text>
</Box>
<Box>
<Text>Total Lembar</Text>
<Text>{e.totalLembar}</Text>
</Box>
</Stack>
</Grid.Col>
</Grid>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="apart">
{e.statusSaham.id === 1 ? (
<Badge variant="dot">{e.statusSaham.status}</Badge>
) : (
<Badge variant="dot" color="red">
{e.statusSaham.status}
</Badge>
)}
{(() => {
if (
e.masterPencarianInvestorId -
moment(new Date()).diff(new Date(e.createdAt), "days") <=
0
) {
return (
<>
<Group position="center">
<IconCircleCheck color="green" />
<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>
))}
}
})()}
</>
);
}
function Draft({ data }: { data: any }) {
const router = useRouter();
return (
<>
<Card
withBorder
mb={40}
bg={"gray.5"}
onClick={() => router.push(RouterInvestasi.detail_draft)}
>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box>
<Title order={4}>Judul Investasi</Title>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="center">
<Badge color="yellow" variant="dot">
Draft
</Badge>
</Group>
</CardSection>
</Card>
</>
);
}
function Review({ data }: { data: any }) {
const router = useRouter();
return (
<>
<Card
withBorder
mb={40}
bg={"gray.5"}
onClick={() => router.push(RouterInvestasi.detail_review)}
>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box >
<Title order={4}>Judul Investasi</Title>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="center">
<Badge color="orange" variant="dot">
{data.name}
</Badge>
</Group>
</CardSection>
</Card>
</>
);
}
function Publish({ data }: { data: any }) {
const router = useRouter();
return (
<>
<Card
withBorder
mb={40}
bg={"gray.5"}
onClick={() => router.push(RouterInvestasi.detail_publish)}
>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box mb={"md"}>
<Title order={4}>Judul Investasi</Title>
<Slider
size={10}
disabled
labelAlwaysOn
value={60}
marks={[{ value: 60, label: 60 + `%` }]}
/>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="apart">
<Badge color="green" variant="dot">
{data.name}
</Badge>
<Text>Sisa Waktu : 30 Hari</Text>
</Group>
</CardSection>
</Card>
</>
);
}
function Reject({ data }: { data: any }) {
const router = useRouter();
return (
<>
<Card
withBorder
mb={40}
bg={"gray.5"}
onClick={() => router.push(RouterInvestasi.detail_reject)}
>
<CardSection p={"xs"}>
<AspectRatio ratio={16 / 9}>
<Image alt="" src={"/aset/no-img.png"} />
</AspectRatio>
</CardSection>
<CardSection p={"lg"}>
<Box>
<Title order={4}>Judul Investasi</Title>
</Box>
</CardSection>
<Divider />
<CardSection p={"md"}>
<Group position="center">
<Badge color="red" variant="dot">
{data.name}
</Badge>
</Group>
</CardSection>
</Card>
</>
);
}

57
src/app_modules/investasi/status_transaksi/gagal/layout.tsx Normal file
View File

@@ -0,0 +1,57 @@
"use client"
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import { AppShell, Header, Group, CloseButton, ActionIcon, Footer, Center, Button, Text } from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_investasiFooter } from "../../g_state";
export default function LayoutStatusTransaksiInvestasi_Gagal( {
children,
}: {
children: React.ReactNode;
}) {
const router = useRouter();
const [hotMenu, setHotMenu] = useAtom(gs_investasiFooter);
return (
<>
<AppShell
header={
<Header height={50}>
<Group position="apart" align="center" h={50} px={"md"}>
<CloseButton
size={"md"}
onClick={() => {
router.push(RouterInvestasi.main_transaksi);
setHotMenu(3);
}}
/>
<Text>Status Transaksi</Text>
<ActionIcon variant="transparent" disabled></ActionIcon>
</Group>
</Header>
}
footer={
<Footer height={70} sx={{ borderStyle: "none" }}>
<Center>
<Button
w={300}
radius={50}
bg={Warna.biru}
onClick={() => {
router.push(RouterInvestasi.main_transaksi), setHotMenu(3);
}}
>
Kembali Ke Transaksi
</Button>
</Center>
</Footer>
}
>
{children}
</AppShell>
</>
);
}

62
src/app_modules/investasi/status_transaksi/gagal/view.tsx Normal file
View File

@@ -0,0 +1,62 @@
"use client"
import { Paper, Stack, Center, Flex, Title, Divider, Group, Text } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconAlertHexagon } from "@tabler/icons-react";
import moment from "moment";
import { useState } from "react";
export default function StatusTransaksiInvestasi_Gagal(){
const [tgl, setTgl] = useState<any | Date>(null);
useShallowEffect(() => {
onDate();
}, []);
async function onDate() {
const d = Date.now();
setTgl(moment(d).format("LLL"));
}
return (
<>
<Paper bg="gray.4" radius={"md"} py={"md"}>
<Stack>
<Center>
<Stack>
<Flex direction={"column"} align={"center"}>
<Title order={5}>Transaksi Gagal</Title>
<Text fz={10}>{tgl}</Text>
</Flex>
<Center>
<Stack>
<Center>
<IconAlertHexagon size={100} color="red"/>
</Center>
<Text fw={"bold"} >
Rp. 300.000
</Text>
</Stack>
</Center>
</Stack>
</Center>
<Stack px={"md"}>
<Divider color="dark.1" />
<Group position="apart">
<Text>Penerima</Text>
<Text fw={"bold"}>Nama Penerima</Text>
</Group>
<Group position="apart">
<Text>Bank Penerima</Text>
<Text fw={"bold"}>Nama Bank(BNI, BSI, dll)</Text>
</Group>
<Group position="apart">
<Text>Nomor Rekening</Text>
<Text fw={"bold"}>0000000000000</Text>
</Group>
</Stack>
</Stack>
</Paper>
</>
);
}

20
src/app_modules/investasi/status_transaksi/layout.tsx
View File

@@ -18,13 +18,14 @@ import React from "react";
import { gs_investasiFooter } from "../g_state";
import { Warna } from "@/app/lib/warna";
export default function LayoutStatusTransaksiInvestasi({
export default function LayoutStatusTransaksiInvestasi(
{
children,
}: {
children: React.ReactNode;
}) {
const router = useRouter();
// const [changeColor, setChangeColor] = useAtom(gs_investasiFooter);
const [hotMenu, setHotMenu] = useAtom(gs_investasiFooter);
return (
<>
@@ -35,8 +36,8 @@ export default function LayoutStatusTransaksiInvestasi({
<CloseButton
size={"md"}
onClick={() => {
router.push(RouterInvestasi.portofolio);
// setChangeColor(true);
router.push(RouterInvestasi.main_transaksi);
setHotMenu(3);
}}
/>
<Text>Status Transaksi</Text>
@@ -47,7 +48,16 @@ export default function LayoutStatusTransaksiInvestasi({
footer={
<Footer height={70} sx={{ borderStyle: "none" }}>
<Center>
<Button w={300} radius={50} bg={Warna.biru} onClick={() => router.push(RouterInvestasi.portofolio)}>Kembali Ke Portofolio</Button>
<Button
w={300}
radius={50}
bg={Warna.biru}
onClick={() => {
router.push(RouterInvestasi.main_investasi), setHotMenu(2);
}}
>
Kembali Ke Investasi
</Button>
</Center>
</Footer>
}

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

@@ -0,0 +1,19 @@
"use client";
import HeaderTamplate from "@/app_modules/component/header_tamplate";
import { AppShell, Title } from "@mantine/core";
import React from "react";
export default function LayoutTransaksiInvestasi({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
<AppShell header={<Title order={6}>History transaksi</Title>}>
{children}
</AppShell>
</>
);
}

127
src/app_modules/investasi/transaksi/page.tsx Normal file
View File

@@ -0,0 +1,127 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Badge, Group, Paper, Stack, Text, Title } from "@mantine/core";
import { useRouter } from "next/navigation";
import toast from "react-simple-toasts";
export default function TransaksiInvestasi() {
const router = useRouter();
const listStatusTransaksi = [
{ id: 1, name: "Berhasil" },
{ id: 2, name: "Menunggu" },
{ id: 3, name: "Proses" },
{ id: 4, name: "Batal" },
];
const dataDummy = [
{
id: 1,
name: "Judul Investasi",
status: { id: 1, name: "Berhasil" },
},
{
id: 2,
name: "Judul Investasi",
status: { id: 3, name: "Proses" },
},
{
id: 3,
name: "Judul Investasi",
status: { id: 2, name: "Menunggu" },
},
{
id: 4,
name: "Judul Investasi",
status: { id: 4, name: "Batal" },
},
{
id: 5,
name: "Judul Investasi",
status: { id: 1, name: "Berhasil" },
},
];
async function onKlik(id: any) {
if (id === 1) {
return router.push(RouterInvestasi.status_transaksi);
} else {
if (id === 2) {
return router.push(RouterInvestasi.transfer);
} else {
if (id === 3) {
return router.push(RouterInvestasi.dialog_transaksi)
} else {
return router.push(RouterInvestasi.status_transaksi_gagal)
}
}
}
}
return (
<>
<Stack>
{dataDummy.map((e) => (
<Paper
key={e.id}
p="xs"
bg={"gray"}
onClick={() => onKlik(e.status.id)}
>
<Group position="apart">
<Title order={5}>{e.name}</Title>
<Title order={5}>Rp. 100.000</Title>
</Group>
<Group position="apart">
<Stack spacing={0}>
<Text fz={"xs"}>Nama Bank</Text>
<Text fz={"xs"}>10 Oktober 2023</Text>
</Stack>
{(() => {
if (e.status.id === 1) {
return (
<>
<Title order={5} c={"green"}>
Berhasil
</Title>
</>
);
} else {
if (e.status.id === 2) {
return (
<>
<Title order={5} c={"orange"}>
Menunggu
</Title>
</>
);
} else {
if (e.status.id === 3) {
return (
<>
<>
<Title order={5} c={"blue"}>
Proses
</Title>
</>
</>
);
} else {
return (
<>
<Title order={5} c={"red"}>
Dibatalkan
</Title>
</>
);
}
}
}
})()}
</Group>
</Paper>
))}
</Stack>
</>
);
}

32
src/app_modules/investasi/transfer/layout.tsx
View File

@@ -3,7 +3,17 @@
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import HeaderTamplate from "@/app_modules/component/header_tamplate";
import { AppShell, Button, Center, Footer } from "@mantine/core";
import {
ActionIcon,
AppShell,
Button,
Center,
CloseButton,
Footer,
Group,
Header,
Text,
} from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import React from "react";
@@ -15,12 +25,25 @@ export default function LayoutTransferInvestasi({
children: React.ReactNode;
}) {
const router = useRouter();
const [changeColor, setChangeColor] = useAtom(gs_investasiFooter);
const [hotMenu, setHotMenu] = useAtom(gs_investasiFooter);
return (
<>
<AppShell
header={<HeaderTamplate title="Transfer " />}
header={
<Header height={50}>
<Group position="apart" h={50} px={"md"}>
<CloseButton
size={"md"}
onClick={() => {
router.push(RouterInvestasi.main_transaksi), setHotMenu(3);
}}
/>
<Text>Transfer</Text>
<ActionIcon variant="transparent" disabled></ActionIcon>
</Group>
</Header>
}
footer={
<Footer height={70} sx={{ borderStyle: "none" }}>
<Center>
@@ -30,9 +53,8 @@ export default function LayoutTransferInvestasi({
bg={Warna.biru}
onClick={() => {
router.push(RouterInvestasi.dialog_transaksi);
setChangeColor(true)
setHotMenu(1);
// router.push(RouterInvestasi.status_transaksi);
}}
>
Sudah Transfer

70
src/app_modules/investasi/transfer/view.tsx
View File

@@ -20,9 +20,11 @@ import {
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconAlertTriangle } from "@tabler/icons-react";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import Countdown from "react-countdown";
export default function TransferInvestasi() {
const router = useRouter();
@@ -40,16 +42,44 @@ export default function TransferInvestasi() {
}
}, []);
const PopupCD = () => <Text fz={"xs"} c={"white"}>Gagal</Text>;
const countD = ({ hours, minutes, seconds, completed }: any) => {
if (completed) {
return PopupCD();
} else {
return (
<>
{hours}:{minutes}:{seconds}
</>
);
}
};
return (
<>
<Stack spacing={"xl"}>
<Stack spacing={0} mb={"md"}>
<Stack spacing={"lg"}>
<Stack spacing={0} mb={"xs"}>
<Title order={5}>Mohon transfer ke Xendit</Title>
<Group align="center">
<Text>untuk diteruskan ke </Text>
<Title order={5}>Nama Pemilik Proyek</Title>
</Group>
<Divider mt={"lg"} />
<Divider my={"md"} />
<Grid>
<Grid.Col span={4}>
<Text fz={"xs"}>Transfer sebelum</Text>
</Grid.Col>
<Grid.Col span={5}>
<Text fz={"xs"} fw={"bold"}>{moment().local().add(1, "day").calendar()}</Text>
</Grid.Col>
<Grid.Col span={3} fz={"xs"} >
<Paper bg={"red"} px={"md"}>
<Center>
<Countdown date={Date.now() + 86400000} renderer={countD} />
</Center>
</Paper>
</Grid.Col>
</Grid>
</Stack>
<Stack spacing={"xl"}>
@@ -112,40 +142,6 @@ export default function TransferInvestasi() {
</Stack>
</Stack>
</Stack>
{/* Upload */}
{/* <Group position="center" mt="lg" mb={"md"}>
<FileButton
onChange={async (files: any) => {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
setImg(buffer);
setFl(files);
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
// w={350}
compact
radius={50}
bg={Warna.biru}
// onClick={() => router.push("/dev/investasi/upload")}
>
Upload
</Button>
)}
</FileButton>
</Group>
<AspectRatio ratio={16 / 9} mb={"lg"}>
{img ? (
<Image alt="" src={img} />
) : (
<Image alt="" src={"/aset/no-img.png"} />
)}
</AspectRatio> */}
</>
);
}

12
src/bin/seeder/investasi/pembagian_deviden.json
View File

@@ -1,14 +1,14 @@
[
{
"id": 1,
"name": "3 bulan"
"id": "1",
"name": "3"
},
{
"id": 2,
"name": "6 bulan"
"id": "2",
"name": "6"
},
{
"id": 3,
"name": "1 tahun"
"id": "3",
"name": "12"
}
]

16
src/bin/seeder/investasi/pencarian_investor.json
View File

@@ -1,19 +1,19 @@
[
{
"id": 1,
"name": "30 hari"
"id": "1",
"name": "30"
},
{
"id": 2,
"name": "60 hari"
"id": "2",
"name": "60"
},
{
"id": 3,
"name": "90 hari"
"id": "3",
"name": "90"
},
{
"id": 4,
"name": "120 hari"
"id": "4",
"name": "120"
}
]

4
src/bin/seeder/investasi/periode_deviden.json
View File

@@ -1,10 +1,10 @@
[
{
"id": 1,
"id": "1",
"name": "Selamanya"
},
{
"id": 2,
"id": "2",
"name": "Satu tahun"
}
]

22
src/bin/seeder/investasi/status_investasi.json Normal file
View File

@@ -0,0 +1,22 @@
[
{
"id": "1",
"name": "Draft",
"color": "yellow"
},
{
"id": "2",
"name": "Review",
"color": "orange"
},
{
"id": "3",
"name": "Publish",
"color": "green"
},
{
"id": "4",
"name": "Reject",
"color": "red"
}
]