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

#style:

Browse Source 
Deskripsi :
- Perbaikan UI Donasi
## NO Issue
This commit is contained in:
Bagasbanuna02
2024-07-22 10:29:51 +08:00
parent 8fa3f0332d
commit 73c6d58eef
89 changed files with 1686 additions and 1442 deletions
Download Patch File Download Diff File Expand all files Collapse all files

202
src/app_modules/donasi/main/layout.tsx
View File

@@ -1,30 +1,22 @@
"use client";
import {
ActionIcon,
Center,
Flex,
Footer,
Grid,
Group,
Header,
Text,
Title
} from "@mantine/core";
import React, { useState } from "react";
import { RouterCrowd } from "@/app/lib/router_hipmi/router_crowd";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import {
IconChevronLeft,
IconGiftCardFilled,
IconHome,
IconMoneybag
IconMoneybag,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_donasi_hot_menu } from "../global_state";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { SimpleGrid, Stack, ActionIcon, Text } from "@mantine/core";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import { RouterCrowd } from "@/app/lib/router_hipmi/router_crowd";
export default function LayoutDonasi({
children,
@@ -40,7 +32,7 @@ export default function LayoutDonasi({
const [isLoading, setLoading] = useState(false);
const [isRightLoading, setRightLoading] = useState(false);
const listPage = [
const listFooter = [
{
id: 1,
name: "Beranda",
@@ -63,80 +55,122 @@ export default function LayoutDonasi({
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<Header height={50} sx={{ borderStyle: "none" }}>
<Group h={50} position="apart" px={"md"}>
<ActionIcon
radius={"xl"}
variant="transparent"
loading={isLoading ? true : false}
onClick={() => {
setLoading(true);
router.push(RouterCrowd.main);
}}
>
<IconChevronLeft />
</ActionIcon>
<Title order={5}>Donasi</Title>
<ActionIcon disabled variant="transparent"/>
{/* <ActionIcon
radius={"md"}
loading={isRightLoading ? true : false}
variant="transparent"
onClick={() => {
setRightLoading(true);
router.push(RouterDonasi.notif_page + `${userId}`);
}}
>
{_.isEmpty(isRead) ? (
<IconBell />
) : isRead.includes(false) ? (
<Indicator processing color="orange">
<IconBell />
</Indicator>
) : (
<IconBell />
)}
</ActionIcon> */}
</Group>
</Header>
<UIGlobal_LayoutHeaderTamplate
title="Donasi"
routerLeft={RouterCrowd.main}
/>
}
footer={
<Footer height={"10vh"} bg={"dark"}>
<Grid align="center" h={"10vh"} pt={"xs"} grow>
{/* Tampilan Bursa */}
{listPage.map((e, i) => (
<Grid.Col
key={e.id}
span={3}
onClick={() => {
router.push(e.path);
setActive(i);
}}
<SimpleGrid cols={listFooter.length} 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={active === i ? MainColor.yellow : "white"}
onClick={() =>
e.path === ""
? ComponentGlobal_NotifikasiPeringatan("Cooming Soon")
: (router.replace(e.path), setActive(i))
}
>
<Center>
<Flex direction={"column"} align={"center"} w={"100%"}>
<ActionIcon
variant="transparent"
c={active === i ? "orange" : "white"}
>
{e.icon}
</ActionIcon>
<Text c={active === i ? "orange" : "white"} fz={"xs"}>
{e.name}
</Text>
</Flex>
</Center>
</Grid.Col>
))}
</Grid>
</Footer>
{e.icon}
</ActionIcon>
<Text
c={active === i ? MainColor.yellow : "white"}
fz={"xs"}
lineClamp={1}
>
{e.name}
</Text>
</Stack>
))}
</SimpleGrid>
}
>
{/* {JSON.stringify(isRead)} */}
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
// return (
// <>
// <AppComponentGlobal_LayoutTamplate
// header={
// <Header height={50} sx={{ borderStyle: "none" }}>
// <Group h={50} position="apart" px={"md"}>
// <ActionIcon
// radius={"xl"}
// variant="transparent"
// loading={isLoading ? true : false}
// onClick={() => {
// setLoading(true);
// router.push(RouterCrowd.main);
// }}
// >
// <IconChevronLeft />
// </ActionIcon>
// <Title order={5}>Donasi</Title>
// <ActionIcon disabled variant="transparent" />
// {/* <ActionIcon
// radius={"md"}
// loading={isRightLoading ? true : false}
// variant="transparent"
// onClick={() => {
// setRightLoading(true);
// router.push(RouterDonasi.notif_page + `${userId}`);
// }}
// >
// {_.isEmpty(isRead) ? (
// <IconBell />
// ) : isRead.includes(false) ? (
// <Indicator processing color="orange">
// <IconBell />
// </Indicator>
// ) : (
// <IconBell />
// )}
// </ActionIcon> */}
// </Group>
// </Header>
// }
// footer={
// <Footer height={"10vh"} bg={"dark"}>
// <Grid align="center" h={"10vh"} pt={"xs"} grow>
// {/* Tampilan Bursa */}
// {listPage.map((e, i) => (
// <Grid.Col
// key={e.id}
// span={3}
// onClick={() => {
// router.push(e.path);
// setActive(i);
// }}
// >
// <Center>
// <Flex direction={"column"} align={"center"} w={"100%"}>
// <ActionIcon
// variant="transparent"
// c={active === i ? "orange" : "white"}
// >
// {e.icon}
// </ActionIcon>
// <Text c={active === i ? "orange" : "white"} fz={"xs"}>
// {e.name}
// </Text>
// </Flex>
// </Center>
// </Grid.Col>
// ))}
// </Grid>
// </Footer>
// }
// >
// {/* {JSON.stringify(isRead)} */}
// {children}
// </AppComponentGlobal_LayoutTamplate>
// </>
// );
}