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

upd: divisi

Browse Source 
Deskripsi:
- membuat list divisi berdasarkan kategori semua data dan data saya

NoIssues
This commit is contained in:
amel
2024-12-26 11:36:16 +08:00
parent 5300b6a130
commit 326d470839
3 changed files with 83 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/module/division_new/ui/list_division.tsx
View File

@@ -30,6 +30,7 @@ export default function ListDivision() {
const [isRefresh, setRefresh] = useState(false)
const notifLoadPage = useHookstate(globalNotifPage)
const status = searchParams.get('active')
const kategori = searchParams.get('cat')
const handleList = () => {
@@ -43,7 +44,7 @@ export default function ListDivision() {
if (isPage == 1) {
setData([])
}
const response = await funGetAllDivision('?active=' + status + '&search=' + searchQuery + '&group=' + group + '&page=' + isPage)
const response = await funGetAllDivision('?active=' + status + '&search=' + searchQuery + '&group=' + group + '&page=' + isPage + '&cat=' + kategori);
if (response.success) {
setJumlah(response.total)
setNameGroup(response.filter.name)
@@ -72,7 +73,7 @@ export default function ListDivision() {
useShallowEffect(() => {
setPage(1)
fetchData(true)
}, [status, searchQuery])
}, [status, searchQuery, kategori])

91
src/module/division_new/ui/tab_list_division.tsx
View File

@@ -4,7 +4,7 @@ import { useHookstate } from "@hookstate/core";
import { Box, rem, Tabs } from "@mantine/core";
import { useRouter, useSearchParams } from "next/navigation";
import { IoMdCheckmarkCircleOutline } from "react-icons/io";
import { IoCloseCircleOutline } from "react-icons/io5";
import { IoCloseCircleOutline, IoFileTrayOutline, IoFileTrayStackedOutline } from "react-icons/io5";
import ListDivision from "./list_division";
export default function TabListDivision() {
@@ -13,6 +13,7 @@ export default function TabListDivision() {
const searchParams = useSearchParams();
const status = searchParams.get("active");
const group = searchParams.get("group");
const kategori = searchParams.get("cat");
const tema = useHookstate(TEMA)
const roleLogin = useHookstate(globalRole)
@@ -22,40 +23,72 @@ export default function TabListDivision() {
variant="pills"
color={tema.get().bgFiturHome}
radius="xl"
defaultValue={status == "false" ? "false" : "true"}
defaultValue={status == "false" || kategori == "semua" ? "false" : "true"}
>
{
roleLogin.get() != '' ?
(roleLogin.get() != "user" && roleLogin.get() != "coadmin") &&
<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("/division?active=true&group=" + group);
roleLogin.get() != ''
?
(roleLogin.get() != "user" && roleLogin.get() != "coadmin")
?
<Tabs.List
bg={"white"}
style={{
border: `1px solid ${"#EDEDED"}`,
padding: 5,
borderRadius: 100,
}}
>
Aktif
</Tabs.Tab>
<Tabs.Tab
value="false"
w={"53%"}
leftSection={<IoCloseCircleOutline style={iconStyle} />}
onClick={() => {
router.push("/division?active=false&group=" + group);
<Tabs.Tab
value="true"
w={"45%"}
leftSection={<IoMdCheckmarkCircleOutline style={iconStyle} />}
onClick={() => {
router.push("/division?active=true&group=" + group);
}}
>
Aktif
</Tabs.Tab>
<Tabs.Tab
value="false"
w={"53%"}
leftSection={<IoCloseCircleOutline style={iconStyle} />}
onClick={() => {
router.push("/division?active=false&group=" + group);
}}
>
Tidak Aktif
</Tabs.Tab>
</Tabs.List>
:
<Tabs.List
bg={"white"}
style={{
border: `1px solid ${"#EDEDED"}`,
padding: 5,
borderRadius: 100,
}}
>
Tidak Aktif
</Tabs.Tab>
</Tabs.List>
<Tabs.Tab
value="true"
w={"45%"}
leftSection={<IoFileTrayOutline style={iconStyle} />}
onClick={() => {
router.push("/division");
}}
>
Divisi Saya
</Tabs.Tab>
<Tabs.Tab
value="false"
w={"53%"}
leftSection={<IoFileTrayStackedOutline style={iconStyle} />}
onClick={() => {
router.push("/division?cat=semua");
}}
>
Semua Divisi
</Tabs.Tab>
</Tabs.List>
: <></>
}
<ListDivision />