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

# style:

Browse Source 
- UI Investasi
- UI Donasi
## No issue
This commit is contained in:
Bagasbanuna02
2024-08-01 16:48:54 +08:00
parent 810ce1c00d
commit 2ab3a8abb1
135 changed files with 2222 additions and 1652 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/app_modules/investasi/create/layout.tsx
View File

@@ -1,10 +1,7 @@
"use client";
import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
import ComponentGlobal_HeaderTamplate from "@/app_modules/_global/header_tamplate";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { AppShell } from "@mantine/core";
import React from "react";
export default function InvestasiCreateLayout({
@@ -15,7 +12,7 @@ export default function InvestasiCreateLayout({
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Investasi Baru" />}
header={<UIGlobal_LayoutHeaderTamplate title="Tambah Investasi" />}
>
{children}
</UIGlobal_LayoutTamplate>

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

@@ -21,11 +21,9 @@ import {
Select,
Stack,
Text,
TextInput
TextInput,
} from "@mantine/core";
import {
IconUpload
} from "@tabler/icons-react";
import { IconUpload } from "@tabler/icons-react";
import { useAtom } from "jotai";
import _ from "lodash";
import { useRouter } from "next/navigation";
@@ -33,6 +31,12 @@ import { useState } from "react";
import toast from "react-simple-toasts";
import { funCreateInvestasi } from "../fun/fun_create_investasi";
import { gs_StatusPortoInvestasi, gs_investasiFooter } from "../g_state";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
export default function InvestasiCreate({
id,
@@ -96,9 +100,10 @@ export default function InvestasiCreate({
setChangeColor(1);
setActiveTab("Review");
setLoading(true);
router.push(RouterInvestasi.dialog_create);
ComponentGlobal_NotifikasiBerhasil(res.message)
router.push(RouterInvestasi.portofolio);
} else {
toast(res.message);
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
@@ -124,15 +129,35 @@ export default function InvestasiCreate({
<Box>
{/* Inputan Create */}
<Stack spacing={"sm"} px={"md"}>
<AspectRatio ratio={16 / 9}>
<Paper radius={"md"} withBorder>
{img ? (
<Image alt="" src={img} />
) : (
<Image alt="" src={"/aset/no-img.png"} />
)}
</Paper>
</AspectRatio>
{img ? (
<AspectRatio ratio={1 / 1} mah={300}>
<Paper
style={{
border: `2px solid ${AccentColor.softblue}`,
backgroundColor: AccentColor.blue,
padding: "10px",
borderRadius: "10px",
}}
>
<Image
alt="Foto"
src={img ? img : "/aset/no-img.png"}
maw={200}
/>
</Paper>
</AspectRatio>
) : (
<Center>
<Paper h={300} w={200} withBorder shadow="lg" bg={"gray.1"}>
<Stack justify="center" align="center" h={"100%"}>
<IconUpload color="gray" />
<Text fz={10} fs={"italic"} c={"gray"} fw={"bold"}>
Upload Gambar
</Text>
</Stack>
</Paper>
</Center>
)}
{/* Upload Foto */}
<Group position="center" mb={"md"}>
@@ -142,7 +167,7 @@ export default function InvestasiCreate({
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
console.log(files.size);
// console.log(files.size);
if (files.size > maksimalUploadFile) {
ComponentGlobal_WarningMaxUpload({});
@@ -160,25 +185,44 @@ export default function InvestasiCreate({
<Button
{...props}
leftIcon={<IconUpload size={12} />}
compact
radius={50}
bg={Warna.hijau_muda}
// onClick={() => router.push("/dev/investasi/upload")}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload Gambar
</Button>
)}
</FileButton>
</Group>
{/* Upload File */}
<Group position="center">
{!pdf ? (
<Paper w={"100%"} bg={"gray.3"} p={"sm"}>
<Text opacity={"0.3"}>Upload File Prospektus</Text>
<Paper
w={"100%"}
style={{
border: `2px solid gray`,
backgroundColor: "gray.1",
padding: "10px",
borderRadius: "10px",
color: "gray"
}}
>
<Text>Upload File Prospektus</Text>
</Paper>
) : (
<Paper w={"100%"} bg={"gray.6"} p={"sm"}>
<Text truncate>{pdf.name}</Text>
<Paper
w={"100%"}
style={{
border: `2px solid ${AccentColor.softblue}`,
backgroundColor: AccentColor.blue,
padding: "10px",
borderRadius: "10px",
color: "white",
}}
>
<Text lineClamp={1}>{pdf.name}</Text>
</Paper>
)}
{/* {JSON.stringify(filePdf)} */}
@@ -205,9 +249,10 @@ export default function InvestasiCreate({
<Button
leftIcon={<IconUpload size={12} />}
{...props}
compact
radius={"xl"}
bg={Warna.hijau_muda}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload File
</Button>
@@ -215,6 +260,11 @@ export default function InvestasiCreate({
</FileButton>
</Group>
<TextInput
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Judul Investasi"
placeholder="Judul investasi"
@@ -227,32 +277,12 @@ export default function InvestasiCreate({
}}
/>
{/* <NumberInput
withAsterisk
type="number"
label="Dana Dibutuhkan"
placeholder="Masukan nominal dana"
onChange={(val: any) => {
setValue({
...value,
targetDana: val,
});
}}
/>
<NumberInput
label="Harga Per Lembar"
type="number"
placeholder="Masukan nominal harga"
onChange={(val) => {
setValue({
...value,
hargaLembar: +val,
});
onTotalLembar({ target: value.targetDana, harga: +val });
}}
/> */}
<TextInput
styles={{
label: {
color: "white",
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
@@ -280,6 +310,11 @@ export default function InvestasiCreate({
/>
<TextInput
styles={{
label: {
color: "white",
},
}}
icon={<Text fw={"bold"}>Rp.</Text>}
min={0}
withAsterisk
@@ -317,7 +352,7 @@ export default function InvestasiCreate({
}}
/>
<Stack spacing={3}>
<Stack spacing={3} style={{ color: "white" }}>
<Text fz={"sm"} fw={500}>
Total Lembar
</Text>
@@ -325,12 +360,17 @@ export default function InvestasiCreate({
<Text>{totalLembar}</Text>
<Divider />
</Stack>
<Text c={"gray"} fz={10} fs={"italic"}>
<Text fz={10} fs={"italic"}>
*Total lembar dihitung dari, Target Dana : Harga Perlembar
</Text>
</Stack>
<TextInput
styles={{
label: {
color: "white",
},
}}
rightSection={
<Text fw={"bold"} c={"gray"}>
%
@@ -349,6 +389,11 @@ export default function InvestasiCreate({
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Pencarian Investor"
placeholder="Pilih batas waktu"
@@ -364,6 +409,11 @@ export default function InvestasiCreate({
}}
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Periode Deviden"
placeholder="Pilih batas waktu"
@@ -376,6 +426,11 @@ export default function InvestasiCreate({
}}
/>
<Select
styles={{
label: {
color: "white",
},
}}
withAsterisk
label="Pembagian Deviden"
placeholder="Pilih batas waktu"
@@ -390,10 +445,9 @@ export default function InvestasiCreate({
});
}}
/>
</Stack>
<Center my={"lg"}>
<Button
my={"xl"}
style={{
transition: "0.5s",
}}
@@ -412,14 +466,15 @@ export default function InvestasiCreate({
? true
: false
}
w={300}
radius={50}
bg={Warna.biru}
bg={MainColor.yellow}
color="yellow"
c={"black"}
onClick={() => onSubmit()}
>
Simpan
</Button>
</Center>
</Stack>
</Box>
</>
);