#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,9 +0,0 @@
import ComponentGlobal_V2_LoadingPage from "@/app_modules/_global/loading_page_v2";
export default async function Page() {
return (
<>
<ComponentGlobal_V2_LoadingPage />
</>
);
}

View File

@@ -21,6 +21,8 @@ import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import _ from "lodash";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
export default function Colab_Create({
listIndustri,
@@ -39,6 +41,12 @@ export default function Colab_Create({
<>
<Stack px={"sm"}>
<TextInput
maxLength={100}
styles={{
label: {
color: "white",
},
}}
label="Judul"
withAsterisk
placeholder="Masukan judul proyek"
@@ -51,6 +59,12 @@ export default function Colab_Create({
/>
<TextInput
styles={{
label: {
color: "white",
},
}}
maxLength={100}
label="Lokasi"
withAsterisk
placeholder="Masukan lokasi proyek"
@@ -63,6 +77,11 @@ export default function Colab_Create({
/>
<Select
styles={{
label: {
color: "white",
},
}}
placeholder="Pilih kategori industri"
label="Pilih Industri"
withAsterisk
@@ -96,30 +115,55 @@ export default function Colab_Create({
}}
/> */}
<Textarea
label="Tujuan Proyek"
placeholder="Masukan tujuan proyek"
withAsterisk
minRows={5}
onChange={(val) => {
setValue({
...value,
purpose: val.currentTarget.value,
});
}}
/>
<Stack spacing={5}>
<Textarea
styles={{
label: {
color: "white",
},
}}
maxLength={500}
label="Tujuan Proyek"
placeholder="Masukan tujuan proyek"
withAsterisk
minRows={5}
onChange={(val) => {
setValue({
...value,
purpose: val.currentTarget.value,
});
}}
/>
<ComponentGlobal_InputCountDown
lengthInput={value.purpose.length}
maxInput={500}
/>
</Stack>
<Stack spacing={5}>
<Textarea
styles={{
label: {
color: "white",
},
}}
maxLength={500}
label="Keuntungan "
placeholder="Masukan keuntungan dalam proyek"
minRows={5}
onChange={(val) => {
setValue({
...value,
benefit: val.currentTarget.value,
});
}}
/>
<ComponentGlobal_InputCountDown
lengthInput={value.benefit.length}
maxInput={500}
/>
</Stack>
<Textarea
label="Keuntungan "
placeholder="Masukan keuntungan dalam proyek"
minRows={5}
onChange={(val) => {
setValue({
...value,
benefit: val.currentTarget.value,
});
}}
/>
<ButtonAction value={value as any} />
</Stack>
</>
@@ -154,14 +198,30 @@ function ButtonAction({ value }: { value: any }) {
});
}
// console.log(value);
return (
<>
<Button
disabled={
!value.title ||
!value.lokasi ||
!value.purpose ||
!value.benefit ||
value.projectCollaborationMaster_IndustriId === 0
? true
: false
}
loaderPosition="center"
loading={loading ? true : false}
mt={"xl"}
radius={"xl"}
onClick={() => onSave()}
bg={MainColor.yellow}
color={"yellow"}
style={{
transition: "0.5s",
}}
>
Simpan
</Button>

View File

@@ -3,6 +3,8 @@
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import React from "react";
import ComponentColab_HeaderTamplate from "../component/header_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 LayoutColab_Create({
children,
@@ -11,11 +13,11 @@ export default function LayoutColab_Create({
}) {
return (
<>
<AppComponentGlobal_LayoutTamplate
header={<ComponentColab_HeaderTamplate title="Tambah Proyek" />}
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Tambah Proyek" />}
>
{children}
</AppComponentGlobal_LayoutTamplate>
</UIGlobal_LayoutTamplate>
</>
);
}

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>
</>
);
}

View File

@@ -1,8 +1,9 @@
"use client";
import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
import { Center, Image, Paper } from "@mantine/core";
import UIGlobal_SplashScreen from "@/app_modules/_global/ui/ui_splash";
import { useShallowEffect } from "@mantine/hooks";
import { IconAffiliate } from "@tabler/icons-react";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { gs_colab_hot_menu } from "../global_state";
@@ -15,17 +16,18 @@ export default function Colab_Splash() {
setTimeout(() => {
setHotMenu(1);
// setStatus("Publish");
router.replace(RouterColab.beranda);
router.replace(RouterColab.beranda, {scroll: false});
}, 1000);
}, []);
return (
<>
<Center h={"100vh"}>
{/* <Center h={"100vh"}>
<Paper p={{ base: 50, md: 60, lg: 80 }}>
<Image alt="logo" src={"/aset/colab/logo.png"} />
</Paper>
</Center>
</Center> */}
<UIGlobal_SplashScreen icon={<IconAffiliate size={300} />} />
</>
);
}