API Detail Publish Event Progresss

src/app/api/admin/investasi/[id]/transaksi/route.ts

@@ -0,0 +1,105 @@
+import backendLogger from "@/util/backendLogger";
+import _ from "lodash";
+import { NextResponse } from "next/server";
+
+export async function GET(request: Request, { params }: { params: { id: string } }) {
+    try {
+        let fixData
+        const { id } = params;
+        const { searchParams } = new URL(request.url);
+        const page = searchParams.get("page");
+        const status = searchParams.get("status");
+        const takeData = 10;
+        const skipData = Number(page) * takeData - takeData;
+
+        console.log("status >", status)
+
+        if (!page) {
+
+            fixData = await prisma.investasi_Invoice.findMany({
+                orderBy: [
+                    {
+                        createdAt: "desc",
+                    },
+                ],
+                where: {
+                    investasiId: id,
+                    isActive: true,
+                },
+                include: {
+                    Author: true,
+                    Images: true,
+                    StatusInvoice: true,
+                    MasterBank: true,
+                },
+            });
+
+        } else {
+            const data = await prisma.investasi_Invoice.findMany({
+                take: takeData,
+                skip: skipData,
+                orderBy: [
+                    {
+                        createdAt: "desc",
+                    },
+                ],
+                where: {
+                    investasiId: id,
+                    isActive: true,
+                    StatusInvoice: {
+                        name: {
+                            contains: status ? status : "",
+                            mode: "insensitive",
+
+                        }
+                    }
+
+                },
+                include: {
+                    Author: true,
+                    Images: true,
+                    StatusInvoice: true,
+                    MasterBank: true,
+                },
+            });
+
+            const nCount = await prisma.investasi_Invoice.count({
+                where: {
+                    investasiId: id,
+                    isActive: true,
+                    StatusInvoice: {
+                        name: {
+                            contains: status ? status : "",
+                            mode: "insensitive",
+
+                        }
+                    }
+
+                },
+            });
+
+            fixData = {
+                data: data,
+                nPage: _.ceil(nCount / takeData),
+            };
+
+        }
+
+        return NextResponse.json({
+            success: true,
+            message: "Success get status transaksi",
+            data: fixData
+        },
+            { status: 200 }
+        )
+    } catch (error) {
+        backendLogger.error("Eror get status transaksi", error);
+        return NextResponse.json({
+            success: false,
+            message: "Error get status transaksi",
+            reason: (error as Error).message
+        },
+            { status: 500 }
+        )
+    }
+}

src/app_modules/_global/lib/api_master.ts

