upd : investasi portofolio

Deskripsi:
- api pada list investasi portofolio - semua status

No Issues
This commit is contained in:
amel
2024-12-16 17:40:52 +08:00
parent 943f16cb2f
commit b5375f272c
10 changed files with 344 additions and 8 deletions

View File

@@ -98,6 +98,38 @@ export async function GET(request: Request) {
if (userLoginId == null) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan data, user id tidak ada" }, { status: 500 });
}
const data = await prisma.investasi.findMany({
take: 5,
skip: dataSkip,
orderBy: {
updatedAt: "desc",
},
where: {
authorId: userLoginId,
masterStatusInvestasiId: status,
},
select: {
id: true,
title: true,
targetDana: true,
imageId: true,
countDown: true,
updatedAt: true,
MasterPencarianInvestor: {
select: {
name: true
}
}
}
});
dataFix = data.map((v: any) => ({
..._.omit(v, ["MasterPencarianInvestor"]),
pencarianInvestor: v.MasterPencarianInvestor.name
}))
}

View File

@@ -1,22 +1,23 @@
import { investasi_funGetPortofolioByStatusId } from "@/app_modules/investasi/_fun";
import { Investasi_UiPortofolio } from "@/app_modules/investasi/_ui";
import { Investasi_UiPortofolio, Investasi_UiPortofolioNew } from "@/app_modules/investasi/_ui";
import getStatusInvestasi from "@/app_modules/investasi/fun/master/get_status_investasi";
export default async function Page({ params }: { params: { id: string } }) {
const statusId = params.id;
// const statusId = params.id;
const listStatus = await getStatusInvestasi();
const dataPortofolio = await investasi_funGetPortofolioByStatusId({
page: 1,
statusId: statusId,
});
// const dataPortofolio = await investasi_funGetPortofolioByStatusId({
// page: 1,
// statusId: statusId,
// });
return (
<>
<Investasi_UiPortofolio
{/* <Investasi_UiPortofolio
statusId={statusId}
listStatus={listStatus as any}
dataPortofolio={dataPortofolio as any}
/>
/> */}
<Investasi_UiPortofolioNew listStatus={listStatus as any} />
</>
);
}

View File

@@ -0,0 +1,44 @@
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { ComponentGlobal_CardStyles, ComponentGlobal_LoadImageCustom } from "@/app_modules/_global/component";
import { Grid, Stack, Text } from "@mantine/core";
import _ from "lodash";
import { useRouter } from "next/navigation";
import { IDataInvestasiBursa } from "../../_lib/type_investasi";
export function Investasi_ComponentCardPortofolio_NotPublishNew({ data, }: { data: IDataInvestasiBursa; }) {
const router = useRouter();
return (
<>
<ComponentGlobal_CardStyles
onClickHandler={() => {
router.push(NEW_RouterInvestasi.detail_portofolio({ id: data.id }), { scroll: false });
}}
>
<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}>
<ComponentGlobal_LoadImageCustom
fileId={data.imageId}
height={80}
/>
</Grid.Col>
</Grid>
</ComponentGlobal_CardStyles>
</>
);
}

View File

@@ -0,0 +1,89 @@
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { ComponentGlobal_CardLoadingOverlay, ComponentGlobal_LoadImageCustom, } from "@/app_modules/_global/component";
import { Box, Grid, Group, Stack, Text } from "@mantine/core";
import { IconChecklist, IconCircleCheck } from "@tabler/icons-react";
import _ from "lodash";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { IDataInvestasiBursa } from "../../_lib/type_investasi";
import { Investasi_ComponentStylesCard } from "../comp_card_border_and_background";
export function Investasi_ComponentCardPortofolioPublishNew({ data }: { data: IDataInvestasiBursa; }) {
const router = useRouter();
const [visible, setVisible] = useState(false);
return (
<>
<Investasi_ComponentStylesCard
marginBottom={"15px"}
onClickHandler={() => {
router.push(NEW_RouterInvestasi.detail_main({ id: data?.id }), {
scroll: false,
});
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}>
<ComponentGlobal_LoadImageCustom
height={80}
fileId={data?.imageId}
/>
</Grid.Col>
</Grid>
<Group position="center" mt={"md"}>
{Number(data?.pencarianInvestor) -
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?.pencarianInvestor) -
moment(new Date()).diff(new Date(data?.countDown), "days") <=
0 ? (
<Group>
<IconChecklist />
<Text>Selesai</Text>
</Group>
) : (
<Box>
Sisa Waktu : {}
{Number(data?.pencarianInvestor) -
moment(new Date()).diff(
new Date(data?.countDown),
"days"
)}{" "}
hari
</Box>
)}
</Group>
</Group>
)}
</Group>
{visible && <ComponentGlobal_CardLoadingOverlay />}
</Investasi_ComponentStylesCard>
</>
);
}

