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

fix ui layout voting

Browse Source
This commit is contained in:
Bagasbanuna02
2025-03-13 10:49:25 +08:00
parent f3a20dee54
commit 02ff90c204
15 changed files with 139 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/dev/vote/main/layout.tsx
View File

@@ -1,4 +1,5 @@
import { LayoutVote_Main } from "@/app_modules/vote";
import NewLayout_Voting from "@/app_modules/vote/main/new_layout_voting";
import React from "react";
export default async function Layout({
@@ -8,7 +9,8 @@ export default async function Layout({
}) {
return (
<>
<LayoutVote_Main>{children}</LayoutVote_Main>
{/* <LayoutVote_Main>{children}</LayoutVote_Main> */}
<NewLayout_Voting>{children}</NewLayout_Voting>
</>
);
}

8
src/app_modules/_global/ui/V2_layout_tamplate.tsx
View File

@@ -60,8 +60,8 @@ const useStyles = createStyles((theme) => ({
height: "8vh",
},
borderBottom: `1px solid ${AccentColor.blue}`,
borderBottomLeftRadius: "10px",
borderBottomRightRadius: "10px",
borderBottomLeftRadius: "20px",
borderBottomRightRadius: "20px",
},
content: {
@@ -85,8 +85,8 @@ const useStyles = createStyles((theme) => ({
transform: "translateX(-50%)", // Pusatkan footer
maxWidth: "500px", // Batasi lebar footer
color: MainColor.white,
borderTopLeftRadius: "10px",
borderTopRightRadius: "10px",
borderTopLeftRadius: "20px",
borderTopRightRadius: "20px",
},
}));

76
src/app_modules/vote/component/component_footer_voting.tsx Normal file
View File

@@ -0,0 +1,76 @@
import { RouterVote } from "@/lib/router_hipmi/router_vote";
import {
IconHome,
IconReservedLine,
IconClick,
IconHistory,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_vote_hotMenu } from "../global_state";
import { MainColor } from "@/app_modules/_global/color";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
import { SimpleGrid, Stack, ActionIcon, Text } from "@mantine/core";
export function Voting_ComponentFooterLayout() {
const router = useRouter();
const [hotMenu, setHotMenu] = useAtom(gs_vote_hotMenu);
const listFooter = [
{
id: 1,
name: "Beranda",
path: RouterVote.beranda,
icon: <IconHome />,
},
{
id: 2,
name: "Status",
path: RouterVote.status({ id: "1" }),
icon: <IconReservedLine />,
},
{
id: 3,
name: "Kontribusi",
path: RouterVote.kontribusi,
icon: <IconClick />,
},
{
id: 4,
name: "Riwayat",
path: RouterVote.riwayat({ id: "1" }),
icon: <IconHistory />,
},
];
return (
<>
<SimpleGrid cols={4} mx={"xs"} w={"100%"}>
{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 : MainColor.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>
</>
);
}

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

@@ -1,7 +1,10 @@
"use client";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewChildren,
UI_NewHeader,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import React from "react";
export default function LayoutVote_Create({
@@ -11,9 +14,16 @@ export default function LayoutVote_Create({
}) {
return (
<>
<UIGlobal_LayoutTamplate header={<UIGlobal_LayoutHeaderTamplate title="Tambah Vote" />}>
{/* <UIGlobal_LayoutTamplate header={<UIGlobal_LayoutHeaderTamplate title="Tambah Vote" />}>
{children}
</UIGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate> */}
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title="Tambah Voting" />
</UI_NewHeader>
<UI_NewChildren>{children}</UI_NewChildren>
</UI_NewLayoutTamplate>
</>
);
}

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

@@ -91,7 +91,7 @@ export default function Vote_Beranda() {
}
return (
<Stack mt={"1vh"}>
<Stack>
{isShowUpdate && (
<Affix position={{ top: rem(100) }} w={"100%"}>
<Center>
@@ -131,7 +131,7 @@ export default function Vote_Beranda() {
) : (
<Box>
<ScrollOnly
height="75vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

2
src/app_modules/vote/main/kontribusi.tsx
View File

@@ -43,7 +43,7 @@ export default function Vote_Kontribusi() {
) : (
<Box>
<ScrollOnly
height="82vh"
height="80vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

32
src/app_modules/vote/main/new_layout_voting.tsx Normal file
View File

@@ -0,0 +1,32 @@
"use client";
import { Component_Header } from "@/app_modules/_global/component/new/component_header";
import UI_NewLayoutTamplate, {
UI_NewChildren,
UI_NewFooter,
UI_NewHeader,
} from "@/app_modules/_global/ui/V2_layout_tamplate";
import { RouterHome } from "@/lib/router_hipmi/router_home";
import React from "react";
import { Voting_ComponentFooterLayout } from "../component/component_footer_voting";
export default function NewLayout_Voting({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
<UI_NewLayoutTamplate>
<UI_NewHeader>
<Component_Header title="Voting" routerLeft={RouterHome.main_home} />
</UI_NewHeader>
<UI_NewChildren>{children}</UI_NewChildren>
<UI_NewFooter>
<Voting_ComponentFooterLayout />
</UI_NewFooter>
</UI_NewLayoutTamplate>
</>
);
}

2
src/app_modules/vote/main/riwayat/index.tsx
View File

@@ -30,7 +30,6 @@ export default function Vote_Riwayat() {
return (
<>
<Tabs
mt={1}
variant="pills"
radius={"xl"}
value={params.id}
@@ -65,6 +64,7 @@ export default function Vote_Riwayat() {
params.id === e.id
? `1px solid ${AccentColor.yellow}`
: `1px solid ${MainColor.white}`,
color: "black",
}}
>
{e.label}

2
src/app_modules/vote/main/riwayat/saya.tsx
View File

@@ -47,7 +47,7 @@ export default function Vote_RiwayatSaya() {
// --- Main component --- //
<Box>
<ScrollOnly
height="76vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

2
src/app_modules/vote/main/riwayat/semua.tsx
View File

@@ -47,7 +47,7 @@ export default function Vote_SemuaRiwayat() {
// --- Main component --- //
<Box>
<ScrollOnly
height="76vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

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

@@ -47,7 +47,7 @@ export default function Vote_StatusDraft() {
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

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

@@ -37,7 +37,6 @@ export default function Vote_Status() {
return (
<>
<Tabs
mt={1}
variant="pills"
radius={"xl"}
value={params.id}

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

@@ -48,7 +48,7 @@ export default function Vote_StatusPublish() {
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

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

@@ -47,7 +47,7 @@ export default function Vote_StatusReject() {
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

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

@@ -47,7 +47,7 @@ export default function Vote_StatusReview() {
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="73vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />