#style: event ui

This commit is contained in:
2024-07-18 11:17:20 +08:00
parent 38d4d04436
commit b67303d28b
6 changed files with 167 additions and 92 deletions

View File

@@ -1,31 +1,22 @@
"use client";
import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import {
ActionIcon,
Affix,
Card,
Center,
Grid,
Paper,
Stack,
Text,
Textarea,
Title,
rem,
rem
} from "@mantine/core";
import { useWindowScroll } from "@mantine/hooks";
import { IconPencilPlus } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import ComponentColab_CardSectionData from "../component/card_view/card_section_data";
import ComponentColab_SectionHeaderAuthorName from "../component/card_view/card_section_header_author_name";
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
import ComponentColab_CardSectionHeaderAuthorName from "../component/card_view/card_section_header_author_name";
import { MODEL_COLLABORATION } from "../model/interface";
import ComponentColab_JumlahPartisipan from "../component/card_view/card_section_jumlah_partisipan";
import { MODEL_COLLABORATION } from "../model/interface";
import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
export default function Colab_Beranda({
listData,
@@ -40,7 +31,7 @@ export default function Colab_Beranda({
return (
<>
<Affix position={{ bottom: rem(150), right: rem(30) }}>
{/* <Affix position={{ bottom: rem(150), right: rem(30) }}>
<ActionIcon
loading={loadingCreate ? true : false}
opacity={scroll.y > 0 ? 0.5 : ""}
@@ -58,7 +49,9 @@ export default function Colab_Beranda({
>
<IconPencilPlus color="white" />
</ActionIcon>
</Affix>
</Affix> */}
<ComponentGlobal_CreateButton path={RouterColab.create} />
{/* <pre>{JSON.stringify(listData, null, 2)}</pre> */}

View File

@@ -9,20 +9,24 @@ import {
Footer,
Grid,
Indicator,
SimpleGrid,
Stack,
Text
Text,
} from "@mantine/core";
import {
IconBell,
IconHome,
IconMessages,
IconUsersGroup
IconUsersGroup,
} from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import ComponentColab_HeaderTamplate from "../component/header_tamplate";
import { gs_colab_hot_menu } from "../global_state";
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";
export default function LayoutColab_Main({
children,
@@ -78,51 +82,74 @@ export default function LayoutColab_Main({
return (
<>
<AppComponentGlobal_LayoutTamplate
<UIGlobal_LayoutTamplate
header={
<ComponentColab_HeaderTamplate
<UIGlobal_LayoutHeaderTamplate
title="Project Collaboration"
route={RouterHome.main_home}
// icon={<IconUsersGroup />}
// route2={RouterColab.proyek}
routerLeft={RouterHome.main_home}
/>
}
footer={
<Footer height={"10vh"} bg={"black"}>
{/* {value} */}
<Stack justify="center" h={"100%"}>
<Grid>
{listFooter.map((e) => (
<Grid.Col key={e.id} span={"auto"} pt={"md"}>
<Center>
<Stack
align="center"
spacing={0}
onClick={() => {
router.replace(e.path);
setHotMenu(e.id);
}}
>
<ActionIcon
variant="transparent"
c={hotMenu === e.id ? "blue" : "white"}
>
{e.icon}
</ActionIcon>
<Text fz={10} c={hotMenu === e.id ? "blue" : "white"}>
{e.name}
</Text>
</Stack>
</Center>
</Grid.Col>
))}
</Grid>
</Stack>
</Footer>
<SimpleGrid cols={4} h={"9vh"} mx={"xs"}>
{listFooter.map((e) => (
<Stack key={e.id} align="center" justify="center" spacing={0}>
<ActionIcon
// disabled={e.path === "" ? true : false}
variant="transparent"
c={hotMenu === e.id ? MainColor.yellow : "white"}
onClick={() => {
router.replace(e.path, {scroll: false});
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={"black"}>
// {/* {value} */}
// <Stack justify="center" h={"100%"}>
// <Grid>
// {listFooter.map((e) => (
// <Grid.Col key={e.id} span={"auto"} pt={"md"}>
// <Center>
// <Stack
// align="center"
// spacing={0}
// onClick={() => {
// router.replace(e.path);
// setHotMenu(e.id);
// }}
// >
// <ActionIcon
// variant="transparent"
// c={hotMenu === e.id ? "blue" : "white"}
// >
// {e.icon}
// </ActionIcon>
// <Text fz={10} c={hotMenu === e.id ? "blue" : "white"}>
// {e.name}
// </Text>
// </Stack>
// </Center>
// </Grid.Col>
// ))}
// </Grid>
// </Stack>
// </Footer>
}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}