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

feat : update module

Browse Source 
Deskripsi:
- update announcement and api
- update position and api

No Issue
This commit is contained in:
lukman
2024-08-09 15:47:59 +08:00
parent 925e54deec
commit 5b4b780af5
35 changed files with 630 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/module/position/component/tab_list_position.tsx
View File

@@ -1,38 +0,0 @@
'use client'
import { Box, Tabs, rem } from '@mantine/core';
import { IoCloseCircleOutline } from "react-icons/io5"
import { IoMdCheckmarkCircleOutline } from "react-icons/io"
import ListPositionActive from './ui/list_position_active';
export default function TabListGroup() {
const iconStyle = { width: rem(20), height: rem(20) };
return (
<Box p={20}>
<Tabs variant="pills" color='#FF9861' radius="xl" defaultValue="aktif">
<Tabs.List bg={"white"} style={{
border: `1px solid ${"#EDEDED"}`,
padding: 5,
borderRadius: 100
}}>
<Tabs.Tab value="aktif" w={"45%"} leftSection={<IoMdCheckmarkCircleOutline style={iconStyle} />}>
Aktif
</Tabs.Tab>
<Tabs.Tab value="tidak-aktif" w={"53%"} leftSection={<IoCloseCircleOutline style={iconStyle} />}>
Tidak Aktif
</Tabs.Tab>
</Tabs.List>
<Tabs.Panel value="aktif">
<ListPositionActive status={true} />
</Tabs.Panel>
<Tabs.Panel value="tidak-aktif">
<ListPositionActive status={false} />
{/* <ListPositionNonActive /> */}
</Tabs.Panel>
</Tabs>
</Box>
);
}

7
src/module/position/index.ts
View File

@@ -1,5 +1,8 @@
import { apiPosition } from "./api/api_position";
import ViewListPosition from "./view/view_list_position";
import TabListPosition from "./ui/tab_list_position";
import TabListGroup from "./ui/tab_list_position";
import NavbarListPosition from "./ui/navbar_list_position";
export { ViewListPosition };
export { apiPosition };
export { NavbarListPosition }
export { TabListPosition }

54
src/module/position/lib/api_position.ts Normal file
View File

