diff --git a/prisma/schema.prisma b/prisma/schema.prisma index 5a37e8b4..520196b8 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -113,8 +113,6 @@ model Images { Donasi_Kabar Donasi_Kabar[] Donasi_PencairanDana Donasi_PencairanDana[] Donasi_Invoice Donasi_Invoice[] - Image_Map BusinessMaps[] @relation("ImageMap") - Image_Pin BusinessMaps[] @relation("ImagePin") Investasi_Invoice Investasi_Invoice[] } @@ -926,10 +924,8 @@ model BusinessMaps { authorId String? Portofolio Portofolio? @relation(fields: [portofolioId], references: [id]) portofolioId String? @unique - ImageMap Images? @relation("ImageMap", fields: [imageMapId], references: [id], map: "MapImage") - imageMapId String? - ImagePin Images? @relation("ImagePin", fields: [imagePinId], references: [id], map: "PinImage") - imagePinId String? + imageId String? + pinId String? } // Kategori App diff --git a/public/aset/global/loading.gif b/public/aset/global/loading.gif new file mode 100644 index 00000000..e1b07ea2 Binary files /dev/null and b/public/aset/global/loading.gif differ diff --git a/public/aset/global/no-image.svg b/public/aset/global/no-image.svg new file mode 100644 index 00000000..37449107 --- /dev/null +++ b/public/aset/global/no-image.svg @@ -0,0 +1,2 @@ + +no-image \ No newline at end of file diff --git a/public/donasi/invoice/b097f87e-c2ac-475d-8c5b-e1b234b18bd7.png b/public/donasi/invoice/b097f87e-c2ac-475d-8c5b-e1b234b18bd7.png new file mode 100644 index 00000000..6f356546 Binary files /dev/null and b/public/donasi/invoice/b097f87e-c2ac-475d-8c5b-e1b234b18bd7.png differ diff --git a/public/investasi/invoice/4461efd1-2359-47c3-99ef-8999f2fed8da.jpg b/public/investasi/invoice/4461efd1-2359-47c3-99ef-8999f2fed8da.jpg new file mode 100644 index 00000000..ea83eb05 Binary files /dev/null and b/public/investasi/invoice/4461efd1-2359-47c3-99ef-8999f2fed8da.jpg differ diff --git a/public/map/foto/b41cb5aa-a45d-4ac6-84ba-ad012402b70a.jpg b/public/map/foto/b41cb5aa-a45d-4ac6-84ba-ad012402b70a.jpg new file mode 100644 index 00000000..830b275a Binary files /dev/null and b/public/map/foto/b41cb5aa-a45d-4ac6-84ba-ad012402b70a.jpg differ diff --git a/public/map/pin/b7774485-6afc-4770-95ac-fbc0c50c4fdb.png b/public/map/pin/b7774485-6afc-4770-95ac-fbc0c50c4fdb.png new file mode 100644 index 00000000..f88d76f7 Binary files /dev/null and b/public/map/pin/b7774485-6afc-4770-95ac-fbc0c50c4fdb.png differ diff --git a/src/app/contoh/page.tsx b/src/app/contoh/page.tsx index 8196cbb4..e6e3da3b 100644 --- a/src/app/contoh/page.tsx +++ b/src/app/contoh/page.tsx @@ -1,51 +1,53 @@ "use client"; -import { ComponentNotifikasi_CardSkeleton } from "@/app_modules/notifikasi/component"; -import Coba_UploadFile from "@/app_modules/zCoba/ui_coba_upload_file"; -import { Box, Button, Flex, Paper, Stack, Title } from "@mantine/core"; +import { Box, Center, Image, Loader, Text } from "@mantine/core"; +import { useShallowEffect } from "@mantine/hooks"; +import { useState } from "react"; export default function Page() { return ( <> - + ); - - return ( - - - - {Array.from(new Array(10), (_, i) => ( - - Contoh - - ))} - - - - - Ini Bagian Yang Gak Ikut - - - ); +} + +function LoadImage({ url }: { url: string }) { + const [ada, setAda] = useState(null); + + useShallowEffect(() => { + load(); + }, []); + + async function load() { + try { + const res = await fetch(url); + if (res.ok) { + return setAda(true); + } + setAda(false); + } catch (error) { + console.log(""); + } + } + + if (ada === null) + return ( + + + + ); + if (!ada) + return ( + + ); + return ; } diff --git a/src/app/dev/portofolio/main/[id]/page.tsx b/src/app/dev/portofolio/main/[id]/page.tsx index 60746aea..61d37c14 100644 --- a/src/app/dev/portofolio/main/[id]/page.tsx +++ b/src/app/dev/portofolio/main/[id]/page.tsx @@ -4,14 +4,14 @@ import { portofolio_getOneById } from "@/app_modules/katalog/portofolio/fun/get/ const mapboxToken = process.env.MAPBOX_TOKEN!; export default async function Page({ params }: { params: { id: string } }) { - const getPorto = await portofolio_getOneById(params.id); + const portofolioId = params.id; + const dataPortofolio = await portofolio_getOneById(portofolioId); const userLoginId = await funGetUserIdByToken(); return ( <> - {/* 
{JSON.stringify(getPorto, null, 2)}
*/} diff --git a/src/app_modules/_global/component/comp_load_image.tsx b/src/app_modules/_global/component/comp_load_image.tsx new file mode 100644 index 00000000..0861151d --- /dev/null +++ b/src/app_modules/_global/component/comp_load_image.tsx @@ -0,0 +1,79 @@ +"use client"; + +import { AspectRatio, Box, Center, Image } from "@mantine/core"; +import { useShallowEffect } from "@mantine/hooks"; +import { useState } from "react"; +import ComponentGlobal_Loader from "./loader"; + +export function ComponentGlobal_LoadImage({ + url, + maw, + h, +}: { + url: string; + maw?: number; + h?: number; +}) { + const [isImage, setIsImage] = useState(null); + + 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 ( +
+ +
+ ); + + if (!isImage) + return ( + <> +
+ No Image +
+ + ); + + return ( + <> + {h ? ( + Image + ) : ( + Image + )} + + ); +} diff --git a/src/app_modules/_global/component/index.ts b/src/app_modules/_global/component/index.ts index 1191da65..73a753c2 100644 --- a/src/app_modules/_global/component/index.ts +++ b/src/app_modules/_global/component/index.ts @@ -2,6 +2,7 @@ import ComponentGlobal_BoxInformation from "./box_information"; import ComponentGlobal_AvatarAndAuthorName from "./comp_author_name_and_avatar"; import { ComponentGlobal_BoxUploadImage } from "./comp_box_upload_image"; import { ComponentGlobal_CardStyles } from "./comp_card_box_and_background"; +import { ComponentGlobal_LoadImage } from "./comp_load_image"; import ComponentGlobal_CardLoadingOverlay from "./comp_loading_card"; import ComponentGlobal_TampilanAngkaRatusan from "./comp_tampilan_angka_ratusan"; import ComponentGlobal_TampilanRupiah from "./comp_tampilan_rupiah"; @@ -15,3 +16,4 @@ export { ComponentGlobal_BoxInformation }; export { ComponentGlobal_InputCountDown }; export { ComponentGlobal_CardStyles }; export { ComponentGlobal_BoxUploadImage }; +export { ComponentGlobal_LoadImage }; diff --git a/src/app_modules/admin/map/component/comp_detail_data_drawer.tsx b/src/app_modules/admin/map/component/comp_detail_data_drawer.tsx index cbf04250..88eb1f29 100644 --- a/src/app_modules/admin/map/component/comp_detail_data_drawer.tsx +++ b/src/app_modules/admin/map/component/comp_detail_data_drawer.tsx @@ -1,21 +1,21 @@ -import { RouterMap } from "@/app/lib/router_hipmi/router_map"; +import { APIs } from "@/app/lib"; import { MODEL_MAP } from "@/app_modules/map/lib/interface"; import { - Stack, AspectRatio, Box, - Grid, - Image, - Text, Button, Center, + Grid, + Image, + Stack, + Text, } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { IconBuildingSkyscraper, IconListDetails, - IconPhoneCall, IconMapPin, + IconPhoneCall, IconPinned, } from "@tabler/icons-react"; import { useState } from "react"; @@ -48,8 +48,8 @@ export function ComponentAdminMap_DetailDataDrawer({ Foto diff --git a/src/app_modules/admin/map/fun/fun_get_all_maps.ts b/src/app_modules/admin/map/fun/fun_get_all_maps.ts index 41201935..40b58bfc 100644 --- a/src/app_modules/admin/map/fun/fun_get_all_maps.ts +++ b/src/app_modules/admin/map/fun/fun_get_all_maps.ts @@ -11,7 +11,6 @@ export async function adminMap_funGetAllMaps() { isActive: true, }, include: { - ImagePin: true, Portofolio: true, }, }); diff --git a/src/app_modules/admin/map/fun/fun_get_one_by_id.ts b/src/app_modules/admin/map/fun/fun_get_one_by_id.ts index bcb7f7c7..4fc62bff 100644 --- a/src/app_modules/admin/map/fun/fun_get_one_by_id.ts +++ b/src/app_modules/admin/map/fun/fun_get_one_by_id.ts @@ -8,8 +8,6 @@ export async function adminMap_funGetOneById({ mapId }: { mapId: string }) { id: mapId, }, include: { - ImageMap: true, - ImagePin: true, Author: true, Portofolio: { include: { diff --git a/src/app_modules/admin/map/ui/ui_map_view.tsx b/src/app_modules/admin/map/ui/ui_map_view.tsx index 36348fe5..da4abf9b 100644 --- a/src/app_modules/admin/map/ui/ui_map_view.tsx +++ b/src/app_modules/admin/map/ui/ui_map_view.tsx @@ -19,6 +19,7 @@ import { ComponentAdminMap_Drawer } from "../component"; import { AccentColor } from "@/app_modules/_global/color/color_pallet"; import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; import { RouterMap } from "@/app/lib/router_hipmi/router_map"; +import { APIs } from "@/app/lib"; export function UiAdminMap_MapBoxView({ mapboxToken, @@ -88,9 +89,9 @@ export function UiAdminMap_MapBoxView({ backgroundColor: "white", }} src={ - e.imagePinId === null - ? RouterPortofolio.api_logo_porto + e.Portofolio.logoId - : RouterMap.api_custom_pin + e.imagePinId + e.pinId === null + ? APIs.GET + e.Portofolio.logoId + : APIs.GET + e.pinId } /> diff --git a/src/app_modules/job/component/detail/detail_data.tsx b/src/app_modules/job/component/detail/detail_data.tsx index 9727bcd8..c9009980 100644 --- a/src/app_modules/job/component/detail/detail_data.tsx +++ b/src/app_modules/job/component/detail/detail_data.tsx @@ -18,6 +18,7 @@ import { import { MODEL_JOB } from "../../model/interface"; import { useState } from "react"; import ComponentGlobal_Loader from "@/app_modules/_global/component/loader"; +import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component"; export default function ComponentJob_DetailData({ data, @@ -44,36 +45,37 @@ export default function ComponentJob_DetailData({ {data.imageId ? ( - - {isLoading ? ( - -
- -
- - ) : ( - "" - )} - - { - setIsLoading(false); - }} - onError={() => { - setIsLoading(false); - }} - alt="Image" - src={APIs.GET + data?.imageId} - maw={200} - /> - + ) : ( + // + // {isLoading ? ( + // + //
+ // + //
+ // + // ) : ( + // "" + // )} + + // { + // setIsLoading(false); + // }} + // onError={() => { + // setIsLoading(false); + // }} + // alt="Image" + // src={APIs.GET + data?.imageId} + // maw={200} + // /> + // "" )} diff --git a/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx b/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx new file mode 100644 index 00000000..a5600ad7 --- /dev/null +++ b/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx @@ -0,0 +1,72 @@ +"use client"; + +import { AccentColor, MainColor } from "@/app_modules/_global/color"; +import { + ComponentGlobal_NotifikasiBerhasil, + ComponentGlobal_NotifikasiGagal, + ComponentGlobal_NotifikasiPeringatan, +} from "@/app_modules/_global/notif_global"; +import { Button } from "@mantine/core"; + +import { useRouter } from "next/navigation"; +import { useState } from "react"; +import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; +import { DIRECTORY_ID } from "@/app/lib"; +import { portofolio_funEditLogoBisnisById } from "../../fun"; + +export function ComponentPortofolio_ButtonEditLogoBisnis({ + file, + portofolioId, +}: { + file: File; + portofolioId: string; +}) { + const router = useRouter(); + const [loading, setLoading] = useState(false); + async function onUpdate() { + const uploadFileToStorage = await funGlobal_UploadToStorage({ + file: file, + dirId: DIRECTORY_ID.portofolio_logo, + }); + + if (!uploadFileToStorage.success) + return ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar"); + + const res = await portofolio_funEditLogoBisnisById({ + portofolioId: portofolioId, + logoId: uploadFileToStorage.data.id, + }); + if (res.status === 200) { + setLoading(true); + ComponentGlobal_NotifikasiBerhasil(res.message); + router.back(); + } else { + ComponentGlobal_NotifikasiGagal(res.message); + } + } + return ( + <> + {file ? ( + + ) : ( + + )} + + ); +} diff --git a/src/app_modules/katalog/portofolio/component/button/comp_button_selanjutnya.tsx b/src/app_modules/katalog/portofolio/component/button/comp_button_selanjutnya.tsx index 561e8437..79693a3e 100644 --- a/src/app_modules/katalog/portofolio/component/button/comp_button_selanjutnya.tsx +++ b/src/app_modules/katalog/portofolio/component/button/comp_button_selanjutnya.tsx @@ -1,6 +1,7 @@ import { RouterMap } from "@/app/lib/router_hipmi/router_map"; import { MainColor } from "@/app_modules/_global/color"; import { + ComponentGlobal_NotifikasiBerhasil, ComponentGlobal_NotifikasiGagal, ComponentGlobal_NotifikasiPeringatan, } from "@/app_modules/_global/notif_global"; @@ -42,23 +43,23 @@ export function Portofolio_ComponentButtonSelanjutnya({ if (_.values(porto).includes("")) return ComponentGlobal_NotifikasiPeringatan("Lengkapi Data"); - const uploadFile = await funGlobal_UploadToStorage({ + const uploadFileToStorage = await funGlobal_UploadToStorage({ file: file, dirId: DIRECTORY_ID.portofolio_logo, }); - if (!uploadFile.success) + if (!uploadFileToStorage.success) return ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar"); const res = await funCreatePortofolio({ profileId: profileId, data: dataPortofolio as any, medsos: dataMedsos, - fileId: uploadFile.data.id, + fileId: uploadFileToStorage.data.id, }); if (res.status === 201) { setLoading(true); - // ComponentGlobal_NotifikasiBerhasil("Berhasil disimpan"); + ComponentGlobal_NotifikasiBerhasil("Berhasil disimpan"); router.replace(RouterMap.create + res.id, { scroll: false }); } else { ComponentGlobal_NotifikasiGagal("Gagal disimpan"); diff --git a/src/app_modules/katalog/portofolio/component/detail_data_drawer_map.tsx b/src/app_modules/katalog/portofolio/component/detail_data_drawer_map.tsx index ef68cee8..0245193b 100644 --- a/src/app_modules/katalog/portofolio/component/detail_data_drawer_map.tsx +++ b/src/app_modules/katalog/portofolio/component/detail_data_drawer_map.tsx @@ -1,8 +1,10 @@ "use client"; +import { APIs } from "@/app/lib"; import { RouterMap } from "@/app/lib/router_hipmi/router_map"; import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header"; import { MainColor } from "@/app_modules/_global/color/color_pallet"; +import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component"; import { ComponentMap_SkeletonDrawerDetailData } from "@/app_modules/map/_component"; import { map_funGetOneById } from "@/app_modules/map/fun/get/fun_get_one_by_id"; import { MODEL_MAP } from "@/app_modules/map/lib/interface"; @@ -14,7 +16,7 @@ import { Image, SimpleGrid, Stack, - Text + Text, } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { @@ -39,7 +41,7 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) { setData(res); } - if(!data) return + if (!data) return ; return ( <> @@ -59,13 +61,14 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) { { maxWidth: 600, cols: 1, spacing: "sm" }, ]} > - + {/* Foto + alt="Photo" + src={APIs.GET + data.imageId} + /> */} @@ -114,8 +117,6 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) { - - - ) : ( - - )} + ); } - -async function onUpdate( - router: AppRouterInstance, - portoId: string, - file: FormData, - setLoading: any -) { - const gambar = new FormData(); - gambar.append("file", file as any); - - await Portofolio_funEditLogoBisnisById(portoId, gambar).then((res) => { - if (res.status === 200) { - setLoading(true); - ComponentGlobal_NotifikasiBerhasil(res.message); - router.back(); - } else { - ComponentGlobal_NotifikasiGagal(res.message); - } - }); -} diff --git a/src/app_modules/katalog/portofolio/fun/edit/fun_edit_logo_bisnis_by_id.ts b/src/app_modules/katalog/portofolio/fun/edit/fun_edit_logo_bisnis_by_id.ts index 37af9b3f..5ed431af 100644 --- a/src/app_modules/katalog/portofolio/fun/edit/fun_edit_logo_bisnis_by_id.ts +++ b/src/app_modules/katalog/portofolio/fun/edit/fun_edit_logo_bisnis_by_id.ts @@ -1,41 +1,21 @@ "use server"; import prisma from "@/app/lib/prisma"; -import _ from "lodash"; -import { v4 } from "uuid"; -import fs from "fs"; import { revalidatePath } from "next/cache"; -export async function Portofolio_funEditLogoBisnisById( - portoId: string, - file: FormData -) { - const gambar: any = file.get("file"); - const fileName = gambar.name; - const fileExtension = _.lowerCase(gambar.name.split(".").pop()); - const randomNameFile = v4(fileName) + "." + fileExtension; - - const upload = await prisma.images.create({ - data: { - url: randomNameFile, - label: "PORTOFOLIO_LOGO", - }, - select: { - id: true, - url: true, - }, - }); - - if (!upload) return { status: 400, message: "Gagal upload gambar" }; - const upload_toFolder = Buffer.from(await gambar.arrayBuffer()); - fs.writeFileSync(`./public/portofolio/logo/${upload.url}`, upload_toFolder); - +export async function portofolio_funEditLogoBisnisById({ + portofolioId, + logoId, +}: { + portofolioId: string; + logoId: string; +}) { const updatePorto = await prisma.portofolio.update({ where: { - id: portoId, + id: portofolioId, }, data: { - logoId: upload.id, + logoId: logoId, }, }); diff --git a/src/app_modules/katalog/portofolio/fun/get/get_one_portofolio.ts b/src/app_modules/katalog/portofolio/fun/get/get_one_portofolio.ts index 5baca6d4..edc40140 100644 --- a/src/app_modules/katalog/portofolio/fun/get/get_one_portofolio.ts +++ b/src/app_modules/katalog/portofolio/fun/get/get_one_portofolio.ts @@ -9,7 +9,6 @@ export async function portofolio_getOneById(portoId: string) { id: portoId, }, include: { - Logo: true, MasterBidangBisnis: { select: { id: true, @@ -31,8 +30,6 @@ export async function portofolio_getOneById(portoId: string) { BusinessMaps: { include: { Author: true, - ImageMap: true, - ImagePin: true, }, }, }, diff --git a/src/app_modules/katalog/portofolio/fun/index.ts b/src/app_modules/katalog/portofolio/fun/index.ts new file mode 100644 index 00000000..6bacd517 --- /dev/null +++ b/src/app_modules/katalog/portofolio/fun/index.ts @@ -0,0 +1,3 @@ +import { portofolio_funEditLogoBisnisById } from "./edit/fun_edit_logo_bisnis_by_id"; + +export { portofolio_funEditLogoBisnisById }; diff --git a/src/app_modules/katalog/portofolio/ui/ui_detail_data.tsx b/src/app_modules/katalog/portofolio/ui/ui_detail_data.tsx index a6927246..ee11c691 100644 --- a/src/app_modules/katalog/portofolio/ui/ui_detail_data.tsx +++ b/src/app_modules/katalog/portofolio/ui/ui_detail_data.tsx @@ -1,29 +1,30 @@ -import { - Paper, - Title, - Stack, - Grid, - Text, - SimpleGrid, - Box, - AspectRatio, - Image, - Group, - Divider, -} from "@mantine/core"; -import { - IconBuildingSkyscraper, - IconPhoneCall, - IconMapPin, - IconListDetails, - IconPinned, -} from "@tabler/icons-react"; -import { MODEL_PORTOFOLIO } from "../model/interface"; +import { APIs } from "@/app/lib"; import { AccentColor, MainColor, } from "@/app_modules/_global/color/color_pallet"; -import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; +import { + AspectRatio, + Box, + Divider, + Grid, + Group, + Image, + Paper, + SimpleGrid, + Stack, + Text, + Title, +} from "@mantine/core"; +import { + IconBuildingSkyscraper, + IconListDetails, + IconMapPin, + IconPhoneCall, + IconPinned, +} from "@tabler/icons-react"; +import { MODEL_PORTOFOLIO } from "../model/interface"; +import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component"; export function Portofolio_UiDetailData({ dataPorto, @@ -47,7 +48,9 @@ export function Portofolio_UiDetailData({ Data Bisnis id: {" "} - #{dataPorto.id_Portofolio} + + #{dataPorto.id_Portofolio} + @@ -61,17 +64,19 @@ export function Portofolio_UiDetailData({ ]} > - - + + + {/* Foto - - + */} + diff --git a/src/app_modules/katalog/portofolio/ui/ui_detail_map.tsx b/src/app_modules/katalog/portofolio/ui/ui_detail_map.tsx index 1ecfaffe..237dfb92 100644 --- a/src/app_modules/katalog/portofolio/ui/ui_detail_map.tsx +++ b/src/app_modules/katalog/portofolio/ui/ui_detail_map.tsx @@ -1,12 +1,11 @@ "use client"; -import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; -import { RouterMap } from "@/app/lib/router_hipmi/router_map"; +import { APIs } from "@/app/lib"; import { AccentColor } from "@/app_modules/_global/color/color_pallet"; import { ComponentMap_DrawerDetailData } from "@/app_modules/map/_component"; import { defaultMapZoom } from "@/app_modules/map/lib/default_lat_long"; import { MODEL_MAP } from "@/app_modules/map/lib/interface"; -import { Image, Paper, Stack, Title } from "@mantine/core"; +import { Avatar, Image, Paper, Stack, Title } from "@mantine/core"; import "mapbox-gl/dist/mapbox-gl.css"; import { useState } from "react"; import { @@ -17,7 +16,7 @@ import { ScaleControl, } from "react-map-gl"; import { ComponentPortofolio_DetailDataMap } from "../component"; -import { MODEL_LOGO, MODEL_PORTOFOLIO } from "../model/interface"; +import { MODEL_PORTOFOLIO } from "../model/interface"; export function Portofolio_UiMap({ mapboxToken, @@ -45,7 +44,7 @@ export function Portofolio_UiMap({ @@ -55,11 +54,11 @@ export function Portofolio_UiMap({ function MapView({ mapboxToken, data, - dataLogo, + logoId, }: { mapboxToken: string; data: MODEL_MAP; - dataLogo: MODEL_LOGO; + logoId: string; }) { const [openDrawer, setOpenDrawer] = useState(false); @@ -98,17 +97,14 @@ function MapView({ pitchAlignment="auto" > - image diff --git a/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio.tsx b/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio.tsx index 883207dd..71167791 100644 --- a/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio.tsx +++ b/src/app_modules/katalog/portofolio/ui/ui_detail_portofolio.tsx @@ -22,7 +22,6 @@ export default function Portofolio_UiDetail({ - {/* */} + + + ); +} diff --git a/src/app_modules/map/_component/button/comp_button_update_data_map.tsx b/src/app_modules/map/_component/button/comp_button_update_data_map.tsx new file mode 100644 index 00000000..749f0efa --- /dev/null +++ b/src/app_modules/map/_component/button/comp_button_update_data_map.tsx @@ -0,0 +1,72 @@ +"use client"; + +import { MainColor } from "@/app_modules/_global/color"; +import { + ComponentGlobal_NotifikasiBerhasil, + ComponentGlobal_NotifikasiGagal, + ComponentGlobal_NotifikasiPeringatan, +} from "@/app_modules/_global/notif_global"; +import { Button } from "@mantine/core"; + +import { map_funEditMap } from "../../fun/edit/fun_edit_map"; +import { MODEL_MAP } from "../../lib/interface"; +import { useRouter } from "next/navigation"; +import { DIRECTORY_ID } from "@/app/lib"; +import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; +import { useState } from "react"; + +export function ComponentMap_ButtonUpdateDataMap({ + data, + file, +}: { + data: MODEL_MAP; + file: File; +}) { + const router = useRouter(); + const [isLoading, setIsLoading] = useState(false); + async function onSavePin() { + if (file !== null) { + const uploadFileToStorage = await funGlobal_UploadToStorage({ + file: file, + dirId: DIRECTORY_ID.map_image, + }); + if (!uploadFileToStorage.success) + return ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar"); + + const res = await map_funEditMap({ + data: data, + fileId: uploadFileToStorage.data.id, + }); + res.status === 200 + ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back()) + : ComponentGlobal_NotifikasiGagal(res.message); + } else { + const res = await map_funEditMap({ + data: data, + }); + res.status === 200 + ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back()) + : ComponentGlobal_NotifikasiGagal(res.message); + } + setIsLoading(true); + } + + return ( + <> + + + ); +} diff --git a/src/app_modules/map/_component/detail_data.tsx b/src/app_modules/map/_component/detail_data.tsx index 8578e1a0..5eab05a6 100644 --- a/src/app_modules/map/_component/detail_data.tsx +++ b/src/app_modules/map/_component/detail_data.tsx @@ -25,6 +25,8 @@ import { useState } from "react"; import { map_funGetOneById } from "../fun/get/fun_get_one_by_id"; import { MODEL_MAP } from "../lib/interface"; import { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data"; +import { APIs } from "@/app/lib"; +import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component"; export function ComponentMap_DetailData({ mapId }: { mapId: any }) { const router = useRouter(); @@ -59,13 +61,8 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) { { maxWidth: 600, cols: 1, spacing: "sm" }, ]} > - Foto + + {/* Photo */} diff --git a/src/app_modules/map/_component/index.ts b/src/app_modules/map/_component/index.ts index ee9113d6..a41439fe 100644 --- a/src/app_modules/map/_component/index.ts +++ b/src/app_modules/map/_component/index.ts @@ -1,3 +1,8 @@ +import { ComponentMap_ButtonSavePin } from "./button/comp_button_save_pin"; +import { ComponentMap_ButtonUpdateDataMap } from "./button/comp_button_update_data_map"; + export { ComponentMap_Header } from "./header"; export { ComponentMap_DrawerDetailData } from "./drawer"; export { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data"; +export { ComponentMap_ButtonSavePin }; +export { ComponentMap_ButtonUpdateDataMap }; diff --git a/src/app_modules/map/fun/create/fun_create_pin.ts b/src/app_modules/map/fun/create/fun_create_pin.ts index 05c00366..95b942a4 100644 --- a/src/app_modules/map/fun/create/fun_create_pin.ts +++ b/src/app_modules/map/fun/create/fun_create_pin.ts @@ -3,42 +3,24 @@ import prisma from "@/app/lib/prisma"; import { RouterMap } from "@/app/lib/router_hipmi/router_map"; import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; -import fs from "fs"; -import _ from "lodash"; +import { Prisma } from "@prisma/client"; import { revalidatePath } from "next/cache"; -import { v4 } from "uuid"; -export async function map_funCreatePin({ data }: { data: any }) { +export async function map_funCreatePin({ + data, +}: { + data: Prisma.BusinessMapsCreateInput; +}) { const userLoginId = await funGetUserIdByToken(); - const gambar: any = data.gambar.get("file"); - const fileName = gambar.name; - const fileExtension = _.lowerCase(gambar.name.split(".").pop()); - const fRandomName = v4(fileName) + "." + fileExtension; - - const uploadImage = await prisma.images.create({ - data: { - url: fRandomName, - label: "MAP_PHOTO", - }, - select: { - id: true, - url: true, - }, - }); - - if (!uploadImage) return { status: 400, message: "Gagal upload foto lokasi" }; - const upload_Folder = Buffer.from(await gambar.arrayBuffer()); - fs.writeFileSync(`./public/map/foto/${uploadImage.url}`, upload_Folder); - const create = await prisma.businessMaps.create({ data: { - latitude: data.lat, - longitude: data.long, + latitude: data.latitude, + longitude: data.longitude, namePin: data.namePin, - portofolioId: data?.portofolioId, + portofolioId: data.Portofolio?.create?.id, authorId: userLoginId, - imageMapId: uploadImage.id, + imageId: data.imageId, }, }); diff --git a/src/app_modules/map/fun/edit/fun_custom_pin_map.ts b/src/app_modules/map/fun/edit/fun_custom_pin_map.ts index 85cadf6d..bc97b941 100644 --- a/src/app_modules/map/fun/edit/fun_custom_pin_map.ts +++ b/src/app_modules/map/fun/edit/fun_custom_pin_map.ts @@ -1,50 +1,26 @@ "use server"; import prisma from "@/app/lib/prisma"; -import _ from "lodash"; -import { v4 } from "uuid"; -import fs from "fs"; -import { revalidatePath } from "next/cache"; import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; +import { revalidatePath } from "next/cache"; export async function map_funCustomPinMap({ mapId, - file, + fileId, }: { mapId: string; - file: FormData; + fileId: string; }) { - - const newPin: any = file.get("file"); - const fileName = newPin.name; - const fileExtension = _.lowerCase(newPin.name.split(".").pop()); - const fileRandomName = v4(fileName) + "." + fileExtension; - - const uploadPin = await prisma.images.create({ - data: { - url: fileRandomName, - label: "MAP_CUSTOM_PIN", - }, - select: { - id: true, - url: true, - }, - }); - - if (!uploadPin) return { status: 400, message: "Gagal upload foto lokasi" }; - const upload_Folder = Buffer.from(await newPin.arrayBuffer()); - fs.writeFileSync(`./public/map/pin/${uploadPin.url}`, upload_Folder); - const updt = await prisma.businessMaps.update({ where: { id: mapId, }, data: { - imagePinId: uploadPin.id, + pinId: fileId, }, }); if (!updt) return { status: 400, message: "Gagal update pin" }; - revalidatePath(RouterPortofolio.main_detail) + revalidatePath(RouterPortofolio.main_detail); return { status: 200, message: "Berhasil update pin" }; } diff --git a/src/app_modules/map/fun/edit/fun_edit_map.ts b/src/app_modules/map/fun/edit/fun_edit_map.ts index 5fef7c09..c0f25526 100644 --- a/src/app_modules/map/fun/edit/fun_edit_map.ts +++ b/src/app_modules/map/fun/edit/fun_edit_map.ts @@ -1,45 +1,18 @@ "use server"; -import _, { update } from "lodash"; -import { MODEL_MAP } from "../../lib/interface"; -import { v4 } from "uuid"; import prisma from "@/app/lib/prisma"; -import fs from "fs"; -import { revalidatePath } from "next/cache"; import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; +import { revalidatePath } from "next/cache"; +import { MODEL_MAP } from "../../lib/interface"; export async function map_funEditMap({ data, - file, - + fileId, }: { data: MODEL_MAP; - file: FormData; + fileId?: string; }) { - // console.log(data, file); - - const gambar: any = file.get("file"); - if (gambar !== "null") { - const fileName = gambar.name; - const fileExtension = _.lowerCase(gambar.name.split(".").pop()); - const fRandomName = v4(fileName) + "." + fileExtension; - - const uploadImage = await prisma.images.create({ - data: { - url: fRandomName, - label: "MAP_PHOTO", - }, - select: { - id: true, - url: true, - }, - }); - - if (!uploadImage) - return { status: 400, message: "Gagal upload foto lokasi" }; - const upload_Folder = Buffer.from(await gambar.arrayBuffer()); - fs.writeFileSync(`./public/map/foto/${uploadImage.url}`, upload_Folder); - + if (fileId === undefined || fileId === null) { const updt = await prisma.businessMaps.update({ where: { id: data.id, @@ -48,25 +21,25 @@ export async function map_funEditMap({ latitude: data.latitude, longitude: data.longitude, namePin: data.namePin, - imageMapId: uploadImage.id, }, }); - if (!updt) return { status: 400, message: "Gagal update data" }; + revalidatePath(RouterPortofolio.main_detail); + return { status: 200, message: "Berhasil update" }; + } else { + const updt = await prisma.businessMaps.update({ + where: { + id: data.id, + }, + data: { + latitude: data.latitude, + longitude: data.longitude, + namePin: data.namePin, + imageId: fileId, + }, + }); + if (!updt) return { status: 400, message: "Gagal update data" }; + revalidatePath(RouterPortofolio.main_detail); + return { status: 200, message: "Berhasil update" }; } - - const updt = await prisma.businessMaps.update({ - where: { - id: data.id, - }, - data: { - latitude: data.latitude, - longitude: data.longitude, - namePin: data.namePin, - }, - }); - if (!updt) return { status: 400, message: "Gagal update data" }; - - revalidatePath(RouterPortofolio.main_detail); - return { status: 200, message: "Berhasil update" }; } diff --git a/src/app_modules/map/fun/get/fun_get_one_by_id.ts b/src/app_modules/map/fun/get/fun_get_one_by_id.ts index 1ac1f3c6..16def938 100644 --- a/src/app_modules/map/fun/get/fun_get_one_by_id.ts +++ b/src/app_modules/map/fun/get/fun_get_one_by_id.ts @@ -7,7 +7,7 @@ export async function map_funGetOneById({ mapId }: { mapId: string }) { where: { id: mapId, }, - select: { + include: { Author: { select: { id: true, @@ -20,15 +20,6 @@ export async function map_funGetOneById({ mapId }: { mapId: string }) { }, }, }, - id: true, - isActive: true, - createdAt: true, - updatedAt: true, - namePin: true, - latitude: true, - longitude: true, - authorId: true, - imageMapId: true, Portofolio: { select: { id: true, diff --git a/src/app_modules/map/fun/get/fun_get_one_by_portofolio_id.ts b/src/app_modules/map/fun/get/fun_get_one_by_portofolio_id.ts index 772336bf..81355a48 100644 --- a/src/app_modules/map/fun/get/fun_get_one_by_portofolio_id.ts +++ b/src/app_modules/map/fun/get/fun_get_one_by_portofolio_id.ts @@ -12,12 +12,9 @@ export async function map_funGetOneBusinessMapByPortofolioId({ portofolioId: portofolioId, }, include: { - ImageMap: true, - ImagePin: true, Portofolio: { select: { id: true, - Logo: true, logoId: true } } diff --git a/src/app_modules/map/lib/interface.ts b/src/app_modules/map/lib/interface.ts index d1c08054..fa1123c0 100644 --- a/src/app_modules/map/lib/interface.ts +++ b/src/app_modules/map/lib/interface.ts @@ -12,9 +12,7 @@ export interface MODEL_MAP { authorId: string; Author: MODEL_USER; portofolioId: string; - Portofolio: MODEL_PORTOFOLIO - imageMapId: string - ImageMap: any - imagePinId: string - ImagePin: any + Portofolio: MODEL_PORTOFOLIO; + imageId: string; + pinId: string; } diff --git a/src/app_modules/map/ui/ui_create_pin.tsx b/src/app_modules/map/ui/ui_create_pin.tsx index be6de6d3..db5e656c 100644 --- a/src/app_modules/map/ui/ui_create_pin.tsx +++ b/src/app_modules/map/ui/ui_create_pin.tsx @@ -4,12 +4,10 @@ import { AccentColor, MainColor, } from "@/app_modules/_global/color/color_pallet"; -import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; -import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; +import { ComponentGlobal_BoxUploadImage } from "@/app_modules/_global/component"; import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan"; import { AspectRatio, - Box, Button, Center, FileButton, @@ -22,7 +20,6 @@ import { } from "@mantine/core"; import { IconCamera } from "@tabler/icons-react"; import _ from "lodash"; -import { useRouter } from "next/navigation"; import { useState } from "react"; import Map, { AttributionControl, @@ -30,7 +27,7 @@ import Map, { NavigationControl, ScaleControl, } from "react-map-gl"; -import { map_funCreatePin } from "../fun/create/fun_create_pin"; +import { ComponentMap_ButtonSavePin } from "../_component"; import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long"; export function UiMap_CreatePin({ @@ -116,52 +113,26 @@ export function UiMap_CreatePin({ - {img ? ( - - + + {img ? ( + Foto - - - ) : ( - - - - - Foto Lokasi Bisnis - - Upload foto lokasi bisnis anda untuk ditampilkan dalam - detail map - - - - - - )} + + ) : ( + + Foto Lokasi Bisnis + + Upload foto lokasi bisnis anda untuk ditampilkan dalam detail + map + + + )} +
- ); } - -function ButtonSavePin({ - namePin, - lat, - long, - portofolioId, - file, -}: { - namePin: string; - lat: string; - long: string; - portofolioId: string; - file: FormData; -}) { - const router = useRouter(); - async function onSavePin() { - const gambar = new FormData(); - gambar.append("file", file as any); - - const res = await map_funCreatePin({ - data: { namePin, lat, long, portofolioId, gambar }, - }); - res.status === 200 - ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back()) - : ComponentGlobal_NotifikasiGagal(res.message); - } - - return ( - <> - - - ); -} diff --git a/src/app_modules/map/ui/ui_custom_pin.tsx b/src/app_modules/map/ui/ui_custom_pin.tsx index ac3e0cd8..2c66d97d 100644 --- a/src/app_modules/map/ui/ui_custom_pin.tsx +++ b/src/app_modules/map/ui/ui_custom_pin.tsx @@ -11,13 +11,7 @@ import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empt import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan"; -import { - Avatar, - Button, - Center, - FileButton, - Stack -} from "@mantine/core"; +import { Avatar, Button, Center, FileButton, Stack } from "@mantine/core"; import { IconCamera } from "@tabler/icons-react"; import { useRouter } from "next/navigation"; import { useState } from "react"; @@ -31,6 +25,8 @@ import { import { map_funCustomPinMap } from "../fun"; import { defaultMapZoom } from "../lib/default_lat_long"; import { MODEL_MAP } from "../lib/interface"; +import { APIs, DIRECTORY_ID } from "@/app/lib"; +import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; export function UiMap_CustomPin({ dataMap, @@ -62,7 +58,7 @@ export function UiMap_CustomPin({ - {/* Foto Usaha */} + {/* Photo Usaha */} - + - {img ? ( + + {img ? ( + + Photo + + ) : ( + + )} + + + {/* {img ? ( Foto @@ -161,13 +184,13 @@ export function UiMap_EditMap({ > Foto - )} + )} */}
- + ); } -function ButtonSavePin({ data, file }: { data: MODEL_MAP; file: FormData }) { - const router = useRouter(); - async function onSavePin() { - const gambar = new FormData(); - gambar.append("file", file as any); - const res = await map_funEditMap({ - data: data, - file: gambar, - }); - res.status === 200 - ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back()) - : ComponentGlobal_NotifikasiGagal(res.message); - } - - return ( - <> - - - ); -} diff --git a/src/app_modules/map/ui/ui_map.tsx b/src/app_modules/map/ui/ui_map.tsx index be6cd1a3..77f66f70 100644 --- a/src/app_modules/map/ui/ui_map.tsx +++ b/src/app_modules/map/ui/ui_map.tsx @@ -1,8 +1,8 @@ "use client"; -import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; -import { RouterMap } from "@/app/lib/router_hipmi/router_map"; +import { APIs } from "@/app/lib"; import { AccentColor } from "@/app_modules/_global/color/color_pallet"; +import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data"; import { Avatar, Stack } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import "mapbox-gl/dist/mapbox-gl.css"; @@ -18,7 +18,6 @@ import { ComponentMap_DetailData } from "../_component/detail_data"; import { map_funGetAllMap } from "../fun/get/fun_get_all_map"; import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long"; import { MODEL_MAP } from "../lib/interface"; -import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data"; export function UiMap_MapBoxView({ mapboxToken, @@ -91,9 +90,9 @@ export function UiMap_MapBoxView({ backgroundColor: "white", }} src={ - e.imagePinId === null - ? RouterPortofolio.api_logo_porto + e.Portofolio.logoId - : RouterMap.api_custom_pin + e.imagePinId + e.pinId === null + ? APIs.GET + e.Portofolio.logoId + : APIs.GET + e.pinId } /> diff --git a/src/lib/routes.ts b/src/lib/routes.ts index c339a1f9..ae24178e 100644 --- a/src/lib/routes.ts +++ b/src/lib/routes.ts @@ -1,3 +1,4 @@ + export const pages = { "/": "/", "/zCoba": "/zCoba",