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

fix:

Browse Source 
Deksripsi:
- Progress investasi
- Tampilan voting
## No issue
This commit is contained in:
Bagasbanuna02
2024-09-10 12:12:31 +08:00
parent 84b7b381f6
commit 3b7e9977f6
163 changed files with 1556 additions and 428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/app_modules/investasi/_component/comp_card_border_and_background.tsx
View File

@@ -1,6 +1,7 @@
import { AccentColor } from "@/app_modules/_global/color";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
import { Card } from "@mantine/core";
import React from "react";
import React, { useState } from "react";
export function Investasi_ComponentStylesCard({
children,
@@ -13,9 +14,9 @@ export function Investasi_ComponentStylesCard({
backgroundColor?: string;
border?: string;
marginBottom?: string | number;
onClickHandler?: (val: any) => void;
onClickHandler?: React.MouseEventHandler<HTMLDivElement>;
}) {
return (
<>
<Card
@@ -24,9 +25,8 @@ export function Investasi_ComponentStylesCard({
? backgroundColor
: AccentColor.darkblue,
border: `2px solid ${border ? border : AccentColor.blue}`,
paddingInline: "20px",
paddingTop: "15px",
paddingBottom: "20px",
paddingInline: "15px",
paddingBlock: "15px",
borderRadius: "10px",
color: "white",
marginBottom: marginBottom ? marginBottom : "0x",

6
src/app_modules/investasi/_component/index.ts
View File

@@ -9,17 +9,21 @@ import { Investasi_ComponentCardBeranda } from "./main/comp_card_beranda";
import { Investasi_ComponentCardDaftarTransaksi } from "./main/comp_card_daftar_transaksi";
import { Investasi_ComponentSahamSaya } from "./main/comp_card_saham_saya";
import { Investasi_ComponentFooterMain } from "./main/comp_footer_main";
import { Investasi_ComponentCardPortofolioPublish } from "./main/comp_card_portofolio_publish";
import { Investasi_ComponentButtonUpdateBeranda } from "./main/comp_update_beranda";
import { Investasi_ComponentCardPortofolio_NotPublish } from "./main/comp_card_portofolio_not_publish";
export { Investasi_ComponentFooterMain };
export { Investasi_ComponentCardBeranda };
export { Investasi_ComponentButtonUpdateBeranda };
export { Investasi_ComponentCardDaftarTransaksi };
export { Investasi_ComponentSahamSaya };
export { Investasi_ComponentStylesCard as Investasasi_ComponentBoxBorderAndBackground };
export { Investasi_ComponentStylesCard };
export { Investasi_ComponentBoxProspektus };
export { Investasi_ComponentBoxDaftarDokumen };
export { Investasi_ComponentBoxDaftarBerita };
export { Investasi_ComponentBoxHargaDanLembarSaham };
export { Investasi_ComponentBoxProgress };
export { Investasi_ComponentBoxDetailData };
export { Investasi_ComponentCardPortofolioPublish };
export { Investasi_ComponentCardPortofolio_NotPublish };

21
src/app_modules/investasi/_component/main/comp_card_beranda.tsx
View File

@@ -1,6 +1,6 @@
import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import {
Card,
CardSection,
@@ -70,14 +70,17 @@ export function Investasi_ComponentCardBeranda({
<Title align="center" order={3}>
{data?.title}
</Title>
{/* <Progress
label={(+e.progress).toFixed(2) + " %"}
value={+e.progress}
color="teal"
size="xl"
radius="xl"
/> */}
<Progress
label={(+data?.progress).toFixed(2) + " %"}
value={+data?.progress}
color={MainColor.yellow}
size="xl"
radius="xl"
styles={{
label:{color: MainColor.black}
}}
/>
{/* <Progress
label={
"" +
(
@@ -97,7 +100,7 @@ export function Investasi_ComponentCardBeranda({
color="teal"
size="xl"
radius="xl"
/>
/> */}
</Stack>
</CardSection>

60
src/app_modules/investasi/_component/main/comp_card_portofolio_not_publish.tsx Normal file
View File

@@ -0,0 +1,60 @@
import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
import { Grid, Stack, AspectRatio, Paper, Text, Image } from "@mantine/core";
import _ from "lodash";
import { MODEL_INVESTASI } from "../../_lib/interface";
import { Investasi_ComponentStylesCard } from "../comp_card_border_and_background";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
export function Investasi_ComponentCardPortofolio_NotPublish({
data,
path,
}: {
data: MODEL_INVESTASI;
path: string;
}) {
const router = useRouter();
const [visible, setVisible] = useState(false);
return (
<>
<Investasi_ComponentStylesCard
onClickHandler={() => {
router.push(path + data?.id);
setVisible(true);
}}
>
<Grid>
<Grid.Col span={8}>
<Text fw={"bold"} lineClamp={1}>
{" "}
{_.startCase(data.title)}
</Text>
<Stack spacing={0}>
<Text fz={10}>Target Dana:</Text>
<Text>
Rp.{" "}
{new Intl.NumberFormat("id-ID", {
maximumSignificantDigits: 10,
}).format(+data.targetDana)}
</Text>
</Stack>
</Grid.Col>
<Grid.Col span={4}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt=""
src={RouterInvestasi_OLD.api_gambar + `${data.imagesId}`}
/>
</Paper>
</AspectRatio>
</Grid.Col>
</Grid>
{visible && <ComponentGlobal_CardLoadingOverlay />}
</Investasi_ComponentStylesCard>
</>
);
}

107
src/app_modules/investasi/_component/main/comp_card_portofolio_publish.tsx Normal file
View File

@@ -0,0 +1,107 @@
import {
NEW_RouterInvestasi,
RouterInvestasi_OLD,
} from "@/app/lib/router_hipmi/router_investasi";
import {
Grid,
Stack,
AspectRatio,
Paper,
Group,
Box,
Text,
Image,
} from "@mantine/core";
import { IconCircleCheck, IconChecklist } from "@tabler/icons-react";
import _ from "lodash";
import moment from "moment";
import { MODEL_INVESTASI } from "../../_lib/interface";
import { Investasi_ComponentStylesCard } from "../comp_card_border_and_background";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
export function Investasi_ComponentCardPortofolioPublish({
data,
}: {
data: MODEL_INVESTASI;
}) {
const router = useRouter();
const [visible, setVisible] = useState(false);
return (
<>
<Investasi_ComponentStylesCard
marginBottom={"15px"}
onClickHandler={() => {
router.push(NEW_RouterInvestasi.detail_publish + data?.id);
setVisible(true);
}}
>
<Grid>
<Grid.Col span={8}>
<Text fw={"bold"}> {_.capitalize(data?.title)}</Text>
<Stack spacing={0}>
<Text fz={10}>Target Dana:</Text>
<Text>
Rp.{" "}
{new Intl.NumberFormat("id-ID", {
maximumSignificantDigits: 10,
}).format(+data?.targetDana)}
</Text>
</Stack>
</Grid.Col>
<Grid.Col span={4}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"}>
<Image
alt=""
src={NEW_RouterInvestasi.api_gambar + `${data?.imagesId}`}
/>
</Paper>
</AspectRatio>
</Grid.Col>
</Grid>
<Group position="center" mt={"md"}>
{Number(data?.MasterPencarianInvestor.name) -
moment(new Date()).diff(new Date(data?.updatedAt), "days") <=
0 ? (
<Group position="right">
<IconCircleCheck color="green" />
<Text c={"green"}>Selesai</Text>
</Group>
) : (
<Group
position="center"
style={{ fontSize: 10, fontWeight: "bold" }}
>
<Group>
{Number(data?.MasterPencarianInvestor.name) -
moment(new Date()).diff(new Date(data?.countDown), "days") <=
0 ? (
<Group>
<IconChecklist />
<Text>Selesai</Text>
</Group>
) : (
<Box>
Sisa Waktu : {}
{Number(data?.MasterPencarianInvestor.name) -
moment(new Date()).diff(
new Date(data?.countDown),
"days"
)}{" "}
hari
</Box>
)}
</Group>
</Group>
)}
</Group>
{visible && <ComponentGlobal_CardLoadingOverlay />}
</Investasi_ComponentStylesCard>
</>
);
}

4
src/app_modules/investasi/_fun/create/fun_create_invoice.ts
View File

@@ -1,7 +1,7 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
import { user_funGetOneUserId } from "@/app_modules/fun_global/get_user_token";
interface Model_Invoice_Masuk {
total: number;
@@ -14,7 +14,7 @@ export async function investasi_funCreateInvoice({
}: {
data: Model_Invoice_Masuk;
}) {
const authorId = await user_getOneUserId();
const authorId = await user_funGetOneUserId();
const create = await prisma.investasi_Invoice.create({
data: {

31
src/app_modules/investasi/_fun/get/fun_get_all_investasi_by_user_id.ts Normal file
View File

@@ -0,0 +1,31 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_funGetOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function investasi_funGetAllPublishByUserId({
page,
}: {
page: number;
}) {
const authorId = await user_funGetOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.investasi.findMany({
take: takeData,
skip: skipData,
orderBy: {
countDown: "desc",
},
where: {
authorId: authorId,
masterStatusInvestasiId: "1",
},
include: {
MasterPencarianInvestor: true,
},
});
return data;
}

30
src/app_modules/investasi/_fun/get/fun_get_all_investasi_non_publish_by_user_id.tsx Normal file
View File

@@ -0,0 +1,30 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_funGetOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function investasi_funGetAllInvestasiNonPublishByUserId({
page,
statusId,
}: {
page: number;
statusId: string;
}) {
const authorId = await user_funGetOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.investasi.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},
where: {
authorId: authorId,
masterStatusInvestasiId: statusId,
},
});
return data;
}

4
src/app_modules/investasi/_fun/get/fun_get_all_transaksi_by_user_id.tsx → src/app_modules/investasi/_fun/get/fun_get_all_transaksi_by_user_id.ts
View File

@@ -1,14 +1,14 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
import { user_funGetOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function investasi_funGetTransaksiByUserId({
page,
}: {
page: number;
}) {
const authorId = await user_getOneUserId();
const authorId = await user_funGetOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;

6
src/app_modules/investasi/_fun/get/fun_get_one_investasi_by_id.ts
View File

@@ -1,7 +1,11 @@
"use server";
import prisma from "@/app/lib/prisma";
export async function investasi_funGetOneInvestasiById({investasiId}: {investasiId: string}) {
export async function investasi_funGetOneInvestasiById({
investasiId,
}: {
investasiId: string;
}) {
const data = await prisma.investasi.findUnique({
where: {
id: investasiId,

4
src/app_modules/investasi/_fun/get/fun_get_success_transaction_by_id.ts
View File

@@ -1,14 +1,14 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
import { user_funGetOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function investasi_funGetSuccessTransactionById({
page,
}: {
page: number;
}) {
const authorId = await user_getOneUserId();
const authorId = await user_funGetOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;

9
src/app_modules/investasi/_fun/index.ts
View File

@@ -3,9 +3,16 @@ import { investasi_funGetOneInvestasiById } from "./get/fun_get_one_investasi_by
import { investasi_funGetTransaksiByUserId } from "./get/fun_get_all_transaksi_by_user_id";
import { investasi_funUploadBuktiTransferById } from "./upload/fun_upload_bukti_transfer";
import { investasi_funGetSuccessTransactionById } from "./get/fun_get_success_transaction_by_id";
import { investasi_funGetAllPublishByUserId } from "./get/fun_get_all_investasi_by_user_id";
import { investasi_funGetAllInvestasiNonPublishByUserId } from "./get/fun_get_all_investasi_non_publish_by_user_id";
// Get
export { investasi_funGetOneInvestasiById };
export { investasi_funGetProspekById };
export { investasi_funUploadBuktiTransferById };
export { investasi_funGetTransaksiByUserId };
export { investasi_funGetSuccessTransactionById };
export { investasi_funGetAllPublishByUserId };
export { investasi_funGetAllInvestasiNonPublishByUserId };
// Upload
export { investasi_funUploadBuktiTransferById };

2
src/app_modules/investasi/_ui/index.ts
View File

@@ -10,6 +10,7 @@ import { Investasi_UiTransaksiBerhasil } from "./status_transaksi/ui_transaksi_b
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";
export { Investasi_UiProsesPembelian };
export { Investasi_UiMetodePembayaran };
@@ -23,3 +24,4 @@ export { Investasi_UiTransaksiBerhasil };
export { Investasi_UiFileViewDokumen };
export { Investasi_UiSahamSaya };
export { Investasi_UiDetailSahamSaya };
export { Investasi_UiPortofolio };

34
src/app_modules/investasi/_ui/main/ui_portofolio.tsx
View File

@@ -1,8 +1,28 @@
"use client"
"use client";
export function Investasi_UiPortofolio() {
return <>
</>;
}
import { Investasi_ViewPortofolio } from "../../_view";
export function Investasi_UiPortofolio({
listStatus,
listDataPublish,
listDataReview,
listDataDraft,
listDataReject,
}: {
listStatus: any[];
listDataPublish: any[];
listDataReview: any[];
listDataDraft: any[];
listDataReject: any[];
}) {
return (
<>
<Investasi_ViewPortofolio
listStatus={listStatus}
listDataPublish={listDataPublish}
listDataReview={listDataReview}
listDataDraft={listDataDraft}
listDataReject={listDataReject}
/>
</>
);
}

4
src/app_modules/investasi/_view/index.ts
View File

@@ -1,6 +1,8 @@
import { Investasi_ViewDetailSahamSaya } from "./detail/view_detail_saham_saya";
import PdfToImage from "./file_view/view_file_viewer";
import { Investasi_ViewBeranda } from "./main/view_beranda";
import { Investasi_ViewPortofolio } from "./main/view_portofolio";
import { Investasi_ViewPortofolioReview } from "./main/portofolio/view_portofolio_review";
import { Investasi_ViewSahamSaya } from "./main/view_saham_saya";
import { Investasi_ViewTransaksiBerhasil } from "./status_transaksi/view_invoice_berhasil";
import { Investasi_ViewTransaksiGagal } from "./status_transaksi/view_transaksi_gagal";
@@ -19,3 +21,5 @@ export { Investasi_ViewTransaksiBerhasil };
export { PdfToImage as Investasi_ViewFileViewer };
export { Investasi_ViewSahamSaya };
export { Investasi_ViewDetailSahamSaya };
export { Investasi_ViewPortofolio };

60
src/app_modules/investasi/_view/main/portofolio/view_portofolio_draft.tsx Normal file
View File

@@ -0,0 +1,60 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { data } from "autoprefixer";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { Investasi_ComponentCardPortofolio_NotPublish } from "../../../_component";
import {
investasi_funGetAllInvestasiNonPublishByUserId,
investasi_funGetSuccessTransactionById,
} from "../../../_fun";
import { useState } from "react";
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
export function Investasi_ViewPortofolioDraft({
listData,
}: {
listData: any[];
}) {
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center>
<ComponentGlobal_Loader size={25} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData =
await investasi_funGetAllInvestasiNonPublishByUserId({
page: activePage + 1,
statusId: "3",
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<Investasi_ComponentCardPortofolio_NotPublish
data={item}
path={NEW_RouterInvestasi.detail_draft}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

50
src/app_modules/investasi/_view/main/portofolio/view_portofolio_publish.tsx Normal file
View File

@@ -0,0 +1,50 @@
import { useState } from "react";
import { Investasi_ComponentCardPortofolioPublish } from "../../../_component";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { investasi_funGetSuccessTransactionById } from "../../../_fun";
export function Investasi_ViewPortofolioPublish({
listData,
}: {
listData: any[];
}) {
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center>
<ComponentGlobal_Loader size={25} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await investasi_funGetSuccessTransactionById({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<Investasi_ComponentCardPortofolioPublish data={item as any} />
)}
</ScrollOnly>
)}
</Box>
</>
);
}

60
src/app_modules/investasi/_view/main/portofolio/view_portofolio_reject.tsx Normal file
View File

@@ -0,0 +1,60 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { data } from "autoprefixer";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { Investasi_ComponentCardPortofolio_NotPublish } from "../../../_component";
import {
investasi_funGetAllInvestasiNonPublishByUserId,
investasi_funGetSuccessTransactionById,
} from "../../../_fun";
import { useState } from "react";
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
export function Investasi_ViewPortofolioReject({
listData,
}: {
listData: any[];
}) {
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center>
<ComponentGlobal_Loader size={25} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData =
await investasi_funGetAllInvestasiNonPublishByUserId({
page: activePage + 1,
statusId: "4",
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<Investasi_ComponentCardPortofolio_NotPublish
data={item}
path={NEW_RouterInvestasi.detail_reject}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

60
src/app_modules/investasi/_view/main/portofolio/view_portofolio_review.tsx Normal file
View File

@@ -0,0 +1,60 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Box, Center } from "@mantine/core";
import { data } from "autoprefixer";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { Investasi_ComponentCardPortofolio_NotPublish } from "../../../_component";
import {
investasi_funGetAllInvestasiNonPublishByUserId,
investasi_funGetSuccessTransactionById,
} from "../../../_fun";
import { useState } from "react";
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
export function Investasi_ViewPortofolioReview({
listData,
}: {
listData: any[];
}) {
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
return (
<>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center>
<ComponentGlobal_Loader size={25} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData =
await investasi_funGetAllInvestasiNonPublishByUserId({
page: activePage + 1,
statusId: "2",
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<Investasi_ComponentCardPortofolio_NotPublish
data={item}
path={NEW_RouterInvestasi.detail_review}
/>
)}
</ScrollOnly>
)}
</Box>
</>
);
}

136
src/app_modules/investasi/_view/main/view_portofolio.tsx Normal file
View File

@@ -0,0 +1,136 @@
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
import {
Box,
Button,
Group,
SimpleGrid,
Space,
Stack,
Tabs,
} from "@mantine/core";
import { useAtom } from "jotai";
import { useState } from "react";
import { gs_investasi_status } from "../../g_state";
import { Investasi_ViewPortofolioPublish } from "./portofolio/view_portofolio_publish";
import { Investasi_ViewPortofolioReview } from "./portofolio/view_portofolio_review";
import { Investasi_ViewPortofolioDraft } from "./portofolio/view_portofolio_draft";
import { Investasi_ViewPortofolioReject } from "./portofolio/view_portofolio_reject";
export function Investasi_ViewPortofolio({
listStatus,
listDataPublish,
listDataReview,
listDataDraft,
listDataReject,
}: {
listStatus: any[];
listDataPublish: any[];
listDataReview: any[];
listDataDraft: any[];
listDataReject: any[];
}) {
const [activeTab, setActiveTab] = useAtom(gs_investasi_status);
const [activeStatus, setActiveStatus] =
useState<MODEL_NEW_DEFAULT_MASTER[]>(listStatus);
// return (
// <>
// <Box h={"82vh"}>
// <Group grow h={"5vh"}>
// {activeStatus.map((e) => (
// <Box
// // component={Button}
// // radius={"xl"}
// key={e.id}
// // onClick={() => setActiveTab(e.name)}
// style={{
// alignContent: "center",
// justifyContent: "center",
// transition: "0.5s",
// backgroundColor:
// activeTab === e.name ? MainColor.yellow : "gray",
// border:
// activeTab === e.name ? `1px solid ${AccentColor.yellow}` : "",
// color: activeTab === e.name ? "black" : "white",
// }}
// >
// {e.name}
// </Box>
// ))}
// </Group>
// <Space h={"1vh"} />
// <Box h={"76vh"}>
// {activeTab === "Publish" && (
// <Investasi_ViewPortofolioPublish listData={listDataPublish} />
// )}
// {activeTab === "Review" && <Investasi_ViewPortofolioReview />}
// </Box>
// </Box>
// </>
// );
return (
<>
<Tabs
variant="pills"
radius="xl"
defaultValue={activeTab}
value={activeTab}
onTabChange={setActiveTab}
styles={{
tabsList: {
// backgroundColor: MainColor.black,
position: "sticky",
top: 0,
zIndex: 99,
},
}}
>
<Stack>
<Tabs.List grow mb={"xs"}>
{activeStatus.map((e) => (
<Tabs.Tab
w={"20%"}
key={e.id}
value={e.name}
fw={"bold"}
style={{
transition: "ease 0.5s ",
backgroundColor:
activeTab === e.name ? MainColor.yellow : AccentColor.blue,
// border:
// activeTab === e.name
// ? `1px solid ${AccentColor.yellow}`
// : "",
color: activeTab === e.name ? "black" : "white",
}}
>
{e.name}
</Tabs.Tab>
))}
</Tabs.List>
<Tabs.Panel value="Publish">
<Investasi_ViewPortofolioPublish listData={listDataPublish} />
</Tabs.Panel>
<Tabs.Panel value="Review">
<Investasi_ViewPortofolioReview listData={listDataReview} />
</Tabs.Panel>
<Tabs.Panel value="Draft">
<Investasi_ViewPortofolioDraft listData={listDataDraft} />
</Tabs.Panel>
<Tabs.Panel value="Reject">
<Investasi_ViewPortofolioReject listData={listDataReject} />
</Tabs.Panel>
</Stack>
</Tabs>
</>
);
}