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

# feat:

Browse Source 
- Deskripsi:
- Notifikasi collaboration
## Issue: Scroll dari chat akan di ubah dengan package yang mas malik buat
This commit is contained in:
Bagasbanuna02
2024-07-29 10:07:52 +08:00
parent 01114e8405
commit 810ce1c00d
42 changed files with 892 additions and 997 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/app_modules/investasi/create/layout.tsx
View File

@@ -2,6 +2,8 @@
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import ComponentGlobal_HeaderTamplate from "@/app_modules/_global/header_tamplate";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { AppShell } from "@mantine/core";
import React from "react";
@@ -12,13 +14,11 @@ export default function InvestasiCreateLayout({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={
<ComponentGlobal_HeaderTamplate title="Investasi Baru" />
}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Investasi Baru" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

64
src/app_modules/investasi/detail/layout.tsx
View File

@@ -1,18 +1,11 @@
"use client";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import ComponentGlobal_HeaderTamplate from "@/app_modules/_global/header_tamplate";
import {
ActionIcon,
AppShell,
Group,
Header,
Text,
Title,
} from "@mantine/core";
import { IconArrowLeft, IconChevronLeft, IconEdit } from "@tabler/icons-react";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ActionIcon, Group, Header, Title } from "@mantine/core";
import { IconChevronLeft } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { title } from "process";
import React from "react";
export default function LayoutDetailInvestasi({
@@ -23,34 +16,35 @@ export default function LayoutDetailInvestasi({
const router = useRouter();
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<Header height={50} style={{ borderStyle: "none" }}>
<Group h={50} position="apart" px={"md"}>
<ActionIcon
variant="transparent"
onClick={() => {
router.back();
}}
>
<IconChevronLeft />
</ActionIcon>
<Title order={5}>Detail Investasi</Title>
<ActionIcon
variant="transparent"
disabled
onClick={() => {
router.replace("");
}}
>
{/* <IconEdit /> */}
</ActionIcon>
</Group>
</Header>
<UIGlobal_LayoutHeaderTamplate title="Detail" />
// <Header height={50} style={{ borderStyle: "none" }}>
// <Group h={50} position="apart" px={"md"}>
// <ActionIcon
// variant="transparent"
// onClick={() => {
// router.back();
// }}
// >
// <IconChevronLeft />
// </ActionIcon>
// <Title order={5}>Detail Investasi</Title>
// <ActionIcon
// variant="transparent"
// disabled
// onClick={() => {
// router.replace("");
// }}
// >
// {/* <IconEdit /> */}
// </ActionIcon>
// </Group>
// </Header>
}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

28
src/app_modules/investasi/detail/view.tsx
View File

@@ -2,10 +2,11 @@
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { MODEL_PROFILE_OLD } from "@/app_modules/home/model/user_profile";
import {
ActionIcon,
AspectRatio,
Avatar,
Box,
Button,
Center,
@@ -15,10 +16,9 @@ import {
Image,
Paper,
Progress,
Slider,
Stack,
Text,
Title,
Title
} from "@mantine/core";
import {
IconBookDownload,
@@ -27,16 +27,13 @@ import {
IconSpeakerphone,
IconXboxX,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MODEL_Investasi } from "../model/model_investasi";
import moment from "moment";
import { MODEL_PROFILE_OLD } from "@/app_modules/home/model/user_profile";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { gs_TransferValue } from "../g_state";
import { useAtom } from "jotai";
import _ from "lodash";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { MODEL_Investasi } from "../model/model_investasi";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
export default function DetailInvestasi({
dataInvestasi,
@@ -92,7 +89,16 @@ export default function DetailInvestasi({
return (
<>
<Box px={"sm"}>
<Box
style={{
padding: "15px",
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
marginBottom: "15px",
}}
>
{/* Foto username dan sisa waktu */}
<Group position="apart" mb={"md"}>
{/* <pre>{JSON.stringify(dataUser, null, 2)}</pre> */}

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

@@ -1,14 +1,15 @@
"use client";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import ComponentGlobal_HeaderTamplate from "@/app_modules/_global/header_tamplate";
import {
ActionIcon,
AppShell,
Center,
Flex,
Footer,
Grid,
Group,
SimpleGrid,
Stack,
Text,
} from "@mantine/core";
@@ -16,17 +17,18 @@ 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 React from "react";
import { gs_investasiFooter } from "../g_state";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { RouterCrowd } from "@/app/lib/router_hipmi/router_crowd";
export default function LayoutMainInvestasi({
children,
@@ -65,49 +67,79 @@ export default function LayoutMainInvestasi({
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<ComponentGlobal_HeaderTamplate
route="/dev/crowd/main"
<UIGlobal_LayoutHeaderTamplate
routerLeft={RouterCrowd.main}
title="Investasi"
// icon={<IconPencilPlus />}
// route2={"/dev/investasi/create"}
/>
}
footer={
<Footer height={"10vh"} bg={"black"}>
<Grid align="center" h={"10vh"} pt={"xs"} grow>
{/* Tampilan Bursa */}
{listFooter.map((e, k) => (
<Grid.Col
key={e.id}
span={3}
onClick={() => {
router.push(e.route);
setActive(k);
}}
<SimpleGrid cols={listFooter.length} h={"9vh"} mx={"xs"}>
{listFooter.map((e, i) => (
<Stack key={i} align="center" justify="center" spacing={0}>
<ActionIcon
// disabled={e.path === "" ? true : false}
variant="transparent"
c={active === i ? MainColor.yellow : "white"}
onClick={
() => {
router.push(e.route);
setActive(i);
}
// e.route === ""
// ? ComponentGlobal_NotifikasiPeringatan("Cooming Soon")
// : (router.replace(e.route), setActive(i))
}
>
<Center h={"100%"}>
<Flex direction={"column"} align={"center"} w={"100%"}>
<ActionIcon
variant="transparent"
c={active === k ? "blue" : "white"}
>
{e.icon}
</ActionIcon>
<Text c={active === k ? "blue" : "white"} fz={"xs"}>
{e.name}
</Text>
</Flex>
</Center>
</Grid.Col>
))}
</Grid>
</Footer>
{e.icon}
</ActionIcon>
<Text
c={active === i ? MainColor.yellow : "white"}
fz={"xs"}
lineClamp={1}
>
{e.name}
</Text>
</Stack>
))}
</SimpleGrid>
// <Footer height={"10vh"} bg={"black"}>
// <Grid align="center" h={"10vh"} pt={"xs"} grow>
// {listFooter.map((e, k) => (
// <Grid.Col
// key={e.id}
// span={3}
// onClick={() => {
// router.push(e.route);
// setActive(k);
// }}
// >
// <Center h={"100%"}>
// <Flex direction={"column"} align={"center"} w={"100%"}>
// <ActionIcon
// variant="transparent"
// c={active === k ? "blue" : "white"}
// >
// {e.icon}
// </ActionIcon>
// <Text c={active === k ? "blue" : "white"} fz={"xs"}>
// {e.name}
// </Text>
// </Flex>
// </Center>
// </Grid.Col>
// ))}
// </Grid>
// </Footer>
}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

56
src/app_modules/investasi/main/view.tsx
View File

@@ -1,47 +1,42 @@
"use client";
import { ApiHipmi } from "@/app/lib/api";
import { MODEL_DEFAULT_MASTER_OLD } from "@/app_modules/model_global/model_default_master";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import {
ActionIcon,
Affix,
AspectRatio,
Badge,
Box,
Button,
Card,
CardSection,
Center,
Divider,
Flex,
Grid,
Group,
Image,
Paper,
Progress,
Slider,
Stack,
Text,
Title,
rem,
} from "@mantine/core";
import { useRouter } from "next/navigation";
import dataDummy from "../dummy/data_dummy.json";
import moment from "moment";
import { useWindowScroll } from "@mantine/hooks";
import {
IconCheck,
IconCircleCheck,
IconPencilPlus,
IconXboxX,
} from "@tabler/icons-react";
import { MODEL_Investasi } from "../model/model_investasi";
import _ from "lodash";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { useShallowEffect, useWindowScroll } from "@mantine/hooks";
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna";
import ComponentInvestasi_IsEmptyData from "../component/is_empty_data";
import { RouterJob } from "@/app/lib/router_hipmi/router_job";
import { MODEL_Investasi } from "../model/model_investasi";
import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
export default function MainInvestasi({
listData,
@@ -66,7 +61,7 @@ export default function MainInvestasi({
return (
<>
<Affix position={{ bottom: rem(150), right: rem(30) }}>
{/* <Affix position={{ bottom: rem(150), right: rem(30) }}>
<ActionIcon
loading={isLoading ? true : false}
opacity={scroll.y > 0 ? 0.5 : ""}
@@ -84,20 +79,29 @@ export default function MainInvestasi({
>
<IconPencilPlus color="white" />
</ActionIcon>
</Affix>
</Affix> */}
<ComponentGlobal_CreateButton path={RouterInvestasi.create} />
{_.isEmpty(investasi) && _.isEmpty(invesDone) && _.isEmpty(invesFail) ? (
<ComponentInvestasi_IsEmptyData text="Tidak ada data" />
<ComponentGlobal_IsEmptyData />
) : (
investasi.map((e) => (
<Card
// sx={{ borderStyle: "solid", borderColor: "black", borderWidth: "0.5px" }}
radius={"sm"}
key={e.id}
mb={"lg"}
withBorder
p={"xl"}
shadow="lg"
style={{
padding: "15px",
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
marginBottom: "15px",
marginInline: "15px",
}}
onClick={() => {
setLoadingDetail(true);
router.push(RouterInvestasi.detail + `${e.id}`);
}}
>
<CardSection>
<AspectRatio ratio={16 / 9}>
@@ -176,8 +180,8 @@ export default function MainInvestasi({
</CardSection>
<Divider color="gray.4" />
<CardSection p={"md"}>
<Group position="apart">
<Button
<Group position="right">
{/* <Button
loaderPosition="center"
loading={isLoadingDetail ? true : false}
radius={"xl"}
@@ -190,7 +194,7 @@ export default function MainInvestasi({
}}
>
Detail
</Button>
</Button> */}
{e.progress === "100" ? (
<Group position="right" spacing={"xs"}>

16
src/app_modules/investasi/portofolio/draft.tsx
View File

@@ -20,6 +20,8 @@ import { useRouter } from "next/navigation";
import { MODEL_Investasi } from "../model/model_investasi";
import _ from "lodash";
import ComponentInvestasi_IsEmptyData from "../component/is_empty_data";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
export default function Draft({ data }: { data: MODEL_Investasi[] }) {
const router = useRouter();
@@ -28,7 +30,7 @@ export default function Draft({ data }: { data: MODEL_Investasi[] }) {
if (_.isEmpty(data))
return (
<>
<ComponentInvestasi_IsEmptyData text="Tidak ada data" />
<ComponentGlobal_IsEmptyData />
</>
);
@@ -37,12 +39,16 @@ export default function Draft({ data }: { data: MODEL_Investasi[] }) {
{/* <pre> {JSON.stringify(data,null, 2)}</pre> */}
{data.map((e) => (
<Paper
// sx={{ borderStyle: "solid", borderColor: "yellow", borderWidth: "0.5px" }}
p={"xs"}
key={e.id}
mb={"md"}
withBorder
onClick={() => router.push(RouterInvestasi.detail_draft + `${e.id}`)}
style={{
padding: "15px",
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
marginBottom: "15px",
}}
>
<Grid>
<Grid.Col span={8}>

46
src/app_modules/investasi/portofolio/publish.tsx
View File

@@ -1,31 +1,24 @@
import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import {
Card,
CardSection,
AspectRatio,
Box,
Title,
Slider,
Divider,
Group,
Badge,
Image,
Text,
Center,
Grid,
Stack,
Group,
Image,
Paper,
Stack,
Text,
} from "@mantine/core";
import { useRouter } from "next/navigation";
import {
MODEL_Investasi,
MODEL_Status_investasi,
} from "../model/model_investasi";
import { IconChecklist, IconCircleCheck } from "@tabler/icons-react";
import _ from "lodash";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { IconChecklist, IconCircleCheck } from "@tabler/icons-react";
import ComponentInvestasi_IsEmptyData from "../component/is_empty_data";
import { MODEL_Investasi } from "../model/model_investasi";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
export default function Publish({ data }: { data: MODEL_Investasi[] }) {
const router = useRouter();
@@ -34,7 +27,7 @@ export default function Publish({ data }: { data: MODEL_Investasi[] }) {
if (_.isEmpty(data))
return (
<>
<ComponentInvestasi_IsEmptyData text="Tidak ada data" />
<ComponentGlobal_IsEmptyData />
</>
);
@@ -43,12 +36,17 @@ export default function Publish({ data }: { data: MODEL_Investasi[] }) {
{data.map((e) => (
<Paper
key={e.id}
withBorder
mb={"md"}
p={"xs"}
onClick={() =>
router.push(RouterInvestasi.detail_publish + `${e.id}`)
}
style={{
padding: "15px",
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
marginBottom: "15px",
}}
>
<Grid>
<Grid.Col span={8}>
@@ -101,9 +99,13 @@ export default function Publish({ data }: { data: MODEL_Investasi[] }) {
<Box>
Sisa Waktu : {}
{Number(e.MasterPencarianInvestor.name) -
moment(new Date()).diff(new Date(e.countDown), "days")} hari
moment(new Date()).diff(
new Date(e.countDown),
"days"
)}{" "}
hari
</Box>
)}
)}
</Group>
</Group>
)}

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

@@ -1,60 +1,23 @@
"use client";
import {
AspectRatio,
Avatar,
Badge,
Box,
Button,
Card,
CardSection,
Collapse,
Divider,
Flex,
Grid,
Group,
Image,
Paper,
ScrollArea,
Select,
Slider,
Stack,
Tabs,
Text,
Title,
Tabs
} from "@mantine/core";
import dataDummy from "../dummy/data_dummy.json";
import moment from "moment";
import { useRouter } from "next/navigation";
import {
IconCaretDown,
IconCircleCheck,
IconCirclePlus,
} from "@tabler/icons-react";
import { useState } from "react";
import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
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 "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
import { gs_StatusPortoInvestasi } from "../g_state";
import {
MODEL_Investasi,
MODEL_Status_investasi,
MODEL_Status_investasi
} from "../model/model_investasi";
import _ from "lodash";
import Draft from "./draft";
import Review from "./review";
import Publish from "./publish";
import Reject from "./reject";
import Review from "./review";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
export default function PortofolioInvestasi({
listStatusInvestasi,
@@ -77,60 +40,59 @@ export default function PortofolioInvestasi({
return (
<>
{/* <pre>{JSON.stringify(dataInvestasi, null, 2)}</pre> */}
<Stack>
{/* <Button
radius={"xl"}
bg={Warna.hijau_muda}
color="green"
leftIcon={<IconCirclePlus />}
onClick={() => router.push(RouterInvestasi.create)}
>
Buat Proyek Invetasi
</Button> */}
<Tabs
variant="pills"
radius="xl"
defaultValue="Draft"
value={activeTab}
onTabChange={setActiveTab}
>
<Stack>
<Tabs.List grow>
{status_inves.map((e) => (
<Tabs.Tab
sx={
<Tabs
color="orange"
variant="pills"
radius="xl"
defaultValue="Draft"
value={activeTab}
onTabChange={setActiveTab}
styles={{
tabsList: {
backgroundColor: MainColor.darkblue,
position: "sticky",
top: 0,
zIndex: 99,
},
}}
>
<Stack>
<Tabs.List grow>
{status_inves.map((e) => (
<Tabs.Tab
key={e.id}
value={e.name}
fw={"bold"}
c={"black"}
style={{
transition: "0.5s",
backgroundColor:
activeTab === e.name ? MainColor.yellow : "white",
border:
activeTab === e.name
? {
boxShadow:
"0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 6px 0 rgba(0, 0, 0, 0.2)",
}
: {}
}
key={e.id}
value={e.name}
bg={activeTab === e.name ? "blue" : "gray.1"}
fw={activeTab === e.name ? "bold" : "normal"}
>
{e.name}
</Tabs.Tab>
))}
</Tabs.List>
? `1px solid ${AccentColor.yellow}`
: `1px solid white`,
}}
>
{e.name}
</Tabs.Tab>
))}
</Tabs.List>
<Tabs.Panel key={"1"} value="Draft">
<Draft data={dataDraft as any} />
</Tabs.Panel>
<Tabs.Panel key={"2"} value="Review">
<Review data={dataReview as any} />
</Tabs.Panel>
<Tabs.Panel key={"3"} value="Publish">
<Publish data={dataPublish as any} />
</Tabs.Panel>
<Tabs.Panel key={"4"} value="Reject">
<Reject data={dataReject as any} />
</Tabs.Panel>
</Stack>
</Tabs>
</Stack>
<Tabs.Panel key={"1"} value="Draft">
<Draft data={dataDraft as any} />
</Tabs.Panel>
<Tabs.Panel key={"2"} value="Review">
<Review data={dataReview as any} />
</Tabs.Panel>
<Tabs.Panel key={"3"} value="Publish">
<Publish data={dataPublish as any} />
</Tabs.Panel>
<Tabs.Panel key={"4"} value="Reject">
<Reject data={dataReject as any} />
</Tabs.Panel>
</Stack>
</Tabs>
</>
);
}