fix investasi pdf

This commit is contained in:
2025-03-04 11:00:33 +08:00
parent cabdb06732
commit 002b5d547b
5 changed files with 98 additions and 110 deletions

3
bun.lock Executable file → Normal file
View File

@@ -1,5 +1,5 @@
{ {
"lockfileVersion": 0, "lockfileVersion": 1,
"workspaces": { "workspaces": {
"": { "": {
"dependencies": { "dependencies": {
@@ -68,7 +68,6 @@
"react-dom": "18.2.0", "react-dom": "18.2.0",
"react-easy-infinite-scroll-hook": "^2.1.4", "react-easy-infinite-scroll-hook": "^2.1.4",
"react-fast-marquee": "^1.6.4", "react-fast-marquee": "^1.6.4",
"react-icons": "^5.0.1",
"react-iframe": "^1.8.5", "react-iframe": "^1.8.5",
"react-infinite-scroll-component": "^6.1.0", "react-infinite-scroll-component": "^6.1.0",
"react-international-phone": "^4.2.6", "react-international-phone": "^4.2.6",

View File

@@ -79,7 +79,6 @@
"react-dom": "18.2.0", "react-dom": "18.2.0",
"react-easy-infinite-scroll-hook": "^2.1.4", "react-easy-infinite-scroll-hook": "^2.1.4",
"react-fast-marquee": "^1.6.4", "react-fast-marquee": "^1.6.4",
"react-icons": "^5.0.1",
"react-iframe": "^1.8.5", "react-iframe": "^1.8.5",
"react-infinite-scroll-component": "^6.1.0", "react-infinite-scroll-component": "^6.1.0",
"react-international-phone": "^4.2.6", "react-international-phone": "^4.2.6",

View File

@@ -1,32 +1,23 @@
"use client"; "use client";
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import { import {
ComponentGlobal_AvatarAndUsername, ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardStyles, ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component"; } from "@/app_modules/_global/component";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { RouterEvent } from "@/lib/router_hipmi/router_event";
import { clientLogger } from "@/util/clientLogger";
import { import {
Box,
Button, Button,
Center,
Divider, Divider,
Flex,
Grid, Grid,
Image,
SimpleGrid, SimpleGrid,
Stack, Stack
Text,
Title,
} from "@mantine/core"; } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { IconBrandWhatsapp } from "@tabler/icons-react";
import React, { useState } from "react";
import { TfiFacebook } from "react-icons/tfi";
import { apiGetOneSponsorEventById } from "../../_lib/api_event";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { clientLogger } from "@/util/clientLogger"; import { useState } from "react";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import { apiGetOneSponsorEventById } from "../../_lib/api_event";
import { IEventSponsor } from "../../_lib/interface"; import { IEventSponsor } from "../../_lib/interface";
import { RouterEvent } from "@/lib/router_hipmi/router_event";
function DetailSponsor_Event({ userLoginId }: { userLoginId: string }) { function DetailSponsor_Event({ userLoginId }: { userLoginId: string }) {
const params = useParams<{ id: string }>(); const params = useParams<{ id: string }>();

View File

@@ -1,66 +1,64 @@
"use client"; "use client";
import { useEffect, useState } from "react"; import { Image, Skeleton, Stack } from "@mantine/core";
import { getDocument, GlobalWorkerOptions } from "pdfjs-dist"; import { useState } from "react";
import { Image, Skeleton, Stack, Text } from "@mantine/core";
import { RouterInvestasi_OLD } from "@/lib/router_hipmi/router_investasi";
GlobalWorkerOptions.workerSrc = // GlobalWorkerOptions.workerSrc =
"https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.6.82/pdf.worker.min.mjs"; // "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.6.82/pdf.worker.min.mjs";
const PdfToImage = ({ id, path }: { id: string; path: string }) => { const PdfToImage = ({ id, path }: { id: string; path: string }) => {
const [images, setImages] = useState<string[]>([]); const [images, setImages] = useState<string[]>([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
useEffect(() => { // useEffect(() => {
if (typeof window !== "undefined") { // if (typeof window !== "undefined") {
const renderPages = async () => { // const renderPages = async () => {
try { // try {
const loadingTask = getDocument(path + id); // Menggunakan md sebagai URL PDF // const loadingTask = getDocument(path + id); // Menggunakan md sebagai URL PDF
const pdf = await loadingTask.promise; // const pdf = await loadingTask.promise;
const numPages = pdf.numPages; // const numPages = pdf.numPages;
const imagePromises: Promise<string>[] = []; // const imagePromises: Promise<string>[] = [];
for (let pageNum = 1; pageNum <= numPages; pageNum++) { // for (let pageNum = 1; pageNum <= numPages; pageNum++) {
const renderPage = async (pageNum: number): Promise<string> => { // const renderPage = async (pageNum: number): Promise<string> => {
const page = await pdf.getPage(pageNum); // const page = await pdf.getPage(pageNum);
const viewport = page.getViewport({ scale: 2.0 }); // const viewport = page.getViewport({ scale: 2.0 });
// Buat elemen canvas // // Buat elemen canvas
const canvas = document.createElement("canvas"); // const canvas = document.createElement("canvas");
const context = canvas.getContext("2d"); // const context = canvas.getContext("2d");
if (context) { // if (context) {
canvas.width = viewport.width; // canvas.width = viewport.width;
canvas.height = viewport.height; // canvas.height = viewport.height;
// Render halaman PDF ke dalam canvas // // Render halaman PDF ke dalam canvas
const renderContext = { // const renderContext = {
canvasContext: context, // canvasContext: context,
viewport: viewport, // viewport: viewport,
}; // };
await page.render(renderContext).promise; // await page.render(renderContext).promise;
// Konversi canvas ke gambar (data URL) // // Konversi canvas ke gambar (data URL)
return canvas.toDataURL("image/png"); // return canvas.toDataURL("image/png");
} // }
return ""; // return "";
}; // };
imagePromises.push(renderPage(pageNum)); // imagePromises.push(renderPage(pageNum));
} // }
const imageSrcs = await Promise.all(imagePromises); // const imageSrcs = await Promise.all(imagePromises);
setImages(imageSrcs); // setImages(imageSrcs);
} catch (error) { // } catch (error) {
console.error("Error rendering PDF to images:", error); // console.error("Error rendering PDF to images:", error);
} finally { // } finally {
setLoading(false); // setLoading(false);
} // }
}; // };
renderPages(); // renderPages();
} // }
}, [id, path]); // }, [id, path]);
return ( return (
<Stack> <Stack>

View File

@@ -1,8 +1,23 @@
import { Investasi_ViewCreateBerita } from "./create/view_create_berita";
import { Investasi_ViewCreateDocument } from "./create/view_create_document";
import Investasi_ViewDetailDraft from "./detail/portofolio/view_detail_draft";
import Investasi_ViewDetailPublish from "./detail/portofolio/view_detail_publish";
import Investasi_ViewDetailReject from "./detail/portofolio/view_detail_reject";
import Investasi_ViewDetailReview from "./detail/portofolio/view_detail_review";
import { Investasi_ViewDetailBerita } from "./detail/view_berita";
import { Investasi_ViewDaftarBerita } from "./detail/view_daftar_berita";
import { Investasi_ViewDaftarDokumen } from "./detail/view_daftar_dokemen";
import { Investasi_ViewDetailMain } from "./detail/view_detail_main";
import { Investasi_ViewDetailProspektus } from "./detail/view_detail_prospektusl";
import { Investasi_ViewDetailSahamSaya } from "./detail/view_detail_saham_saya"; import { Investasi_ViewDetailSahamSaya } from "./detail/view_detail_saham_saya";
import { Investasi_ViewRekapBerita } from "./detail/view_rekap_berita";
import { Investasi_ViewRekapDokumen } from "./detail/view_rekap_dokumen";
import { Investasi_ViewEditDokumen } from "./edit/view_edit_dokumen";
import { Investasi_ViewEditInvestasi } from "./edit/view_edit_investasi";
import { Investasi_ViewEditProspektus } from "./edit/view_edit_prospektus";
import PdfToImage from "./file_view/view_file_viewer"; import PdfToImage from "./file_view/view_file_viewer";
import { Investasi_ViewBeranda } from "./main/view_beranda"; import { Investasi_ViewBeranda } from "./main/view_beranda";
import { Investasi_ViewPortofolio } from "./main/view_portofolio"; import { Investasi_ViewPortofolio } from "./main/view_portofolio";
import { Investasi_ViewPortofolioReview } from "./main/portofolio/view_portofolio_review";
import { Investasi_ViewSahamSaya } from "./main/view_saham_saya"; import { Investasi_ViewSahamSaya } from "./main/view_saham_saya";
import { Investasi_ViewTransaksiBerhasil } from "./status_transaksi/view_invoice_berhasil"; import { Investasi_ViewTransaksiBerhasil } from "./status_transaksi/view_invoice_berhasil";
import { Investasi_ViewTransaksiGagal } from "./status_transaksi/view_transaksi_gagal"; import { Investasi_ViewTransaksiGagal } from "./status_transaksi/view_transaksi_gagal";
@@ -10,47 +25,33 @@ import { Investasi_ViewInvoice } from "./transaksi/view_invoice";
import { Investasi_ViewMetodePembayaran } from "./transaksi/view_metode_pembayaran"; import { Investasi_ViewMetodePembayaran } from "./transaksi/view_metode_pembayaran";
import { Investasi_ViewProsesPembelian } from "./transaksi/view_proses_pembelian"; import { Investasi_ViewProsesPembelian } from "./transaksi/view_proses_pembelian";
import { Investasi_ViewProsesTransaksi } from "./transaksi/view_proses_transaksi"; import { Investasi_ViewProsesTransaksi } from "./transaksi/view_proses_transaksi";
import Investasi_ViewDetailPublish from "./detail/portofolio/view_detail_publish";
import Investasi_ViewDetailReview from "./detail/portofolio/view_detail_review";
import Investasi_ViewDetailDraft from "./detail/portofolio/view_detail_draft";
import Investasi_ViewDetailReject from "./detail/portofolio/view_detail_reject";
import { Investasi_ViewDetailProspektus } from "./detail/view_detail_prospektusl";
import { Investasi_ViewDaftarDokumen } from "./detail/view_daftar_dokemen";
import { Investasi_ViewEditDokumen } from "./edit/view_edit_dokumen";
import { Investasi_ViewEditInvestasi } from "./edit/view_edit_investasi";
import { Investasi_ViewEditProspektus } from "./edit/view_edit_prospektus";
import { Investasi_ViewCreateDocument } from "./create/view_create_document";
import { Investasi_ViewRekapDokumen } from "./detail/view_rekap_dokumen";
import { Investasi_ViewDetailMain } from "./detail/view_detail_main";
import { Investasi_ViewRekapBerita } from "./detail/view_rekap_berita";
import { Investasi_ViewDaftarBerita } from "./detail/view_daftar_berita";
import { Investasi_ViewCreateBerita } from "./create/view_create_berita";
import { Investasi_ViewDetailBerita } from "./detail/view_berita";
export { Investasi_ViewProsesPembelian }; export {
export { Investasi_ViewMetodePembayaran }; Investasi_ViewBeranda,
export { Investasi_ViewInvoice }; Investasi_ViewCreateBerita,
export { Investasi_ViewProsesTransaksi }; Investasi_ViewCreateDocument,
export { Investasi_ViewBeranda }; Investasi_ViewDaftarBerita,
export { Investasi_ViewTransaksiGagal }; Investasi_ViewDaftarDokumen,
export { Investasi_ViewTransaksiBerhasil }; Investasi_ViewDetailBerita,
export { PdfToImage as Investasi_ViewFileViewer }; Investasi_ViewDetailDraft,
export { Investasi_ViewSahamSaya }; Investasi_ViewDetailMain,
export { Investasi_ViewDetailSahamSaya }; Investasi_ViewDetailProspektus,
export { Investasi_ViewPortofolio }; Investasi_ViewDetailPublish,
export { Investasi_ViewDetailPublish }; Investasi_ViewDetailReject,
export { Investasi_ViewDetailReview }; Investasi_ViewDetailReview,
export { Investasi_ViewDetailDraft }; Investasi_ViewDetailSahamSaya,
export { Investasi_ViewDetailReject }; Investasi_ViewEditDokumen,
export { Investasi_ViewDetailProspektus }; Investasi_ViewEditInvestasi,
export { Investasi_ViewDaftarDokumen }; Investasi_ViewEditProspektus,
export { Investasi_ViewEditDokumen }; PdfToImage as Investasi_ViewFileViewer,
export { Investasi_ViewEditInvestasi }; Investasi_ViewInvoice,
export { Investasi_ViewEditProspektus }; Investasi_ViewMetodePembayaran,
export { Investasi_ViewCreateDocument }; Investasi_ViewPortofolio,
export { Investasi_ViewRekapDokumen }; Investasi_ViewProsesPembelian,
export { Investasi_ViewDetailMain }; Investasi_ViewProsesTransaksi,
export { Investasi_ViewRekapBerita }; Investasi_ViewRekapBerita,
export { Investasi_ViewDaftarBerita }; Investasi_ViewRekapDokumen,
export { Investasi_ViewCreateBerita }; Investasi_ViewSahamSaya,
export { Investasi_ViewDetailBerita }; Investasi_ViewTransaksiBerhasil,
Investasi_ViewTransaksiGagal,
};