tambah division api index
This commit is contained in:
3
.gitignore
vendored
3
.gitignore
vendored
@@ -28,6 +28,9 @@ yarn-error.log*
|
||||
# local env files
|
||||
.env*.local
|
||||
|
||||
# env
|
||||
.env
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
|
||||
@@ -38,11 +38,14 @@
|
||||
"embla-carousel-react": "^7.1.0",
|
||||
"lodash": "^4.17.21",
|
||||
"next": "14.2.4",
|
||||
"prettier": "^3.3.2",
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"react-icons": "^5.2.1",
|
||||
"react-simple-toasts": "^5.10.0",
|
||||
"recharts": "2"
|
||||
"readdirp": "^3.6.0",
|
||||
"recharts": "2",
|
||||
"yargs": "^17.7.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.14.9",
|
||||
|
||||
9
src/app/(application)/announcement/[id]/page.tsx
Normal file
9
src/app/(application)/announcement/[id]/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewDetailAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page({ params }: { params: { id: string } }) {
|
||||
return (
|
||||
<ViewDetailAnnouncement data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/create/page.tsx
Normal file
9
src/app/(application)/announcement/create/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewCreateAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewCreateAnnouncement />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/edit/[id]/page.tsx
Normal file
9
src/app/(application)/announcement/edit/[id]/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewEditAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page({ params }: { params: { id: any } }) {
|
||||
return (
|
||||
<ViewEditAnnouncement data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/announcement/page.tsx
Normal file
9
src/app/(application)/announcement/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewListAnnouncement } from "@/module/announcement";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewListAnnouncement/>
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/group/page.tsx
Normal file
10
src/app/(application)/group/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewGroup } from '@/module/group';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewGroup />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/member/[id]/page.tsx
Normal file
10
src/app/(application)/member/[id]/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewDetailMember } from "@/module/user/member";
|
||||
|
||||
function Page({ params }: { params: { id: string } }) {
|
||||
return (
|
||||
<ViewDetailMember data={params.id} />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
|
||||
9
src/app/(application)/member/create/page.tsx
Normal file
9
src/app/(application)/member/create/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewCreateMember } from "@/module/user/member";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewCreateMember />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/member/page.tsx
Normal file
9
src/app/(application)/member/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewListMember } from "@/module/user/member";
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewListMember />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page;
|
||||
10
src/app/(application)/notification/page.tsx
Normal file
10
src/app/(application)/notification/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewNotification } from '@/module/notification';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewNotification />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
11
src/app/(application)/position/page.tsx
Normal file
11
src/app/(application)/position/page.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<div>
|
||||
Page
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
9
src/app/(application)/profile/edit/page.tsx
Normal file
9
src/app/(application)/profile/edit/page.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { ViewEditProfile } from "@/module/user"
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewEditProfile />
|
||||
)
|
||||
}
|
||||
|
||||
export default Page
|
||||
10
src/app/(application)/project/page.tsx
Normal file
10
src/app/(application)/project/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { ViewProject } from '@/module/project';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewProject />
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -32,8 +32,10 @@ export default function RootLayout({
|
||||
</head>
|
||||
<body className={`${LatoFont.className}`} suppressHydrationWarning>
|
||||
<MantineProvider>
|
||||
<Box bg={'#252A2F'}>
|
||||
<Container h={"100vh"} p={0} size={rem(550)} bg={WARNA.bgWhite}>
|
||||
<Box bg={'#252A2F'} pos={"fixed"} w={"100%"} h={"100%"} style={{
|
||||
overflowY: "auto"
|
||||
}}>
|
||||
<Container mih={'100vh'} p={0} size={rem(550)} bg={WARNA.bgWhite}>
|
||||
{children}
|
||||
</Container>
|
||||
</Box>
|
||||
|
||||
5
src/app/loading.tsx
Normal file
5
src/app/loading.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import { LoadingPage } from "@/module/_global";
|
||||
|
||||
export default function Loading() {
|
||||
return <LoadingPage />
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
export const WARNA = {
|
||||
bgWhite: "#F4F9FD",
|
||||
biruTua: "#19345E",
|
||||
bgIcon: "#384288"
|
||||
bgIcon: "#384288",
|
||||
borderOrange: "#FCAA4B"
|
||||
}
|
||||
@@ -1,7 +1,15 @@
|
||||
import { WARNA } from "./fun/WARNA";
|
||||
import LayoutDrawer from "./layout/layout_drawer";
|
||||
import LayoutIconBack from "./layout/layout_icon_back";
|
||||
import LoadingPage from "./layout/layout_loading_page";
|
||||
import LayoutLogin from "./layout/layout_login";
|
||||
import LayoutNavbarHome from "./layout/layout_navbar_home";
|
||||
import { isDrawer } from "./val/isDrawer";
|
||||
|
||||
export { WARNA }
|
||||
export { LayoutLogin }
|
||||
export {LayoutNavbarHome}
|
||||
export { LayoutNavbarHome }
|
||||
export { LayoutIconBack }
|
||||
export { LoadingPage }
|
||||
export { LayoutDrawer }
|
||||
export { isDrawer }
|
||||
20
src/module/_global/layout/layout_drawer.tsx
Normal file
20
src/module/_global/layout/layout_drawer.tsx
Normal file
@@ -0,0 +1,20 @@
|
||||
import { Box, Drawer, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { WARNA } from '../fun/WARNA';
|
||||
|
||||
export default function LayoutDrawer({ opened, onClose, title, children }: { children: React.ReactNode, opened: boolean, onClose: () => void, title: React.ReactNode }) {
|
||||
return (
|
||||
<Box>
|
||||
<Drawer opened={opened} title={<Text c={WARNA.biruTua} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={"35%"}
|
||||
styles={{
|
||||
content: {
|
||||
backgroundColor: "white",
|
||||
borderRadius: "20px 20px 0px 0px",
|
||||
},
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</Drawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
27
src/module/_global/layout/layout_icon_back.tsx
Normal file
27
src/module/_global/layout/layout_icon_back.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
'use client'
|
||||
import { ActionIcon, Box } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiChevronLeft } from 'react-icons/hi2';
|
||||
import { WARNA } from '../fun/WARNA';
|
||||
import _ from 'lodash';
|
||||
|
||||
function LayoutIconBack({ back }: { back?: string }) {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<ActionIcon variant="light" onClick={() => {
|
||||
if (!_.isUndefined(back) && !_.isNull(back)) {
|
||||
return router.push(back)
|
||||
} else {
|
||||
return router.back()
|
||||
}
|
||||
|
||||
}} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiChevronLeft size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default LayoutIconBack;
|
||||
33
src/module/_global/layout/layout_loading_page.tsx
Normal file
33
src/module/_global/layout/layout_loading_page.tsx
Normal file
@@ -0,0 +1,33 @@
|
||||
import { Box, Group, Skeleton, Text } from "@mantine/core";
|
||||
import LayoutNavbarHome from "./layout_navbar_home";
|
||||
|
||||
export default function LoadingPage() {
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Text></Text>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<Skeleton width={"100%"} height={180} radius={"md"} />
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
<Skeleton height={50} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
<Group my={20} justify="space-between" grow>
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
<Skeleton height={100} radius={"md"} />
|
||||
</Group>
|
||||
</Box>
|
||||
</>
|
||||
|
||||
)
|
||||
}
|
||||
@@ -4,16 +4,15 @@ import { WARNA } from '../fun/WARNA';
|
||||
|
||||
export const LayoutNavbarHome = ({ children }: { children: React.ReactNode }) => {
|
||||
return (
|
||||
<>
|
||||
<Box pt={25} pl={20} pr={20} m={0} pb={25} bg={WARNA.biruTua}
|
||||
<Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={WARNA.biruTua}
|
||||
style={{
|
||||
borderBottomLeftRadius: 20,
|
||||
borderBottomRightRadius: 20,
|
||||
zIndex: 100
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
export default LayoutNavbarHome
|
||||
4
src/module/_global/val/isDrawer.ts
Normal file
4
src/module/_global/val/isDrawer.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
'use client'
|
||||
import { hookstate } from '@hookstate/core';
|
||||
|
||||
export const isDrawer = hookstate(false)
|
||||
37
src/module/announcement/component/detail_announcement.tsx
Normal file
37
src/module/announcement/component/detail_announcement.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import { Box, Group, Stack, Text } from "@mantine/core";
|
||||
import { BsCardText } from "react-icons/bs";
|
||||
import { TfiAnnouncement } from "react-icons/tfi";
|
||||
|
||||
export default function DetailAnnouncement() {
|
||||
return (
|
||||
<Box py={30} px={20}>
|
||||
<Box p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
|
||||
<Stack>
|
||||
<Group>
|
||||
<TfiAnnouncement size={25} />
|
||||
<Text fw={'bold'}>Pengumuman Dinas</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<BsCardText size={25} />
|
||||
<Text>Pengumuman agar menggunakan</Text>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box my={15} p={20} style={{ borderRadius: 10, border: '1px solid #E5E5E5' }} bg={'white'} >
|
||||
<Stack>
|
||||
<Text fw={'bold'}>Anggota</Text>
|
||||
<Group>
|
||||
<Text>LPD</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text>PKK</Text>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text>Karang Taruna</Text>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
)
|
||||
}
|
||||
92
src/module/announcement/component/list_announcement.tsx
Normal file
92
src/module/announcement/component/list_announcement.tsx
Normal file
@@ -0,0 +1,92 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Anchor, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { TfiAnnouncement } from "react-icons/tfi";
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
const dataPengumuman = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Lembaga Pengkreditan Desa',
|
||||
desc: 'Diharapkan semua untuk melakukan upacara ben...'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListAnnouncement() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataPengumuman.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i} onClick={() => {
|
||||
router.push(`/announcement/${v.id}`)
|
||||
}}>
|
||||
<Group align='center' style={{
|
||||
borderBottom: `1px solid #D9D9D9`,
|
||||
padding: 10,
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
|
||||
<TfiAnnouncement color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
48
src/module/announcement/component/ui/drawer_announcement.tsx
Normal file
48
src/module/announcement/component/ui/drawer_announcement.tsx
Normal file
@@ -0,0 +1,48 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
import { RiFilter2Line } from "react-icons/ri";
|
||||
|
||||
export default function DrawerAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
|
||||
function onCLose() {
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
onClick={() => {
|
||||
router.push('/announcement/create')
|
||||
onCLose()
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Tambah Pengumuman</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<RiFilter2Line size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Filter</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,45 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { FaPencil, FaTrash } from 'react-icons/fa6';
|
||||
|
||||
export default function DrawerDetailAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
|
||||
function onCLose() {
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}>
|
||||
<Box>
|
||||
<FaTrash size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Hapus</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => {
|
||||
router.push('edit/123')
|
||||
onCLose()
|
||||
}}>
|
||||
<Box>
|
||||
<FaPencil size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Edit</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
37
src/module/announcement/component/ui/navbar_announcement.tsx
Normal file
37
src/module/announcement/component/ui/navbar_announcement.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
"use client"
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import DrawerAnnouncement from './drawer_announcement';
|
||||
|
||||
export default function NavbarAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>PENGUMUMAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerAnnouncement />
|
||||
</LayoutDrawer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from "@/module/_global";
|
||||
import { Box, Grid, Text } from "@mantine/core";
|
||||
|
||||
export default function NavbarCreateAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Tambah Pengumuman</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from "@/module/_global";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { ActionIcon, Box, Grid, Group, Text } from "@mantine/core";
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerDetailAnnouncement from "./drawer_detail_announcement";
|
||||
|
||||
export default function NavbarDetailAnnouncement() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>PENGUMUMAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerDetailAnnouncement />
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from "@/module/_global";
|
||||
import { Box, Grid, Text } from "@mantine/core";
|
||||
|
||||
export default function NavbarEditAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Edit Pengumuman</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
import ViewCreateAnnouncement from "./view/view_create_announcement";
|
||||
import ViewDetailAnnouncement from "./view/view_detail_anouncement";
|
||||
import ViewEditAnnouncement from "./view/view_edit_announcement";
|
||||
import ViewListAnnouncement from "./view/view_list_announcement";
|
||||
|
||||
export { ViewListAnnouncement }
|
||||
export { ViewCreateAnnouncement }
|
||||
export { ViewDetailAnnouncement }
|
||||
export { ViewEditAnnouncement }
|
||||
60
src/module/announcement/view/view_create_announcement.tsx
Normal file
60
src/module/announcement/view/view_create_announcement.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { Box, Stack, TextInput, Button, Textarea } from "@mantine/core";
|
||||
import { HiOutlineChevronRight, HiUser } from "react-icons/hi2";
|
||||
import NavbarCreateAnnouncement from "../component/ui/navbar_create_announcement";
|
||||
|
||||
export default function ViewCreateAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarCreateAnnouncement />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Textarea
|
||||
size="md"
|
||||
radius={20}
|
||||
w={"100%"}
|
||||
label="Pengumuman"
|
||||
withAsterisk
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
|
||||
<Button rightSection={<HiOutlineChevronRight size={14} />} variant="default" fullWidth radius={30} size="md" mt={10}>
|
||||
Pilih Anggota
|
||||
</Button>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
12
src/module/announcement/view/view_detail_anouncement.tsx
Normal file
12
src/module/announcement/view/view_detail_anouncement.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import DetailAnnouncement from "../component/detail_announcement";
|
||||
import NavbarDetailAnnouncement from "../component/ui/navbar_detail_announcement";
|
||||
|
||||
export default function ViewDetailAnnouncement({ data }: { data: string }) {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarDetailAnnouncement />
|
||||
<DetailAnnouncement />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
60
src/module/announcement/view/view_edit_announcement.tsx
Normal file
60
src/module/announcement/view/view_edit_announcement.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { Box, Button, Stack, Textarea, TextInput } from "@mantine/core";
|
||||
import NavbarEditAnnouncement from "../component/ui/navbar_edit_announcement";
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { HiOutlineChevronRight } from "react-icons/hi2";
|
||||
|
||||
export default function ViewEditAnnouncement({ data }: { data: string }) {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarEditAnnouncement />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Judul Pengumuman" withAsterisk label="Judul" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Textarea
|
||||
size="md"
|
||||
radius={20}
|
||||
w={"100%"}
|
||||
label="Pengumuman"
|
||||
withAsterisk
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
|
||||
<Button rightSection={<HiOutlineChevronRight size={14} />} variant="default" fullWidth radius={30} size="md" mt={10}>
|
||||
Pilih Anggota
|
||||
</Button>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
12
src/module/announcement/view/view_list_announcement.tsx
Normal file
12
src/module/announcement/view/view_list_announcement.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import NavbarAnnouncement from "../component/ui/navbar_announcement";
|
||||
import ListAnnouncement from "../component/list_announcement";
|
||||
|
||||
export default function ViewListAnnouncement() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarAnnouncement />
|
||||
<ListAnnouncement />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -1,16 +1,13 @@
|
||||
type Method = "GET" | "POST"
|
||||
|
||||
const listApi = [
|
||||
{
|
||||
"page": ""
|
||||
}
|
||||
]
|
||||
import { API_INDEX } from "./api_index";
|
||||
type Method = "GET" | "POST";
|
||||
|
||||
export async function apiDivision(req: Request, method: Method) {
|
||||
const { searchParams } = new URL(req.url)
|
||||
const page = searchParams.get("page")
|
||||
const { searchParams } = new URL(req.url);
|
||||
const path = searchParams.get("path");
|
||||
const act = API_INDEX.find((v) => v.path === path && v.method === method);
|
||||
if (!path)
|
||||
return Response.json({ message: "page not found" }, { status: 404 });
|
||||
if (act) return act.bin(req);
|
||||
|
||||
if (!page) return Response.json({ message: "page not found" }, { status: 404 })
|
||||
|
||||
return Response.json({ message: "ok" })
|
||||
}
|
||||
return Response.json({ message: "404" });
|
||||
}
|
||||
|
||||
14
src/module/division/api/api_index.ts
Normal file
14
src/module/division/api/api_index.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import { createProject } from "./post/createProject";
|
||||
import { listProject } from "./get/listProject";
|
||||
export const API_INDEX = [
|
||||
{
|
||||
path: "create-project",
|
||||
method: "POST",
|
||||
bin: createProject,
|
||||
},
|
||||
{
|
||||
path: "list-project",
|
||||
method: "GET",
|
||||
bin: listProject,
|
||||
},
|
||||
];
|
||||
3
src/module/division/api/get/listProject.ts
Normal file
3
src/module/division/api/get/listProject.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export function listProject(req: Request) {
|
||||
return Response.json({ message: "ini adalah project" })
|
||||
}
|
||||
3
src/module/division/api/post/createProject.ts
Normal file
3
src/module/division/api/post/createProject.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export async function createProject(req: Request) {
|
||||
return Response.json({ message: "success create projects" })
|
||||
}
|
||||
84
src/module/group/components/list_group.tsx
Normal file
84
src/module/group/components/list_group.tsx
Normal file
@@ -0,0 +1,84 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiOutlineOfficeBuilding } from 'react-icons/hi';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import EditDrawerGroup from './ui/edit_drawer_group';
|
||||
|
||||
const dataGroup = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Lembaga Pengkreditan Desa'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListGroup() {
|
||||
return (
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataGroup.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i}>
|
||||
<Group align='center' style={{
|
||||
border: `1px solid ${"#DCEED8"}`,
|
||||
padding: 10,
|
||||
borderRadius: 10
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={'#DCEED8'} size={50} radius={100} aria-label="icon">
|
||||
<HiOutlineOfficeBuilding color={WARNA.biruTua} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
{/* <LayoutDrawer opened={openDrawer} onClose={() => setOpenDrawer(false)} title="LEMBAGA PENGKREDITAN DESA">
|
||||
<EditDrawerGroup />
|
||||
</LayoutDrawer> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
62
src/module/group/components/ui/drawer_group.tsx
Normal file
62
src/module/group/components/ui/drawer_group.tsx
Normal file
@@ -0,0 +1,62 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
|
||||
export default function DrawerGroup() {
|
||||
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
|
||||
function onCLose() {
|
||||
setOpenDrawerGroup(false)
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
onClick={() => setOpenDrawerGroup(true)}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Tambah Group</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'TAMBAH GRUP'}>
|
||||
<Box pt={10}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="lg"
|
||||
radius={10}
|
||||
placeholder="Tambah Grup"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
MASUK
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
71
src/module/group/components/ui/edit_drawer_group.tsx
Normal file
71
src/module/group/components/ui/edit_drawer_group.tsx
Normal file
@@ -0,0 +1,71 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
|
||||
export default function EditDrawerGroup() {
|
||||
// const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
|
||||
// const [openDrawer, setOpenDrawer] = useAtom(isDrawer)
|
||||
|
||||
// function onCLose() {
|
||||
// setOpenDrawerGroup(false)
|
||||
// setOpenDrawer(false)
|
||||
// }
|
||||
return (
|
||||
<Box>
|
||||
{/* <Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
onClick={() => setOpenDrawerGroup(true)}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Tidak Aktif</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua}>Edit</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'EDIT GRUP'}>
|
||||
<Box pt={10}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="lg"
|
||||
radius={10}
|
||||
placeholder="Edit Grup"
|
||||
/>
|
||||
<Box mt={'xl'}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onCLose}
|
||||
>
|
||||
EDIT
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</LayoutDrawer> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
38
src/module/group/components/ui/navbar_group.tsx
Normal file
38
src/module/group/components/ui/navbar_group.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
"use client"
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerGroup from './drawer_group';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
|
||||
export default function NavbarGroup() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>GROUP</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerGroup />
|
||||
</LayoutDrawer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
import ViewGroup from "./view/view_group";
|
||||
|
||||
export {ViewGroup}
|
||||
14
src/module/group/view/view_group.tsx
Normal file
14
src/module/group/view/view_group.tsx
Normal file
@@ -0,0 +1,14 @@
|
||||
import React from 'react';
|
||||
import NavbarGroup from '../components/ui/navbar_group';
|
||||
import { Box } from '@mantine/core';
|
||||
import ListGroup from '../components/list_group';
|
||||
|
||||
export default function ViewGroup() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarGroup />
|
||||
<ListGroup />
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -28,7 +28,7 @@ export default function Features() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Divisi</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/project')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
@@ -42,7 +42,7 @@ export default function Features() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Proyek</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/announcement')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
|
||||
26
src/module/home/components/ui/icon_navbar.tsx
Normal file
26
src/module/home/components/ui/icon_navbar.tsx
Normal file
@@ -0,0 +1,26 @@
|
||||
"use client"
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from 'react-icons/hi2';
|
||||
|
||||
export default function IconNavbar() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<Group>
|
||||
<ActionIcon onClick={()=> router.push('/search')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMagnifyingGlass size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<ActionIcon onClick={()=> router.push('/notification')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineBell size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<ActionIcon onClick={()=> router.push('/profile')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineUser size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@ import { HiMiniUserGroup, HiMiniPresentationChartBar, HiMegaphone, HiSquares2X2,
|
||||
import { PiUsersFourFill } from "react-icons/pi";
|
||||
import { FaUsersRays, FaUserTie } from "react-icons/fa6";
|
||||
import { useRouter } from 'next/navigation';
|
||||
import LayoutIconBack from '@/module/_global/layout/layout_icon_back';
|
||||
|
||||
export default function ViewDetailFeature() {
|
||||
const router = useRouter()
|
||||
@@ -13,10 +14,8 @@ export default function ViewDetailFeature() {
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<ActionIcon variant="light" onClick={() => router.push('/home')} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiChevronLeft size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >SEMUA FITUR</Text>
|
||||
@@ -43,7 +42,7 @@ export default function ViewDetailFeature() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Divisi</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/project')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
@@ -57,7 +56,7 @@ export default function ViewDetailFeature() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Proyek</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/announcement')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
@@ -71,7 +70,7 @@ export default function ViewDetailFeature() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Pengumuman</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/member')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
@@ -85,7 +84,7 @@ export default function ViewDetailFeature() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Anggota</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/group')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
@@ -99,7 +98,7 @@ export default function ViewDetailFeature() {
|
||||
<Text fz={15} c={WARNA.biruTua}>Group</Text>
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Box onClick={() => router.push('/position')}>
|
||||
<Center>
|
||||
<ActionIcon variant="gradient"
|
||||
size={68}
|
||||
|
||||
@@ -1,30 +1,20 @@
|
||||
import { LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Group, rem, Stack, Text } from '@mantine/core';
|
||||
import { ActionIcon, Anchor, Box, Group, rem, Stack, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from "react-icons/hi2";
|
||||
import Carosole from '../components/carosole';
|
||||
import Features from '../components/features';
|
||||
// import { useRouter } from 'next/navigation';
|
||||
import IconNavbar from '../components/ui/icon_navbar';
|
||||
|
||||
|
||||
|
||||
export default function ViewHome() {
|
||||
// const router = useRouter()
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Group justify='space-between'>
|
||||
<Text fw={'bold'} c={'white'} >Perbekal Darmasaba</Text>
|
||||
<Group>
|
||||
{/* <ActionIcon onClick={() => router.push('/search')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMagnifyingGlass size={20} color='white' />
|
||||
</ActionIcon> */}
|
||||
<ActionIcon variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineBell size={20} color='white' />
|
||||
</ActionIcon>
|
||||
<ActionIcon variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiOutlineUser size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
<IconNavbar/>
|
||||
</Group>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
|
||||
94
src/module/notification/components/list_notification.tsx
Normal file
94
src/module/notification/components/list_notification.tsx
Normal file
@@ -0,0 +1,94 @@
|
||||
"use client"
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiUser } from 'react-icons/hi2';
|
||||
|
||||
const dataNotification = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'Rapat Kamis',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: 'Rapat Jumat',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: 'Rapat Senin',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: 'Rapat Selasa',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'Rapat Rabu',
|
||||
description: 'Dipta menambahkan berkas di document dan file.',
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListNotification() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
{dataNotification.map((v, i) => {
|
||||
return (
|
||||
<Grid style={{
|
||||
border: `1px solid ${WARNA.borderOrange}`,
|
||||
padding: 15,
|
||||
borderRadius: 15
|
||||
}} gutter={1} key={i} mb={"sm"}>
|
||||
<Grid.Col span={3} pl={'xs'}>
|
||||
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
|
||||
<HiUser size={30} color='white' />
|
||||
</ActionIcon>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={9}>
|
||||
<Box>
|
||||
<Text fw={'bold'} fz={18}>{v.title}</Text>
|
||||
<Text fz={15}>{v.description}</Text>
|
||||
</Box>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
"use client"
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
|
||||
export default function NavbarNotification() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >NOTIFIKASI</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
);
|
||||
}
|
||||
|
||||
3
src/module/notification/index.ts
Normal file
3
src/module/notification/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import ViewNotification from "./view/view_notification";
|
||||
|
||||
export {ViewNotification}
|
||||
16
src/module/notification/view/view_notification.tsx
Normal file
16
src/module/notification/view/view_notification.tsx
Normal file
@@ -0,0 +1,16 @@
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global'
|
||||
import { Box, Grid, Text } from '@mantine/core'
|
||||
import React from 'react'
|
||||
import NavbarNotification from '../components/ui/navbar_notification'
|
||||
import ListNotification from '../components/list_notification'
|
||||
|
||||
export default function ViewNotification() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarNotification />
|
||||
<Box p={20}>
|
||||
<ListNotification />
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
import ViewProject from "./view/view_project";
|
||||
|
||||
export {ViewProject}
|
||||
10
src/module/project/view/view_project.tsx
Normal file
10
src/module/project/view/view_project.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import React from 'react';
|
||||
|
||||
export default function ViewProject() {
|
||||
return (
|
||||
<div>
|
||||
ViewProject
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
25
src/module/search/components/ui/navbar_search.tsx
Normal file
25
src/module/search/components/ui/navbar_search.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
"use client"
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
|
||||
export default function NavbarSearch() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >PENCARIAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,27 +1,15 @@
|
||||
'use client'
|
||||
import { LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
|
||||
import { LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Box, Grid, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { HiChevronLeft, HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import NavbarSearch from '../components/ui/navbar_search';
|
||||
|
||||
export default function ViewSearch() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<ActionIcon variant="light" onClick={() => router.push('/home')} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiChevronLeft size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'} >PENCARIAN</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<NavbarSearch />
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
@@ -33,7 +21,7 @@ export default function ViewSearch() {
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20}/>}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
</Box>
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
import ViewEditProfile from "./profile/view/view_edit_profile";
|
||||
import ViewProfile from "./profile/view/view_profile";
|
||||
|
||||
export { ViewProfile }
|
||||
export { ViewProfile }
|
||||
export { ViewEditProfile }
|
||||
91
src/module/user/member/component/list_member.tsx
Normal file
91
src/module/user/member/component/list_member.tsx
Normal file
@@ -0,0 +1,91 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { ActionIcon, Anchor, Box, Group, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { HiMagnifyingGlass, HiMiniUser } from 'react-icons/hi2';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
const dataMember = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Ali akbar',
|
||||
desc: 'Perbekel'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Fibra Marcell',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Burhan',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Chandra',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'Ayu',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'Heriawan',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: 'Jinan',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
name: 'Rizal',
|
||||
desc: 'Kasi Kesejahteraan'
|
||||
},
|
||||
]
|
||||
|
||||
export default function ListMember() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
{dataMember.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i} onClick={() => {
|
||||
router.push(`/member/${v.id}`)
|
||||
}}>
|
||||
<Group align='center' style={{
|
||||
borderBottom: `1px solid #D9D9D9`,
|
||||
padding: 10,
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
|
||||
<HiMiniUser color={'white'} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
48
src/module/user/member/component/ui/drawer_list_member.tsx
Normal file
48
src/module/user/member/component/ui/drawer_list_member.tsx
Normal file
@@ -0,0 +1,48 @@
|
||||
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
import { RiFilter2Line } from 'react-icons/ri';
|
||||
|
||||
export default function DrawerListMember() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
const router = useRouter()
|
||||
|
||||
function onCLose() {
|
||||
openDrawer.set(false)
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
||||
>
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
onClick={() => {
|
||||
router.push('/member/create')
|
||||
onCLose()
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<IoAddCircle size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Tambah Anggota</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'} >
|
||||
<Box>
|
||||
<RiFilter2Line size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Filter</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
23
src/module/user/member/component/ui/navbar_create_member.tsx
Normal file
23
src/module/user/member/component/ui/navbar_create_member.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
|
||||
export default function NavbarCreateMember() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>Tambah Anggota</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
34
src/module/user/member/component/ui/navbar_list_member.tsx
Normal file
34
src/module/user/member/component/ui/navbar_list_member.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from "@/module/_global";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { ActionIcon, Box, Grid, Group, Text } from "@mantine/core";
|
||||
import { HiMenu } from "react-icons/hi";
|
||||
import DrawerListMember from "./drawer_list_member";
|
||||
|
||||
export default function NavbarListMember() {
|
||||
const openDrawer = useHookstate(isDrawer)
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack back='/home' />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>ANGGOTA</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto">
|
||||
<Group justify='flex-end'>
|
||||
<ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
|
||||
<HiMenu size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
<LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
|
||||
<DrawerListMember />
|
||||
</LayoutDrawer>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
import ViewCreateMember from "./view/view_create_member";
|
||||
import ViewDetailMember from "./view/view_detail_member";
|
||||
import ViewListMember from "./view/view_list_member";
|
||||
|
||||
export { ViewListMember }
|
||||
export { ViewCreateMember }
|
||||
export { ViewDetailMember }
|
||||
77
src/module/user/member/view/view_create_member.tsx
Normal file
77
src/module/user/member/view/view_create_member.tsx
Normal file
@@ -0,0 +1,77 @@
|
||||
import { Box, Button, Stack, TextInput } from "@mantine/core";
|
||||
import NavbarCreateMember from "../component/ui/navbar_create_member";
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { HiUser } from "react-icons/hi2";
|
||||
|
||||
export default function ViewCreateMember() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarCreateMember />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<Box bg={WARNA.biruTua} py={30} px={50}
|
||||
style={{
|
||||
borderRadius: 10,
|
||||
}}>
|
||||
<HiUser size={100} color={WARNA.bgWhite} />
|
||||
</Box>
|
||||
<TextInput
|
||||
size="md" type="number" radius={30} placeholder="NIK" withAsterisk label="NIK" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Nama" withAsterisk label="Nama" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="email" radius={30} placeholder="Email" withAsterisk label="Email" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="number" radius={30} placeholder="+62...." withAsterisk label="Nomor Telepon" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
55
src/module/user/member/view/view_detail_member.tsx
Normal file
55
src/module/user/member/view/view_detail_member.tsx
Normal file
@@ -0,0 +1,55 @@
|
||||
import { LayoutNavbarHome, LayoutIconBack, WARNA } from "@/module/_global";
|
||||
import { ActionIcon, Box, Group, Stack, Text } from "@mantine/core";
|
||||
import { BsInfo } from "react-icons/bs";
|
||||
import { FaSquarePhone } from "react-icons/fa6";
|
||||
import { HiUser } from "react-icons/hi2";
|
||||
import { MdEmail } from "react-icons/md";
|
||||
import { RiIdCardFill } from "react-icons/ri";
|
||||
|
||||
export default function ViewDetailMember({ data }: { data: string }) {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Group justify="space-between">
|
||||
<LayoutIconBack />
|
||||
<ActionIcon variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info">
|
||||
<BsInfo size={20} color='white' />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
>
|
||||
<HiUser size={100} color='white' />
|
||||
<Text c={'white'} fw={'bold'} fz={25}>Fibra Marcell</Text>
|
||||
<Text c={'white'} fw={'lighter'} fz={15}>Kepala Urusan Pengembangan</Text>
|
||||
</Stack>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<RiIdCardFill size={28} />
|
||||
<Text fz={18}>NIK</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>513177782899</Text>
|
||||
</Group>
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<FaSquarePhone size={28} />
|
||||
<Text fz={18}>NoTelepon</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>+62038939293</Text>
|
||||
</Group>
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<MdEmail size={28} />
|
||||
<Text fz={18}>Email</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>marcel@gmail.com</Text>
|
||||
</Group>
|
||||
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
12
src/module/user/member/view/view_list_member.tsx
Normal file
12
src/module/user/member/view/view_list_member.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import { Box } from "@mantine/core";
|
||||
import NavbarListMember from "../component/ui/navbar_list_member";
|
||||
import ListMember from "../component/list_member";
|
||||
|
||||
export default function ViewListMember() {
|
||||
return (
|
||||
<Box>
|
||||
<NavbarListMember />
|
||||
<ListMember />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
23
src/module/user/profile/component/ui/header_edit_profile.tsx
Normal file
23
src/module/user/profile/component/ui/header_edit_profile.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
'use client'
|
||||
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global';
|
||||
import { Box, Grid, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
|
||||
export default function HeaderEditProfile() {
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarHome>
|
||||
<Grid justify='center' align='center'>
|
||||
<Grid.Col span="auto">
|
||||
<LayoutIconBack />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<Text ta={'center'} fw={'bold'} c={'white'}>EDIT PROFIL</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span="auto"></Grid.Col>
|
||||
</Grid>
|
||||
</LayoutNavbarHome>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
14
src/module/user/profile/component/ui/ui_profile.tsx
Normal file
14
src/module/user/profile/component/ui/ui_profile.tsx
Normal file
@@ -0,0 +1,14 @@
|
||||
'use client'
|
||||
import { Group, Text } from "@mantine/core";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
|
||||
export function InfoTitleProfile() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Text fw={'bold'} fz={20}>Informasi</Text>
|
||||
<Text ta={"right"} c={"blue"} onClick={() => router.push('/profile/edit')}>Edit</Text>
|
||||
</Group>
|
||||
)
|
||||
}
|
||||
77
src/module/user/profile/view/view_edit_profile.tsx
Normal file
77
src/module/user/profile/view/view_edit_profile.tsx
Normal file
@@ -0,0 +1,77 @@
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { Box, Button, Stack, TextInput } from "@mantine/core";
|
||||
import HeaderEditProfile from "../component/ui/header_edit_profile";
|
||||
import { HiUser } from "react-icons/hi2";
|
||||
|
||||
export default function ViewEditProfile() {
|
||||
return (
|
||||
<Box>
|
||||
<HeaderEditProfile />
|
||||
<Stack
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="xs"
|
||||
pt={30}
|
||||
px={20}
|
||||
>
|
||||
<Box bg={WARNA.biruTua} py={30} px={50}
|
||||
style={{
|
||||
borderRadius: 10,
|
||||
}}>
|
||||
<HiUser size={100} color={WARNA.bgWhite} />
|
||||
</Box>
|
||||
<TextInput
|
||||
size="md" type="number" radius={30} placeholder="NIK" withAsterisk label="NIK" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="text" radius={30} placeholder="Nama" withAsterisk label="Nama" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="email" radius={30} placeholder="Email" withAsterisk label="Email" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
size="md" type="number" radius={30} placeholder="+62...." withAsterisk label="Nomor Telepon" w={"100%"}
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
<Box mt={30} mx={20}>
|
||||
<Button
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="md"
|
||||
radius={30}
|
||||
fullWidth
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@@ -1,14 +1,18 @@
|
||||
import { LayoutNavbarHome, WARNA } from "@/module/_global";
|
||||
import { ActionIcon, Group, Stack, Text } from "@mantine/core";
|
||||
import { LayoutIconBack, LayoutNavbarHome, WARNA } from "@/module/_global";
|
||||
import { ActionIcon, Anchor, Box, Button, Flex, Group, Stack, Text } from "@mantine/core";
|
||||
import { BsInfo } from "react-icons/bs";
|
||||
import { HiUser } from "react-icons/hi2";
|
||||
import { RiIdCardFill } from "react-icons/ri";
|
||||
import { FaSquarePhone } from "react-icons/fa6";
|
||||
import { MdEmail } from "react-icons/md";
|
||||
import { InfoTitleProfile } from "../component/ui/ui_profile";
|
||||
|
||||
export default function ViewProfile() {
|
||||
return (
|
||||
<>
|
||||
<LayoutNavbarHome>
|
||||
<Group justify="space-between">
|
||||
<Text fw={'bold'} c={'white'}>Profile</Text>
|
||||
<LayoutIconBack />
|
||||
<ActionIcon variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info">
|
||||
<BsInfo size={20} color='white' />
|
||||
</ActionIcon>
|
||||
@@ -18,12 +22,36 @@ export default function ViewProfile() {
|
||||
justify="center"
|
||||
gap="xs"
|
||||
>
|
||||
|
||||
<HiUser size={150} color='white' />
|
||||
<HiUser size={100} color='white' />
|
||||
<Text c={'white'} fw={'bold'} fz={25}>Fibra Marcell</Text>
|
||||
<Text c={'white'} fw={'lighter'} fz={15}>Kepala Urusan Pengembangan</Text>
|
||||
</Stack>
|
||||
</LayoutNavbarHome>
|
||||
<Box p={20}>
|
||||
<InfoTitleProfile />
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<RiIdCardFill size={28} />
|
||||
<Text fz={18}>NIK</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>513177782899</Text>
|
||||
</Group>
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<FaSquarePhone size={28} />
|
||||
<Text fz={18}>NoTelepon</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>+62038939293</Text>
|
||||
</Group>
|
||||
<Group justify="space-between" grow py={5}>
|
||||
<Group>
|
||||
<MdEmail size={28} />
|
||||
<Text fz={18}>Email</Text>
|
||||
</Group>
|
||||
<Text fz={18} fw={'bold'} ta={"right"}>marcel@gmail.com</Text>
|
||||
</Group>
|
||||
|
||||
</Box>
|
||||
</>
|
||||
)
|
||||
}
|
||||
52
xgen/index.js
Normal file
52
xgen/index.js
Normal file
@@ -0,0 +1,52 @@
|
||||
const root = process.cwd();
|
||||
const yargs = require('yargs');
|
||||
const readdirp = require('readdirp');
|
||||
const path = require('path');
|
||||
const _ = require('lodash');
|
||||
const prettier = require('prettier');
|
||||
const fs = require('fs')
|
||||
; (() => {
|
||||
|
||||
yargs
|
||||
.command(
|
||||
'api-division',
|
||||
'generate division api',
|
||||
(yargs) => yargs,
|
||||
generateDivisionApi
|
||||
)
|
||||
.demandCommand(1)
|
||||
.recommendCommands()
|
||||
.help()
|
||||
.argv
|
||||
})()
|
||||
|
||||
|
||||
async function generateDivisionApi(argv) {
|
||||
const dir = path.join(root, 'src', 'module', 'division', 'api')
|
||||
const results = [];
|
||||
const listImport = []
|
||||
for await (const entry of readdirp(dir, { fileFilter: ['*.ts', '!api_division.ts', '!api_index.ts'], })) {
|
||||
const fileName = path.basename(entry.path, '.ts');
|
||||
const method = entry.path.split('/')[0].toUpperCase();
|
||||
const importPath = entry.path.replace('.ts', '')
|
||||
|
||||
const text = `
|
||||
{
|
||||
"path": "${_.kebabCase(fileName)}",
|
||||
"method": "${method}",
|
||||
"bin": ${fileName}
|
||||
}
|
||||
`
|
||||
results.push(text);
|
||||
listImport.push(`import {${fileName}} from "./${importPath}"`)
|
||||
}
|
||||
|
||||
const text = `
|
||||
${listImport.join('\n')}
|
||||
export const API_INDEX = [${results.join(',')}]
|
||||
`
|
||||
const formatted = await prettier.format(text, { parser: 'typescript' })
|
||||
fs.writeFileSync(path.join(dir, 'api_index.ts'), formatted)
|
||||
console.log("success")
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user