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

# Event Join

Browse Source 
## feat
- Join event
- kontribusi event
- histoty in progress
### No Issue
This commit is contained in:
Bagasbanuna02
2024-01-29 22:03:27 +08:00
parent bec87028fd
commit ca9214d9e0
109 changed files with 2932 additions and 515 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/app_modules/event/main/beranda.tsx
View File

@@ -4,62 +4,70 @@ import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import {
Avatar,
Badge,
Box,
Button,
Card,
Center,
Divider,
Grid,
Group,
Image,
Paper,
Skeleton,
Stack,
Text,
Title,
} from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MODEL_EVENT } from "../model/interface";
import ComponentEvent_BoxListStatus from "../component/box_list_status";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/component_global/author_name_on_header";
export default function Event_Beranda() {
export default function Event_Beranda({
dataEvent,
}: {
dataEvent: MODEL_EVENT[];
}) {
const router = useRouter();
return (
<>
{Array(5)
.fill(0)
.map((e, i) => (
<Card
key={i}
shadow="sm"
padding="md"
radius="md"
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_main)}
{dataEvent.map((e, i) => (
<Card key={e.id} shadow="lg" radius={"md"} withBorder mb={"sm"}>
<Card.Section px={"sm"} pt={"sm"}>
<ComponentGlobal_AuthorNameOnHeader
profileId={e.Author.Profile.id}
imagesId={e.Author.Profile.imagesId}
authorName={e.Author.Profile.name}
/>
</Card.Section>
<Card.Section
p={"sm"}
onClick={() => router.push(RouterEvent.detail_main + e.id)}
>
{/* <Card.Section p={"xs"}>
<Skeleton visible={loading} h={200}></Skeleton>
</Card.Section> */}
<Stack>
<Group position="apart" mt="md" mb="xs">
<Text weight={500}>Nama Event</Text>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Grid>
<Grid.Col span={8}>
<Title order={6} truncate>
{e.title}
</Title>
</Grid.Col>
<Grid.Col span={4}>
<Text fz={"sm"} truncate>
{moment(e.tanggal).format("ll")}
</Text>
</Grid.Col>
</Grid>
<Text size="sm" color="dimmed" lineClamp={2}>
Deskripsi: Lorem ipsum dolor sit amet consectetur adipisicing
elit. Nisi non ducimus voluptatibus vel, officiis assumenda
explicabo reiciendis consequatur consequuntur expedita maiores
fugit natus est rem sapiente iusto earum dicta labore.
<Text fz={"sm"} lineClamp={2}>
{e.deskripsi}
</Text>
{/* <Group position="apart">
{Array(6)
.fill(0)
.map((e, i) => (
<Avatar key={i} bg="blue" radius={"xl"} />
))}
</Group> */}
</Stack>
</Card>
))}
</Card.Section>
</Card>
))}
</>
);
}

8
src/app_modules/event/main/history/index.tsx Normal file
View File

@@ -0,0 +1,8 @@
"use client"
export default function Event_History(){
return<>
ini history
</>
}

99
src/app_modules/event/main/kontribusi/index.tsx
View File