View File

@@ -20,5 +20,7 @@ export interface IDataInvestasiBursa {
imageId: string
progress: string
countDown: string
targetDana: string
pencarianInvestor: string
updatedAt: Date
}

View File

@@ -26,6 +26,7 @@ import { Investasi_UiCreateBerita } from "./create/ui_create_berita";
import { Investasi_UiDetailBerita } from "./detail/ui_berita";
import { Investasi_UiEditInvestasiNew } from "./edit/ui_edit_investasi_new";
import { Investasi_ViewBerandaNew } from "../_view/main/view_beranda_new";
import { Investasi_UiPortofolioNew } from "./main/ui_portofolio_new";
export { Investasi_UiProsesPembelian };
export { Investasi_UiMetodePembayaran };
@@ -55,3 +56,4 @@ export { Investasi_UiCreateBerita };
export { Investasi_UiDetailBerita };
export { Investasi_UiEditInvestasiNew }
export { Investasi_ViewBerandaNew }
export { Investasi_UiPortofolioNew }

View File

@@ -0,0 +1,56 @@
"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 { useParams, useRouter } from "next/navigation";
import { Investasi_ViewPortofolioNew } from "../../_view/main/portofolio/view_portofolio_new";
export function Investasi_UiPortofolioNew({ listStatus }: { listStatus: MODEL_NEW_DEFAULT_MASTER[] }) {
const param = useParams<{ id: string }>();
const router = useRouter();
return (
<>
<Tabs
variant="pills"
radius="xl"
defaultValue={param.id}
styles={{
tabsList: {
position: "sticky",
top: 0,
zIndex: 99,
},
}}
value={param.id}
onTabChange={(val: any) => {
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:
param.id === e.id ? MainColor.yellow : AccentColor.blue,
color: param.id === e.id ? "black" : "white",
}}
>
{e.name}
</Tabs.Tab>
))}
</Tabs.List>
<Investasi_ViewPortofolioNew />
</Stack>
</Tabs>
</>
);
}

View File

@@ -0,0 +1,31 @@
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
import { Box, Grid, Skeleton } from "@mantine/core";
export default function SkeletonInvestasiPortofolio() {
return (
<>
{[...Array(4)].map((_, index) => (
<ComponentGlobal_CardStyles key={index}>
<Grid>
<Grid.Col span={7}>
<Box>
{[...Array(3)].map((_, i) => (
<Box key={i} py={5}>
<Grid align="center">
<Grid.Col span={12}>
<Skeleton w={"90%"} h={23} />
</Grid.Col>
</Grid>
</Box>
))}
</Box>
</Grid.Col>
<Grid.Col span={5}>
<Skeleton w={"100%"} height={100} radius="md" />
</Grid.Col>
</Grid>
</ComponentGlobal_CardStyles>
))}
</>
);
}

View File

@@ -0,0 +1,79 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Investasi_ComponentCardPortofolio_NotPublishNew } from "@/app_modules/investasi/_component/main/comp_card_portofolio_not_publish_new";
import { Investasi_ComponentCardPortofolioPublishNew } from "@/app_modules/investasi/_component/main/comp_card_portofolio_publish_new";
import { apiGetAllInvestasi } from "@/app_modules/investasi/_lib/api_interface";
import { IDataInvestasiBursa } from "@/app_modules/investasi/_lib/type_investasi";
import { Box, Center } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useParams } from "next/navigation";
import { useState } from "react";
import SkeletonInvestasiPortofolio from "./skeleton_portofolio";
export function Investasi_ViewPortofolioNew() {
const param = useParams<{ id: string }>();
const [data, setData] = useState<IDataInvestasiBursa[]>([]);
const [activePage, setActivePage] = useState(1);
const [loading, setLoading] = useState(true)
async function getDataInvestasi() {
try {
setLoading(true)
const response = await apiGetAllInvestasi(`?cat=portofolio&status=${param.id}&page=1`)
if (response.success) {
setData(response.data);
}
} catch (error) {
console.error(error);
} finally {
setLoading(false)
}
}
useShallowEffect(() => {
getDataInvestasi()
}, []);
return (
<>
<Box>
{
loading ?
<SkeletonInvestasiPortofolio />
:
_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center>
<ComponentGlobal_Loader size={25} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const pageNew = activePage + 1
const loadData = await apiGetAllInvestasi(`?cat=portofolio&status=${param.id}&page=${pageNew}`)
setActivePage((val) => val + 1);
return loadData;
}}
>
{
param.id == "1" ?
(item) => (<Investasi_ComponentCardPortofolioPublishNew data={item} />)
:
(item) => (<Investasi_ComponentCardPortofolio_NotPublishNew data={item} />)
}
</ScrollOnly>
)
}
</Box>
</>
);
}