wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix ( donasi )

Browse Source 
deskripsi:
- fix upload image donasi
- fix upload cerita donasi
- fix upload bukti transfer donatur
This commit is contained in:
Bagasbanuna02
2025-01-17 10:12:03 +08:00
parent 8f99658e40
commit 8934e06b9e
10 changed files with 714 additions and 744 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/dev/donasi/create/create_donasi/page.tsx
View File

@@ -1,12 +1,5 @@
import { CreateDonasiNew } from "@/app_modules/donasi"; import { CreateDonasiNew } from "@/app_modules/donasi";
export default async function Page() { export default async function Page() {
// const masterKategori = await Donasi_getMasterKategori(); return <CreateDonasiNew />;
// const masterDurasi = await Donasi_getMasterDurasi();
return (
// <CreateDonasi masterKategori={masterKategori} masterDurasi={masterDurasi} />
<CreateDonasiNew />
);
} }

11
src/app/dev/donasi/edit/edit_donasi/[id]/page.tsx
View File

@@ -1,15 +1,8 @@
import { EditDonasi, EditDonasiNew } from "@/app_modules/donasi"; import { EditDonasiNew } from "@/app_modules/donasi";
import { Donasi_getMasterDurasi, Donasi_getMasterKategori } from "@/app_modules/donasi/fun";
import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
export default async function Page({ params }: { params: { id: string } }) {
// const dataDonasi = await Donasi_getOneById(params.id)
// const masterKategori = await Donasi_getMasterKategori()
// const masterDurasi = await Donasi_getMasterDurasi()
export default async function Page() {
return ( return (
<> <>
{/* <EditDonasi dataDonasi={dataDonasi as any} masterKategori={masterKategori} masterDurasi={masterDurasi} /> */}
<EditDonasiNew /> <EditDonasiNew />
</> </>
); );

100
src/app_modules/donasi/create/create_cerita_penggalang.tsx
View File

@@ -1,9 +1,13 @@
"use client"; "use client";
import { DIRECTORY_ID } from "@/app/lib"; import { DIRECTORY_ID } from "@/app/lib";
import { IRealtimeData } from "@/app/lib/global_state";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import { MainColor } from "@/app_modules/_global/color/color_pallet"; import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_BoxUploadImage } from "@/app_modules/_global/component"; import {
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
} from "@/app_modules/_global/component";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information"; import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown"; import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
@@ -11,27 +15,25 @@ import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/noti
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import notifikasiToAdmin_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_admin"; import notifikasiToAdmin_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_admin";
import { clientLogger } from "@/util/clientLogger";
import { import {
AspectRatio, AspectRatio,
Button, Button,
FileButton, Center,
Group,
Image, Image,
Stack, Stack,
Text,
TextInput, TextInput,
Textarea, Textarea
} from "@mantine/core"; } from "@mantine/core";
import { IconCamera, IconUpload } from "@tabler/icons-react"; import { IconPhoto } from "@tabler/icons-react";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
import _ from "lodash"; import _ from "lodash";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { Donasi_funCreate } from "../fun/create/fun_create_donasi";
import { gs_donasi_hot_menu, gs_donasi_tabs_posting } from "../global_state";
import { MODEL_DONASI_TEMPORARY } from "../model/interface";
import { IRealtimeData } from "@/app/lib/global_state";
import { WibuRealtime } from "wibu-pkg"; import { WibuRealtime } from "wibu-pkg";
import { Donasi_funCreate } from "../fun/create/fun_create_donasi";
import { gs_donasi_hot_menu } from "../global_state";
import { MODEL_DONASI_TEMPORARY } from "../model/interface";
export default function CreateCeritaPenggalangDonasi({ export default function CreateCeritaPenggalangDonasi({
dataTemporary, dataTemporary,
@@ -80,9 +82,11 @@ export default function CreateCeritaPenggalangDonasi({
file: file as File, file: file as File,
dirId: DIRECTORY_ID.donasi_cerita_image, dirId: DIRECTORY_ID.donasi_cerita_image,
}); });
if (!uploadImage.success) { if (!uploadImage.success) {
setLoading(false); setLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar"); ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
return;
} }
const res = await Donasi_funCreate({ const res = await Donasi_funCreate({
@@ -122,21 +126,21 @@ export default function CreateCeritaPenggalangDonasi({
scroll: false, scroll: false,
}); });
} }
setLoading(false);
} else { } else {
ComponentGlobal_NotifikasiGagal(res.message); ComponentGlobal_NotifikasiGagal(res.message);
setLoading(false); setLoading(false);
} }
} catch (error) { } catch (error) {
console.log(error); setLoading(false);
clientLogger.error("Error create cerita donasi", error);
} }
} }
return ( return (
<> <>
<Stack spacing={50} px={"xl"} py={"md"}> <Stack spacing={50} px={"xl"} pb={"md"}>
{/* <pre>{JSON.stringify(dataTempo, null, 2)}</pre> */} {/* <pre>{JSON.stringify(dataTempo, null, 2)}</pre> */}
<Stack spacing={"sm"}> <Stack spacing={"sm"}>
<ComponentGlobal_BoxInformation informasi="Ceritakan dengan jujur & benar mengapa Penggalanagn Dana ini harus diadakan!" /> <ComponentGlobal_BoxInformation informasi="Cerita Anda adalah kunci untuk menginspirasi kebaikan. Jelaskan dengan jujur dan jelas tujuan penggalangan dana ini agar calon donatur memahami dampak positif yang dapat mereka wujudkan melalui kontribusi mereka." />
<Stack spacing={5}> <Stack spacing={5}>
<Textarea <Textarea
@@ -145,10 +149,10 @@ export default function CreateCeritaPenggalangDonasi({
color: MainColor.white, color: MainColor.white,
}, },
input: { input: {
backgroundColor: MainColor.white backgroundColor: MainColor.white,
}, },
required: { required: {
color: MainColor.red color: MainColor.red,
}, },
}} }}
autosize autosize
@@ -157,7 +161,7 @@ export default function CreateCeritaPenggalangDonasi({
withAsterisk withAsterisk
label="Pembukaan" label="Pembukaan"
placeholder="Pembuka cerita" placeholder="Pembuka cerita"
maxLength={300} maxLength={500}
onChange={(val) => onChange={(val) =>
setData({ setData({
...data, ...data,
@@ -166,7 +170,7 @@ export default function CreateCeritaPenggalangDonasi({
} }
/> />
<ComponentGlobal_InputCountDown <ComponentGlobal_InputCountDown
maxInput={300} maxInput={500}
lengthInput={data.pembukaan.length} lengthInput={data.pembukaan.length}
/> />
</Stack> </Stack>
@@ -178,10 +182,10 @@ export default function CreateCeritaPenggalangDonasi({
color: MainColor.white, color: MainColor.white,
}, },
input: { input: {
backgroundColor: MainColor.white backgroundColor: MainColor.white,
}, },
required: { required: {
color: MainColor.red color: MainColor.red,
}, },
}} }}
autosize autosize
@@ -190,7 +194,7 @@ export default function CreateCeritaPenggalangDonasi({
withAsterisk withAsterisk
label="Cerita" label="Cerita"
placeholder="Ceritakan alasan mengapa harus membuat Penggalangan Dana" placeholder="Ceritakan alasan mengapa harus membuat Penggalangan Dana"
maxLength={300} maxLength={1000}
onChange={(val) => onChange={(val) =>
setData({ setData({
...data, ...data,
@@ -199,7 +203,7 @@ export default function CreateCeritaPenggalangDonasi({
} }
/> />
<ComponentGlobal_InputCountDown <ComponentGlobal_InputCountDown
maxInput={300} maxInput={1000}
lengthInput={data.cerita.length} lengthInput={data.cerita.length}
/> />
</Stack> </Stack>
@@ -217,59 +221,33 @@ export default function CreateCeritaPenggalangDonasi({
</AspectRatio> </AspectRatio>
) : ( ) : (
<Stack justify="center" align="center" h={"100%"}> <Stack justify="center" align="center" h={"100%"}>
<IconUpload color={MainColor.white} /> <IconPhoto size={100} />
<Text fz={10} fs={"italic"} c={MainColor.white} fw={"bold"}>
Upload Gambar
</Text>
</Stack> </Stack>
)} )}
</ComponentGlobal_BoxUploadImage> </ComponentGlobal_BoxUploadImage>
{/* Upload Foto */} {/* Upload Foto */}
<Group position="center"> <Center>
<FileButton <ComponentGlobal_ButtonUploadFileImage
onChange={async (files: any) => { onSetFile={setFile}
try { onSetImage={setImg}
const buffer = URL.createObjectURL( />
new Blob([new Uint8Array(await files.arrayBuffer())]) </Center>
);
setImg(buffer);
setFile(files);
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
leftIcon={<IconCamera color="black" />}
radius={50}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload Gambar
</Button>
)}
</FileButton>
</Group>
</Stack> </Stack>
</Stack> </Stack>
<Stack spacing={"sm"}> <Stack spacing={"sm"}>
<ComponentGlobal_BoxInformation informasi="Lengkapi nama bank dan rekening di bawah untuk mempermudah admin jika penggalangan dana ini telah di publish!" /> <ComponentGlobal_BoxInformation informasi="Pastikan Anda mengisi nama bank dan nomor rekening dengan benar. Informasi ini akan membantu admin memverifikasi dan memproses penggalangan dana Anda dengan cepat dan tepat setelah penggalangan dana dipublikasikan." />
<TextInput <TextInput
styles={{ styles={{
label: { label: {
color: MainColor.white, color: MainColor.white,
}, },
input: { input: {
backgroundColor: MainColor.white backgroundColor: MainColor.white,
}, },
required: { required: {
color: MainColor.red color: MainColor.red,
}, },
}} }}
withAsterisk withAsterisk
@@ -289,10 +267,10 @@ export default function CreateCeritaPenggalangDonasi({
color: MainColor.white, color: MainColor.white,
}, },
input: { input: {
backgroundColor: MainColor.white backgroundColor: MainColor.white,
}, },
required: { required: {
color: MainColor.red color: MainColor.red,
}, },
}} }}
withAsterisk withAsterisk

562
src/app_modules/donasi/create/create_donasi_new.tsx
View File

@@ -2,13 +2,26 @@
import { DIRECTORY_ID } from "@/app/lib"; import { DIRECTORY_ID } from "@/app/lib";
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi"; import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
import { MainColor } from "@/app_modules/_global/color/color_pallet"; import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_BoxUploadImage } from "@/app_modules/_global/component"; import {
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
} from "@/app_modules/_global/component";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information"; import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global"; import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { AspectRatio, Button, FileButton, Group, Image, Select, Stack, Text, TextInput, } from "@mantine/core"; import {
import { IconCamera, IconUpload } from "@tabler/icons-react"; AspectRatio,
Button,
Center,
Image,
Select,
Stack,
Text,
TextInput,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconPhoto } from "@tabler/icons-react";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
import _ from "lodash"; import _ from "lodash";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
@@ -16,279 +29,290 @@ import { useState } from "react";
import Donasi_funCreateTemporary from "../fun/create/fun_create_donasi_temporary"; import Donasi_funCreateTemporary from "../fun/create/fun_create_donasi_temporary";
import { gs_donasi_tabs_posting } from "../global_state"; import { gs_donasi_tabs_posting } from "../global_state";
import { apiGetMasterDonasi } from "../lib/api_donasi"; import { apiGetMasterDonasi } from "../lib/api_donasi";
import { useShallowEffect } from "@mantine/hooks"; import { clientLogger } from "@/util/clientLogger";
export default function CreateDonasiNew() { export default function CreateDonasiNew() {
const router = useRouter(); const router = useRouter();
const [loadingMaster, setLoadingMaster] = useState(true) const [loadingMaster, setLoadingMaster] = useState(true);
const [isLoading, setLoading] = useState(false); const [isLoading, setLoading] = useState(false);
const [kategori, setKategori] = useState<any[]>([]); const [kategori, setKategori] = useState<any[]>([]);
const [durasi, setDurasi] = useState<any[]>([]); const [durasi, setDurasi] = useState<any[]>([]);
const [data, setData] = useState({ const [data, setData] = useState({
kategoriId: "", kategoriId: "",
title: "", title: "",
target: "", target: "",
durasiId: "", durasiId: "",
}); });
const [targetDana, setTargetDana] = useState(""); const [targetDana, setTargetDana] = useState("");
const [file, setFile] = useState<File | null>(null); const [file, setFile] = useState<File | null>(null);
const [img, setImg] = useState<any | null>(); const [img, setImg] = useState<any | null>();
const [tabsPostingDonasi, setTabsPostingDonasi] = useAtom( const [tabsPostingDonasi, setTabsPostingDonasi] = useAtom(
gs_donasi_tabs_posting gs_donasi_tabs_posting
); );
async function onGetMaster() { async function onGetMaster() {
try { try {
setLoadingMaster(true) setLoadingMaster(true);
const responseKategori = await apiGetMasterDonasi("?cat=kategori") const responseKategori = await apiGetMasterDonasi("?cat=kategori");
const responseDurasi = await apiGetMasterDonasi("?cat=durasi") const responseDurasi = await apiGetMasterDonasi("?cat=durasi");
if (responseKategori.success) { if (responseKategori.success) {
setKategori(responseKategori.data) setKategori(responseKategori.data);
}
if (responseDurasi.success) {
setDurasi(responseDurasi.data)
}
} catch (error) {
console.log(error);
} finally {
setLoadingMaster(false)
} }
} if (responseDurasi.success) {
setDurasi(responseDurasi.data);
useShallowEffect(() => {
onGetMaster()
}, [])
async function onCreate() {
const body = {
donasiMaster_KategoriId: data.kategoriId,
donasiMaster_DurasiId: data.durasiId,
title: data.title,
target: targetDana,
};
if (_.values(body).includes(""))
return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
try {
setLoading(true);
const uploadImage = await funGlobal_UploadToStorage({
file: file as File,
dirId: DIRECTORY_ID.donasi_image,
});
if (!uploadImage.success) {
setLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
}
const res = await Donasi_funCreateTemporary({
data: body as any,
fileId: uploadImage.data.id,
});
if (res.status === 201) {
setTabsPostingDonasi("Review");
router.push(RouterDonasi.create_cerita_penggalang + `${res.donasiId}`);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
setLoading(false);
}
} catch (error) {
console.log(error);
} }
} } catch (error) {
console.log(error);
} finally {
setLoadingMaster(false);
}
}
return ( useShallowEffect(() => {
<> onGetMaster();
<Stack spacing={"md"} px={"xl"}> }, []);
<ComponentGlobal_BoxInformation informasi="Lengkapi semua data di bawah untuk selanjutnya mengisi cerita Penggalangan Dana!" />
<Select async function onCreate() {
styles={{ const body = {
label: { donasiMaster_KategoriId: data.kategoriId,
color: MainColor.white, donasiMaster_DurasiId: data.durasiId,
}, title: data.title,
input: { target: targetDana,
backgroundColor: MainColor.white };
},
required: { if (_.values(body).includes(""))
color: MainColor.red return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
},
dropdown: { try {
backgroundColor: MainColor.white setLoading(true);
} const uploadImage = await funGlobal_UploadToStorage({
}} file: file as File,
label="Kategori" dirId: DIRECTORY_ID.donasi_image,
placeholder={loadingMaster ? "Loading..." : "Pilih kategori penggalangan dana"} });
withAsterisk
data={kategori.map((e) => ({ if (!uploadImage.success) {
value: e.id, setLoading(false);
label: e.name, ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
}))} return;
onChange={(val: string) => }
setData({
...data, const res = await Donasi_funCreateTemporary({
kategoriId: val, data: body as any,
}) fileId: uploadImage.data.id,
} });
if (res.status === 201) {
setTabsPostingDonasi("Review");
router.push(RouterDonasi.create_cerita_penggalang + `${res.donasiId}`);
} else {
setLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
}
} catch (error) {
setLoading(false);
clientLogger.error("Error create donasi", error);
}
}
return (
<>
<Stack spacing={"md"} px={"xl"}>
<ComponentGlobal_BoxInformation informasi="Lengkapi semua data di bawah untuk selanjutnya mengisi cerita penggalangan dana." />
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
dropdown: {
backgroundColor: MainColor.white,
},
}}
label="Kategori"
placeholder={
loadingMaster ? "Loading..." : "Pilih kategori penggalangan dana"
}
withAsterisk
data={kategori.map((e) => ({
value: e.id,
label: e.name,
}))}
onChange={(val: string) =>
setData({
...data,
kategoriId: val,
})
}
/>
<Stack>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
withAsterisk
label="Judul Donasi"
placeholder="Contoh: Renovasi Masjid pada kampung, dll"
maxLength={100}
onChange={(val) => {
setData({ ...data, title: val.target.value });
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Target Dana"
placeholder="0"
value={data.target}
onChange={(val) => {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "")
return setData({
...data,
target: 0 + "",
});
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const target = Intl.NumberFormat("id-ID").format(+nilai);
setTargetDana(nilai);
setData({
...data,
target,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
dropdown: {
backgroundColor: MainColor.white,
},
}}
label="Durasi"
placeholder={
loadingMaster ? "Loading..." : "Jangka waktu penggalangan dana"
}
withAsterisk
data={durasi.map((e) => ({
value: e.id,
label: e.name + " " + `hari`,
}))}
onChange={(val: string) => setData({ ...data, durasiId: val })}
/>
</Stack>
<Stack>
<ComponentGlobal_BoxUploadImage>
{img ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image
style={{ maxHeight: 250 }}
alt="Foto"
height={250}
src={img}
/>
</AspectRatio>
) : (
<Stack justify="center" align="center" h={"100%"}>
<IconPhoto size={100} />
</Stack>
)}
</ComponentGlobal_BoxUploadImage>
<Center>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFile}
onSetImage={setImg}
/> />
</Center>
<Stack> {/* Upload Foto */}
<TextInput {/* <Group position="center">
styles={{ <FileButton
label: { onChange={async (files: any) => {
color: MainColor.white, try {
}, const buffer = URL.createObjectURL(
input: { new Blob([new Uint8Array(await files.arrayBuffer())])
backgroundColor: MainColor.white );
}, setImg(buffer);
required: { setFile(files);
color: MainColor.red } catch (error) {
} console.log(error);
}} }
withAsterisk }}
label="Judul Donasi" accept="image/png,image/jpeg"
placeholder="Contoh: Renovasi Masjid pada kampung, dll"
maxLength={100}
onChange={(val) => {
setData({ ...data, title: val.target.value });
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
}
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Target Dana"
placeholder="0"
value={data.target}
onChange={(val) => {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "")
return setData({
...data,
target: 0 + "",
});
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const target = Intl.NumberFormat("id-ID").format(+nilai);
setTargetDana(nilai);
setData({
...data,
target,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
},
dropdown: {
backgroundColor: MainColor.white
}
}}
label="Durasi"
placeholder={loadingMaster ? "Loading..." : "Jangka waktu penggalangan dana"}
withAsterisk
data={durasi.map((e) => ({
value: e.id,
label: e.name + " " + `hari`,
}))}
onChange={(val: string) => setData({ ...data, durasiId: val })}
/>
</Stack>
<Stack>
<ComponentGlobal_BoxUploadImage>
{img ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image
style={{ maxHeight: 250 }}
alt="Foto"
height={250}
src={img}
/>
</AspectRatio>
) : (
<Stack justify="center" align="center" h={"100%"}>
<IconUpload color={MainColor.white} />
<Text fz={10} fs={"italic"} c={MainColor.white} fw={"bold"}>
Upload Gambar
</Text>
</Stack>
)}
</ComponentGlobal_BoxUploadImage>
{/* Upload Foto */}
<Group position="center">
<FileButton
onChange={async (files: any) => {
try {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
setImg(buffer);
setFile(files);
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
leftIcon={<IconCamera color="black" />}
radius={50}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload Gambar
</Button>
)}
</FileButton>
</Group>
</Stack>
<Button
style={{
transition: "0.5s",
}}
disabled={_.values(data).includes("") || file === null ? true : false}
loaderPosition="center"
loading={isLoading ? true : false}
my={"lg"}
radius={"xl"}
onClick={() => onCreate()}
bg={MainColor.yellow}
color="yellow"
c={"black"}
> >
Selanjutnya {(props) => (
</Button> <Button
</Stack> {...props}
</> leftIcon={<IconCamera color="black" />}
); radius={50}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload Gambar
</Button>
)}
</FileButton>
</Group> */}
</Stack>
<Button
style={{
transition: "0.5s",
}}
disabled={_.values(data).includes("") || !file}
loaderPosition="center"
loading={isLoading ? true : false}
my={"lg"}
radius={"xl"}
onClick={() => onCreate()}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Selanjutnya
</Button>
</Stack>
</>
);
} }

55
src/app_modules/donasi/edit/edit_cerita_penggalang/index.tsx
View File

@@ -4,6 +4,7 @@ import { DIRECTORY_ID } from "@/app/lib";
import { MainColor } from "@/app_modules/_global/color/color_pallet"; import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { import {
ComponentGlobal_BoxUploadImage, ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_LoadImageCustom, ComponentGlobal_LoadImageCustom,
} from "@/app_modules/_global/component"; } from "@/app_modules/_global/component";
import ComponentGlobal_ErrorInput from "@/app_modules/_global/component/error_input"; import ComponentGlobal_ErrorInput from "@/app_modules/_global/component/error_input";
@@ -15,16 +16,15 @@ import {
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global"; import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { clientLogger } from "@/util/clientLogger";
import { import {
AspectRatio, AspectRatio,
Button, Button,
Center, Center,
FileButton,
Image, Image,
Stack, Stack,
Textarea, Textarea,
} from "@mantine/core"; } from "@mantine/core";
import { IconCamera } from "@tabler/icons-react";
import _ from "lodash"; import _ from "lodash";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -60,9 +60,11 @@ export default function EditCeritaPenggalangDonasi({
file: file as File, file: file as File,
dirId: DIRECTORY_ID.donasi_cerita_image, dirId: DIRECTORY_ID.donasi_cerita_image,
}); });
if (!uploadImage.success) { if (!uploadImage.success) {
setLoading(false); setLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar"); ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
return;
} }
const deleteImage = await funGlobal_DeleteFileById({ const deleteImage = await funGlobal_DeleteFileById({
@@ -70,7 +72,7 @@ export default function EditCeritaPenggalangDonasi({
}); });
if (!deleteImage.success) { if (!deleteImage.success) {
setLoading(false); setLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal hapus gambar lama"); clientLogger.error("Gagal hapus gambar lama");
} }
const res = await Donasi_funUpdateCerita({ const res = await Donasi_funUpdateCerita({
@@ -80,7 +82,6 @@ export default function EditCeritaPenggalangDonasi({
if (res.status === 200) { if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message); ComponentGlobal_NotifikasiBerhasil(res.message);
router.back(); router.back();
setLoading(false);
} else { } else {
ComponentGlobal_NotifikasiGagal(res.message); ComponentGlobal_NotifikasiGagal(res.message);
setLoading(false); setLoading(false);
@@ -93,14 +94,14 @@ export default function EditCeritaPenggalangDonasi({
if (res.status === 200) { if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message); ComponentGlobal_NotifikasiBerhasil(res.message);
router.back(); router.back();
setLoading(false);
} else { } else {
ComponentGlobal_NotifikasiGagal(res.message); ComponentGlobal_NotifikasiGagal(res.message);
setLoading(false); setLoading(false);
} }
} }
} catch (error) { } catch (error) {
console.log(error); setLoading(false);
clientLogger.error("Error update cerita penggalangan", error);
} }
} }
@@ -114,6 +115,7 @@ export default function EditCeritaPenggalangDonasi({
color: "white", color: "white",
}, },
}} }}
maxLength={500}
autosize autosize
minRows={2} minRows={2}
maxRows={7} maxRows={7}
@@ -137,11 +139,11 @@ export default function EditCeritaPenggalangDonasi({
/> />
<ComponentGlobal_InputCountDown <ComponentGlobal_InputCountDown
lengthInput={data.pembukaan.length} lengthInput={data.pembukaan.length}
maxInput={300} maxInput={500}
/> />
</Stack> </Stack>
<Stack> <Stack spacing={0}>
<ComponentGlobal_BoxUploadImage> <ComponentGlobal_BoxUploadImage>
{updateImage ? ( {updateImage ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}> <AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
@@ -163,34 +165,10 @@ export default function EditCeritaPenggalangDonasi({
</ComponentGlobal_BoxUploadImage> </ComponentGlobal_BoxUploadImage>
<Center> <Center>
<FileButton <ComponentGlobal_ButtonUploadFileImage
onChange={async (files: any | null) => { onSetFile={setFile}
try { onSetImage={setUpdateImage}
const buffer = URL.createObjectURL( />
new Blob([new Uint8Array(await files.arrayBuffer())])
);
setUpdateImage(buffer);
setFile(files);
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
radius={"xl"}
leftIcon={<IconCamera />}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload
</Button>
)}
</FileButton>
</Center> </Center>
</Stack> </Stack>
@@ -201,6 +179,7 @@ export default function EditCeritaPenggalangDonasi({
color: "white", color: "white",
}, },
}} }}
maxLength={1000}
autosize autosize
minRows={2} minRows={2}
maxRows={7} maxRows={7}
@@ -224,11 +203,12 @@ export default function EditCeritaPenggalangDonasi({
/> />
<ComponentGlobal_InputCountDown <ComponentGlobal_InputCountDown
lengthInput={data.cerita.length} lengthInput={data.cerita.length}
maxInput={300} maxInput={1000}
/> />
</Stack> </Stack>
<Button <Button
my={"lg"}
style={{ style={{
transition: "0.5s", transition: "0.5s",
}} }}
@@ -247,7 +227,6 @@ export default function EditCeritaPenggalangDonasi({
Update Update
</Button> </Button>
</Stack> </Stack>
{/* <pre> {JSON.stringify(value.pembukaan, null, 2)}</pre> */}
</> </>
); );
} }

585
src/app_modules/donasi/edit/edit_donasi/edit_donasi_new.tsx
View File

@@ -1,13 +1,32 @@
"use client"; "use client";
import { DIRECTORY_ID } from "@/app/lib"; import { DIRECTORY_ID } from "@/app/lib";
import { MainColor } from "@/app_modules/_global/color/color_pallet"; import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_BoxUploadImage, ComponentGlobal_LoadImageCustom, } from "@/app_modules/_global/component"; import {
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_LoadImageCustom,
} from "@/app_modules/_global/component";
import ComponentGlobal_ErrorInput from "@/app_modules/_global/component/error_input"; import ComponentGlobal_ErrorInput from "@/app_modules/_global/component/error_input";
import { funGlobal_DeleteFileById, funGlobal_UploadToStorage, } from "@/app_modules/_global/fun"; import {
import { ComponentGlobal_NotifikasiBerhasil, ComponentGlobal_NotifikasiPeringatan, } from "@/app_modules/_global/notif_global"; funGlobal_DeleteFileById,
import { AspectRatio, Button, Center, FileButton, Image, Select, Stack, Text, TextInput, } from "@mantine/core"; funGlobal_UploadToStorage,
} from "@/app_modules/_global/fun";
import {
ComponentGlobal_NotifikasiBerhasil,
ComponentGlobal_NotifikasiPeringatan,
} from "@/app_modules/_global/notif_global";
import { clientLogger } from "@/util/clientLogger";
import {
AspectRatio,
Button,
Center,
Image,
Select,
Stack,
Text,
TextInput,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { IconCamera } from "@tabler/icons-react";
import _ from "lodash"; import _ from "lodash";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -17,171 +36,183 @@ import { MODEL_DONASI } from "../../model/interface";
import SkeletonEditDonasi from "./skeleton_edit_donasi"; import SkeletonEditDonasi from "./skeleton_edit_donasi";
export default function EditDonasiNew() { export default function EditDonasiNew() {
const router = useRouter(); const router = useRouter();
const [isLoading, setLoading] = useState(false); const [isLoading, setLoading] = useState(false);
const [data, setData] = useState<MODEL_DONASI>(); const [data, setData] = useState<MODEL_DONASI>();
const [kategori, setKategori] = useState<any[]>([]); const [kategori, setKategori] = useState<any[]>([]);
const [durasi, setDurasi] = useState<any[]>([]); const [durasi, setDurasi] = useState<any[]>([]);
const [file, setFile] = useState<File | null>(null); const [file, setFile] = useState<File | null>(null);
const [updateImage, setUpdateImage] = useState<any | null>(); const [updateImage, setUpdateImage] = useState<any | null>();
const [newTarget, setNewTarget] = useState(""); const [newTarget, setNewTarget] = useState("");
const [loadingMaster, setLoadingMaster] = useState(true) const [loadingMaster, setLoadingMaster] = useState(true);
const param = useParams<{ id: string }>(); const param = useParams<{ id: string }>();
const [loadingData, setLoadingData] = useState(true) const [loadingData, setLoadingData] = useState(true);
async function onGetMaster() {
async function onGetMaster() { try {
try { setLoadingMaster(true);
setLoadingMaster(true) const responseKategori = await apiGetMasterDonasi("?cat=kategori");
const responseKategori = await apiGetMasterDonasi("?cat=kategori") const responseDurasi = await apiGetMasterDonasi("?cat=durasi");
const responseDurasi = await apiGetMasterDonasi("?cat=durasi") if (responseKategori.success) {
if (responseKategori.success) { setKategori(responseKategori.data);
setKategori(responseKategori.data)
}
if (responseDurasi.success) {
setDurasi(responseDurasi.data)
}
} catch (error) {
console.log(error);
} finally {
setLoadingMaster(false)
} }
} if (responseDurasi.success) {
setDurasi(responseDurasi.data);
async function onGetData() {
try {
setLoadingData(true)
const response = await apiGetOneDonasiById(param.id, "semua")
if (response.success) {
setData(response.data)
}
} catch (error) {
console.error(error);
} finally {
setLoadingData(false)
} }
} } catch (error) {
console.log(error);
} finally {
setLoadingMaster(false);
}
}
useShallowEffect(() => { async function onGetData() {
onGetMaster() try {
onGetData() setLoadingData(true);
}, []) const response = await apiGetOneDonasiById(param.id, "semua");
if (response.success) {
async function onUpdate() { setData(response.data);
setLoading(true);
const body = {
id: data?.id,
donasiMaster_KategoriId: data?.DonasiMaster_Ketegori.id,
donasiMaster_DurasiId: data?.DonasiMaster_Durasi.id,
title: data?.title,
target: data?.target,
};
if (_.values(body).includes(""))
return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
try {
if (file !== null) {
const uploadImage = await funGlobal_UploadToStorage({
file: file as File,
dirId: DIRECTORY_ID.donasi_image,
});
if (!uploadImage.success) {
setLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
}
const deleteImage = await funGlobal_DeleteFileById({
fileId: String(data?.imageId),
});
if (!deleteImage.success) {
setLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal hapus gambar lama");
}
const res = await Donasi_funUpdateDonasi({
data: body as any,
fileId: uploadImage.data.id,
});
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
setLoading(false);
} else {
ComponentGlobal_NotifikasiPeringatan(res.message);
setLoading(false);
}
} else {
const res = await Donasi_funUpdateDonasi({
data: body as any,
});
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
setLoading(false);
} else {
ComponentGlobal_NotifikasiPeringatan(res.message);
setLoading(false);
}
}
} catch (error) {
console.log(error);
} }
} } catch (error) {
console.error(error);
} finally {
setLoadingData(false);
}
}
return ( useShallowEffect(() => {
<> onGetMaster();
{ onGetData();
loadingData ? <SkeletonEditDonasi /> }, []);
:
<Stack spacing={"md"} px={"sm"}> async function onUpdate() {
<Select setLoading(true);
styles={{ const body = {
label: { id: data?.id,
color: "white", donasiMaster_KategoriId: data?.DonasiMaster_Ketegori.id,
}, donasiMaster_DurasiId: data?.DonasiMaster_Durasi.id,
}} title: data?.title,
label="Kategori" target: data?.target,
placeholder={loadingMaster ? "Loading..." : "Pilih kategori penggalangan dana"} };
value={data?.DonasiMaster_Ketegori.id}
withAsterisk if (_.values(body).includes(""))
data={kategori.map((e) => ({ return ComponentGlobal_NotifikasiPeringatan("Lengkapin Data");
value: e.id,
label: e.name, try {
}))} if (file != null) {
onChange={(val) => const uploadImage = await funGlobal_UploadToStorage({
setData({ file: file as File,
...(data as any), dirId: DIRECTORY_ID.donasi_image,
DonasiMaster_Ketegori: { });
id: val,
}, if (!uploadImage.success) {
}) setLoading(false);
} ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
return;
}
const deleteImage = await funGlobal_DeleteFileById({
fileId: String(data?.imageId),
dirId: DIRECTORY_ID.donasi_image,
});
if (!deleteImage.success) {
setLoading(false);
clientLogger.error("Gagal hapus gambar lama");
}
const res = await Donasi_funUpdateDonasi({
data: body as any,
fileId: uploadImage.data.id,
});
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
} else {
ComponentGlobal_NotifikasiPeringatan(res.message);
setLoading(false);
}
} else {
const res = await Donasi_funUpdateDonasi({
data: body as any,
});
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
} else {
ComponentGlobal_NotifikasiPeringatan(res.message);
setLoading(false);
}
}
} catch (error) {
setLoading(false);
clientLogger.error("Error update data donasi", error);
}
}
return (
<>
{loadingData ? (
<SkeletonEditDonasi />
) : (
<Stack spacing={"md"} px={"sm"}>
<Select
styles={{
label: {
color: "white",
},
}}
label="Kategori"
placeholder={
loadingMaster ? "Loading..." : "Pilih kategori penggalangan dana"
}
value={data?.DonasiMaster_Ketegori.id}
withAsterisk
data={kategori.map((e) => ({
value: e.id,
label: e.name,
}))}
onChange={(val) =>
setData({
...(data as any),
DonasiMaster_Ketegori: {
id: val,
},
})
}
/>
<Stack>
<ComponentGlobal_BoxUploadImage>
{updateImage ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image
style={{ maxHeight: 250 }}
alt="Foto"
height={250}
src={updateImage}
/> />
</AspectRatio>
) : (
<Stack align="center" justify="center" p={"xs"} h={"100%"}>
<ComponentGlobal_LoadImageCustom
fileId={String(data?.imageId)}
height={200}
/>
</Stack>
)}
</ComponentGlobal_BoxUploadImage>
<Stack> <Center>
<ComponentGlobal_BoxUploadImage> <ComponentGlobal_ButtonUploadFileImage
{updateImage ? ( onSetFile={setFile}
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}> onSetImage={setUpdateImage}
<Image />
style={{ maxHeight: 250 }} </Center>
alt="Foto"
height={250}
src={updateImage}
/>
</AspectRatio>
) : (
<Stack align="center" justify="center" p={"xs"} h={"100%"}>
<ComponentGlobal_LoadImageCustom
fileId={String(data?.imageId)}
height={200}
/>
</Stack>
)}
</ComponentGlobal_BoxUploadImage>
<Center> {/* <Center>
<FileButton <FileButton
onChange={async (files: any | null) => { onChange={async (files: any | null) => {
try { try {
@@ -210,127 +241,127 @@ export default function EditDonasiNew() {
</Button> </Button>
)} )}
</FileButton> </FileButton>
</Center> </Center> */}
</Stack> </Stack>
<Stack> <Stack>
<TextInput <TextInput
styles={{ styles={{
label: { label: {
color: "white", color: "white",
}, },
}} }}
withAsterisk withAsterisk
label="Judul Donasi" label="Judul Donasi"
placeholder="Contoh: Renovasi Masjid pada kampung, dll" placeholder="Contoh: Renovasi Masjid pada kampung, dll"
value={data?.title} value={data?.title}
maxLength={100} maxLength={100}
error={ error={
data?.title === "" ? ( data?.title === "" ? (
<ComponentGlobal_ErrorInput text="Masukan judul" /> <ComponentGlobal_ErrorInput text="Masukan judul" />
) : ( ) : (
"" ""
) )
} }
onChange={(val) => onChange={(val) =>
setData({ setData({
...data as any, ...(data as any),
title: val.target.value, title: val.target.value,
}) })
} }
/> />
<TextInput <TextInput
styles={{ styles={{
label: { label: {
color: "white", color: "white",
}, },
}} }}
icon={<Text fw={"bold"}>Rp.</Text>} icon={<Text fw={"bold"}>Rp.</Text>}
min={0} min={0}
withAsterisk withAsterisk
label="Target Dana" label="Target Dana"
placeholder="0" placeholder="0"
value={newTarget ? newTarget : data?.target} value={newTarget ? newTarget : data?.target}
error={ error={
data?.target === "" || data?.target === "0" ? ( data?.target === "" || data?.target === "0" ? (
<ComponentGlobal_ErrorInput text="Masukan target dana" /> <ComponentGlobal_ErrorInput text="Masukan target dana" />
) : ( ) : (
"" ""
) )
} }
onChange={(val) => { onChange={(val) => {
const match = val.currentTarget.value const match = val.currentTarget.value
.replace(/\./g, "") .replace(/\./g, "")
.match(/^[0-9]+$/); .match(/^[0-9]+$/);
if (val.currentTarget.value === "") { if (val.currentTarget.value === "") {
setData({ setData({
...data as any, ...(data as any),
target: 0 + "", target: 0 + "",
}); });
setNewTarget("0"); setNewTarget("0");
} }
if (!match?.[0]) return null; if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, ""); const nilai = val.currentTarget.value.replace(/\./g, "");
const target = Intl.NumberFormat("id-ID").format(+nilai); const target = Intl.NumberFormat("id-ID").format(+nilai);
setNewTarget(target); setNewTarget(target);
setData({ setData({
...data as any, ...(data as any),
target: nilai, target: nilai,
}); });
}} }}
/> />
<Select <Select
styles={{ styles={{
label: { label: {
color: "white", color: "white",
}, },
}} }}
label="Durasi" label="Durasi"
placeholder={loadingMaster ? "Loading..." : "Jangka waktu penggalangan dana"} placeholder={
withAsterisk loadingMaster ? "Loading..." : "Jangka waktu penggalangan dana"
value={data?.DonasiMaster_Durasi.id} }
data={durasi.map((e) => ({ withAsterisk
value: e.id, value={data?.DonasiMaster_Durasi.id}
label: e.name + " " + `hari`, data={durasi.map((e) => ({
}))} value: e.id,
onChange={(val) => label: e.name + " " + `hari`,
setData({ }))}
...(data as any), onChange={(val) =>
DonasiMaster_Durasi: { setData({
id: val, ...(data as any),
}, DonasiMaster_Durasi: {
}) id: val,
} },
/> })
</Stack> }
<Button />
style={{ </Stack>
transition: "0.5s", <Button
}} style={{
disabled={data?.title === "" || data?.target === "0" ? true : false} transition: "0.5s",
loaderPosition="center" }}
loading={isLoading ? true : false} disabled={data?.title === "" || data?.target === "0" ? true : false}
my={"lg"} loaderPosition="center"
radius={"xl"} loading={isLoading ? true : false}
onClick={() => { my={"lg"}
onUpdate(); radius={"xl"}
}} onClick={() => {
bg={MainColor.yellow} onUpdate();
color="yellow" }}
c={"black"} bg={MainColor.yellow}
> color="yellow"
Update c={"black"}
</Button> >
</Stack> Update
</Button>
} </Stack>
)}
</> </>
); );
} }

