Merge pull request #95 from bipproduction/lukman/7-agustus-2024
feat : update search
This commit is contained in:
@@ -8,10 +8,15 @@ export async function listGroups(req: NextRequest): Promise<Response> {
|
||||
const searchParams = req.nextUrl.searchParams
|
||||
const villaId = user.idVillage
|
||||
const active = searchParams.get('active');
|
||||
const name = searchParams.get('name');
|
||||
const groups = await prisma.group.findMany({
|
||||
where: {
|
||||
isActive: (active == "true" ? true : false),
|
||||
idVillage: String(villaId),
|
||||
name: {
|
||||
contains: String(name),
|
||||
mode: "insensitive"
|
||||
}
|
||||
},
|
||||
select: {
|
||||
id: true,
|
||||
|
||||
@@ -26,6 +26,7 @@ export default function ListGroupActive({ status }: { status: boolean }) {
|
||||
const [isData, setData] = useState<dataGroup[]>([]);
|
||||
const [selectId, setSelectId] = useState<string | null>(null);
|
||||
const [active, setActive] = useState<boolean | null>(null);
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const getData = async () => {
|
||||
@@ -33,7 +34,7 @@ export default function ListGroupActive({ status }: { status: boolean }) {
|
||||
setData([]);
|
||||
setLoading(true);
|
||||
const res = await fetch(
|
||||
`${API_ADDRESS.apiGetAllGroup}&villageId=121212&active=` + status
|
||||
`${API_ADDRESS.apiGetAllGroup}&villageId=121212&active=${status}&name=${searchQuery}`
|
||||
);
|
||||
const data = await res.json();
|
||||
setData(data);
|
||||
@@ -52,7 +53,7 @@ export default function ListGroupActive({ status }: { status: boolean }) {
|
||||
|
||||
useShallowEffect(() => {
|
||||
getData();
|
||||
}, [status]);
|
||||
}, [status, searchQuery]);
|
||||
|
||||
return (
|
||||
<Box pt={20}>
|
||||
@@ -68,6 +69,7 @@ export default function ListGroupActive({ status }: { status: boolean }) {
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
onChange={(e) => setSearchQuery(e.target.value)}
|
||||
/>
|
||||
{loading
|
||||
? Array(6)
|
||||
|
||||
@@ -10,6 +10,7 @@ export async function getAllPosition(req: NextRequest) {
|
||||
const searchParams = req.nextUrl.searchParams
|
||||
const groupID = searchParams.get('groupId');
|
||||
const active = searchParams.get('active');
|
||||
const name = searchParams.get('name')
|
||||
const user = await funGetUserByCookies()
|
||||
console.log(groupID)
|
||||
|
||||
@@ -23,6 +24,10 @@ export async function getAllPosition(req: NextRequest) {
|
||||
where: {
|
||||
idGroup: String(grupFix),
|
||||
isActive: (active == "true" ? true : false),
|
||||
name: {
|
||||
contains: String(name),
|
||||
mode: "insensitive"
|
||||
}
|
||||
},
|
||||
select: {
|
||||
id: true,
|
||||
|
||||
@@ -24,6 +24,7 @@ export default function ListPositionActive({ status }: { status: boolean }) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [selectId, setSelectId] = useState<string | null>(null);
|
||||
const [active, setActive] = useState<boolean | null>(null)
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const searchParams = useSearchParams()
|
||||
const group = searchParams.get('group')
|
||||
|
||||
@@ -31,7 +32,7 @@ export default function ListPositionActive({ status }: { status: boolean }) {
|
||||
try {
|
||||
setDataPosition([]);
|
||||
setLoading(true)
|
||||
const res = await fetch(`${API_ADDRESS.apiGetAllPosition}&active=${status}&groupId=${group}`);
|
||||
const res = await fetch(`${API_ADDRESS.apiGetAllPosition}&active=${status}&groupId=${group}&name=${searchQuery}`);
|
||||
const data = await res.json();
|
||||
setDataPosition(data);
|
||||
setLoading(false);
|
||||
@@ -44,7 +45,7 @@ export default function ListPositionActive({ status }: { status: boolean }) {
|
||||
|
||||
useShallowEffect(() => {
|
||||
getAllPosition();
|
||||
}, [status, group])
|
||||
}, [status, group, searchQuery])
|
||||
|
||||
return (
|
||||
<Box pt={20}>
|
||||
@@ -60,6 +61,7 @@ export default function ListPositionActive({ status }: { status: boolean }) {
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
onChange={(e) => setSearchQuery(e.target.value)}
|
||||
/>
|
||||
{loading ? Array(6).fill(null).map((_, i) => (
|
||||
<Box key={i}>
|
||||
|
||||
@@ -10,6 +10,7 @@ export async function getAllUser(req: NextRequest) {
|
||||
const idGroup = searchParams.get("groupId");
|
||||
const active = searchParams.get("active");
|
||||
const user = await funGetUserByCookies();
|
||||
const name = searchParams.get("name")
|
||||
|
||||
if (idGroup == "null" || idGroup == undefined) {
|
||||
fixGroup = user.idGroup
|
||||
@@ -21,6 +22,10 @@ export async function getAllUser(req: NextRequest) {
|
||||
where: {
|
||||
isActive: active == "true" ? true : false,
|
||||
idGroup: String(fixGroup),
|
||||
name: {
|
||||
contains: String(name),
|
||||
mode: "insensitive",
|
||||
}
|
||||
},
|
||||
select: {
|
||||
id: true,
|
||||
|
||||
@@ -26,21 +26,6 @@ export default function ListMember() {
|
||||
</Tabs.Tab>
|
||||
</Tabs.List>
|
||||
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
my={10}
|
||||
/>
|
||||
|
||||
<Tabs.Panel value="aktif">
|
||||
<TabListMember status={true} />
|
||||
</Tabs.Panel>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
|
||||
import { API_ADDRESS, WARNA } from "@/module/_global"
|
||||
import { Box, Group, ActionIcon, Text } from "@mantine/core"
|
||||
import { Box, Group, ActionIcon, Text, TextInput } from "@mantine/core"
|
||||
import { useShallowEffect } from "@mantine/hooks"
|
||||
import { useRouter, useSearchParams } from "next/navigation"
|
||||
import { useEffect, useState } from "react"
|
||||
import { HiMiniUser } from "react-icons/hi2"
|
||||
import { HiMagnifyingGlass, HiMiniUser } from "react-icons/hi2"
|
||||
|
||||
type dataMember = {
|
||||
id: string,
|
||||
@@ -23,13 +23,14 @@ export default function TabListMember({ status }: { status: boolean }) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [dataMember, setDataMember] = useState<dataMember[]>([])
|
||||
const searchParams = useSearchParams()
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const group = searchParams.get('group')
|
||||
|
||||
|
||||
async function getAllUser() {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res = await fetch(`${API_ADDRESS.apiGetAllUser}&active=${status}&groupId=${group}` )
|
||||
const res = await fetch(`${API_ADDRESS.apiGetAllUser}&active=${status}&groupId=${group}&name=${searchQuery}`)
|
||||
const data = await res.json()
|
||||
|
||||
setDataMember(data)
|
||||
@@ -43,32 +44,49 @@ export default function TabListMember({ status }: { status: boolean }) {
|
||||
|
||||
useShallowEffect(() => {
|
||||
getAllUser()
|
||||
}, [status])
|
||||
}, [status, searchQuery])
|
||||
|
||||
return (
|
||||
<>
|
||||
{dataMember.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i} onClick={() => {
|
||||
router.push(`/member/${v.id}`)
|
||||
}}>
|
||||
<Group align='center' style={{
|
||||
borderBottom: `1px solid #D9D9D9`,
|
||||
padding: 10,
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
|
||||
<HiMiniUser color={'white'} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
<Box>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
onChange={(e) => setSearchQuery(e.target.value)}
|
||||
my={10}
|
||||
/>
|
||||
{dataMember.map((v, i) => {
|
||||
return (
|
||||
<Box pt={20} key={i} onClick={() => {
|
||||
router.push(`/member/${v.id}`)
|
||||
}}>
|
||||
<Group align='center' style={{
|
||||
borderBottom: `1px solid #D9D9D9`,
|
||||
padding: 10,
|
||||
}} >
|
||||
<Box>
|
||||
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
|
||||
<HiMiniUser color={'white'} size={25} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
|
||||
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
|
||||
</Box>
|
||||
</Group>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
</>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user