Fix: Investasi

Deskripsi:
- Upload gambar investasi ke storage wibu
- Upload bukti transfer ke storage wibu
# No Issue

src/app_modules/investasi/_ui/create/ui_create_document.tsx

@@ -0,0 +1,16 @@
+"use client"
+
+import { UIGlobal_LayoutHeaderTamplate, UIGlobal_LayoutTamplate } from "@/app_modules/_global/ui"
+import { Investasi_ViewCreateDocument } from "../../_view";
+
+export function Investasi_UiCreateDocument({ investasiId }: { investasiId : string}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Tambah Dokumen" />}
+      >
+        <Investasi_ViewCreateDocument investasiId={investasiId}/>
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_daftar_dokumen.tsx

@@ -0,0 +1,28 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewDaftarDokumen } from "../../_view";
+
+export function Investasi_UiDaftarDokmen({
+  dataDokumen,
+  investasiId,
+}: {
+  dataDokumen: any[];
+  investasiId: string
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Daftar Dokumen" />}
+      >
+        <Investasi_ViewDaftarDokumen
+          dataDokumen={dataDokumen}
+          investasiId={investasiId}
+        />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_detail_portofolio.tsx

@@ -0,0 +1,102 @@
+"use client";
+
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  UIGlobal_Drawer,
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { ActionIcon } from "@mantine/core";
+import {
+  IconCategoryPlus,
+  IconDotsVertical,
+  IconEdit,
+  IconFilePencil,
+} from "@tabler/icons-react";
+import { useState } from "react";
+import { MODEL_INVESTASI } from "../../_lib/interface";
+import {
+  Investasi_ViewDetailDraft,
+  Investasi_ViewDetailPublish,
+  Investasi_ViewDetailReject,
+  Investasi_ViewDetailReview,
+} from "../../_view";
+
+export function Investasi_UiDetailPortofolio({
+  data,
+}: {
+  data: MODEL_INVESTASI;
+}) {
+  const [openDrawer, setOpenDrawer] = useState(false);
+  const listPage = [
+    {
+      id: "1",
+      name: "Edit Investasi",
+      icon: <IconEdit />,
+      path: NEW_RouterInvestasi.edit_investasi({ id: data.id }),
+    },
+    {
+      id: "2",
+      name: "Edit Prospektus",
+      icon: <IconFilePencil />,
+      path: NEW_RouterInvestasi.edit_prospektus({ id: data.id }),
+    },
+    {
+      id: "3",
+      name: "Tambah & Edit Dokumen",
+      icon: <IconCategoryPlus />,
+      path: NEW_RouterInvestasi.rekap_dokumen({ id: data.id }),
+    },
+  ];
+
+  if (data.masterStatusInvestasiId == "3")
+    return (
+      <>
+        <UIGlobal_LayoutTamplate
+          header={
+            <UIGlobal_LayoutHeaderTamplate
+              title={`Detail Draft`}
+              customButtonRight={
+                <ActionIcon
+                  variant="transparent"
+                  onClick={() => setOpenDrawer(true)}
+                >
+                  <IconDotsVertical color="white" />
+                </ActionIcon>
+              }
+            />
+          }
+        >
+          <Investasi_ViewDetailDraft dataInvestasi={data} />
+        </UIGlobal_LayoutTamplate>
+
+        <UIGlobal_Drawer
+          opened={openDrawer}
+          close={() => setOpenDrawer(false)}
+          component={listPage}
+        />
+      </>
+    );
+
+  return (
+    <UIGlobal_LayoutTamplate
+      header={
+        <UIGlobal_LayoutHeaderTamplate
+          title={`Detail ${data.MasterStatusInvestasi.name}`}
+        />
+      }
+    >
+      {data.masterStatusInvestasiId === "1" && (
+        <Investasi_ViewDetailPublish dataInvestasi={data} />
+      )}
+
+      {data.masterStatusInvestasiId === "2" && (
+        <Investasi_ViewDetailReview dataInvestasi={data} />
+      )}
+
+      {data.masterStatusInvestasiId === "4" && (
+        <Investasi_ViewDetailReject dataInvestasi={data} />
+      )}
+    </UIGlobal_LayoutTamplate>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_detail_prospektus.tsx

@@ -0,0 +1,23 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewDetailProspektus } from "../../_view";
+
+export function Investasi_UiDetailProspektus({
+  dataInvestasi,
+}: {
+  dataInvestasi: any;
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Detail Prospektus" />}
+      >
+        <Investasi_ViewDetailProspektus dataInvestasi={dataInvestasi} />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/detail/ui_rekap_dokumen.tsx

@@ -0,0 +1,62 @@
+"use client";
+
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  UIGlobal_Drawer,
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { ActionIcon } from "@mantine/core";
+import { IconCirclePlus, IconDotsVertical } from "@tabler/icons-react";
+import { useState } from "react";
+import { Investasi_ViewRekapDokumen } from "../../_view";
+
+export function Investasi_UiRekapDokumen({
+  investasiId,
+  dataDokumen,
+}: {
+  investasiId: string;
+  dataDokumen: any[]
+}) {
+  const [openDrawer, setOpenDrawer] = useState(false);
+
+  const listPage = [
+    {
+      id: "1",
+      name: "Tambah Dokumen",
+      icon: <IconCirclePlus />,
+      path: NEW_RouterInvestasi.create_dokumen({ id: investasiId }),
+    },
+  ];
+
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={
+          <UIGlobal_LayoutHeaderTamplate
+            title="Rekap Dokumen"
+            customButtonRight={
+              <ActionIcon
+                onClick={() => setOpenDrawer(true)}
+                variant="transparent"
+              >
+                <IconDotsVertical color="white" />
+              </ActionIcon>
+            }
+          />
+        }
+      >
+        <Investasi_ViewRekapDokumen
+          dataDokumen={dataDokumen}
+          investasiId={investasiId}
+        />
+      </UIGlobal_LayoutTamplate>
+
+      <UIGlobal_Drawer
+        opened={openDrawer}
+        close={() => setOpenDrawer(false)}
+        component={listPage}
+      />
+    </>
+  );
+}

src/app_modules/investasi/_ui/edit/ui_edit_dokumen.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewEditDokumen } from "../../_view";
+
+export function Investasi_UiEditDokumen({ dataDokumen }: { dataDokumen: any }) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Edit Dokumen" />}
+      >
+        <Investasi_ViewEditDokumen dataDokumen={dataDokumen} />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/edit/ui_edit_investasi.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewEditInvestasi } from "../../_view";
+
+export function Investasi_UiEditInvestasi({
+  dataInvestasi,
+  pembagianDeviden,
+  pencarianInvestor,
+  periodeDeviden,
+}: {
+  dataInvestasi: any;
+  pembagianDeviden: any[];
+  pencarianInvestor: any[];
+  periodeDeviden: any[];
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Edit Investasi" />}
+      >
+        <Investasi_ViewEditInvestasi
+          dataInvestasi={dataInvestasi}
+          pembagianDeviden={pembagianDeviden}
+          pencarianInvestor={pencarianInvestor}
+          periodeDeviden={periodeDeviden}
+        />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/edit/ui_edit_prospektus.tsx

@@ -0,0 +1,23 @@
+"use client";
+
+import {
+  UIGlobal_LayoutHeaderTamplate,
+  UIGlobal_LayoutTamplate,
+} from "@/app_modules/_global/ui";
+import { Investasi_ViewEditProspektus } from "../../_view";
+
+export function Investasi_UiEditProspektus({
+  investasiId,
+}: {
+  investasiId: string;
+}) {
+  return (
+    <>
+      <UIGlobal_LayoutTamplate
+        header={<UIGlobal_LayoutHeaderTamplate title="Edit Prospektus" />}
+      >
+        <Investasi_ViewEditProspektus investasiId={investasiId} />
+      </UIGlobal_LayoutTamplate>
+    </>
+  );
+}

src/app_modules/investasi/_ui/file_view/ui_file_view_dokumen.tsx

@@ -1,8 +1,9 @@
 "use client";
 
-import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
+import { APIs } from "@/app/lib";
 import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
 import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Box } from "@mantine/core";
 import { IconX } from "@tabler/icons-react";
 import dynamic from "next/dynamic";
 const PdfToImage = dynamic(
@@ -19,12 +20,11 @@ export function Investasi_UiFileViewDokumen({
   return (
     <>
       <UIGlobal_LayoutTamplate
-        header={<UIGlobal_LayoutHeaderTamplate title="" iconLeft={<IconX/>} />}
+        header={<UIGlobal_LayoutHeaderTamplate title="" iconLeft={<IconX />} />}
       >
-        <PdfToImage
-          id={dokumenId}
-          path={RouterInvestasi_OLD.api_file_dokumen}
-        />
+        <Box mb={"lg"}>
+          <PdfToImage id={dokumenId} path={APIs.GET_NO_PARAMS} />
+        </Box>
       </UIGlobal_LayoutTamplate>
     </>
   );

src/app_modules/investasi/_ui/file_view/ui_file_view_prospektus.tsx

@@ -1,8 +1,10 @@
 "use client";
 
+import { APIs } from "@/app/lib";
 import { RouterInvestasi_OLD } from "@/app/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 { Box } from "@mantine/core";
 import { IconX } from "@tabler/icons-react";
 import dynamic from "next/dynamic";
 const PdfToImage = dynamic(
@@ -12,19 +14,21 @@ const PdfToImage = dynamic(
 );
 
 export function Investasi_UiFileViewProspektus({
-  prospekId,
+  pospektusId,
 }: {
-  prospekId: string;
+  pospektusId: string;
 }) {
   return (
     <>
       <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="" iconLeft={<IconX />} />}
       >
-        <PdfToImage
-          id={prospekId}
-          path={RouterInvestasi_OLD.api_file_prospektus}
-        />
+        <Box mb={"lg"}>
+          <PdfToImage
+            id={pospektusId}
+            path={APIs.GET_NO_PARAMS}
+          />
+        </Box>
       </UIGlobal_LayoutTamplate>
     </>
   );

src/app_modules/investasi/_ui/index.ts

@@ -11,6 +11,14 @@ import { Investasi_UiFileViewDokumen } from "./file_view/ui_file_view_dokumen";
 import { Investasi_UiSahamSaya } from "./main/ui_saham_saya";
 import { Investasi_UiDetailSahamSaya } from "./detail/ui_detail_saham_saya";
 import { Investasi_UiPortofolio } from "./main/ui_portofolio";
+import { Investasi_UiDetailPortofolio } from "./detail/ui_detail_portofolio";
+import { Investasi_UiDetailProspektus } from "./detail/ui_detail_prospektus";
+import { Investasi_UiDaftarDokmen } from "./detail/ui_daftar_dokumen";
+import { Investasi_UiEditDokumen } from "./edit/ui_edit_dokumen";
+import { Investasi_UiEditInvestasi } from "./edit/ui_edit_investasi";
+import { Investasi_UiEditProspektus } from "./edit/ui_edit_prospektus";
+import { Investasi_UiCreateDocument } from "./create/ui_create_document";
+import { Investasi_UiRekapDokumen } from "./detail/ui_rekap_dokumen";
 
 export { Investasi_UiProsesPembelian };
 export { Investasi_UiMetodePembayaran };
@@ -25,3 +33,11 @@ export { Investasi_UiFileViewDokumen };
 export { Investasi_UiSahamSaya };
 export { Investasi_UiDetailSahamSaya };
 export { Investasi_UiPortofolio };
+export { Investasi_UiDetailPortofolio };
+export { Investasi_UiDetailProspektus };
+export { Investasi_UiDaftarDokmen };
+export { Investasi_UiEditDokumen };
+export { Investasi_UiEditInvestasi };
+export { Investasi_UiEditProspektus };
+export { Investasi_UiCreateDocument };
+export { Investasi_UiRekapDokumen };

src/app_modules/investasi/_ui/main/ui_layout_main.tsx

@@ -1,12 +1,9 @@
 "use client";
 
-import { useAtom } from "jotai";
-import { useRouter } from "next/navigation";
-import React from "react";
-import { gs_investas_menu } from "../../g_state";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
 import { RouterCrowd } from "@/app/lib/router_hipmi/router_crowd";
 import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
+import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import React from "react";
 import { Investasi_ComponentFooterMain } from "../../_component";
 
 export function Investasi_UiLayoutMain({

src/app_modules/investasi/_ui/main/ui_portofolio.tsx

@@ -1,28 +1,70 @@
 "use client";
 
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import { AccentColor, MainColor } from "@/app_modules/_global/color";
+import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
+import { Stack, Tabs } from "@mantine/core";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
 import { Investasi_ViewPortofolio } from "../../_view";
 export function Investasi_UiPortofolio({
   listStatus,
-  listDataPublish,
-  listDataReview,
-  listDataDraft,
-  listDataReject,
+  statusId,
+  dataPortofolio,
 }: {
-  listStatus: any[];
-  listDataPublish: any[];
-  listDataReview: any[];
-  listDataDraft: any[];
-  listDataReject: any[];
+  listStatus: MODEL_NEW_DEFAULT_MASTER[];
+  statusId: string;
+  dataPortofolio: any[];
 }) {
+  const [activeTab, setActiveTab] = useState<string | null>(statusId);
+  const router = useRouter();
+  const [data, setData] = useState(dataPortofolio);
+
   return (
     <>
-      <Investasi_ViewPortofolio
-        listStatus={listStatus}
-        listDataPublish={listDataPublish}
-        listDataReview={listDataReview}
-        listDataDraft={listDataDraft}
-        listDataReject={listDataReject}
-      />
+      <Tabs
+        variant="pills"
+        radius="xl"
+        defaultValue={activeTab}
+        styles={{
+          tabsList: {
+            position: "sticky",
+            top: 0,
+            zIndex: 99,
+          },
+        }}
+        value={activeTab}
+        onTabChange={(val: any) => {
+          setActiveTab(val);
+          router.push(NEW_RouterInvestasi.portofolio({ id: val }));
+        }}
+      >
+        <Stack>
+          <Tabs.List grow mb={"xs"}>
+            {listStatus.map((e) => (
+              <Tabs.Tab
+                w={"20%"}
+                key={e.id}
+                value={e.id}
+                fw={"bold"}
+                style={{
+                  transition: "ease 0.5s ",
+                  backgroundColor:
+                    activeTab === e.id ? MainColor.yellow : AccentColor.blue,
+                  color: activeTab === e.id ? "black" : "white",
+                }}
+              >
+                {e.name}
+              </Tabs.Tab>
+            ))}
+          </Tabs.List>
+
+          <Investasi_ViewPortofolio
+            statusId={statusId}
+            dataPortofolio={data as any}
+          />
+        </Stack>
+      </Tabs>
     </>
   );
 }