Merge pull request #57 from bipproduction/amalia/17-jul-24

Amalia/17 jul 24
This commit is contained in:
Amalia
2024-07-17 17:31:05 +08:00
committed by GitHub
12 changed files with 159 additions and 67 deletions

View File

@@ -1,7 +1,11 @@
import { ViewFilter } from '@/module/_global';
import { ViewListPosition } from '@/module/position';
import React from 'react';
function Page() {
function Page({ searchParams }: { searchParams: { page: string } }) {
if (searchParams.page == "filter")
return <ViewFilter />
return (
<ViewListPosition />
);

View File

@@ -3,6 +3,7 @@ import { LayoutDrawer, WARNA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import React, { useState } from 'react';
import { FaPencil, FaToggleOff } from 'react-icons/fa6';
import { IoAddCircle, IoCloseCircleOutline } from "react-icons/io5";
export default function EditDrawerGroup({ onUpdated }: { onUpdated: (val: boolean) => void }) {
@@ -27,15 +28,15 @@ export default function EditDrawerGroup({ onUpdated }: { onUpdated: (val: boolea
<SimpleGrid cols={{ base: 3, sm: 3, lg: 3 }}>
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => setModal(true)} style={{ cursor: 'pointer' }}>
<Box>
<IoCloseCircleOutline size={30} color={WARNA.biruTua} />
<FaToggleOff size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Tidak Aktif</Text>
<Text c={WARNA.biruTua}>Non Aktifkan</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => setOpenDrawerGroup(true)} style={{ cursor: 'pointer' }}>
<Box>
<IoAddCircle size={30} color={WARNA.biruTua} />
<FaPencil size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Edit</Text>

View File

@@ -3,7 +3,7 @@ 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';
import { FaBell } from 'react-icons/fa6';
const dataNotification = [
{
@@ -69,23 +69,21 @@ export default function ListNotification() {
<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>
<Box key={i} my={15}>
<Box style={{
border: `1px solid ${WARNA.borderOrange}`,
padding: 20,
borderRadius: 15
}} >
<Group align='center'>
<ActionIcon variant="light" bg={WARNA.biruTua} size={35} radius={100} aria-label="icon">
<FaBell size={20} color='white' />
</ActionIcon>
<Text fw={'bold'} fz={18}>{v.title}</Text>
<Text fz={15}>{v.description}</Text>
</Box>
</Grid.Col>
</Grid>
</Group>
<Text mt={10} fz={15}>{v.description}</Text>
</Box>
</Box>
)
})}
</Box>

View File

@@ -5,7 +5,7 @@ import React from 'react';
import { HiMiniUserGroup, HiMiniPresentationChartBar, HiMegaphone, HiSquares2X2, HiChevronLeft, HiUserGroup, HiUsers } from "react-icons/hi2";
import { PiUsersFourFill } from "react-icons/pi";
import { useRouter } from 'next/navigation';
import { FaUserTie } from 'react-icons/fa6';
import { FaUserTag, FaUserTie } from 'react-icons/fa6';
export default function ViewDetailFeature() {
const router = useRouter()
@@ -73,20 +73,6 @@ export default function ViewDetailFeature() {
<Text fz={15} c={WARNA.biruTua}>Anggota</Text>
</Center>
</Box>
<Box onClick={() => router.push('/group')}>
<Center>
<ActionIcon variant="gradient"
size={68}
aria-label="Gradient action icon"
radius={100}
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
<HiUsers size={35} color={WARNA.biruTua} />
</ActionIcon>
</Center>
<Center>
<Text fz={15} c={WARNA.biruTua}>Group</Text>
</Center>
</Box>
<Box onClick={() => router.push('/position')}>
<Center>
<ActionIcon variant="gradient"
@@ -101,6 +87,20 @@ export default function ViewDetailFeature() {
<Text fz={15} c={WARNA.biruTua}>Jabatan</Text>
</Center>
</Box>
<Box onClick={() => router.push('/group')}>
<Center>
<ActionIcon variant="gradient"
size={68}
aria-label="Gradient action icon"
radius={100}
gradient={{ from: '#DFDA7C', to: '#F2AF46', deg: 174 }}>
<FaUserTag size={35} color={WARNA.biruTua} />
</ActionIcon>
</Center>
<Center>
<Text fz={15} c={WARNA.biruTua}>Group</Text>
</Center>
</Box>
</SimpleGrid>
</Box>
</Box>

View File

@@ -2,8 +2,7 @@ import { LayoutDrawer, WARNA } from "@/module/_global"
import LayoutModal from "@/module/_global/layout/layout_modal"
import { Box, Stack, SimpleGrid, Flex, Text, Select, TextInput, Button } from "@mantine/core"
import { useState } from "react"
import { FaPencil } from "react-icons/fa6"
import { ImUserCheck } from "react-icons/im"
import { FaPencil, FaToggleOff } from "react-icons/fa6"
export default function DrawerDetailPosition({ onUpdated }: { onUpdated: (val: boolean) => void }) {
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
@@ -32,10 +31,10 @@ export default function DrawerDetailPosition({ onUpdated }: { onUpdated: (val: b
onClick={() => setModal(true)}
>
<Box>
<ImUserCheck size={30} color={WARNA.biruTua} />
<FaToggleOff size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Status</Text>
<Text c={WARNA.biruTua}>Non Aktifkan</Text>
</Box>
</Flex>

View File

@@ -1,10 +1,13 @@
import { WARNA, LayoutDrawer } from "@/module/_global";
import { Box, Stack, SimpleGrid, Flex, TextInput, Button, Text, Select } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { IoAddCircle } from "react-icons/io5";
import { RiFilter2Line } from "react-icons/ri";
export default function DrawerListPosition({ onCreated }: { onCreated: (val: boolean) => void }) {
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
const router = useRouter()
function onCLose() {
setOpenDrawerGroup(false)
@@ -25,6 +28,14 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
<Text ta={'center'} c={WARNA.biruTua}>Tambah Jabatan</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'} onClick={() => router.push('/position?page=filter')}>
<Box>
<RiFilter2Line size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text ta={'center'} c={WARNA.biruTua}>Filter</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">

View File

@@ -9,35 +9,43 @@ import toast from 'react-hot-toast';
const dataGroup = [
{
id: 1,
name: 'Kepala'
name: 'Kepala',
grup: 'Dinas'
},
{
id: 2,
name: 'Sekretaris'
name: 'Sekretaris',
grup: 'LPD'
},
{
id: 3,
name: 'Bendahara'
name: 'Bendahara',
grup: 'Dinas'
},
{
id: 4,
name: 'Anggota'
name: 'Anggota',
grup: 'Karang Taruna'
},
{
id: 5,
name: 'Kepala Urusan Kemasyarakatan'
name: 'Kepala Urusan Kemasyarakatan',
grup: 'Dinas'
},
{
id: 6,
name: 'Kepala Urusan Pemerintahan'
name: 'Kepala Urusan Pemerintahan',
grup: 'Dinas'
},
{
id: 7,
name: 'Kepala Urusan Kependudukan'
name: 'Kepala Urusan Kependudukan',
grup: 'Dinas'
},
{
id: 8,
name: 'Anggota'
name: 'Anggota',
grup: 'Dinas'
},
]
@@ -78,6 +86,7 @@ export default function ListPositionActive() {
</Box>
<Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text fw={'lighter'} fz={12}>{v.grup}</Text>
</Box>
</Group>
</Box>

View File

@@ -9,35 +9,43 @@ import toast from 'react-hot-toast';
const dataGroup = [
{
id: 1,
name: 'Anggota'
name: 'Kepala',
grup: 'Dinas'
},
{
id: 2,
name: 'Anggota'
name: 'Sekretaris',
grup: 'LPD'
},
{
id: 3,
name: 'Anggota'
name: 'Bendahara',
grup: 'Dinas'
},
{
id: 4,
name: 'Anggota'
name: 'Anggota',
grup: 'Karang Taruna'
},
{
id: 5,
name: 'Anggota'
name: 'Kepala Urusan Kemasyarakatan',
grup: 'Dinas'
},
{
id: 6,
name: 'Anggota'
name: 'Kepala Urusan Pemerintahan',
grup: 'Dinas'
},
{
id: 7,
name: 'Anggota'
name: 'Kepala Urusan Kependudukan',
grup: 'Dinas'
},
{
id: 8,
name: 'Anggota'
name: 'Anggota',
grup: 'Dinas'
},
]
@@ -78,6 +86,7 @@ export default function ListPositionNonActive() {
</Box>
<Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text fw={'lighter'} fz={12}>{v.grup}</Text>
</Box>
</Group>
</Box>

View File

@@ -1,7 +1,7 @@
'use client'
import { WARNA } from "@/module/_global";
import LayoutModal from "@/module/_global/layout/layout_modal";
import { Box, Button, Stack, TextInput } from "@mantine/core";
import { Box, Button, Select, Stack, TextInput } from "@mantine/core";
import { useState } from "react";
import toast from "react-hot-toast";
import { HiUser } from "react-icons/hi2";
@@ -31,6 +31,28 @@ export default function CreateMember() {
}}>
<HiUser size={100} color={WARNA.bgWhite} />
</Box>
<Select
placeholder="Pilih Grup" label="Grup" w={"100%"} size="md" required withAsterisk radius={30}
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
data={['Dinas', 'Adat', 'LPD', 'PKK']}
/>
<Select
placeholder="Pilih Jabatan" label="Jabatan" w={"100%"} size="md" required withAsterisk radius={30}
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
data={['Kepala', 'Sekretaris', 'Bendahara', 'Anggota']}
/>
<TextInput
size="md" type="number" radius={30} placeholder="NIK" withAsterisk label="NIK" w={"100%"}
styles={{
@@ -71,8 +93,19 @@ export default function CreateMember() {
},
}}
/>
<Select
placeholder="Pilih Gender" label="Gender" w={"100%"} size="md" required withAsterisk radius={30}
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
data={['Laki-laki', 'Perempuan']}
/>
</Stack>
<Box mt={30} mx={20}>
<Box mt={30} mx={20} pb={20}>
<Button
c={"white"}
bg={WARNA.biruTua}

View File

@@ -9,42 +9,50 @@ const dataMember = [
{
id: 1,
name: 'Ali akbar',
desc: 'Perbekel'
desc: 'Perbekel',
grup: 'Dinas'
},
{
id: 2,
name: 'Fibra Marcell',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'Dinas'
},
{
id: 3,
name: 'Burhan',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'Dinas'
},
{
id: 4,
name: 'Chandra',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'Dinas'
},
{
id: 5,
name: 'Ayu',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'PKK'
},
{
id: 6,
name: 'Heriawan',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'Karang Taruna'
},
{
id: 7,
name: 'Jinan',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'Dinas'
},
{
id: 8,
name: 'Rizal',
desc: 'Kasi Kesejahteraan'
desc: 'Kasi Kesejahteraan',
grup: 'LPD'
},
]
@@ -81,6 +89,7 @@ export default function ListMember() {
</Box>
<Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text fw={'lighter'} fz={12}>{v.grup + ' - ' + v.desc}</Text>
</Box>
</Group>
</Box>

View File

@@ -1,6 +1,6 @@
"use client"
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import { Box, Button, Flex, Modal, Stack, Text, TextInput } from "@mantine/core";
import { Box, Button, Flex, Modal, Select, Stack, Text, TextInput } from "@mantine/core";
import { HiUser } from "react-icons/hi2";
import toast from "react-hot-toast";
import LayoutModal from "@/module/_global/layout/layout_modal";
@@ -72,6 +72,17 @@ export default function EditProfile() {
},
}}
/>
<Select
placeholder="Pilih Gender" label="Gender" w={"100%"} size="md" required withAsterisk radius={30}
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
data={['Laki-laki', 'Perempuan']}
/>
</Stack>
<Box mt={30} mx={20} pb={20}>
<Button

View File

@@ -6,6 +6,7 @@ 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";
import { IoMaleFemale } from "react-icons/io5";
export default function ViewProfile() {
return (
@@ -50,6 +51,13 @@ export default function ViewProfile() {
</Group>
<Text fz={18} fw={'bold'} ta={"right"}>marcel@gmail.com</Text>
</Group>
<Group justify="space-between" grow py={5}>
<Group>
<IoMaleFemale size={28} />
<Text fz={18}>Gender</Text>
</Group>
<Text fz={18} fw={'bold'} ta={"right"}>Laki-laki</Text>
</Group>
</Box>
</>