@@ -0,0 +1,54 @@
import { IDataPosition, IFormPosition, IStatusPosition } from "./type_position";
export const funGetAllPosition = async (path?: string) => {
const response = await fetch(`/api/position${(path) ? path : ''}`, { next: { tags: ['position'] } });
return await response.json().catch(() => null);
}
export const funGetOnePosition = async (path: string) => {
const response = await fetch(`/api/position/${path}`);
return await response.json().catch(() => null);
}
export const funCreatePosition = async (data: IFormPosition) => {
if (data.name.length < 3)
return { success: false, message: 'Minimal 3 karakter' }
const response = await fetch("/api/position", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funEditStatusPosition = async (path: string, data: IStatusPosition) => {
const response = await fetch(`/api/position/${path}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funEditPosition = async (path: string, data: IFormPosition) => {
if (data.name.length < 3)
return { success: false, message: 'Minimal 3 karakter' }
const response = await fetch(`/api/position/${path}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}

16
src/module/position/lib/type_position.ts Normal file
View File

@@ -0,0 +1,16 @@
export interface IDataPosition {
name: string;
idGroup: string;
group: string;
id: string;
isActive: boolean
};
export interface IStatusPosition {
isActive: boolean
}
export interface IFormPosition {
name: string
idGroup: string
}

61
src/module/position/component/ui/drawer_detail_position.tsx → src/module/position/ui/drawer_detail_position.tsx
View File

@@ -6,9 +6,11 @@ import { useShallowEffect } from "@mantine/hooks"
import { useEffect, useState } from "react"
import toast from "react-hot-toast"
import { FaPencil, FaToggleOff } from "react-icons/fa6"
import { funEditPosition, funEditStatusPosition, funGetOnePosition } from "../lib/api_position"
import { IDataPosition } from "../lib/type_position"
export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
onUpdated: (val: boolean) => void, id: string | null, isActive: boolean | null;
onUpdated: (val: boolean) => void, id: string, isActive: boolean;
}) {
const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
const [isModal, setModal] = useState(false)
@@ -17,7 +19,7 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
name: "",
idGroup: ""
})
const [listGroup, setListGorup] = useState<IDataGroup[]>([])
const [listGroup, setListGorup] = useState<IDataPosition[]>([])
function onCLose() {
onUpdated(true)
@@ -40,41 +42,38 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
async function getOneData() {
try {
const res = await fetch(`${API_ADDRESS.apiGetOnePosition}&positionId=${id}`)
const data = await res.json()
setData(data)
const res = await funGetOnePosition(id)
if (res.success) {
setData(res.data)
} else {
toast.error(res.message)
}
} catch (error) {
console.error(error)
toast.error("Gagal mendapatkan jabatan, coba lagi nanti");
}
}
async function onSubmit() {
try {
const res = await fetch(API_ADDRESS.apiUpdatePosition, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
id: data.id,
name: data.name,
idGroup: data.idGroup,
}),
const res = await funEditPosition(id, {
name: data.name,
idGroup: data.idGroup
})
const respon = await res.json()
if (res.status == 200) {
toast.success(respon.message)
if (res.success) {
toast.success(res.message);
onUpdated(true);
onCLose();
} else {
toast.error(respon.message)
onUpdated(false);
toast.error(res.message)
}
onUpdated(true)
onCLose();
} catch (error) {
toast.error('Error');
toast.error("Edit jabatan gagal, coba lagi nanti");
}
}
@@ -86,28 +85,20 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
async function nonActive(val: boolean) {
try {
if (val) {
const res = await fetch(API_ADDRESS.apiDeletePosition, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
id,
isActive,
}),
});
if (res.status == 200) {
const res = await funEditStatusPosition(id, { isActive: isActive })
if (res.success) {
toast.success(res.message);
onUpdated(true);
} else {
onUpdated(false);
toast.error(res.message)
}
}
setModal(false);
} catch (error) {
console.log(error);
setModal(false);
toast.error("Terjadi kesalahan");
toast.error("Edit jabatan gagal, coba lagi nanti");
onUpdated(false);
}
}

52
src/module/position/component/ui/drawer_list_position.tsx → src/module/position/ui/drawer_list_position.tsx
View File

