position
Deskripsi: - edit position - delete position No Issues
This commit is contained in:
@@ -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}>
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
@@ -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%' }]}>
|
||||||
|
|||||||
29
lib/api.ts
29
lib/api.ts
@@ -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;
|
};
|
||||||
// };
|
|
||||||
Reference in New Issue
Block a user