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

fix invetasi create

Browse Source
This commit is contained in:
Bagasbanuna02
2025-02-27 10:27:30 +08:00
parent bc9b68f520
commit 18f9cce963
4 changed files with 64 additions and 536 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/app_modules/investasi/_component/button/comp_button_create_new_investasi.tsx
View File

@@ -1,7 +1,5 @@
"use client";
import { DIRECTORY_ID } from "@/lib";
import { NEW_RouterInvestasi } from "@/lib/router_hipmi/router_investasi";
import { MainColor } from "@/app_modules/_global/color";
import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun";
import {
@@ -10,26 +8,30 @@ import {
ComponentGlobal_NotifikasiPeringatan,
} from "@/app_modules/_global/notif_global";
import { notifikasiToAdmin_funCreate } from "@/app_modules/notifikasi/fun";
import { DIRECTORY_ID } from "@/lib";
import { IRealtimeData } from "@/lib/global_state";
import { NEW_RouterInvestasi } from "@/lib/router_hipmi/router_investasi";
import { clientLogger } from "@/util/clientLogger";
import { Button } from "@mantine/core";
import { useAtom } from "jotai";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { WibuRealtime } from "wibu-pkg";
import { investasi_funCreateNewInvestasi } from "../../_fun";
import { gs_investas_menu, gs_investasi_status } from "../../g_state";
import { clientLogger } from "@/util/clientLogger";
import { IRealtimeData } from "@/lib/global_state";
import { WibuRealtime } from "wibu-pkg";
export function Investasi_ComponentButtonCreateNewInvestasi({
data,
totalLembar,
fileImage,
filePdf,
isMinimalTarget,
}: {
data: any;
totalLembar: number;
fileImage: File;
filePdf: File;
isMinimalTarget: boolean;
}) {
const router = useRouter();
const [isLoading, setIsLoading] = useState(false);
@@ -114,7 +116,7 @@ export function Investasi_ComponentButtonCreateNewInvestasi({
} catch (error) {
setIsLoading(false);
clientLogger.error("Error create new investasi", error);
}
}
}
return (
@@ -135,9 +137,8 @@ export function Investasi_ComponentButtonCreateNewInvestasi({
data.periodeDevidenId === "" ||
data.pembagianDevidenId === "" ||
fileImage === null ||
filePdf === null
? true
: false
filePdf === null ||
isMinimalTarget
}
radius={50}
bg={MainColor.yellow}

396
src/app_modules/investasi/create/view.tsx
View File

@@ -1,396 +0,0 @@
"use client";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_BoxInformation,
ComponentGlobal_BoxUploadImage,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { MODEL_DEFAULT_MASTER_OLD } from "@/app_modules/model_global/model_default_master";
import {
AspectRatio,
Box,
Button,
Center,
FileButton,
Grid,
Group,
Image,
Select,
Stack,
Text,
TextInput,
} from "@mantine/core";
import {
IconCamera,
IconCircleCheck,
IconFileTypePdf,
IconPdf,
IconUpload,
} from "@tabler/icons-react";
import _ from "lodash";
import { useState } from "react";
import { Investasi_ComponentButtonCreateNewInvestasi } from "../_component";
export default function InvestasiCreate({
pencarianInvestor,
periodeDeviden,
pembagianDeviden,
}: {
pencarianInvestor: MODEL_DEFAULT_MASTER_OLD[];
periodeDeviden: MODEL_DEFAULT_MASTER_OLD[];
pembagianDeviden: MODEL_DEFAULT_MASTER_OLD[];
}) {
const [fileImage, setFileImage] = useState<File | null>(null);
const [img, setImg] = useState<any | null>();
const [filePdf, setFilePdf] = useState<File | null>(null);
const [fPdf, setFPdf] = useState<any | null>(null);
const [totalLembar, setTotalLembar] = useState(0);
const [value, setValue] = useState({
title: "",
targetDana: 0,
hargaLembar: 0,
roi: 0,
pencarianInvestorId: "",
periodeDevidenId: "",
pembagianDevidenId: "",
});
const [target, setTarget] = useState("");
const [harga, setHarga] = useState("");
async function onTotalLembar({
target,
harga,
}: {
target?: number | any;
harga?: number | any;
}) {
if (target !== 0 && harga !== 0) {
const hasil: any = target / harga;
setTotalLembar(_.floor(hasil === Infinity ? 0 : hasil));
}
}
return (
<>
<Stack px={"xs"} spacing={40}>
{/* Upload Image */}
<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} mah={265} mx={"auto"}>
<Image
style={{ maxHeight: 250, margin: "auto", padding: "5px" }}
alt="Foto"
height={250}
src={img}
/>
</AspectRatio>
) : (
<Stack justify="center" align="center" h={"100%"}>
<IconUpload color="white" />
<Text fz={10} fs={"italic"} c={"white"} fw={"bold"}>
Upload Gambar
</Text>
</Stack>
)}
</ComponentGlobal_BoxUploadImage>
{/* Upload Foto */}
<Group position="center">
<FileButton
onChange={async (files: any) => {
try {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
setImg(buffer);
setFileImage(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>
{/* 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_CardStyles marginBottom={"0px"}>
{!filePdf ? (
<Text lineClamp={1} align="center" c={"gray"}>
Upload File Prospektus
</Text>
) : (
<Grid align="center">
<Grid.Col span={2}></Grid.Col>
<Grid.Col span={"auto"}>
<Text lineClamp={1} align="center">
{filePdf.name}
</Text>
</Grid.Col>
<Grid.Col span={2}>
<Center>
<IconCircleCheck color="green" />
</Center>
</Grid.Col>
</Grid>
)}
</ComponentGlobal_CardStyles>
<Group position="center">
<FileButton
accept={"application/pdf"}
onChange={async (files: any) => {
try {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
setFPdf(buffer);
setFilePdf(files);
} catch (error) {
console.log(error);
}
}}
>
{(props) => (
<Button
leftIcon={<IconFileTypePdf />}
{...props}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload File
</Button>
)}
</FileButton>
</Group>
</Stack>
<Stack>
<TextInput
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Judul Investasi"
placeholder="Judul investasi"
maxLength={100}
onChange={(val) => {
setValue({
...value,
title: val.target.value,
});
}}
/>
<TextInput
styles={{
label: {
color: "white",
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Dana Dibutuhkan"
placeholder="0"
value={target}
onChange={(val) => {
// console.log(typeof 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: +value.hargaLembar,
});
setTarget(targetNilai);
setValue({
...value,
targetDana: +nilai,
});
}}
/>
<TextInput
styles={{
label: {
color: "white",
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Harga Per Lembar"
placeholder="0"
value={harga}
onChange={(val) => {
try {
// console.log(typeof +val.currentTarget.value);
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: +value.targetDana,
});
setHarga(targetNilai);
setValue({
...value,
hargaLembar: +nilai,
});
} 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: "white",
},
}}
/>
<TextInput
styles={{
label: {
color: "white",
},
}}
rightSection={
<Text fw={"bold"} c={"gray"}>
%
</Text>
}
withAsterisk
type="number"
label={"Rasio Keuntungan / ROI %"}
placeholder="Masukan rasio keuntungan"
onChange={(val) => {
setValue({
...value,
roi: _.toNumber(val.target.value),
});
}}
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Pencarian Investor"
placeholder="Pilih batas waktu"
data={pencarianInvestor.map((e) => ({
value: e.id,
label: e.name + " " + "hari",
}))}
onChange={(val) => {
setValue({
...(value as any),
pencarianInvestorId: val,
});
}}
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Periode Deviden"
placeholder="Pilih batas waktu"
data={periodeDeviden.map((e) => ({ value: e.id, label: e.name }))}
onChange={(val) => {
setValue({
...(value as any),
periodeDevidenId: val,
});
}}
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Pembagian Deviden"
placeholder="Pilih batas waktu"
data={pembagianDeviden.map((e) => ({
value: e.id,
label: e.name + " " + "bulan",
}))}
onChange={(val) => {
setValue({
...(value as any),
pembagianDevidenId: val,
});
}}
/>
</Stack>
<Investasi_ComponentButtonCreateNewInvestasi
data={value}
totalLembar={totalLembar}
fileImage={fileImage as any}
filePdf={filePdf as any}
/>
</Stack>
</>
);
}

183
src/app_modules/investasi/create/view_new.tsx
View File

@@ -6,17 +6,11 @@ import {
ComponentGlobal_ButtonUploadFileImage,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { MAX_SIZE } from "@/app_modules/_global/lib";
import { PemberitahuanMaksimalFile } from "@/app_modules/_global/lib/max_size";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
import {
AspectRatio,
Box,
Button,
Center,
FileButton,
Grid,
Group,
Image,
Loader,
Select,
@@ -26,7 +20,6 @@ import {
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import {
IconCamera,
IconCircleCheck,
IconFileTypePdf,
IconPhoto,
@@ -64,6 +57,7 @@ export default function InvestasiCreateNew() {
const [isLoadingImg, setIsLoadingImg] = useState(false);
const [isLoadingPdf, setIsLoadingPdf] = useState(false);
const [isMinimalTarget, setMinimalTarget] = useState(false);
async function onTotalLembar({
target,
@@ -162,48 +156,6 @@ export default function InvestasiCreateNew() {
onSetImage={setImg}
/>
</Center>
{/* <Group position="center">
<FileButton
onChange={async (files: any) => {
try {
setIsLoadingImg(true);
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
if (files.size > MAX_SIZE) {
ComponentGlobal_NotifikasiPeringatan(
PemberitahuanMaksimalFile
);
setImg(null);
return;
}
setImg(buffer);
setFileImage(files);
} catch (error) {
console.log(error);
} finally {
setIsLoadingImg(false);
}
}}
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>
{/* Upload File */}
@@ -244,48 +196,6 @@ export default function InvestasiCreateNew() {
icon={<IconFileTypePdf size={20} />}
/>
</Center>
{/* <Group position="center">
<FileButton
accept={"application/pdf"}
onChange={async (files: any) => {
try {
setIsLoadingPdf(true);
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
if (files.size > MAX_SIZE) {
ComponentGlobal_NotifikasiPeringatan(
PemberitahuanMaksimalFile
);
setFilePdf(null);
return;
}
setFPdf(buffer);
setFilePdf(files);
} catch (error) {
console.log(error);
} finally {
setIsLoadingPdf(false);
}
}}
>
{(props) => (
<Button
leftIcon={<IconFileTypePdf />}
{...props}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload File
</Button>
)}
</FileButton>
</Group> */}
</Stack>
<Stack>
@@ -313,48 +223,62 @@ export default function InvestasiCreateNew() {
}}
/>
<TextInput
styles={{
label: {
color: MainColor.white,
},
required: {
color: MainColor.red,
},
input: {
backgroundColor: MainColor.white,
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Dana Dibutuhkan"
placeholder="0"
value={target}
onChange={(val) => {
// console.log(typeof val)
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
<Stack>
<TextInput
styles={{
label: {
color: MainColor.white,
},
required: {
color: MainColor.red,
},
input: {
backgroundColor: MainColor.white,
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
label="Dana Dibutuhkan"
placeholder="0"
value={target}
error={isMinimalTarget ? "Minimal target 10.000.000" : ""}
onChange={(val) => {
// console.log(typeof val)
const match = val.currentTarget.value
.replace(/\./g, "")
.match(/^[0-9]+$/);
if (val.currentTarget.value === "") return setTarget(0 + "");
if (!match?.[0]) return null;
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);
const nilai = val.currentTarget.value.replace(/\./g, "");
const targetNilai = Intl.NumberFormat("id-ID").format(+nilai);
onTotalLembar({
target: +nilai,
harga: +value.hargaLembar,
});
// console.log("type nilai", typeof nilai);
// console.log("nilai", nilai);
// console.log("targetNilai", targetNilai);
// console.log("type targetNilai", typeof targetNilai);
setTarget(targetNilai);
setValue({
...value,
targetDana: +nilai,
});
}}
/>
if (+nilai < 10000000) {
setMinimalTarget(true);
} else {
setMinimalTarget(false);
}
onTotalLembar({
target: +nilai,
harga: +value.hargaLembar,
});
setTarget(targetNilai);
setValue({
...value,
targetDana: +nilai,
});
}}
/>
</Stack>
<TextInput
styles={{
@@ -551,6 +475,7 @@ export default function InvestasiCreateNew() {
totalLembar={totalLembar}
fileImage={fileImage as any}
filePdf={filePdf as any}
isMinimalTarget={isMinimalTarget}
/>
</Stack>
</>

2
src/app_modules/investasi/index.ts
View File

@@ -1,4 +1,3 @@
import InvestasiCreate from "./create/view";
import InvestasiCreateNew from "./create/view_new";
import InvestasiCreateLayout from "./create/layout";
import DetailInvestasi from "./detail/view";
@@ -46,7 +45,6 @@ import StatusPesananInvetsatsi from "./status_pesanan/view";
import LayoutStatusPesananInvestasi from "./status_pesanan/layout";
export {
InvestasiCreate,
InvestasiCreateLayout,
DetailInvestasi,
LayoutDetailInvestasi,