Update Versi 1.5.27 #32

Merged
bagasbanuna merged 1009 commits from staging into main 2025-12-17 12:22:28 +08:00
516 changed files with 20452 additions and 6086 deletions
Showing only changes of commit 138c460ab9 - Show all commits

View File

@@ -23,6 +23,7 @@ export async function GET(request: Request, context: { params: { id: string } })
catatan: true,
sisaLembar: true,
imageId: true,
prospektusFileId: true,
masterPencarianInvestorId: true,
masterPeriodeDevidenId: true,
masterPembagianDevidenId: true,

View File

@@ -1,38 +1,8 @@
import { investasi_funGetOneInvestasiById } from "@/app_modules/investasi/_fun";
import { Investasi_UiEditInvestasi, Investasi_UiEditInvestasiNew } from "@/app_modules/investasi/_ui";
import getPembagianDeviden from "@/app_modules/investasi/fun/master/get_pembagian_deviden";
import getPencarianInvestor from "@/app_modules/investasi/fun/master/get_pencarian_investor";
import getPeriodeDeviden from "@/app_modules/investasi/fun/master/get_periode_deviden";
import _ from "lodash";
export default async function Page({ params }: { params: { id: string } }) {
// const investasiId = params.id;
// const allData = await investasi_funGetOneInvestasiById({ investasiId });
// const dataInvestasi = _.omit(allData, [
// "BeritaInvestasi",
// "DokumenInvestasi",
// "MasterPembagianDeviden",
// "MasterPencarianInvestor",
// "MasterProgresInvestasi",
// "MasterStatusInvestasi",
// "ProspektusInvestasi",
// "MasterPeriodeDeviden",
// "author",
// ]);
// const listPencarian = await getPencarianInvestor();
// const listPeriode = await getPeriodeDeviden();
// const listPembagian = await getPembagianDeviden();
import { Investasi_UiEditInvestasiNew } from "@/app_modules/investasi/_ui";
export default async function Page() {
return (
<>
{/* <Investasi_UiEditInvestasi
dataInvestasi={dataInvestasi}
pembagianDeviden={listPembagian}
pencarianInvestor={listPencarian}
periodeDeviden={listPeriode}
/> */}
<Investasi_UiEditInvestasiNew />
</>
);

View File

@@ -1,11 +1,10 @@
import { Investasi_UiEditProspektus } from "@/app_modules/investasi/_ui";
export default async function Page({ params }: { params: { id: string } }) {
const investasiId = params.id;
export default async function Page() {
return (
<>
<Investasi_UiEditProspektus investasiId={investasiId} />
<Investasi_UiEditProspektus />
</>
);
}

View File

@@ -1,21 +0,0 @@
import { LayoutEditProspektusInvestasi } from "@/app_modules/investasi";
import getOneInvestasiById from "@/app_modules/investasi/fun/get_one_investasi_by_id";
import React from "react";
export default async function Layout({
children,
params,
}: {
children: React.ReactNode;
params: { id: string };
}) {
const dataInvestasi = await getOneInvestasiById(params.id);
return (
<>
<LayoutEditProspektusInvestasi dataInvestasi={dataInvestasi as any}>
{children}
</LayoutEditProspektusInvestasi>
</>
);
}

View File

@@ -1,12 +0,0 @@
import { EditProspektusInvestasi } from "@/app_modules/investasi";
import getOneInvestasiById from "@/app_modules/investasi/fun/get_one_investasi_by_id";
export default async function Page({ params }: { params: { id: string } }) {
const dataInvestasi = await getOneInvestasiById(params.id);
// console.log(dataInvestasi);
return (
<>
<EditProspektusInvestasi dataInvestasi={dataInvestasi as any} />
</>
);
}

View File

@@ -10,9 +10,15 @@ import { ComponentGlobal_NotifikasiPeringatan } from "../notif_global";
export function ComponentGlobal_ButtonUploadFileImage({
onSetFile,
onSetImage,
text,
icon,
accept,
}: {
onSetFile: File | null | any;
onSetImage: any | null;
onSetImage?: any | null;
text?: string;
icon?: string | any
accept?: string;
}) {
const [isLoading, setIsLoading] = useState(false);
@@ -28,6 +34,7 @@ export function ComponentGlobal_ButtonUploadFileImage({
if (files.size > 100 * 1024 * 1024) {
setIsLoading(false);
ComponentGlobal_NotifikasiPeringatan("File terlalu besar");
return
}
onSetFile(files);
@@ -38,7 +45,7 @@ export function ComponentGlobal_ButtonUploadFileImage({
setIsLoading(false);
}
}}
accept="image/png,image/png,image/jpeg,image/gif"
accept={accept ? accept : "image/png,image/png,image/jpeg,image/gif"}
>
{(props) => (
<Button
@@ -50,10 +57,10 @@ export function ComponentGlobal_ButtonUploadFileImage({
backgroundColor: MainColor.yellow,
border: `1px solid ${AccentColor.yellow}`,
}}
leftIcon={<IconUpload color="black" size={20} />}
leftIcon={icon ? icon : <IconUpload color="black" size={20} />}
c={MainColor.darkblue}
>
Upload
{text ? text : "Upload"}
</Button>
)}
</FileButton>

View File

@@ -42,7 +42,13 @@ export default function ComponentGlobal_BoxInformation({
<IconInfoCircle color={MainColor.white} />
</Grid.Col>
<Grid.Col span={10}>
<Text span inherit c={MainColor.white} fw={"normal"}>
<Text
fz={fonsize ? fonsize : 12}
span
inherit
c={MainColor.white}
fw={"normal"}
>
{informasi}
</Text>
</Grid.Col>

View File

@@ -65,6 +65,7 @@ export function Investasi_ComponentButtonCreateNewInvestasi({
dirId: DIRECTORY_ID.investasi_prospektus,
});
if (!uploadFilePdf.success) {
setIsLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal upload file pdf");
return;
}
@@ -104,17 +105,16 @@ export function Investasi_ComponentButtonCreateNewInvestasi({
router.push(NEW_RouterInvestasi.portofolio({ id: "2" }));
setActiveTab("Review");
setHotMenu(1);
setIsLoading(true);
ComponentGlobal_NotifikasiBerhasil(res.message);
}
} else {
setIsLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
}
} catch (error) {
clientLogger.error("Error create new investasi", error);
} finally {
setIsLoading(false);
}
clientLogger.error("Error create new investasi", error);
}
}
return (

View File

@@ -6,11 +6,15 @@ import {
ComponentGlobal_NotifikasiPeringatan,
} from "@/app_modules/_global/notif_global";
import { DIRECTORY_ID } from "@/app/lib";
import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
import {
funGlobal_DeleteFileById,
funGlobal_UploadToStorage,
} from "@/app_modules/_global/fun";
import _ from "lodash";
import { investasi_funUpdateInvestasi } from "../../_fun";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { clientLogger } from "@/util/clientLogger";
export function Investasi_ComponentButtonUpdateDataInvestasi({
data,
@@ -37,11 +41,21 @@ export function Investasi_ComponentButtonUpdateDataInvestasi({
file: file as any,
dirId: DIRECTORY_ID.investasi_image,
});
if (!uploadImage.success) {
setIsLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload file gambar");
}
const deleteFile = await funGlobal_DeleteFileById({
fileId: data.imageId,
});
if (!deleteFile.success) {
setIsLoading(false);
clientLogger.error("Error delete file:", deleteFile.message);
}
const updtWithImage = await investasi_funUpdateInvestasi({
data: data,
imageId: uploadImage.data.id,

View File

@@ -0,0 +1,35 @@
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { Box, Center, Stack } from "@mantine/core";
export { Investasi_SkeletonEditProspektus };
function Investasi_SkeletonEditProspektus() {
return (
<>
<Stack>
<CustomSkeleton h={70} radius={"md"} />
<CustomSkeleton h={70} radius={"md"} />
<Center>
<CustomSkeleton h={40} w={100} radius={"xl"} />
</Center>
<Box
style={{
display: "flex",
justifyContent: "center",
}}
>
<Box
style={{
transition: "all 0.3s ease",
position: "absolute",
bottom: 20,
width: "90%",
}}
>
<CustomSkeleton h={40} width={"100%"} radius={"xl"} />
</Box>
</Box>
</Stack>
</>
);
}

View File

@@ -1,6 +1,6 @@
"use client";
import { UIGlobal_LayoutHeaderTamplate, UIGlobal_LayoutTamplate, } from "@/app_modules/_global/ui";
import { Investasi_ViewEditInvestasiNew } from "../../_view/edit/vew_edit_investasi_new";
import { Investasi_ViewEditInvestasiNew } from "../../_view/edit/view_edit_investasi_new";
export function Investasi_UiEditInvestasiNew() {
return (

View File

@@ -6,17 +6,13 @@ import {
} from "@/app_modules/_global/ui";
import { Investasi_ViewEditProspektus } from "../../_view";
export function Investasi_UiEditProspektus({
investasiId,
}: {
investasiId: string;
}) {
export function Investasi_UiEditProspektus() {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Edit Prospektus" />}
>
<Investasi_ViewEditProspektus investasiId={investasiId} />
<Investasi_ViewEditProspektus />
</UIGlobal_LayoutTamplate>
</>
);

View File

@@ -1,420 +0,0 @@
import { MainColor } from "@/app_modules/_global/color";
import { ComponentGlobal_BoxInformation, ComponentGlobal_BoxUploadImage, ComponentGlobal_LoadImage, } from "@/app_modules/_global/component";
import { AspectRatio, Box, Button, FileButton, Group, Image, Select, Stack, Text, TextInput, } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconCamera } from "@tabler/icons-react";
import _ from "lodash";
import { useState } from "react";
import { Investasi_ComponentButtonUpdateDataInvestasi } from "../../_component";
import { apiGetMasterInvestasi, apiGetOneInvestasiById } from "../../_lib/api_interface";
import { IDataInvestasi } from "../../_lib/type_investasi";
import { useParams } from "next/navigation";
import SkeletonEditInvestasi from "./skeleton_edit_investasi";
export function Investasi_ViewEditInvestasiNew() {
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
const [loadingMasterInvestor, setLoadingMasterInvestor] = useState(true)
const [loadingMasterPeriodeDeviden, setLoadingMasterPeriodeDeviden] = useState(true)
const [loadingMasterPembagianDeviden, setLoadingMasterPembagianDeviden] = useState(true)
const [periodeDeviden, setPeriodeDeviden] = useState<any[]>([]);
const [pembagianDeviden, setPembagianDeviden] = useState<any[]>([]);
const [pencarianInvestor, setPencarianInvestor] = useState<any[]>([]);
const [data, setData] = useState<IDataInvestasi>();
const [file, setFile] = useState<File | null>(null);
const [img, setImg] = useState<any | null>();
const [target, setTarget] = useState("");
const [harga, setHarga] = useState("");
const [totalLembar, setTotalLembar] = useState<any>("");
async function onGetOneInvestasiById() {
try {
setLoading(true)
const response = await apiGetOneInvestasiById(param.id)
if (response.success) {
setData(response.data)
setTotalLembar(response.data.totalLembar)
}
} catch (error) {
console.error(error)
} finally {
setLoading(false)
}
}
async function onGetMasterInvestor() {
try {
setLoadingMasterInvestor(true)
const response = await apiGetMasterInvestasi("?cat=pencarian-investor")
if (response.success) {
setPencarianInvestor(response.data)
}
} catch (error) {
console.log(error)
} finally {
setLoadingMasterInvestor(false)
}
}
async function onGetMasterPeriodeDeviden() {
try {
setLoadingMasterPeriodeDeviden(true)
const response = await apiGetMasterInvestasi("?cat=periode-deviden")
if (response.success) {
setPeriodeDeviden(response.data)
}
} catch (error) {
console.log(error)
} finally {
setLoadingMasterPeriodeDeviden(false)
}
}
async function onGetMasterPembagianDeviden() {
try {
setLoadingMasterPembagianDeviden(true)
const response = await apiGetMasterInvestasi("?cat=pembagian-deviden")
if (response.success) {
setPembagianDeviden(response.data)
}
} catch (error) {
console.log(error)
} finally {
setLoadingMasterPembagianDeviden(false)
}
}
useShallowEffect(() => {
onGetOneInvestasiById()
onGetMasterInvestor()
onGetMasterPeriodeDeviden()
onGetMasterPembagianDeviden()
}, [])
async function onTotalLembar({ target, harga, }: { target?: number | any; harga?: number | any; }) {
if (target !== 0 && harga !== 0) {
const hasil: any = target / harga;
const result = _.floor(hasil === Infinity ? 0 : hasil);
setTotalLembar(result.toString());
}
}
return (
<>
<Stack px={"sm"}>
{
loading ?
<SkeletonEditInvestasi />
:
<>
<Stack spacing={0}>
<Box mb={"sm"}>
<ComponentGlobal_BoxInformation informasi="Gambar investasi bisa berupa ilustrasi, poster atau foto terkait investasi" />
</Box>
<ComponentGlobal_BoxUploadImage>
{img ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image style={{ maxHeight: 250 }} alt="Avatar" src={img} />
</AspectRatio>
) : (
<ComponentGlobal_LoadImage maw={300} fileId={String(data?.imageId)} />
)}
</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>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
}
}}
withAsterisk
label="Judul Investasi"
placeholder="Judul investasi"
maxLength={100}
value={data?.title}
onChange={(val) => {
setData({
...data as any,
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="Dana Dibutuhkan"
placeholder="0"
value={target ? target : data?.targetDana}
onChange={(val) => {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "") return setTarget(0 + "");
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const targetNilai = Intl.NumberFormat("id-ID").format(+nilai);
onTotalLembar({
target: +nilai,
harga: +Number(data?.hargaLembar),
});
setTarget(targetNilai);
setData({
...data as any,
targetDana: nilai as string,
});
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
}
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Harga Per Lembar"
placeholder="0"
value={harga ? harga : data?.hargaLembar}
onChange={(val) => {
try {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "") return setHarga(0 + "");
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const targetNilai = Intl.NumberFormat("id-ID").format(+nilai);
onTotalLembar({
harga: +nilai,
target: +Number(data?.targetDana),
});
setHarga(targetNilai);
setData({
...data as any,
hargaLembar: nilai as string,
});
} catch (error) {
console.log(error);
}
}}
/>
<TextInput
description="*Total lembar dihitung dari, Target Dana / Harga Perlembar"
label="Total Lembar"
value={harga === "0" ? "0" : target === "0" ? "0" : totalLembar}
readOnly
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
}
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
}
}}
rightSection={
<Text fw={"bold"} c={"gray"}>
%
</Text>
}
withAsterisk
type="number"
label={"Rasio Keuntungan / ROI %"}
placeholder="Masukan rasio keuntungan"
value={data?.roi}
onChange={(val) => {
setData({
...data as any,
roi: val.target.value,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
},
dropdown: {
backgroundColor: MainColor.white,
}
}}
withAsterisk
label="Pencarian Investor"
placeholder={loadingMasterInvestor ? "Loading..." : "Pilih batas waktu"}
data={pencarianInvestor.map((e) => ({
value: e.id,
label: e.name + " " + "hari",
}))}
value={data?.masterPencarianInvestorId}
onChange={(val) => {
setData({
...(data as any),
masterPencarianInvestorId: val,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
},
dropdown: {
backgroundColor: MainColor.white,
}
}}
withAsterisk
label="Periode Deviden"
placeholder={loadingMasterPeriodeDeviden ? "Loading..." : "Pilih batas waktu"}
data={periodeDeviden.map((e) => ({ value: e.id, label: e.name }))}
value={data?.masterPeriodeDevidenId}
onChange={(val) => {
setData({
...(data as any),
masterPeriodeDevidenId: val,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white
},
required: {
color: MainColor.red
},
dropdown: {
backgroundColor: MainColor.white,
}
}}
withAsterisk
label="Pembagian Deviden"
placeholder={loadingMasterPembagianDeviden ? "Loading..." : "Pilih batas waktu"}
data={pembagianDeviden.map((e) => ({
value: e.id,
label: e.name + " " + "bulan",
}))}
value={data?.masterPembagianDevidenId}
onChange={(val) => {
setData({
...(data as any),
masterPembagianDevidenId: val,
});
}}
/>
<Investasi_ComponentButtonUpdateDataInvestasi
data={data as any}
file={file as any}
totalLembar={totalLembar}
/>
</>
}
</Stack>
</>
);
}

View File

@@ -0,0 +1,462 @@
import { MainColor } from "@/app_modules/_global/color";
import {
ComponentGlobal_BoxInformation,
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_LoadImage,
} from "@/app_modules/_global/component";
import {
AspectRatio,
Box,
Button,
Center,
FileButton,
Group,
Image,
Select,
Stack,
Text,
TextInput,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconCamera } from "@tabler/icons-react";
import _ from "lodash";
import { useState } from "react";
import { Investasi_ComponentButtonUpdateDataInvestasi } from "../../_component";
import {
apiGetMasterInvestasi,
apiGetOneInvestasiById,
} from "../../_lib/api_interface";
import { IDataInvestasi } from "../../_lib/type_investasi";
import { useParams } from "next/navigation";
import SkeletonEditInvestasi from "./skeleton_edit_investasi";
export function Investasi_ViewEditInvestasiNew() {
const param = useParams<{ id: string }>();
const [loading, setLoading] = useState(true);
const [loadingMasterInvestor, setLoadingMasterInvestor] = useState(true);
const [loadingMasterPeriodeDeviden, setLoadingMasterPeriodeDeviden] =
useState(true);
const [loadingMasterPembagianDeviden, setLoadingMasterPembagianDeviden] =
useState(true);
const [periodeDeviden, setPeriodeDeviden] = useState<any[]>([]);
const [pembagianDeviden, setPembagianDeviden] = useState<any[]>([]);
const [pencarianInvestor, setPencarianInvestor] = useState<any[]>([]);
const [data, setData] = useState<IDataInvestasi>();
const [file, setFile] = useState<File | null>(null);
const [img, setImg] = useState<any | null>();
const [target, setTarget] = useState("");
const [harga, setHarga] = useState("");
const [totalLembar, setTotalLembar] = useState<any>("");
async function onGetOneInvestasiById() {
try {
setLoading(true);
const response = await apiGetOneInvestasiById(param.id);
if (response.success) {
setData(response.data);
setTotalLembar(response.data.totalLembar);
}
} catch (error) {
console.error(error);
} finally {
setLoading(false);
}
}
async function onGetMasterInvestor() {
try {
setLoadingMasterInvestor(true);
const response = await apiGetMasterInvestasi("?cat=pencarian-investor");
if (response.success) {
setPencarianInvestor(response.data);
}
} catch (error) {
console.log(error);
} finally {
setLoadingMasterInvestor(false);
}
}
async function onGetMasterPeriodeDeviden() {
try {
setLoadingMasterPeriodeDeviden(true);
const response = await apiGetMasterInvestasi("?cat=periode-deviden");
if (response.success) {
setPeriodeDeviden(response.data);
}
} catch (error) {
console.log(error);
} finally {
setLoadingMasterPeriodeDeviden(false);
}
}
async function onGetMasterPembagianDeviden() {
try {
setLoadingMasterPembagianDeviden(true);
const response = await apiGetMasterInvestasi("?cat=pembagian-deviden");
if (response.success) {
setPembagianDeviden(response.data);
}
} catch (error) {
console.log(error);
} finally {
setLoadingMasterPembagianDeviden(false);
}
}
useShallowEffect(() => {
onGetOneInvestasiById();
onGetMasterInvestor();
onGetMasterPeriodeDeviden();
onGetMasterPembagianDeviden();
}, []);
async function onTotalLembar({
target,
harga,
}: {
target?: number | any;
harga?: number | any;
}) {
if (target !== 0 && harga !== 0) {
const hasil: any = target / harga;
const result = _.floor(hasil === Infinity ? 0 : hasil);
setTotalLembar(result.toString());
}
}
return (
<>
<Stack px={"sm"}>
{loading ? (
<SkeletonEditInvestasi />
) : (
<>
<Stack spacing={0}>
<Box mb={"sm"}>
<ComponentGlobal_BoxInformation informasi="Gambar investasi bisa berupa ilustrasi, poster atau foto terkait investasi" />
</Box>
<ComponentGlobal_BoxUploadImage>
{img ? (
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image style={{ maxHeight: 250 }} alt="Avatar" src={img} />
</AspectRatio>
) : (
<ComponentGlobal_LoadImage
maw={300}
fileId={String(data?.imageId)}
/>
)}
</ComponentGlobal_BoxUploadImage>
{/* Upload Foto */}
<Center>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFile}
onSetImage={setImg}
/>
</Center>
{/* <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>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
withAsterisk
label="Judul Investasi"
placeholder="Judul investasi"
maxLength={100}
value={data?.title}
onChange={(val) => {
setData({
...(data as any),
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="Dana Dibutuhkan"
placeholder="0"
value={target ? target : data?.targetDana}
onChange={(val) => {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "") return setTarget(0 + "");
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const targetNilai = Intl.NumberFormat("id-ID").format(+nilai);
onTotalLembar({
target: +nilai,
harga: +Number(data?.hargaLembar),
});
setTarget(targetNilai);
setData({
...(data as any),
targetDana: nilai as string,
});
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Harga Per Lembar"
placeholder="0"
value={harga ? harga : data?.hargaLembar}
onChange={(val) => {
try {
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "") return setHarga(0 + "");
if (!match?.[0]) return null;
const nilai = val.currentTarget.value.replace(/\./g, "");
const targetNilai = Intl.NumberFormat("id-ID").format(+nilai);
onTotalLembar({
harga: +nilai,
target: +Number(data?.targetDana),
});
setHarga(targetNilai);
setData({
...(data as any),
hargaLembar: nilai as string,
});
} catch (error) {
console.log(error);
}
}}
/>
<TextInput
description="*Total lembar dihitung dari, Target Dana / Harga Perlembar"
label="Total Lembar"
value={harga === "0" ? "0" : target === "0" ? "0" : totalLembar}
readOnly
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
}}
rightSection={
<Text fw={"bold"} c={"gray"}>
%
</Text>
}
withAsterisk
type="number"
label={"Rasio Keuntungan / ROI %"}
placeholder="Masukan rasio keuntungan"
value={data?.roi}
onChange={(val) => {
setData({
...(data as any),
roi: val.target.value,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
dropdown: {
backgroundColor: MainColor.white,
},
}}
withAsterisk
label="Pencarian Investor"
placeholder={
loadingMasterInvestor ? "Loading..." : "Pilih batas waktu"
}
data={pencarianInvestor.map((e) => ({
value: e.id,
label: e.name + " " + "hari",
}))}
value={data?.masterPencarianInvestorId}
onChange={(val) => {
setData({
...(data as any),
masterPencarianInvestorId: val,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
dropdown: {
backgroundColor: MainColor.white,
},
}}
withAsterisk
label="Periode Deviden"
placeholder={
loadingMasterPeriodeDeviden ? "Loading..." : "Pilih batas waktu"
}
data={periodeDeviden.map((e) => ({ value: e.id, label: e.name }))}
value={data?.masterPeriodeDevidenId}
onChange={(val) => {
setData({
...(data as any),
masterPeriodeDevidenId: val,
});
}}
/>
<Select
styles={{
label: {
color: MainColor.white,
},
input: {
backgroundColor: MainColor.white,
},
required: {
color: MainColor.red,
},
dropdown: {
backgroundColor: MainColor.white,
},
}}
withAsterisk
label="Pembagian Deviden"
placeholder={
loadingMasterPembagianDeviden
? "Loading..."
: "Pilih batas waktu"
}
data={pembagianDeviden.map((e) => ({
value: e.id,
label: e.name + " " + "bulan",
}))}
value={data?.masterPembagianDevidenId}
onChange={(val) => {
setData({
...(data as any),
masterPembagianDevidenId: val,
});
}}
/>
<Investasi_ComponentButtonUpdateDataInvestasi
data={data as any}
file={file as any}
totalLembar={totalLembar}
/>
</>
)}
</Stack>
</>
);
}

View File

@@ -1,82 +1,118 @@
import { MainColor } from "@/app_modules/_global/color";
import {
ComponentGlobal_BoxInformation,
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import {
Box,
Button,
Center,
FileButton,
Grid,
Group,
Stack,
Text
} from "@mantine/core";
import {
IconCamera,
IconCircleCheck
IconCircleCheck,
IconFileTypePdf
} from "@tabler/icons-react";
import { DIRECTORY_ID } from "@/app/lib";
import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
import {
funGlobal_DeleteFileById,
funGlobal_UploadToStorage,
} from "@/app_modules/_global/fun";
import {
ComponentGlobal_NotifikasiBerhasil,
ComponentGlobal_NotifikasiPeringatan,
} from "@/app_modules/_global/notif_global";
import { useRouter } from "next/navigation";
import { clientLogger } from "@/util/clientLogger";
import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react";
import { Investasi_SkeletonEditProspektus } from "../../_component/skeleton_view";
import { investasi_funUpdateProspektus } from "../../_fun";
import { apiGetOneInvestasiById } from "../../_lib/api_interface";
export function Investasi_ViewEditProspektus({
investasiId,
}: {
investasiId: string;
}) {
export function Investasi_ViewEditProspektus() {
const params = useParams<{ id: string }>();
const investasiId = params.id;
const router = useRouter();
const [filePdf, setFilePdf] = useState<File | null>(null);
const [isLoading, setIsLoading] = useState(false);
const [fileRemoveId, setFileRemoveId] = useState<string | null>(null);
useShallowEffect(() => {
onLoadData();
}, []);
async function onLoadData() {
try {
const respone = await apiGetOneInvestasiById(investasiId);
if (respone.success) {
setFileRemoveId(respone.data.prospektusFileId);
}
} catch (error) {
clientLogger.error("Error get data investasi:", error);
}
}
async function onUpload() {
setIsLoading(true);
const uploadFilePdf = await funGlobal_UploadToStorage({
file: filePdf as any,
dirId: DIRECTORY_ID.investasi_prospektus,
});
if (!uploadFilePdf.success) {
setIsLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload file pdf");
}
try {
setIsLoading(true);
const uploadFilePdf = await funGlobal_UploadToStorage({
file: filePdf as any,
dirId: DIRECTORY_ID.investasi_prospektus,
});
if (!uploadFilePdf.success) {
setIsLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal upload file pdf");
return;
}
const deleteFile = await funGlobal_DeleteFileById({
fileId: fileRemoveId as string,
dirId: DIRECTORY_ID.investasi_prospektus,
});
if (!deleteFile.success) {
setIsLoading(false);
clientLogger.error("Error delete file:", deleteFile.message);
}
const updte = await investasi_funUpdateProspektus({
fileId: uploadFilePdf.data.id,
investasiId: investasiId,
});
if (updte.status !== 200) {
return ComponentGlobal_NotifikasiPeringatan("Gagal update prospektus");
setIsLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal update prospektus");
return;
}
ComponentGlobal_NotifikasiBerhasil(updte.message);
router.back();
return ComponentGlobal_NotifikasiBerhasil(updte.message);
} catch (error) {
console.log(error);
} finally {
setIsLoading(false);
clientLogger.error("Error update prospektus:", error);
}
}
if (fileRemoveId == null) {
return <Investasi_SkeletonEditProspektus />;
}
return (
<>
<Stack spacing={"sm"}>
<ComponentGlobal_BoxInformation informasi="File prospektus wajib untuk diupload, agar calon investor paham dengan prospek investasi yang akan anda jalankan kedepan !" />
<ComponentGlobal_BoxInformation informasi="File prospektus wajib untuk diupload, agar calon investor paham dengan prospek investasi yang akan anda jalankan kedepan." />
<ComponentGlobal_CardStyles marginBottom={"0px"}>
{!filePdf ? (
<Text lineClamp={1} align="center" c={"gray"}>
Upload File Prospektus
</Text>
<Stack justify="center" align="center" h={"100%"}>
<IconFileTypePdf size={50} color="gray" />
</Stack>
) : (
<Grid align="center">
<Grid.Col span={2}></Grid.Col>
@@ -94,54 +130,43 @@ export function Investasi_ViewEditProspektus({
)}
</ComponentGlobal_CardStyles>
<Group position="center">
<FileButton
<Center>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFilePdf}
accept={"application/pdf"}
onChange={async (files: any) => {
try {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
text="Upload File"
/>
</Center>
setFilePdf(files);
} catch (error) {
console.log(error);
}
}}
>
{(props) => (
<Button
leftIcon={<IconCamera />}
{...props}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload File
</Button>
)}
</FileButton>
</Group>
<Button
loaderPosition="center"
loading={isLoading}
disabled={filePdf === null}
mt={50}
radius={50}
bg={MainColor.yellow}
color="yellow"
c={"black"}
<Box
style={{
transition: "0.5s",
}}
onClick={() => {
onUpload();
display: "flex",
justifyContent: "center",
}}
>
Update
</Button>
<Button
px={"sm"}
loaderPosition="center"
loading={isLoading}
disabled={filePdf === null}
mt={50}
radius={50}
bg={MainColor.yellow}
color="yellow"
c={"black"}
style={{
transition: "all 0.3s ease",
position: "absolute",
bottom: 20,
width: "90%",
}}
onClick={() => {
onUpload();
}}
>
Update
</Button>
</Box>
</Stack>
</>
);

View File

@@ -32,6 +32,7 @@ import { IRealtimeData } from "@/app/lib/global_state";
import { notifikasiToAdmin_funCreate } from "@/app_modules/notifikasi/fun";
import { WibuRealtime } from "wibu-pkg";
import { clientLogger } from "@/util/clientLogger";
import { ComponentGlobal_ButtonUploadFileImage } from "@/app_modules/_global/component";
export function Investasi_ViewInvoice({
dataInvoice,
@@ -42,6 +43,7 @@ export function Investasi_ViewInvoice({
const [isLoading, setLoading] = useState(false);
const [data, setData] = useState(dataInvoice);
const [file, setFile] = useState<File | null>(null);
const [img, setImg] = useState<any | null>(null);
async function onUpload() {
try {
@@ -52,6 +54,7 @@ export function Investasi_ViewInvoice({
});
if (!uploadFileToStorage.success) {
setLoading(false);
ComponentGlobal_NotifikasiPeringatan("Gagal upload bukti transfer");
return;
}
@@ -62,6 +65,7 @@ export function Investasi_ViewInvoice({
});
if (res.status != 200) {
setLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
return;
}
@@ -93,9 +97,8 @@ export function Investasi_ViewInvoice({
});
}
} catch (error) {
clientLogger.error(" Error upload invoice", error);
} finally {
setLoading(false);
clientLogger.error(" Error upload invoice", error);
}
}
@@ -245,29 +248,10 @@ export function Investasi_ViewInvoice({
>
<Stack spacing={"sm"}>
<Center>
<FileButton
onChange={async (files: any | null) => {
try {
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>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFile}
accept="image/png,image/png,image/jpeg,application/pdf"
/>
</Center>
{file ? (
<Center>

View File

@@ -3,6 +3,7 @@ import { MainColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_BoxInformation,
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { MAX_SIZE } from "@/app_modules/_global/lib";
@@ -131,7 +132,7 @@ export default function InvestasiCreateNew() {
{/* Upload Image */}
<Stack spacing={0}>
<Box mb={"sm"}>
<ComponentGlobal_BoxInformation informasi="Gambar investasi bisa berupa ilustrasi, poster atau foto terkait investasi" />
<ComponentGlobal_BoxInformation informasi="Gambar investasi bisa berupa ilustrasi, poster atau foto terkait investasi." />
</Box>
<ComponentGlobal_BoxUploadImage>
{isLoadingImg ? (
@@ -155,7 +156,13 @@ export default function InvestasiCreateNew() {
</ComponentGlobal_BoxUploadImage>
{/* Upload Foto */}
<Group position="center">
<Center>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFileImage}
onSetImage={setImg}
/>
</Center>
{/* <Group position="center">
<FileButton
onChange={async (files: any) => {
try {
@@ -196,12 +203,12 @@ export default function InvestasiCreateNew() {
</Button>
)}
</FileButton>
</Group>
</Group> */}
</Stack>
{/* Upload File */}
<Stack spacing={"sm"}>
<ComponentGlobal_BoxInformation informasi="File prospektus wajib untuk diupload, agar calon investor paham dengan prospek investasi yang akan anda jalankan kedepan !" />
<ComponentGlobal_BoxInformation informasi="File prospektus wajib untuk diupload, agar calon investor paham dengan prospek investasi yang akan anda jalankan kedepannya." />
<ComponentGlobal_CardStyles marginBottom={"0px"}>
{isLoadingPdf ? (
<Stack justify="center" align="center" h={"100%"}>
@@ -228,7 +235,16 @@ export default function InvestasiCreateNew() {
)}
</ComponentGlobal_CardStyles>
<Group position="center">
<Center>
<ComponentGlobal_ButtonUploadFileImage
onSetFile={setFilePdf}
onSetImage={setFPdf}
accept={"application/pdf"}
text="Upload File"
icon={<IconFileTypePdf size={20} />}
/>
</Center>
{/* <Group position="center">
<FileButton
accept={"application/pdf"}
onChange={async (files: any) => {
@@ -269,7 +285,7 @@ export default function InvestasiCreateNew() {
</Button>
)}
</FileButton>
</Group>
</Group> */}
</Stack>
<Stack>
@@ -283,7 +299,7 @@ export default function InvestasiCreateNew() {
},
input: {
backgroundColor: MainColor.white,
}
},
}}
withAsterisk
label="Judul Investasi"
@@ -307,7 +323,7 @@ export default function InvestasiCreateNew() {
},
input: {
backgroundColor: MainColor.white,
}
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
@@ -350,7 +366,7 @@ export default function InvestasiCreateNew() {
},
input: {
backgroundColor: MainColor.white,
}
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
@@ -403,7 +419,7 @@ export default function InvestasiCreateNew() {
},
input: {
backgroundColor: MainColor.white,
}
},
}}
/>
@@ -417,7 +433,7 @@ export default function InvestasiCreateNew() {
},
input: {
backgroundColor: MainColor.white,
}
},
}}
rightSection={
<Text fw={"bold"} c={"gray"}>

View File

@@ -1,30 +0,0 @@
"use client";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import React from "react";
import { MODEL_INVESTASI } from "../_lib/interface";
export default function LayoutEditProspektusInvestasi({
children,
dataInvestasi,
}: {
children: React.ReactNode;
dataInvestasi: MODEL_INVESTASI;
}) {
return (
<>
<UIGlobal_LayoutTamplate
header={
<UIGlobal_LayoutHeaderTamplate
title="Edit Prospektus"
// icon={<IconEdit />}
// route2={RouterInvestasi.upload_prospektus + `${dataInvestasi.id}`}
/>
}
>
{children}
</UIGlobal_LayoutTamplate>
</>
);
}

View File

@@ -1,75 +0,0 @@
"use client";
import {
Paper,
Grid,
Center,
Title,
Divider,
Button,
Text,
Group,
FileButton,
FileInput,
Image,
AspectRatio,
Flex,
Stack,
Box,
} from "@mantine/core";
import { IconChevronRight, IconFileTypePdf } from "@tabler/icons-react";
import Link from "next/link";
import { useState } from "react";
import { MODEL_INVESTASI } from "../_lib/interface";
import { RouterInvestasi_OLD } from "@/app/lib/router_hipmi/router_investasi";
export default function EditProspektusInvestasi({
dataInvestasi,
}: {
dataInvestasi: MODEL_INVESTASI;
}) {
const [prospek, setProspek] = useState<MODEL_INVESTASI>(dataInvestasi);
return (
<>
{/* <pre>{JSON.stringify(prospek, null, 2)}</pre> */}
<Stack>
{prospek.ProspektusInvestasi != null ? (
<Link
href={RouterInvestasi_OLD.api_file_prospektus + `${prospek.ProspektusInvestasi.id}`}
target="_blank"
style={{ textDecorationLine: "none" }}
>
<Paper w={"100%"} bg={"gray"} mb={"md"}>
<Grid
align="center"
justify="center"
h={50}
px={"sm"}
onClick={() => ""}
>
<Grid.Col span={11}>
<Group>
{/* <IconFileTypePdf /> */}
<Text lineClamp={1}>Prospektus_{prospek.title}</Text>
</Group>
</Grid.Col>
<Grid.Col span={1}>
<Center>
<IconChevronRight />
</Center>
</Grid.Col>
</Grid>
</Paper>
</Link>
) : (
<Center>
<Title order={4}>Tidak ada file</Title>
</Center>
)}
{/* <Divider my={"lg"} /> */}
</Stack>
</>
);
}

View File

@@ -7,8 +7,6 @@ import PortofolioInvestasi from "./portofolio/view";
import LayoutPortofolioInvestasi from "./portofolio/layout";
import EditIntroInvestasi from "./edit_intro/view";
import LayoutEditIntroInvestasi from "./edit_intro/layout";
import EditProspektusInvestasi from "./edit_propektus/view";
import LayoutEditProspektusInvestasi from "./edit_propektus/layout";
import EditDokumenInvestasi from "./edit_dokumen/view";
import LayoutEditDokumenInvestasi from "./edit_dokumen/layout";
import EditBeritaInvestasi from "./edit_berita/view";
@@ -58,8 +56,6 @@ export {
LayoutPortofolioInvestasi,
EditIntroInvestasi,
LayoutEditIntroInvestasi,
EditProspektusInvestasi,
LayoutEditProspektusInvestasi,
EditDokumenInvestasi,
LayoutEditDokumenInvestasi,
EditBeritaInvestasi,

View File

@@ -2,22 +2,15 @@
import {
AspectRatio,
Button,
Center,
FileButton,
Image,
Stack,
Text,
TextInput,
} from "@mantine/core";
import { IconCamera } from "@tabler/icons-react";
import { useState } from "react";
import { MODEL_JOB } from "../model/interface";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_BoxUploadImage,
ComponentGlobal_ButtonUploadFileImage,

View File

@@ -3,13 +3,7 @@ import {
ComponentGlobal_BoxInformation,
ComponentGlobal_ButtonUploadFileImage,
} from "@/app_modules/_global/component";
import {
Avatar,
Box,
Center,
Paper,
Stack
} from "@mantine/core";
import { Avatar, Box, Center, Paper, Stack } from "@mantine/core";
import { useState } from "react";
export default function Profile_ViewUploadFoto({
@@ -68,125 +62,6 @@ export default function Profile_ViewUploadFoto({
onSetImage={onSetImgPP}
/>
</Center>
{/* <Center>
<FileButton
onChange={async (files: any | null) => {
try {
setLoadingButton(true);
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
// if (files.size > MAX_SIZE) {
// ComponentGlobal_NotifikasiPeringatan(
// PemberitahuanMaksimalFile
// );
// onSetImgPP(null);
// return;
// }
if (fotoProfileId != "") {
try {
const deleteFotoProfile = await funGlobal_DeleteFileById({
fileId: fotoProfileId,
dirId: DIRECTORY_ID.profile_foto,
});
if (!deleteFotoProfile.success) {
clientLogger.error(
"Client failed delete photo profile:" +
deleteFotoProfile.message
);
return;
}
if (deleteFotoProfile.success) {
onSetFotoProfileId("");
onSetImgPP(null);
const uploadPhoto = await funGlobal_UploadToStorage({
file: files,
dirId: DIRECTORY_ID.profile_foto,
});
if (!uploadPhoto.success) {
clientLogger.error(
"Client failed upload photo profile::" +
uploadPhoto.message
);
return;
}
if (uploadPhoto.success) {
clientLogger.info(
"Client success upload foto profile"
);
onSetFotoProfileId(uploadPhoto.data.id);
onSetImgPP(buffer);
} else {
clientLogger.error(
"Client failed upload foto:",
uploadPhoto.message
);
ComponentGlobal_NotifikasiPeringatan(
"Gagal upload foto profile"
);
}
}
} catch (error) {
clientLogger.error("Client error upload foto:", error);
}
} else {
try {
const uploadPhoto = await funGlobal_UploadToStorage({
file: files,
dirId: DIRECTORY_ID.profile_foto,
});
if (uploadPhoto.success) {
clientLogger.info("Client success upload foto profile");
onSetFotoProfileId(uploadPhoto.data.id);
onSetImgPP(buffer);
} else {
clientLogger.error(
"Client failed upload foto:",
uploadPhoto.message
);
ComponentGlobal_NotifikasiPeringatan(
"Gagal upload foto profile"
);
}
} catch (error) {
clientLogger.error("Client error upload foto:", error);
}
}
} catch (error) {
clientLogger.error("Client error upload foto:", error);
} finally {
setLoadingButton(false);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
loading={isLoadingButton}
loaderPosition="center"
radius={"xl"}
leftIcon={<IconCamera />}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload
</Button>
)}
</FileButton>
</Center> */}
</Stack>
</Box>
</>

View File

@@ -29,12 +29,13 @@ const middlewareConfig: MiddlewareConfig = {
"/api/collaboration/*",
"/api/notifikasi/*",
"/api/logs/*",
// "/api/image/*",
"/api/job/*",
"/api/auth/*",
"/api/origin-url",
// "/api/user",
"/api/event/*",
// "/api/image/*",
// "/api/user",
// "/api/new/*",
// Akses awal
"/api/get-cookie",
"/api/user/activation",

44
xhtml/index.html Normal file
View File

@@ -0,0 +1,44 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<!-- <img
id="pdf"
src="https://wibu-storage.wibudev.com/api/pdf-to-image?url=https://pdfobject.com/pdf/sample.pdf"
alt="pdf"
/> -->
<div id="pdfs"></div>
</body>
<script type="module">
(async () => {
const imagePdf = document.getElementById("pdf");
const pdfs = document.getElementById("pdfs");
const token =
"eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyIjp7ImlkIjoiY20wdXIxeXh3MDAwMDU2bnNqbHI2MTg3cCIsIm5hbWUiOiJiYWdhcyIsImVtYWlsIjoiYmFnYXNAZ21haWwuY29tIn0sImlhdCI6MTcyNTg3MTAzNiwiZXhwIjo0ODgxNjMxMDM2fQ.wFQLcrJj66wFeqIMYk2esMx3ULaHK6RFxkiToaLCuko";
const res = await fetch(
"https://wibu-storage.wibudev.com/api/pdf-to-image?url=https://wibu-storage.wibudev.com/api/files/cm5jgzg7d001dxpugxseb2ua0",
{
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
}
);
const jsonData = await res.json();
// console.log(JSON.stringify(jsonData.pages, null, 2));
// imagePdf.src = jsonData.pages[0].imageUrl;
for (let index = 0; index < jsonData.pages.length; index++) {
const element = jsonData.pages[index];
const img = document.createElement("img");
img.src = element.imageUrl;
pdfs.appendChild(img);
}
})();
</script>
</html>