upd: project

Deskripsi:
- detail project
- batal project
- edit project
- tambah tugas project
- update status tugas project

No Issues'

app/(application)/project/[id]/add-task.tsx

@@ -1,35 +1,104 @@
-import ButtonBackHeader from "@/components/buttonBackHeader"
-import ButtonSaveHeader from "@/components/buttonSaveHeader"
-import { InputForm } from "@/components/inputForm"
-import Styles from "@/constants/Styles"
-import dayjs from "dayjs"
-import { router, Stack, useLocalSearchParams } from "expo-router"
-import { useState } from "react"
-import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
-import DateTimePicker, { DateType, getDefaultStyles } from 'react-native-ui-datepicker'
+import ButtonBackHeader from "@/components/buttonBackHeader";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
+import { InputForm } from "@/components/inputForm";
+import Styles from "@/constants/Styles";
+import { apiCreateProjectTask } from "@/lib/api";
+import { setUpdateProject } from "@/lib/projectUpdate";
+import { useAuthSession } from "@/providers/AuthProvider";
+import dayjs from "dayjs";
+import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useEffect, useState } from "react";
+import {
+   SafeAreaView,
+   ScrollView,
+   Text,
+   ToastAndroid,
+   View,
+} from "react-native";
+import DateTimePicker, {
+   DateType
+} from "react-native-ui-datepicker";
+import { useDispatch, useSelector } from "react-redux";
 
 export default function ProjectAddTask() {
-   const { id } = useLocalSearchParams()
-   const [range, setRange] = useState<{ startDate: DateType; endDate: DateType; }>({ startDate: undefined, endDate: undefined });
-   const defaultStyles = getDefaultStyles()
+   const { token, decryptToken } = useAuthSession()
+   const dispatch = useDispatch()
+   const update = useSelector((state: any) => state.projectUpdate)
+   const { id } = useLocalSearchParams<{ id: string }>();
+   const [disable, setDisable] = useState(true);
+   const [range, setRange] = useState<{
+      startDate: DateType;
+      endDate: DateType;
+   }>({ startDate: undefined, endDate: undefined });
+   const [error, setError] = useState({
+      startDate: false,
+      endDate: false,
+      title: false,
+   })
+   const [title, setTitle] = useState('');
 
    const from = range.startDate
-      ? dayjs(range.startDate).format('MMM DD, YYYY')
-      : '';
-   const to = range.endDate ? dayjs(range.endDate).format('MMM DD, YYYY') : '';
+      ? dayjs(range.startDate).format("DD-MM-YYYY")
+      : "";
+   const to = range.endDate ? dayjs(range.endDate).format("DD-MM-YYYY") : "";
 
+   function checkAll() {
+      if (from == "" || to == "" || title == "" || title == "null" || error.startDate || error.endDate || error.title) {
+         setDisable(true)
+      } else {
+         setDisable(false)
+      }
+   }
+
+   function onValidation(cat: string, val: string) {
+      if (cat == "title") {
+         setTitle(val)
+         if (val == "" || val == "null") {
+            setError(error => ({ ...error, title: true }))
+         } else {
+            setError(error => ({ ...error, title: false }))
+         }
+      }
+   }
+
+   useEffect(() => {
+      checkAll()
+   }, [from, to, title, error])
+
+   async function handleCreate() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiCreateProjectTask({ data: { name: title, dateStart: new Date(from), dateEnd: new Date(to), user: hasil }, id });
+         if (response.success) {
+            dispatch(setUpdateProject({ ...update, task: !update.task, progress: !update.progress }))
+            ToastAndroid.show("Berhasil menambah data", ToastAndroid.SHORT);
+            router.back();
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
 
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Tambah Tugas',
-               headerTitleAlign: 'center',
-               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
-                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
-                  router.push('/project/4324')
-               }} />
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Tambah Tugas",
+               headerTitleAlign: "center",
+               headerRight: () => (
+                  <ButtonSaveHeader
+                     disable={disable}
+                     category="create"
+                     onPress={() => { handleCreate() }}
+                  />
+               ),
             }}
          />
          <ScrollView>
