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

#style:

Browse Source 
Deskripsi:
- UI Voting bagian beranda dan status
## Noissue
This commit is contained in:
Bagasbanuna02
2024-07-12 16:02:28 +08:00
parent e744bb95fa
commit 7e21694324
50 changed files with 1222 additions and 812 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/dev/vote/create/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/detail/draft/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/detail/main/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/detail/publish/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/detail/reject/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/detail/review/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

9
src/app/dev/vote/edit/[id]/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

4
src/app/dev/vote/main/beranda/page.tsx
View File

@@ -1,8 +1,8 @@
import { Vote_Beranda } from "@/app_modules/vote";
import { Vote_getAllListPublish } from "@/app_modules/vote/fun/get/get_all_list_publish";
import { vote_getAllListPublish } from "@/app_modules/vote/fun/get/get_all_list_publish";
export default async function Page() {
const dataVote = await Vote_getAllListPublish()
const dataVote = await vote_getAllListPublish({page: 1})
return (
<>

9
src/app/dev/vote/main/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

14
src/app/dev/vote/main/status/page.tsx
View File

@@ -1,12 +1,14 @@
import { Vote_Status } from "@/app_modules/vote";
import { Vote_getListByStatusId } from "@/app_modules/vote/fun/get/get_list_status_by_status_id";
import { vote_getAllDraft } from "@/app_modules/vote/fun/get/status/get_all_draft";
import { vote_getAllPublish } from "@/app_modules/vote/fun/get/status/get_all_publish";
import { vote_getAllReject } from "@/app_modules/vote/fun/get/status/get_all_reject";
import { vote_getAllReview } from "@/app_modules/vote/fun/get/status/get_all_review";
export default async function Page() {
const listPublish = await Vote_getListByStatusId("1");
const listReview = await Vote_getListByStatusId("2");
const listDraft = await Vote_getListByStatusId("3");
const listReject = await Vote_getListByStatusId("4");
const listPublish = await vote_getAllPublish({page: 1});
const listReview = await vote_getAllReview({page: 1});
const listDraft = await vote_getAllDraft({page: 1});
const listReject = await vote_getAllReject({page: 1});
return (
<>

9
src/app/dev/vote/splash/loading.tsx
View File

@@ -1,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

43
src/app_modules/_global/component/button_create.tsx Normal file
View File

@@ -0,0 +1,43 @@
"use client";
import { RouterJob } from "@/app/lib/router_hipmi/router_job";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ActionIcon, Loader } from "@mantine/core";
import { IconPencilPlus } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
export default function ComponentGlobal_CreateButton({ path }: { path: string }) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
return (
<>
<ActionIcon
variant="transparent"
radius={"xl"}
size={"xl"}
style={{
position: "absolute",
zIndex: 1,
bottom: 100,
right: 30,
transition: "0.5s",
border: `1px solid ${AccentColor.skyblue}`,
backgroundColor: AccentColor.blue,
padding: 3,
}}
onClick={() => {
setLoading(true);
router.push(path);
}}
>
{isLoading ? (
<Loader color={AccentColor.yellow} size={25} />
) : (
<IconPencilPlus color="white" />
)}
</ActionIcon>
</>
);
}

30
src/app_modules/forum/main/layout.tsx
View File

@@ -1,33 +1,17 @@
"use client";
import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { MODEL_USER } from "@/app_modules/home/model/interface";
import {
ActionIcon,
AppShell,
Avatar,
Center,
Footer,
Grid,
Group,
Header,
Loader,
Stack,
Text,
Title,
Loader
} from "@mantine/core";
import React, { useState } from "react";
import ComponentForum_HeaderTamplate from "../component/header/header_tamplate";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
import { IconChevronLeft, IconCircle, IconHome } from "@tabler/icons-react";
import router from "next/router";
import { useRouter } from "next/navigation";
import { title } from "process";
import { MODEL_USER } from "@/app_modules/home/model/interface";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
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 React, { useState } from "react";
export default function LayoutForum_Main({
children,

33
src/app_modules/job/detail/draft/layout.tsx
View File

@@ -1,31 +1,15 @@
"use client";
import {
ActionIcon,
AppShell,
Box,
Drawer,
Group,
Paper,
SimpleGrid,
Stack,
Text,
Title,
} from "@mantine/core";
import React from "react";
import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
import { IconDots, IconDotsVertical, IconEdit, IconX } from "@tabler/icons-react";
import { RouterJob } from "@/app/lib/router_hipmi/router_job";
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 { useRouter } from "next/navigation";
import { useDisclosure } from "@mantine/hooks";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import UIGlobal_Drawer from "@/app_modules/_global/ui/ui_drawer";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import {
ActionIcon
} from "@mantine/core";
import { useDisclosure } from "@mantine/hooks";
import { IconDotsVertical, IconEdit } from "@tabler/icons-react";
import React from "react";
export default function LayoutJob_DetailDraft({
children,
@@ -34,7 +18,6 @@ export default function LayoutJob_DetailDraft({
children: React.ReactNode;
jobId: string;
}) {
const router = useRouter();
const [opened, { open, close }] = useDisclosure();
const listComponent = [

87
src/app_modules/job/main/arsip/ui_arsip.tsx
View File

@@ -1,55 +1,54 @@
"use client"
"use client";
import { useState } from "react"
import { MODEL_JOB } from "../../model/interface"
import _ from "lodash";
import { RouterJob } from "@/app/lib/router_hipmi/router_job";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { Box, Center, Loader } from "@mantine/core";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import ComponentJob_CardStatus from "../../component/card/card_view";
import job_getAllStatusPublish from "../../fun/get/status/get_list_publish";
import { job_getAllArsipById } from "../../fun/get/get_all_arsip";
import { MODEL_JOB } from "../../model/interface";
export function Job_UI_Arsip({listData}: {listData: MODEL_JOB[]}){
const [data, setData] = useState(listData)
const [activePage, setActivePage] = useState(1);
export function Job_UI_Arsip({ listData }: { listData: MODEL_JOB[] }) {
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
return (
<>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<Box >
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await job_getAllArsipById({
page: activePage + 1,
});
return (
<>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<Box>
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await job_getAllArsipById({
page: activePage + 1,
});
setActivePage((val) => val + 1);
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentJob_CardStatus
data={item}
path={RouterJob.detail_arsip}
/>
)}
</ScrollOnly>
</Box>
)}
</>
);
}
return loadData;
}}
>
{(item) => (
<ComponentJob_CardStatus
data={item}
path={RouterJob.detail_arsip}
/>
)}
</ScrollOnly>
</Box>
)}
</>
);
}

36
src/app_modules/job/main/layout.tsx
View File

@@ -79,42 +79,6 @@ export default function LayoutJob_Main({
</Stack>
))}
</SimpleGrid>
// <Stack justify="center" h={"100%"}>
// <Grid>
// {listFooter.map((e) => (
// <Grid.Col
// key={e.id}
// span={"auto"}
// pt={"md"}
// onClick={() => {
// // setLoading(true);
// // setTimeout(() => router.replace(e.path), 3000);
// router.replace(e.path);
// setHotMenuId(e.id);
// // setTimeout(() => setLoading(false), 1000);
// }}
// >
// <Center>
// <Stack align="center" spacing={0}>
// <ActionIcon
// radius={"xl"}
// variant="transparent"
// c={hotMenuId === e.id ? MainColor.yellow : "white"}
// >
// {e.icon}
// </ActionIcon>
// <Text
// fz={10}
// c={hotMenuId === e.id ? MainColor.yellow : "white"}
// >
// {e.name}
// </Text>
// </Stack>
// </Center>
// </Grid.Col>
// ))}
// </Grid>
// </Stack>
}
>
{children}

104
src/app_modules/vote/component/card_view_publish.tsx
View File

