diff --git a/src/app/api/new/home/route.ts b/src/app/api/new/home/route.ts index 3e07f313..bdb110d8 100644 --- a/src/app/api/new/home/route.ts +++ b/src/app/api/new/home/route.ts @@ -1,6 +1,7 @@ import { prisma } from "@/app/lib"; import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import { NextResponse } from "next/server"; +export const dynamic = "force-dynamic"; // GET DATA HOME diff --git a/src/app/api/new/map/[id]/route.ts b/src/app/api/new/map/[id]/route.ts new file mode 100644 index 00000000..8047965d --- /dev/null +++ b/src/app/api/new/map/[id]/route.ts @@ -0,0 +1,76 @@ +import { prisma } from "@/app/lib"; +import { NextResponse } from "next/server"; +export const dynamic = "force-dynamic"; + +export async function GET(request: Request, context: { params: { id: string } }) { + try { + const { id } = context.params + const data = await prisma.businessMaps.findUnique({ + where: { + id: id, + }, + select: { + namePin: true, + latitude: true, + longitude: true, + pinId: true, + imageId: true, + Author: { + select: { + Profile: { + select: { + id: true, + name: true, + imageId: true, + } + } + } + }, + Portofolio: { + select: { + id: true, + alamatKantor: true, + tlpn: true, + deskripsi: true, + namaBisnis: true, + MasterBidangBisnis: { + select: { + name: true, + }, + }, + }, + }, + } + }); + + const dataLokasi = { + namePin: data?.namePin, + latitude: data?.latitude, + longitude: data?.longitude, + pinId: data?.pinId, + imageId: data?.imageId, + } + + const dataAuthor = { + id: data?.Author?.Profile?.id, + name: data?.Author?.Profile?.name, + imageId: data?.Author?.Profile?.imageId, + } + + const dataBisnis = { + id: data?.Portofolio?.id, + alamatKantor: data?.Portofolio?.alamatKantor, + tlpn: data?.Portofolio?.tlpn, + deskripsi: data?.Portofolio?.deskripsi, + namaBisnis: data?.Portofolio?.namaBisnis, + bidangBisnis: data?.Portofolio?.MasterBidangBisnis?.name, + } + + return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", dataLokasi, dataAuthor, dataBisnis }, { status: 200 }); + + } + catch (error) { + console.error(error); + return NextResponse.json({ success: false, message: "Gagal mendapatkan data, coba lagi nanti ", reason: (error as Error).message, }, { status: 500 }); + } +} \ No newline at end of file diff --git a/src/app/api/new/map/route.ts b/src/app/api/new/map/route.ts new file mode 100644 index 00000000..7a07e5ec --- /dev/null +++ b/src/app/api/new/map/route.ts @@ -0,0 +1,40 @@ +import { prisma } from "@/app/lib"; +import _ from "lodash"; +import { NextResponse } from "next/server"; +export const dynamic = "force-dynamic"; + + +// GET ALL DATA MAP +export async function GET(request: Request) { + try { + const data = await prisma.businessMaps.findMany({ + where: { + isActive: true, + }, + select: { + id: true, + namePin: true, + latitude: true, + longitude: true, + pinId: true, + Portofolio: { + select: { + logoId: true, + } + } + } + }); + + const dataFix = data.map((v: any) => ({ + ..._.omit(v, ["Portofolio"]), + logoId: v.Portofolio.logoId + })) + + return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: dataFix }, { status: 200 }); + + } + catch (error) { + console.error(error); + return NextResponse.json({ success: false, message: "Gagal mendapatkan data, coba lagi nanti ", reason: (error as Error).message, }, { status: 500 }); + } +} \ No newline at end of file diff --git a/src/app/api/new/portofolio/[id]/route.ts b/src/app/api/new/portofolio/[id]/route.ts index 5d783cb5..747cabd0 100644 --- a/src/app/api/new/portofolio/[id]/route.ts +++ b/src/app/api/new/portofolio/[id]/route.ts @@ -1,6 +1,7 @@ import { prisma } from "@/app/lib"; import { NextResponse } from "next/server"; import fs from "fs"; +export const dynamic = "force-dynamic"; diff --git a/src/app/api/new/portofolio/route.ts b/src/app/api/new/portofolio/route.ts index b25478d5..fbf91221 100644 --- a/src/app/api/new/portofolio/route.ts +++ b/src/app/api/new/portofolio/route.ts @@ -1,5 +1,6 @@ import { prisma } from "@/app/lib"; import { NextResponse } from "next/server"; +export const dynamic = "force-dynamic"; // GET ALL DATA PORTOFOLIO BY PROFILE ID diff --git a/src/app/api/new/user/route.ts b/src/app/api/new/user/route.ts index 73a4fb52..8f710f53 100644 --- a/src/app/api/new/user/route.ts +++ b/src/app/api/new/user/route.ts @@ -1,5 +1,6 @@ import { prisma } from "@/app/lib"; import { NextResponse } from "next/server"; +export const dynamic = "force-dynamic"; // GET ONE DATA USER PROFILE BY PROFILE ID diff --git a/src/app/dev/map/main/page.tsx b/src/app/dev/map/main/page.tsx index 8b1b6fd6..f7867fa4 100644 --- a/src/app/dev/map/main/page.tsx +++ b/src/app/dev/map/main/page.tsx @@ -1,13 +1,13 @@ -import { map_funGetAllMap } from "@/app_modules/map/fun/get/fun_get_all_map"; -import { Map_View } from "@/app_modules/map/view"; +import { Map_ViewNew } from "@/app_modules/map/view/main_view_new"; const mapboxToken = process.env.MAPBOX_TOKEN!; export default async function Page() { - const dataMap = await map_funGetAllMap(); + // const dataMap = await map_funGetAllMap(); return ( <> - + {/* */} + ); } diff --git a/src/app_modules/map/_component/detail_data.tsx b/src/app_modules/map/_component/detail_data.tsx index d76b7b5c..91686323 100644 --- a/src/app_modules/map/_component/detail_data.tsx +++ b/src/app_modules/map/_component/detail_data.tsx @@ -74,7 +74,7 @@ export function ComponentMap_DetailData({ - +{data?.Portofolio.tlpn} + {data?.Portofolio.tlpn} diff --git a/src/app_modules/map/_component/drawer_new.tsx b/src/app_modules/map/_component/drawer_new.tsx new file mode 100644 index 00000000..1a571316 --- /dev/null +++ b/src/app_modules/map/_component/drawer_new.tsx @@ -0,0 +1,206 @@ +import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; +import { AccentColor, MainColor } from "@/app_modules/_global/color"; +import { ComponentGlobal_LoaderAvatar } from "@/app_modules/_global/component"; +import { ActionIcon, Box, Button, Drawer, Grid, Group, Skeleton, Stack, Text, Title } from "@mantine/core"; +import { useShallowEffect } from "@mantine/hooks"; +import { IconBuildingSkyscraper, IconListDetails, IconMapPin, IconPhoneCall, IconX } from "@tabler/icons-react"; +import { useRouter } from "next/navigation"; +import { useState } from "react"; +import { apiGetOneMapById } from "../lib/api_map"; +import { IDataMap, IDataMapDetailAuthor, IDataMapDetailBisnis } from "../lib/type_map"; +import { ComponentMap_LoadImageMap } from "./comp_load_image_map"; +import { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data"; + + + + + +// SALAHHHHHHHH ---- HARUS ULANGG +export function ComponentMap_DrawerDetailDataNew({ opened, close, mapId, }: { opened: boolean; close: () => void; mapId: string }) { + const router = useRouter(); + const [dataLokasi, setDataLokasi] = useState() + const [dataAuthor, setDataAuthor] = useState() + const [dataBisnis, setDataBisnis] = useState() + const [loading, setLoading] = useState(false) + + useShallowEffect(() => { + onLoadData(); + }, []); + + async function onLoadData() { + try { + setLoading(true) + const response = await apiGetOneMapById(mapId) + if (response.success) { + setDataLokasi(response.dataLokasi) + setDataAuthor(response.dataAuthor) + setDataBisnis(response.dataBisnis) + } + } catch (error) { + console.error(error) + } finally { + setLoading(false) + } + } + + return ( + <> + 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%", + }, + }} + > + + + + {dataLokasi?.namePin ? ( + dataLokasi?.namePin + ) : ( + <Skeleton radius={"xl"} w={100} /> + )} + + + + + + + + + + + { + loading ? + : + + + + onCheckProfile()} + > + + + + + + onCheckProfile()} + > + {dataAuthor?.name} + + + + + + + + + + + + + + + + {dataBisnis?.namaBisnis} + + + + + + + + {dataBisnis?.bidangBisnis} + + + + + + + + +{dataBisnis?.tlpn} + + + + + + + + {dataBisnis?.alamatKantor} + + + + + + + + + + + } + + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/app_modules/map/lib/api_map.ts b/src/app_modules/map/lib/api_map.ts new file mode 100644 index 00000000..f0368959 --- /dev/null +++ b/src/app_modules/map/lib/api_map.ts @@ -0,0 +1,9 @@ +export const apiGetAllMap = async (path?: string) => { + const response = await fetch(`/api/new/map${(path) ? path : ''}`) + return await response.json().catch(() => null) +} + +export const apiGetOneMapById = async (path: string) => { + const response = await fetch(`/api/new/map/${path}`); + return await response.json().catch(() => null); +} diff --git a/src/app_modules/map/lib/type_map.ts b/src/app_modules/map/lib/type_map.ts new file mode 100644 index 00000000..f4b21aa6 --- /dev/null +++ b/src/app_modules/map/lib/type_map.ts @@ -0,0 +1,24 @@ +export interface IDataMap { + id: string + namePin: string + latitude: string + longitude: string + pinId: string + logoId: string + imageId: string +} + +export interface IDataMapDetailAuthor { + id: string + name: string + imageId: string +} + +export interface IDataMapDetailBisnis { + id: string + alamatKantor: string + tlpn: string + deskripsi: string + namaBisnis: string + bidangBisnis: string +} \ No newline at end of file diff --git a/src/app_modules/map/ui/ui_map_new.tsx b/src/app_modules/map/ui/ui_map_new.tsx new file mode 100644 index 00000000..6797cee0 --- /dev/null +++ b/src/app_modules/map/ui/ui_map_new.tsx @@ -0,0 +1,120 @@ +"use client"; +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"; +import { useState } from "react"; +import Map, { AttributionControl, Marker, NavigationControl, ScaleControl, } from "react-map-gl"; +import { ComponentMap_DetailData, ComponentMap_DrawerDetailData } from "../_component"; +import { apiGetAllMap } from "../lib/api_map"; +import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long"; +import { IDataMap } from "../lib/type_map"; + +export function UiMap_MapBoxViewNew({ mapboxToken, }: { mapboxToken: string }) { + const [mapId, setMapId] = useState(""); + const [openDrawer, setOpenDrawer] = useState(false); + const [data, setData] = useState([]); + const [loading, setLoading] = useState(false); + + useShallowEffect(() => { + onLoadData(); + }, []); + + async function onLoadData() { + try { + setLoading(true) + const response = await apiGetAllMap() + if (response.success) { + setData(response.data) + } + } catch (error) { + console.error(error) + } finally { + setLoading(false) + } + } + + if (!mapboxToken) + return ; + + return ( + <> + + { + loading ? + <> : + + {data.map((e, i) => ( + + + { + setMapId(e.id); + setOpenDrawer(true); + }} + > + + + + + ))} + + + + + + } + + + setOpenDrawer(false)} + mapId={mapId} + component={} + /> + + {/* setOpenDrawer(false)} mapId={mapId}/> */} + + ); +} diff --git a/src/app_modules/map/view/main_view_new.tsx b/src/app_modules/map/view/main_view_new.tsx new file mode 100644 index 00000000..5c9cfb0a --- /dev/null +++ b/src/app_modules/map/view/main_view_new.tsx @@ -0,0 +1,13 @@ +import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate"; +import { ComponentMap_Header } from "../_component"; +import { UiMap_MapBoxViewNew } from "../ui/ui_map_new"; + +export async function Map_ViewNew({ mapboxToken }: { mapboxToken: string }) { + return ( + <> + }> + + + + ); +}