Deskripsi: - update api member - update type member - update list member - update create member - update edit member - update active and non active No Issue
59 lines
1.6 KiB
TypeScript
59 lines
1.6 KiB
TypeScript
"use client";
|
|
import { WARNA } from "@/module/_global";
|
|
import { Box, rem, Tabs, TextInput } from "@mantine/core";
|
|
import React from "react";
|
|
import { HiMagnifyingGlass, HiMiniUser } from "react-icons/hi2";
|
|
import { IoMdCheckmarkCircleOutline } from "react-icons/io";
|
|
import { IoCloseCircleOutline } from "react-icons/io5";
|
|
import TabListMember from "./tab_list_member";
|
|
import { useRouter, useSearchParams } from "next/navigation";
|
|
|
|
export default function ListMember() {
|
|
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("/member?active=true");
|
|
}}
|
|
>
|
|
Aktif
|
|
</Tabs.Tab>
|
|
<Tabs.Tab
|
|
value="tidak-aktif"
|
|
w={"53%"}
|
|
leftSection={<IoCloseCircleOutline style={iconStyle} />}
|
|
onClick={() => {
|
|
router.push("/member?active=false");
|
|
}}
|
|
>
|
|
Tidak Aktif
|
|
</Tabs.Tab>
|
|
</Tabs.List>
|
|
<TabListMember />
|
|
</Tabs>
|
|
</Box>
|
|
);
|
|
}
|