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

Fix: Investasi

Browse Source 
Deskripsi:
- Upload gambar investasi ke storage wibu
- Upload bukti transfer ke storage wibu
# No Issue
This commit is contained in:
Bagasbanuna02
2024-10-15 11:06:14 +08:00
parent 3d6ec1410d
commit 5ff74b00f5
121 changed files with 4022 additions and 1139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/app_modules/_global/component/box_information.tsx
View File

@@ -12,15 +12,16 @@ export default function ComponentGlobal_BoxInformation({
}) {
return (
<>
{isReport ? (
<Paper
bg={"blue.3"}
p={10}
style={{
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
}}
>
<Paper
bg={"blue.3"}
p={10}
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.softblue}`,
borderRadius: "10px",
}}
>
{isReport ? (
<Stack spacing={0}>
<Text
fz={fonsize ? fonsize : 12}
@@ -34,16 +35,7 @@ export default function ComponentGlobal_BoxInformation({
{informasi}
</Text>
</Stack>
</Paper>
) : (
<Paper
bg={"blue.3"}
p={10}
style={{
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
}}
>
) : (
<Group>
<Text fz={fonsize ? fonsize : 12} c={"red"} fw={"bold"}>
*{" "}
@@ -52,8 +44,10 @@ export default function ComponentGlobal_BoxInformation({
</Text>
</Text>
</Group>
</Paper>
)}
)}
</Paper>
</>
);
}

4
src/app_modules/_global/component/comp_box_upload_image.tsx
View File

@@ -9,7 +9,7 @@ import { Box } from "@mantine/core";
<Image
style={{ maxHeight: 250 }}
alt="Avatar"
src={image ? image : APIs.GET({ fileId: profile.imageId as any })}/>
src={image ? image : APIs.GET({ fileId: <imageId> })}/>
* </AspectRatio>
* @returns folllow like this
*/
@@ -22,7 +22,7 @@ export function ComponentGlobal_BoxUploadImage({
}) {
return (
<>
<ComponentGlobal_CardStyles height={height ? height : 300}>
<ComponentGlobal_CardStyles height={height ? height : 300} >
<Box
style={{
height: "100%",

9
src/app_modules/_global/component/comp_load_image.tsx
View File

@@ -44,11 +44,9 @@ export function ComponentGlobal_LoadImage({
if (isImage === null)
return (
// <Center h={250}>
// <ComponentGlobal_Loader variant="dots" size={50} />
// </Center>
<Center>
<Skeleton h={250} radius={"sm"} w={200} />
<Center h={"100%"}>
<Skeleton h={250} radius={"sm"} w={250} />
</Center>
);
@@ -74,6 +72,7 @@ export function ComponentGlobal_LoadImage({
opacity={isLoading ? 0.5 : 1}
radius={radius ? radius : 0}
alt="Image"
height={h ? h : 250}
maw={maw ? maw : 200}
miw={200}
src={url}

60
src/app_modules/_global/component/comp_load_image_custom.tsx Normal file
View File

@@ -0,0 +1,60 @@
"use client";
import { APIs } from "@/app/lib";
import { pathAssetImage } from "@/app/lib/path_asset_image";
import { Center, Image, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react";
export function ComponentGlobal_LoadImageCustom({
fileId,
height,
}: {
fileId: string;
height: number;
}) {
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId });
useShallowEffect(() => {
onLoadImage();
}, []);
async function onLoadImage() {
try {
const res = await fetch(url);
if (res.ok) {
return setIsImage(true);
}
setIsImage(false);
} catch (error) {
console.log(error);
}
}
if (isImage === null)
return <Skeleton h={height ? height : 100} w={"100%"} />;
return (
<>
{isImage ? (
<Image alt="No Image" height={height} src={url} radius={"sm"} />
) : (
<Center
bg={"white"}
p={"sm"}
h={height ? height : 80}
style={{ borderRadius: "5px" }}
>
<Image
alt="No Image"
height={50}
width={50}
src={pathAssetImage.no_image}
/>
</Center>
)}
</>
);
}

3
src/app_modules/_global/component/comp_load_image_landscape.tsx
View File

@@ -39,7 +39,7 @@ export function ComponentGlobal_LoadImageLandscape({
if (!isImage)
return (
<>
<Center h={200} bg={"white"} style={{ borderRadius: "10px" }}>
<Center h={200} bg={"white"} style={{ borderRadius: "5px" }}>
<Image
alt="No Image"
maw={150}
@@ -55,6 +55,7 @@ export function ComponentGlobal_LoadImageLandscape({
<>
<Center>
<Image
onClick={() => {
setLoading(true);
router.push(RouterImagePreview.main({ id: fileId }), {

2
src/app_modules/_global/component/index.ts
View File

@@ -5,6 +5,7 @@ import { ComponentGlobal_BoxUploadImage } from "./comp_box_upload_image";
import { ComponentGlobal_CardStyles } from "./comp_card_box_and_background";
import { ComponentGlobal_LoaderAvatar } from "./comp_load_avatar";
import { ComponentGlobal_LoadImage } from "./comp_load_image";
import { ComponentGlobal_LoadImageCustom } from "./comp_load_image_custom";
import { ComponentGlobal_LoadImageLandscape } from "./comp_load_image_landscape";
import ComponentGlobal_CardLoadingOverlay from "./comp_loading_card";
import { ComponentGlobal_NotUserLoadImage } from "./comp_not_user_load_image";
@@ -27,3 +28,4 @@ export { ComponentGlobal_LoaderAvatar };
export { ComponentGlobal_AvatarAndUsername };
export { ComponentGlobal_NotUserLoadImage };
export { ComponentGlobal_LoadImageLandscape };
export { ComponentGlobal_LoadImageCustom };

24
src/app_modules/_global/fun/delete/fun_delete_file_by_id.tsx Normal file
View File

@@ -0,0 +1,24 @@
export async function funGlobal_DeleteFileById({ fileId }: { fileId: string }) {
try {
const res = await fetch(
`https://wibu-storage.wibudev.com/api/files/${fileId}/delete`,
{
method: "DELETE",
headers: {
Authorization: `Bearer ${process.env.WS_APIKEY}`,
},
}
);
if (res.ok) {
const hasil = await res.json();
return { success: true };
} else {
const errorText = await res.json();
return { success: false };
}
} catch (error) {
return { success: false };
console.error("Upload error:", error);
}
}

