wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd: tab navigation

Browse Source 
Deskripsi:
- fix tab navigation :: diganti pake useState
- group
- position
- member
- diskusi umum
- project
- divisi
- tugas divisi

No Issues
This commit is contained in:
amel
2025-06-09 16:38:31 +08:00
parent d585f541ac
commit 88d9cd117d
14 changed files with 175 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/(application)/_layout.tsx
View File

@@ -1,7 +1,9 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import HeaderDiscussionGeneral from "@/components/discussion_general/headerDiscussionGeneral";
import HeaderRightDivisionList from "@/components/division/headerDivisionList";
import HeaderRightGroupList from "@/components/group/headerGroupList";
import HeaderMemberList from "@/components/member/headerMemberList";
import HeaderRightPositionList from "@/components/position/headerRightPositionList";
import HeaderRightProjectList from "@/components/project/headerProjectList";
import { Headers } from "@/constants/Headers";
import store from "@/lib/store";
@@ -30,8 +32,6 @@ export default function RootLayout() {
<Stack.Screen name="search" options={{ title: 'Pencarian' }} />
<Stack.Screen name="notification" options={{ title: 'Notifikasi' }} />
<Stack.Screen name="profile" options={{ title: 'Profile' }} />
<Stack.Screen name="group" options={{ title: 'Lembaga Desa', headerShown: false }} />
<Stack.Screen name="position" options={{ title: 'Jabatan', headerShown: false }} />
<Stack.Screen name="member/index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
title: 'Anggota',
@@ -56,7 +56,25 @@ export default function RootLayout() {
headerTitleAlign: 'center',
headerRight: () => <HeaderRightDivisionList />
}} />
<Stack.Screen name="coba" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.push('/home') }} />,
title: 'Latihan tab',
headerTitleAlign: 'center',
headerRight: () => <HeaderMemberList />
}} />
<Stack.Screen name="division/[id]/(fitur-division)" options={{ headerShown: false }} />
<Stack.Screen name="group/index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Lembaga Desa',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightGroupList />
}} />
<Stack.Screen name="position/index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Jabatan',
headerTitleAlign: 'center',
headerRight: () => <HeaderRightPositionList />
}} />
</Stack>
<StatusBar style="light" />
</Provider>

21
app/(application)/discussion/index.tsx
View File

@@ -33,12 +33,13 @@ export default function Discussion() {
const update = useSelector((state: any) => state.discussionGeneralDetailUpdate)
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 5 }, (_, index) => index)
const [status, setStatus] = useState<'true' | 'false'>('true')
async function handleLoad(loading: boolean) {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDiscussionGeneral({ user: hasil, active: String(active), search: search, group: String(group) })
const response = await apiGetDiscussionGeneral({ user: hasil, active: status, search: search, group: String(group) })
setData(response.data)
setNameGroup(response.filter.name)
} catch (error) {
@@ -50,7 +51,7 @@ export default function Discussion() {
useEffect(() => {
handleLoad(true)
}, [active, search, group])
}, [status, search, group])
useEffect(() => {
handleLoad(false)
@@ -62,18 +63,18 @@ export default function Discussion() {
<View style={[Styles.p15, Styles.mb100]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { router.push(`/discussion?active=true&group=${group}&search=${search}`) }}
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={active == "false" ? 'black' : 'white'} size={20} />}
icon={<Feather name="check-circle" color={status == "false" ? 'black' : 'white'} size={20} />}
n={2} />
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { router.push(`/discussion?active=false&group=${group}&search=${search}`) }}
onPress={() => { setStatus("false") }}
label="Arsip"
icon={<AntDesign name="closecircleo" color={active == "true" ? 'black' : 'white'} size={20} />}
icon={<AntDesign name="closecircleo" color={status == "true" ? 'black' : 'white'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />
@@ -107,7 +108,7 @@ export default function Discussion() {
}
title={item.title}
subtitle={
active != "false" && <LabelStatus category={item.status === 1 ? "success" : "error"} text={item.status === 1 ? "BUKA" : "TUTUP"} size="small" />
status != "false" && <LabelStatus category={item.status === 1 ? "success" : "error"} text={item.status === 1 ? "BUKA" : "TUTUP"} size="small" />
}
rightTopInfo={item.createdAt}
desc={item.desc}
@@ -118,7 +119,7 @@ export default function Discussion() {
</View>
}
rightBottomInfo={`${item.total_komentar} Komentar`}
/>
)
})

