position

Deskripsi:
- edit position
- delete position

No Issues

app/(application)/position/_layout.tsx

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

app/(application)/position/index.tsx

@@ -8,7 +8,8 @@ import InputSearch from "@/components/inputSearch";
 import MenuItemRow from "@/components/menuItemRow";
 import { ColorsStatus } from "@/constants/ColorsStatus";
 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 { AntDesign, Feather, MaterialCommunityIcons } from "@expo/vector-icons";
 import { router, useLocalSearchParams } from "expo-router";
@@ -33,6 +34,10 @@ export default function Index() {
    const [data, setData] = useState<Props[]>([])
    const [search, setSearch] = useState('')
    const [nameGroup, setNameGroup] = useState('')
+   const [chooseData, setChooseData] = useState({ name: '', id: '', active: false, idGroup: '' })
+   const [error, setError] = useState({
+      name: false,
+   });
 
    const dispatch = useDispatch()
    const update = useSelector((state: any) => state.positionUpdate)
@@ -52,10 +57,54 @@ export default function Index() {
       handleLoad()
    }, [active, search, group, update])
 
-   function handleEdit() {
-      setVisibleEdit(false)
-      setModal(false)
-      ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT)
+
+   function handleChooseData(id: string, name: string, active: boolean, group: string) {
+      setChooseData({ id, name, active, idGroup: group })
+      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 (
@@ -92,7 +141,7 @@ export default function Index() {
                            return (
                               <BorderBottomItem
                                  key={index}
-                                 onPress={() => { setModal(true) }}
+                                 onPress={() => { handleChooseData(item.id, item.name, item.isActive, item.idGroup) }}
                                  borderType="all"
                                  icon={
                                     <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
@@ -111,16 +160,16 @@ export default function Index() {
             </View>
          </ScrollView>
 
-         <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
+         <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title={chooseData.name}>
             <View style={Styles.rowItemsCenter}>
                <MenuItemRow
                   icon={<MaterialCommunityIcons name="toggle-switch-off-outline" color="black" size={25} />}
-                  title="Non Aktifkan"
+                  title={chooseData.active ? 'Non Aktifkan' : "Aktifkan"}
                   onPress={() => {
                      AlertKonfirmasi({
                         title: 'Konfirmasi',
-                        desc: 'Apakah anda yakin ingin menonaktifkan data?',
-                        onPress: () => { handleEdit() }
+                        desc: chooseData.active ? 'Apakah anda yakin ingin menonaktifkan data?' : 'Apakah anda yakin ingin mengaktifkan data?',
+                        onPress: () => { handleDelete() }
                      })
                   }}
                />
@@ -133,13 +182,22 @@ export default function Index() {
          </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>
-                  <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>
-                  <ButtonForm text="SIMPAN" onPress={() => { handleEdit() }} />
+               <View style={Styles.mb30}>
+                  <ButtonForm text="SIMPAN" onPress={() => { checkForm() }} />
                </View>
             </View>
          </DrawerBottom>

components/drawerBottom.tsx

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

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