2
src/app_modules/_global/fun/index.ts
View File

@@ -1,3 +1,5 @@
import { funGlobal_DeleteFileById } from "./delete/fun_delete_file_by_id";
import { funGlobal_UploadToStorage } from "./upload/fun_upload_to_storage";
export { funGlobal_UploadToStorage };
export { funGlobal_DeleteFileById };

2
src/app_modules/_global/ui/index.ts
View File

@@ -1,4 +1,5 @@
import UIGlobal_Drawer from "./ui_drawer";
import UIGlobal_DrawerCustom from "./ui_drawer_custom";
import UIGlobal_LayoutHeaderTamplate from "./ui_header_tamplate";
import { UIGlobal_ImagePreview } from "./ui_image_preview";
import UIGlobal_LayoutDefault from "./ui_layout_default";
@@ -15,3 +16,4 @@ export { UIGlobal_SplashScreen };
export { UIGlobal_ImagePreview };
export { UIGlobal_NotUserImagePreview };
export { UIGlobal_LayoutDefault };
export { UIGlobal_DrawerCustom };

72
src/app_modules/_global/ui/ui_drawer_custom.tsx Normal file
View File

@@ -0,0 +1,72 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color";
import {
ActionIcon,
Box,
Drawer,
Group,
SimpleGrid,
Stack,
} from "@mantine/core";
import { IconX } from "@tabler/icons-react";
import React from "react";
interface MODEL_DRAWER {
id: string;
name: string;
icon: string;
path: string;
}
export default function UIGlobal_DrawerCustom({
opened,
close,
component,
}: {
opened: boolean;
close: () => void;
component: React.ReactNode;
}) {
return (
<>
<Drawer
opened={opened}
onClose={() => close()}
position={"bottom"}
size={"auto"}
withCloseButton={false}
styles={{
content: {
padding: 0,
position: "absolute",
margin: "auto",
backgroundColor: "transparent",
left: 0,
right: 0,
width: 500,
},
body: {
backgroundColor: AccentColor.darkblue,
borderTop: `2px solid ${AccentColor.blue}`,
borderRight: `1px solid ${AccentColor.blue}`,
borderLeft: `1px solid ${AccentColor.blue}`,
borderRadius: "20px 20px 0px 0px",
color: "white",
paddingBottom: "5%",
},
}}
>
<Stack spacing={"xs"}>
<Group position="right">
<ActionIcon onClick={close} variant="transparent">
<IconX color="white" />
</ActionIcon>
</Group>
<Box w={"100%"} >
{component}
</Box>
</Stack>
</Drawer>
</>
);
}

23
src/app_modules/_global/ui/ui_image_preview.tsx
View File

@@ -9,6 +9,7 @@ import {
Container,
Image,
rem,
ScrollArea,
Skeleton,
Text,
Title,
@@ -20,10 +21,12 @@ import { useState } from "react";
import { MainColor } from "../color";
import UIGlobal_LayoutHeaderTamplate from "./ui_header_tamplate";
import { UIHeader } from "./ui_layout_tamplate";
import ComponentGlobal_Loader from "../component/loader";
export function UIGlobal_ImagePreview({ fileId }: { fileId: string }) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const [isLoading, setIsLoading] = useState(false);
const url = APIs.GET({ fileId: fileId });
@@ -63,23 +66,31 @@ export function UIGlobal_ImagePreview({ fileId }: { fileId: string }) {
hideButtonLeft
customButtonRight={
<ActionIcon
onClick={() => router.back()}
onClick={() => {
router.back(), setIsLoading(true);
}}
variant="transparent"
>
<IconX color={MainColor.yellow} />
{isLoading ? (
<ComponentGlobal_Loader />
) : (
<IconX color={MainColor.yellow} />
)}
</ActionIcon>
}
/>
}
/>
<Box style={{ zIndex: 0 }} h={"92vh"} pos={"static"} px={"lg"}>
<Box style={{ zIndex: 0 }} h={"90vh"} pos={"static"} px={"lg"}>
{isImage === null ? (
<Skeleton height={200} radius={"sm"} />
) : isImage ? (
<Center>
<Image alt="Image" src={url} maw={400} miw={200} />
</Center>
<ScrollArea h={"100%"}>
<Center>
<Image alt="Image" src={url} maw={500} miw={200} />
</Center>
</ScrollArea>
) : (
<Box
bg={"gray"}