37
app/(application)/division/[id]/(fitur-division)/task/index.tsx
View File

@@ -38,6 +38,7 @@ export default function ListTask() {
const update = useSelector((state: any) => state.taskUpdate)
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 3 })
const [statusFix, setStatusFix] = useState<'0' | '1' | '2' | '3'>('0')
async function handleLoad(loading: boolean) {
try {
@@ -46,7 +47,7 @@ export default function ListTask() {
const response = await apiGetTask({
user: hasil,
division: id,
status,
status: statusFix,
search,
});
setData(response.data);
@@ -63,7 +64,7 @@ export default function ListTask() {
useEffect(() => {
handleLoad(true);
}, [status, search]);
}, [statusFix, search]);
return (
<SafeAreaView>
@@ -71,64 +72,56 @@ export default function ListTask() {
<View style={[Styles.p15, Styles.mb100]}>
<ScrollView horizontal style={[Styles.mb10]}>
<ButtonTab
active={status}
active={statusFix}
value="0"
onPress={() => {
router.replace("./task?status=0");
}}
onPress={() => { setStatusFix("0") }}
label="Segera"
icon={
<MaterialCommunityIcons
name="clock-alert-outline"
color={status == "0" ? "white" : "black"}
color={statusFix == "0" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={status}
active={statusFix}
value="1"
onPress={() => {
router.replace("./task?status=1");
}}
onPress={() => { setStatusFix("1") }}
label="Dikerjakan"
icon={
<MaterialCommunityIcons
name="progress-check"
color={status == "1" ? "white" : "black"}
color={statusFix == "1" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={status}
active={statusFix}
value="2"
onPress={() => {
router.replace("./task?status=2");
}}
onPress={() => { setStatusFix("2") }}
label="Selesai"
icon={
<Ionicons
name="checkmark-done-circle-outline"
color={status == "2" ? "white" : "black"}
color={statusFix == "2" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={status}
active={statusFix}
value="3"
onPress={() => {
router.replace("./task?status=3");
}}
onPress={() => { setStatusFix("3") }}
label="Batal"
icon={
<AntDesign
name="closecircleo"
color={status == "3" ? "white" : "black"}
color={statusFix == "3" ? "white" : "black"}
size={20}
/>
}

40
app/(application)/division/index.tsx
View File

@@ -42,6 +42,8 @@ export default function ListDivision() {
const update = useSelector((state: any) => state.divisionUpdate)
const arrSkeleton = Array.from({ length: 3 }, (_, index) => index)
const [loading, setLoading] = useState(false)
const [status, setStatus] = useState<'true' | 'false'>('true')
const [category, setCategory] = useState<'divisi-saya' | 'semua'>('divisi-saya')
async function handleLoad(loading: boolean) {
try {
@@ -49,10 +51,10 @@ export default function ListDivision() {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetDivision({
user: hasil,
active: String(active),
active: status,
search: search,
group: String(group),
kategori: String(cat),
kategori: category,
});
if (response.success) {
@@ -72,7 +74,7 @@ export default function ListDivision() {
useEffect(() => {
handleLoad(true);
}, [active, search, group, cat]);
}, [status, search, group, category]);
return (
<SafeAreaView>
@@ -82,32 +84,28 @@ export default function ListDivision() {
entityUser.role != "user" && entityUser.role != "coadmin" ?
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => {
router.replace(`/division?active=true&search=${search}&group=${group}&cat=${cat}`);
}}
onPress={() => { setStatus("true") }}
label="Aktif"
icon={
<Feather
name="check-circle"
color={active == "false" ? "black" : "white"}
color={status == "false" ? "black" : "white"}
size={20}
/>
}
n={2}
/>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => {
router.replace(`/division?active=false&search=${search}&group=${group}&cat=${cat}`);
}}
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={
<AntDesign
name="closecircleo"
color={active == "true" ? "black" : "white"}
color={status == "true" ? "black" : "white"}
size={20}
/>
}
@@ -117,32 +115,28 @@ export default function ListDivision() {
:
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={cat == "semua" ? "false" : "true"}
active={category == "semua" ? "false" : "true"}
value="true"
onPress={() => {
router.replace(`/division?&search=${search}&group=${group}&cat=divisi-saya`);
}}
onPress={() => { setCategory("divisi-saya") }}
label="Divisi Saya"
icon={
<Ionicons
name="file-tray-outline"
color={cat == "semua" ? "black" : "white"}
color={category == "semua" ? "black" : "white"}
size={20}
/>
}
n={2}
/>
<ButtonTab
active={cat == "semua" ? "false" : "true"}
active={category == "semua" ? "false" : "true"}
value="false"
onPress={() => {
router.replace(`/division?&search=${search}&group=${group}&cat=semua`);
}}
onPress={() => { setCategory("semua") }}
label="Semua Divisi"
icon={
<Ionicons
name="file-tray-stacked-outline"
color={cat == "semua" ? "white" : "black"}
color={category == "semua" ? "white" : "black"}
size={20}
/>
}

6
app/(application)/feature.tsx
View File

@@ -26,15 +26,15 @@ export default function Feature() {
<ButtonFiturMenu icon={<Ionicons name="chatbubbles-sharp" size={35} color="black" />} text="Diskusi" onPress={() => { router.push('/discussion?active=true') }} />
</View>
<View style={[Styles.rowSpaceBetween, Styles.mb15, (entityUser.role != 'supadmin' && entityUser.role != 'developer' && entityUser.role != 'cosupadmin' && Styles.w40)]}>
<ButtonFiturMenu icon={<MaterialIcons name="groups" size={35} color="black" />} text="Anggota" onPress={() => { router.push('/member?active=true') }} />
<ButtonFiturMenu icon={<MaterialCommunityIcons name="account-tie" size={35} color="black" />} text="Jabatan" onPress={() => { router.push('/position?active=true') }} />
<ButtonFiturMenu icon={<MaterialIcons name="groups" size={35} color="black" />} text="Anggota" onPress={() => { router.push('/member') }} />
<ButtonFiturMenu icon={<MaterialCommunityIcons name="account-tie" size={35} color="black" />} text="Jabatan" onPress={() => { router.push('/position') }} />
{
entityUser.role == "cosupadmin" && <ButtonFiturMenu icon={<Entypo name="image-inverted" size={35} color="black" />} text="Banner" onPress={() => { router.push('/banner') }} />
}
{
(entityUser.role == "supadmin" || entityUser.role == "developer") &&
<>
<ButtonFiturMenu icon={<AntDesign name="tags" size={35} color="black" />} text="Lembaga Desa" onPress={() => { router.push('/group?active=true') }} />
<ButtonFiturMenu icon={<AntDesign name="tags" size={35} color="black" />} text="Lembaga Desa" onPress={() => { router.push('/group') }} />
<ButtonFiturMenu icon={<Ionicons name="color-palette-sharp" size={35} color="black" />} text="Tema" onPress={() => { }} />
</>
}

109
app/(application)/group/_layout.tsx
View File

@@ -1,109 +0,0 @@
import ButtonBackHeader from "@/components/buttonBackHeader";
import { ButtonForm } from "@/components/buttonForm";
import ButtonMenuHeader from "@/components/buttonMenuHeader";
import DrawerBottom from "@/components/drawerBottom";
import { InputForm } from "@/components/inputForm";
import MenuItemRow from "@/components/menuItemRow";
import { Headers } from "@/constants/Headers";
import Styles from "@/constants/Styles";
import { apiCreateGroup } from "@/lib/api";
import { setUpdateGroup } from "@/lib/groupSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import AntDesign from "@expo/vector-icons/AntDesign";
import { router, Stack } from "expo-router";
import React, { useState } from "react";
import { ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
export default function RootLayout() {
const dispatch = useDispatch()
const update = useSelector((state: any) => state.groupUpdate)
const { token, decryptToken } = useAuthSession()
const [isVisible, setVisible] = useState(false)
const [isVisibleTambah, setVisibleTambah] = useState(false)
const [title, setTitle] = useState('')
const [error, setError] = useState({
title: false,
});
async function handleTambah() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiCreateGroup({ user: hasil, name: title })
dispatch(setUpdateGroup(!update))
} catch (error) {
console.error(error)
} finally {
setVisibleTambah(false)
setVisible(false)
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
}
}
function onCheck() {
if (Object.values(error).some((v) => v == true))
return false
handleTambah()
}
function validationForm(val: any, cat: 'title') {
if (cat === 'title') {
setTitle(val)
if (val == "" || val.length < 3) {
setError({ ...error, title: true })
} else {
setError({ ...error, title: false })
}
}
}
return (
<>
<Stack screenOptions={Headers.shadow}>
<Stack.Screen name="index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Lembaga Desa',
headerTitleAlign: 'center',
headerRight: () => <ButtonMenuHeader onPress={() => { setVisible(true) }} />
}} />
</Stack>
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Lembaga"
onPress={() => {
setVisible(false);
setTimeout(
() => {
setVisibleTambah(true)
},
100,
);
}}
/>
</View>
</DrawerBottom>
<DrawerBottom animation="none" height={30} isVisible={isVisibleTambah} setVisible={setVisibleTambah} title="Tambah Lembaga Desa">
<View style={{ flex: 1 }}>
<View>
<InputForm
type="default"
placeholder="Nama Lembaga Desa"
required label="Lembaga Desa"
error={error.title}
errorText="Lembaga Desa tidak boleh kosong & minimal 3 karakter"
onChange={(val) => { validationForm(val, 'title') }}
/>
</View>
<View>
<ButtonForm text="SIMPAN" onPress={() => { onCheck() }} />
</View>
</View>
</DrawerBottom>
</>
)
}

19
app/(application)/group/index.tsx
View File

@@ -13,7 +13,7 @@ import { apiDeleteGroup, apiEditGroup, apiGetGroup } from "@/lib/api";
import { setUpdateGroup } from "@/lib/groupSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
@@ -33,6 +33,7 @@ export default function Index() {
const [search, setSearch] = useState('')
const arrSkeleton = Array.from({ length: 5 }, (_, index) => index)
const [loading, setLoading] = useState(true)
const [status, setStatus] = useState<'true' | 'false'>('true')
const [idChoose, setIdChoose] = useState('')
const [activeChoose, setActiveChoose] = useState(true)
@@ -74,7 +75,7 @@ export default function Index() {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetGroup({ user: hasil, active: String(active), search: search })
const response = await apiGetGroup({ user: hasil, active: status, search: search })
setData(response.data)
} catch (error) {
console.error(error)
@@ -90,7 +91,7 @@ export default function Index() {
useEffect(() => {
handleLoad(true)
}, [active, search])
}, [status, search])
@@ -101,18 +102,18 @@ export default function Index() {
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { router.replace('/group?active=true') }}
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={active == "true" ? 'white' : 'black'} size={20} />}
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { router.replace('/group?active=false') }}
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={active == "false" ? 'white' : 'black'} size={20} />}
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />

17
app/(application)/member/index.tsx
View File

@@ -36,12 +36,13 @@ export default function Index() {
const update = useSelector((state: any) => state.memberUpdate)
const arrSkeleton = Array.from({ length: 5 }, (_, index) => index)
const [loading, setLoading] = useState(true)
const [status, setStatus] = useState<'true' | 'false'>('true')
async function handleLoad(loading: boolean) {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetUser({ user: hasil, active: String(active), search: search, group: String(group) })
const response = await apiGetUser({ user: hasil, active: status, search: search, group: String(group) })
setData(response.data)
setNameGroup(response.filter.name)
} catch (error) {
@@ -53,7 +54,7 @@ export default function Index() {
useEffect(() => {
handleLoad(true)
}, [active, search, group])
}, [status, search, group])
useEffect(() => {
handleLoad(false)
@@ -66,18 +67,18 @@ export default function Index() {
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { router.replace(`/member?active=true&group=${group}&search=${search}`) }}
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={active == "false" ? 'black' : 'white'} size={20} />}
icon={<Feather name="check-circle" color={status == "false" ? 'black' : 'white'} size={20} />}
n={2} />
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { router.replace(`/member?active=false&group=${group}&search=${search}`) }}
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={active == "false" ? 'white' : 'black'} size={20} />}
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />

182
app/(application)/position/_layout.tsx
View File

@@ -1,182 +0,0 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import { ButtonForm } from "@/components/buttonForm"
import ButtonMenuHeader from "@/components/buttonMenuHeader"
import DrawerBottom from "@/components/drawerBottom"
import { InputForm } from "@/components/inputForm"
import MenuItemRow from "@/components/menuItemRow"
import ModalFilter from "@/components/modalFilter"
import ModalSelect from "@/components/modalSelect"
import SelectForm from "@/components/selectForm"
import { Headers } from "@/constants/Headers"
import Styles from "@/constants/Styles"
import { apiCreatePosition } from "@/lib/api"
import { setUpdatePosition } from "@/lib/positionSlice"
import { useAuthSession } from "@/providers/AuthProvider"
import { AntDesign } from "@expo/vector-icons"
import { router, Stack } from "expo-router"
import { useState } from "react"
import { ToastAndroid, View } from "react-native"
import { useDispatch, useSelector } from "react-redux"
export default function RootLayout() {
const dispatch = useDispatch()
const update = useSelector((state: any) => state.positionUpdate)
const { token, decryptToken } = useAuthSession()
const entityUser = useSelector((state: any) => state.user)
const [isVisible, setVisible] = useState(false)
const [isVisibleTambah, setVisibleTambah] = useState(false)
const [isFilter, setFilter] = useState(false)
const [isSelect, setSelect] = useState(false)
const [choose, setChoose] = useState({ val: '', label: '' })
const [dataForm, setDataForm] = useState({
name: "",
idGroup: "",
})
const [error, setError] = useState({
name: false,
idGroup: false
});
function validationForm(val: any, cat: 'name' | 'idGroup') {
if (cat === 'name') {
setDataForm({ ...dataForm, name: val })
if (val == "") {
setError({ ...error, name: true })
} else {
setError({ ...error, name: false })
}
} else if (cat === "idGroup") {
setDataForm({ ...dataForm, idGroup: val })
if (val == "") {
setError({ ...error, idGroup: true })
} else {
setError({ ...error, idGroup: false })
}
}
}
function checkAll() {
let nilai = true
if (dataForm.name == "") {
setError(error => ({ ...error, name: true }))
nilai = false
}
if ((entityUser.role == "supadmin" || entityUser.role == "developer") && (dataForm.idGroup == "" || String(dataForm.idGroup) == "null")) {
setError(error => ({ ...error, idGroup: true }))
nilai = false
}
return nilai
}
function onCheck() {
const check = checkAll()
if (!check)
return false
handleTambah()
}
async function handleTambah() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiCreatePosition({ user: hasil, name: dataForm.name, idGroup: dataForm.idGroup })
dispatch(setUpdatePosition(!update))
} catch (error) {
console.error(error)
} finally {
setVisibleTambah(false)
setVisible(false)
ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
}
}
return (
<>
<Stack screenOptions={Headers.shadow}>
<Stack.Screen name="index" options={{
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
headerTitle: 'Jabatan',
headerTitleAlign: 'center',
headerRight: () => entityUser.role != 'user' ? <ButtonMenuHeader onPress={() => { setVisible(true) }} /> : <></>
}} />
</Stack>
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Jabatan"
onPress={() => {
setVisible(false)
setVisibleTambah(true)
}}
/>
{
(entityUser.role == 'supadmin' || entityUser.role == 'developer') &&
<MenuItemRow
icon={<AntDesign name="filter" color="black" size={25} />}
title="Filter"
onPress={() => { setFilter(true) }}
/>
}
</View>
</DrawerBottom>
<DrawerBottom animation="slide" height={45} isVisible={isVisibleTambah} setVisible={setVisibleTambah} title="Tambah Jabatan">
<View style={{ flex: 1, justifyContent: 'space-between' }}>
<View>
{
(entityUser.role == 'supadmin' || entityUser.role == 'developer') &&
<SelectForm
label="Lembaga Desa"
placeholder="Pilih Lembaga Desa"
value={choose.label}
required
onPress={() => {
setVisibleTambah(false)
setSelect(true)
}}
error={error.idGroup}
errorText="Lembaga Desa harus diisi"
/>
}
<InputForm
type="default"
placeholder="Nama Jabatan"
required
label="Jabatan"
onChange={(value) => { validationForm(value, 'name') }}
error={error.name}
errorText="Nama jabatan harus diisi"
value={dataForm.name}
/>
</View>
<View style={Styles.mb30}>
<ButtonForm text="SIMPAN" onPress={() => { onCheck() }} />
</View>
</View>
</DrawerBottom>
<ModalFilter close={() => {
setFilter(false)
setVisible(false)
}} open={isFilter} page="position" />
<ModalSelect
category="group"
close={setSelect}
onSelect={(value) => {
validationForm(value.val, 'idGroup')
setChoose(value)
setSelect(false)
setVisibleTambah(true)
}}
title="Lembaga Desa"
open={isSelect}
/>
</>
)
}

19
app/(application)/position/index.tsx
View File

@@ -13,7 +13,7 @@ import { apiDeletePosition, apiEditPosition, apiGetPosition } from "@/lib/api";
import { setUpdatePosition } from "@/lib/positionSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
@@ -30,6 +30,7 @@ export default function Index() {
const arrSkeleton = Array.from({ length: 5 }, (_, index) => index)
const [loading, setLoading] = useState(true)
const { token, decryptToken } = useAuthSession()
const [status, setStatus] = useState<'true' | 'false'>('true')
const entityUser = useSelector((state: any) => state.user)
const { active, group } = useLocalSearchParams<{ active?: string, group?: string }>()
const [isModal, setModal] = useState(false)
@@ -49,7 +50,7 @@ export default function Index() {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetPosition({ user: hasil, active: String(active), search: search, group: String(group) })
const response = await apiGetPosition({ user: hasil, active: status, search: search, group: String(group) })
setData(response.data)
setNameGroup(response.filter.name)
} catch (error) {
@@ -66,7 +67,7 @@ export default function Index() {
useEffect(() => {
handleLoad(true)
}, [active, search, group])
}, [status, search, group])
function handleChooseData(id: string, name: string, active: boolean, group: string) {
@@ -124,18 +125,18 @@ export default function Index() {
<View style={[Styles.p15]}>
<View style={[Styles.wrapBtnTab]}>
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="true"
onPress={() => { router.replace(`/position?active=true&group=${group}&search=${search}`) }}
onPress={() => { setStatus("true") }}
label="Aktif"
icon={<Feather name="check-circle" color={active == "true" ? 'white' : 'black'} size={20} />}
icon={<Feather name="check-circle" color={status == "true" ? 'white' : 'black'} size={20} />}
n={2} />
<ButtonTab
active={active == "false" ? "false" : "true"}
active={status == "false" ? "false" : "true"}
value="false"
onPress={() => { router.replace(`/position?active=false&group=${group}&search=${search}`) }}
onPress={() => { setStatus("false") }}
label="Tidak Aktif"
icon={<AntDesign name="closecircleo" color={active == "false" ? 'white' : 'black'} size={20} />}
icon={<AntDesign name="closecircleo" color={status == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch onChange={setSearch} />

45
app/(application)/project/index.tsx
View File

@@ -36,6 +36,7 @@ export default function ListProject() {
group?: string;
cat?: string;
}>();
const [statusFix, setStatusFix] = useState<'0' | '1' | '2' | '3'>('0')
const { token, decryptToken } = useAuthSession();
const entityUser = useSelector((state: any) => state.user);
const [search, setSearch] = useState("");
@@ -52,7 +53,7 @@ export default function ListProject() {
const hasil = await decryptToken(String(token?.current));
const response = await apiGetProject({
user: hasil,
status: String(status),
status: statusFix,
search: search,
group: String(group),
kategori: String(cat),
@@ -76,7 +77,7 @@ export default function ListProject() {
useEffect(() => {
handleLoad(true);
}, [status, search, group, cat]);
}, [statusFix, search, group, cat]);
return (
<SafeAreaView>
@@ -84,72 +85,56 @@ export default function ListProject() {
<View style={[Styles.p15, Styles.mb100]}>
<ScrollView horizontal style={[Styles.mb10]}>
<ButtonTab
active={String(status)}
active={statusFix}
value="0"
onPress={() => {
router.replace(
`/project?status=0&group=${group}&search=${search}&cat=${cat}`
);
}}
onPress={() => { setStatusFix("0") }}
label="Segera"
icon={
<MaterialCommunityIcons
name="clock-alert-outline"
color={status == "0" ? "white" : "black"}
color={statusFix == "0" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={String(status)}
active={statusFix}
value="1"
onPress={() => {
router.replace(
`/project?status=1&group=${group}&search=${search}&cat=${cat}`
);
}}
onPress={() => { setStatusFix("1") }}
label="Dikerjakan"
icon={
<MaterialCommunityIcons
name="progress-check"
color={status == "1" ? "white" : "black"}
color={statusFix == "1" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={String(status)}
active={statusFix}
value="2"
onPress={() => {
router.replace(
`/project?status=2&group=${group}&search=${search}&cat=${cat}`
);
}}
onPress={() => { setStatusFix("2") }}
label="Selesai"
icon={
<Ionicons
name="checkmark-done-circle-outline"
color={status == "2" ? "white" : "black"}
color={statusFix == "2" ? "white" : "black"}
size={20}
/>
}
n={4}
/>
<ButtonTab
active={String(status)}
active={statusFix}
value="3"
onPress={() => {
router.replace(
`/project?status=3&group=${group}&search=${search}&cat=${cat}`
);
}}
onPress={() => { setStatusFix("3") }}
label="Batal"
icon={
<AntDesign
name="closecircleo"
color={status == "3" ? "white" : "black"}
color={statusFix == "3" ? "white" : "black"}
size={20}
/>
}