@@ -13,11 +13,15 @@ import {
Text,
Title,
Box,
Center,
Progress,
} from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_VOTING } from "../model/interface";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { toNumber } from "lodash";
export default function ComponentVote_CardViewPublish({
data,
@@ -35,7 +39,19 @@ export default function ComponentVote_CardViewPublish({
const router = useRouter();
return (
<>
<Card shadow="lg" withBorder p={30} radius={"md"}>
<Card
radius={"md"}
px={30}
pt={authorName ? 30 : 10}
pb={authorName ? 100 : 30}
mb={"lg"}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
{/* Header name */}
{authorName ? (
<Card.Section>
@@ -48,6 +64,7 @@ export default function ComponentVote_CardViewPublish({
) : (
""
)}
{/* Isi deskripsi */}
<Card.Section
py={authorName ? "sm" : 0}
@@ -59,44 +76,59 @@ export default function ComponentVote_CardViewPublish({
}
}}
>
<Stack>
<Text fw={"bold"}>{data ? data.title : "Judul Voting"}</Text>
<Badge>
<Group>
<Text>
{data
? data?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})
: "tgl awal voting"}
</Text>
<Text>-</Text>
<Text>
{data
? data?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})
: "tgl akhir voting"}
</Text>
</Group>
</Badge>
<Stack spacing={"xl"}>
<Stack align="center">
<Text align="center" fw={"bold"}>
{data ? data.title : "Judul Voting"}
</Text>
<Badge
styles={{
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
width: "80%",
},
}}
>
<Group>
<Text>
{data
? data?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})
: "tgl awal voting"}
</Text>
<Text>-</Text>
<Text>
{data
? data?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})
: "tgl akhir voting"}
</Text>
</Group>
</Badge>
</Stack>
{data ? (
<Stack>
<Grid>
{data?.Voting_DaftarNamaVote.map((v) => (
<Grid.Col key={v.id} span={"auto"}>
<Stack align="center" spacing={"xs"}>
<Text fz={10} lineClamp={1}>
{v.value}
</Text>
{data?.Voting_DaftarNamaVote.map((v, i) => (
<Stack key={v.id} spacing={0}>
<Text>{v.value}</Text>
<Progress radius={"xl"} value={v.jumlah} color="yellow" />
</Stack>
// <Grid.Col key={v.id} span={"auto"}>
// <Stack align="center" spacing={"xs"}>
// <Text fz={10} lineClamp={1}>
// {v.value}
// </Text>
<Avatar radius={100} variant="outline" color="blue">
<Text>{v.jumlah}</Text>
</Avatar>
</Stack>
</Grid.Col>
))}
</Grid>
// <Avatar radius={100} variant="outline" color="yellow">
// <Text>{v.jumlah}</Text>
// </Avatar>
// </Stack>
// </Grid.Col>
))}
</Stack>
) : (
<Stack>

42
src/app_modules/vote/component/card_view_status.tsx
View File

@@ -1,20 +1,10 @@
"use client";
import {
Card,
Stack,
Title,
Badge,
Group,
Radio,
Grid,
Center,
Text,
} from "@mantine/core";
import moment from "moment";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { Badge, Card, Group, Stack, Text } from "@mantine/core";
import { useRouter } from "next/navigation";
import { MODEL_VOTING } from "../model/interface";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
export default function ComponentVote_CardViewStatus({
path,
@@ -27,10 +17,14 @@ export default function ComponentVote_CardViewStatus({
return (
<>
<Card
shadow="lg"
withBorder
p={30}
radius={"md"}
mb={"lg"}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
onClick={() => {
if (data?.id === undefined) {
ComponentGlobal_NotifikasiPeringatan("Path tidak ditemukan");
@@ -41,11 +35,21 @@ export default function ComponentVote_CardViewStatus({
>
{/* Isi deskripsi */}
<Card.Section>
<Stack>
<Text fw={"bold"} truncate>
<Stack px={"xs"} align="center">
<Text fw={"bold"} lineClamp={1} align="center">
{data?.title}
</Text>
<Badge>
<Badge
// size="md"
styles={{
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
width: "80%",
},
}}
>
<Group>
<Text>
{data?.awalVote.toLocaleDateString(["id-ID"], {

52
src/app_modules/vote/component/detail/detail_daftar_kontributor.tsx
View File

@@ -1,23 +1,20 @@
"use client";
import {
Card,
Stack,
Center,
Title,
Badge,
Group,
Radio,
Grid,
Text,
Avatar,
Divider,
Box,
} from "@mantine/core";
import moment from "moment";
import { MODEL_VOTE_KONTRIBUTOR } from "../../model/interface";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import {
Avatar,
Badge,
Card,
Center,
Divider,
Grid,
Stack,
Text,
Title
} from "@mantine/core";
import _ from "lodash";
import { useRouter } from "next/navigation";
import { MODEL_VOTE_KONTRIBUTOR } from "../../model/interface";
export default function ComponentVote_DaftarKontributorVoter({
listKontributor,
@@ -27,7 +24,15 @@ export default function ComponentVote_DaftarKontributorVoter({
const router = useRouter()
return (
<>
<Card shadow="lg" withBorder p={30}>
<Card
p={30}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
<Card.Section>
<Stack>
<Center>
@@ -36,15 +41,22 @@ export default function ComponentVote_DaftarKontributorVoter({
{_.isEmpty(listKontributor) ? (
<Center>
<Text fz={"xs"} fw={"bold"}>- Tidak ada voting -</Text>
<Text fz={"xs"} c={"gray"} fw={"bold"}>
- Tidak ada voting -
</Text>
</Center>
) : (
<Stack>
{listKontributor?.map((e, i) => (
<Stack spacing={"xs"} key={i}>
<Grid>
<Grid.Col span={2}
onClick={() => router.push(RouterProfile.katalog + e.Author.Profile.id)}
<Grid.Col
span={2}
onClick={() =>
router.push(
RouterProfile.katalog + e.Author.Profile.id
)
}
>
<Avatar
size={30}

43
src/app_modules/vote/component/detail/detail_data_sebelum_publish.tsx
View File

@@ -1,19 +1,16 @@
"use client";
import {
Card,
Stack,
Center,
Title,
Badge,
Card,
Center,
Group,
Radio,
Grid,
Stack,
Text,
Title
} from "@mantine/core";
import moment from "moment";
import { MODEL_VOTING } from "../../model/interface";
import { IconCircle } from "@tabler/icons-react";
import _ from "lodash";
import { MODEL_VOTING } from "../../model/interface";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
export default function ComponentVote_DetailDataSebelumPublish
({
@@ -21,24 +18,42 @@ export default function ComponentVote_DetailDataSebelumPublish
}: {
data?: MODEL_VOTING;
}) {
return (
<>
<Card shadow="lg" withBorder p={30}>
<Card
p={30}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
<Card.Section px={"xs"}>
<Stack spacing={"lg"}>
<Center>
<Title order={5}>{data?.title}</Title>
<Title align="center" order={4}>
{data?.title}
</Title>
</Center>
<Text>{data?.deskripsi}</Text>
<Stack spacing={0}>
<Stack spacing={0} align="center">
<Center>
<Text fz={10} fw={"bold"}>
Batas Voting
</Text>
</Center>
<Badge>
<Badge
styles={{
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
width: "80%",
},
}}
>
<Group>
<Text>
{data?.awalVote.toLocaleDateString(["id-ID"], {

58
src/app_modules/vote/component/detail/detail_data_setelah_publish.tsx
View File

@@ -15,6 +15,7 @@ import { MODEL_VOTING } from "../../model/interface";
import { IconCircle } from "@tabler/icons-react";
import _ from "lodash";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
export default function ComponentVote_DetailDataSetelahPublish({
data,
@@ -25,7 +26,15 @@ export default function ComponentVote_DetailDataSetelahPublish({
}) {
return (
<>
<Card shadow="lg" withBorder p={30}>
<Card
p={30}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
{authorName ? (
<Card.Section>
<ComponentGlobal_AuthorNameOnHeader
@@ -40,31 +49,42 @@ export default function ComponentVote_DetailDataSetelahPublish({
<Card.Section px={"xs"} py={authorName ? "sm" : 0}>
<Stack spacing={"lg"}>
<Center>
<Title order={5}>{data?.title}</Title>
<Title order={4} align="center">
{data?.title}
</Title>
</Center>
<Text>{data?.deskripsi}</Text>
<Stack spacing={0} pb={authorName ? 0 : "xs"}>
<Center>
<Stack align="center" spacing={"xs"}>
<Text fz={10} fw={"bold"}>
Batas Voting
</Text>
</Center>
<Badge>
<Group>
<Text>
{data?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
<Text>-</Text>
<Text>
{data?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
</Group>
</Badge>
<Badge
styles={{
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
width: "80%",
},
}}
>
<Group>
<Text>
{data?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
<Text>-</Text>
<Text>
{data?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
</Group>
</Badge>
</Stack>
</Stack>
</Stack>
</Card.Section>

24
src/app_modules/vote/component/detail/detail_hasil_voting.tsx
View File

@@ -1,16 +1,14 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import {
Avatar,
Box,
Card,
Center,
Grid,
Group,
List,
Stack,
Text,
Title,
Title
} from "@mantine/core";
import { MODEL_VOTING_DAFTAR_NAMA_VOTE } from "../../model/interface";
@@ -21,7 +19,15 @@ export default function ComponentVote_HasilVoting({
}) {
return (
<>
<Card shadow="lg" withBorder p={30}>
<Card
p={30}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
<Card.Section>
<Stack>
<Center>
@@ -36,11 +42,13 @@ export default function ComponentVote_HasilVoting({
radius={100}
size={70}
variant="outline"
color="blue"
color="yellow"
>
<Text> {e.jumlah}</Text>
<Text>{e.jumlah}</Text>
</Avatar>
<Text fz={"xs"}>{e.value}</Text>
<Text fz={"xs"} align="center">
{e.value}
</Text>
</Stack>
</Grid.Col>
))}

66
src/app_modules/vote/create/index.tsx
View File

@@ -13,7 +13,7 @@ import {
Stack,
Text,
TextInput,
Textarea
Textarea,
} from "@mantine/core";
import { DatePickerInput } from "@mantine/dates";
import { IconMinus, IconPlus } from "@tabler/icons-react";
@@ -26,6 +26,7 @@ import { useState } from "react";
import { Vote_funCreate } from "../fun/create/create_vote";
import { gs_vote_hotMenu, gs_vote_status } from "../global_state";
import { MODEL_VOTING } from "../model/interface";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
export default function Vote_Create() {
const router = useRouter();
@@ -36,13 +37,10 @@ export default function Vote_Create() {
const [data, setData] = useState({
title: "",
deskripsi: "",
awalVote: Date,
akhirVote: Date,
awalVote: "",
akhirVote: "",
});
// const [range, setRange] = useState({
// });
const [listVote, setListVote] = useState([
{
name: "Nama Pilihan",
@@ -56,9 +54,14 @@ export default function Vote_Create() {
return (
<>
<Stack px={"sm"} spacing={"xl"}>
<Stack px={"sm"} spacing={"xl"} mb={"xl"}>
<Stack>
<TextInput
styles={{
label: {
color: "white",
},
}}
label="Judul"
withAsterisk
placeholder="Masukan judul"
@@ -72,6 +75,11 @@ export default function Vote_Create() {
/>
<Stack spacing={5}>
<Textarea
styles={{
label: {
color: "white",
},
}}
label="Deskripsi"
autosize
minRows={2}
@@ -93,6 +101,11 @@ export default function Vote_Create() {
</Stack>
<DatePickerInput
styles={{
label: {
color: "white",
},
}}
label="Jangka Waktu"
placeholder="Masukan jangka waktu voting"
withAsterisk
@@ -118,11 +131,16 @@ export default function Vote_Create() {
</Text>
</Center>
<Stack>
<Stack spacing={"xl"}>
<Stack>
{listVote.map((e, index) => (
<Box key={index}>
<TextInput
styles={{
label: {
color: "white",
},
}}
label={e.name}
withAsterisk
maxLength={100}
@@ -140,31 +158,33 @@ export default function Vote_Create() {
<Group position="center">
<Button
disabled={listVote.length >= 4 ? true : false}
compact
w={100}
radius={"xl"}
leftIcon={<IconPlus size={15} />}
variant="outline"
onClick={() => {
setListVote([
...listVote,
{ name: "Nama Voting", value: "" },
]);
}}
compact
bg={MainColor.yellow}
color={"yellow"}
c={"black"}
>
<Text fz={8}>Tambah List</Text>
</Button>
<Button
disabled={listVote.length <= 2 ? true : false}
compact
w={100}
radius={"xl"}
leftIcon={<IconMinus size={15} />}
variant="outline"
onClick={() => {
setListVote([...listVote.slice(0, -1)]);
}}
compact
bg={MainColor.yellow}
color={"yellow"}
c={"black"}
>
<Text fz={8}>Kurangi List</Text>
</Button>
@@ -173,7 +193,15 @@ export default function Vote_Create() {
</Stack>
<Button
// disabled
disabled={
!data.title ||
!data.deskripsi ||
!data.awalVote ||
!data.akhirVote ||
listVote.map((e, i) => e.value).includes("")
? true
: false
}
loaderPosition="center"
loading={isLoading ? true : false}
mt={"lg"}
@@ -188,6 +216,12 @@ export default function Vote_Create() {
setIsLoading
);
}}
c={"black"}
bg={MainColor.yellow}
color="yellow"
style={{
transition: "0.5s",
}}
>
Simpan
</Button>
@@ -222,7 +256,7 @@ async function onSave(
await Vote_funCreate(data, listVote).then((res) => {
if (res.status === 201) {
setHotMenu(1);
setHotMenu(2);
setTabsStatus("Review");
router.replace(RouterVote.status);
ComponentGlobal_NotifikasiBerhasil(res.message);

9
src/app_modules/vote/create/layout.tsx
View File

@@ -1,9 +1,8 @@
"use client";
import { AppShell } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentVote_HeaderTamplate from "../component/header_tamplate";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
export default function LayoutVote_Create({
children,
@@ -12,9 +11,9 @@ export default function LayoutVote_Create({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate header={<ComponentVote_HeaderTamplate title="Tambah Vote" />}>
<UIGlobal_LayoutTamplate header={<UIGlobal_LayoutHeaderTamplate title="Tambah Vote" />}>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

109
src/app_modules/vote/detail/draft/index.tsx
View File

@@ -13,6 +13,13 @@ import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_glo
import { Vote_funDeleteById } from "../../fun/delete/fun_delete_by_id";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import moment from "moment";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import { useState } from "react";
import UIGlobal_Modal from "@/app_modules/_global/ui/ui_modal";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
export default function Vote_DetailDraft({
dataVote,
@@ -21,7 +28,15 @@ export default function Vote_DetailDraft({
}) {
return (
<>
<Stack>
<Stack spacing={"xl"}>
{dataVote?.catatan ? (
<ComponentGlobal_BoxInformation
isReport
informasi={dataVote?.catatan}
/>
) : (
""
)}
<ComponentVote_DetailDataSebelumPublish data={dataVote} />
<ButtonAction voteId={dataVote.id} awalVote={dataVote.awalVote} />
</Stack>
@@ -38,7 +53,9 @@ function ButtonAction({
}) {
const router = useRouter();
const [tabsStatus, setTabsStatus] = useAtom(gs_vote_status);
const [opened, { open, close }] = useDisclosure(false);
const [openModal1, setOpenModal1] = useState(false);
const [openModal2, setOpenModal2] = useState(false);
const [isLoading, setIsLoading] = useState(false);
async function onUpdate() {
const hariIni = new Date();
@@ -51,6 +68,7 @@ function ButtonAction({
if (res.status === 200) {
setTabsStatus("Review");
ComponentGlobal_NotifikasiBerhasil("Berhasil Ajukan Review", 2000);
setIsLoading(true);
router.back();
} else {
ComponentGlobal_NotifikasiGagal(res.message);
@@ -75,9 +93,10 @@ function ButtonAction({
<SimpleGrid cols={2}>
<Button
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
onClick={() => {
onUpdate();
setOpenModal1(true);
}}
>
Ajukan Review
@@ -86,37 +105,71 @@ function ButtonAction({
radius={"xl"}
color="red"
onClick={() => {
open();
setOpenModal2(true);
}}
>
Hapus
</Button>
</SimpleGrid>
<Modal opened={opened} onClose={close} centered withCloseButton={false}>
<Stack>
<Title order={6}>Yakin menghapus vote ini ?</Title>
<Group position="center">
<Button
radius={"xl"}
onClick={() => {
close();
}}
>
Kembali
</Button>
<Button
radius={"xl"}
onClick={() => {
onDelete();
}}
color="red"
>
Hapus
</Button>
</Group>
</Stack>
</Modal>
{/* MODAL AJUKAN */}
<UIGlobal_Modal
title={"Anda yakin akan melakukan pengajuan review kembali ?"}
opened={openModal1}
close={() => setOpenModal1(false)}
buttonKiri={
<Button
radius={"xl"}
onClick={() => {
setOpenModal1(false);
}}
>
Batal
</Button>
}
buttonKanan={
<Button
loaderPosition="center"
loading={isLoading ? true : false}
radius={"xl"}
onClick={() => {
onUpdate();
}}
color="yellow"
bg={MainColor.yellow}
>
Ajukan
</Button>
}
/>
{/* MODAL HAPUS */}
<UIGlobal_Modal
title={"Anda yakin menghapus voting ini ?"}
opened={openModal2}
close={() => setOpenModal2(false)}
buttonKiri={
<Button
radius={"xl"}
onClick={() => {
setOpenModal2(false);
}}
>
Batal
</Button>
}
buttonKanan={
<Button
radius={"xl"}
onClick={() => {
onDelete();
}}
color="red"
>
Hapus
</Button>
}
/>
</>
);
}

45
src/app_modules/vote/detail/draft/layout.tsx
View File

@@ -1,32 +1,57 @@
"use client";
import { AppShell } from "@mantine/core";
import React from "react";
import { ActionIcon, AppShell } from "@mantine/core";
import React, { useState } from "react";
import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
import { IconEdit } from "@tabler/icons-react";
import { IconDotsVertical, IconEdit } from "@tabler/icons-react";
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
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 UIGlobal_Drawer from "@/app_modules/_global/ui/ui_drawer";
export default function LayoutVote_DetailDraft({
children,
voteId
voteId,
}: {
children: React.ReactNode;
voteId: string
voteId: string;
}) {
const [openDrawer, setOpenDrawer] = useState(false);
const listComponent = [
{
id: "1",
name: "Edit Voting",
icon: <IconEdit />,
path: RouterVote.edit + voteId,
},
];
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<ComponentVote_HeaderTamplate
<UIGlobal_LayoutHeaderTamplate
title="Detail Draft"
icon={<IconEdit />}
route2={RouterVote.edit + voteId}
customButtonRight={
<ActionIcon
variant="transparent"
onClick={() => setOpenDrawer(true)}
>
<IconDotsVertical color="white" />
</ActionIcon>
}
/>
}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
<UIGlobal_Drawer
opened={openDrawer}
close={() => setOpenDrawer(false)}
component={listComponent}
/>
</>
);
}

129
src/app_modules/vote/detail/main/index.tsx
View File

@@ -1,37 +1,36 @@
"use client";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import {
Card,
Stack,
Center,
Title,
Avatar,
Badge,
Group,
Radio,
Grid,
Text,
Box,
Button,
Avatar,
Card,
Center,
Divider,
Grid,
Group,
Radio,
Stack,
Text,
Title,
} from "@mantine/core";
import moment from "moment";
import ComponentVote_HasilVoting from "../../component/detail/detail_hasil_voting";
import _ from "lodash";
import { useState } from "react";
import ComponentVote_DaftarKontributorVoter from "../../component/detail/detail_daftar_kontributor";
import ComponentVote_HasilVoting from "../../component/detail/detail_hasil_voting";
import { Vote_funCreateHasil } from "../../fun/create/create_hasil";
import { Vote_getOnebyId } from "../../fun/get/get_one_by_id";
import {
MODEL_VOTE_KONTRIBUTOR,
MODEL_VOTING,
MODEL_VOTING_DAFTAR_NAMA_VOTE,
} from "../../model/interface";
import { useState } from "react";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import _ from "lodash";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { Vote_funCreatePilihanVotingById } from "../../fun/create/create_pilihan_voting";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { Vote_funCreateHasil } from "../../fun/create/create_hasil";
import { Vote_getOnebyId } from "../../fun/get/get_one_by_id";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
export default function Vote_MainDetail({
dataVote,
@@ -79,8 +78,16 @@ function TampilanDataVoting({
const [votingNameId, setVotingNameId] = useState("");
return (
<>
<Card shadow="lg" withBorder p={30}>
<Card.Section>
<Card
p={30}
style={{
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
}}
>
<Card.Section mb={"md"}>
<ComponentGlobal_AuthorNameOnHeader
authorName={dataVote?.Author.Profile.name}
imagesId={dataVote?.Author.Profile.imagesId}
@@ -90,31 +97,43 @@ function TampilanDataVoting({
<Card.Section px={"xs"} py={"sm"}>
<Stack spacing={"lg"}>
<Center>
<Title order={5}>{dataVote?.title}</Title>
<Title order={5} align="center">
{dataVote?.title}
</Title>
</Center>
<Text>{dataVote?.deskripsi}</Text>
<Stack spacing={0}>
<Center>
<Stack align="center" spacing={"xs"}>
<Text fz={10} fw={"bold"}>
Batas Voting
</Text>
</Center>
<Badge>
<Group>
<Text>
{dataVote?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
<Text>-</Text>
<Text>
{dataVote?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
</Group>
</Badge>
<Badge
styles={{
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
width: "80%",
},
}}
>
<Group>
<Text>
{dataVote?.awalVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
<Text>-</Text>
<Text>
{dataVote?.akhirVote.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
</Group>
</Badge>
</Stack>
</Stack>
</Stack>
</Card.Section>
@@ -122,7 +141,13 @@ function TampilanDataVoting({
{/* Voting View */}
<Card.Section py={"xl"}>
{isKontributor ? (
<Stack align="center" spacing={0}>
<Stack
align="center"
spacing={0}
style={{
color: "white",
}}
>
<Text mb={"sm"} fw={"bold"} fz={"xs"}>
Pilihan anda:
</Text>
@@ -131,8 +156,18 @@ function TampilanDataVoting({
</Badge>
</Stack>
) : (
<Stack spacing={"xl"}>
<Stack
spacing={"xl"}
style={{
color: "white",
}}
>
<Radio.Group
styles={{
label: {
color: "white",
},
}}
value={votingNameId}
onChange={(val) => {
setVotingNameId(val);
@@ -146,7 +181,12 @@ function TampilanDataVoting({
<Stack px={"md"}>
{dataVote?.Voting_DaftarNamaVote.map((v) => (
<Box key={v.id}>
<Radio label={v.value} value={v.id} />
<Radio
color="yellow"
styles={{ label: { color: "white" } }}
label={v.value}
value={v.id}
/>
</Box>
))}
</Stack>
@@ -162,6 +202,9 @@ function TampilanDataVoting({
onClick={() =>
onVote(votingNameId, dataVote?.id as any, setData)
}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Vote
</Button>

8
src/app_modules/vote/detail/main/layout.tsx
View File

@@ -4,6 +4,8 @@ import { AppShell } from "@mantine/core";
import React from "react";
import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
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";
export default function LayoutVote_MainDetail({
children,
@@ -12,11 +14,11 @@ export default function LayoutVote_MainDetail({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentVote_HeaderTamplate title="Detail Voting" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Detail Voting" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

8
src/app_modules/vote/detail/publish/layout.tsx
View File

@@ -4,6 +4,8 @@ import { AppShell } from "@mantine/core";
import React from "react";
import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
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";
export default function LayoutVote_DetailPublish({
children,
@@ -12,11 +14,11 @@ export default function LayoutVote_DetailPublish({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentVote_HeaderTamplate title="Detail Publish" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Detail Publish" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

98
src/app_modules/vote/detail/reject/index.tsx
View File

@@ -20,6 +20,10 @@ import { Vote_funDeleteById } from "../../fun/delete/fun_delete_by_id";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { Vote_funEditStatusByStatusId } from "../../fun/edit/fun_edit_status_by_id";
import ComponentVote_NotedBox from "../../component/noted_box";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
import { useState } from "react";
import UIGlobal_Modal from "@/app_modules/_global/ui/ui_modal";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
export default function Vote_DetailReject({
dataVote,
@@ -29,7 +33,10 @@ export default function Vote_DetailReject({
return (
<>
<Stack spacing={"xl"}>
<ComponentVote_NotedBox informasi={dataVote?.catatan} />
<ComponentGlobal_BoxInformation
isReport
informasi={dataVote?.catatan}
/>
<ComponentVote_DetailDataSebelumPublish data={dataVote as any} />
<ButtonAction voteId={dataVote.id} />
</Stack>
@@ -40,7 +47,10 @@ export default function Vote_DetailReject({
function ButtonAction({ voteId }: { voteId: string }) {
const router = useRouter();
const [tabsStatus, setTabsStatus] = useAtom(gs_vote_status);
const [opened, { open, close }] = useDisclosure(false);
const [openModal1, setOpenModal1] = useState(false);
const [openModal2, setOpenModal2] = useState(false);
const [isLoading, setIsLoading] = useState(false);
async function onUpdate() {
await Vote_funEditStatusByStatusId(voteId, "3").then((res) => {
@@ -73,7 +83,7 @@ function ButtonAction({ voteId }: { voteId: string }) {
radius={"xl"}
color="orange"
onClick={() => {
onUpdate();
setOpenModal1(true);
}}
>
Edit Kembali
@@ -82,37 +92,69 @@ function ButtonAction({ voteId }: { voteId: string }) {
radius={"xl"}
color="red"
onClick={() => {
open();
setOpenModal2(true);
}}
>
Hapus
</Button>
</SimpleGrid>
<Modal opened={opened} onClose={close} centered withCloseButton={false}>
<Stack>
<Title order={6}>Yakin menghapus vote ini ?</Title>
<Group position="center">
<Button
radius={"xl"}
onClick={() => {
close();
}}
>
Kembali
</Button>
<Button
radius={"xl"}
onClick={() => {
onDelete();
}}
color="red"
>
Hapus
</Button>
</Group>
</Stack>
</Modal>
<UIGlobal_Modal
title={"Anda akan mengedit kembali voting ini ?"}
opened={openModal1}
close={() => setOpenModal1(false)}
buttonKiri={
<Button
radius={"xl"}
onClick={() => {
setOpenModal1(false);
}}
>
Batal
</Button>
}
buttonKanan={
<Button
loaderPosition="center"
loading={isLoading ? true : false}
radius={"xl"}
onClick={() => {
onUpdate();
}}
color="orange"
>
Simpan
</Button>
}
/>
{/* MODAL HAPUS */}
<UIGlobal_Modal
title={"Anda yakin menghapus voting ini ?"}
opened={openModal2}
close={() => setOpenModal2(false)}
buttonKiri={
<Button
radius={"xl"}
onClick={() => {
setOpenModal2(false);
}}
>
Batal
</Button>
}
buttonKanan={
<Button
radius={"xl"}
onClick={() => {
onDelete();
}}
color="red"
>
Hapus
</Button>
}
/>
</>
);
}

11
src/app_modules/vote/detail/reject/layout.tsx
View File

@@ -1,9 +1,8 @@
"use client";
import { AppShell } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
export default function LayoutVote_DetailReject({
children,
@@ -12,11 +11,11 @@ export default function LayoutVote_DetailReject({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentVote_HeaderTamplate title="Detail Reject" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Detail Reject" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

51
src/app_modules/vote/detail/review/index.tsx
View File

@@ -1,28 +1,16 @@
"use client";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import {
Badge,
Button,
Card,
Center,
Grid,
Group,
Radio,
Stack,
Text,
Title,
} from "@mantine/core";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { Button, Stack } from "@mantine/core";
import { useAtom } from "jotai";
import moment from "moment";
import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
import { useRouter } from "next/navigation";
import { gs_vote_status } from "../../global_state";
import { useState } from "react";
import ComponentVote_DetailDataSebelumPublish from "../../component/detail/detail_data_sebelum_publish";
import { Vote_funEditStatusByStatusId } from "../../fun/edit/fun_edit_status_by_id";
import { gs_vote_status } from "../../global_state";
import { MODEL_VOTING } from "../../model/interface";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { useState } from "react";
import UIGlobal_Modal from "@/app_modules/_global/ui/ui_modal";
export default function Vote_DetailReview({
dataVote,
@@ -43,6 +31,7 @@ function ButtonAction({ voteId }: { voteId: string }) {
const router = useRouter();
const [isLoading, setIsLoading] = useState(false);
const [tabsStatus, setTabsStatus] = useAtom(gs_vote_status);
const [openModal, setOpenModal] = useState(false);
async function onUpdate() {
await Vote_funEditStatusByStatusId(voteId, "3").then((res) => {
@@ -59,16 +48,36 @@ function ButtonAction({ voteId }: { voteId: string }) {
return (
<>
<Button
loaderPosition="center"
loading={isLoading ? true : false}
radius={"xl"}
color="orange"
onClick={() => {8
onUpdate();
onClick={() => {
setOpenModal(true);
}}
>
Batalkan Review
</Button>
<UIGlobal_Modal
title={"Anda yakin akan membatalkan review?"}
opened={openModal}
close={() => setOpenModal(false)}
buttonKiri={
<Button radius={"xl"} onClick={() => setOpenModal(false)}>
Batal
</Button>
}
buttonKanan={
<Button
loaderPosition="center"
loading={isLoading ? true : false}
radius={"xl"}
color="green"
onClick={() => onUpdate()}
>
Simpan
</Button>
}
/>
</>
);
}

11
src/app_modules/vote/detail/review/layout.tsx
View File

@@ -1,9 +1,8 @@
"use client";
import { AppShell } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
export default function LayoutVote_DetailReview({
children,
@@ -12,11 +11,11 @@ export default function LayoutVote_DetailReview({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentVote_HeaderTamplate title="Detail Review" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Detail Review" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

130
src/app_modules/vote/edit/index.tsx
View File

@@ -14,7 +14,7 @@ import {
Stack,
Text,
TextInput,
Textarea
Textarea,
} from "@mantine/core";
import { DatePickerInput } from "@mantine/dates";
import { IconPlus, IconTrash } from "@tabler/icons-react";
@@ -29,6 +29,9 @@ import {
MODEL_VOTING,
MODEL_VOTING_DAFTAR_NAMA_VOTE,
} from "../model/interface";
import { useShallowEffect } from "@mantine/hooks";
import { Vote_getListDaftarNamaById } from "../fun/get/get_list_daftar_vote_by_id";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
export default function Vote_Edit({
dataVote,
@@ -40,10 +43,24 @@ export default function Vote_Edit({
const [data, setData] = useState(dataVote);
const [pilihanNama, setPilihanNama] = useState(listDaftarVote);
useShallowEffect(() => {
onLoadList();
}, []);
async function onLoadList() {
const loadList = await Vote_getListDaftarNamaById(data.id);
setPilihanNama(loadList as any);
}
return (
<>
<Stack px={"sm"}>
<Stack px={"sm"} c={"white"} mb={"xl"}>
<TextInput
styles={{
label: {
color: "white",
},
}}
label="Judul"
withAsterisk
placeholder="Judul"
@@ -66,6 +83,11 @@ export default function Vote_Edit({
<Stack spacing={5}>
<Textarea
styles={{
label: {
color: "white",
},
}}
label="Deskripsi"
autosize
minRows={2}
@@ -95,6 +117,11 @@ export default function Vote_Edit({
</Stack>
<DatePickerInput
styles={{
label: {
color: "white",
},
}}
label="Jangka Waktu"
placeholder="Masukan jangka waktu voting"
withAsterisk
@@ -130,63 +157,66 @@ export default function Vote_Edit({
<Stack>
<Stack>
{pilihanNama.map((e, index) => (
<Grid key={index} h="100%" align="center">
<Grid.Col span={10}>
<Box>
<TextInput
label={"Nama Pilihan"}
withAsterisk
placeholder="Nama pilihan"
value={e.value}
maxLength={100}
error={
e.value === "" ? (
<ComponentGlobal_ErrorInput text="Masukan nama pilihan" />
) : (
""
)
}
onChange={(v) => {
const cloneData = _.clone(pilihanNama);
cloneData[index].value = v.currentTarget.value;
setPilihanNama([...pilihanNama]);
}}
/>
</Box>
</Grid.Col>
<Grid.Col span={2} mt={"md"}>
<ActionIcon
variant="transparent"
radius={"xl"}
disabled={pilihanNama.length < 3 ? true : false}
onClick={() => {
pilihanNama.splice(index, 1);
<Group key={index} position="apart" align="center">
<Box w={"85%"}>
<TextInput
styles={{
label: {
color: "white",
},
}}
label={"Nama Pilihan"}
withAsterisk
placeholder="Nama pilihan"
value={e.value}
maxLength={100}
error={
e.value === "" ? (
<ComponentGlobal_ErrorInput text="Masukan nama pilihan" />
) : (
""
)
}
onChange={(v) => {
const cloneData = _.clone(pilihanNama);
cloneData[index].value = v.currentTarget.value;
setPilihanNama([...pilihanNama]);
}}
>
<IconTrash
style={{
transition: "0.5s",
}}
color={pilihanNama.length < 3 ? "gray" : "red"}
/>
</ActionIcon>
</Grid.Col>
</Grid>
/>
</Box>
<ActionIcon
mt={"lg"}
variant="transparent"
radius={"xl"}
disabled={pilihanNama.length < 3 ? true : false}
onClick={() => {
pilihanNama.splice(index, 1);
setPilihanNama([...pilihanNama]);
}}
>
<IconTrash
style={{
transition: "0.5s",
}}
color={pilihanNama.length < 3 ? "gray" : "red"}
/>
</ActionIcon>
</Group>
))}
</Stack>
<Group position="center">
<Button
disabled={pilihanNama.length >= 4 ? true : false}
compact
w={100}
radius={"xl"}
leftIcon={<IconPlus size={15} />}
variant="outline"
onClick={() => {
setPilihanNama([...(pilihanNama as any), { value: "" }]);
}}
compact
bg={MainColor.yellow}
color={"yellow"}
c={"black"}
>
<Text fz={8}>Tambah List</Text>
</Button>
@@ -233,12 +263,18 @@ function ButtonAction({
return (
<>
<Button
disabled={!data.title || !data.deskripsi ? true : false}
loaderPosition="center"
loading={isLoading ? true : false}
mt={"lg"}
radius={"xl"}
color="green"
onClick={() => onUpdate()}
c={"black"}
bg={MainColor.yellow}
color="yellow"
style={{
transition: "0.5s",
}}
>
Update
</Button>

11
src/app_modules/vote/edit/layout.tsx
View File

@@ -1,9 +1,8 @@
"use client";
import { AppShell } from "@mantine/core";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import ComponentVote_HeaderTamplate from "../component/header_tamplate";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
export default function LayoutVote_Edit({
children,
@@ -12,9 +11,11 @@ export default function LayoutVote_Edit({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate header={<ComponentVote_HeaderTamplate title="Edit Vote" />}>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Edit Vote" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

7
src/app_modules/vote/fun/get/get_all_list_publish.ts
View File

@@ -3,8 +3,13 @@
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function Vote_getAllListPublish() {
export async function vote_getAllListPublish({ page }: { page: number }) {
const takeData = 5;
const skipData = page * takeData - takeData;
const data = await prisma.voting.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},

89
src/app_modules/vote/fun/get/get_list_status_by_status_id.ts
View File

@@ -1,89 +0,0 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function Vote_getListByStatusId(statusId: string) {
const authorId = await user_getOneUserId();
if (statusId === "1") {
const data = await prisma.voting.findMany({
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "1",
authorId: authorId,
isActive: true,
akhirVote: {
gte: new Date(),
},
},
select: {
id: true,
title: true,
isActive: true,
createdAt: true,
updatedAt: true,
deskripsi: true,
awalVote: true,
akhirVote: true,
catatan: true,
authorId: true,
voting_StatusId: true,
Voting_DaftarNamaVote: {
orderBy: {
createdAt: "asc",
},
},
},
});
return data;
}
if (statusId === "2") {
const data = await prisma.voting.findMany({
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "2",
authorId: authorId,
isActive: true,
},
});
return data;
}
if (statusId === "3") {
const data = await prisma.voting.findMany({
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "3",
authorId: authorId,
isActive: true,
},
});
return data;
}
if (statusId === "4") {
const data = await prisma.voting.findMany({
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "4",
authorId: authorId,
isActive: true,
},
});
return data;
}
}

26
src/app_modules/vote/fun/get/status/get_all_draft.tsx Normal file
View File

@@ -0,0 +1,26 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function vote_getAllDraft({ page }: { page: number }) {
const authorId = await user_getOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.voting.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "3",
authorId: authorId,
isActive: true,
},
});
return data;
}

47
src/app_modules/vote/fun/get/status/get_all_publish.tsx Normal file
View File

@@ -0,0 +1,47 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function vote_getAllPublish({ page }: { page: number }) {
const authorId = await user_getOneUserId();
const takeData = 5;
const skipData = page * takeData - takeData;
const data = await prisma.voting.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "1",
authorId: authorId,
isActive: true,
akhirVote: {
gte: new Date(),
},
},
select: {
id: true,
title: true,
isActive: true,
createdAt: true,
updatedAt: true,
deskripsi: true,
awalVote: true,
akhirVote: true,
catatan: true,
authorId: true,
voting_StatusId: true,
Voting_DaftarNamaVote: {
orderBy: {
createdAt: "asc",
},
},
},
});
return data;
}

26
src/app_modules/vote/fun/get/status/get_all_reject.tsx Normal file
View File

@@ -0,0 +1,26 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function vote_getAllReject({ page }: { page: number }) {
const authorId = await user_getOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.voting.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "4",
authorId: authorId,
isActive: true,
},
});
return data;
}

26
src/app_modules/vote/fun/get/status/get_all_review.tsx Normal file
View File

@@ -0,0 +1,26 @@
"use server";
import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
export async function vote_getAllReview({ page }: { page: number }) {
const authorId = await user_getOneUserId();
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.voting.findMany({
take: takeData,
skip: skipData,
orderBy: {
updatedAt: "desc",
},
where: {
voting_StatusId: "2",
authorId: authorId,
isActive: true,
},
});
return data;
}

2
src/app_modules/vote/global_state/index.ts
View File

@@ -1,6 +1,6 @@
import { atomWithStorage } from "jotai/utils";
export const gs_vote_hotMenu = atomWithStorage("gs_vote_hotMenu", 0);
export const gs_vote_hotMenu = atomWithStorage("gs_vote_hotMenu", 1);
export const gs_vote_status = atomWithStorage<string | any>(
"gs_vote_status",

80
src/app_modules/vote/main/beranda.tsx
View File

@@ -5,8 +5,10 @@ import {
ActionIcon,
Affix,
Box,
Center,
Loader,
Stack,
rem
rem,
} from "@mantine/core";
import { useShallowEffect, useWindowScroll } from "@mantine/hooks";
import { IconPencilPlus } from "@tabler/icons-react";
@@ -15,21 +17,20 @@ import { useRouter } from "next/navigation";
import { useState } from "react";
import ComponentVote_CardViewPublish from "../component/card_view_publish";
import ComponentVote_IsEmptyData from "../component/is_empty_data";
import { Vote_getAllListPublish } from "../fun/get/get_all_list_publish";
import { vote_getAllListPublish } from "../fun/get/get_all_list_publish";
import { MODEL_VOTING } from "../model/interface";
import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import job_getAllStatusPublish from "@/app_modules/job/fun/get/status/get_list_publish";
import { ScrollOnly } from "next-scroll-loader";
export default function Vote_Beranda({
dataVote,
}: {
dataVote: MODEL_VOTING[];
}) {
const router = useRouter();
const [data, setData] = useState(dataVote);
const [isLoading, setIsLoading] = useState(false);
const [scroll, scrollTo] = useWindowScroll();
useShallowEffect(() => {
onLoad({
setData(val) {
@@ -39,46 +40,45 @@ export default function Vote_Beranda({
}, [setData]);
async function onLoad({ setData }: { setData: (val: any) => void }) {
const loadData = await Vote_getAllListPublish();
const loadData = await vote_getAllListPublish({ page: 1 });
setData(loadData);
}
const [activePage, setActivePage] = useState(1);
return (
<>
<Affix position={{ bottom: rem(150), right: rem(30) }}>
<ActionIcon
loading={isLoading ? true : false}
opacity={scroll.y > 0 ? 0.5 : ""}
style={{
transition: "0.5s",
}}
size={"xl"}
radius={"xl"}
variant="transparent"
bg={"blue"}
onClick={() => {
setIsLoading(true);
router.push(RouterVote.create);
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<ScrollOnly
height="85vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await vote_getAllListPublish({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
<IconPencilPlus color="white" />
</ActionIcon>
</Affix>
{_.isEmpty(data) ? (
<ComponentVote_IsEmptyData text="Tidak ada data" />
) : (
<Stack>
{data.map((e, i) => (
<Box key={i}>
<ComponentVote_CardViewPublish
path={RouterVote.main_detail}
data={e}
authorName={true}
/>
</Box>
))}
</Stack>
{(item) => (
<ComponentVote_CardViewPublish
data={item}
path={RouterVote.main_detail}
authorName={true}
/>
)}
</ScrollOnly>
)}
</>
);

102
src/app_modules/vote/main/layout.tsx
View File

@@ -6,6 +6,7 @@ import {
Center,
Footer,
Grid,
SimpleGrid,
Stack,
Text,
} from "@mantine/core";
@@ -23,6 +24,10 @@ import { gs_vote_hotMenu } from "../global_state";
import { useAtom } from "jotai";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
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 { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
export default function LayoutVote_Main({
children,
@@ -62,50 +67,75 @@ export default function LayoutVote_Main({
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<ComponentVote_HeaderTamplate
<UIGlobal_LayoutHeaderTamplate
title="Voting"
route={RouterHome.main_home}
routerLeft={RouterHome.main_home}
/>
}
footer={
<Footer
height={"10vh"}
bg={"dark"}
sx={{ borderTop: "px solid blue" }}
>
<Stack h={"100%"} justify="center">
<Grid>
{listFooter.map((e, i) => (
<Grid.Col key={e.id} span={"auto"} pt={"md"}>
<Center
onClick={() => {
router.replace(e.path);
setHotMenu(i);
}}
>
<Stack align="center" spacing={0}>
<ActionIcon
variant="transparent"
c={hotMenu === i ? "blue" : "white"}
>
{e.icon}
</ActionIcon>
<Text fz={10} c={hotMenu === i ? "blue" : "white"}>
{e.name}
</Text>
</Stack>
</Center>
</Grid.Col>
))}
</Grid>
</Stack>
</Footer>
<SimpleGrid cols={4} 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={hotMenu === e.id ? MainColor.yellow : "white"}
onClick={() =>
e.path === ""
? ComponentGlobal_NotifikasiPeringatan("Cooming Soon")
: (router.replace(e.path), setHotMenu(e.id))
}
>
{e.icon}
</ActionIcon>
<Text
c={hotMenu === e.id ? MainColor.yellow : "white"}
fz={"xs"}
lineClamp={1}
>
{e.name}
</Text>
</Stack>
))}
</SimpleGrid>
// <Footer
// height={"10vh"}
// bg={"dark"}
// sx={{ borderTop: "px solid blue" }}
// >
// <Stack h={"100%"} justify="center">
// <Grid>
// {listFooter.map((e, i) => (
// <Grid.Col key={e.id} span={"auto"} pt={"md"}>
// <Center
// onClick={() => {
// router.replace(e.path);
// setHotMenu(i);
// }}
// >
// <Stack align="center" spacing={0}>
// <ActionIcon
// variant="transparent"
// c={hotMenu === i ? "blue" : "white"}
// >
// {e.icon}
// </ActionIcon>
// <Text fz={10} c={hotMenu === i ? "blue" : "white"}>
// {e.name}
// </Text>
// </Stack>
// </Center>
// </Grid.Col>
// ))}
// </Grid>
// </Stack>
// </Footer>
}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

57
src/app_modules/vote/main/status/draft.tsx
View File

@@ -1,32 +1,59 @@
"use client";
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import ComponentVote_CardViewStatus from "../../component/card_view_status";
import { MODEL_VOTING } from "../../model/interface";
import { Box, Center, Loader, Stack } from "@mantine/core";
import _ from "lodash";
import { Box, Center, Stack, Text } from "@mantine/core";
import ComponentVote_CardViewStatus from "../../component/card_view_status";
import ComponentVote_IsEmptyData from "../../component/is_empty_data";
import { MODEL_VOTING } from "../../model/interface";
import { useState } from "react";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { ScrollOnly } from "next-scroll-loader";
import { vote_getAllReview } from "../../fun/get/status/get_all_review";
import { vote_getAllDraft } from "../../fun/get/status/get_all_draft";
export default function Vote_StatusDraft({
listDraft,
}: {
listDraft: MODEL_VOTING[];
}) {
if (_.isEmpty(listDraft))
return <ComponentVote_IsEmptyData text="Tidak ada data" />;
const [data, setData] = useState(listDraft);
const [activePage, setActivePage] = useState(1);
return (
<>
<Stack>
{listDraft.map((e) => (
<Box key={e.id}>
<ComponentVote_CardViewStatus
path={RouterVote.detail_draft}
data={e}
/>
</Box>
))}
</Stack>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await vote_getAllDraft({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentVote_CardViewStatus
data={item}
path={RouterVote.detail_draft}
/>
)}
</ScrollOnly>
</Box>
)}
</>
);
}

40
src/app_modules/vote/main/status/index.tsx
View File

@@ -1,14 +1,16 @@
"use client";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import { Stack, Tabs } from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { gs_vote_status } from "../../global_state";
import Vote_StatusPublish from "./publish";
import Vote_StatusReview from "./review";
import Vote_StatusDraft from "./draft";
import Vote_StatusPublish from "./publish";
import Vote_StatusReject from "./reject";
import Vote_StatusReview from "./review";
export default function Vote_Status({
listPublish,
@@ -21,7 +23,7 @@ export default function Vote_Status({
listDraft: any[];
listReject: any[];
}) {
const router = useRouter();
const [tabsStatus, setTabsStatus] = useAtom(gs_vote_status);
const listTabs = [
{
@@ -45,16 +47,27 @@ export default function Vote_Status({
value: "Reject",
},
];
return (
<>
<Tabs
color="blue"
mt={1}
variant="pills"
radius={"xl"}
defaultValue={"Publish"}
value={tabsStatus}
onTabChange={setTabsStatus}
styles={{
tabsList: {
backgroundColor: MainColor.darkblue,
position: "sticky",
top: 0,
zIndex: 99,
},
panel: {
paddingTop: 10,
},
}}
>
<Stack>
<Tabs.List grow>
@@ -62,8 +75,17 @@ export default function Vote_Status({
<Tabs.Tab
key={e.id}
value={e.value}
bg={tabsStatus === e.value ? "blue" : "gray.1"}
fw={tabsStatus === e.value ? "bold" : "normal"}
fw={"bold"}
c={"black"}
style={{
transition: "0.5s",
backgroundColor:
tabsStatus === e.value ? MainColor.yellow : "white",
border:
tabsStatus === e.value
? `1px solid ${AccentColor.yellow}`
: `1px solid white`,
}}
>
{e.value}
</Tabs.Tab>

74
src/app_modules/vote/main/status/publish.tsx
View File

@@ -1,54 +1,60 @@
"use client";
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import {
Avatar,
Badge,
Box,
Card,
Center,
Divider,
Grid,
Group,
Radio,
Skeleton,
Stack,
Text,
Title,
} from "@mantine/core";
import moment from "moment";
import { useRouter } from "next/navigation";
import { MODEL_VOTING } from "../../model/interface";
import ComponentVote_IsEmptyData from "../../component/is_empty_data";
import { Box, Center, Loader, Stack } from "@mantine/core";
import _ from "lodash";
import { useRouter } from "next/navigation";
import ComponentVote_CardViewPublish from "../../component/card_view_publish";
import ComponentVote_IsEmptyData from "../../component/is_empty_data";
import { MODEL_VOTING } from "../../model/interface";
import { RouterJob } from "@/app/lib/router_hipmi/router_job";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentJob_CardStatus from "@/app_modules/job/component/card/card_view";
import job_getAllStatusPublish from "@/app_modules/job/fun/get/status/get_list_publish";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
export default function Vote_StatusPublish({
listPublish,
}: {
listPublish: MODEL_VOTING[];
}) {
const router = useRouter();
if (_.isEmpty(listPublish))
return (
<>
<ComponentVote_IsEmptyData text="Tidak ada data" />
</>
);
const [data, setData] = useState(listPublish);
const [activePage, setActivePage] = useState(1);
return (
<>
<Stack>
{listPublish.map((e) => (
<Box key={e.id}>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await job_getAllStatusPublish({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentVote_CardViewPublish
data={e}
data={item}
path={RouterVote.detail_publish}
/>
</Box>
))}
</Stack>
)}
</ScrollOnly>
)}
</>
);
}

57
src/app_modules/vote/main/status/reject.tsx
View File

@@ -1,32 +1,57 @@
"use client";
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import ComponentVote_CardViewStatus from "../../component/card_view_status";
import { MODEL_VOTING } from "../../model/interface";
import { Box, Stack } from "@mantine/core";
import ComponentVote_IsEmptyData from "../../component/is_empty_data";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { Box, Center, Loader } from "@mantine/core";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import ComponentVote_CardViewStatus from "../../component/card_view_status";
import { vote_getAllReject } from "../../fun/get/status/get_all_reject";
import { MODEL_VOTING } from "../../model/interface";
export default function Vote_StatusReject({
listReject,
}: {
listReject: MODEL_VOTING[];
}) {
if (_.isEmpty(listReject))
return <ComponentVote_IsEmptyData text="Tidak ada data" />;
const [data, setData] = useState(listReject);
const [activePage, setActivePage] = useState(1);
return (
<>
<Stack>
{listReject.map((e) => (
<Box key={e.id}>
<ComponentVote_CardViewStatus
path={RouterVote.detail_reject}
data={e}
/>
</Box>
))}
</Stack>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await vote_getAllReject({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentVote_CardViewStatus
data={item}
path={RouterVote.detail_reject}
/>
)}
</ScrollOnly>
</Box>
)}
</>
);
}

55
src/app_modules/vote/main/status/review.tsx
View File

@@ -3,31 +3,58 @@
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import ComponentVote_CardViewStatus from "../../component/card_view_status";
import { MODEL_VOTING } from "../../model/interface";
import { Box, Center, Stack, Text } from "@mantine/core";
import { Box, Center, Loader, Stack, Text } from "@mantine/core";
import _ from "lodash";
import ComponentVote_IsEmptyData from "../../component/is_empty_data";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import job_getAllStatusPublish from "@/app_modules/job/fun/get/status/get_list_publish";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import ComponentVote_CardViewPublish from "../../component/card_view_publish";
import { vote_getAllReview } from "../../fun/get/status/get_all_review";
export default function Vote_StatusReview({
listReview,
}: {
listReview: MODEL_VOTING[];
}) {
if (_.isEmpty(listReview))
return <ComponentVote_IsEmptyData text="Tidak ada data" />;
const [data, setData] = useState(listReview);
const [activePage, setActivePage] = useState(1);
return (
<>
<Stack>
{listReview.map((e) => (
<Box key={e.id}>
<ComponentVote_CardViewStatus
path={RouterVote.detail_review}
data={e}
/>
</Box>
))}
</Stack>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData />
) : (
// --- Main component --- //
<Box >
<ScrollOnly
height="75vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />
</Center>
)}
data={data}
setData={setData}
moreData={async () => {
const loadData = await vote_getAllReview({
page: activePage + 1,
});
setActivePage((val) => val + 1);
return loadData;
}}
>
{(item) => (
<ComponentVote_CardViewStatus
data={item}
path={RouterVote.detail_review}
/>
)}
</ScrollOnly>
</Box>
)}
</>
);
}

9
src/app_modules/vote/splash/index.tsx
View File

@@ -10,6 +10,8 @@ import {
gs_vote_riwayat,
gs_vote_status,
} from "../global_state";
import UIGlobal_SplashScreen from "@/app_modules/_global/ui/ui_splash";
import { IconPackageImport } from "@tabler/icons-react";
export default function Vote_Splash() {
const router = useRouter();
@@ -18,7 +20,7 @@ export default function Vote_Splash() {
const [tabsRiwayat, setTabsRiwayat] = useAtom(gs_vote_riwayat);
useShallowEffect(() => {
setTimeout(() => {
setHotMenu(0);
setHotMenu(1);
setTabsStatus("Publish");
setTabsRiwayat("Semua");
router.replace(RouterVote.beranda);
@@ -27,11 +29,12 @@ export default function Vote_Splash() {
return (
<>
<Center h={"100vh"}>
<UIGlobal_SplashScreen icon={<IconPackageImport size={300} />} />
{/* <Center h={"100vh"}>
<Paper p={{ base: 50, md: 60, lg: 80 }}>
<Image alt="logo" src={"/aset/vote/logo.png"} />
</Paper>
</Center>
</Center> */}
</>
);
}