wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #14 from bipproduction/lukman/4-juli-2024

Browse Source 
Lukman/4 juli 2024
This commit is contained in:
Amalia
2024-07-04 16:50:15 +08:00
committed by GitHub
parent 4689266725 6e7774f0d5
commit 88777960dd
16 changed files with 246 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -34,6 +34,7 @@
"dayjs": "^1.11.11",
"embla-carousel-autoplay": "^7.1.0",
"embla-carousel-react": "^7.1.0",
"jotai": "^2.8.4",
"lodash": "^4.17.21",
"next": "14.2.4",
"react": "^18",

5
src/app/(application)/group/page.tsx
View File

@@ -1,10 +1,9 @@
import { ViewGroup } from '@/module/group';
import React from 'react';
function Page() {
return (
<div>
Page
</div>
<ViewGroup />
);
}

6
src/app/layout.tsx
View File

@@ -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>

6
src/module/_global/index.ts
View File

@@ -1,11 +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/idDrawer";
export { WARNA }
export { LayoutLogin }
export { LayoutNavbarHome }
export {LayoutIconBack}
export { LayoutIconBack }
export { LoadingPage }
export { LayoutDrawer }
export { isDrawer }

20
src/module/_global/layout/layout_drawer.tsx Normal file
View 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>
);
}

5
src/module/_global/layout/layout_navbar_home.tsx
View File

@@ -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

5
src/module/_global/val/idDrawer.ts Normal file
View File

@@ -0,0 +1,5 @@
'use client'
import { atom } from "jotai"
export const isDrawer = atom(false)

80
src/module/group/components/list_group.tsx Normal file
View File

@@ -0,0 +1,80 @@
import { 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';
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>
)
})}
</Box>
);
}

62
src/module/group/components/ui/drawer_group.tsx Normal file
View File

@@ -0,0 +1,62 @@
import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import { useAtom } from 'jotai';
import React, { useState } from 'react';
import { IoAddCircle } from "react-icons/io5";
export default function DrawerGroup() {
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}>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>
);
}

38
src/module/group/components/ui/navbar_group.tsx Normal file
View 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 { useAtom } from 'jotai';
import { useRouter } from 'next/navigation';
import React, { useState } from 'react';
import { HiMenu } from "react-icons/hi";
import DrawerGroup from './drawer_group';
export default function NavbarGroup() {
const [openDrawer, setOpenDrawer] = useAtom(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={() => setOpenDrawer(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} title={'MENU'} onClose={() => setOpenDrawer(false)}>
<DrawerGroup />
</LayoutDrawer>
</>
);
}

3
src/module/group/index.ts
View File

@@ -0,0 +1,3 @@
import ViewGroup from "./view/view_group";
export {ViewGroup}

14
src/module/group/view/view_group.tsx Normal file
View 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>
);
}

2
src/module/notification/components/list_notification.tsx
View File

@@ -1,6 +1,6 @@
"use client"
import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Center, Grid, Group, ScrollArea, Text } from '@mantine/core';
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';

2
src/module/notification/components/ui/navbar_notification.tsx
View File

@@ -7,7 +7,6 @@ import React from 'react';
export default function NavbarNotification() {
const router = useRouter()
return (
<Box>
<LayoutNavbarHome>
<Grid justify='center' align='center'>
<Grid.Col span="auto">
@@ -19,7 +18,6 @@ export default function NavbarNotification() {
<Grid.Col span="auto"></Grid.Col>
</Grid>
</LayoutNavbarHome>
</Box>
);
}

10
src/module/notification/view/view_notification.tsx
View File

@@ -1,5 +1,5 @@
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global'
import { Box, Grid, ScrollArea, Text } from '@mantine/core'
import { Box, Grid, Text } from '@mantine/core'
import React from 'react'
import NavbarNotification from '../components/ui/navbar_notification'
import ListNotification from '../components/list_notification'
@@ -8,11 +8,9 @@ export default function ViewNotification() {
return (
<Box>
<NavbarNotification />
<ScrollArea h={'87vh'}>
<Box p={20}>
<ListNotification />
</Box>
</ScrollArea>
<Box p={20}>
<ListNotification />
</Box>
</Box>
)
}

5
yarn.lock
View File

@@ -2265,6 +2265,11 @@ jiti@^1.21.0:
resolved "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz"
integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
jotai@^2.8.4:
version "2.8.4"
resolved "https://registry.yarnpkg.com/jotai/-/jotai-2.8.4.tgz#ea82b013d640016100e360d19d565862816c96d0"
integrity sha512-f6jwjhBJcDtpeauT2xH01gnqadKEySwwt1qNBLvAXcnojkmb76EdqRt05Ym8IamfHGAQz2qMKAwftnyjeSoHAA==
"js-tokens@^3.0.0 || ^4.0.0":
version "4.0.0"
resolved "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"