From 4139c9579450acf1d2d7d30a8c003ec1ff8578b6 Mon Sep 17 00:00:00 2001 From: amel Date: Thu, 13 Mar 2025 14:56:24 +0800 Subject: [PATCH] upd: project Deskripsi: - update button save pada tambah edit project - ui edit tugas dan tanggal project - modal menu detail tugas dan tanggal - modal menu detail file - modal menu detail anggota project No Issues --- app/(application)/project/[id]/add-file.tsx | 11 +- app/(application)/project/[id]/add-task.tsx | 13 +- app/(application)/project/[id]/cancel.tsx | 11 +- app/(application)/project/[id]/edit.tsx | 55 +++++---- app/(application)/project/create.tsx | 13 +- app/(application)/project/update/[detail].tsx | 65 ++++++++++ components/buttonSaveHeader.tsx | 8 +- components/itemSectionTanggalTugas.tsx | 9 +- components/modalSelect.tsx | 56 ++++++--- components/sectionFile.tsx | 82 ++++++++++--- components/sectionMember.tsx | 115 ++++++++++++------ components/sectionTanggalTugas.tsx | 78 ++++++++++-- 12 files changed, 387 insertions(+), 129 deletions(-) create mode 100644 app/(application)/project/update/[detail].tsx diff --git a/app/(application)/project/[id]/add-file.tsx b/app/(application)/project/[id]/add-file.tsx index f65fef7..8d93a69 100644 --- a/app/(application)/project/[id]/add-file.tsx +++ b/app/(application)/project/[id]/add-file.tsx @@ -1,7 +1,6 @@ -import AlertKonfirmasi from "@/components/alertKonfirmasi" import BorderBottomItem from "@/components/borderBottomItem" import ButtonBackHeader from "@/components/buttonBackHeader" -import { ButtonForm } from "@/components/buttonForm" +import ButtonSaveHeader from "@/components/buttonSaveHeader" import ButtonSelect from "@/components/buttonSelect" import Styles from "@/constants/Styles" import { MaterialCommunityIcons } from "@expo/vector-icons" @@ -18,6 +17,10 @@ export default function ProjectAddFile() { headerLeft: () => { router.back() }} />, headerTitle: 'Tambah File', headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT) + router.push('/project/4324') + }} /> }} /> @@ -40,7 +43,7 @@ export default function ProjectAddFile() { /> - { AlertKonfirmasi({ @@ -51,7 +54,7 @@ export default function ProjectAddFile() { router.push('/project/4324') } }) - }} /> + }} /> */} diff --git a/app/(application)/project/[id]/add-task.tsx b/app/(application)/project/[id]/add-task.tsx index 583fa3d..48786c8 100644 --- a/app/(application)/project/[id]/add-task.tsx +++ b/app/(application)/project/[id]/add-task.tsx @@ -1,13 +1,12 @@ -import AlertKonfirmasi from "@/components/alertKonfirmasi" import ButtonBackHeader from "@/components/buttonBackHeader" -import { ButtonForm } from "@/components/buttonForm" +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 DateTimePicker, { DateType, getDefaultStyles } from 'react-native-ui-datepicker' export default function ProjectAddTask() { const { id } = useLocalSearchParams() @@ -27,6 +26,10 @@ export default function ProjectAddTask() { headerLeft: () => { router.back() }} />, headerTitle: 'Tambah Tugas', headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT) + router.push('/project/4324') + }} /> }} /> @@ -55,7 +58,7 @@ export default function ProjectAddTask() { - { AlertKonfirmasi({ @@ -66,7 +69,7 @@ export default function ProjectAddTask() { router.push('/project/4324') } }) - }} /> + }} /> */} diff --git a/app/(application)/project/[id]/cancel.tsx b/app/(application)/project/[id]/cancel.tsx index 2cadfd8..a082533 100644 --- a/app/(application)/project/[id]/cancel.tsx +++ b/app/(application)/project/[id]/cancel.tsx @@ -1,6 +1,5 @@ -import AlertKonfirmasi from "@/components/alertKonfirmasi" import ButtonBackHeader from "@/components/buttonBackHeader" -import { ButtonForm } from "@/components/buttonForm" +import ButtonSaveHeader from "@/components/buttonSaveHeader" import { InputForm } from "@/components/inputForm" import Styles from "@/constants/Styles" import { router, Stack, useLocalSearchParams } from "expo-router" @@ -15,12 +14,16 @@ export default function ProjectCancel() { headerLeft: () => { router.back() }} />, headerTitle: 'Pembatalan Kegiatan', headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + router.push('/project/4324') + }} /> }} /> - { AlertKonfirmasi({ @@ -31,7 +34,7 @@ export default function ProjectCancel() { router.push('/project/4324') } }) - }} /> + }} /> */} diff --git a/app/(application)/project/[id]/edit.tsx b/app/(application)/project/[id]/edit.tsx index 15821a6..f4c349a 100644 --- a/app/(application)/project/[id]/edit.tsx +++ b/app/(application)/project/[id]/edit.tsx @@ -1,6 +1,5 @@ -import AlertKonfirmasi from "@/components/alertKonfirmasi" import ButtonBackHeader from "@/components/buttonBackHeader" -import { ButtonForm } from "@/components/buttonForm" +import ButtonSaveHeader from "@/components/buttonSaveHeader" import { InputForm } from "@/components/inputForm" import Styles from "@/constants/Styles" import { router, Stack, useLocalSearchParams } from "expo-router" @@ -10,30 +9,34 @@ export default function EditProject() { const { id } = useLocalSearchParams() return ( - { router.back() }} />, - headerTitle: 'Edit Judul Kegiatan', - headerTitleAlign: 'center', - }} - /> - - - - { - AlertKonfirmasi({ - title: 'Konfirmasi', - desc: 'Apakah anda yakin ingin mengubah data?', - onPress: () => { - ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) - router.push('/project/4324') - } - }) + { router.back() }} />, + headerTitle: 'Edit Judul Kegiatan', + headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + router.push('/project/4324') }} /> - - - + }} + /> + + + + {/* { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin mengubah data?', + onPress: () => { + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + router.push('/project/4324') + } + }) + }} /> */} + + + ) } \ No newline at end of file diff --git a/app/(application)/project/create.tsx b/app/(application)/project/create.tsx index e3c6f91..37d91c3 100644 --- a/app/(application)/project/create.tsx +++ b/app/(application)/project/create.tsx @@ -1,13 +1,12 @@ -import AlertKonfirmasi from "@/components/alertKonfirmasi"; import ButtonBackHeader from "@/components/buttonBackHeader"; -import { ButtonForm } from "@/components/buttonForm"; +import ButtonSaveHeader from "@/components/buttonSaveHeader"; import ButtonSelect from "@/components/buttonSelect"; import { InputForm } from "@/components/inputForm"; import SelectForm from "@/components/selectForm"; import Styles from "@/constants/Styles"; import { router, Stack } from "expo-router"; import { useState } from "react"; -import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"; +import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native"; export default function CreateProject() { const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' }) @@ -19,6 +18,10 @@ export default function CreateProject() { headerLeft: () => { router.back() }} />, headerTitle: 'Tambah Kegiatan', headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT) + router.push('/project?status=0') + }} /> }} /> @@ -28,7 +31,7 @@ export default function CreateProject() { - { AlertKonfirmasi({ @@ -39,7 +42,7 @@ export default function CreateProject() { router.push('/project?status=0') } }) - }} /> + }} /> */} diff --git a/app/(application)/project/update/[detail].tsx b/app/(application)/project/update/[detail].tsx new file mode 100644 index 0000000..0d86867 --- /dev/null +++ b/app/(application)/project/update/[detail].tsx @@ -0,0 +1,65 @@ +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"; + +export default function UpdateProjectTask() { + const { detail } = useLocalSearchParams() + const [range, setRange] = useState<{ startDate: DateType; endDate: DateType; }>({ startDate: undefined, endDate: undefined }); + const defaultStyles = getDefaultStyles() + + const from = range.startDate + ? dayjs(range.startDate).format('MMM DD, YYYY') + : ''; + const to = range.endDate ? dayjs(range.endDate).format('MMM DD, YYYY') : ''; + + + return ( + + { router.back() }} />, + headerTitle: 'Edit Tanggal dan Tugas', + headerTitleAlign: 'center', + headerRight: () => { + ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT) + router.push('/project/4324') + }} /> + }} + /> + + + + setRange(param)} + styles={defaultStyles} + /> + + + + Tanggal Mulai * + + {from} + + + + Tanggal Berakhir * + + {to} + + + + + + + + ) +} \ No newline at end of file diff --git a/components/buttonSaveHeader.tsx b/components/buttonSaveHeader.tsx index 6c4cad2..8728d26 100644 --- a/components/buttonSaveHeader.tsx +++ b/components/buttonSaveHeader.tsx @@ -3,7 +3,7 @@ import { ButtonHeader } from "./buttonHeader" import AlertKonfirmasi from "./alertKonfirmasi" type Props = { - category: 'create' | 'update' + category: 'create' | 'update' | 'cancel' onPress?: () => void disable?: boolean } @@ -16,7 +16,11 @@ export default function ButtonSaveHeader({ category, onPress, disable }: Props) onPress={() => { AlertKonfirmasi({ title: 'Konfirmasi', - desc: category == 'create' ? 'Apakah anda yakin ingin menambahkan data?' : 'Apakah anda yakin mengubah data?', + desc: category == 'create' + ? 'Apakah anda yakin ingin menambahkan data?' + : category == 'cancel' + ? 'Apakah anda yakin ingin membatalkan kegiatan? Pembatalan bersifat permanen' + : 'Apakah anda yakin mengubah data?', onPress: () => { onPress && onPress() } diff --git a/components/itemSectionTanggalTugas.tsx b/components/itemSectionTanggalTugas.tsx index a7a8915..128a04b 100644 --- a/components/itemSectionTanggalTugas.tsx +++ b/components/itemSectionTanggalTugas.tsx @@ -1,6 +1,6 @@ import Styles from "@/constants/Styles"; import { MaterialCommunityIcons } from "@expo/vector-icons"; -import { Text, View } from "react-native"; +import { Pressable, Text, View } from "react-native"; type Props = { @@ -8,11 +8,12 @@ type Props = { title: string dateStart: string dateEnd: string + onPress?: () => void } -export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd }: Props) { +export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd, onPress }: Props) { return ( - + { done ? @@ -48,6 +49,6 @@ export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEn - + ) } \ No newline at end of file diff --git a/components/modalSelect.tsx b/components/modalSelect.tsx index f9d4215..78b49dc 100644 --- a/components/modalSelect.tsx +++ b/components/modalSelect.tsx @@ -8,7 +8,7 @@ type Props = { open: boolean close: (value: boolean) => void title: string - category: 'group' + category: 'group' | 'status-task' choose: string onSelect: (value: { val: string, label: string }) => void } @@ -19,23 +19,43 @@ export default function ModalSelect({ open, close, title, category, choose, onSe return ( - { - onSelect({ val: 'dinas', label: 'Dinas' }) - setChoose('dinas') - close(false) - }}> - Dinas - - - - Adat - - - Karang Taruna - - - PKK - + { + category == 'group' ? + <> + { + onSelect({ val: 'dinas', label: 'Dinas' }) + setChoose('dinas') + close(false) + }}> + Dinas + + + + Adat + + + Karang Taruna + + + PKK + + + : + <> + { + onSelect({ val: 'blm-dikerjakan', label: 'Belum Dikerjakan' }) + setChoose('blm-dikerjakan') + close(false) + }}> + Belum Dikerjakan + + + + Selesai + + + } + ) diff --git a/components/sectionFile.tsx b/components/sectionFile.tsx index 469d618..48f1daa 100644 --- a/components/sectionFile.tsx +++ b/components/sectionFile.tsx @@ -1,26 +1,72 @@ import Styles from "@/constants/Styles"; -import { MaterialCommunityIcons } from "@expo/vector-icons"; -import { Text, View } from "react-native"; +import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; +import { Text, ToastAndroid, View } from "react-native"; import BorderBottomItem from "./borderBottomItem"; +import { useState } from "react"; +import { router } from "expo-router"; +import AlertKonfirmasi from "./alertKonfirmasi"; +import DrawerBottom from "./drawerBottom"; +import MenuItemRow from "./menuItemRow"; export default function SectionFile() { + const [isModal, setModal] = useState(false) + return ( - - File - - } - title="image_pertama.jpg" - titleWeight="normal" - /> - } - title="file_kedua.pdf" - titleWeight="normal" - /> + <> + + File + + } + title="image_pertama.jpg" + titleWeight="normal" + onPress={() => { setModal(true) }} + /> + } + title="file_kedua.pdf" + titleWeight="normal" + onPress={() => { setModal(true) }} + /> + - + + + + } + title="Lihat File" + onPress={() => { + setModal(false) + }} + /> + } + title="Download" + onPress={() => { + setModal(false) + }} + /> + + } + title="Hapus" + onPress={() => { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah Anda yakin ingin menghapus file ini? File yang dihapus tidak dapat dikembalikan', + onPress: () => { + setModal(false) + ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT) + } + }) + + }} + /> + + + ) } \ No newline at end of file diff --git a/components/sectionMember.tsx b/components/sectionMember.tsx index c065253..9b58486 100644 --- a/components/sectionMember.tsx +++ b/components/sectionMember.tsx @@ -1,45 +1,88 @@ import Styles from "@/constants/Styles"; -import { Image, Text, View } from "react-native"; +import { MaterialCommunityIcons } from "@expo/vector-icons"; +import { useState } from "react"; +import { Image, Text, ToastAndroid, View } from "react-native"; +import AlertKonfirmasi from "./alertKonfirmasi"; import BorderBottomItem from "./borderBottomItem"; +import DrawerBottom from "./drawerBottom"; +import MenuItemRow from "./menuItemRow"; +import { router } from "expo-router"; export default function SectionMember() { + const [isModal, setModal] = useState(false) + return ( - - - Anggota - Total 5 Anggota + <> + + + Anggota + Total 5 Anggota + + + + } + title="Amalia Dwi" + subtitle="Dinas - Bendahara" + rightTopInfo="Anggota" + onPress={() => { setModal(true) }} + /> + } + title="Amalia Dwi" + subtitle="Dinas - Bendahara" + rightTopInfo="Anggota" + onPress={() => { setModal(true) }} + /> + } + title="Amalia Dwi" + subtitle="Dinas - Bendahara" + rightTopInfo="Anggota" + onPress={() => { setModal(true) }} + /> + } + title="Amalia Dwi" + subtitle="Dinas - Bendahara" + rightTopInfo="Anggota" + onPress={() => { setModal(true) }} + /> + - - } - title="Amalia Dwi" - subtitle="Dinas - Bendahara" - rightTopInfo="Anggota" - /> - } - title="Amalia Dwi" - subtitle="Dinas - Bendahara" - rightTopInfo="Anggota" - /> - } - title="Amalia Dwi" - subtitle="Dinas - Bendahara" - rightTopInfo="Anggota" - /> - } - title="Amalia Dwi" - subtitle="Dinas - Bendahara" - rightTopInfo="Anggota" - /> - - + + + } + title="Lihat Profil" + onPress={() => { + setModal(false) + router.push('/member/123') + }} + /> + + } + title="Keluarkan" + onPress={() => { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah Anda yakin ingin mengeluarkan anggota?', + onPress: () => { + setModal(false) + ToastAndroid.show('Berhasil mengeluarkan anggota', ToastAndroid.SHORT) + } + }) + + }} + /> + + + ) } \ No newline at end of file diff --git a/components/sectionTanggalTugas.tsx b/components/sectionTanggalTugas.tsx index 83bb2a0..2ef8060 100644 --- a/components/sectionTanggalTugas.tsx +++ b/components/sectionTanggalTugas.tsx @@ -1,15 +1,79 @@ import Styles from "@/constants/Styles"; -import { Text, View } from "react-native"; +import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; +import { router } from "expo-router"; +import { useState } from "react"; +import { Text, ToastAndroid, View } from "react-native"; +import DrawerBottom from "./drawerBottom"; import ItemSectionTanggalTugas from "./itemSectionTanggalTugas"; +import MenuItemRow from "./menuItemRow"; +import AlertKonfirmasi from "./alertKonfirmasi"; +import ModalSelect from "./modalSelect"; export default function SectionTanggalTugas() { + const [isModal, setModal] = useState(false) + const [isSelect, setSelect] = useState(false) + const [choose, setChoose] = useState({ val: '', label: '' }) + return ( - - Tanggal & Tugas - - - + <> + + Tanggal & Tugas + + { setModal(true) }} /> + { setModal(true) }} /> + - + + + + } + title="Update Status" + onPress={() => { + setModal(false) + setSelect(true) + }} + /> + } + title="Edit Tugas" + onPress={() => { + setModal(false) + router.push(`/project/update/124`) + }} + /> + + } + title="Hapus Tugas" + onPress={() => { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin menghapus data ini?', + onPress: () => { + setModal(false) + ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT) + router.push('/project/243') + } + }) + + }} + /> + + + + { + setChoose(value) + setSelect(false) + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + }} + title="Status" + choose={choose.val} + open={isSelect} + /> + ) } \ No newline at end of file