upd: pencarian
Deskripsi: - halaman pencarian NO Issues
This commit is contained in:
amel
@@ -12,7 +12,7 @@ export default function Notification() {
|
||||
<Stack.Screen
|
||||
options={{
|
||||
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
|
||||
headerTitle: 'Pencarian',
|
||||
headerTitle: 'Notifikasi',
|
||||
headerTitleAlign: 'center'
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -1,14 +1,62 @@
|
||||
import BorderBottomItem from "@/components/borderBottomItem";
|
||||
import ButtonBackHeader from "@/components/buttonBackHeader";
|
||||
import { InputForm } from "@/components/inputForm";
|
||||
import InputSearch from "@/components/inputSearch";
|
||||
import { ColorsStatus } from "@/constants/ColorsStatus";
|
||||
import Styles from "@/constants/Styles";
|
||||
import { AntDesign, Feather, MaterialIcons } from "@expo/vector-icons";
|
||||
import { apiGetSearch } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { AntDesign, MaterialIcons } from "@expo/vector-icons";
|
||||
import { router, Stack } from "expo-router";
|
||||
import { Image, SafeAreaView, ScrollView, Text, View } from "react-native";
|
||||
import { useState } from "react";
|
||||
import { FlatList, Image, SafeAreaView, Text, View } from "react-native";
|
||||
|
||||
type PropsUser = {
|
||||
id: string
|
||||
name: string
|
||||
email: string
|
||||
position: string
|
||||
group: string
|
||||
img: string
|
||||
}
|
||||
|
||||
type PropProject = {
|
||||
id: string
|
||||
title: string
|
||||
group: string
|
||||
}
|
||||
|
||||
type PropDivisi = {
|
||||
id: string
|
||||
name: string
|
||||
desc: string
|
||||
group: string
|
||||
}
|
||||
|
||||
export default function Search() {
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const [dataUser, setDataUser] = useState<PropsUser[]>([])
|
||||
const [dataDivisi, setDataDivisi] = useState<PropDivisi[]>([])
|
||||
const [dataProject, setDataProject] = useState<PropProject[]>([])
|
||||
|
||||
async function handleSearch(cari: string) {
|
||||
try {
|
||||
if (cari.length > 3) {
|
||||
const user = await decryptToken(String(token?.current))
|
||||
const hasil = await apiGetSearch({ text: cari, user: user })
|
||||
setDataUser(hasil.user)
|
||||
setDataDivisi(hasil.division)
|
||||
setDataProject(hasil.project)
|
||||
} else {
|
||||
setDataUser([])
|
||||
setDataDivisi([])
|
||||
setDataProject([])
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<SafeAreaView>
|
||||
@@ -19,101 +67,92 @@ export default function Search() {
|
||||
headerTitleAlign: 'center'
|
||||
}}
|
||||
/>
|
||||
<ScrollView>
|
||||
<View style={[Styles.p15]}>
|
||||
<InputSearch />
|
||||
<View style={[Styles.wrapPaper, Styles.mb100]}>
|
||||
<View style={[Styles.mb30]}>
|
||||
<Text>ANGGOTA</Text>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={<Image
|
||||
source={require("../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileSmall]}
|
||||
/>}
|
||||
title="Amalia Dwi"
|
||||
subtitle="Dinas - Bendaraha"
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={<Image
|
||||
source={require("../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileSmall]}
|
||||
/>}
|
||||
title="Amalia Dwi"
|
||||
subtitle="Dinas - Bendaraha"
|
||||
/>
|
||||
{/* <ScrollView> */}
|
||||
<View style={[Styles.p15]}>
|
||||
<InputSearch onChange={handleSearch} />
|
||||
{
|
||||
dataProject.length + dataDivisi.length + dataUser.length > 0
|
||||
?
|
||||
<View style={[Styles.wrapPaper, Styles.mb100]}>
|
||||
{
|
||||
dataUser.length > 0 &&
|
||||
<View style={[Styles.mb30]}>
|
||||
<Text>ANGGOTA</Text>
|
||||
<FlatList
|
||||
data={dataUser}
|
||||
keyExtractor={(item) => String(item.id)}
|
||||
renderItem={({ item }) => (
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={<Image
|
||||
source={{ uri: `https://wibu-storage.wibudev.com/api/files/${item.img}` }}
|
||||
style={[Styles.userProfileSmall]}
|
||||
/>}
|
||||
title={item.name}
|
||||
subtitle={`${item.group}-${item.position}`}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</View>
|
||||
}
|
||||
|
||||
{
|
||||
dataDivisi.length > 0 &&
|
||||
<View style={[Styles.mb30]}>
|
||||
<Text>DIVISI</Text>
|
||||
<FlatList
|
||||
data={dataDivisi}
|
||||
keyExtractor={(item) => String(item.id)}
|
||||
renderItem={({ item }) => (
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<MaterialIcons name="group" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title={item.name}
|
||||
subtitle={item.group}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</View>
|
||||
}
|
||||
|
||||
|
||||
{
|
||||
dataProject.length > 0 &&
|
||||
<View style={[Styles.mb05]}>
|
||||
<Text>KEGIATAN</Text>
|
||||
<FlatList
|
||||
data={dataProject}
|
||||
keyExtractor={(item) => String(item.id)}
|
||||
renderItem={({ item }) => (
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<AntDesign name="areachart" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title={item.title}
|
||||
subtitle={item.group}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</View>
|
||||
}
|
||||
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={<Image
|
||||
source={require("../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileSmall]}
|
||||
/>}
|
||||
title="Amalia Dwi"
|
||||
subtitle="Dinas - Bendaraha"
|
||||
/>
|
||||
</View>
|
||||
|
||||
<View style={[Styles.mb30]}>
|
||||
<Text>DIVISI</Text>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<MaterialIcons name="group" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title="TU dan Umum"
|
||||
subtitle="Dinas"
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<MaterialIcons name="group" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title="TU dan Umum"
|
||||
subtitle="Dinas"
|
||||
/>
|
||||
</View>
|
||||
<View style={[Styles.mb05]}>
|
||||
<Text>KEGIATAN</Text>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<AntDesign name="areachart" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title="Kerja Bakti"
|
||||
subtitle="Dinas"
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<AntDesign name="areachart" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title="Pasar Ramadhan"
|
||||
subtitle="Dinas"
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.primary]}>
|
||||
<AntDesign name="areachart" size={25} color="white" />
|
||||
</View>
|
||||
}
|
||||
title="Pasar Ramadhan"
|
||||
subtitle="Dinas"
|
||||
/>
|
||||
:
|
||||
<View style={Styles.contentItemCenter}>
|
||||
<Text style={[Styles.textInformation, Styles.cGray]}>Tidak ada data</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
}
|
||||
|
||||
</View>
|
||||
{/* </ScrollView> */}
|
||||
</SafeAreaView>
|
||||
</>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user