fix event button and list peserta
This commit is contained in:
@@ -1,25 +1,10 @@
|
||||
import { RouterProfile } from "@/lib/router_hipmi/router_katalog";
|
||||
import {
|
||||
ComponentGlobal_AvatarAndUsername,
|
||||
ComponentGlobal_CardStyles,
|
||||
ComponentGlobal_LoaderAvatar,
|
||||
} from "@/app_modules/_global/component";
|
||||
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
|
||||
import { funGlobal_CheckProfile } from "@/app_modules/_global/fun/get";
|
||||
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
|
||||
import {
|
||||
Grid,
|
||||
ActionIcon,
|
||||
Avatar,
|
||||
Stack,
|
||||
Group,
|
||||
Badge,
|
||||
Text,
|
||||
} from "@mantine/core";
|
||||
import { Badge, Group, Stack, Text } from "@mantine/core";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import moment from "moment";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
|
||||
type IFontSize = "xs" | "sm" | "md" | "lg" | "xl";
|
||||
|
||||
@@ -40,20 +25,6 @@ function ComponentEvent_AvatarAndUsername({
|
||||
tanggalSelesai?: Date;
|
||||
isPresent?: boolean;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const [visible, setVisible] = useState(false);
|
||||
|
||||
async function onCheckProfile() {
|
||||
const res = await funGlobal_CheckProfile({ profileId: profile.id as any });
|
||||
|
||||
if (res !== null) {
|
||||
setVisible(true);
|
||||
router.push(RouterProfile.katalog({ id: profile.id as any }));
|
||||
} else {
|
||||
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
|
||||
}
|
||||
}
|
||||
|
||||
const tglMulai = moment(tanggalMulai).diff(moment(), "minutes") < 0;
|
||||
|
||||
return (
|
||||
|
||||
@@ -1,91 +1,150 @@
|
||||
"use client";
|
||||
|
||||
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
|
||||
import { Grid, Stack, Text, Title } from "@mantine/core";
|
||||
import { MODEL_EVENT } from "../../_lib/interface";
|
||||
import { MainColor } from "@/app_modules/_global/color";
|
||||
import { Event_ComponentSkeletonDetailData } from "../skeleton/comp_skeleton_detail_data";
|
||||
import {
|
||||
ComponentGlobal_BoxInformation,
|
||||
ComponentGlobal_CardStyles,
|
||||
} from "@/app_modules/_global/component";
|
||||
import { Grid, SimpleGrid, Stack, Text, Title } from "@mantine/core";
|
||||
import { MODEL_EVENT } from "../../_lib/interface";
|
||||
import { Event_ComponentSkeletonDetail } from "../skeleton/comp_skeleton_detail";
|
||||
import Event_ComponentBoxDaftarPeserta from "./comp_box_daftar_peserta";
|
||||
import Event_ComponentBoxDaftarSponsor from "./comp_box_sponsor";
|
||||
|
||||
export default function ComponentEvent_DetailData({
|
||||
data,
|
||||
isDaftarPeserta,
|
||||
isReport,
|
||||
data
|
||||
}: {
|
||||
data: MODEL_EVENT;
|
||||
isDaftarPeserta?: boolean;
|
||||
isReport?: boolean;
|
||||
data: MODEL_EVENT | null
|
||||
}) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<ComponentGlobal_CardStyles marginBottom={"16px"}>
|
||||
<Stack px={"sm"} spacing={"xl"}>
|
||||
<Title color={MainColor.white} lineClamp={2} align="center" w={"100%"} order={4}>
|
||||
{data ? data?.title : null}
|
||||
</Title>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Lokasi</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>{data ? data?.lokasi : null}</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Tipe Acara</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>{data ? data.EventMaster_TipeAcara?.name : null}</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Stack spacing={"xs"}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Tanggal & Waktu</Text>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Mulai</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{" "}
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
}).format(data?.tanggal)}
|
||||
,{" "}
|
||||
<Text span inherit c={MainColor.white}>
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
timeStyle: "short",
|
||||
}).format(data?.tanggal)}
|
||||
</Text>
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Selesai</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{" "}
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
}).format(data?.tanggalSelesai)}
|
||||
,{" "}
|
||||
<Text span inherit c={MainColor.white}>
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
timeStyle: "short",
|
||||
}).format(data?.tanggalSelesai)}
|
||||
</Text>
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</Stack>
|
||||
{!data ? (
|
||||
<Event_ComponentSkeletonDetail />
|
||||
) : (
|
||||
<Stack>
|
||||
{isReport && (
|
||||
<ComponentGlobal_BoxInformation isReport informasi={data?.catatan} />
|
||||
)}
|
||||
|
||||
<Stack spacing={2}>
|
||||
<Text c={MainColor.white} fw={"bold"}>Deskripsi</Text>
|
||||
<Text c={MainColor.white}>{data ? data?.deskripsi : null}</Text>
|
||||
</Stack>
|
||||
<ComponentGlobal_CardStyles marginBottom={"16px"}>
|
||||
<Stack>
|
||||
<Stack px={"sm"} spacing={"xl"}>
|
||||
<Title
|
||||
color={MainColor.white}
|
||||
lineClamp={2}
|
||||
align="center"
|
||||
w={"100%"}
|
||||
order={4}
|
||||
>
|
||||
{data ? data?.title : null}
|
||||
</Title>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Lokasi
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{data ? data?.lokasi : null}
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Tipe Acara
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{data ? data.EventMaster_TipeAcara?.name : null}
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Stack spacing={"xs"}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Tanggal & Waktu
|
||||
</Text>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Mulai
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{" "}
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
}).format(new Date(data?.tanggal))}
|
||||
,{" "}
|
||||
<Text span inherit c={MainColor.white}>
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
timeStyle: "short",
|
||||
}).format(new Date(data?.tanggal))}
|
||||
</Text>
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Grid.Col span={4}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Selesai
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>:</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Text c={MainColor.white}>
|
||||
{" "}
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
}).format(new Date(data?.tanggalSelesai))}
|
||||
,{" "}
|
||||
<Text span inherit c={MainColor.white}>
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
timeStyle: "short",
|
||||
}).format(new Date(data?.tanggalSelesai))}
|
||||
</Text>
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</Stack>
|
||||
|
||||
<Stack spacing={2}>
|
||||
<Text c={MainColor.white} fw={"bold"}>
|
||||
Deskripsi
|
||||
</Text>
|
||||
<Text c={MainColor.white}>
|
||||
{data ? data?.deskripsi : null}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
{isDaftarPeserta && (
|
||||
<SimpleGrid
|
||||
cols={2}
|
||||
breakpoints={[
|
||||
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
|
||||
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
|
||||
]}
|
||||
>
|
||||
<Event_ComponentBoxDaftarPeserta />
|
||||
<Event_ComponentBoxDaftarSponsor />
|
||||
</SimpleGrid>
|
||||
)}
|
||||
</Stack>
|
||||
</ComponentGlobal_CardStyles>
|
||||
</Stack>
|
||||
</ComponentGlobal_CardStyles >
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -6,13 +6,7 @@ import {
|
||||
ComponentGlobal_CardStyles,
|
||||
} from "@/app_modules/_global/component";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import {
|
||||
Grid,
|
||||
SimpleGrid,
|
||||
Stack,
|
||||
Text,
|
||||
Title
|
||||
} from "@mantine/core";
|
||||
import { Grid, SimpleGrid, Stack, Text, Title } from "@mantine/core";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import moment from "moment";
|
||||
import "moment/locale/id";
|
||||
|
||||
@@ -8,33 +8,31 @@ import {
|
||||
Grid,
|
||||
Group,
|
||||
Loader,
|
||||
Skeleton,
|
||||
Stack,
|
||||
Text,
|
||||
Title,
|
||||
Title
|
||||
} from "@mantine/core";
|
||||
import _ from "lodash";
|
||||
|
||||
import {
|
||||
ComponentGlobal_AvatarAndUsername,
|
||||
ComponentGlobal_CardStyles,
|
||||
ComponentGlobal_LoaderAvatar,
|
||||
} from "@/app_modules/_global/component";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { MODEL_EVENT_PESERTA } from "../../_lib/interface";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { RouterProfile } from "@/lib/router_hipmi/router_katalog";
|
||||
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
|
||||
import { funGlobal_CheckProfile } from "@/app_modules/_global/fun/get";
|
||||
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
|
||||
import { useState } from "react";
|
||||
import moment from "moment";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import { API_RouteEvent } from "@/lib/api_user_router/route_api_event";
|
||||
import Event_ComponentSkeletonListPeserta from "../skeleton/comp_skeleton_list_peserta";
|
||||
import { ScrollOnly } from "next-scroll-loader";
|
||||
import { event_newGetListPesertaById } from "../../fun";
|
||||
import { MainColor } from "@/app_modules/_global/color";
|
||||
import {
|
||||
ComponentGlobal_CardStyles,
|
||||
ComponentGlobal_LoaderAvatar
|
||||
} from "@/app_modules/_global/component";
|
||||
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
|
||||
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
|
||||
import { apiGetOneProfileById } from "@/app_modules/katalog/profile/lib/api_fetch_profile";
|
||||
import { API_RouteEvent } from "@/lib/api_user_router/route_api_event";
|
||||
import { RouterProfile } from "@/lib/router_hipmi/router_katalog";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import moment from "moment";
|
||||
import { ScrollOnly } from "next-scroll-loader";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
import { MODEL_EVENT_PESERTA } from "../../_lib/interface";
|
||||
import { event_newGetListPesertaById } from "../../fun";
|
||||
import Event_ComponentSkeletonListPeserta from "../skeleton/comp_skeleton_list_peserta";
|
||||
|
||||
export default function ComponentEvent_ListPeserta({
|
||||
total,
|
||||
@@ -75,7 +73,9 @@ export default function ComponentEvent_ListPeserta({
|
||||
<ComponentGlobal_CardStyles>
|
||||
<Stack spacing={"md"} px={"sm"}>
|
||||
<Center>
|
||||
<Title color={MainColor.white} order={5}>Daftar Peserta ({total})</Title>
|
||||
<Title color={MainColor.white} order={5}>
|
||||
Daftar Peserta ({total})
|
||||
</Title>
|
||||
</Center>
|
||||
|
||||
{_.isEmpty(data) ? (
|
||||
@@ -163,13 +163,17 @@ function ComponentEvent_AvatarAndUsername({
|
||||
const [visible, setVisible] = useState(false);
|
||||
|
||||
async function onCheckProfile() {
|
||||
const res = await funGlobal_CheckProfile({ profileId: profile.id as any });
|
||||
try {
|
||||
const res = await apiGetOneProfileById({ id: profile.id as any });
|
||||
|
||||
if (res !== null) {
|
||||
setVisible(true);
|
||||
router.push(RouterProfile.katalog({ id: profile.id as any }));
|
||||
} else {
|
||||
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
|
||||
if (res && res.success) {
|
||||
setVisible(true);
|
||||
router.push(RouterProfile.katalog({ id: profile.id as any }));
|
||||
} else {
|
||||
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
|
||||
}
|
||||
} catch (error) {
|
||||
console.log("Error >>r", error);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -30,7 +30,7 @@ export function Event_ComponentSkeletonDetail() {
|
||||
<CustomSkeleton h={20} w={"100%"} />
|
||||
<CustomSkeleton h={20} w={"100%"} />
|
||||
</Stack>
|
||||
<SimpleGrid
|
||||
{/* <SimpleGrid
|
||||
cols={2}
|
||||
breakpoints={[
|
||||
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
|
||||
@@ -39,7 +39,7 @@ export function Event_ComponentSkeletonDetail() {
|
||||
>
|
||||
<CustomSkeleton h={100} w={"100%"} />
|
||||
<CustomSkeleton h={100} w={"100%"} />
|
||||
</SimpleGrid>
|
||||
</SimpleGrid> */}
|
||||
</Stack>
|
||||
</ComponentGlobal_CardStyles>
|
||||
</>
|
||||
|
||||
@@ -24,10 +24,10 @@ export function Event_ComponentSkeletonDetailData() {
|
||||
</Grid>
|
||||
))}
|
||||
|
||||
<Stack spacing={"xs"}>
|
||||
{/* <Stack spacing={"xs"}>
|
||||
<Skeleton radius={"xl"} h={20} w={200} />
|
||||
<Skeleton radius={"xl"} h={20} />
|
||||
</Stack>
|
||||
</Stack> */}
|
||||
</Stack>
|
||||
</ComponentGlobal_CardStyles>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user