@@ -1,4 +1,4 @@
-export { apiGetMasterBank, apiGetMasterBidangBisnis };
+export { apiGetMasterBank, apiGetMasterBidangBisnis, apiGetMasterStatusTransaksi };
 
 const apiGetMasterBank = async () => {
   const { token } = await fetch("/api/get-cookie").then((res) => res.json());
@@ -31,3 +31,20 @@ const apiGetMasterBidangBisnis = async () => {
 
   return await respone.json().catch(() => null);
 };
+
+const apiGetMasterStatusTransaksi = async () => {
+  const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+  if (!token) return await token.json().catch(() => null);
+
+  const response = await fetch(`/api/master/status_transaksi`, {
+      method: "GET",
+      headers: {
+          "Content-Type": "application/json",
+          Accept: "application/json",
+          "Access-Control-Allow-Origin": "*",
+          Authorization: `Bearer ${token}`,
+      }
+  })
+  
+  return await response.json().catch(() => null);
+}

src/app_modules/admin/investasi/_lib/api_fetch_admin_investasi.ts

@@ -2,6 +2,8 @@ export {
     apiGetAdminInvestasiCountDashboard,
     apiGetAdminInvestasiByStatus,
     apiGetAdminInvestasiById,
+    apiGetAdminAllTransaksiById,
+    apiGetAdminStatusTransaksi
     
 }
 const apiGetAdminInvestasiCountDashboard = async ({ name }:
@@ -69,6 +71,40 @@ const apiGetAdminInvestasiById = async ({id} : {id: string}) => {
     return await response.json().catch(() => null);
 }
 
-const apiGetAdminAllTransaksiById = async () => {
+const apiGetAdminAllTransaksiById = async ({id, page, status} : {id: string, page: string, status?: string}) => {
+    const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+    if (!token) return await token.json().catch(() => null);
+
+    const isStatus = status ? `&status=${status}` : "";
+
     
+    const isPage = page ? `?page=${page}` : "";
+    const response = await fetch(`/api/admin/investasi/${id}/transaksi${isPage}${isStatus}`, {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+            "Access-Control-Allow-Origin": "*",
+            Authorization: `Bearer ${token}`,
+        }
+    })
+
+    return await response.json().catch(() => null);
+}
+
+const apiGetAdminStatusTransaksi = async () => {
+    const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+    if (!token) return await token.json().catch(() => null);
+
+    const response = await fetch(`/api/master/status_transaksi`, {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+            "Access-Control-Allow-Origin": "*",
+            Authorization: `Bearer ${token}`,
+        }
+    })
+    
+    return await response.json().catch(() => null);
 }

src/app_modules/admin/investasi/_view/detail/view_daftar_transaksi.tsx

@@ -14,11 +14,12 @@ import {
   Select,
   Stack,
   Table,
+  Text,
   Title,
 } from "@mantine/core";
 import { IconReload } from "@tabler/icons-react";
 import { isEmpty } from "lodash";
-import { useRouter } from "next/navigation";
+import { useParams, useRouter } from "next/navigation";
 import { useState } from "react";
 import {
   AdminInvestasi_ComponentButtonBandingTransaksi,
@@ -27,142 +28,195 @@ import {
 } from "../../_component";
 import { adminInvestasi_funGetAllTransaksiById } from "../../fun";
 import { AdminColor } from "@/app_modules/_global/color/color_pallet";
+import { useShallowEffect } from "@mantine/hooks";
+import { apiGetAdminAllTransaksiById, apiGetAdminStatusTransaksi } from "../../_lib/api_fetch_admin_investasi";
+import { clientLogger } from "@/util/clientLogger";
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import { apiGetMasterStatusTransaksi } from "@/app_modules/_global/lib/api_master";
 
-export function AdminInvestasi_ViewDaftarTransaksi({
-  dataTransaksi,
-  statusTransaksi,
-  investasiId,
-}: {
-  dataTransaksi: any;
-  statusTransaksi: MODEL_STATUS_INVOICE_INVESTASI[];
-  investasiId: string;
-}) {
+export function AdminInvestasi_ViewDaftarTransaksi() {
+  const params = useParams<{ id: string }>();
+  const investasiId = params.id;
   const router = useRouter();
   const [isLoading, setLoading] = useState(false);
   const [idData, setIdData] = useState("");
-  const [listStatsus, setListStatus] = useState(statusTransaksi);
+  const [listStatus, setListStatus] = useState<MODEL_STATUS_INVOICE_INVESTASI[] | null>(null);
 
-  const [data, setData] = useState<MODEL_INVOICE_INVESTASI[]>(
-    dataTransaksi.data
-  );
-  const [isNPage, setNPage] = useState(dataTransaksi.nPage);
+  const [data, setData] = useState<MODEL_INVOICE_INVESTASI[] | null>(null);
+  const [isNPage, setNPage] = useState<number>(1);
   const [isActivePage, setActivePage] = useState(1);
   const [selectedStatus, setSelectedStatus] = useState("");
 
-  async function onPageClick(p: any) {
-    setActivePage(p);
-    const loadData = await adminInvestasi_funGetAllTransaksiById({
-      investasiId: investasiId,
-      page: p,
-    });
+  useShallowEffect(() => {
+    loadInitialData();
+  }, [isActivePage, selectedStatus])
+
+  useShallowEffect(() => {
+    loadStatus();
+  }, [])
+
+  const loadInitialData = async () => {
+    try {
+      const response = await apiGetAdminAllTransaksiById({
+        id: investasiId,
+        page: `${isNPage}`,
+        status: selectedStatus,
+      })
+
+      if (response?.success && response?.data?.data) {
+        setData(response.data.data);
+        setNPage(response.nPage || 1);
+        setListStatus(response.data.data);
+      } else {
+        console.error("Invalid data format received:", response);
+        setData([]);
+      }
+    } catch (error) {
+      clientLogger.error("Error get data daftar tramnsaksi", error);
+      setData([]);
+    }
+  }
+
+
+  const loadStatus = async () => {
+    try {
+      const response = await apiGetMasterStatusTransaksi()
+
+      if (response?.success && response?.data) {
+        setListStatus(response.data);
+        console.log("status", response.data)
+      } else {
+        console.error("Invalid data format received:", response);
+        setListStatus(null);
+      }
+    } catch (error) {
+      clientLogger.error("Error get status transaksi", error);
+      setListStatus(null);
+    }
+  }
+
+  const onPageClick = async (page: number) => {
+   const loadData = await apiGetAdminAllTransaksiById({
+     id: investasiId,
+     page: `${isNPage}`
+    })
+    setActivePage(page);
     setData(loadData.data as any);
     setNPage(loadData.nPage);
+    
   }
 
   async function onSelected(selectStatus: any) {
     setSelectedStatus(selectStatus);
-    const loadData = await adminInvestasi_funGetAllTransaksiById({
-      investasiId: investasiId,
-      page: isActivePage,
-      selectStatus: selectStatus,
-    });
-    setData(loadData.data as any);
-    setNPage(loadData.nPage);
+    // const loadData = await apiGetAdminStatusTransaksi();
+    // setData(loadData.data as any);
+    // setNPage(loadData.nPage);
   }
 
   async function onReload() {
-    const loadData = await adminInvestasi_funGetAllTransaksiById({
-      investasiId: investasiId,
-      page: 1,
+    const loadData = await apiGetAdminAllTransaksiById({
+      id: investasiId,
+      page: '1'
     });
     setData(loadData.data as any);
     setNPage(loadData.nPage);
   }
 
-  const tableRows = data?.map((e, i) => (
-    <tr key={i}>
-      <td>
-        <Center c={AdminColor.white}>{e?.Author.username}</Center>
-      </td>
-      <td>
-        <Center c={AdminColor.white}>{e?.MasterBank.namaBank}</Center>
-      </td>
-      <td>
-        <Center c={AdminColor.white}>
-          <ComponentAdminGlobal_TampilanRupiah nominal={+e?.nominal} />
-        </Center>
-      </td>
-      <td>
-        <Center c={AdminColor.white}>
-          {new Intl.NumberFormat("id-ID", { maximumFractionDigits: 10 }).format(
-            +e?.lembarTerbeli
-          )}
-        </Center>
-      </td>
-      <td>
-        <Center c={AdminColor.white}>
-          {new Intl.DateTimeFormat("id-ID", { dateStyle: "full" }).format(
-            e?.createdAt
-          )}
-        </Center>
-      </td>
-      <td>
-        <Center>
-          <Badge
-            w={150}
-            variant="light"
-            color={
-              e.statusInvoiceId === "1"
-                ? "green"
-                : e.statusInvoiceId === "4"
-                  ? "red"
-                  : "blue"
-            }
-          >
-            {e?.StatusInvoice?.name}
-          </Badge>
-        </Center>
-      </td>
-      <td>
-        <Center>
-          {e?.statusInvoiceId !== "3" ? (
-            <AdminInvestasi_ComponentCekBuktiTransfer imageId={e?.imageId} />
-          ) : (
-            "-"
-          )}
-        </Center>
-      </td>
-      <td>
-        <Center>
-          {e.statusInvoiceId === "1" && "-"}
-          {e.statusInvoiceId === "2" && (
-            <AdminInvestasi_ComponentButtonKonfirmasiTransaksi
-              invoiceId={e.id}
-              investasiId={investasiId}
-              lembarTerbeli={e.lembarTerbeli}
-              onLoadData={(val) => {
-                setData(val.data);
-                setNPage(val.nPage);
-              }}
-            />
-          )}
-          {e.statusInvoiceId === "3" && "-"}
-          {e.statusInvoiceId === "4" && (
-            <AdminInvestasi_ComponentButtonBandingTransaksi
-              
-              invoiceId={e.id}
-              investasiId={investasiId}
-              lembarTerbeli={e.lembarTerbeli}
-              onLoadData={(val) => {
-                setData(val.data);
-                setNPage(val.nPage);
-              }}
-            />
-          )}
-        </Center>
-      </td>
-    </tr>
-  ));
+  const renderTableBody = () => {
+    if (!Array.isArray(data) || data.length === 0) {
+      return (
+        <tr>
+          <td colSpan={12}>
+            <Center>
+              <Text color="gray">Tidak ada data</Text>
+            </Center>
+          </td>
+        </tr>
+      );
+    }
+    return data?.map((e, i) => (
+      <tr key={i}>
+        <td>
+          <Center c={AdminColor.white}>{e?.Author?.username}</Center>
+        </td>
+        <td>
+          <Center c={AdminColor.white}>{e?.MasterBank?.namaBank}</Center>
+        </td>
+        <td>
+          <Center c={AdminColor.white}>
+            <ComponentAdminGlobal_TampilanRupiah nominal={+e?.nominal} />
+          </Center>
+        </td>
+        <td>
+          <Center c={AdminColor.white}>
+            {new Intl.NumberFormat("id-ID", { maximumFractionDigits: 10 }).format(
+              +e?.lembarTerbeli
+            )}
+          </Center>
+        </td>
+        <td>
+          <Center c={AdminColor.white}>
+            {new Intl.DateTimeFormat("id-ID", { dateStyle: "full" }).format(new Date(e?.createdAt))}
+          </Center>
+        </td>
+        <td>
+          <Center>
+            <Badge
+              w={150}
+              variant="light"
+              color={
+                e.statusInvoiceId === "1"
+                  ? "green"
+                  : e.statusInvoiceId === "4"
+                    ? "red"
+                    : "blue"
+              }
+            >
+              {e?.StatusInvoice?.name}
+            </Badge>
+          </Center>
+        </td>
+        <td>
+          <Center>
+            {e?.statusInvoiceId !== "3" ? (
+              <AdminInvestasi_ComponentCekBuktiTransfer imageId={e?.imageId} />
+            ) : (
+              "-"
+            )}
+          </Center>
+        </td>
+        <td>
+          <Center>
+            {e.statusInvoiceId === "1" && "-"}
+            {e.statusInvoiceId === "2" && (
+              <AdminInvestasi_ComponentButtonKonfirmasiTransaksi
+                invoiceId={e.id}
+                investasiId={investasiId}
+                lembarTerbeli={e.lembarTerbeli}
+                onLoadData={(val) => {
+                  setData(val.data);
+                  setNPage(val.nPage);
+                }}
+              />
+            )}
+            {e.statusInvoiceId === "3" && "-"}
+            {e.statusInvoiceId === "4" && (
+              <AdminInvestasi_ComponentButtonBandingTransaksi
+
+                invoiceId={e.id}
+                investasiId={investasiId}
+                lembarTerbeli={e.lembarTerbeli}
+                onLoadData={(val) => {
+                  setData(val.data);
+                  setNPage(val.nPage);
+                }}
+              />
+            )}
+          </Center>
+        </td>
+      </tr>
+    ));
+  }
 
   return (
     <>
@@ -184,15 +238,12 @@ export function AdminInvestasi_ViewDaftarTransaksi({
             <Select
               placeholder="Pilih status"
               value={selectedStatus}
-              data={
-                isEmpty(listStatsus)
-                  ? []
-                  : listStatsus.map((e) => ({
-                      value: e.id,
-                      label: e.name,
-                    }))
-              }
+              data={listStatus?.map(status => ({
+                value: status.id,
+                label: status.name,
+              })) || []}
               onChange={(val: any) => {
+                console.log(val)
                 onSelected(val);
               }}
             />
@@ -234,57 +285,60 @@ export function AdminInvestasi_ViewDaftarTransaksi({
           </Group>
         </Group> */}
 
-        <Paper bg={AdminColor.softBlue} p={"md"} shadow="lg" h={"80vh"}>
-          <ScrollArea w={"100%"} h={"90%"}>
-            <Table
-              verticalSpacing={"xl"}
-              horizontalSpacing={"md"}
-              p={"md"}
-              w={1500}
-            >
-              <thead>
-                <tr>
-                  <th>
-                    <Center c={AdminColor.white}>Nama Investor</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Nama Bank</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Jumlah Investasi</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Lembar Terbeli</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Tanggal</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Status</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Bukti Transfer</Center>
-                  </th>
-                  <th>
-                    <Center c={AdminColor.white}>Aksi</Center>
-                  </th>
-                </tr>
-              </thead>
-              <tbody>{tableRows}</tbody>
-            </Table>
-          </ScrollArea>
+        {!data ? (<CustomSkeleton height={"80vh"} width={"100%"} />) : (
+          <Paper bg={AdminColor.softBlue} p={"md"} shadow="lg" h={"80vh"}>
+            <ScrollArea w={"100%"} h={"90%"}>
+              <Table
+                verticalSpacing={"xl"}
+                horizontalSpacing={"md"}
+                p={"md"}
+                w={1500}
+              >
+                <thead>
+                  <tr>
+                    <th>
+                      <Center c={AdminColor.white}>Nama Investor</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Nama Bank</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Jumlah Investasi</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Lembar Terbeli</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Tanggal</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Status</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Bukti Transfer</Center>
+                    </th>
+                    <th>
+                      <Center c={AdminColor.white}>Aksi</Center>
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>{renderTableBody()}</tbody>
+              </Table>
+            </ScrollArea>
 
-          <Center mt={"xl"}>
-            <Pagination
-              value={isActivePage}
-              total={isNPage}
-              onChange={(val) => {
-                onPageClick(val);
-              }}
-            />
-          </Center>
-        </Paper>
+            <Center mt={"xl"}>
+              <Pagination
+                value={isActivePage}
+                total={isNPage}
+                onChange={(val) => {
+                  onPageClick(val);
+                }}
+              />
+            </Center>
+          </Paper>
+        )}
       </Stack>
     </>
   );
 }
+

src/app_modules/admin/investasi/detail/detail_publish.tsx

@@ -88,9 +88,6 @@ export function AdminInvestasi_DetailPublish({
         ) : null}
         {selectPage == "2" ? (
           <AdminInvestasi_ViewDaftarTransaksi
-            dataTransaksi={dataTransaksi}
-            statusTransaksi={statusTransaksi}
-            investasiId={params.id}
           />
         ) : null}
       </Stack>