Project Collaboration

## feat
- Buat proyek baru
- Tampilan list data pada beranda
- Partisipasi user lain
### No issuee
This commit is contained in:
2024-04-05 15:31:35 +08:00
parent f58a5afff5
commit ed77b569a6
23 changed files with 435 additions and 122 deletions

View File

@@ -6,13 +6,16 @@ import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_gl
import { Card, Center, Title, Stack, Grid, Text } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MODEL_COLLABORATION } from "../../model/interface";
export default function ComponentColab_CardSectionData({
colabId,
path,
data,
}: {
colabId?: any;
path?: any;
data?: MODEL_COLLABORATION;
}) {
const router = useRouter();
@@ -30,7 +33,7 @@ export default function ComponentColab_CardSectionData({
>
<Center px={"md"} mb={"lg"}>
<Title order={5} lineClamp={1}>
Judul Proyek{" "}
{data?.title ? data.title : "Judul Proyek"}
</Title>
</Center>
<Stack spacing={"xs"}>
@@ -44,7 +47,11 @@ export default function ComponentColab_CardSectionData({
<Text fz={"xs"}>:</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text fz={"xs"}>Industri</Text>
<Text fz={"xs"} lineClamp={1}>
{data?.ProjectCollaborationMaster_Industri.name
? data?.ProjectCollaborationMaster_Industri?.name
: "Industri"}
</Text>
</Grid.Col>
</Grid>
@@ -59,7 +66,7 @@ export default function ComponentColab_CardSectionData({
</Grid.Col>
<Grid.Col span={"auto"}>
<Text fz={"xs"} lineClamp={1}>
Lokasi dari proyek{" "}
{data?.lokasi ? data?.lokasi : "Lokasi dari proyek"}
</Text>
</Grid.Col>
</Grid>
@@ -69,10 +76,9 @@ export default function ComponentColab_CardSectionData({
Tujuan proyek
</Text>
<Text lineClamp={3} fz={"xs"}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nam
repudiandae nostrum temporibus velit possimus, voluptate inventore
recusandae hic ipsa praesentium deserunt, fuga asperiores
doloremque amet incidunt explicabo ea eius earum.
{data?.purpose
? data?.purpose
: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores odio nihil in animi expedita, suscipit excepturi pariatur totam esse officiis enim cumque. Quidem, facere aliquam. Sunt laboriosam incidunt iste amet"}
</Text>
</Stack>
</Stack>

View File

@@ -20,13 +20,13 @@ export default function ComponentColab_CardSectionHeaderAuthorName({
authorName?: string;
tglPublish?: Date;
isPembatas?: boolean;
jumlah_partisipan?: number;
jumlah_partisipan?: any[]
}) {
const router = useRouter();
return (
<>
<Card.Section px={"md"} pb={"md"}>
<Card.Section px={"md"}>
<Stack spacing={"xs"}>
<Grid>
<Grid.Col
@@ -60,11 +60,13 @@ export default function ComponentColab_CardSectionHeaderAuthorName({
</Grid.Col>
<Grid.Col span={"content"}>
<Stack justify="center" h={"100%"}>
<Text c={"gray"} fz={"xs"}>
{jumlah_partisipan
? jumlah_partisipan + " " + "partisipan"
: 0 + " " + "partisipan"}
</Text>
{tglPublish ? (
<Text c={"gray"} fz={"xs"}>
{new Intl.DateTimeFormat("id-ID").format(tglPublish)}
</Text>
) : (
""
)}
</Stack>
</Grid.Col>
</Grid>

View File

@@ -0,0 +1,34 @@
"use client";
import { Stack, Divider, Center, Text, Grid, Card } from "@mantine/core";
import { IconUsersGroup } from "@tabler/icons-react";
export default function ComponentColab_JumlahPartisipan({
jumlah,
}: {
jumlah?: any[];
}) {
return (
<>
<Card.Section px={"md"}>
<Stack>
<Divider />
<Center>
<Grid>
<Grid.Col span={"content"}>
<Text c={"gray"} fz={"xs"} fw={"bold"}>
{jumlah?.length ? jumlah?.length : 0}
</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text c={"gray"} fz={"xs"} fw={"bold"}>
Partisipan
</Text>
</Grid.Col>
</Grid>
</Center>
</Stack>
</Card.Section>
</>
);
}

View File

@@ -1,28 +0,0 @@
"use client";
import { Stack, Divider, Center, Text, Grid } from "@mantine/core";
import { IconUsersGroup } from "@tabler/icons-react";
export default function ComponentColab_JumlahPartisipan() {
return (
<>
<Stack>
<Divider />
<Center>
<Grid >
<Grid.Col span={"content"}>
<Text c={"gray"} fz={"xs"} fw={"bold"}>
12
</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text c={"gray"} fz={"xs"} fw={"bold"}>
Partisipan
</Text>
</Grid.Col>
</Grid>
</Center>
</Stack>
</>
);
}

View File

@@ -1,15 +1,20 @@
"use client"
"use client";
import { Stack, Box, Center, Title, Grid, Text } from "@mantine/core";
import ComponentColab_AuthorNameOnHeader from "../header_author_name";
import { MODEL_COLLABORATION } from "../../model/interface";
export default function ComponentColab_DetailData() {
export default function ComponentColab_DetailData({
data,
}: {
data?: MODEL_COLLABORATION;
}) {
return (
<>
<Stack>
<Box>
<Center px={"md"} mb={"lg"} >
<Title order={4}>Judul Proyek </Title>
<Center px={"md"} mb={"lg"}>
<Title order={4}>{data?.title ? data.title : "Judul Proyek"}</Title>
</Center>
<Stack spacing={"sm"}>
<Grid>
@@ -22,7 +27,11 @@ export default function ComponentColab_DetailData() {
<Text fz={"sm"}>:</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text fz={"sm"}>Industri</Text>
<Text fz={"sm"}>
{data?.ProjectCollaborationMaster_Industri.name
? data.ProjectCollaborationMaster_Industri.name
: "Industri"}
</Text>
</Grid.Col>
</Grid>
@@ -37,7 +46,7 @@ export default function ComponentColab_DetailData() {
</Grid.Col>
<Grid.Col span={"auto"}>
<Text fz={"sm"} lineClamp={1}>
Lokasi dari proyek{" "}
{data?.lokasi ? data.lokasi : " Lokasi dari proyek"}
</Text>
</Grid.Col>
</Grid>
@@ -46,22 +55,14 @@ export default function ComponentColab_DetailData() {
<Text fw={"bold"} fz={"sm"}>
Tujuan proyek
</Text>
<Text fz={"sm"}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nam
repudiandae nostrum temporibus velit possimus, voluptate
inventore recusandae hic ipsa praesentium deserunt, fuga
asperiores doloremque amet incidunt explicabo ea eius earum.
</Text>
<Text fz={"sm"}>{data?.purpose ? data?.purpose : "-"}</Text>
</Stack>
<Stack spacing={5}>
<Text fw={"bold"} fz={"sm"}>
Keutungan
</Text>
<Text fz={"sm"}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nam
repudiandae nostrum temporibus velit possimus, voluptate
inventore recusandae hic ipsa praesentium deserunt, fuga
asperiores doloremque amet incidunt explicabo ea eius earum.
{data?.benefit ? data?.benefit : "-"}
</Text>
</Stack>
</Stack>
@@ -69,4 +70,4 @@ export default function ComponentColab_DetailData() {
</Stack>
</>
);
}
}

View File

@@ -1,29 +1,113 @@
"use client"
"use client";
import { Paper, Center, Title, ScrollArea, Box, Stack } from "@mantine/core";
import {
Paper,
Center,
Title,
ScrollArea,
Box,
Stack,
Text,
Divider,
Button,
} from "@mantine/core";
import ComponentColab_AuthorNameOnHeader from "../header_author_name";
import {
MODEL_COLLABORATION_MASTER,
MODEL_COLLABORATION_PARTISIPASI,
} from "../../model/interface";
import _ from "lodash";
import { useState } from "react";
import colab_funCreatePartisipan from "../../fun/create/fun_create_partisipan_by_user_id";
import colab_getListPartisipanById from "../../fun/get/get_list_partisipan_by_id";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/component_global/notif_global/notifikasi_gagal";
export default function ComponentColab_DetailListPartisipasiUser({
listPartisipan,
userLoginId,
authorId,
colabId,
cekPartisipan,
}: {
listPartisipan?: MODEL_COLLABORATION_PARTISIPASI[];
userLoginId?: string;
authorId?: string;
colabId?: string;
cekPartisipan?: boolean;
}) {
const [apply, setApply] = useState(false);
const [data, setData] = useState(listPartisipan);
async function onJoin() {
await colab_funCreatePartisipan(colabId as any, userLoginId as any).then(
async (res) => {
if (res.status === 201) {
await colab_getListPartisipanById(colabId as any).then((val) => {
setApply(true);
setData(val as any);
ComponentGlobal_NotifikasiBerhasil(res.message);
});
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
}
);
}
export default function ComponentColab_DetailListPartisipasiUser() {
return (
<>
<Paper withBorder p={"md"}>
<Center mb={"xl"}>
<Title order={4}>Partispasi User (12)</Title>
</Center>{" "}
<ScrollArea h={400}>
<Box h={400}>
<Stack>
{Array(10)
.fill(0)
.map((e, i) => (
<Box key={i}>
<ComponentColab_AuthorNameOnHeader isPembatas={true} />
</Box>
))}
</Stack>
</Box>
</ScrollArea>
</Paper>
{/* <pre>{JSON.stringify(data, null, 2)}</pre> */}
<Stack>
{userLoginId !== authorId ? (
<Center>
<Button
radius={"xl"}
disabled={cekPartisipan ? true : false}
color={cekPartisipan ? "green" : "blue"}
onClick={() => {
onJoin();
}}
>
{cekPartisipan ? "Telah Berpartisipasi" : "Partisipasi"}
</Button>
</Center>
) : (
""
)}
<Paper withBorder p={"md"}>
<Stack spacing={"xl"}>
<Center>
<Title order={5}>Partispasi User ({data?.length})</Title>
</Center>{" "}
<ScrollArea h={data?.length === 0 ? 30 : 400}>
<Box>
<Stack>
{data?.length === 0 ? (
<Center>
<Text fz={"xs"} fw={"bold"} c={"gray"}>
Tidak ada partisipan
</Text>
</Center>
) : (
data?.map((e, i) => (
<Box key={i}>
<ComponentColab_AuthorNameOnHeader
isPembatas={true}
authorName={e?.User.Profile.name}
imagesId={e?.User?.Profile?.imagesId}
profileId={e?.User?.Profile?.id}
/>
</Box>
))
)}
</Stack>
</Box>
</ScrollArea>
</Stack>
</Paper>
</Stack>
</>
);
}
}