From b45822fff2bb1c0b8b5ba483870a6435e95c6b15 Mon Sep 17 00:00:00 2001 From: amel Date: Mon, 19 May 2025 15:05:06 +0800 Subject: [PATCH] upd: member Deskripsi; - upload gambar pada tambah member - upload gambar pada edit member NO Issues --- app/(application)/member/[id].tsx | 5 +- app/(application)/member/create.tsx | 16 ++++++ app/(application)/member/edit/[id].tsx | 71 ++++++++++++++++++-------- components/inputForm.tsx | 2 +- 4 files changed, 71 insertions(+), 23 deletions(-) diff --git a/app/(application)/member/[id].tsx b/app/(application)/member/[id].tsx index 5517f05..1fa2453 100644 --- a/app/(application)/member/[id].tsx +++ b/app/(application)/member/[id].tsx @@ -28,7 +28,7 @@ export default function MemberDetail() { const [data, setData] = useState() const [error, setError] = useState(false) const entityUser = useSelector((state: any) => state.user) - const [isEdit, setEdit] = useState(false) + const [isEdit, setEdit] = useState(true) async function handleLoad() { try { @@ -40,6 +40,7 @@ export default function MemberDetail() { } } + useEffect(() => { handleLoad() }, []); @@ -51,7 +52,7 @@ export default function MemberDetail() { headerLeft: () => { router.back() }} />, headerTitle: 'Anggota', headerTitleAlign: 'center', - headerRight: () => (entityUser.role != "user") && isEdit && , + headerRight: () => (entityUser.role != "user") && isEdit ? : <>, headerShadowVisible: false }} /> diff --git a/app/(application)/member/create.tsx b/app/(application)/member/create.tsx index 923936b..c56dca4 100644 --- a/app/(application)/member/create.tsx +++ b/app/(application)/member/create.tsx @@ -37,6 +37,7 @@ export default function CreateMember() { const [isSelect, setSelect] = useState(false); const [disableBtn, setDisableBtn] = useState(true) const [valChoose, setValChoose] = useState("") + const [imgForm, setImgForm] = useState() const [error, setError] = useState({ group: false, position: false, @@ -144,9 +145,21 @@ export default function CreateMember() { try { const hasil = await decryptToken(String(token?.current)) const fd = new FormData() + fd.append("data", JSON.stringify( { user: hasil, ...dataForm } )) + + if (imgForm != undefined) { + fd.append("file", { + uri: imgForm.uri, + type: imgForm.mimeType, + name: imgForm.fileName, + } as any) + } else { + fd.append("file", "undefined") + } + const response = await apiCreateUser(fd) if (response.success) { ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT) @@ -166,10 +179,13 @@ export default function CreateMember() { mediaTypes: ["images"], allowsEditing: true, quality: 1, + aspect: [1, 1], }); if (!result.canceled) { setSelectedImage(result.assets[0].uri); + setImgForm(result.assets[0]); + } else { alert("Tidak ada gambar yang dipilih"); } diff --git a/app/(application)/member/edit/[id].tsx b/app/(application)/member/edit/[id].tsx index 34880c3..12b44f3 100644 --- a/app/(application)/member/edit/[id].tsx +++ b/app/(application)/member/edit/[id].tsx @@ -41,7 +41,7 @@ export default function EditMember() { const { token, decryptToken } = useAuthSession() const { id } = useLocalSearchParams<{ id: string }>(); const [errorImg, setErrorImg] = useState(false) - const [selectedImage, setSelectedImage] = useState(undefined); + const [selectedImage, setSelectedImage] = useState(undefined); const [choosePosition, setChoosePosition] = useState({ val: "", label: "" }); const [chooseRole, setChooseRole] = useState({ val: "", label: "" }); const [chooseGender, setChooseGender] = useState({ val: "", label: "" }); @@ -49,6 +49,7 @@ export default function EditMember() { const [isSelect, setSelect] = useState(false); const [disableBtn, setDisableBtn] = useState(false) const [valChoose, setValChoose] = useState("") + const [imgForm, setImgForm] = useState(); const [data, setData] = useState({ id: "", name: "", @@ -76,6 +77,7 @@ export default function EditMember() { try { const response = await apiGetProfile({ id: id }); setData(response.data); + setSelectedImage({ uri: `https://wibu-storage.wibudev.com/api/files/${response.data.img}`, }); setChoosePosition({ val: response.data.idPosition, label: response.data.position, @@ -173,19 +175,33 @@ export default function EditMember() { try { const hasil = await decryptToken(String(token?.current)) const fd = new FormData() + + if (imgForm != undefined) { + fd.append("file", { + uri: imgForm.uri, + type: imgForm.mimeType, + name: imgForm.fileName, + } as any); + } else { + fd.append("file", "undefined",); + } + fd.append("data", JSON.stringify( { user: hasil, ...data } )) + const response = await apiEditUser(fd, id) + if (response.success) { ToastAndroid.show('Berhasil mengupdate data', ToastAndroid.SHORT) dispatch(setUpdateMember(!update)) - router.replace(`/member/${id}`); + router.back() } else { ToastAndroid.show(response.message, ToastAndroid.SHORT) } } catch (error) { console.error(error) + ToastAndroid.show('Gagal mengupdate data', ToastAndroid.SHORT) } } @@ -196,12 +212,16 @@ export default function EditMember() { mediaTypes: ["images"], allowsEditing: true, quality: 1, + aspect: [1, 1], }); if (!result.canceled) { + setErrorImg(false) setSelectedImage(result.assets[0].uri); + setImgForm(result.assets[0]); } else { alert("Tidak ada gambar yang dipilih"); + setErrorImg(false) } }; @@ -232,26 +252,37 @@ export default function EditMember() { - - { - { setErrorImg(true) }} - /> - } - - {/* { - selectedImage != undefined ? ( + { + errorImg ? - + { + { setErrorImg(true) }} + /> + } - ) : ( - - - - ) - } */} + : + selectedImage != undefined ? ( + + { setErrorImg(true) }} + /> + + ) : ( + + ) + } ) } - + {itemRight != undefined ? itemRight : itemLeft}