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

upd: lembaga desa

Browse Source 
Deskripsi:
- list data lembaga desa
- tambah data lembaga desa
- edit data lembaga desa
- pencarian data lembaga desa
- delete data lembaga desa

No Issues
This commit is contained in:
amel
2025-04-29 15:21:52 +08:00
parent 9b471eb269
commit e17963fb19
7 changed files with 206 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -6,20 +6,56 @@ 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,
});
function handleTambah() {
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 (
<>
@@ -51,13 +87,20 @@ export default function RootLayout() {
</View>
</DrawerBottom>
<DrawerBottom animation="none" isVisible={isVisibleTambah} setVisible={setVisibleTambah} title="Tambah Lembaga Desa">
<View style={{ justifyContent: 'space-between', flex: 1 }}>
<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" />
<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={() => { handleTambah() }} />
<ButtonForm text="SIMPAN" onPress={() => { onCheck() }} />
</View>
</View>
</DrawerBottom>

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

@@ -8,22 +8,79 @@ import InputSearch from "@/components/inputSearch";
import MenuItemRow from "@/components/menuItemRow";
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
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 { useState } from "react";
import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
import { useEffect, useState } from "react";
import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
import { useDispatch, useSelector } from "react-redux";
type Props = {
id: string
name: string
isActive: boolean
}
export default function Index() {
const { token, decryptToken } = useAuthSession()
const { active } = useLocalSearchParams<{ active?: string }>()
const [isModal, setModal] = useState(false)
const [isVisibleEdit, setVisibleEdit] = useState(false)
const [data, setData] = useState<Props[]>([])
const [search, setSearch] = useState('')
function handleEdit() {
const [idChoose, setIdChoose] = useState('')
const [activeChoose, setActiveChoose] = useState(true)
const [titleChoose, setTitleChoose] = useState('')
const dispatch = useDispatch()
const update = useSelector((state: any) => state.groupUpdate)
async function handleEdit() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiEditGroup({ user: hasil, name: titleChoose }, idChoose)
dispatch(setUpdateGroup(!update))
} catch (error) {
console.error(error)
} finally {
setVisibleEdit(false)
setModal(false)
ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT)
}
}
async function handleDelete() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiDeleteGroup({ user: hasil, isActive: activeChoose }, idChoose)
dispatch(setUpdateGroup(!update))
} catch (error) {
console.error(error)
} finally {
setModal(false)
ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT)
}
}
async function handleLoad() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiGetGroup({ user: hasil, active: String(active), search: search })
setData(response.data)
} catch (error) {
console.error(error)
}
}
useEffect(() => {
handleLoad()
}, [active, search, update])
return (
<SafeAreaView>
<ScrollView>
@@ -44,72 +101,47 @@ export default function Index() {
icon={<AntDesign name="closecircleo" color={active == "false" ? 'white' : 'black'} size={20} />}
n={2} />
</View>
<InputSearch />
<InputSearch onChange={setSearch} />
<View>
{
data.length > 0 ?
data.map((item, index) => {
return (
<BorderBottomItem
onPress={() => { setModal(true) }}
key={index}
onPress={() => {
setIdChoose(item.id)
setActiveChoose(item.isActive)
setTitleChoose(item.name)
setModal(true)
}}
borderType="all"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<MaterialCommunityIcons name="office-building-outline" size={25} color={'#384288'} />
</View>
}
title="Adat"
title={item.name}
/>
<BorderBottomItem
onPress={() => { setModal(true) }}
borderType="all"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<MaterialCommunityIcons name="office-building-outline" size={25} color={'#384288'} />
</View>
)
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada data</Text>
}
title="Dinas"
/>
<BorderBottomItem
onPress={() => { setModal(true) }}
borderType="all"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<MaterialCommunityIcons name="office-building-outline" size={25} color={'#384288'} />
</View>
}
title="PKK"
/>
<BorderBottomItem
onPress={() => { setModal(true) }}
borderType="all"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<MaterialCommunityIcons name="office-building-outline" size={25} color={'#384288'} />
</View>
}
title="Karang Taruna"
/>
<BorderBottomItem
onPress={() => { setModal(true) }}
borderType="all"
icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
<MaterialCommunityIcons name="office-building-outline" size={25} color={'#384288'} />
</View>
}
title="Koperasi"
/>
</View>
</View>
</ScrollView>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title={titleChoose}>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />}
title="Non Aktifkan"
title={activeChoose ? "Non Aktifkan" : "Aktifkan"}
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menonaktifkan data?',
onPress: () => { handleEdit() }
desc: activeChoose ? 'Apakah anda yakin ingin menonaktifkan data?' : 'Apakah anda yakin ingin mengaktifkan data?',
onPress: () => { handleDelete() }
})
}}
/>
@@ -124,10 +156,10 @@ export default function Index() {
</View>
</DrawerBottom>
<DrawerBottom animation="none" isVisible={isVisibleEdit} setVisible={setVisibleEdit} title="Edit Lembaga Desa">
<View style={{ justifyContent: 'space-between', flex: 1 }}>
<DrawerBottom animation="none" height={30} isVisible={isVisibleEdit} setVisible={setVisibleEdit} title="Edit Lembaga Desa">
<View style={{ flex: 1 }}>
<View>
<InputForm type="default" placeholder="Nama Lembaga Desa" required label="Lembaga Desa" />
<InputForm type="default" placeholder="Nama Lembaga Desa" required label="Lembaga Desa" value={titleChoose} onChange={setTitleChoose} />
</View>
<View>
<ButtonForm text="SIMPAN" onPress={() => { handleEdit() }} />

2
components/drawerBottom.tsx
View File

@@ -39,7 +39,7 @@ export default function DrawerBottom({ isVisible, setVisible, title, children, a
onSwipeComplete={() => setVisible(false)}
swipeDirection="down"
hideModalContentWhileAnimating={true}
onBackdropPress={() => { setVisible(false) }}
// onBackdropPress={() => { setVisible(true) }}
style={[{ justifyContent: 'flex-end', margin: 0 }]}
>
<View style={[Styles.modalContentNew, height != undefined ? { height: `${height}%` } : { height: '25%' }]}>

7
components/inputForm.tsx
View File

@@ -1,5 +1,5 @@
import Styles from "@/constants/Styles";
import { View, TextInput, Text, Dimensions } from "react-native";
import { Dimensions, Text, TextInput, View } from "react-native";
type Props = {
label?: string;
@@ -15,10 +15,11 @@ type Props = {
round?: boolean
width?: number
bg?: 'white' | 'transparent'
value?: string
};
export function InputForm({ label, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width, bg }: Props) {
export function InputForm({ label, value, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width, bg }: Props) {
const lebar = Dimensions.get("window").width;
if (itemLeft != undefined || itemRight != undefined) {
@@ -35,6 +36,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
<View style={[Styles.inputRoundForm, itemRight != undefined ? Styles.inputRoundFormRight : Styles.inputRoundFormLeft, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }, Styles.pv10]}>
{itemRight != undefined ? itemRight : itemLeft}
<TextInput
value={value}
placeholder={placeholder}
keyboardType={type}
onChangeText={onChange}
@@ -60,6 +62,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
)
}
<TextInput
value={value}
placeholder={placeholder}
keyboardType={type}
style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}

33
lib/api.ts
View File

@@ -49,6 +49,39 @@ export const apiGetDataHome = async ({ cat, user }: { cat: 'kegiatan' | 'divisio
return response.data;
};
export const apiGetGroup = async ({ user, active, search }: { user: string, active: string, search: string }) => {
const response = await api.get(`mobile/group?user=${user}&active=${active}&search=${search}`);
return response.data;
};
export const apiCreateGroup = async (data: { user: string, name: string }) => {
await api.post('mobile/group', data).then(response => {
return response.data;
})
.catch(error => {
console.error('Error:', error);
});
};
export const apiEditGroup = async (data: { user: string, name: string }, id: string) => {
await api.put(`mobile/group/${id}`, data).then(response => {
return response.data;
})
.catch(error => {
console.error('Error:', error);
});
};
export const apiDeleteGroup = async (data: { user: string, isActive: boolean }, id: string) => {
await api.delete(`mobile/group/${id}`, { data }).then(response => {
return response.data;
})
.catch(error => {
console.error('Error:', error);
});
};
// export const updateEntityById = async (id: any, updatedEntity: any) => {
// const response = await api.put(`/entities/${id}`, updatedEntity);
// return response.data;

14
lib/groupSlice.ts Normal file
View File

@@ -0,0 +1,14 @@
import { createSlice } from '@reduxjs/toolkit';
const groupUpdate = createSlice({
name: 'groupUpdate',
initialState: false,
reducers: {
setUpdateGroup: (state, action) => {
return action.payload;
},
},
});
export const { setUpdateGroup } = groupUpdate.actions;
export default groupUpdate.reducer;

4
lib/store.ts
View File

@@ -1,6 +1,7 @@
import { configureStore } from '@reduxjs/toolkit';
import bannerReducer from './bannerSlice';
import entitiesReducer from './entitiesSlice';
import groupUpdate from './groupSlice';
import userReducer from './userSlice';
@@ -8,7 +9,8 @@ const store = configureStore({
reducer: {
entities: entitiesReducer,
banner: bannerReducer,
user: userReducer
user: userReducer,
groupUpdate: groupUpdate
}
});