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

fix layout investasi

Browse Source 
deskripsi:
- fix detail portofolio
- fix detail saham saya
- fix detail transaksi
This commit is contained in:
Bagasbanuna02
2025-03-17 14:54:26 +08:00
parent da5d2bead9
commit e37bd16305
11 changed files with 312 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/dev/investasi/status-transaksi/berhasil/[id]/page.tsx
View File

@@ -1,5 +1,3 @@
import { StatusTransaksiInvestasi } from "@/app_modules/investasi";
import { investasi_funGetOneInvoiceById } from "@/app_modules/investasi/_fun/get/fun_get_one_invoice_by_id";
import { Investasi_UiTransaksiBerhasil } from "@/app_modules/investasi/_ui";
export default async function Page({params}: {params: {id: string}}) {

12
src/app_modules/investasi/_component/detail/saham_saya/comp_detail_data.tsx
View File

@@ -4,18 +4,12 @@ import {
ComponentGlobal_LoadImageLandscape,
} from "@/app_modules/_global/component";
import { MODEL_INVOICE_INVESTASI } from "@/app_modules/investasi/_lib/interface";
import {
Box,
Grid,
SimpleGrid,
Stack,
Text,
Title
} from "@mantine/core";
import { Box, Grid, SimpleGrid, Stack, Text, Title } from "@mantine/core";
import { Investasi_ComponentBoxDaftarBerita } from "../comp_box_daftar_berita";
import { Investasi_ComponentBoxDaftarDokumen } from "../comp_box_daftar_dokumen";
import { Investasi_ComponentBoxProspektus } from "../comp_box_prospektus";
import { MainColor } from "@/app_modules/_global/color";
import { Investasi_ComponentBoxInvestor } from "../comp_box_investor";
export function Investasi_ComponentBoxDetailData({
data,
@@ -116,6 +110,8 @@ export function Investasi_ComponentBoxDetailData({
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
]}
>
<Investasi_ComponentBoxInvestor id={data.Investasi.id} />
<Investasi_ComponentBoxProspektus
prospektusFileId={data.Investasi.prospektusFileId}
/>

73
src/app_modules/investasi/_ui/detail/ui_detail_portofolio.tsx
View File

@@ -27,6 +27,11 @@ import {
Investasi_ViewDetailReject,
Investasi_ViewDetailReview,
} from "../../_view";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewHeader,
UI_NewChildren,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
export function Investasi_UiDetailPortofolio() {
const params = useParams<{ id: string }>();
@@ -88,10 +93,11 @@ export function Investasi_UiDetailPortofolio() {
);
}
// DRAFT
if (data.masterStatusInvestasiId == "3")
return (
<>
<UIGlobal_LayoutTamplate
{/* <UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
title={`Detail Draft`}
@@ -107,7 +113,26 @@ export function Investasi_UiDetailPortofolio() {
}
>
<Investasi_ViewDetailDraft dataInvestasi={data} />
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header
title={`Detail Draft`}
customButtonRight={
<ActionIcon
variant="transparent"
onClick={() => setOpenDrawer(true)}
>
<IconDotsVertical color={MainColor.white} />
</ActionIcon>
}
/>
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewDetailDraft dataInvestasi={data} />
</UI_NewChildren>
</UI_NewLayoutTamplate>
<UIGlobal_DrawerCustom
opened={openDrawer}
@@ -122,7 +147,7 @@ export function Investasi_UiDetailPortofolio() {
onClick={() => {
setPageId(e?.id);
setLoading(true);
router.push(e?.path, { scroll: false });
}}
>
@@ -144,20 +169,34 @@ export function Investasi_UiDetailPortofolio() {
);
return (
<UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
title={`Detail ${data.MasterStatusInvestasi.name}`}
/>
}
>
{data.masterStatusInvestasiId === "2" && (
<Investasi_ViewDetailReview dataInvestasi={data} />
)}
// <UIGlobal_LayoutTamplate
// header={
// <UIGlobal_LayoutHeaderTamplate
// title={`Detail ${data.MasterStatusInvestasi.name}`}
// />
// }
// >
// {data.masterStatusInvestasiId === "2" && (
// <Investasi_ViewDetailReview dataInvestasi={data} />
// )}
{data.masterStatusInvestasiId === "4" && (
<Investasi_ViewDetailReject dataInvestasi={data} />
)}
</UIGlobal_LayoutTamplate>
// {data.masterStatusInvestasiId === "4" && (
// <Investasi_ViewDetailReject dataInvestasi={data} />
// )}
// </UIGlobal_LayoutTamplate>
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title={`Detail ${data.MasterStatusInvestasi.name}`} />
</UI_NewHeader>
<UI_NewChildren>
{data.masterStatusInvestasiId === "2" && (
<Investasi_ViewDetailReview dataInvestasi={data} />
)}
{data.masterStatusInvestasiId === "4" && (
<Investasi_ViewDetailReject dataInvestasi={data} />
)}
</UI_NewChildren>
</UI_NewLayoutTamplate>
);
}

15
src/app_modules/investasi/_ui/detail/ui_detail_saham_saya.tsx
View File

@@ -3,15 +3,26 @@
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { Investasi_ViewDetailSahamSaya } from "../../_view";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, { UI_NewHeader, UI_NewChildren } from "@/app_modules/_global/ui/V2_layout_tamplate";
export function Investasi_UiDetailSahamSaya() {
return (
<>
<UIGlobal_LayoutTamplate
{/* <UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Detail Saham" />}
>
<Investasi_ViewDetailSahamSaya />
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title="Detail Saham" />
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewDetailSahamSaya />
</UI_NewChildren>
</UI_NewLayoutTamplate>
</>
);
}

37
src/app_modules/investasi/_ui/edit/ui_edit_investasi_new.tsx
View File

@@ -1,16 +1,33 @@
"use client";
import { UIGlobal_LayoutHeaderTamplate, UIGlobal_LayoutTamplate, } from "@/app_modules/_global/ui";
import {
UIGlobal_LayoutHeaderTamplate,
UIGlobal_LayoutTamplate,
} from "@/app_modules/_global/ui";
import { Investasi_ViewEditInvestasiNew } from "../../_view/edit/view_edit_investasi_new";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewHeader,
UI_NewChildren,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
export function Investasi_UiEditInvestasiNew() {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Edit Investasi" />}
>
<Investasi_ViewEditInvestasiNew />
</UIGlobal_LayoutTamplate>
</>
);
return (
<>
{/* <UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Edit Investasi" />}
>
<Investasi_ViewEditInvestasiNew />
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title="Edit Investasi" />
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewEditInvestasiNew />
</UI_NewChildren>
</UI_NewLayoutTamplate>
</>
);
}

21
src/app_modules/investasi/_ui/edit/ui_edit_prospektus.tsx
View File

@@ -1,19 +1,28 @@
"use client";
import {
UIGlobal_LayoutHeaderTamplate,
UIGlobal_LayoutTamplate,
} from "@/app_modules/_global/ui";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewChildren,
UI_NewHeader,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import { Investasi_ViewEditProspektus } from "../../_view";
export function Investasi_UiEditProspektus() {
return (
<>
<UIGlobal_LayoutTamplate
{/* <UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Edit Prospektus" />}
>
<Investasi_ViewEditProspektus />
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title="Edit Prospektus" />
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewEditProspektus />
</UI_NewChildren>
</UI_NewLayoutTamplate>
</>
);
}

58
src/app_modules/investasi/_ui/file_view/ui_file_view_dokumen.tsx
View File

@@ -2,6 +2,7 @@
import { MainColor } from "@/app_modules/_global/color";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import {
apiGetPdfToImage,
PageData,
@@ -9,6 +10,7 @@ import {
import { UIGlobal_DrawerCustom } from "@/app_modules/_global/ui";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import UI_NewLayoutTamplate, { UI_NewHeader, UI_NewChildren } from "@/app_modules/_global/ui/V2_layout_tamplate";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { ActionIcon, Box, Stack, Text } from "@mantine/core";
import { IconDotsVertical, IconDownload, IconX } from "@tabler/icons-react";
@@ -67,7 +69,7 @@ export function Investasi_UiFileViewDokumen() {
return (
<>
<UIGlobal_LayoutTamplate
{/* <UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
title="Pratinjau Dokumen"
@@ -116,7 +118,59 @@ export function Investasi_UiFileViewDokumen() {
</div>
)}
</Box>
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header
title="Pratinjau Dokumen"
iconLeft={<IconX />}
customButtonRight={
<ActionIcon
variant="transparent"
onClick={() => {
setOpen(true);
}}
>
<IconDotsVertical color="white" />
</ActionIcon>
}
/>
</UI_NewHeader>
<UI_NewChildren>
<Box mb="lg">
{loading ? (
<CustomSkeleton height={"80vh"} width={"100%"} />
) : error ? (
<Stack>
<ComponentGlobal_IsEmptyData text="Maaf, PDF mengalami error" />
<ComponentGlobal_IsEmptyData text={error} />
</Stack>
) : (
<div
ref={pdfsRef}
style={{
display: "flex",
flexDirection: "column",
alignItems: "center",
}}
>
{pdfPages?.map((page, index) => (
<Image
key={`page-${index}`}
src={page.imageUrl}
alt={`Page ${page.pageNumber}`}
className="pdf-page"
width={500} // Adjust width as needed
height={707} // Adjust height as needed
style={{ width: "100%", marginBottom: "10px" }}
/>
))}
</div>
)}
</Box>
</UI_NewChildren>
</UI_NewLayoutTamplate>
<UIGlobal_DrawerCustom
close={() => setOpen(false)}

68
src/app_modules/investasi/_ui/file_view/ui_file_view_prospektus.tsx
View File

@@ -2,6 +2,7 @@
import { MainColor } from "@/app_modules/_global/color";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import {
apiGetPdfToImage,
PageData,
@@ -9,6 +10,10 @@ import {
import { UIGlobal_DrawerCustom } from "@/app_modules/_global/ui";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import UI_NewLayoutTamplate, {
UI_NewHeader,
UI_NewChildren,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { ActionIcon, Box, Stack, Text } from "@mantine/core";
import { IconDotsVertical, IconDownload, IconX } from "@tabler/icons-react";
@@ -70,7 +75,7 @@ export function Investasi_UiFileViewProspektus() {
return (
<>
<UIGlobal_LayoutTamplate
{/* <UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
title="Pratinjau Prospektus"
@@ -100,7 +105,6 @@ export function Investasi_UiFileViewProspektus() {
) : error && error !== "" ? (
<Stack>
<ComponentGlobal_IsEmptyData text="Maaf, PDF mengalami error" />
{/* <ComponentGlobal_IsEmptyData text={error} /> */}
</Stack>
) : (
<div
@@ -125,7 +129,65 @@ export function Investasi_UiFileViewProspektus() {
</div>
)}
</Box>
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header
title="Pratinjau Prospektus"
iconLeft={<IconX />}
customButtonRight={
loading ? (
<CustomSkeleton circle height={30} width={30} />
) : error && error !== "" ? (
<ActionIcon disabled />
) : (
<ActionIcon
variant="transparent"
onClick={() => {
setOpen(true);
}}
>
<IconDotsVertical color="white" />
</ActionIcon>
)
}
/>
</UI_NewHeader>
<UI_NewChildren>
<Box mb="lg">
{loading ? (
<CustomSkeleton height={"80vh"} width={"100%"} />
) : error && error !== "" ? (
<Stack>
<ComponentGlobal_IsEmptyData text="Maaf, PDF mengalami error" />
{/* <ComponentGlobal_IsEmptyData text={error} /> */}
</Stack>
) : (
<div
ref={pdfsRef}
style={{
display: "flex",
flexDirection: "column",
alignItems: "center",
}}
>
{pdfPages?.map((page, index) => (
<Image
key={`page-${index}`}
src={page.imageUrl}
alt={`Page ${page.pageNumber}`}
className="pdf-page"
width={500} // Adjust width as needed
height={707} // Adjust height as needed
style={{ width: "100%", marginBottom: "10px" }}
/>
))}
</div>
)}
</Box>
</UI_NewChildren>
</UI_NewLayoutTamplate>
<UIGlobal_DrawerCustom
close={() => setOpen(false)}

53
src/app_modules/investasi/_ui/status_transaksi/ui_transaksi_berhasil.tsx
View File

@@ -1,19 +1,18 @@
"use client";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewChildren,
UI_NewHeader,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import { RouterInvestasi_OLD } from "@/lib/router_hipmi/router_investasi";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ActionIcon, Loader } from "@mantine/core";
import { IconX } from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useParams, useRouter } from "next/navigation";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { Investasi_ViewTransaksiBerhasil } from "../../_view";
import { gs_investas_menu } from "../../g_state";
import { useShallowEffect } from "@mantine/hooks";
import { apiGetOneSahamInvestasiById } from "../../_lib/api_fetch_new_investasi";
import { MODEL_INVOICE_INVESTASI } from "../../_lib/interface";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export function Investasi_UiTransaksiBerhasil() {
const router = useRouter();
@@ -21,9 +20,32 @@ export function Investasi_UiTransaksiBerhasil() {
const [isLoading, setLoading] = useState(false);
return (
<UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
// <UIGlobal_LayoutTamplate
// header={
// <UIGlobal_LayoutHeaderTamplate
// title="Transaksi Berhasil"
// customButtonLeft={
// <ActionIcon
// variant="transparent"
// onClick={() => {
// setHotMenu(3);
// setLoading(true);
// router.push(RouterInvestasi_OLD.main_transaksi);
// }}
// >
// {isLoading ? <Loader color="yellow" /> : <IconX />}
// </ActionIcon>
// }
// />
// }
// >
// <Investasi_ViewTransaksiBerhasil />
// </UIGlobal_LayoutTamplate>
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header
title="Transaksi Berhasil"
customButtonLeft={
<ActionIcon
@@ -38,11 +60,10 @@ export function Investasi_UiTransaksiBerhasil() {
</ActionIcon>
}
/>
}
>
<Investasi_ViewTransaksiBerhasil />
</UIGlobal_LayoutTamplate>
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewTransaksiBerhasil />
</UI_NewChildren>
</UI_NewLayoutTamplate>
);
}

44
src/app_modules/investasi/_ui/status_transaksi/ui_transaksi_gagal.tsx
View File

@@ -1,8 +1,11 @@
"use client";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewChildren,
UI_NewHeader,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import { RouterInvestasi_OLD } from "@/lib/router_hipmi/router_investasi";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ActionIcon, Loader } from "@mantine/core";
import { IconX } from "@tabler/icons-react";
import { useAtom } from "jotai";
@@ -17,9 +20,31 @@ export function Investasi_UiTransaksiGagal() {
const [isLoading, setLoading] = useState(false);
return (
<UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
// <UIGlobal_LayoutTamplate
// header={
// <UIGlobal_LayoutHeaderTamplate
// title="Transaksi Gagal"
// customButtonLeft={
// <ActionIcon
// variant="transparent"
// onClick={() => {
// setHotMenu(3);
// setLoading(true);
// router.push(RouterInvestasi_OLD.main_transaksi);
// }}
// >
// {isLoading ? <Loader color="yellow" /> : <IconX />}
// </ActionIcon>
// }
// />
// }
// >
// <Investasi_ViewTransaksiGagal />
// </UIGlobal_LayoutTamplate>
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header
title="Transaksi Gagal"
customButtonLeft={
<ActionIcon
@@ -34,9 +59,10 @@ export function Investasi_UiTransaksiGagal() {
</ActionIcon>
}
/>
}
>
<Investasi_ViewTransaksiGagal />
</UIGlobal_LayoutTamplate>
</UI_NewHeader>
<UI_NewChildren>
<Investasi_ViewTransaksiGagal />
</UI_NewChildren>
</UI_NewLayoutTamplate>
);
}

18
src/app_modules/investasi/_view/edit/view_edit_prospektus.tsx
View File

@@ -4,20 +4,9 @@ import {
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import {
Box,
Button,
Center,
Grid,
Stack,
Text
} from "@mantine/core";
import {
IconCircleCheck,
IconFileTypePdf
} from "@tabler/icons-react";
import { Box, Button, Center, Grid, Stack, Text } from "@mantine/core";
import { IconCircleCheck, IconFileTypePdf } from "@tabler/icons-react";
import { DIRECTORY_ID } from "@/lib";
import {
funGlobal_DeleteFileById,
funGlobal_UploadToStorage,
@@ -26,6 +15,7 @@ import {
ComponentGlobal_NotifikasiBerhasil,
ComponentGlobal_NotifikasiPeringatan,
} from "@/app_modules/_global/notif_global";
import { DIRECTORY_ID } from "@/lib";
import { clientLogger } from "@/util/clientLogger";
import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
@@ -160,7 +150,7 @@ export function Investasi_ViewEditProspektus() {
transition: "all 0.3s ease",
position: "absolute",
bottom: 20,
width: "90%",
width: 300,
}}
onClick={() => {
onUpload();