Merge pull request #57 from bipproduction/amalia/17-jul-24
Amalia/17 jul 24
This commit is contained in:
@@ -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 />
|
||||
);
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user