Deskripsi:
- edit position
- delete position

No Issues
This commit is contained in:
amel
2025-05-02 11:13:44 +08:00
parent 6fed63f630
commit 3379ea736c
4 changed files with 95 additions and 32 deletions

View File

@@ -151,6 +151,7 @@ export default function RootLayout() {
onChange={(value) => { validationForm(value, 'name') }} onChange={(value) => { validationForm(value, 'name') }}
error={error.name} error={error.name}
errorText="Nama jabatan harus diisi" errorText="Nama jabatan harus diisi"
value={dataForm.name}
/> />
</View> </View>
<View style={Styles.mb30}> <View style={Styles.mb30}>

View File

@@ -8,7 +8,8 @@ import InputSearch from "@/components/inputSearch";
import MenuItemRow from "@/components/menuItemRow"; import MenuItemRow from "@/components/menuItemRow";
import { ColorsStatus } from "@/constants/ColorsStatus"; import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles"; import Styles from "@/constants/Styles";
import { apiGetPosition } from "@/lib/api"; import { apiDeletePosition, apiEditPosition, apiGetPosition } from "@/lib/api";
import { setUpdatePosition } from "@/lib/positionSlice";
import { useAuthSession } from "@/providers/AuthProvider"; import { useAuthSession } from "@/providers/AuthProvider";
import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons"; import { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router"; import { router, useLocalSearchParams } from "expo-router";
@@ -33,6 +34,10 @@ export default function Index() {
const [data, setData] = useState<Props[]>([]) const [data, setData] = useState<Props[]>([])
const [search, setSearch] = useState('') const [search, setSearch] = useState('')
const [nameGroup, setNameGroup] = useState('') const [nameGroup, setNameGroup] = useState('')
const [chooseData, setChooseData] = useState({ name: '', id: '', active: false, idGroup: '' })
const [error, setError] = useState({
name: false,
});
const dispatch = useDispatch() const dispatch = useDispatch()
const update = useSelector((state: any) => state.positionUpdate) const update = useSelector((state: any) => state.positionUpdate)
@@ -52,10 +57,54 @@ export default function Index() {
handleLoad() handleLoad()
}, [active, search, group, update]) }, [active, search, group, update])
function handleEdit() {
setVisibleEdit(false) function handleChooseData(id: string, name: string, active: boolean, group: string) {
setModal(false) setChooseData({ id, name, active, idGroup: group })
ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT) setModal(true)
}
async function handleDelete() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiDeletePosition({ user: hasil, isActive: chooseData.active }, chooseData.id)
dispatch(setUpdatePosition(!update))
} catch (error) {
console.error(error)
} finally {
setModal(false)
ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT)
}
}
async function handleEdit() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiEditPosition({ user: hasil, name: chooseData.name, idGroup: chooseData.idGroup }, chooseData.id)
dispatch(setUpdatePosition(!update))
} catch (error) {
console.error(error)
} finally {
setVisibleEdit(false)
setModal(false)
ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT)
}
}
function validationForm(value: string) {
setChooseData({ ...chooseData, name: value })
if (value == "") {
setError({ ...error, name: true })
} else {
setError({ ...error, name: false })
}
}
function checkForm() {
if (Object.values(error).some((v) => v == true))
return false
handleEdit()
} }
return ( return (
@@ -92,7 +141,7 @@ export default function Index() {
return ( return (
<BorderBottomItem <BorderBottomItem
key={index} key={index}
onPress={() => { setModal(true) }} onPress={() => { handleChooseData(item.id, item.name, item.isActive, item.idGroup) }}
borderType="all" borderType="all"
icon={ icon={
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}> <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
@@ -111,16 +160,16 @@ export default function Index() {
</View> </View>
</ScrollView> </ScrollView>
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu"> <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title={chooseData.name}>
<View style={Styles.rowItemsCenter}> <View style={Styles.rowItemsCenter}>
<MenuItemRow <MenuItemRow
icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />} icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />}
title="Non Aktifkan" title={chooseData.active ? 'Non Aktifkan' : "Aktifkan"}
onPress={() => { onPress={() => {
AlertKonfirmasi({ AlertKonfirmasi({
title: 'Konfirmasi', title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menonaktifkan data?', desc: chooseData.active ? 'Apakah anda yakin ingin menonaktifkan data?' : 'Apakah anda yakin ingin mengaktifkan data?',
onPress: () => { handleEdit() } onPress: () => { handleDelete() }
}) })
}} }}
/> />
@@ -133,13 +182,22 @@ export default function Index() {
</DrawerBottom> </DrawerBottom>
<DrawerBottom animation="none" isVisible={isVisibleEdit} setVisible={setVisibleEdit} title="Edit Jabatan"> <DrawerBottom animation="none" height={30} backdropPressable={false} isVisible={isVisibleEdit} setVisible={setVisibleEdit} title="Edit Jabatan">
<View style={{ justifyContent: 'space-between', flex: 1 }}> <View style={{ justifyContent: 'space-between', flex: 1 }}>
<View> <View>
<InputForm type="default" placeholder="Nama Jabatan" required label="Jabatan" /> <InputForm
type="default"
placeholder="Nama Jabatan"
required
label="Jabatan"
value={chooseData.name}
onChange={(val) => { validationForm(val) }}
error={error.name}
errorText="Nama jabatan tidak boleh kosong"
/>
</View> </View>
<View> <View style={Styles.mb30}>
<ButtonForm text="SIMPAN" onPress={() => { handleEdit() }} /> <ButtonForm text="SIMPAN" onPress={() => { checkForm() }} />
</View> </View>
</View> </View>
</DrawerBottom> </DrawerBottom>

View File

@@ -1,6 +1,6 @@
import Styles from "@/constants/Styles" import Styles from "@/constants/Styles";
import { MaterialIcons } from "@expo/vector-icons" import { MaterialIcons } from "@expo/vector-icons";
import { Pressable, Text, View } from "react-native" import { Pressable, Text, View } from "react-native";
import Modal from 'react-native-modal'; import Modal from 'react-native-modal';
type Props = { type Props = {
@@ -10,9 +10,10 @@ type Props = {
children: React.ReactNode children: React.ReactNode
animation?: 'slide' | 'none' | 'fade' animation?: 'slide' | 'none' | 'fade'
height?: number height?: number
backdropPressable?: boolean
} }
export default function DrawerBottom({ isVisible, setVisible, title, children, animation, height }: Props) { export default function DrawerBottom({ isVisible, setVisible, title, children, animation, height, backdropPressable = true }: Props) {
return ( return (
// <Modal // <Modal
// animationType={animation} // animationType={animation}
@@ -39,7 +40,7 @@ export default function DrawerBottom({ isVisible, setVisible, title, children, a
onSwipeComplete={() => setVisible(false)} onSwipeComplete={() => setVisible(false)}
swipeDirection="down" swipeDirection="down"
hideModalContentWhileAnimating={true} hideModalContentWhileAnimating={true}
// onBackdropPress={() => { setVisible(true) }} onBackdropPress={() => { setVisible(!backdropPressable) }}
style={[{ justifyContent: 'flex-end', margin: 0 }]} style={[{ justifyContent: 'flex-end', margin: 0 }]}
> >
<View style={[Styles.modalContentNew, height != undefined ? { height: `${height}%` } : { height: '25%' }]}> <View style={[Styles.modalContentNew, height != undefined ? { height: `${height}%` } : { height: '25%' }]}>

View File

@@ -96,17 +96,20 @@ export const apiCreatePosition = async (data: { user: string, name: string, idGr
}; };
// export const updateEntityById = async (id: any, updatedEntity: any) => { export const apiDeletePosition = async (data: { user: string, isActive: boolean }, id: string) => {
// const response = await api.put(`/entities/${id}`, updatedEntity); await api.delete(`mobile/position/${id}`, { data }).then(response => {
// return response.data; return response.data;
// }; })
.catch(error => {
console.error('Error:', error);
});
};
// export const deleteEntityById = async (id: any) => { export const apiEditPosition = async (data: { user: string, name: string, idGroup: string }, id: string) => {
// const response = await api.delete(`/entities/${id}`); await api.put(`mobile/position/${id}`, data).then(response => {
// return response.data; return response.data;
// }; })
.catch(error => {
// export const checkAccount = async (newEntity: { phone: string }) => { console.error('Error:', error);
// const response = await api.post('/auth/login', newEntity); });
// return response.data; };
// };