@@ -1,14 +1,32 @@
"use client";
import { Avatar, Box, Card, Group, Stack, Tabs, Text } from "@mantine/core";
import {
Avatar,
Box,
Card,
Flex,
Grid,
Group,
Stack,
Tabs,
Text,
Title,
} from "@mantine/core";
import { useState } from "react";
import Event_KontribusiPanitia from "./panitia";
import Event_KontribusiPeserta from "./peserta";
import moment from "moment";
import { useRouter } from "next/navigation";
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { MODEL_EVENT_PESERTA } from "../../model/interface";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/component_global/author_name_on_header";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
export default function Event_Kontribusi() {
export default function Event_Kontribusi({
listKontribusi,
}: {
listKontribusi: MODEL_EVENT_PESERTA[];
}) {
const router = useRouter();
const [tabsKontribusi, setTabsKontribusi] = useState<string | any>("Panitia");
const listTabs = [
@@ -26,45 +44,56 @@ export default function Event_Kontribusi() {
return (
<>
{Array(5)
.fill(0)
.map((e, i) => (
<Card
key={i}
shadow="sm"
padding="md"
radius="md"
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_kontribusi)}
{/* <pre>{JSON.stringify(listKontribusi, null,2)}</pre> */}
{listKontribusi.map((e, i) => (
<Card key={e.id} shadow="lg" radius={"md"} withBorder mb={"sm"}>
<Card.Section px={"sm"} pt={"sm"}>
<ComponentGlobal_AuthorNameOnHeader
profileId={e.Event.Author.Profile.id}
imagesId={e.Event.Author.Profile.imagesId}
authorName={e.Event.Author.Profile.name}
/>
</Card.Section>
<Card.Section
p={"sm"}
onClick={() => router.push(RouterEvent.detail_kontribusi + e.Event.id)}
>
{/* <Card.Section p={"xs"}>
<Skeleton visible={loading} h={200}></Skeleton>
</Card.Section> */}
<Stack>
<Group position="apart" mt="md" mb="xs">
<Text weight={500}>Nama Event</Text>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Grid>
<Grid.Col span={8}>
<Title order={6} truncate>
{e.Event.title}
</Title>
</Grid.Col>
<Grid.Col span={4}>
<Text fz={"sm"} truncate>
{moment(e.Event.tanggal).format("ll")}
</Text>
</Grid.Col>
</Grid>
{/* <Text size="sm" color="dimmed" lineClamp={2}>
Deskripsi: Lorem ipsum dolor sit amet consectetur adipisicing
elit. Nisi non ducimus voluptatibus vel, officiis assumenda
explicabo reiciendis consequatur consequuntur expedita maiores
fugit natus est rem sapiente iusto earum dicta labore.
</Text> */}
{/* <Text fz={"sm"} lineClamp={2}>
{e.Event.deskripsi}
</Text> */}
<Group position="apart">
{Array(6)
.fill(0)
.map((e, i) => (
<Avatar key={i} bg="blue" radius={"xl"} />
))}
<Group position="center">
{e.Event.Event_Peserta.map((val) => (
<Box key={val.id}>
<Avatar
size={"lg"}
radius={"xl"}
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
src={
RouterProfile.api_foto_profile + val.User.Profile.imagesId
}
/>
</Box>
))}
</Group>
</Stack>
</Card>
))}
</Card.Section>
</Card>
))}
</>
);

35
src/app_modules/event/main/layout.tsx
View File

@@ -16,6 +16,8 @@ import ComponentEvent_HeaderTamplate from "../component/header_tamplate";
import {
IconCalendarEvent,
IconCirclePlus,
IconHistory,
IconHome,
IconTimelineEvent,
IconTimelineEventText,
} from "@tabler/icons-react";
@@ -36,12 +38,12 @@ export default function LayoutEvent_Main({
id: "1",
name: "Beranda",
path: RouterEvent.beranda,
icon: <IconTimelineEvent />,
icon: <IconHome />,
},
{
id: "2",
name: "Status event",
name: "Status Event",
path: RouterEvent.status_page,
icon: <IconTimelineEventText />,
},
@@ -51,28 +53,24 @@ export default function LayoutEvent_Main({
path: RouterEvent.kontribusi,
icon: <IconCalendarEvent />,
},
{
id: "4",
name: "History",
path: RouterEvent.history,
icon: <IconHistory />,
}
];
return (
<>
<AppShell
header={<ComponentEvent_HeaderTamplate title="Event" route={RouterHome.main_home}/>}
header={
<ComponentEvent_HeaderTamplate
title="Event"
route={RouterHome.main_home}
/>
}
footer={
<Footer height={70} bg={"dark"} sx={{ borderTop: "px solid blue" }}>
{/* <Center>
<ActionIcon
sx={{
zIndex: 1,
position: "absolute",
}}
variant="transparent"
bg={"blue"}
radius={"xl"}
size={"lg"}
onClick={() => router.push(RouterEvent.create)}
>
<IconCirclePlus color="white" size={30} />
</ActionIcon>
</Center> */}
<Grid>
{listFooter.map((e, i) => (
<Grid.Col
@@ -82,7 +80,6 @@ export default function LayoutEvent_Main({
onClick={() => {
router.replace(e.path);
setHotMenu(i);
}}
>
<Center>

49
src/app_modules/event/main/status_page/draft.tsx
View File

@@ -1,39 +1,34 @@
"use client";
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { Group, Paper, Stack, Text, Title } from "@mantine/core";
import { Box, Center, Group, Paper, Stack, Text, Title } from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_EVENT } from "../../model/interface";
import { useState } from "react";
import ComponentEvent_BoxListStatus from "../../component/box_list_status";
import _ from "lodash";
export default function Event_StatusDraft() {
const router = useRouter()
export default function Event_StatusDraft({
listDraft,
}: {
listDraft: MODEL_EVENT[];
}) {
const router = useRouter();
if (_.isEmpty(listDraft))
return (
<Center h={"50vh"} fz={"sm"} fw={"bold"}>
Tidak Ada Event
</Center>
);
return (
<>
{Array(5)
.fill(0)
{listDraft
.map((e, i) => (
<Paper
key={i}
shadow="lg"
radius={"md"}
p={"md"}
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_draft)}
>
<Stack>
<Group position="apart">
<Title order={6}>Nama Event</Title>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Text fz={"sm"} lineClamp={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam
velit modi ut consequatur, iure eaque numquam id iste, nihil
laborum facilis dolores vel possimus earum ullam, necessitatibus
omnis tenetur repellendus.
</Text>
</Stack>
</Paper>
<Box key={e.id}>
<ComponentEvent_BoxListStatus data={e} path={RouterEvent.detail_draft}/>
</Box>
))}
</>
);

22
src/app_modules/event/main/status_page/index.tsx
View File

@@ -11,29 +11,40 @@ import Event_StatusPublish from "./publish";
import Event_StatusReview from "./review";
import Event_StatusDraft from "./draft";
import Event_StatusReject from "./reject";
import { MODEL_EVENT } from "../../model/interface";
export default function Event_StatusPage() {
export default function Event_StatusPage({
listPublish,
listReview,
listDraft,
listReject,
}: {
listPublish: any;
listReview: any;
listDraft: any;
listReject: any;
}) {
const router = useRouter();
const [tabsStatus, setTabsStatus] = useAtom(gs_event_status);
const listTabs = [
{
id: 1,
path: <Event_StatusPublish/>,
path: <Event_StatusPublish listPublish={listPublish} />,
value: "Publish",
},
{
id: 2,
path: <Event_StatusReview/>,
path: <Event_StatusReview listReview={listReview} />,
value: "Review",
},
{
id: 3,
path: <Event_StatusDraft/>,
path: <Event_StatusDraft listDraft={listDraft} />,
value: "Draft",
},
{
id: 4,
path: <Event_StatusReject/>,
path: <Event_StatusReject listReject={listReject} />,
value: "Reject",
},
];
@@ -65,6 +76,7 @@ export default function Event_StatusPage() {
key={e.id}
value={e.value}
bg={tabsStatus === e.value ? "blue" : "gray.1"}
fw={tabsStatus === e.value ? "bold" : "normal"}
>
{e.value}
</Tabs.Tab>

48
src/app_modules/event/main/status_page/publish.tsx
View File

@@ -1,39 +1,35 @@
"use client";
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { Group, Paper, Stack, Text, Title } from "@mantine/core";
import { Box, Center, Group, Paper, Stack, Text, Title } from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_EVENT } from "../../model/interface";
import ComponentEvent_BoxListStatus from "../../component/box_list_status";
import _ from "lodash";
export default function Event_StatusPublish() {
export default function Event_StatusPublish({
listPublish,
}: {
listPublish: MODEL_EVENT[];
}) {
const router = useRouter();
if (_.isEmpty(listPublish))
return (
<Center h={"50vh"} fz={"sm"} fw={"bold"}>
Tidak Ada Event
</Center>
);
return (
<>
{Array(5)
.fill(0)
{listPublish
.map((e, i) => (
<Paper
key={i}
shadow="lg"
radius={"md"}
p={"md"}
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_publish)}
>
<Stack>
<Group position="apart">
<Title order={6}>Nama Event</Title>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Text fz={"sm"} lineClamp={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam
velit modi ut consequatur, iure eaque numquam id iste, nihil
laborum facilis dolores vel possimus earum ullam, necessitatibus
omnis tenetur repellendus.
</Text>
</Stack>
</Paper>
<Box key={e.id}>
<ComponentEvent_BoxListStatus data={e} path={RouterEvent.detail_publish}/>
</Box>
))}
</>
);

53
src/app_modules/event/main/status_page/reject.tsx
View File

@@ -1,40 +1,35 @@
"use client";
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { Group, Paper, Stack, Text, Title } from "@mantine/core";
import { Box, Center, Group, Paper, Stack, Text, Title } from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_EVENT } from "../../model/interface";
import ComponentEvent_BoxListStatus from "../../component/box_list_status";
import _ from "lodash";
export default function Event_StatusReject() {
const router = useRouter()
export default function Event_StatusReject({
listReject,
}: {
listReject: MODEL_EVENT[];
}) {
const router = useRouter();
if (_.isEmpty(listReject))
return (
<Center h={"50vh"} fz={"sm"} fw={"bold"}>
Tidak Ada Event
</Center>
);
return (
<>
{Array(5)
.fill(0)
.map((e, i) => (
<Paper
key={i}
shadow="lg"
radius={"md"}
p={"md"}
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_reject)}
>
<Stack>
<Group position="apart">
<Title order={6}>Nama Event</Title>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Text fz={"sm"} lineClamp={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam
velit modi ut consequatur, iure eaque numquam id iste, nihil
laborum facilis dolores vel possimus earum ullam, necessitatibus
omnis tenetur repellendus.
</Text>
</Stack>
</Paper>
))}
{listReject.map((e, i) => (
<Box key={e.id}>
<ComponentEvent_BoxListStatus
data={e}
path={RouterEvent.detail_reject}
/>
</Box>
))}
</>
);
}

55
src/app_modules/event/main/status_page/review.tsx
View File

@@ -1,40 +1,37 @@
"use client";
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { Group, Paper, Stack, Text, Title } from "@mantine/core";
import { Box, Center, Group, Paper, Stack, Text, Title } from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_EVENT } from "../../model/interface";
import { useState } from "react";
import ComponentEvent_BoxListStatus from "../../component/box_list_status";
import _ from "lodash";
export default function Event_StatusReview() {
const router = useRouter()
export default function Event_StatusReview({
listReview,
}: {
listReview: MODEL_EVENT[];
}) {
const router = useRouter();
if (_.isEmpty(listReview))
return (
<Center h={"50vh"} fz={"sm"} fw={"bold"}>
Tidak Ada Event
</Center>
);
return (
<>
{Array(5)
.fill(0)
.map((e, i) => (
<Paper
key={i}
shadow="lg"
radius={"md"}
p={"md"}
withBorder
mb={"md"}
onClick={() => router.push(RouterEvent.detail_review)}
>
<Stack>
<Group position="apart">
<Title order={6}>Nama Event</Title>
<Text fz={"sm"}>{moment(new Date()).format("ll")}</Text>
</Group>
<Text fz={"sm"} lineClamp={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam
velit modi ut consequatur, iure eaque numquam id iste, nihil
laborum facilis dolores vel possimus earum ullam, necessitatibus
omnis tenetur repellendus.
</Text>
</Stack>
</Paper>
))}
{listReview.map((e, i) => (
<Box key={e.id}>
<ComponentEvent_BoxListStatus
data={e}
path={RouterEvent.detail_review}
/>
</Box>
))}
</>
);
}