upd: member
Deskripsi: - mulai pembatasan sesuai user role - nb : blm selesai No Issues
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
"use client";
|
||||
import { WARNA } from "@/module/_global";
|
||||
import { globalRole, WARNA } from "@/module/_global";
|
||||
import LayoutModal from "@/module/_global/layout/layout_modal";
|
||||
import { funGetAllGroup, IDataGroup } from "@/module/group";
|
||||
import { Box, Button, rem, Select, Stack, Text, TextInput } from "@mantine/core";
|
||||
@@ -11,6 +11,9 @@ import { IDataPositionMember, IDataROleMember } from "../lib/type_member";
|
||||
import { funGetAllPosition } from "@/module/position/lib/api_position";
|
||||
import { funCreateMember, funGetRoleUser } from "../lib/api_member";
|
||||
import _ from "lodash";
|
||||
import { useHookstate } from "@hookstate/core";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import { funGetUserByCookies } from "@/module/auth";
|
||||
|
||||
export default function CreateMember() {
|
||||
const router = useRouter();
|
||||
@@ -18,6 +21,8 @@ export default function CreateMember() {
|
||||
const [listGroup, setListGorup] = useState<IDataGroup[]>([]);
|
||||
const [listPosition, setListPosition] = useState<IDataPositionMember[]>([]);
|
||||
const [listUserRole, setListUserRole] = useState<IDataROleMember[]>([]);
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const [groupLogin, setGroupLogin] = useState("");
|
||||
const [touched, setTouched] = useState({
|
||||
nik: false,
|
||||
name: false,
|
||||
@@ -54,12 +59,20 @@ export default function CreateMember() {
|
||||
}
|
||||
}
|
||||
|
||||
async function getLogin() {
|
||||
try {
|
||||
const res = await funGetUserByCookies();
|
||||
setGroupLogin(String(res.idGroup));
|
||||
getAllPosition(res.idGroup);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
async function getAllPosition(val: any) {
|
||||
try {
|
||||
if (val != null) {
|
||||
const res = await funGetAllPosition(
|
||||
"?active=true" + "&group=" + `${val}`
|
||||
);
|
||||
const res = await funGetAllPosition("?active=true" + "&group=" + `${val}`);
|
||||
setListPosition(res.data);
|
||||
} else {
|
||||
setListPosition([]);
|
||||
@@ -121,9 +134,13 @@ export default function CreateMember() {
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
useShallowEffect(() => {
|
||||
getAllGroup();
|
||||
getAllUserRole();
|
||||
|
||||
if (roleLogin.get() != "supadmin") {
|
||||
getLogin()
|
||||
}
|
||||
}, []);
|
||||
|
||||
|
||||
@@ -140,40 +157,43 @@ 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={
|
||||
listGroup
|
||||
? listGroup.map((data) => ({
|
||||
value: data.id,
|
||||
label: data.name,
|
||||
}))
|
||||
: []
|
||||
}
|
||||
onChange={(val: any) => {
|
||||
changeGrup(val);
|
||||
setTouched({ ...touched, idGroup: false })
|
||||
}}
|
||||
onBlur={() => setTouched({ ...touched, idGroup: true })}
|
||||
error={
|
||||
touched.idGroup && (
|
||||
listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
|
||||
)
|
||||
}
|
||||
/>
|
||||
{
|
||||
roleLogin.get() == "supadmin" &&
|
||||
<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={
|
||||
listGroup
|
||||
? listGroup.map((data) => ({
|
||||
value: data.id,
|
||||
label: data.name,
|
||||
}))
|
||||
: []
|
||||
}
|
||||
onChange={(val: any) => {
|
||||
changeGrup(val);
|
||||
setTouched({ ...touched, idGroup: false })
|
||||
}}
|
||||
onBlur={() => setTouched({ ...touched, idGroup: true })}
|
||||
error={
|
||||
touched.idGroup && (
|
||||
listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
|
||||
)
|
||||
}
|
||||
/>
|
||||
}
|
||||
<Select
|
||||
placeholder="Pilih Jabatan"
|
||||
label="Jabatan"
|
||||
@@ -274,7 +294,7 @@ export default function CreateMember() {
|
||||
error={
|
||||
touched.nik && (
|
||||
listData.nik === "" ? "NIK Tidak Boleh Kosong" :
|
||||
listData.nik.length !== 16 ? "NIK Harus 16 Karakter" : null
|
||||
listData.nik.length !== 16 ? "NIK Harus 16 Karakter" : null
|
||||
)
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -1,12 +1,16 @@
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { globalRole, WARNA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { IoAddCircle } from "react-icons/io5";
|
||||
import { RiFilter2Line } from 'react-icons/ri';
|
||||
|
||||
export default function DrawerListMember() {
|
||||
const router = useRouter()
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const searchParams = useSearchParams()
|
||||
const group = searchParams.get('group')
|
||||
|
||||
return (
|
||||
<Box>
|
||||
@@ -29,20 +33,22 @@ export default function DrawerListMember() {
|
||||
<Text c={WARNA.biruTua} ta='center'>Tambah Anggota</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
style={{ cursor: 'pointer' }}
|
||||
onClick={() => {
|
||||
router.push('/member?page=filter')
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<RiFilter2Line size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Filter</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
{
|
||||
roleLogin.get() === 'supadmin' &&
|
||||
<Flex justify={'center'} align={'center'} direction={'column'}
|
||||
style={{ cursor: 'pointer' }}
|
||||
onClick={() => {
|
||||
router.push('/member?page=filter&group=' + group)
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<RiFilter2Line size={30} color={WARNA.biruTua} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={WARNA.biruTua} ta='center'>Filter</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
|
||||
@@ -1,15 +1,16 @@
|
||||
|
||||
import { SkeletonSingle, WARNA } from "@/module/_global"
|
||||
import { Box, Group, ActionIcon, Text, TextInput, Divider, Avatar, Grid } from "@mantine/core"
|
||||
import { globalRole, SkeletonSingle, WARNA } from "@/module/_global"
|
||||
import { Box, Text, TextInput, Divider, Avatar, Grid } from "@mantine/core"
|
||||
import { useShallowEffect } from "@mantine/hooks"
|
||||
import { useRouter, useSearchParams } from "next/navigation"
|
||||
import { useEffect, useState } from "react"
|
||||
import { HiMagnifyingGlass, HiMiniUser } from "react-icons/hi2"
|
||||
import { useState } from "react"
|
||||
import { HiMagnifyingGlass } from "react-icons/hi2"
|
||||
import { IListMember } from "../lib/type_member"
|
||||
import { funGetAllmember } from "../lib/api_member"
|
||||
import { funGetAllGroup, IDataGroup } from "@/module/group"
|
||||
import toast from "react-hot-toast"
|
||||
import _ from "lodash"
|
||||
import { useHookstate } from "@hookstate/core"
|
||||
|
||||
|
||||
export default function TabListMember() {
|
||||
@@ -20,13 +21,20 @@ export default function TabListMember() {
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const group = searchParams.get('group')
|
||||
const status = searchParams.get('active')
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const [nameGroup, setNameGroup] = useState('')
|
||||
|
||||
|
||||
async function getAllUser() {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res = await funGetAllmember('?active=' + status + '&group=' + group + '&search=' + searchQuery)
|
||||
setDataMember(res.data)
|
||||
if (res.success) {
|
||||
setDataMember(res.data)
|
||||
setNameGroup(res.filter.name)
|
||||
} else {
|
||||
toast.error(res.message)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
throw new Error("Error")
|
||||
@@ -39,31 +47,6 @@ export default function TabListMember() {
|
||||
getAllUser()
|
||||
}, [status, searchQuery])
|
||||
|
||||
const [checked, setChecked] = useState<IDataGroup[]>([]);
|
||||
|
||||
const groupNameMap = (groupId: string) => {
|
||||
const groupName = checked.find((group) => group.id === groupId)?.name;
|
||||
return groupName || '-';
|
||||
};
|
||||
|
||||
async function getAllGroupFilter() {
|
||||
try {
|
||||
const response = await funGetAllGroup('?active=true')
|
||||
if (response.success) {
|
||||
setChecked(response.data);
|
||||
} else {
|
||||
toast.error(response.message);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
toast.error("Gagal mendapatkan grup, coba lagi nanti");
|
||||
}
|
||||
}
|
||||
|
||||
useShallowEffect(() => {
|
||||
getAllGroupFilter();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box>
|
||||
@@ -92,7 +75,7 @@ export default function TabListMember() {
|
||||
))
|
||||
:
|
||||
<Box>
|
||||
{group && <Text>Filter by: {groupNameMap(group)}</Text>}
|
||||
{roleLogin.get() == 'supadmin' && <Text>Filter by: {nameGroup}</Text>}
|
||||
{dataMember.length == 0 ?
|
||||
<Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '60vh' }}>
|
||||
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada anggota</Text>
|
||||
@@ -107,7 +90,7 @@ export default function TabListMember() {
|
||||
<Grid p={10} gutter={{
|
||||
base: 60,
|
||||
xl: "xs"
|
||||
}} align="center">
|
||||
}} align="center">
|
||||
<Grid.Col span={2}>
|
||||
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} size={50} alt="image" />
|
||||
</Grid.Col>
|
||||
|
||||
Reference in New Issue
Block a user