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

Merge pull request #20 from bipproduction/amalia/5-jul-24

Browse Source 
Amalia/5 jul 24
This commit is contained in:
Amalia
2024-07-05 17:15:04 +08:00
committed by GitHub
parent fd75843ac4 cf01f36f6c
commit 55402990ec
12 changed files with 377 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/(application)/member/[id]/page.tsx Normal file
View 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
View 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
View File

@@ -0,0 +1,9 @@
import { ViewListMember } from "@/module/user/member";
function Page() {
return (
<ViewListMember />
)
}
export default Page;

4
src/module/home/view/view_detail_feature.tsx
View File

@@ -56,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}
@@ -70,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}

91
src/module/user/member/component/list_member.tsx Normal file
View 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
View 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
View 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
View 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>
</>
)
}

7
src/module/user/member/index.ts
View File

@@ -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
View 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
View 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
View 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>
)
}