@@ -40,7 +109,6 @@ export default function ProjectAddTask() {
                      startDate={range.startDate}
                      endDate={range.endDate}
                      onChange={(param) => setRange(param)}
-                     // styles={defaultStyles}
                      styles={{
                         selected: Styles.selectedDate,
                         selected_label: Styles.cWhite,
@@ -48,35 +116,44 @@ export default function ProjectAddTask() {
                      }}
                   />
                </View>
-               <View style={[Styles.rowSpaceBetween, Styles.mv10]}>
-                  <View style={[{ width: '48%' }]}>
-                     <Text style={[Styles.mb05]}>Tanggal Mulai <Text style={Styles.cError}>*</Text></Text>
-                     <View style={[Styles.wrapPaper, Styles.p10]}>
-                        <Text style={{ textAlign: 'center' }}>{from}</Text>
-                     </View>
-                  </View>
-                  <View style={[{ width: '48%' }]}>
-                     <Text style={[Styles.mb05]}>Tanggal Berakhir <Text style={Styles.cError}>*</Text></Text>
-                     <View style={[Styles.wrapPaper, Styles.p10]}>
-                        <Text style={{ textAlign: 'center' }}>{to}</Text>
+               <View style={[Styles.mv10]}>
+                  <View style={[Styles.rowSpaceBetween]}>
+                     <View style={[{ width: "48%" }]}>
+                        <Text style={[Styles.mb05]}>
+                           Tanggal Mulai <Text style={Styles.cError}>*</Text>
+                        </Text>
+                        <View style={[Styles.wrapPaper, Styles.p10]}>
+                           <Text style={{ textAlign: "center" }}>{from}</Text>
+                        </View>
+                     </View>
+                     <View style={[{ width: "48%" }]}>
+                        <Text style={[Styles.mb05]}>
+                           Tanggal Berakhir <Text style={Styles.cError}>*</Text>
+                        </Text>
+                        <View style={[Styles.wrapPaper, Styles.p10]}>
+                           <Text style={{ textAlign: "center" }}>{to}</Text>
+                        </View>
                      </View>
                   </View>
+                  {
+                     (error.endDate || error.startDate) && <Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>Tanggal tidak boleh kosong</Text>
+                  }
                </View>
-               <InputForm label="Judul Tugas" type="default" placeholder="Judul Tugas" required bg="white" />
-               {/* <ButtonForm
-                  text="SIMPAN"
-                  onPress={() => {
-                     AlertKonfirmasi({
-                        title: 'Konfirmasi',
-                        desc: 'Apakah anda yakin ingin menambahkan data?',
-                        onPress: () => {
-                           ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
-                           router.push('/project/4324')
-                        }
-                     })
-                  }} /> */}
+               <InputForm
+                  label="Judul Tugas"
+                  type="default"
+                  placeholder="Judul Tugas"
+                  required
+                  bg="white"
+                  value={title}
+                  error={error.title}
+                  errorText="Judul tidak boleh kosong"
+                  onChange={(e) => {
+                     onValidation("title", e)
+                  }}
+               />
             </View>
          </ScrollView>
       </SafeAreaView>
-   )
-}
+   );
+}

app/(application)/project/[id]/cancel.tsx

