From 44b1ffaef5a16857b9702570af57138547ea1812 Mon Sep 17 00:00:00 2001 From: amel Date: Tue, 4 Mar 2025 12:10:38 +0800 Subject: [PATCH] upd: discussion general Deskripsi; - ui tambah diskusi - ui edit diskusi - ui detail diskusi - ui list anggota diskusi - ui tutup diskusi - ui arsip diskusi No Issues --- app/(application)/discussion/[id].tsx | 150 +++++++++++++++++- app/(application)/discussion/create.tsx | 47 +++++- app/(application)/discussion/edit/[id].tsx | 39 +++++ app/(application)/discussion/index.tsx | 90 ++++++++++- app/(application)/discussion/member/[id].tsx | 90 +++++++++++ components/borderBottomItem.tsx | 8 +- components/buttonSelect.tsx | 22 +++ .../headerDiscussionDetail.tsx | 73 +++++++++ constants/Styles.ts | 15 +- 9 files changed, 520 insertions(+), 14 deletions(-) create mode 100644 app/(application)/discussion/edit/[id].tsx create mode 100644 app/(application)/discussion/member/[id].tsx create mode 100644 components/buttonSelect.tsx create mode 100644 components/discussion_general/headerDiscussionDetail.tsx diff --git a/app/(application)/discussion/[id].tsx b/app/(application)/discussion/[id].tsx index bf302cb..046efd7 100644 --- a/app/(application)/discussion/[id].tsx +++ b/app/(application)/discussion/[id].tsx @@ -1,7 +1,153 @@ -import { Text } from "react-native"; +import BorderBottomItem from "@/components/borderBottomItem"; +import ButtonBackHeader from "@/components/buttonBackHeader"; +import HeaderRightDiscussionGeneralDetail from "@/components/discussion_general/headerDiscussionDetail"; +import { InputForm } from "@/components/inputForm"; +import LabelStatus from "@/components/labelStatus"; +import { ColorsStatus } from "@/constants/ColorsStatus"; +import Styles from "@/constants/Styles"; +import { Ionicons, MaterialIcons } from "@expo/vector-icons"; +import { router, Stack, useLocalSearchParams } from "expo-router"; +import { Image, ScrollView, Text, View } from "react-native"; export default function DetailDiscussionGeneral() { + const { id } = useLocalSearchParams() + return ( - Detail diskusi general + <> + { router.back() }} />, + headerTitle: 'Diskusi', + headerTitleAlign: 'center', + headerRight: () => , + }} + /> + + + + + + + + } + title="Danantara" + subtitle={ + + } + rightTopInfo="3 Jan 2025" + desc="Bagaimana dampak yg dirasakan akibat efisiensi?" + leftBottomInfo={ + + + 15 Komentar + + } + /> + + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="sangat berdampak dari berbagai sisi" + /> + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + + } + title="Amalia Dwi" + rightTopInfo="3 Jan 2025" + desc="semua menjadi terbatas.." + /> + + + + + + + + } + /> + + + ) } \ No newline at end of file diff --git a/app/(application)/discussion/create.tsx b/app/(application)/discussion/create.tsx index bd3b99c..71b5235 100644 --- a/app/(application)/discussion/create.tsx +++ b/app/(application)/discussion/create.tsx @@ -1,7 +1,46 @@ -import { Text } from "react-native"; +import AlertKonfirmasi from "@/components/alertKonfirmasi"; +import ButtonBackHeader from "@/components/buttonBackHeader"; +import { ButtonForm } from "@/components/buttonForm"; +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, ToastAndroid, View } from "react-native"; -export default function CreateDiscussionGeneral(){ - return( - Tambah diskusi general +export default function CreateDiscussionGeneral() { + const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' }) + + return ( + + { router.back() }} />, + headerTitle: 'Tambah Diskusi', + headerTitleAlign: 'center', + }} + /> + + + { }} /> + + + + { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin menambahkan data?', + onPress: () => { + ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT) + router.push('/discussion?active=true') + } + }) + }} /> + + + ) } \ No newline at end of file diff --git a/app/(application)/discussion/edit/[id].tsx b/app/(application)/discussion/edit/[id].tsx new file mode 100644 index 0000000..141897e --- /dev/null +++ b/app/(application)/discussion/edit/[id].tsx @@ -0,0 +1,39 @@ +import AlertKonfirmasi from "@/components/alertKonfirmasi" +import ButtonBackHeader from "@/components/buttonBackHeader" +import { ButtonForm } from "@/components/buttonForm" +import { InputForm } from "@/components/inputForm" +import Styles from "@/constants/Styles" +import { router, Stack } from "expo-router" +import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native" + +export default function EditDiscussionGeneral() { + return ( + + { router.back() }} />, + headerTitle: 'Edit Diskusi', + headerTitleAlign: 'center', + }} + /> + + + + + { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin mengubah data?', + onPress: () => { + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + router.back() + } + }) + }} /> + + + + ) +} \ No newline at end of file diff --git a/app/(application)/discussion/index.tsx b/app/(application)/discussion/index.tsx index 2b62923..4c50852 100644 --- a/app/(application)/discussion/index.tsx +++ b/app/(application)/discussion/index.tsx @@ -14,7 +14,7 @@ export default function Discussion() { return ( - + + { router.push('/discussion/1') }} + borderType="bottom" + icon={ + + + + } + title="Danantara" + subtitle={ + + } + rightTopInfo="3 Jan 2025" + desc="Bagaimana dampak yg dirasakan akibat efisiensi?" + leftBottomInfo={ + + + Diskusikan + + } + rightBottomInfo='15 Komentar' + /> + { router.push('/discussion/1') }} + borderType="bottom" + icon={ + + + + } + title="Danantara" + subtitle={ + + } + rightTopInfo="3 Jan 2025" + desc="Bagaimana dampak yg dirasakan akibat efisiensi?" + leftBottomInfo={ + + + Diskusikan + + } + rightBottomInfo='15 Komentar' + /> + { router.push('/discussion/1') }} + borderType="bottom" + icon={ + + + + } + title="Danantara" + subtitle={ + + } + rightTopInfo="3 Jan 2025" + desc="Bagaimana dampak yg dirasakan akibat efisiensi?" + leftBottomInfo={ + + + Diskusikan + + } + rightBottomInfo='15 Komentar' + /> + { router.push('/discussion/1') }} + borderType="bottom" + icon={ + + + + } + title="Danantara" + subtitle={ + + } + rightTopInfo="3 Jan 2025" + desc="Bagaimana dampak yg dirasakan akibat efisiensi?" + leftBottomInfo={ + + + Diskusikan + + } + rightBottomInfo='15 Komentar' + /> diff --git a/app/(application)/discussion/member/[id].tsx b/app/(application)/discussion/member/[id].tsx new file mode 100644 index 0000000..9daa918 --- /dev/null +++ b/app/(application)/discussion/member/[id].tsx @@ -0,0 +1,90 @@ +import BorderBottomItem from "@/components/borderBottomItem"; +import ButtonBackHeader from "@/components/buttonBackHeader"; +import { ColorsStatus } from "@/constants/ColorsStatus"; +import Styles from "@/constants/Styles"; +import { Feather } from "@expo/vector-icons"; +import { router, Stack, useLocalSearchParams } from "expo-router"; +import { Image, SafeAreaView, ScrollView, Text, View } from "react-native"; + +export default function MemberDiscussionDetail() { + const { id } = useLocalSearchParams() + return ( + + { router.back() }} />, + headerTitle: 'Anggota Diskusi', + headerTitleAlign: 'center', + }} + /> + + + 5 Anggota + + + + + } + title="Tambah Anggota" + /> + + + } + title="Amalia Dwi" + /> + + } + title="Amalia Dwi" + /> + + } + title="Amalia Dwi" + /> + + } + title="Amalia Dwi" + /> + + } + title="Amalia Dwi" + /> + + + + + + ) +} \ No newline at end of file diff --git a/components/borderBottomItem.tsx b/components/borderBottomItem.tsx index 6483a8c..0774fcf 100644 --- a/components/borderBottomItem.tsx +++ b/components/borderBottomItem.tsx @@ -11,16 +11,14 @@ type Props = { desc?: string rightTopInfo?: string onPress?: () => void - borderType: 'all' | 'bottom' + borderType: 'all' | 'bottom' | 'none' leftBottomInfo?: React.ReactNode | string rightBottomInfo?: React.ReactNode | string } export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo }: Props) { - - console.log(typeof rightBottomInfo) return ( - + {icon} @@ -43,7 +41,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, {desc && {desc}} { - leftBottomInfo && rightBottomInfo && + (leftBottomInfo || rightBottomInfo )&& ( { diff --git a/components/buttonSelect.tsx b/components/buttonSelect.tsx new file mode 100644 index 0000000..c57c0e6 --- /dev/null +++ b/components/buttonSelect.tsx @@ -0,0 +1,22 @@ +import Styles from "@/constants/Styles"; +import { Feather } from "@expo/vector-icons"; +import { Pressable, Text, View } from "react-native"; + +type Props = { + value: string + onPress?: () => void + round?: boolean +} + +export default function ButtonSelect({ value, onPress, round }: Props) { + return ( + + + + + {value} + + + + ) +} \ No newline at end of file diff --git a/components/discussion_general/headerDiscussionDetail.tsx b/components/discussion_general/headerDiscussionDetail.tsx new file mode 100644 index 0000000..2199d1b --- /dev/null +++ b/components/discussion_general/headerDiscussionDetail.tsx @@ -0,0 +1,73 @@ +import { useState } from "react" +import ButtonMenuHeader from "../buttonMenuHeader" +import DrawerBottom from "../drawerBottom" +import { ToastAndroid, View } from "react-native" +import Styles from "@/constants/Styles" +import MenuItemRow from "../menuItemRow" +import { MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons" +import { router } from "expo-router" +import AlertKonfirmasi from "../alertKonfirmasi" + +type Props = { + id: string | string[] +} + +export default function HeaderRightDiscussionGeneralDetail({ id }: Props) { + const [isVisible, setVisible] = useState(false) + + return ( + <> + { setVisible(true) }} /> + + + } + title="Anggota" + onPress={() => { + setVisible(false) + router.push(`/discussion/member/${id}`) + }} + /> + } + title="Edit" + onPress={() => { + setVisible(false) + router.push(`/discussion/edit/${id}`) + }} + /> + } + title="Tutup Diskusi" + onPress={() => { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin menutup diskusi?', + onPress: () => { + setVisible(false) + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + } + }) + }} + /> + + + } + title="Arsipkan" + onPress={() => { + AlertKonfirmasi({ + title: 'Konfirmasi', + desc: 'Apakah anda yakin ingin mengarsipkan diskusi?', + onPress: () => { + setVisible(false) + ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT) + } + }) + }} + /> + + + + ) +} \ No newline at end of file diff --git a/constants/Styles.ts b/constants/Styles.ts index 11a3956..b7dc302 100644 --- a/constants/Styles.ts +++ b/constants/Styles.ts @@ -93,6 +93,9 @@ const Styles = StyleSheet.create({ mt10: { marginTop: 10 }, + mt15: { + marginTop: 15 + }, mr05: { marginRight: 5 }, @@ -253,7 +256,7 @@ const Styles = StyleSheet.create({ wrapPaper: { padding: 15, backgroundColor: 'white', - borderRadius: 15, + borderRadius: 10, }, contentItemCenter: { justifyContent: 'center', @@ -290,7 +293,15 @@ const Styles = StyleSheet.create({ borderRadius: 10, marginBottom: 10 }, - + wrapItemBorderNone: { + padding: 10, + marginBottom: 5 + }, + userProfileExtraSmall: { + width: 35, + height: 35, + borderRadius: 100 + }, userProfileSmall: { width: 48, height: 48,