QC Investasi
# fix Tampilan admin investasi Tampilan admin donasi ## No issuee
This commit is contained in:
197
src/app_modules/admin/donasi/detail/detail_reject.tsx
Normal file
197
src/app_modules/admin/donasi/detail/detail_reject.tsx
Normal file
@@ -0,0 +1,197 @@
|
||||
"use client";
|
||||
|
||||
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
|
||||
import {
|
||||
AspectRatio,
|
||||
Button,
|
||||
Divider,
|
||||
Group,
|
||||
Image,
|
||||
Modal,
|
||||
Paper,
|
||||
SimpleGrid,
|
||||
Stack,
|
||||
Text,
|
||||
Textarea,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import { useState } from "react";
|
||||
import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
|
||||
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import { useDisclosure } from "@mantine/hooks";
|
||||
import { AdminDonasi_funUpdateCatatanReject } from "../fun/update/fun_update_catatan_reject";
|
||||
import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
|
||||
import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
|
||||
import { AdminDonasi_getOneById } from "../fun/get/get_one_by_id";
|
||||
import ComponentGlobal_InputCountDown from "@/app_modules/component_global/input_countdown";
|
||||
|
||||
export default function AdminDonasi_DetailReject({
|
||||
dataReject,
|
||||
}: {
|
||||
dataReject: MODEL_DONASI;
|
||||
}) {
|
||||
const [donasi, setDonasi] = useState(dataReject);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<ButtonOnHeader
|
||||
catatan={donasi.catatan}
|
||||
donasiId={donasi.id}
|
||||
setDonasi={setDonasi}
|
||||
/>
|
||||
<SimpleGrid
|
||||
cols={2}
|
||||
spacing="lg"
|
||||
breakpoints={[
|
||||
{ maxWidth: "md", cols: 2, spacing: "md" },
|
||||
{ maxWidth: "sm", cols: 1, spacing: "sm" },
|
||||
{ maxWidth: "xs", cols: 1, spacing: "xs" },
|
||||
]}
|
||||
>
|
||||
<TampilanDetailDonasi donasi={donasi} />
|
||||
<CatatanReject catatan={donasi.catatan} />
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ButtonOnHeader({
|
||||
catatan,
|
||||
donasiId,
|
||||
setDonasi,
|
||||
}: {
|
||||
catatan: string;
|
||||
donasiId: string;
|
||||
setDonasi: any;
|
||||
}) {
|
||||
const [report, setReport] = useState(catatan);
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
|
||||
async function onUpdate() {
|
||||
await AdminDonasi_funUpdateCatatanReject(donasiId, report).then(
|
||||
async (res) => {
|
||||
if (res.status === 200) {
|
||||
NotifBerhasil(res.message);
|
||||
close();
|
||||
await AdminDonasi_getOneById(donasiId).then((res) => setDonasi(res));
|
||||
} else {
|
||||
NotifGagal(res.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<Group position="apart">
|
||||
<ComponentAdminDonasi_TombolKembali />
|
||||
<Button radius={"xl"} bg={"orange"} color="orange" onClick={open}>
|
||||
Tambah catatan
|
||||
</Button>
|
||||
</Group>
|
||||
<Divider />
|
||||
</Stack>
|
||||
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={close}
|
||||
centered
|
||||
size={"lg"}
|
||||
withCloseButton={false}
|
||||
>
|
||||
<Stack>
|
||||
<Textarea
|
||||
autosize
|
||||
minRows={3}
|
||||
maxRows={5}
|
||||
maxLength={300}
|
||||
label="Update alasan penolakan"
|
||||
placeholder="Masukan alasan penolakan"
|
||||
value={report}
|
||||
onChange={(val) => setReport(val.target.value)}
|
||||
/>
|
||||
<ComponentGlobal_InputCountDown
|
||||
maxInput={300}
|
||||
lengthInput={report.length}
|
||||
/>
|
||||
|
||||
<Group position="right">
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
close();
|
||||
}}
|
||||
>
|
||||
Batal
|
||||
</Button>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
onUpdate();
|
||||
}}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TampilanDetailDonasi({ donasi }: { donasi: MODEL_DONASI }) {
|
||||
return (
|
||||
<>
|
||||
<Paper radius={"md"} p={"md"}>
|
||||
<Stack>
|
||||
<Stack>
|
||||
<AspectRatio ratio={16 / 9}>
|
||||
<Paper radius={"md"}>
|
||||
<Image
|
||||
alt="Foto"
|
||||
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
|
||||
/>
|
||||
</Paper>
|
||||
</AspectRatio>
|
||||
<Stack spacing={0}>
|
||||
<Title order={4}>{donasi.title}</Title>
|
||||
<Text fz={"xs"}>
|
||||
Durasi: {donasi.DonasiMaster_Durasi.name} hari
|
||||
</Text>
|
||||
</Stack>
|
||||
|
||||
<Stack spacing={0}>
|
||||
<Group>
|
||||
<Text fz={12}>Dana dibutuhkan</Text>
|
||||
<Title order={4} c="blue">
|
||||
<TampilanRupiahDonasi nominal={+donasi.target} />
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Kategori</Text>
|
||||
<Title order={4} c="blue">
|
||||
{donasi.DonasiMaster_Ketegori.name}
|
||||
</Title>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function CatatanReject({ catatan }: { catatan: string }) {
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<Title order={6}>Alasan Penolakan</Title>
|
||||
<Text>{catatan}</Text>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
256
src/app_modules/admin/donasi/detail/detail_review.tsx
Normal file
256
src/app_modules/admin/donasi/detail/detail_review.tsx
Normal file
@@ -0,0 +1,256 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
AspectRatio,
|
||||
Button,
|
||||
Divider,
|
||||
Group,
|
||||
Image,
|
||||
Modal,
|
||||
Paper,
|
||||
Progress,
|
||||
SimpleGrid,
|
||||
Stack,
|
||||
Text,
|
||||
TextInput,
|
||||
Textarea,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
|
||||
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import {
|
||||
MODEL_CERITA_DONASI,
|
||||
MODEL_DONASI,
|
||||
} from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useDisclosure } from "@mantine/hooks";
|
||||
import { AdminDonasi_funUpdateStatusPublish } from "../fun/update/fun_status_publish";
|
||||
import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
|
||||
import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
|
||||
import toast from "react-simple-toasts";
|
||||
import { AdminDonasi_funUpdateStatusReject } from "../fun/update/fun_status_reject";
|
||||
import _ from "lodash";
|
||||
import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
|
||||
import { ComponentGlobalAdmin_NotifikasiPeringatan } from "../../component/admin_notifikasi/notifikasi_peringatan";
|
||||
import ComponentGlobal_InputCountDown from "@/app_modules/component_global/input_countdown";
|
||||
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "../../component/admin_notifikasi/notifikasi_berhasil";
|
||||
import { ComponentGlobalAdmin_NotifikasiGagal } from "../../component/admin_notifikasi/notifikasi_gagal";
|
||||
import adminDonasi_getListReview from "../fun/get/get_list_review";
|
||||
import { AdminDonasi_getOneById } from "../fun/get/get_one_by_id";
|
||||
|
||||
export default function AdminDonasi_DetailReview({
|
||||
dataReview,
|
||||
}: {
|
||||
dataReview: MODEL_DONASI;
|
||||
}) {
|
||||
const [data, setData] = useState(dataReview);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<ButtonOnHeader donasi={data} setData={setData} />
|
||||
<SimpleGrid
|
||||
cols={2}
|
||||
spacing="lg"
|
||||
breakpoints={[
|
||||
{ maxWidth: "md", cols: 2, spacing: "md" },
|
||||
{ maxWidth: "sm", cols: 1, spacing: "sm" },
|
||||
{ maxWidth: "xs", cols: 1, spacing: "xs" },
|
||||
]}
|
||||
>
|
||||
<TampilanDetailDonasi donasi={data} />
|
||||
<CeritaPenggalangDana cerita={data.CeritaDonasi} />
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ButtonOnHeader({
|
||||
donasi,
|
||||
setData,
|
||||
}: {
|
||||
donasi: MODEL_DONASI;
|
||||
setData: any;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const [isLoadingPublish, setLoadingPublish] = useState(false);
|
||||
const [isLoadingReject, setLoadingReject] = useState(false);
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
const [catatan, setCatatan] = useState("");
|
||||
|
||||
async function onPulish() {
|
||||
await AdminDonasi_funUpdateStatusPublish(donasi.id, "1").then(
|
||||
async (res) => {
|
||||
if (res.status === 200) {
|
||||
const newData = await AdminDonasi_getOneById(donasi?.id);
|
||||
setData(newData);
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(
|
||||
"Berhasil Mengubah Status Donasi"
|
||||
);
|
||||
setLoadingPublish(true);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiPeringatan(
|
||||
"Gagal Mengubah Status Donasi"
|
||||
);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
async function onReject() {
|
||||
if (catatan === "")
|
||||
return ComponentGlobalAdmin_NotifikasiPeringatan(
|
||||
"Lengkapi Alasan Penolakan"
|
||||
);
|
||||
|
||||
await AdminDonasi_funUpdateStatusReject(donasi.id, "4", catatan).then(
|
||||
async (res) => {
|
||||
if (res.status === 200) {
|
||||
const newData = await AdminDonasi_getOneById(donasi?.id);
|
||||
setData(newData);
|
||||
close();
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(res.message);
|
||||
setLoadingReject(true);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiGagal(res.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Group position="apart">
|
||||
<ComponentAdminDonasi_TombolKembali />
|
||||
{donasi.donasiMaster_StatusDonasiId === "2" ? (
|
||||
<Group>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
bg={"green"}
|
||||
color="green"
|
||||
onClick={() => onPulish()}
|
||||
>
|
||||
Publish
|
||||
</Button>
|
||||
<Button radius={"xl"} bg={"red"} color="red" onClick={open}>
|
||||
Reject
|
||||
</Button>
|
||||
</Group>
|
||||
) : (
|
||||
""
|
||||
)}
|
||||
</Group>
|
||||
<Divider />
|
||||
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={close}
|
||||
centered
|
||||
size={"lg"}
|
||||
withCloseButton={false}
|
||||
>
|
||||
<Stack>
|
||||
<Textarea
|
||||
autosize
|
||||
minRows={3}
|
||||
maxRows={5}
|
||||
maxLength={300}
|
||||
label="Alasan penolakan"
|
||||
placeholder="Masukan alasan penolakan"
|
||||
onChange={(val) => setCatatan(val.target.value)}
|
||||
/>
|
||||
<ComponentGlobal_InputCountDown
|
||||
maxInput={300}
|
||||
lengthInput={catatan.length}
|
||||
/>
|
||||
|
||||
<Group position="right">
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
close();
|
||||
}}
|
||||
>
|
||||
Batal
|
||||
</Button>
|
||||
<Button
|
||||
loaderPosition="center"
|
||||
loading={isLoadingReject ? true : false}
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
onReject();
|
||||
}}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TampilanDetailDonasi({ donasi }: { donasi: MODEL_DONASI }) {
|
||||
return (
|
||||
<>
|
||||
<Paper radius={"md"} p={"md"}>
|
||||
<Stack>
|
||||
<Stack>
|
||||
<AspectRatio ratio={16 / 9}>
|
||||
<Paper radius={"md"}>
|
||||
<Image
|
||||
alt="Foto"
|
||||
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
|
||||
/>
|
||||
</Paper>
|
||||
</AspectRatio>
|
||||
<Stack spacing={0}>
|
||||
<Title order={4}>{donasi.title}</Title>
|
||||
<Text fz={"xs"}>
|
||||
Durasi: {donasi.DonasiMaster_Durasi.name} hari
|
||||
</Text>
|
||||
</Stack>
|
||||
|
||||
<Stack spacing={0}>
|
||||
<Group>
|
||||
<Text fz={12}>Dana dibutuhkan</Text>
|
||||
<Title order={4} c="blue">
|
||||
<TampilanRupiahDonasi nominal={+donasi.target} />
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Kategori</Text>
|
||||
<Title order={4} c="blue">
|
||||
{donasi.DonasiMaster_Ketegori.name}
|
||||
</Title>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function CeritaPenggalangDana({ cerita }: { cerita: MODEL_CERITA_DONASI }) {
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<Title order={5}>Cerita Penggalang Dana</Title>
|
||||
<Text>{cerita.pembukaan}</Text>
|
||||
<AspectRatio ratio={16 / 9}>
|
||||
<Paper radius={"md"}>
|
||||
<Image
|
||||
alt="Foto"
|
||||
src={RouterDonasi.api_gambar_cerita + `${cerita.imagesId}`}
|
||||
/>
|
||||
</Paper>
|
||||
</AspectRatio>
|
||||
<Text>{cerita.cerita}</Text>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
655
src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
Normal file
655
src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
Normal file
@@ -0,0 +1,655 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
ActionIcon,
|
||||
AspectRatio,
|
||||
Badge,
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Divider,
|
||||
Grid,
|
||||
Group,
|
||||
Image,
|
||||
Modal,
|
||||
Pagination,
|
||||
Paper,
|
||||
Progress,
|
||||
ScrollArea,
|
||||
Select,
|
||||
SimpleGrid,
|
||||
Spoiler,
|
||||
Stack,
|
||||
Table,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
|
||||
import { RouterDonasi } from "@/app/lib/router_hipmi/router_donasi";
|
||||
import {
|
||||
IconClover,
|
||||
IconMessageChatbot,
|
||||
IconMoneybag,
|
||||
IconReload,
|
||||
} from "@tabler/icons-react";
|
||||
import router from "next/router";
|
||||
import moment from "moment";
|
||||
import {
|
||||
MODEL_DONASI,
|
||||
MODEL_DONASI_INVOICE,
|
||||
MODEL_DONASI_PENCAIRAN_DANA,
|
||||
} from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import { RouterAdminDonasi_OLD } from "@/app/lib/router_hipmi/router_admin";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import _ from "lodash";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useDisclosure, useInterval, useShallowEffect } from "@mantine/hooks";
|
||||
import { Donasi_getOneById } from "@/app_modules/donasi/fun/get/get_one_donasi_by_id";
|
||||
import { AdminDonasi_getOneById } from "../../fun/get/get_one_by_id";
|
||||
import ComponentGlobalAdmin_BackButton from "@/app_modules/admin/component/back_button";
|
||||
import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
|
||||
import { adminDonasi_getListDonatur } from "../../fun/get/get_list_donatur_by_id";
|
||||
import { RouterAdminDonasi } from "@/app/lib/router_admin/router_admin_donasi";
|
||||
import adminDonasi_funUpdateStatusDanTotal from "../../fun/update/fun_update_status_dan_total";
|
||||
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "@/app_modules/admin/component/admin_notifikasi/notifikasi_berhasil";
|
||||
import { ComponentGlobalAdmin_NotifikasiGagal } from "@/app_modules/admin/component/admin_notifikasi/notifikasi_gagal";
|
||||
|
||||
export default function AdminDonasi_DetailPublish({
|
||||
dataPublish,
|
||||
listDonatur,
|
||||
countDonatur,
|
||||
listPencairan,
|
||||
listMasterStatus,
|
||||
}: {
|
||||
dataPublish: MODEL_DONASI;
|
||||
listDonatur: any[];
|
||||
countDonatur: number;
|
||||
listPencairan: MODEL_DONASI_PENCAIRAN_DANA[];
|
||||
listMasterStatus: MODEL_NEW_DEFAULT_MASTER[];
|
||||
}) {
|
||||
const [dataDonasi, setDataDonasi] = useState(dataPublish);
|
||||
const [pencairan, setPencairan] = useState(listPencairan);
|
||||
const selectedData = _.omit(dataDonasi, [
|
||||
"Author",
|
||||
"imageDonasi",
|
||||
"CeritaDonasi",
|
||||
"DonasiMaster_Ketegori",
|
||||
"DonasiMaster_Durasi",
|
||||
"DonasiMaster_Status",
|
||||
]);
|
||||
|
||||
// fungsi manggil serveraction
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* <pre>{JSON.stringify(pencairan, null, 2)}</pre> */}
|
||||
<Stack>
|
||||
<ComponentGlobalAdmin_BackButton />
|
||||
<TampilanDetailDonasi donasi={dataDonasi} countDonatur={countDonatur} />
|
||||
<TampilanListDonatur
|
||||
donatur={listDonatur}
|
||||
listMasterStatus={listMasterStatus}
|
||||
dataDonasi={selectedData as any}
|
||||
onSuccessDonasi={(val) => {
|
||||
setDataDonasi(val);
|
||||
}}
|
||||
/>
|
||||
<TampilanListPencairan pencairan={pencairan} />
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TampilanDetailDonasi({
|
||||
donasi,
|
||||
countDonatur,
|
||||
}: {
|
||||
donasi: MODEL_DONASI;
|
||||
countDonatur: number;
|
||||
}) {
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
const router = useRouter();
|
||||
return (
|
||||
<>
|
||||
<Paper radius={"md"} p={"md"}>
|
||||
<Stack>
|
||||
<SimpleGrid
|
||||
cols={3}
|
||||
spacing="lg"
|
||||
breakpoints={[
|
||||
{ maxWidth: "62rem", cols: 3, spacing: "md" },
|
||||
{ maxWidth: "48rem", cols: 2, spacing: "sm" },
|
||||
{ maxWidth: "36rem", cols: 1, spacing: "sm" },
|
||||
]}
|
||||
>
|
||||
<Paper withBorder>
|
||||
<AspectRatio ratio={1 / 1}>
|
||||
<Image
|
||||
// mah={500}
|
||||
// mx={"auto"}
|
||||
alt="Foto"
|
||||
src={RouterDonasi.api_gambar + `${donasi.imagesId}`}
|
||||
/>
|
||||
</AspectRatio>
|
||||
</Paper>
|
||||
|
||||
<Paper withBorder p={"sm"}>
|
||||
<Stack spacing={5}>
|
||||
<Title order={4}>{donasi.title}</Title>
|
||||
<Group>
|
||||
<Text fz={"xs"}>Penggalang Dana</Text>
|
||||
<Title order={5} c="blue">
|
||||
{donasi.Author.username}
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Durasi</Text>
|
||||
<Title order={5} c="blue">
|
||||
{donasi.DonasiMaster_Durasi.name} hari
|
||||
</Title>
|
||||
</Group>
|
||||
|
||||
<Group>
|
||||
<Text fz={12}>Dana dibutuhkan</Text>
|
||||
<Title order={5} c="blue">
|
||||
<TampilanRupiahDonasi nominal={+donasi.target} />
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Kategori</Text>
|
||||
<Title order={5} c="blue">
|
||||
{donasi.DonasiMaster_Ketegori.name}
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Total donatur</Text>
|
||||
<Title order={5} c="blue">
|
||||
{countDonatur}
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Progres</Text>
|
||||
<Title order={5} c="blue">
|
||||
{donasi.progres} %
|
||||
</Title>
|
||||
</Group>
|
||||
<Group>
|
||||
<Text fz={12}>Dana terkumpul</Text>
|
||||
<Title order={5} c="blue">
|
||||
<TampilanRupiahDonasi nominal={+donasi.terkumpul} />
|
||||
</Title>
|
||||
</Group>
|
||||
{/* <Button w={200} bg={"green.5"} color="green">Pencairan Dana</Button> */}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
<Paper withBorder p={"sm"}>
|
||||
<Stack spacing={"xl"}>
|
||||
<Center>
|
||||
<Title order={4}>Pencairan Dana</Title>
|
||||
</Center>
|
||||
<Grid>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Stack spacing={0}>
|
||||
<Text fz={"xs"}>Total Dana Dicairkan</Text>
|
||||
<Title>
|
||||
<TampilanRupiahDonasi
|
||||
nominal={donasi.totalPencairan}
|
||||
fontSize={14}
|
||||
/>
|
||||
</Title>
|
||||
</Stack>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Stack spacing={0}>
|
||||
<Text fz={"xs"}>Bank Tujuan</Text>
|
||||
<Title order={6}>{donasi.namaBank}</Title>
|
||||
</Stack>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Stack spacing={0}>
|
||||
<Text fz={"xs"}>Akumulasi Pencairan</Text>
|
||||
<Title order={6}>{donasi.akumulasiPencairan} Kali</Title>
|
||||
</Stack>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Stack spacing={0}>
|
||||
<Text fz={"xs"}>Nomor Rekening</Text>
|
||||
<Title order={6}>{donasi.rekening}</Title>
|
||||
</Stack>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() =>
|
||||
router.push(
|
||||
RouterAdminDonasi_OLD.pencairan_dana + `${donasi.id}`
|
||||
)
|
||||
}
|
||||
>
|
||||
Cairkan Dana
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Paper>
|
||||
<Modal opened={opened} onClose={close} centered>
|
||||
<PencairanDana />
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function PencairanDana() {
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<TextInput label="Masukan nominal" />
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
//######################## LIST DONATUR #####################//
|
||||
function TampilanListDonatur({
|
||||
donatur,
|
||||
listMasterStatus,
|
||||
dataDonasi,
|
||||
onSuccessDonasi,
|
||||
}: {
|
||||
donatur: any;
|
||||
listMasterStatus: MODEL_NEW_DEFAULT_MASTER[];
|
||||
dataDonasi: MODEL_DONASI;
|
||||
|
||||
onSuccessDonasi: (val: any) => void;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const [isLoading, setLoading] = useState(false);
|
||||
const [idData, setIdData] = useState("");
|
||||
const [lisDonatur, setListDonatur] = useState<MODEL_DONASI_INVOICE[]>(
|
||||
donatur.data
|
||||
);
|
||||
const [isNPage, setNPage] = useState(donatur.nPage);
|
||||
const [isActivePage, setActivePage] = useState(1);
|
||||
const [isSelect, setSelect] = useState("");
|
||||
|
||||
async function onRelaod() {
|
||||
const loadData = await adminDonasi_getListDonatur({
|
||||
donasiId: dataDonasi?.id,
|
||||
page: 1,
|
||||
});
|
||||
setSelect("");
|
||||
setListDonatur(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
async function onSelect(s: any) {
|
||||
setSelect(s);
|
||||
const loadData = await adminDonasi_getListDonatur({
|
||||
donasiId: dataDonasi?.id,
|
||||
page: 1,
|
||||
selectStatusId: s,
|
||||
});
|
||||
setListDonatur(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
setActivePage(1);
|
||||
}
|
||||
|
||||
async function onPageClick(p: any) {
|
||||
setActivePage(p);
|
||||
const loadData = await adminDonasi_getListDonatur({
|
||||
donasiId: dataDonasi?.id,
|
||||
page: p,
|
||||
selectStatusId: isSelect,
|
||||
});
|
||||
setListDonatur(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
const tableRows = lisDonatur.map((e, i) => (
|
||||
<tr key={i}>
|
||||
<td>
|
||||
<Center>{e?.Author.username}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.DonasiMaster_Bank?.name}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<TampilanRupiahDonasi nominal={+e?.nominal} />
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
{new Intl.DateTimeFormat("id-ID", { dateStyle: "full" }).format(
|
||||
e?.createdAt
|
||||
)}
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Badge w={150} variant="dot">
|
||||
{e?.DonasiMaster_StatusInvoice?.name}
|
||||
</Badge>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
{e?.donasiMaster_StatusInvoiceId === "1" ||
|
||||
e?.donasiMaster_StatusInvoiceId === "2" ? (
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() =>
|
||||
router.push(
|
||||
RouterAdminDonasi.transfer_invoice + `${e?.imagesId}`
|
||||
)
|
||||
}
|
||||
>
|
||||
Cek
|
||||
</Button>
|
||||
) : (
|
||||
"-"
|
||||
)}
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
{e?.donasiMaster_StatusInvoiceId === "1" ? (
|
||||
<Button radius={"xl"} disabled>
|
||||
Selesai
|
||||
</Button>
|
||||
) : e?.DonasiMaster_StatusInvoice?.id === "2" ? (
|
||||
<ButtonAccept
|
||||
invoiceId={e?.id}
|
||||
donasiId={dataDonasi?.id}
|
||||
nominal={+e?.nominal}
|
||||
danaTerkumpul={+dataDonasi?.terkumpul}
|
||||
target={+dataDonasi?.target}
|
||||
onSuccessDonasi={(val) => {
|
||||
onSuccessDonasi(val);
|
||||
}}
|
||||
onSuccessDonatur={(val) => {
|
||||
setListDonatur(val.data);
|
||||
setNPage(val.nPage);
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<Text>-</Text>
|
||||
)}
|
||||
</Center>
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
{/* <pre>{JSON.stringify(dataDonasi, null, 2)}</pre> */}
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"gray.4"}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Daftar Donatur</Title>
|
||||
<Group>
|
||||
<ActionIcon
|
||||
size={"lg"}
|
||||
radius={"xl"}
|
||||
variant="light"
|
||||
onClick={() => {
|
||||
onRelaod();
|
||||
}}
|
||||
>
|
||||
<IconReload />
|
||||
</ActionIcon>
|
||||
<Select
|
||||
placeholder="Pilih status"
|
||||
value={isSelect}
|
||||
data={listMasterStatus.map((e) => ({
|
||||
value: e.id,
|
||||
label: e.name,
|
||||
}))}
|
||||
onChange={(val) => {
|
||||
onSelect(val);
|
||||
}}
|
||||
/>
|
||||
</Group>
|
||||
</Group>
|
||||
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"xl"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={1500}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Nama Donatur</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Nama Bank</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Jumlah Donasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tanggal</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Status</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Bukti Transfer</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{tableRows}</tbody>
|
||||
</Table>
|
||||
</ScrollArea>
|
||||
|
||||
<Center mt={"xl"}>
|
||||
<Pagination
|
||||
value={isActivePage}
|
||||
total={isNPage}
|
||||
onChange={(val) => {
|
||||
onPageClick(val);
|
||||
}}
|
||||
/>
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ButtonAccept({
|
||||
invoiceId,
|
||||
donasiId,
|
||||
nominal,
|
||||
danaTerkumpul,
|
||||
target,
|
||||
onSuccessDonasi,
|
||||
onSuccessDonatur,
|
||||
}: {
|
||||
invoiceId: string;
|
||||
donasiId: string;
|
||||
nominal: number;
|
||||
danaTerkumpul: number;
|
||||
target: number;
|
||||
onSuccessDonasi: (val: any) => void;
|
||||
onSuccessDonatur: (val: any) => void;
|
||||
}) {
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
|
||||
async function onAccept() {
|
||||
let nominalDonasi = nominal;
|
||||
let jumlahTerkumpul = danaTerkumpul;
|
||||
|
||||
const updateStatus = await adminDonasi_funUpdateStatusDanTotal({
|
||||
invoiceId: invoiceId,
|
||||
donasiId: donasiId,
|
||||
jumlahTerkumpul: jumlahTerkumpul,
|
||||
nominal: nominalDonasi,
|
||||
statusInvoiceId: "1",
|
||||
target: target,
|
||||
});
|
||||
if (updateStatus.status == 200) {
|
||||
const updateData = await AdminDonasi_getOneById(donasiId);
|
||||
onSuccessDonasi(updateData as any);
|
||||
const updatelistDonatur = await adminDonasi_getListDonatur({
|
||||
donasiId: donasiId,
|
||||
page: 1,
|
||||
});
|
||||
onSuccessDonatur(updatelistDonatur);
|
||||
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(updateStatus.message);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiGagal(updateStatus.message);
|
||||
}
|
||||
|
||||
close();
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
color="green"
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
open();
|
||||
}}
|
||||
>
|
||||
Terima
|
||||
</Button>
|
||||
|
||||
<Modal opened={opened} onClose={close} centered withCloseButton={false}>
|
||||
<Paper>
|
||||
<Stack align="center">
|
||||
<Title
|
||||
order={6}
|
||||
>{`${"Anda yakin sudah melihat bukti transfer ?"}`}</Title>
|
||||
<Group position="center">
|
||||
<Button radius={"xl"} onClick={() => close()}>
|
||||
Batal
|
||||
</Button>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
onAccept();
|
||||
}}
|
||||
>
|
||||
Terima
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
//######################## LIST PENCAIRAN #####################//
|
||||
function TampilanListPencairan({
|
||||
pencairan,
|
||||
}: {
|
||||
pencairan: MODEL_DONASI_PENCAIRAN_DANA[];
|
||||
}) {
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
const [gambarId, setGambarId] = useState("");
|
||||
|
||||
const rowTable = pencairan.map((e) => (
|
||||
<tr key={e.id}>
|
||||
<td>
|
||||
<TampilanRupiahDonasi nominal={e.nominalCair} />
|
||||
</td>
|
||||
<td>{moment(e.createdAt).format("ll")}</td>
|
||||
<td>
|
||||
<Text>{e.title}</Text>
|
||||
</td>
|
||||
<td width={500}>
|
||||
<Box w={"100%"}>
|
||||
<Spoiler hideLabel="Sembunyikan" maxHeight={70} showLabel="Lihat">
|
||||
{e.deskripsi}
|
||||
</Spoiler>
|
||||
</Box>
|
||||
</td>
|
||||
<td>
|
||||
{
|
||||
<Box>
|
||||
<Center>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
compact
|
||||
bg={"green"}
|
||||
color="green"
|
||||
onClick={() => {
|
||||
open();
|
||||
setGambarId(e.imagesId);
|
||||
}}
|
||||
>
|
||||
Detail
|
||||
</Button>
|
||||
</Center>
|
||||
</Box>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal opened={opened} onClose={close} centered>
|
||||
<AspectRatio ratio={9 / 16}>
|
||||
<Image
|
||||
src={RouterDonasi.api_gambar_pencairan + `${gambarId}`}
|
||||
alt="Foto"
|
||||
/>
|
||||
</AspectRatio>
|
||||
</Modal>
|
||||
|
||||
<Stack p={"md"}>
|
||||
<Title order={3}>Rincian Pencairan Dana</Title>
|
||||
{/* <pre>{JSON.stringify(pencairan, null, 2)}</pre> */}
|
||||
{_.isEmpty(pencairan) ? (
|
||||
<Paper bg={"gray.1"} p={"xs"}>
|
||||
<Center>BELUM ADA PENCAIRAN DANA</Center>
|
||||
</Paper>
|
||||
) : (
|
||||
<Paper withBorder p={"xs"}>
|
||||
<Table horizontalSpacing={"md"} verticalSpacing={"md"}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nominal</th>
|
||||
<th>Tanggal</th>
|
||||
<th>Judul</th>
|
||||
<th>
|
||||
<Center>Deskripsi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Bukti Transfer</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{rowTable}</tbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
)}
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
196
src/app_modules/admin/donasi/detail/publish/pencairan_dana.tsx
Normal file
196
src/app_modules/admin/donasi/detail/publish/pencairan_dana.tsx
Normal file
@@ -0,0 +1,196 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
AspectRatio,
|
||||
Button,
|
||||
Center,
|
||||
FileButton,
|
||||
Image,
|
||||
NumberInput,
|
||||
Paper,
|
||||
Stack,
|
||||
TextInput,
|
||||
Textarea,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
|
||||
import { useState } from "react";
|
||||
import { IconCamera } from "@tabler/icons-react";
|
||||
import ComponentDonasi_NotedBox from "@/app_modules/donasi/component/noted_box";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { AppRouterInstance } from "next/dist/shared/lib/app-router-context.shared-runtime";
|
||||
import { MODEL_DONASI_PENCAIRAN_DANA } from "@/app_modules/donasi/model/interface";
|
||||
import _ from "lodash";
|
||||
import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
|
||||
import { AdminDonasi_funCreatePencairanDana } from "../../fun/create/fun_create_pencairan_dana";
|
||||
import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
|
||||
import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
|
||||
import { AdminDonasi_AkumulasiPencairanById } from "../../fun/update/fun_update_akumulasi_pencairan";
|
||||
|
||||
export default function AdminDonasi_PencairanDana({
|
||||
donasiId,
|
||||
}: {
|
||||
donasiId: string;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [images, setImages] = useState<any | null>();
|
||||
const [value, setValue] = useState({
|
||||
title: "",
|
||||
deskripsi: "",
|
||||
nilai: "",
|
||||
});
|
||||
return (
|
||||
<>
|
||||
<Stack>
|
||||
<ComponentAdminDonasi_TombolKembali />
|
||||
<Center>
|
||||
<Paper
|
||||
p={"md"}
|
||||
w={{ base: 200, sm: 200, md: 300, lg: 400 }}
|
||||
withBorder
|
||||
>
|
||||
<Center mb={"lg"}>
|
||||
<Title order={5}>Form Pencairan Dana</Title>
|
||||
</Center>
|
||||
<Stack>
|
||||
<TextInput
|
||||
withAsterisk
|
||||
type="number"
|
||||
placeholder="Masukan jumlah nominal"
|
||||
label="Nominal"
|
||||
onChange={(val) => {
|
||||
setValue({
|
||||
...value,
|
||||
nilai: val.target.value,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
withAsterisk
|
||||
placeholder="Masukan judul"
|
||||
label="Judul"
|
||||
onChange={(val: any) => {
|
||||
setValue({
|
||||
...value,
|
||||
title: val.target.value,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<Textarea
|
||||
withAsterisk
|
||||
placeholder="Masukan deskripsi"
|
||||
label="Deskripsi"
|
||||
onChange={(val: any) => {
|
||||
setValue({
|
||||
...value,
|
||||
deskripsi: val.target.value,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
|
||||
<ComponentDonasi_NotedBox informasi="Wajib menyertakan bukti transfer" />
|
||||
<Stack>
|
||||
<Center>
|
||||
<FileButton
|
||||
onChange={async (files: any | null) => {
|
||||
try {
|
||||
const buffer = URL.createObjectURL(
|
||||
new Blob([new Uint8Array(await files.arrayBuffer())])
|
||||
);
|
||||
// console.log(buffer, "ini buffer");
|
||||
// console.log(files, " ini file");
|
||||
setImages(buffer);
|
||||
setFile(files);
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}}
|
||||
accept="image/png,image/jpeg"
|
||||
>
|
||||
{(props) => (
|
||||
<Button
|
||||
{...props}
|
||||
radius={"xl"}
|
||||
variant="outline"
|
||||
w={150}
|
||||
leftIcon={<IconCamera />}
|
||||
compact
|
||||
>
|
||||
Upload
|
||||
</Button>
|
||||
)}
|
||||
</FileButton>
|
||||
</Center>
|
||||
{images ? (
|
||||
<AspectRatio ratio={9 / 16}>
|
||||
<Paper radius={"md"} withBorder>
|
||||
<Image
|
||||
alt="Foto"
|
||||
src={images}
|
||||
/>
|
||||
</Paper>
|
||||
</AspectRatio>
|
||||
) : (
|
||||
""
|
||||
)}
|
||||
</Stack>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
mt={"lg"}
|
||||
onClick={
|
||||
() => onSave(router, value, donasiId, file as any)
|
||||
// console.log(value)
|
||||
}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Center>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
async function onSave(
|
||||
router: AppRouterInstance,
|
||||
value: any,
|
||||
donasiId: string,
|
||||
file: FormData
|
||||
) {
|
||||
const body = {
|
||||
donasiId: donasiId,
|
||||
nominalCair: value.nilai,
|
||||
title: value.title,
|
||||
deskripsi: value.deskripsi,
|
||||
};
|
||||
|
||||
// console.log(body);
|
||||
|
||||
if (_.values(body).includes("")) return NotifPeringatan("Lengkapi Data");
|
||||
if (!file) return NotifPeringatan("Lampirkan Bukti Transfer");
|
||||
|
||||
const gambar = new FormData();
|
||||
gambar.append("file", file as any);
|
||||
|
||||
await AdminDonasi_funCreatePencairanDana(body as any, gambar).then(
|
||||
async (res) => {
|
||||
if (res.status === 200) {
|
||||
await AdminDonasi_AkumulasiPencairanById(
|
||||
body.donasiId as any,
|
||||
body.nominalCair as any
|
||||
).then((res) => {
|
||||
if (res.status === 200) {
|
||||
NotifBerhasil(res.message);
|
||||
router.back();
|
||||
} else {
|
||||
NotifGagal(res.message);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
NotifGagal(res.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
191
src/app_modules/admin/donasi/detail/publish/proses_transaksi.tsx
Normal file
191
src/app_modules/admin/donasi/detail/publish/proses_transaksi.tsx
Normal file
@@ -0,0 +1,191 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
ActionIcon,
|
||||
AspectRatio,
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Group,
|
||||
HoverCard,
|
||||
Image,
|
||||
Modal,
|
||||
Paper,
|
||||
Stack,
|
||||
Table,
|
||||
Text,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import ComponentAdminDonasi_TombolKembali from "../../component/tombol_kembali";
|
||||
import { MODEL_DONASI_INVOICE } from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import moment from "moment";
|
||||
import { IconQuestionMark } from "@tabler/icons-react";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import { AdminDonasi_funUpdateStatusInvoice } from "../../fun/update/fun_update_status_invoice";
|
||||
import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
|
||||
import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
|
||||
import { AdminDonasi_getListStatusInvoiceProses } from "../../fun/get/get_list_status_invoice_proses";
|
||||
import { AdminDonasi_funUpdateProgresDanTerkumpul } from "../../fun/update/fun_update_progres_dan_terkumpul";
|
||||
import { useDisclosure } from "@mantine/hooks";
|
||||
import { RouterAdminDonasi_OLD } from "@/app/lib/router_hipmi/router_admin";
|
||||
|
||||
export default function AdminDonasi_ProsesTransaksi({
|
||||
listProses,
|
||||
}: {
|
||||
listProses: MODEL_DONASI_INVOICE[];
|
||||
}) {
|
||||
const [invoice, setInvoice] = useState<MODEL_DONASI_INVOICE[]>(listProses);
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
const [imageId, setImageId] = useState("");
|
||||
|
||||
async function onClick(invoice: MODEL_DONASI_INVOICE) {
|
||||
let nominal: number = +invoice.nominal;
|
||||
let terkumpulSementaras: number = +invoice.Donasi.terkumpul;
|
||||
const totalTerkumpul = terkumpulSementaras + nominal;
|
||||
|
||||
await AdminDonasi_funUpdateStatusInvoice(invoice.id, "1").then(
|
||||
async (res) => {
|
||||
if (res.status === 200) {
|
||||
NotifBerhasil(res.message);
|
||||
await AdminDonasi_funUpdateProgresDanTerkumpul(
|
||||
invoice.Donasi.id,
|
||||
totalTerkumpul
|
||||
).then(async (res) => {
|
||||
if (res.status === 200) {
|
||||
await AdminDonasi_getListStatusInvoiceProses(
|
||||
invoice.Donasi.id
|
||||
).then((res: any) => {
|
||||
setInvoice(res);
|
||||
});
|
||||
} else {
|
||||
NotifGagal(res.message);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
NotifGagal(res.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const rowTable = invoice.map((e) => (
|
||||
<tr key={e.id}>
|
||||
<td>{e.Author.username}</td>
|
||||
<td>
|
||||
<TampilanRupiahDonasi nominal={+e.nominal} />
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e.DonasiMaster_Bank.name}</Center>
|
||||
</td>
|
||||
<td>{`${moment(e.createdAt).format("ll")}`}</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
variant="outline"
|
||||
onClick={() => {
|
||||
open();
|
||||
setImageId(e.imagesId);
|
||||
}}
|
||||
>
|
||||
Lihat
|
||||
</Button>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Button
|
||||
radius={"xl"}
|
||||
variant="filled"
|
||||
color="green"
|
||||
onClick={() => onClick(e)}
|
||||
>
|
||||
Accept
|
||||
</Button>
|
||||
</Center>{" "}
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal opened={opened} onClose={close} centered>
|
||||
<ModalBuktiTransfer imageId={imageId} />
|
||||
</Modal>
|
||||
{/* <pre>{JSON.stringify(invoice, null, 2)}</pre> */}
|
||||
<Stack>
|
||||
<ComponentAdminDonasi_TombolKembali />
|
||||
<Stack>
|
||||
<HeaderPage />
|
||||
|
||||
<Paper p={"md"} withBorder>
|
||||
<Table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nama</th>
|
||||
<th>Nominal</th>
|
||||
<th>
|
||||
<Center>Metode Pembayaran</Center>
|
||||
</th>
|
||||
<th>Tanggal</th>
|
||||
<th>
|
||||
<Center>Bukti Transfer</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{rowTable}</tbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function HeaderPage() {
|
||||
return (
|
||||
<>
|
||||
<Group position="apart" px={"md"}>
|
||||
<Title order={5}>Update Status Donatur</Title>
|
||||
<Group position="left">
|
||||
<HoverCard width={280} shadow="md">
|
||||
<HoverCard.Target>
|
||||
<ActionIcon bg={"gray.3"} radius={"xl"}>
|
||||
<IconQuestionMark color="black" />
|
||||
</ActionIcon>
|
||||
</HoverCard.Target>
|
||||
<HoverCard.Dropdown>
|
||||
<Group spacing={4}>
|
||||
<Text fz="sm">Sebelum melakukan aksi</Text>
|
||||
<Text fz="sm" fw={"bold"} c={"green"}>
|
||||
ACCEPT
|
||||
</Text>
|
||||
<Text fz={"sm"}>
|
||||
Pastikan kembali transaksi donatur sesuai dengan mutasi pada
|
||||
Bank tertuju
|
||||
</Text>
|
||||
</Group>
|
||||
</HoverCard.Dropdown>
|
||||
</HoverCard>
|
||||
</Group>
|
||||
</Group>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ModalBuktiTransfer({ imageId }: { imageId: string }) {
|
||||
return (
|
||||
<>
|
||||
<AspectRatio ratio={9 / 16}>
|
||||
<Image
|
||||
alt="Foto"
|
||||
src={RouterAdminDonasi_OLD.api_gambar_bukti_transfer + `${imageId}`}
|
||||
/>
|
||||
</AspectRatio>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user