@@ -1,42 +1,101 @@
-import ButtonBackHeader from "@/components/buttonBackHeader"
-import ButtonSaveHeader from "@/components/buttonSaveHeader"
-import { InputForm } from "@/components/inputForm"
-import Styles from "@/constants/Styles"
-import { router, Stack, useLocalSearchParams } from "expo-router"
-import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
+import ButtonBackHeader from "@/components/buttonBackHeader";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
+import { InputForm } from "@/components/inputForm";
+import Styles from "@/constants/Styles";
+import { apiCancelProject } from "@/lib/api";
+import { setUpdateProject } from "@/lib/projectUpdate";
+import { useAuthSession } from "@/providers/AuthProvider";
+import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useEffect, useState } from "react";
+import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
+import { useDispatch, useSelector } from "react-redux";
 
 export default function ProjectCancel() {
-   const { id } = useLocalSearchParams()
+   const { token, decryptToken } = useAuthSession();
+   const { id } = useLocalSearchParams<{ id: string }>();
+   const dispatch = useDispatch();
+   const update = useSelector((state: any) => state.projectUpdate);
+   const [reason, setReason] = useState("");
+   const [error, setError] = useState(false);
+   const [disable, setDisable] = useState(false);
+
+
+   function onValidation(val: string) {
+      setReason(val)
+      if (val == "" || val == "null") {
+         setError(true)
+      }else{
+         setError(false)
+      }
+   }
+
+   function checkAll() {
+      if (reason == "" || reason == "null" || error) {
+         setDisable(true)
+      } else {
+         setDisable(false)
+      }
+   }
+
+   useEffect(() => {
+      checkAll()
+   }, [reason, error]);
+
+   async function handleCancel() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiCancelProject({
+            reason: reason,
+            user: hasil,
+         }, id);
+         if (response.success) {
+            dispatch(setUpdateProject({ ...update, data: !update.data }))
+            ToastAndroid.show("Berhasil membatalkan kegiatan", ToastAndroid.SHORT);
+            router.back();
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Pembatalan Kegiatan',
-               headerTitleAlign: 'center',
-               headerRight: () => <ButtonSaveHeader category="cancel" onPress={() => {
-                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                  router.push('/project/4324')
-               }} />
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Pembatalan Kegiatan",
+               headerTitleAlign: "center",
+               headerRight: () => (
+                  <ButtonSaveHeader
+                     disable={disable}
+                     category="cancel"
+                     onPress={() => {
+                        handleCancel();
+                     }}
+                  />
+               ),
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
-               <InputForm label="Alasan Pembatalan" type="default" placeholder="Alasan Pembatalan" required bg="white" />
-               {/* <ButtonForm
-                  text="SIMPAN"
-                  onPress={() => {
-                     AlertKonfirmasi({
-                        title: 'Konfirmasi',
-                        desc: 'Apakah anda yakin ingin membatalkan kegiatan? Pembatalan bersifat permanen',
-                        onPress: () => {
-                           ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                           router.push('/project/4324')
-                        }
-                     })
-                  }} /> */}
+               <InputForm
+                  label="Alasan Pembatalan"
+                  type="default"
+                  placeholder="Alasan Pembatalan"
+                  required
+                  bg="white"
+                  error={error}
+                  errorText="Alasan pembatalan harus diisi"
+                  onChange={(val) => onValidation(val)}
+               />
             </View>
          </ScrollView>
       </SafeAreaView>
-   )
-}
+   );
+}

app/(application)/project/[id]/edit.tsx

@@ -1,42 +1,117 @@
-import ButtonBackHeader from "@/components/buttonBackHeader"
-import ButtonSaveHeader from "@/components/buttonSaveHeader"
-import { InputForm } from "@/components/inputForm"
-import Styles from "@/constants/Styles"
-import { router, Stack, useLocalSearchParams } from "expo-router"
-import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"
+import ButtonBackHeader from "@/components/buttonBackHeader";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
+import { InputForm } from "@/components/inputForm";
+import Styles from "@/constants/Styles";
+import { apiEditProject, apiGetProjectOne } from "@/lib/api";
+import { setUpdateProject } from "@/lib/projectUpdate";
+import { useAuthSession } from "@/providers/AuthProvider";
+import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useEffect, useState } from "react";
+import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
+import { useDispatch, useSelector } from "react-redux";
 
 export default function EditProject() {
-   const { id } = useLocalSearchParams()
+   const { token, decryptToken } = useAuthSession();
+   const { id } = useLocalSearchParams<{ id: string }>();
+   const dispatch = useDispatch()
+   const update = useSelector((state: any) => state.projectUpdate)
+   const [judul, setJudul] = useState("");
+   const [error, setError] = useState(false);
+   const [disable, setDisable] = useState(false);
+
+   async function handleLoad() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiGetProjectOne({
+            user: hasil,
+            cat: "data",
+            id: id,
+         });
+         setJudul(response.data.title);
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+   useEffect(() => {
+      handleLoad();
+   }, []);
+
+   function onValidation(val: string) {
+      setJudul(val)
+      if (val == "" || val == "null") {
+         setError(true)
+      }
+   }
+
+   function checkAll() {
+      if (judul == "" || judul == "null" || error) {
+         setDisable(true)
+      } else {
+         setDisable(false)
+      }
+   }
+
+   useEffect(() => {
+      checkAll()
+   }, [judul, error]);
+
+   async function handleUpdate() {
+      try {
+         const hasil = await decryptToken(String(token?.current));
+         const response = await apiEditProject({
+            name: judul,
+            user: hasil,
+         }, id);
+         if (response.success) {
+            dispatch(setUpdateProject({ ...update, data: !update.data }))
+            ToastAndroid.show("Berhasil mengubah data", ToastAndroid.SHORT);
+            router.back();
+         }
+      } catch (error) {
+         console.error(error);
+      }
+   }
+
+
+
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
-               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Edit Judul Kegiatan',
-               headerTitleAlign: 'center',
-               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
-                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                  router.push('/project/4324')
-               }} />
+               headerLeft: () => (
+                  <ButtonBackHeader
+                     onPress={() => {
+                        router.back();
+                     }}
+                  />
+               ),
+               headerTitle: "Edit Judul Kegiatan",
+               headerTitleAlign: "center",
+               headerRight: () => (
+                  <ButtonSaveHeader
+                     disable={disable}
+                     category="update"
+                     onPress={() => { handleUpdate() }}
+                  />
+               ),
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
-               <InputForm label="Judul Kegiatan" type="default" placeholder="Judul Kegiatan" required bg="white" />
-               {/* <ButtonForm
-                  text="SIMPAN"
-                  onPress={() => {
-                     AlertKonfirmasi({
-                        title: 'Konfirmasi',
-                        desc: 'Apakah anda yakin ingin mengubah data?',
-                        onPress: () => {
-                           ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                           router.push('/project/4324')
-                        }
-                     })
-                  }} /> */}
+               <InputForm
+                  label="Judul Kegiatan"
+                  type="default"
+                  placeholder="Judul Kegiatan"
+                  required
+                  bg="white"
+                  value={judul}
+                  onChange={(val) => { onValidation(val) }}
+                  error={error}
+                  errorText="Judul Kegiatan harus diisi"
+               />
             </View>
          </ScrollView>
       </SafeAreaView>
