Merge branch 'join' into lukman/4-september-2024

This commit is contained in:
Moh Alif Al Lukman
2024-09-04 17:46:02 +08:00
committed by GitHub
6 changed files with 177 additions and 61 deletions

View File

@@ -0,0 +1,66 @@
export const valueRoleUser =
[
{
login: "supadmin",
data: [
{
id: "cosupadmin",
name: "Wakil Super Admin"
},
{
id: "admin",
name: "Admin"
},
{
id: "coadmin",
name: "Wakil Admin"
},
{
id: "user",
name: "User"
},
]
},
{
login: "cosupadmin",
data: [
{
id: "admin",
name: "Admin"
},
{
id: "coadmin",
name: "Wakil Admin"
},
{
id: "user",
name: "User"
},
],
},
{
login: "admin",
data: [
{
id: "coadmin",
name: "Wakil Admin"
},
{
id: "user",
name: "User"
},
],
},
{
login: "coadmin",
data: [
{
id: "user",
name: "User"
},
],
}
]

View File

@@ -5,7 +5,7 @@ export const funGetAllmember = async (path?: string) => {
return await response.json().catch(() => null);
}
export const funGetRoleUser= async (path?: string) => {
export const funGetRoleUser = async (path?: string) => {
const response = await fetch(`/api/role-user${(path) ? path : ''}`, { next: { tags: ['member'] } });
return await response.json().catch(() => null);
}
@@ -15,25 +15,10 @@ export const funGetOneMember = async (path: string) => {
return await response.json().catch(() => null);
}
export const funCreateMember = async (data: IFormMember) => {
if (data.name.length < 3)
return { success: false, message: 'Name minimal 3 karakter' }
if (data.email.length < 3)
return { success: false, message: 'Email minimal 3 karakter' }
if (data.phone.length < 10)
return { success: false, message: 'Phone minimal 10 karakter' }
if (data.nik.length < 16)
return { success: false, message: 'NIK harus 16 karakter' }
export const funCreateMember = async (data: FormData) => {
const response = await fetch("/api/user", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
body: data,
});
return await response.json().catch(() => null);
}

View File

@@ -2,18 +2,20 @@
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";
import { Avatar, Box, Button, Indicator, rem, Select, Stack, Text, TextInput } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { useRef, useState } from "react";
import toast from "react-hot-toast";
import { HiUser } from "react-icons/hi2";
import { IDataPositionMember, IDataROleMember } from "../lib/type_member";
import { funGetAllPosition } from "@/module/position/lib/api_position";
import { funCreateMember, funGetRoleUser } from "../lib/api_member";
import { funCreateMember } from "../lib/api_member";
import _ from "lodash";
import { useHookstate } from "@hookstate/core";
import { useShallowEffect } from "@mantine/hooks";
import { funGetUserByCookies } from "@/module/auth";
import { valueRoleUser } from "../../lib/val_user";
import { FaCamera } from "react-icons/fa6";
import { Dropzone } from "@mantine/dropzone";
export default function CreateMember() {
const router = useRouter();
@@ -22,7 +24,9 @@ export default function CreateMember() {
const [listPosition, setListPosition] = useState<IDataPositionMember[]>([]);
const [listUserRole, setListUserRole] = useState<IDataROleMember[]>([]);
const roleLogin = useHookstate(globalRole)
const [groupLogin, setGroupLogin] = useState("");
const [img, setIMG] = useState<any | null>()
const [imgForm, setImgForm] = useState<any>()
const openRef = useRef<() => void>(null)
const [touched, setTouched] = useState({
nik: false,
name: false,
@@ -62,8 +66,10 @@ export default function CreateMember() {
async function getLogin() {
try {
const res = await funGetUserByCookies();
setGroupLogin(String(res.idGroup));
getAllPosition(res.idGroup);
if (roleLogin.get() != "supadmin") {
getAllPosition(res.idGroup)
}
} catch (error) {
console.error(error);
}
@@ -84,8 +90,7 @@ export default function CreateMember() {
async function getAllUserRole() {
try {
const res = await funGetRoleUser();
setListUserRole(res.data);
setListUserRole(valueRoleUser.filter((v) => v.login == roleLogin.get())[0]?.data);
} catch (error) {
console.error(error);
}
@@ -108,16 +113,21 @@ export default function CreateMember() {
return;
}
if (val) {
const res = await funCreateMember({
nik: listData.nik,
name: listData.name,
phone: listData.phone,
email: listData.email,
gender: listData.gender,
idGroup: listData.idGroup,
idPosition: listData.idPosition,
idUserRole: listData.idUserRole,
});
const fd = new FormData()
fd.append("file", imgForm)
fd.append("data", JSON.stringify(
{
nik: listData.nik,
name: listData.name,
phone: listData.phone,
email: listData.email,
gender: listData.gender,
idGroup: listData.idGroup,
idPosition: listData.idPosition,
idUserRole: listData.idUserRole,
}
))
const res = await funCreateMember(fd);
if (res.success) {
toast.success(res.message);
setModal(false);
@@ -137,26 +147,37 @@ export default function CreateMember() {
useShallowEffect(() => {
getAllGroup();
getAllUserRole();
if (roleLogin.get() != "supadmin") {
getLogin()
}
getLogin()
}, []);
return (
<Box>
<Stack align="center" justify="center" gap="xs" pt={30} px={20} pb={100}>
<Box
bg={WARNA.biruTua}
py={30}
px={50}
style={{
borderRadius: 10,
<Dropzone
openRef={openRef}
onDrop={async (files) => {
if (!files || _.isEmpty(files))
return toast.error('Tidak ada gambar yang dipilih')
setImgForm(files[0])
const buffer = URL.createObjectURL(new Blob([new Uint8Array(await files[0].arrayBuffer())]))
setIMG(buffer)
}}
activateOnClick={false}
maxSize={1 * 1024 ** 2}
accept={['image/png', 'image/jpeg', 'image/heic']}
onReject={(files) => {
return toast.error('File yang diizinkan: .png, .jpg, dan .heic dengan ukuran maksimal 1 MB')
}}
>
<HiUser size={100} color={WARNA.bgWhite} />
</Box>
</Dropzone>
<Indicator offset={20} withBorder inline color={WARNA.borderBiruMuda} position="bottom-end" label={<FaCamera size={20} />} size={40} onClick={() => openRef.current?.()}>
<Avatar
size="150"
radius={"100"}
src={img}
/>
</Indicator>
{
roleLogin.get() == "supadmin" &&
<Select

View File

@@ -14,6 +14,7 @@ import Link from "next/link";
import { funGetOneMember } from "../lib/api_member";
import toast from "react-hot-toast";
import { IListMember, IMember } from "../lib/type_member";
import { useHookstate } from "@hookstate/core";
export default function NavbarDetailMember({ id }: IMember) {
@@ -22,6 +23,7 @@ export default function NavbarDetailMember({ id }: IMember) {
const [selectId, setSelectId] = useState<string>('');
const [active, setActive] = useState<boolean>(false)
const [loading, setLoading] = useState(true)
const roleLogin = useHookstate(globalRole)
useShallowEffect(() => {
featchGetOne()
@@ -56,9 +58,12 @@ export default function NavbarDetailMember({ id }: IMember) {
<LayoutNavbarHome>
<Group justify="space-between">
<LayoutIconBack />
<ActionIcon onClick={() => setOpen(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info">
<HiMenu size={20} color='white' />
</ActionIcon>
{
(roleLogin.get() != "user") &&
<ActionIcon onClick={() => setOpen(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Info">
<HiMenu size={20} color='white' />
</ActionIcon>
}
</Group>
<Stack
align="center"

View File

@@ -1,19 +1,23 @@
'use client'
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { globalRole, LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { ActionIcon } from "@mantine/core";
import { HiMenu } from "react-icons/hi";
import DrawerListMember from "./drawer_list_member";
import { useState } from "react";
import { useHookstate } from "@hookstate/core";
export default function NavbarListMember() {
const [isOpenDrawer, setOpenDrawer] = useState(false)
const roleLogin = useHookstate(globalRole)
return (
<>
<LayoutNavbarNew back="/home" title="Anggota"
menu={
menu={(roleLogin.get() != "user") ?
<ActionIcon onClick={() => setOpenDrawer(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiMenu size={20} color='white' />
</ActionIcon>
: <></>
}
/>
<LayoutDrawer opened={isOpenDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}>