Deskripsi: - list data lembaga desa - tambah data lembaga desa - edit data lembaga desa - pencarian data lembaga desa - delete data lembaga desa No Issues
109 lines
3.9 KiB
TypeScript
109 lines
3.9 KiB
TypeScript
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>
|
|
</>
|
|
)
|
|
} |