-   )
-}
+   );
+}

app/(application)/project/[id]/index.tsx

@@ -1,29 +1,78 @@
 import ButtonBackHeader from "@/components/buttonBackHeader";
 import HeaderRightProjectDetail from "@/components/project/headerProjectDetail";
-import SectionFile from "@/components/sectionFile";
-import SectionMember from "@/components/sectionMember";
+import SectionFile from "@/components/project/sectionFile";
+import SectionMember from "@/components/project/sectionMember";
+import SectionTanggalTugasProject from "@/components/project/sectionTanggalTugas";
+import SectionCancel from "@/components/sectionCancel";
 import SectionProgress from "@/components/sectionProgress";
-import SectionTanggalTugas from "@/components/sectionTanggalTugas";
 import Styles from "@/constants/Styles";
+import { apiGetProjectOne } from "@/lib/api";
+import { useAuthSession } from "@/providers/AuthProvider";
 import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useEffect, useState } from "react";
 import { SafeAreaView, ScrollView, View } from "react-native";
+import { useSelector } from "react-redux";
+
+
+type Props = {
+   id: string,
+   idVillage: string,
+   idGroup: string,
+   title: string,
+   status: number,
+   desc: string,
+   reason: string,
+   isActive: string,
+   createdBy: string,
+   createdAt: string,
+   updatedAt: string,
+}
 
 export default function DetailProject() {
-   const { id } = useLocalSearchParams()
+   const { token, decryptToken } = useAuthSession()
+   const { id } = useLocalSearchParams<{ id: string }>();
+   const [data, setData] = useState<Props>()
+   const [progress, setProgress] = useState(0)
+   const [loading, setLoading] = useState(true)
+   const update = useSelector((state: any) => state.projectUpdate)
+
+   async function handleLoad() {
+      try {
+         setLoading(true)
+         const hasil = await decryptToken(String(token?.current))
+         const response = await apiGetProjectOne({ user: hasil, cat: 'data', id: id })
+         setData(response.data)
+         const responseProgress = await apiGetProjectOne({ user: hasil, cat: 'progress', id: id })
+         setProgress(responseProgress.data.progress)
+      } catch (error) {
+         console.error(error)
+      } finally {
+         setLoading(false)
+      }
+   }
+
+   useEffect(() => {
+      handleLoad()
+   }, [update.data, update.progress])
+
+
    return (
       <SafeAreaView>
          <Stack.Screen
             options={{
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-               headerTitle: 'Judul Kegiatan',
+               headerTitle: loading ? '' : data?.title,
                headerTitleAlign: 'center',
                headerRight: () => <HeaderRightProjectDetail id={id} />,
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
-               <SectionProgress text="Kemajuan Kegiatan 50%" />
-               <SectionTanggalTugas category="project" />
+               {
+                  data?.reason != null && data?.reason != "" && <SectionCancel text={data?.reason} />
+               }
+               <SectionProgress text={`Kemajuan Kegiatan ${progress}%`} progress={progress} />
+               <SectionTanggalTugasProject />
                <SectionFile />
                <SectionMember />
             </View>