4
src/app_modules/donasi/edit/edit_donasi/skeleton_edit_donasi.tsx
View File

@@ -12,10 +12,10 @@ export default function SkeletonEditDonasi() {
</Stack> </Stack>
<Stack align="center"> <Stack align="center">
{[...Array(5)].map((_, index) => ( {[...Array(3)].map((_, index) => (
<CustomSkeleton key={index} height={40} width={"100%"} my={"xs"} /> <CustomSkeleton key={index} height={40} width={"100%"} my={"xs"} />
))} ))}
<CustomSkeleton height={40} width={"100%"} radius={"lg"} mt={30} /> <CustomSkeleton height={40} width={"100%"} radius={"xl"} mt={30} />
</Stack> </Stack>
</Box> </Box>

56
src/app_modules/donasi/proses_donasi/invoice/index.tsx
View File

@@ -33,6 +33,8 @@ import TampilanRupiahDonasi from "../../component/tampilan_rupiah";
import { Donasi_funUpdateStatusInvoice } from "../../fun/update/fun_update_status_invoice"; import { Donasi_funUpdateStatusInvoice } from "../../fun/update/fun_update_status_invoice";
import { gs_donasi_hot_menu } from "../../global_state"; import { gs_donasi_hot_menu } from "../../global_state";
import { MODEL_DONASI_INVOICE } from "../../model/interface"; import { MODEL_DONASI_INVOICE } from "../../model/interface";
import { clientLogger } from "@/util/clientLogger";
import { ComponentGlobal_ButtonUploadFileImage } from "@/app_modules/_global/component";
export default function Donasi_InvoiceProses({ export default function Donasi_InvoiceProses({
dataInvoice, dataInvoice,
@@ -55,7 +57,8 @@ export default function Donasi_InvoiceProses({
if (!uploadImage.success) { if (!uploadImage.success) {
setLoading(false); setLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar"); ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
return;
} }
const res = await Donasi_funUpdateStatusInvoice({ const res = await Donasi_funUpdateStatusInvoice({
@@ -64,15 +67,6 @@ export default function Donasi_InvoiceProses({
fileId: uploadImage.data.id, fileId: uploadImage.data.id,
}); });
if (res.status === 200) { if (res.status === 200) {
// const dataNotif: any = {
// appId: res.data?.Donasi?.id as any,
// userId: res.data?.Donasi?.authorId as any,
// pesan: res.data?.Donasi?.title as any,
// status: res.data?.DonasiMaster_StatusInvoice?.name,
// kategoriApp: "DONASI",
// title: "Donatur melakukan transfer",
// };
const dataNotifikasi: IRealtimeData = { const dataNotifikasi: IRealtimeData = {
appId: res.data?.Donasi?.id as any, appId: res.data?.Donasi?.id as any,
status: res.data?.DonasiMaster_StatusInvoice?.name as any, status: res.data?.DonasiMaster_StatusInvoice?.name as any,
@@ -87,22 +81,22 @@ export default function Donasi_InvoiceProses({
}); });
if (notif.status === 201) { if (notif.status === 201) {
WibuRealtime.setData({ WibuRealtime.setData({
type: "notification", type: "notification",
pushNotificationTo: "ADMIN", pushNotificationTo: "ADMIN",
}); });
ComponentGlobal_NotifikasiBerhasil(res.message); ComponentGlobal_NotifikasiBerhasil(res.message);
setActive(2); setActive(2);
router.push(RouterDonasi.proses_transaksi + `${invoice.id}`); router.push(RouterDonasi.proses_transaksi + `${invoice.id}`);
setLoading(false);
} }
} else { } else {
ComponentGlobal_NotifikasiGagal(res.message); ComponentGlobal_NotifikasiGagal(res.message);
setLoading(false); setLoading(false);
} }
} catch (error) { } catch (error) {
console.log(error); setLoading(false);
clientLogger.error("Error upload data invoice", error);
} }
} }
@@ -259,35 +253,9 @@ export default function Donasi_InvoiceProses({
> >
<Stack spacing={"sm"}> <Stack spacing={"sm"}>
<Center> <Center>
<FileButton <ComponentGlobal_ButtonUploadFileImage onSetFile={setFile} />
onChange={async (files: any | null) => {
try {
// const buffer = URL.createObjectURL(
// new Blob([new Uint8Array(await files.arrayBuffer())])
// );
// console.log(buffer, "ini buffer");
setFile(files);
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
radius={"xl"}
leftIcon={<IconCamera />}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload
</Button>
)}
</FileButton>
</Center> </Center>
{file ? ( {file ? (
<Center> <Center>
<Group spacing={"xs"}> <Group spacing={"xs"}>

75
src/app_modules/donasi/proses_donasi/metode_pembayaran/index.tsx
View File

@@ -17,6 +17,7 @@ import { useState } from "react";
import { Donasi_funCreateInvoice } from "../../fun/create/fun_create_invoice"; import { Donasi_funCreateInvoice } from "../../fun/create/fun_create_invoice";
import { gs_donasi_hot_menu, gs_proses_donasi } from "../../global_state"; import { gs_donasi_hot_menu, gs_proses_donasi } from "../../global_state";
import { WibuRealtime } from "wibu-pkg"; import { WibuRealtime } from "wibu-pkg";
import { clientLogger } from "@/util/clientLogger";
export default function Donasi_MetodePembayaran({ export default function Donasi_MetodePembayaran({
listBank, listBank,
@@ -35,47 +36,51 @@ export default function Donasi_MetodePembayaran({
const [activeHotMenu, setActiveHotMenu] = useAtom(gs_donasi_hot_menu); const [activeHotMenu, setActiveHotMenu] = useAtom(gs_donasi_hot_menu);
async function onProses() { async function onProses() {
const body = { try {
donasiId: donasiId, setLoading(true);
donasiMaster_BankId: pilihBank, const body = {
nominal: prosesDonasi.nominal, donasiId: donasiId,
authorId: authorId, donasiMaster_BankId: pilihBank,
}; nominal: prosesDonasi.nominal,
authorId: authorId,
const res = await Donasi_funCreateInvoice(body);
if (res.status === 200) {
const dataNotifikasi: IRealtimeData = {
appId: res.data?.Donasi?.id as any,
status: res.data?.DonasiMaster_StatusInvoice?.name as any,
userId: res.data?.Donasi?.authorId as any,
pesan: res.data?.Donasi?.title as any,
kategoriApp: "DONASI",
title: "Donatur membuat invoice donasi",
}; };
const notif = await notifikasiToAdmin_funCreate({ const res = await Donasi_funCreateInvoice(body);
data: dataNotifikasi as any, if (res.status === 200) {
}); const dataNotifikasi: IRealtimeData = {
appId: res.data?.Donasi?.id as any,
status: res.data?.DonasiMaster_StatusInvoice?.name as any,
userId: res.data?.Donasi?.authorId as any,
pesan: res.data?.Donasi?.title as any,
kategoriApp: "DONASI",
title: "Donatur membuat invoice donasi",
};
if (notif.status === 201) { const notif = await notifikasiToAdmin_funCreate({
WibuRealtime.setData({ data: dataNotifikasi as any,
type: "notification",
pushNotificationTo: "ADMIN",
}); });
setLoading(true); if (notif.status === 201) {
setActiveHotMenu(2); WibuRealtime.setData({
ComponentGlobal_NotifikasiBerhasil(res.message); type: "notification",
setProsesDonasi({ pushNotificationTo: "ADMIN",
...prosesDonasi, });
nominal: "",
}); setActiveHotMenu(2);
router.push(RouterDonasi.invoice + `${res.data?.id}`); ComponentGlobal_NotifikasiBerhasil(res.message);
setProsesDonasi({
...prosesDonasi,
nominal: "",
});
router.push(RouterDonasi.invoice + `${res.data?.id}`);
}
} else {
setLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
} }
} else { } catch (error) {
ComponentGlobal_NotifikasiGagal(res.message); setLoading(false);
clientLogger.error("Error proses donasi:", error);
} }
} }

1
src/app_modules/notifikasi/fun/create/create_notif_to_admin.ts
View File

@@ -8,7 +8,6 @@ export default async function notifikasiToAdmin_funCreate({
}: { }: {
data: MODEL_NOTIFIKASI; data: MODEL_NOTIFIKASI;
}) { }) {
const getAdmin = await prisma.user.findMany({ const getAdmin = await prisma.user.findMany({
where: { where: {
active: true, active: true,