@@ -7,6 +7,7 @@ import { useEffect, useState } from "react";
import toast from "react-hot-toast";
import { IoAddCircle } from "react-icons/io5";
import { RiFilter2Line } from "react-icons/ri";
import { funCreatePosition } from "../lib/api_position";
export default function DrawerListPosition({ onCreated }: { onCreated: (val: boolean) => void }) {
@@ -40,29 +41,42 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
async function onSubmit() {
try {
const res = await fetch(API_ADDRESS.apiCreatePosition, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
name: listData.name,
idGroup: listData.idGroup
})
// const res = await fetch(API_ADDRESS.apiCreatePosition, {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json'
// },
// body: JSON.stringify({
// name: listData.name,
// idGroup: listData.idGroup
// })
// })
// if (!res.ok) {
// const errorData = await res.json();
// if (errorData.message === "Position sudah ada") {
// toast.error('Gagal! Position sudah ada');
// } else {
// toast.error('Error');
// }
// } else {
// setOpenDrawerGroup(false)
// toast.success('Sukses! data tersimpan')
// }
// onCreated(true)
const res = await funCreatePosition({
name: listData.name,
idGroup: listData.idGroup
})
if (!res.ok) {
const errorData = await res.json();
if (errorData.message === "Position sudah ada") {
toast.error('Gagal! Position sudah ada');
} else {
toast.error('Error');
}
} else {
if (res.success) {
setOpenDrawerGroup(false)
toast.success('Sukses! data tersimpan')
toast.success(res.message)
onCreated(true)
} else {
toast.error(res.message)
}
onCreated(true)
} catch (error) {
toast.error('Error')
}

24
src/module/position/component/ui/list_position_active.tsx → src/module/position/ui/list_position_active.tsx
View File

@@ -8,35 +8,31 @@ import toast from "react-hot-toast";
import _ from "lodash";
import { useShallowEffect } from "@mantine/hooks";
import { useSearchParams } from "next/navigation";
import { funGetAllPosition } from "../lib/api_position";
import { IDataPosition } from "../lib/type_position";
type dataPosition = {
name: string;
idGroup: string;
group: string;
id: string;
isActive: boolean
};
export default function ListPositionActive({ status }: { status: boolean }) {
export default function ListPositionActive() {
const [openDrawer, setOpenDrawer] = useState(false);
const [isData, setData] = useState("");
const [isDataPosition, setDataPosition] = useState<dataPosition[]>([]);
const [isDataPosition, setDataPosition] = useState<IDataPosition[]>([]);
const [loading, setLoading] = useState(true);
const [selectId, setSelectId] = useState<string | null>(null);
const [active, setActive] = useState<boolean | null>(null)
const [selectId, setSelectId] = useState<string>('');
const [active, setActive] = useState<boolean>(false)
const [searchQuery, setSearchQuery] = useState('')
const searchParams = useSearchParams()
const group = searchParams.get('group')
const status = searchParams.get('active')
async function getAllPosition() {
try {
setDataPosition([]);
setLoading(true)
const res = await fetch(`${API_ADDRESS.apiGetAllPosition}&active=${status}&groupId=${group}&name=${searchQuery}`);
const data = await res.json();
setDataPosition(data);
const res = await funGetAllPosition('?active=' + status + '&group=' + group + '&search=' + searchQuery)
setDataPosition(res.data);
setLoading(false);
} catch (error) {
toast.error("Gagal mendapatkan position, coba lagi nanti");
console.error(error);
} finally {
setLoading(false);

1
src/module/position/component/ui/navbar_list_position.tsx → src/module/position/ui/navbar_list_position.tsx
View File

@@ -20,7 +20,6 @@ export default function NavbarListPosition() {
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)}>
<DrawerListPosition onCreated={() => {
setOpen(false)
// toast.success('Sukses! data tersimpan')
}} />
</LayoutDrawer>
</>

47
src/module/position/ui/tab_list_position.tsx Normal file
View File

@@ -0,0 +1,47 @@
'use client'
import { Box, Tabs, rem } from '@mantine/core';
import { IoCloseCircleOutline } from "react-icons/io5"
import { IoMdCheckmarkCircleOutline } from "react-icons/io"
import ListPositionActive from './list_position_active';
import { useRouter, useSearchParams } from 'next/navigation';
export default function TabListPosition() {
const iconStyle = { width: rem(20), height: rem(20) };
const router = useRouter()
const searchParams = useSearchParams()
const status = searchParams.get('active')
return (
<Box p={20}>
<Tabs variant="pills" color='#FF9861' radius="xl" defaultValue={(status == "false") ? "false" : "true"}>
<Tabs.List
bg={"white"}
style={{
border: `1px solid ${"#EDEDED"}`,
padding: 5,
borderRadius: 100,
}}
>
<Tabs.Tab
value="true"
w={"45%"}
leftSection={<IoMdCheckmarkCircleOutline style={iconStyle} />}
onClick={() => { router.push("/position?active=true") }}
>
Aktif
</Tabs.Tab>
<Tabs.Tab
value="false"
w={"53%"}
leftSection={<IoCloseCircleOutline style={iconStyle} />}
onClick={() => { router.push("/position?active=false") }}
>
Tidak Aktif
</Tabs.Tab>
</Tabs.List>
<ListPositionActive />
</Tabs>
</Box>
);
}

12
src/module/position/view/view_list_position.tsx
View File

@@ -1,12 +0,0 @@
import { Box } from "@mantine/core";
import NavbarListPosition from "../component/ui/navbar_list_position";
import TabListGroup from "../component/tab_list_position";
export default function ViewListPosition() {
return (
<Box>
<NavbarListPosition />
<TabListGroup />
</Box>
);
}