Merge pull request #95 from bipproduction/lukman/7-agustus-2024

feat : update search
This commit is contained in:
Amalia
2024-08-07 10:38:05 +08:00
committed by GitHub
7 changed files with 67 additions and 45 deletions

View File

@@ -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,

View File

@@ -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)

View File

@@ -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,

View File

@@ -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}>

View File

@@ -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,

View File

@@ -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>

View File

@@ -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>
</>
)
}