## Deskripsi:
- Perubahan tampilan notifikasi
- Pin map sesuai logo
- Pin map bisa custom
### No Issue
This commit is contained in:
2024-08-23 14:15:11 +08:00
parent cae318c5e3
commit a6bb993b0d
75 changed files with 1602 additions and 646 deletions

View File

@@ -46,6 +46,7 @@ model User {
Admin_Notifikasi Notifikasi[] @relation("AdminNotifikasi") Admin_Notifikasi Notifikasi[] @relation("AdminNotifikasi")
User_Notifikasi Notifikasi[] @relation("UserNotifikasi") User_Notifikasi Notifikasi[] @relation("UserNotifikasi")
BusinessMaps BusinessMaps[] BusinessMaps BusinessMaps[]
Investasi_Invoice Investasi_Invoice[]
} }
model MasterUserRole { model MasterUserRole {
@@ -116,6 +117,7 @@ model Images {
Job Job[] Job Job[]
Image_Map BusinessMaps[] @relation("ImageMap") Image_Map BusinessMaps[] @relation("ImageMap")
Image_Pin BusinessMaps[] @relation("ImagePin") Image_Pin BusinessMaps[] @relation("ImagePin")
Investasi_Invoice Investasi_Invoice[]
} }
model ImagesBackground { model ImagesBackground {
@@ -180,6 +182,18 @@ model MasterStatus {
Job Job[] Job Job[]
} }
// ------------------- MASTER -------------------------- //
model MasterBank {
id String @id @default(cuid())
name String
norek String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
Investasi_Invoice Investasi_Invoice[]
}
// -------------------- INVESTASI --------------------- // // -------------------- INVESTASI --------------------- //
// Table investasi / saham // Table investasi / saham
model Investasi { model Investasi {
@@ -218,6 +232,7 @@ model Investasi {
TransaksiInvestasi TransaksiInvestasi[] TransaksiInvestasi TransaksiInvestasi[]
MasterProgresInvestasi MasterProgresInvestasi? @relation(fields: [masterProgresInvestasiId], references: [id]) MasterProgresInvestasi MasterProgresInvestasi? @relation(fields: [masterProgresInvestasiId], references: [id])
masterProgresInvestasiId String? masterProgresInvestasiId String?
Investasi_Invoice Investasi_Invoice[]
} }
model MasterPencarianInvestor { model MasterPencarianInvestor {
@@ -291,15 +306,6 @@ model BeritaInvestasi {
investasiId String investasiId String
} }
model MasterBank {
id String @id @default(cuid())
name String
norek String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
}
model MasterProgresInvestasi { model MasterProgresInvestasi {
id String @id @default(cuid()) id String @id @default(cuid())
name String name String
@@ -352,6 +358,40 @@ model MasterStatusTransaksiInvestasi {
TransaksiInvestasi TransaksiInvestasi[] TransaksiInvestasi TransaksiInvestasi[]
} }
model Investasi_Invoice {
id String @id @default(cuid())
isActive Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
nominal String
lembarTerbeli String
Investasi Investasi? @relation(fields: [investasiId], references: [id])
investasiId String?
MasterBank MasterBank? @relation(fields: [masterBankId], references: [id])
masterBankId String?
StatusInvoice InvestasiMaster_StatusInvoice? @relation(fields: [statusInvoiceId], references: [id])
statusInvoiceId String?
Author User? @relation(fields: [authorId], references: [id])
authorId String?
Images Images? @relation(fields: [imagesId], references: [id])
imagesId String?
}
model InvestasiMaster_StatusInvoice {
id String @id @default(cuid())
name String
active Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
Investasi_Invoice Investasi_Invoice[]
}
/// ---------------------------------------- DONASI ----------------------------------------- // /// ---------------------------------------- DONASI ----------------------------------------- //
model Donasi { model Donasi {
id String @id @default(cuid()) id String @id @default(cuid())
@@ -875,6 +915,7 @@ model Notifikasi {
adminId String? adminId String?
} }
// MAPS
model BusinessMaps { model BusinessMaps {
id String @id @default(cuid()) id String @id @default(cuid())
isActive Boolean @default(true) isActive Boolean @default(true)
@@ -887,8 +928,18 @@ model BusinessMaps {
authorId String? authorId String?
Portofolio Portofolio? @relation(fields: [portofolioId], references: [id]) Portofolio Portofolio? @relation(fields: [portofolioId], references: [id])
portofolioId String? @unique portofolioId String? @unique
ImageMap Images? @relation("ImageMap", fields: [imagesMapId], references: [id], map: "MapImage") ImageMap Images? @relation("ImageMap", fields: [imageMapId], references: [id], map: "MapImage")
imagesMapId String? imageMapId String?
ImagePin Images? @relation("ImagePin", fields: [imagePinId], references: [id], map: "PinImage") ImagePin Images? @relation("ImagePin", fields: [imagePinId], references: [id], map: "PinImage")
imagePinId String? imagePinId String?
} }
// Kategori App
model MasterKategoriApp {
id String @id @default(cuid())
isActive Boolean @default(true)
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
name String
value String?
}

View File

@@ -1,410 +1,9 @@
import prisma from "./../src/app/lib/prisma"; import prisma from "./../src/app/lib/prisma";
// import { generate_seeder } from "./../src/app_modules/_global/fun/generate_seeder"; import { generate_seeder } from "./../src/app_modules/_global/fun/generate_seeder";
import bidangBisnis from "./../src/bin/seeder/bidang_bisnis.json";
import collaboration_industri from "./../src/bin/seeder/colab/master_industri.json";
import collaboration_status from "./../src/bin/seeder/colab/master_status.json";
import donasi_namaBank from "./../src/bin/seeder/donasi/master_bank.json";
import donasi_durasi from "./../src/bin/seeder/donasi/master_durasi.json";
import donasi_kategori from "./../src/bin/seeder/donasi/master_kategori.json";
import donasi_status from "./../src/bin/seeder/donasi/master_status.json";
import donasi_status_invoice from "./../src/bin/seeder/donasi/master_status_invoice.json";
import event_status from "./../src/bin/seeder/event/master_status.json";
import event_tipe_acara from "./../src/bin/seeder/event/master_tipe_acara.json";
import forum_kategori_report from "./../src/bin/seeder/forum/master_report.json";
import forum_status_posting from "./../src/bin/seeder/forum/master_status.json";
import jenisProgres from "./../src/bin/seeder/investasi/master_progres.json";
import namaBank from "./../src/bin/seeder/investasi/nama_bank.json";
import pembagianDeviden from "./../src/bin/seeder/investasi/pembagian_deviden.json";
import pencarianInvestor from "./../src/bin/seeder/investasi/pencarian_investor.json";
import periodeDeviden from "./../src/bin/seeder/investasi/periode_deviden.json";
import statusInvestasi from "./../src/bin/seeder/investasi/status_investasi.json";
import statusTransaksiInvestasi from "./../src/bin/seeder/investasi/status_transaksi_investasi.json";
import master_status from "./../src/bin/seeder/master_status.json";
import nomor_admin from "./../src/bin/seeder/nomor_admin.json";
import userRole from "./../src/bin/seeder/user_role.json";
import userSeeder from "./../src/bin/seeder/user_seeder.json";
import voting_status from "./../src/bin/seeder/voting/master_status.json";
(async () => { (async () => {
console.log("start"); console.log("start");
for (let i of userRole) { await generate_seeder();
await prisma.masterUserRole.upsert({
where: {
id: i.id.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
},
create: {
id: i.id.toString(),
name: i.name,
},
});
}
for (let i of userSeeder) {
await prisma.user.upsert({
where: {
nomor: i.nomor,
},
create: {
nomor: i.nomor,
username: i.name,
masterUserRoleId: i.masterUserRoleId,
},
update: {
nomor: i.nomor,
username: i.name,
masterUserRoleId: i.masterUserRoleId,
},
});
}
for (let i of bidangBisnis) {
await prisma.masterBidangBisnis.upsert({
where: {
id: i.id.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
},
create: {
id: i.id.toString(),
name: i.name,
},
});
}
for (let i of pencarianInvestor) {
await prisma.masterPencarianInvestor.upsert({
where: {
id: i.id.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
},
create: {
id: i.id.toString(),
name: i.name,
},
});
}
for (let i of pembagianDeviden) {
await prisma.masterPembagianDeviden.upsert({
where: {
id: i.id.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
},
create: {
id: i.id.toString(),
name: i.name,
},
});
}
for (let i of periodeDeviden) {
await prisma.masterPeriodeDeviden.upsert({
where: {
id: i.id.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
},
create: {
id: i.id.toString(),
name: i.name,
},
});
}
for (let i of statusInvestasi) {
await prisma.masterStatusInvestasi.upsert({
where: {
id: i.id,
},
create: {
id: i.id,
name: i.name,
color: i.color,
},
update: {
id: i.id,
name: i.name,
color: i.color,
},
});
}
for (let i of namaBank) {
await prisma.masterBank.upsert({
where: {
id: i.id.toString(),
},
create: {
id: i.id.toString(),
name: i.name,
norek: i.norek.toString(),
},
update: {
id: i.id.toString(),
name: i.name,
norek: i.norek.toString(),
},
});
}
for (let i of statusTransaksiInvestasi) {
await prisma.masterStatusTransaksiInvestasi.upsert({
where: {
id: i.id,
},
create: {
id: i.id,
name: i.name,
color: i.color,
},
update: {
id: i.id,
name: i.name,
color: i.color,
},
});
}
for (let i of jenisProgres) {
await prisma.masterProgresInvestasi.upsert({
where: {
id: i.id,
},
create: {
id: i.id,
name: i.name,
},
update: {
name: i.name,
},
});
}
for (let d of donasi_status) {
await prisma.donasiMaster_StatusDonasi.upsert({
where: {
id: d.id,
},
create: {
id: d.id,
name: d.name,
},
update: {
name: d.name,
},
});
}
for (let d of donasi_kategori) {
await prisma.donasiMaster_Kategori.upsert({
where: {
id: d.id,
},
create: {
id: d.id,
name: d.name,
},
update: {
name: d.name,
},
});
}
for (let d of donasi_durasi) {
await prisma.donasiMaster_Durasi.upsert({
where: {
id: d.id,
},
create: {
id: d.id,
name: d.name,
},
update: {
name: d.name,
},
});
}
for (let i of donasi_namaBank) {
await prisma.donasiMaster_Bank.upsert({
where: {
id: i.id,
},
create: {
id: i.id,
name: i.name,
norek: i.norek,
},
update: {
id: i.id,
name: i.name,
norek: i.norek,
},
});
}
for (let d of donasi_status_invoice) {
await prisma.donasiMaster_StatusInvoice.upsert({
where: {
id: d.id,
},
create: {
id: d.id,
name: d.name,
},
update: {
name: d.name,
},
});
}
for (let e of event_status) {
await prisma.eventMaster_Status.upsert({
where: {
id: e.id,
},
create: {
id: e.id,
name: e.name,
},
update: {
name: e.name,
},
});
}
for (let e of event_tipe_acara) {
await prisma.eventMaster_TipeAcara.upsert({
where: {
id: e.id,
},
create: {
id: e.id,
name: e.name,
},
update: {
name: e.name,
},
});
}
for (let v of voting_status) {
await prisma.voting_Status.upsert({
where: {
id: v.id,
},
create: {
id: v.id,
name: v.name,
},
update: {
name: v.name,
},
});
}
for (let m of master_status) {
await prisma.masterStatus.upsert({
where: {
id: m.id,
},
create: {
id: m.id,
name: m.name,
},
update: {
name: m.name,
},
});
}
for (let m of forum_kategori_report) {
await prisma.forumMaster_KategoriReport.upsert({
where: {
id: m.id as number,
},
create: {
title: m.title,
deskripsi: m.deskripsi,
},
update: {
title: m.title,
deskripsi: m.deskripsi,
},
});
}
for (let s of forum_status_posting) {
await prisma.forumMaster_StatusPosting.upsert({
where: {
id: s.id,
},
create: {
status: s.status,
},
update: {
status: s.status,
},
});
}
for (let p of collaboration_industri) {
await prisma.projectCollaborationMaster_Industri.upsert({
where: {
id: p.id,
},
create: {
name: p.name,
},
update: {
name: p.name,
},
});
}
for (let p of collaboration_status) {
await prisma.projectCollaborationMaster_Status.upsert({
where: {
id: p.id,
},
create: {
name: p.name,
},
update: {
name: p.name,
},
});
}
for (let a of nomor_admin) {
await prisma.nomorAdmin.upsert({
where: {
id: a.id,
},
create: {
id: a.id,
nomor: a.nomor,
},
update: {
id: a.id,
nomor: a.nomor,
},
});
}
})() })()
.then(() => { .then(() => {
console.log("success"); console.log("success");

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

View File

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.7 KiB

View File

@@ -0,0 +1,32 @@
import prisma from "@/app/lib/prisma";
import fs from "fs";
import { NextRequest, NextResponse } from "next/server";
export async function GET(
req: NextRequest,
{ params }: { params: { id: string } }
) {
const get = await prisma.images.findUnique({
where: {
id: params.id,
},
select: {
url: true,
},
});
if (!fs.existsSync(`./public/map/foto/${get?.url}`)) {
const notFile = fs.readFileSync("./public/aset/global/no_img.png");
return new NextResponse(notFile, {
headers: {
"Content-Type": "image/png",
},
});
}
const file = fs.readFileSync(`./public/map/foto/${get?.url}`);
return new NextResponse(file, {
headers: {
"Content-Type": "image/png",
},
});
}

View File

@@ -15,7 +15,7 @@ export async function GET(
}, },
}); });
if (!fs.existsSync(`./public/map/${get?.url}`)) { if (!fs.existsSync(`./public/map/pin/${get?.url}`)) {
const notFile = fs.readFileSync("./public/aset/global/no_img.png"); const notFile = fs.readFileSync("./public/aset/global/no_img.png");
return new NextResponse(notFile, { return new NextResponse(notFile, {
headers: { headers: {
@@ -23,7 +23,7 @@ export async function GET(
}, },
}); });
} }
const file = fs.readFileSync(`./public/map/${get?.url}`); const file = fs.readFileSync(`./public/map/pin/${get?.url}`);
return new NextResponse(file, { return new NextResponse(file, {
headers: { headers: {
"Content-Type": "image/png", "Content-Type": "image/png",

50
src/app/contoh/page.tsx Normal file
View File

@@ -0,0 +1,50 @@
"use client";
import { ComponentNotifikasi_CardSkeleton } from "@/app_modules/notifikasi/component";
import { Box, Button, Flex, Paper, Stack, Title } from "@mantine/core";
export default function Page() {
return<>
<ComponentNotifikasi_CardSkeleton/>
</>
return (
<Stack
bg={"gray"}
h={"100vh"}
style={{
position: "relative",
width: "100%",
overflow: "scroll",
}}
>
<Box
p={"md"}
style={{
display: "flex",
// width: "700px",
gap: "20px",
position: "relative",
overflowX: "scroll",
// scrollSnapType: "x",
// scrollbarGutter: "unset",
scrollbarWidth: "none",
backgroundColor:"red"
}}
>
<Flex gap={"md"} bg={"cyan"}>
{Array.from(new Array(10), (_, i) => (
<Paper component={Button} w={"200px"} px={"md"} key={i}>
Contoh
</Paper>
))}
</Flex>
</Box>
<Stack>
<Title>Ini Bagian Yang Gak Ikut</Title>
</Stack>
</Stack>
);
}

View File

@@ -0,0 +1,12 @@
import { Investasi_UiInvoice } from "@/app_modules/investasi/_ui";
export default function Page({ params }: { params: { id: string } }) {
const invoiceId = params.id;
return (
<>
<Investasi_UiInvoice />
</>
);
}

View File

@@ -1,5 +1,6 @@
import { investasi_funGetOneInvestasiById } from "@/app_modules/investasi/_fun"; import { investasi_funGetOneInvestasiById } from "@/app_modules/investasi/_fun";
import { Investasi_UiProsesTransaksi } from "@/app_modules/investasi/_ui"; import { Investasi_UiProsesPembelian } from "@/app_modules/investasi/_ui";
export default async function Page({ params }: { params: { id: string } }) { export default async function Page({ params }: { params: { id: string } }) {
const investasiId = params.id; const investasiId = params.id;
@@ -7,7 +8,7 @@ export default async function Page({ params }: { params: { id: string } }) {
return ( return (
<> <>
<Investasi_UiProsesTransaksi dataInvestasi={dataInvestasi} /> <Investasi_UiProsesPembelian dataInvestasi={dataInvestasi} />
</> </>
); );
} }

View File

@@ -0,0 +1,11 @@
import { Investasi_UiProsesTransaksi } from "@/app_modules/investasi/_ui";
export default async function Page({ params }: { params: { id: string } }) {
const invoiceId = params.id;
return (
<>
<Investasi_UiProsesTransaksi />
</>
);
}

View File

@@ -0,0 +1,16 @@
import { map_funGetOneBusinessMapByPortofolioId } from "@/app_modules/map/fun/get/fun_get_one_by_portofolio_id";
import { Map_CustomPin } from "@/app_modules/map/view";
export default async function Page({ params }: { params: { id: string } }) {
const portofolioId = params.id;
const dataMap = await map_funGetOneBusinessMapByPortofolioId({
portofolioId: portofolioId,
});
return (
<>
<Map_CustomPin dataMap={dataMap} />
</>
);
}

View File

@@ -1,9 +1,9 @@
import { map_funGetOneByPortofolioId } from "@/app_modules/map/fun/get/fun_get_one_by_portofolio_id"; import { map_funGetOneBusinessMapByPortofolioId } from "@/app_modules/map/fun/get/fun_get_one_by_portofolio_id";
import { Map_EditPin } from "@/app_modules/map/view"; import { Map_EditPin } from "@/app_modules/map/view";
export default async function Page({ params }: { params: { id: string } }) { export default async function Page({ params }: { params: { id: string } }) {
const portofolioId = params.id; const portofolioId = params.id;
const dataMap = await map_funGetOneByPortofolioId({portofolioId: portofolioId}) const dataMap = await map_funGetOneBusinessMapByPortofolioId({portofolioId: portofolioId})
return ( return (
<> <>

View File

@@ -1,14 +1,14 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data"; import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { map_funGetAllMap } from "@/app_modules/map/fun/get/fun_get_all_map";
import { Map_View } from "@/app_modules/map/view"; import { Map_View } from "@/app_modules/map/view";
const mapboxToken = process.env.MAPBOX_TOKEN!; const mapboxToken = process.env.MAPBOX_TOKEN!;
export default async function Page() { export default async function Page() {
if (!mapboxToken) const dataMap = await map_funGetAllMap();
return <ComponentGlobal_IsEmptyData text="Mapbox token not found" />;
return ( return (
<> <>
<Map_View mapboxToken={mapboxToken} /> <Map_View mapboxToken={mapboxToken} dataMap={dataMap} />
</> </>
); );
} }

View File

@@ -1,12 +1,24 @@
import { Notifikasi_MainView } from "@/app_modules/notifikasi"; import { ComponentNotifikasi_CardSkeleton } from "@/app_modules/notifikasi/component";
import { notifikasi_funGetKategoriApp } from "@/app_modules/notifikasi/fun/get/fun_get_kategori_app";
import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id"; import notifikasi_getByUserId from "@/app_modules/notifikasi/fun/get/get_notifiaksi_by_id";
import { Notifikasi_MainView } from "@/app_modules/notifikasi/view";
import { Suspense } from "react";
export default async function Page() { export default async function Page() {
const listNotifikasi = await notifikasi_getByUserId({ page: 1 }); const listNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: "Semua",
});
const masterKategori = await notifikasi_funGetKategoriApp();
return ( return (
<> <>
<Notifikasi_MainView listNotifikasi={listNotifikasi as any} /> <Suspense fallback={<ComponentNotifikasi_CardSkeleton />}>
<Notifikasi_MainView
listNotifikasi={listNotifikasi as any}
masterKategori={masterKategori}
/>
</Suspense>
</> </>
); );
} }

View File

@@ -2,6 +2,8 @@ export const NEW_RouterInvestasi = {
// Transaksi // Transaksi
pembelian: "/dev/investasi/transaksi/pembelian/", pembelian: "/dev/investasi/transaksi/pembelian/",
metode_pembayaran: "/dev/investasi/transaksi/metode-pembayaran/", metode_pembayaran: "/dev/investasi/transaksi/metode-pembayaran/",
invoice: "/dev/investasi/transaksi/invoice/",
proses_transaksi: "/dev/investasi/transaksi/proses-transaksi/",
// file view // file view
file_view: "/dev/investasi/file-view/", file_view: "/dev/investasi/file-view/",

View File

@@ -1,10 +1,12 @@
export const RouterMap = { export const RouterMap = {
// api // api
api_foto: "/api/map/", api_foto: "/api/map/foto/",
api_custom_pin: "/api/map/pin/",
// main // main
splash: "/dev/map/splash", splash: "/dev/map/splash",
main_view: "/dev/map/main", main_view: "/dev/map/main",
create: "/dev/map/create/", create: "/dev/map/create/",
edit: "/dev/map/edit/", edit: "/dev/map/edit/",
custom_pin: "/dev/map/custom-pin/",
}; };

View File

@@ -23,6 +23,8 @@ import nomor_admin from "../../../bin/seeder/nomor_admin.json";
import userRole from "../../../bin/seeder/user_role.json"; import userRole from "../../../bin/seeder/user_role.json";
import userSeeder from "../../../bin/seeder/user_seeder.json"; import userSeeder from "../../../bin/seeder/user_seeder.json";
import voting_status from "../../../bin/seeder/voting/master_status.json"; import voting_status from "../../../bin/seeder/voting/master_status.json";
import { master_kategori_app } from "@/bin/seeder/master";
import { new_status_transaksi_investasi } from "@/bin/seeder/investasi";
export async function generate_seeder() { export async function generate_seeder() {
for (let i of userRole) { for (let i of userRole) {
@@ -404,5 +406,37 @@ export async function generate_seeder() {
}); });
} }
for (let a of master_kategori_app) {
await prisma.masterKategoriApp.upsert({
where: {
id: a.id,
},
create: {
id: a.id,
name: a.name,
},
update: {
id: a.id,
name: a.name,
},
});
}
for (let a of new_status_transaksi_investasi) {
await prisma.investasiMaster_StatusInvoice.upsert({
where: {
id: a.id,
},
create: {
id: a.id,
name: a.name,
},
update: {
id: a.id,
name: a.name,
},
});
}
return { status: 200, success: true }; return { status: 200, success: true };
} }

View File

@@ -0,0 +1,13 @@
"use server";
import prisma from "@/app/lib/prisma";
export async function funGlobal_getMasterKategoriApp() {
const data = await prisma.masterKategoriApp.findMany({
where: {
isActive: true,
},
});
return data;
}

View File

@@ -0,0 +1,3 @@
import { funGlobal_getMasterKategoriApp } from "./fun_master_kategori_app";
export { funGlobal_getMasterKategoriApp };

View File

@@ -66,7 +66,7 @@ export function ComponentAdminMap_Drawer({
radius={"md"} radius={"md"}
width={300} width={300}
alt="Foto" alt="Foto"
src={RouterMap.api_foto + data?.imagesId} src={RouterMap.api_foto + data?.imageMapId}
/> />
</AspectRatio> </AspectRatio>

View File

@@ -16,6 +16,8 @@ import { RouterNotifikasi } from "@/app/lib/router_hipmi/router_notifikasi";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import notifikasi_countUserNotifikasi from "@/app_modules/notifikasi/fun/count/fun_count_by_id"; import notifikasi_countUserNotifikasi from "@/app_modules/notifikasi/fun/count/fun_count_by_id";
import mqtt_client from "@/util/mqtt_client"; import mqtt_client from "@/util/mqtt_client";
import { useAtom } from "jotai";
import { gs_notifikasi_kategori_app } from "@/app_modules/notifikasi/lib";
export function ComponentHome_ButtonHeaderLeft({ export function ComponentHome_ButtonHeaderLeft({
dataUser, dataUser,
@@ -59,19 +61,9 @@ export function ComponentHome_ButtonHeaderRight({
const router = useRouter(); const router = useRouter();
const [count, setCount] = useState(countNotifikasi); const [count, setCount] = useState(countNotifikasi);
const [isLoadingBell, setIsLoadingBell] = useState(false); const [isLoadingBell, setIsLoadingBell] = useState(false);
const [activeKategori, setActiveKategori] = useAtom(
// useShallowEffect(() => { gs_notifikasi_kategori_app
// onLoadNotifkasi({ );
// onLoad(val) {
// setCount(val);
// },
// });
// }, []);
// async function onLoadNotifkasi({ onLoad }: { onLoad: (val: any) => void }) {
// const loadNotifikasi = await notifikasi_countUserNotifikasi();
// onLoad(loadNotifikasi);
// }
useShallowEffect(() => { useShallowEffect(() => {
mqtt_client.subscribe("USER"); mqtt_client.subscribe("USER");
@@ -107,11 +99,14 @@ export function ComponentHome_ButtonHeaderRight({
} else { } else {
router.push(RouterNotifikasi.main, { scroll: false }); router.push(RouterNotifikasi.main, { scroll: false });
setIsLoadingBell(true); setIsLoadingBell(true);
setActiveKategori("Semua")
} }
}} }}
> >
{isLoadingBell ? ( {isLoadingBell ? (
<Loader color={AccentColor.yellow} size={20} /> <Loader color={AccentColor.yellow} size={20} />
) : count === 0 ? (
<IconBell color="white" />
) : ( ) : (
<Indicator <Indicator
processing processing

View File

@@ -1,7 +1,11 @@
import { ComponentInvestasi_FrameFileView } from "./file_view/frame_file_view"; import { ComponentInvestasi_FrameFileView } from "./file_view/frame_file_view";
import { ComponentInvestasi_BoxMetodePembayaran } from "./transaksi/box_metode_pembayaran"; import { ComponentInvestasi_BoxMetodePembayaran } from "./transaksi/box_metode_pembayaran";
import { ComponentInvestasi_BoxPembelian } from "./transaksi/box_pembelian"; import { ComponentInvestasi_BoxPembelian } from "./transaksi/box_pembelian";
import { ComponentInvestasi_ProsesAccAdmin } from "./transaksi/proses_acc_admin";
import { ComponentInvestasi_ViewInvoice } from "./transaksi/view_invoice";
export { ComponentInvestasi_BoxPembelian }; export { ComponentInvestasi_BoxPembelian };
export { ComponentInvestasi_BoxMetodePembayaran }; export { ComponentInvestasi_BoxMetodePembayaran };
export { ComponentInvestasi_FrameFileView }; export { ComponentInvestasi_FrameFileView };
export { ComponentInvestasi_ViewInvoice };
export { ComponentInvestasi_ProsesAccAdmin };

View File

@@ -1,8 +1,11 @@
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import { import {
AccentColor, AccentColor,
MainColor, MainColor,
} from "@/app_modules/_global/color/color_pallet"; } from "@/app_modules/_global/color/color_pallet";
import { Button, Paper, Radio, Stack, Text, Title } from "@mantine/core"; import { Button, Paper, Radio, Stack, Text, Title } from "@mantine/core";
import { useLocalStorage } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
export function ComponentInvestasi_BoxMetodePembayaran({ export function ComponentInvestasi_BoxMetodePembayaran({
@@ -10,12 +13,17 @@ export function ComponentInvestasi_BoxMetodePembayaran({
}: { }: {
listBank: any[]; listBank: any[];
}) { }) {
const router = useRouter();
const [bank, setBank] = useState(listBank); const [bank, setBank] = useState(listBank);
const [pilihBank, setPilihBank] = useState(""); const [pilihBank, setPilihBank] = useState("");
const [isLoading, setLoading] = useState(false); const [isLoading, setLoading] = useState(false);
const [total, setTotal] = useLocalStorage({
key: "total_investasi",
defaultValue: 0,
});
async function onProses() { async function onProses() {
console.log(pilihBank); router.push(NEW_RouterInvestasi.invoice + "1", { scroll: false });
} }
return ( return (

View File

@@ -0,0 +1,101 @@
import { Warna } from "@/app/lib/warna";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import {
Stack,
Paper,
Title,
Center,
Loader,
Group,
Text,
} from "@mantine/core";
import { IconBrandWhatsapp } from "@tabler/icons-react";
import Link from "next/link";
export function ComponentInvestasi_ProsesAccAdmin() {
return (
<>
<Stack>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Stack spacing={"md"}>
<Paper
style={{
backgroundColor: MainColor.darkblue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Stack align="center" justify="center">
<Title order={6}>Admin sedang memproses transaksimu</Title>
<Paper radius={1000} w={100} h={100}>
<Center h={"100%"}>
<Loader size={"lg"} color="yellow" variant="bars" />
</Center>
</Paper>
<Title order={6}>Mohon menunggu !</Title>
</Stack>
</Paper>
</Stack>
</Paper>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Paper
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Group position="center">
<Stack spacing={0}>
<Text fz={"xs"} fs={"italic"}>
Hubungi admin jika tidak kunjung di proses!
</Text>
<Text fz={"xs"} fs={"italic"}>
Klik pada logo Whatsapp ini.
</Text>
</Stack>
{/* <Link
color="white"
style={{
color: "black",
textDecoration: "none",
}}
target="_blank"
href={`https://wa.me/+${nomorAdmin.nomor}?text=Hallo Admin , Saya ada kendala dalam proses transfer donasi!`}
>
<IconBrandWhatsapp size={40} color={Warna.hijau_cerah} />
</Link> */}
</Group>
</Paper>
</Paper>
</Stack>
</>
);
}

View File

@@ -0,0 +1,267 @@
"use client";
import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
import {
Stack,
Title,
Group,
Paper,
Grid,
CopyButton,
Button,
Center,
FileButton,
Text,
} from "@mantine/core";
import { IconCamera, IconCircleCheck } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
export function ComponentInvestasi_ViewInvoice({
dataInvoice,
}: {
dataInvoice: any;
}) {
const router = useRouter();
const [invoice, setDataInvoice] = useState(dataInvoice);
const [file, setFile] = useState<File | null>(null);
const [image, setImage] = useState<any | null>(null);
// const [active, setActive] = useAtom(gs_donasi_hot_menu);
return (
<>
<Stack spacing={"lg"} py={"md"}>
<Stack
spacing={0}
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Title order={5}>Mohon transfer ke rekening dibawah</Title>
<Group spacing={"xs"}>
<Text>untuk diteruskan ke </Text>
<Text fw={"bold"}>{invoice?.Donasi?.Author.username}</Text>
</Group>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"md"}>
<Stack spacing={0}>
<Text>Bank {invoice?.DonasiMaster_Bank?.name}</Text>
<Text>PT. Himpunan Pengusaha Badung</Text>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.blue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Grid>
<Grid.Col span={8}>
<Group position="left" align="center" h={"100%"}>
<Title order={4} color={MainColor.yellow}>
{invoice?.DonasiMaster_Bank?.norek}
</Title>
</Group>
</Grid.Col>
<Grid.Col span={4}>
<Group position="right">
<CopyButton value={invoice?.DonasiMaster_Bank?.norek}>
{({ copied, copy }) => (
<Button
style={{
transition: "0.5s",
}}
radius={"xl"}
onClick={copy}
color={copied ? "teal" : "yellow"}
c={"black"}
>
{copied ? "Berhasil" : "Salin"}
</Button>
)}
</CopyButton>
</Group>
</Grid.Col>
</Grid>
</Paper>
</Stack>
</Paper>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"md"}>
<Stack spacing={0}>
<Text>Jumlah transfer</Text>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.blue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Grid>
<Grid.Col span={8}>
<Group position="left" align="center" h={"100%"}>
<Title order={4} color="white">
<TampilanRupiahDonasi nominal={+(+invoice.nominal)} />
</Title>
</Group>
</Grid.Col>
<Grid.Col span={4}>
<Group position="right">
<CopyButton value={"" + +invoice.nominal}>
{({ copied, copy }) => (
<Button
style={{
transition: "0.5s",
}}
variant="filled"
radius={"xl"}
color={copied ? "teal" : "yellow"}
c={"black"}
onClick={copy}
>
{copied ? "Berhasil" : "Salin"}
</Button>
)}
</CopyButton>
</Group>
</Grid.Col>
</Grid>
</Paper>
{/* <Text fz={"xs"} c={"gray"}>
Sudah termasuk biaya admin Rp. 2.500,-
</Text> */}
</Stack>
</Paper>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"sm"}>
<Center>
<FileButton
onChange={async (files: any | null) => {
try {
// const buffer = URL.createObjectURL(
// new Blob([new Uint8Array(await files.arrayBuffer())])
// );
// console.log(buffer, "ini buffer");
// console.log(files, " ini file");
setFile(files);
// onUpload(invoice.id, files);
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
radius={"xl"}
leftIcon={<IconCamera />}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload
</Button>
)}
</FileButton>
</Center>
{file ? (
<Center>
<Group spacing={"xs"}>
<Text fz={"xs"} fs={"italic"}>
Upload berhasil{" "}
</Text>
<IconCircleCheck color="green" />
</Group>
</Center>
) : (
<Center>
<Text fz={"xs"} fs={"italic"}>
Upload bukti transfer anda !
</Text>
</Center>
)}
</Stack>
</Paper>
{file !== null ? (
<Button
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
// onClick={() => onClick(router, invoice.id, setActive)}
onClick={() => {
router.push(NEW_RouterInvestasi.proses_transaksi + "1", {
scroll: false,
});
}}
>
Saya Sudah Transfer
</Button>
) : (
<Button
disabled
radius={"xl"}
// bg={"orange"}
// color="orange"
// onClick={() => onClick(router, invoice.id)}
>
Menunggu Bukti Transfer
</Button>
)}
</Stack>
</>
);
}

View File

@@ -1,7 +1,11 @@
import { Investasi_UiFileView } from "./file_view"; import { Investasi_UiFileView } from "./file_view";
import { Investasi_UiInvoice } from "./transaksi/invoice";
import { Investasi_UiMetodePembayaran } from "./transaksi/metode_pembayaran"; import { Investasi_UiMetodePembayaran } from "./transaksi/metode_pembayaran";
import { Investasi_UiProsesPembelian } from "./transaksi/proses_pembelian";
import { Investasi_UiProsesTransaksi } from "./transaksi/proses_transaksi"; import { Investasi_UiProsesTransaksi } from "./transaksi/proses_transaksi";
export { Investasi_UiProsesTransaksi }; export { Investasi_UiProsesPembelian };
export { Investasi_UiMetodePembayaran }; export { Investasi_UiMetodePembayaran };
export { Investasi_UiFileView }; export { Investasi_UiFileView };
export { Investasi_UiInvoice };
export { Investasi_UiProsesTransaksi };

View File

@@ -0,0 +1,15 @@
"use client";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ComponentInvestasi_ViewInvoice } from "../../_component";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
export function Investasi_UiInvoice() {
return (
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Invoice" />}
>
<ComponentInvestasi_ViewInvoice dataInvoice={{}} />
</UIGlobal_LayoutTamplate>
);
}

View File

@@ -0,0 +1,22 @@
"use client";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ComponentInvestasi_BoxPembelian } from "../../_component";
export function Investasi_UiProsesPembelian({
dataInvestasi,
}: {
dataInvestasi: any;
}) {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Pembelian Saham" />}
>
<ComponentInvestasi_BoxPembelian dataInvestasi={dataInvestasi} />
</UIGlobal_LayoutTamplate>
</>
);
}

View File

@@ -1,21 +1,22 @@
"use client"; "use client";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate"; import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ComponentInvestasi_BoxPembelian } from "../../_component"; import { ComponentInvestasi_ProsesAccAdmin } from "../../_component";
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import { IconX } from "@tabler/icons-react";
export function Investasi_UiProsesTransaksi() {
export function Investasi_UiProsesTransaksi({
dataInvestasi,
}: {
dataInvestasi: any;
}) {
return ( return (
<> <>
<UIGlobal_LayoutTamplate <UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Pembelian Saham" />} header={
<UIGlobal_LayoutHeaderTamplate
title="Proses Transaksi"
iconLeft={<IconX />}
/>
}
> >
<ComponentInvestasi_BoxPembelian dataInvestasi={dataInvestasi} /> <ComponentInvestasi_ProsesAccAdmin />
</UIGlobal_LayoutTamplate> </UIGlobal_LayoutTamplate>
</> </>
); );

View File

@@ -2,10 +2,14 @@
import { import {
NEW_RouterInvestasi, NEW_RouterInvestasi,
RouterInvestasi_OLD, RouterInvestasi_OLD
} from "@/app/lib/router_hipmi/router_investasi"; } from "@/app/lib/router_hipmi/router_investasi";
import { Warna } from "@/app/lib/warna"; import { Warna } from "@/app/lib/warna";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header"; import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import { MODEL_PROFILE_OLD } from "@/app_modules/home/model/user_profile"; import { MODEL_PROFILE_OLD } from "@/app_modules/home/model/user_profile";
import { import {
ActionIcon, ActionIcon,
@@ -19,10 +23,9 @@ import {
Image, Image,
Paper, Paper,
Progress, Progress,
SimpleGrid,
Stack, Stack,
Text, Text,
Title, Title
} from "@mantine/core"; } from "@mantine/core";
import { import {
IconBookDownload, IconBookDownload,
@@ -35,12 +38,8 @@ import { useAtom } from "jotai";
import moment from "moment"; import moment from "moment";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { gs_TransferValue } from "../g_state";
import { MODEL_INVESTASI } from "../_lib/interface"; import { MODEL_INVESTASI } from "../_lib/interface";
import { import { gs_TransferValue } from "../g_state";
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
export default function DetailInvestasi({ export default function DetailInvestasi({
dataInvestasi, dataInvestasi,
@@ -86,10 +85,11 @@ export default function DetailInvestasi({
async function onSubmit() { async function onSubmit() {
//NEW //NEW
// router.push(NEW_RouterInvestasi.pembelian + data.id, { scroll: false }); router.push(NEW_RouterInvestasi.pembelian + data.id, { scroll: false });
// OLD // OLD
router.push(RouterInvestasi_OLD.proses_transaksi + `${data.id}`); // router.push(RouterInvestasi_OLD.proses_transaksi + `${data.id}`);
setTransaksiValue({ setTransaksiValue({
...transaksiValue, ...transaksiValue,
lembarTerbeli: "", lembarTerbeli: "",

View File

@@ -9,6 +9,8 @@ import {
IconDotsVertical, IconDotsVertical,
IconEdit, IconEdit,
IconId, IconId,
IconMapPin,
IconMapPin2,
IconMapPinMinus, IconMapPinMinus,
IconPhotoEdit, IconPhotoEdit,
} from "@tabler/icons-react"; } from "@tabler/icons-react";
@@ -46,10 +48,16 @@ export function ComponentPortofolio_ButtonMore({
}, },
{ {
id: "4", id: "4",
name: "Edit pin map", name: "Edit data map",
icon: <IconMapPinMinus />, icon: <IconMapPin2 />,
path: RouterMap.edit + `${portoId}`, path: RouterMap.edit + `${portoId}`,
}, },
{
id: "5",
name: "Custom pin map",
icon: <IconMapPin />,
path: RouterMap.custom_pin + `${portoId}`,
},
]; ];
return ( return (

View File

@@ -2,6 +2,10 @@
import { RouterMap } from "@/app/lib/router_hipmi/router_map"; import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header"; import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
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";
import { import {
Box, Box,
Button, Button,
@@ -10,23 +14,17 @@ import {
Image, Image,
SimpleGrid, SimpleGrid,
Stack, Stack,
Text, Text
Title,
} from "@mantine/core"; } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { useState } from "react";
import { import {
IconBuildingSkyscraper, IconBuildingSkyscraper,
IconListDetails, IconListDetails,
IconPhoneCall,
IconMapPin, IconMapPin,
IconPhoneCall,
} from "@tabler/icons-react"; } from "@tabler/icons-react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; import { useState } from "react";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { MODEL_MAP } from "@/app_modules/map/lib/interface";
import { map_funGetOneById } from "@/app_modules/map/fun/get/fun_get_one_by_id";
import { ComponentMap_SkeletonDrawerDetailData } from "@/app_modules/map/_component";
export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) { export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) {
const router = useRouter(); const router = useRouter();
@@ -45,7 +43,7 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) {
return ( return (
<> <>
<Stack mt={"lg"} spacing={"xl"}> <Stack mt={"lg"} spacing={"xl"} px={"md"}>
<ComponentGlobal_AuthorNameOnHeader <ComponentGlobal_AuthorNameOnHeader
authorName={data?.Author?.username} authorName={data?.Author?.username}
imagesId={data?.Author?.Profile?.imagesId} imagesId={data?.Author?.Profile?.imagesId}
@@ -66,7 +64,7 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) {
mah={300} mah={300}
maw={200} maw={200}
alt="Foto" alt="Foto"
src={RouterMap.api_foto + data?.imagesId} src={RouterMap.api_foto + data?.imageMapId}
/> />
<Box> <Box>
<Grid> <Grid>
@@ -104,6 +102,38 @@ export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) {
</Box> </Box>
</SimpleGrid> </SimpleGrid>
<SimpleGrid
cols={2}
spacing={"lg"}
breakpoints={[
{ maxWidth: 980, cols: 2, spacing: "md" },
{ maxWidth: 755, cols: 1, spacing: "sm" },
{ maxWidth: 600, cols: 1, spacing: "sm" },
]}
>
<Box />
<Group position="center">
<Button
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
onClick={() => {
window.open(
`https://maps.google.com?q=${data?.latitude},${data?.longitude}`,
"_blank",
"width=800,height=600,noopener,noreferrer"
);
}}
>
Buka Maps
</Button>
</Group>
</SimpleGrid>
{/* <pre>{JSON.stringify(data, null, 2)}</pre> */} {/* <pre>{JSON.stringify(data, null, 2)}</pre> */}
</Stack> </Stack>
</> </>

View File

@@ -8,18 +8,8 @@ export async function portofolio_getOneById(portoId: string) {
where: { where: {
id: portoId, id: portoId,
}, },
select: { include: {
id: true,
id_Portofolio: true,
namaBisnis: true,
alamatKantor: true,
deskripsi: true,
tlpn: true,
active: true,
profileId: true,
Logo: true, Logo: true,
logoId: true,
masterBidangBisnisId: true,
MasterBidangBisnis: { MasterBidangBisnis: {
select: { select: {
id: true, id: true,
@@ -41,6 +31,8 @@ export async function portofolio_getOneById(portoId: string) {
BusinessMaps: { BusinessMaps: {
include: { include: {
Author: true, Author: true,
ImageMap: true,
ImagePin: true,
}, },
}, },
}, },

View File

@@ -1,10 +1,12 @@
"use client"; "use client";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import { AccentColor } from "@/app_modules/_global/color/color_pallet"; import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentMap_DrawerDetailData } from "@/app_modules/map/_component"; import { ComponentMap_DrawerDetailData } from "@/app_modules/map/_component";
import { defaultMapZoom } from "@/app_modules/map/lib/default_lat_long"; import { defaultMapZoom } from "@/app_modules/map/lib/default_lat_long";
import { MODEL_MAP } from "@/app_modules/map/lib/interface"; import { MODEL_MAP } from "@/app_modules/map/lib/interface";
import { Image, Paper, Stack, Text, Title } from "@mantine/core"; import { Image, Paper, Stack, Title } from "@mantine/core";
import "mapbox-gl/dist/mapbox-gl.css"; import "mapbox-gl/dist/mapbox-gl.css";
import { useState } from "react"; import { useState } from "react";
import { import {
@@ -16,7 +18,6 @@ import {
} from "react-map-gl"; } from "react-map-gl";
import { ComponentPortofolio_DetailDataMap } from "../component"; import { ComponentPortofolio_DetailDataMap } from "../component";
import { MODEL_LOGO, MODEL_PORTOFOLIO } from "../model/interface"; import { MODEL_LOGO, MODEL_PORTOFOLIO } from "../model/interface";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
export function Portofolio_UiMap({ export function Portofolio_UiMap({
mapboxToken, mapboxToken,
@@ -25,7 +26,6 @@ export function Portofolio_UiMap({
mapboxToken: string; mapboxToken: string;
data: MODEL_PORTOFOLIO; data: MODEL_PORTOFOLIO;
}) { }) {
// console.log(data);
return ( return (
<Paper <Paper
p={"sm"} p={"sm"}
@@ -101,28 +101,17 @@ function MapView({
<Image <Image
width={"100%"} width={"100%"}
alt="image" alt="image"
src={RouterPortofolio.api_logo_porto + `${dataLogo.id}`} src={
data.ImagePin === null
? RouterPortofolio.api_logo_porto + dataLogo.id
: RouterMap.api_custom_pin + data.ImagePin.id
}
radius={"xl"} radius={"xl"}
style={{ style={{
border: `2px solid ${AccentColor.softblue}`, border: `2px solid ${AccentColor.softblue}`,
borderRadius: "100%" borderRadius: "100%",
}} }}
/> />
{/* <Text
fz={"xs"}
bg={"dark"}
c={"white"}
align="center"
style={{
borderRadius: "5px",
padding: "5px",
width: 50,
}}
lineClamp={2}
>
{data.namePin}
</Text> */}
</Stack> </Stack>
</Marker> </Marker>

View File

@@ -30,6 +30,7 @@ import { useRouter } from "next/navigation";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog"; import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { MainColor } from "@/app_modules/_global/color/color_pallet"; import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data"; import { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data";
import Link from "next/link";
export function ComponentMap_DetailData({ mapId }: { mapId: any }) { export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
const router = useRouter(); const router = useRouter();
@@ -48,7 +49,7 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
return ( return (
<> <>
<Stack mt={"lg"} spacing={"xl"}> <Stack mt={"lg"} spacing={"xl"} px={"md"}>
<ComponentGlobal_AuthorNameOnHeader <ComponentGlobal_AuthorNameOnHeader
authorName={data?.Author?.username} authorName={data?.Author?.username}
imagesId={data?.Author?.Profile?.imagesId} imagesId={data?.Author?.Profile?.imagesId}
@@ -69,7 +70,7 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
mah={300} mah={300}
maw={200} maw={200}
alt="Foto" alt="Foto"
src={RouterMap.api_foto + data?.imagesId} src={RouterMap.api_foto + data?.imageMapId}
/> />
<Box> <Box>
<Grid> <Grid>
@@ -116,24 +117,35 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
{ maxWidth: 600, cols: 1, spacing: "sm" }, { maxWidth: 600, cols: 1, spacing: "sm" },
]} ]}
> >
<Box /> <Button
onClick={() => {
router.push(RouterPortofolio.main_detail + data?.Portofolio.id, {
scroll: false,
});
}}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Detail
</Button>
<Group position="center"> <Button
<Button radius={"xl"}
radius={"xl"} bg={MainColor.yellow}
onClick={() => { color="yellow"
router.push( c={"black"}
RouterPortofolio.main_detail + data?.Portofolio.id, onClick={() => {
{ scroll: false } window.open(
); `https://maps.google.com?q=${data?.latitude},${data?.longitude}`,
}} "_blank",
bg={MainColor.yellow} "width=800,height=600,noopener,noreferrer"
color="yellow" );
c={"black"} }}
> >
Detail Buka Maps
</Button> </Button>
</Group>
</SimpleGrid> </SimpleGrid>
{/* <pre>{JSON.stringify(data, null, 2)}</pre> */} {/* <pre>{JSON.stringify(data, null, 2)}</pre> */}

View File

@@ -29,7 +29,7 @@ export async function map_funCreatePin({ data }: { data: any }) {
if (!uploadImage) return { status: 400, message: "Gagal upload foto lokasi" }; if (!uploadImage) return { status: 400, message: "Gagal upload foto lokasi" };
const upload_Folder = Buffer.from(await gambar.arrayBuffer()); const upload_Folder = Buffer.from(await gambar.arrayBuffer());
fs.writeFileSync(`./public/map/${uploadImage.url}`, upload_Folder); fs.writeFileSync(`./public/map/foto/${uploadImage.url}`, upload_Folder);
const create = await prisma.businessMaps.create({ const create = await prisma.businessMaps.create({
data: { data: {
@@ -38,7 +38,7 @@ export async function map_funCreatePin({ data }: { data: any }) {
namePin: data.namePin, namePin: data.namePin,
portofolioId: data?.portofolioId, portofolioId: data?.portofolioId,
authorId: authorId, authorId: authorId,
imagesMapId: uploadImage.id, imageMapId: uploadImage.id,
}, },
}); });

View File

@@ -0,0 +1,50 @@
"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";
export async function map_funCustomPinMap({
mapId,
file,
}: {
mapId: string;
file: FormData;
}) {
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,
},
});
if (!updt) return { status: 400, message: "Gagal update pin" };
revalidatePath(RouterPortofolio.main_detail)
return { status: 200, message: "Berhasil update pin" };
}

View File

@@ -11,6 +11,7 @@ import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
export async function map_funEditMap({ export async function map_funEditMap({
data, data,
file, file,
}: { }: {
data: MODEL_MAP; data: MODEL_MAP;
file: FormData; file: FormData;
@@ -37,7 +38,7 @@ export async function map_funEditMap({
if (!uploadImage) if (!uploadImage)
return { status: 400, message: "Gagal upload foto lokasi" }; return { status: 400, message: "Gagal upload foto lokasi" };
const upload_Folder = Buffer.from(await gambar.arrayBuffer()); const upload_Folder = Buffer.from(await gambar.arrayBuffer());
fs.writeFileSync(`./public/map/${uploadImage.url}`, upload_Folder); fs.writeFileSync(`./public/map/foto/${uploadImage.url}`, upload_Folder);
const updt = await prisma.businessMaps.update({ const updt = await prisma.businessMaps.update({
where: { where: {
@@ -47,7 +48,7 @@ export async function map_funEditMap({
latitude: data.latitude, latitude: data.latitude,
longitude: data.longitude, longitude: data.longitude,
namePin: data.namePin, namePin: data.namePin,
imagesMapId: uploadImage.id, imageMapId: uploadImage.id,
}, },
}); });

View File

@@ -7,6 +7,13 @@ export async function map_funGetAllMap() {
where: { where: {
isActive: true, isActive: true,
}, },
include: {
Portofolio: {
select: {
logoId: true,
},
},
},
}); });
return data; return data;

View File

@@ -28,7 +28,7 @@ export async function map_funGetOneById({ mapId }: { mapId: string }) {
latitude: true, latitude: true,
longitude: true, longitude: true,
authorId: true, authorId: true,
imagesMapId: true, imageMapId: true,
Portofolio: { Portofolio: {
select: { select: {
id: true, id: true,

View File

@@ -2,7 +2,7 @@
import prisma from "@/app/lib/prisma"; import prisma from "@/app/lib/prisma";
export async function map_funGetOneByPortofolioId({ export async function map_funGetOneBusinessMapByPortofolioId({
portofolioId, portofolioId,
}: { }: {
portofolioId: string; portofolioId: string;
@@ -11,13 +11,17 @@ export async function map_funGetOneByPortofolioId({
where: { where: {
portofolioId: portofolioId, portofolioId: portofolioId,
}, },
select: { include: {
id: true, ImageMap: true,
namePin: true, ImagePin: true,
latitude: true, Portofolio: {
longitude: true, select: {
imagesMapId: true, id: true,
}, Logo: true,
logoId: true
}
}
}
}); });
return res; return res;

View File

@@ -0,0 +1,3 @@
import { map_funCustomPinMap } from "./edit/fun_custom_pin_map";
export { map_funCustomPinMap };

View File

@@ -1,3 +1,3 @@
export const defaultLatLong = [-8.723606930462012, 115.17496509980654]; export const defaultLatLong = [-8.745326073272455, 115.17319973054386];
export const defaultMapZoom = 12 export const defaultMapZoom = 11

View File

@@ -13,5 +13,8 @@ export interface MODEL_MAP {
Author: MODEL_USER; Author: MODEL_USER;
portofolioId: string; portofolioId: string;
Portofolio: MODEL_PORTOFOLIO Portofolio: MODEL_PORTOFOLIO
imagesId: string imageMapId: string
ImageMap: any
imagePinId: string
ImagePin: any
} }

View File

@@ -1,4 +1,5 @@
export { UiMap_MapBoxView } from "./ui_map"; export { UiMap_MapBoxView } from "./ui_map";
export { UiMap_SplashView } from "./ui_splash"; export { UiMap_SplashView } from "./ui_splash";
export { UiMap_CreatePin } from "./ui_create_pin" export { UiMap_CreatePin } from "./ui_create_pin";
export { UiMap_EditPin } from "./ui_edit_pin" export { UiMap_EditMap as UiMap_EditPin } from "./ui_edit_map";
export { UiMap_CustomPin } from "./ui_custom_pin";

View File

@@ -0,0 +1,224 @@
"use client";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
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 { IconCamera } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import {
AttributionControl,
Map,
Marker,
NavigationControl,
ScaleControl,
} from "react-map-gl";
import { map_funCustomPinMap } from "../fun";
import { defaultMapZoom } from "../lib/default_lat_long";
import { MODEL_MAP } from "../lib/interface";
export function UiMap_CustomPin({
dataMap,
mapboxToken,
}: {
dataMap: MODEL_MAP;
mapboxToken: string;
}) {
const [data, setData] = useState(dataMap);
const [filePin, setFilePin] = useState<File | any>(null);
const [imgPin, setImgPin] = useState<any | null>(null);
if (!mapboxToken)
return <ComponentGlobal_IsEmptyData text="Mapbox token not found" />;
return (
<>
{/* Logo Custom */}
<Stack spacing={50} px={"sm"} mb={"md"}>
<Stack>
<ComponentGlobal_BoxInformation
informasi={
"Pin map akan secara otomatis menampilkan logo pada porotofolio ini, jika anda ingin melakukan custom silahkan upload logo pin baru anda !"
}
/>
{imgPin ? (
<Center>
<Avatar
size={200}
radius={"100%"}
src={imgPin ? imgPin : "/aset/no-img.png"}
style={{
border: `2px solid ${AccentColor.skyblue}`,
backgroundColor: AccentColor.darkblue,
}}
/>
</Center>
) : (
<Center>
<Avatar
size={200}
radius={"100%"}
src={
data.imagePinId === null
? RouterPortofolio.api_logo_porto + data.Portofolio.logoId
: RouterMap.api_custom_pin + data.imagePinId
}
style={{
border: `2px solid ${AccentColor.skyblue}`,
backgroundColor: AccentColor.darkblue,
}}
/>
</Center>
)}
<Center>
<FileButton
onChange={async (files: any | null) => {
try {
const buffer = URL.createObjectURL(
new Blob([new Uint8Array(await files.arrayBuffer())])
);
if (files.size > 2000000) {
ComponentGlobal_NotifikasiPeringatan(
"Maaf, Ukuran file terlalu besar, maximum 2mb",
3000
);
} else {
setImgPin(buffer);
setFilePin(files);
}
} catch (error) {
console.log(error);
}
}}
accept="image/png,image/jpeg"
>
{(props) => (
<Button
{...props}
radius={"xl"}
leftIcon={<IconCamera />}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Upload
</Button>
)}
</FileButton>
</Center>
</Stack>
{/* Map */}
<Map
mapboxAccessToken={mapboxToken}
mapStyle={"mapbox://styles/mapbox/streets-v11"}
initialViewState={{
latitude: data.latitude,
longitude: data.longitude,
zoom: defaultMapZoom,
}}
style={{
cursor: "pointer",
width: "100%",
height: "30vh",
borderRadius: "10px",
}}
attributionControl={false}
>
<Marker
style={{
color: "red",
width: 40,
// height: 40,
cursor: "pointer",
}}
latitude={data.latitude}
longitude={data.longitude}
anchor="bottom"
>
<Avatar
alt="Logo"
src={
imgPin
? imgPin
: data.imagePinId === null
? RouterPortofolio.api_logo_porto + data.Portofolio.logoId
: RouterMap.api_custom_pin + data.imagePinId
}
style={{
border: `2px solid ${AccentColor.softblue}`,
backgroundColor: "white",
borderRadius: "100%",
}}
/>
</Marker>
<NavigationControl />
<ScaleControl position="top-left" />
<AttributionControl customAttribution="Map design by PT. Bali Interaktif Perkasa" />
</Map>
<ButtonSimpan mapId={data.id} filePin={filePin} />
</Stack>
</>
);
}
function ButtonSimpan({
mapId,
filePin,
}: {
mapId: string;
filePin: FormData;
}) {
const router = useRouter();
const [isLoading, setLoading] = useState(false);
async function onCustom() {
const file = new FormData();
file.append("file", filePin as any);
const res = await map_funCustomPinMap({ mapId: mapId, file: file });
res.status === 200
? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back())
: ComponentGlobal_NotifikasiGagal(res.message);
}
return (
<>
<Button
disabled={filePin == null}
loaderPosition="center"
loading={isLoading}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
style={{
transition: "0.5s",
}}
onClick={() => {
onCustom();
}}
>
Simpan
</Button>
</>
);
}

View File

@@ -1,27 +1,27 @@
"use client"; "use client";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import { import {
AccentColor, AccentColor,
MainColor, MainColor,
} from "@/app_modules/_global/color/color_pallet"; } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_BoxInformation from "@/app_modules/_global/component/box_information";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan"; import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global/notifikasi_peringatan";
import { import {
AspectRatio, AspectRatio,
Box, Avatar,
Button, Button,
Center, Center,
FileButton, FileButton,
Image, Image,
Paper, Paper,
Stack, Stack,
Text,
TextInput, TextInput,
Title,
} from "@mantine/core"; } from "@mantine/core";
import { IconCamera } from "@tabler/icons-react"; import { IconCamera } from "@tabler/icons-react";
import _ from "lodash";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import Map, { import Map, {
@@ -30,13 +30,11 @@ import Map, {
NavigationControl, NavigationControl,
ScaleControl, ScaleControl,
} from "react-map-gl"; } from "react-map-gl";
import { map_funCreatePin } from "../fun/create/fun_create_pin";
import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long";
import { MODEL_MAP } from "../lib/interface";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import { map_funEditMap } from "../fun/edit/fun_edit_map"; import { map_funEditMap } from "../fun/edit/fun_edit_map";
import { defaultMapZoom } from "../lib/default_lat_long";
import { MODEL_MAP } from "../lib/interface";
export function UiMap_EditPin({ export function UiMap_EditMap({
mapboxToken, mapboxToken,
dataMap, dataMap,
}: { }: {
@@ -47,10 +45,9 @@ export function UiMap_EditPin({
const [file, setFile] = useState<File | any>(null); const [file, setFile] = useState<File | any>(null);
const [img, setImg] = useState<any | null>(null); const [img, setImg] = useState<any | null>(null);
return ( return (
<> <>
<Stack> <Stack spacing={30} px={"sm"}>
<Map <Map
mapboxAccessToken={mapboxToken} mapboxAccessToken={mapboxToken}
mapStyle={"mapbox://styles/mapbox/streets-v11"} mapStyle={"mapbox://styles/mapbox/streets-v11"}
@@ -85,13 +82,20 @@ export function UiMap_EditPin({
longitude={data.longitude} longitude={data.longitude}
anchor="bottom" anchor="bottom"
> >
<Stack spacing={0}> <Avatar
<Image src={
w={"100%"} data.ImagePin === null
alt="image" ? RouterPortofolio.api_logo_porto + dataMap.Portofolio.logoId
src="https://cdn-icons-png.flaticon.com/512/5860/5860579.png" : RouterMap.api_custom_pin + data.imagePinId
/> }
</Stack> alt="Logo"
style={{
border: `2px solid ${AccentColor.softblue}`,
backgroundColor: "white",
borderRadius: "100%",
}}
/>
</Marker> </Marker>
<NavigationControl /> <NavigationControl />
<ScaleControl position="top-left" /> <ScaleControl position="top-left" />
@@ -123,7 +127,10 @@ export function UiMap_EditPin({
/> />
</Paper> </Paper>
<Stack> {/* Foto Usaha */}
<Stack spacing={"xs"}>
<ComponentGlobal_BoxInformation informasi="Masukan foto toko atau tempat usaha anda !" />
{img ? ( {img ? (
<AspectRatio ratio={1 / 1} mah={300}> <AspectRatio ratio={1 / 1} mah={300}>
<Paper <Paper
@@ -155,7 +162,7 @@ export function UiMap_EditPin({
<Image <Image
radius={"sm"} radius={"sm"}
alt="Foto" alt="Foto"
src={RouterMap.api_foto + data.imagesId} src={RouterMap.api_foto + data.imageMapId}
maw={250} maw={250}
/> />
</Paper> </Paper>
@@ -214,8 +221,7 @@ function ButtonSavePin({ data, file }: { data: MODEL_MAP; file: FormData }) {
const res = await map_funEditMap({ const res = await map_funEditMap({
data: data, data: data,
file: gambar file: gambar,
}); });
res.status === 200 res.status === 200
? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back()) ? (ComponentGlobal_NotifikasiBerhasil(res.message), router.back())
@@ -225,7 +231,7 @@ function ButtonSavePin({ data, file }: { data: MODEL_MAP; file: FormData }) {
return ( return (
<> <>
<Button <Button
mt={"xl"} mb={"xl"}
style={{ transition: "0.5s" }} style={{ transition: "0.5s" }}
disabled={data.namePin === "" ? true : false} disabled={data.namePin === "" ? true : false}
radius={"xl"} radius={"xl"}

View File

@@ -1,6 +1,9 @@
"use client"; "use client";
import { Image, Stack, Text } from "@mantine/core"; import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { Avatar, Stack } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import "mapbox-gl/dist/mapbox-gl.css"; import "mapbox-gl/dist/mapbox-gl.css";
import { useState } from "react"; import { useState } from "react";
@@ -8,13 +11,14 @@ import Map, {
AttributionControl, AttributionControl,
Marker, Marker,
NavigationControl, NavigationControl,
ScaleControl ScaleControl,
} from "react-map-gl"; } from "react-map-gl";
import { ComponentMap_DrawerDetailData } from "../_component"; import { ComponentMap_DrawerDetailData } from "../_component";
import { ComponentMap_DetailData } from "../_component/detail_data"; import { ComponentMap_DetailData } from "../_component/detail_data";
import { map_funGetAllMap } from "../fun/get/fun_get_all_map"; import { map_funGetAllMap } from "../fun/get/fun_get_all_map";
import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long"; import { defaultLatLong, defaultMapZoom } from "../lib/default_lat_long";
import { MODEL_MAP } from "../lib/interface"; import { MODEL_MAP } from "../lib/interface";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
export function UiMap_MapBoxView({ export function UiMap_MapBoxView({
mapboxToken, mapboxToken,
@@ -36,6 +40,9 @@ export function UiMap_MapBoxView({
setData(loadData as any); setData(loadData as any);
} }
if (!mapboxToken)
return <ComponentGlobal_IsEmptyData text="Mapbox token not found" />;
return ( return (
<> <>
<Stack style={{ borderRadius: "10px" }}> <Stack style={{ borderRadius: "10px" }}>
@@ -76,25 +83,19 @@ export function UiMap_MapBoxView({
setOpenDrawer(true); setOpenDrawer(true);
}} }}
> >
<Image <Avatar
w={"100%"} alt="Logo"
alt="image"
src="https://cdn-icons-png.flaticon.com/512/5860/5860579.png"
/>
<Text
fz={"xs"}
bg={"dark"}
c={"white"}
align="center"
style={{ style={{
borderRadius: "5px", border: `2px solid ${AccentColor.softblue}`,
padding: "5px", borderRadius: "100%",
width: 50, backgroundColor: "white",
}} }}
lineClamp={2} src={
> e.imagePinId === null
{e.namePin} ? RouterPortofolio.api_logo_porto + e.Portofolio.logoId
</Text> : RouterMap.api_custom_pin + e.imagePinId
}
/>
</Stack> </Stack>
</Marker> </Marker>
</Stack> </Stack>

View File

@@ -0,0 +1,16 @@
import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { UiMap_CustomPin } from "../ui";
const mapboxToken = process.env.MAPBOX_TOKEN!;
export async function Map_CustomPin({ dataMap }: { dataMap: any }) {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Custom Pin" />}
>
<UiMap_CustomPin mapboxToken={mapboxToken} dataMap={dataMap} />
</UIGlobal_LayoutTamplate>
</>
);
}

View File

@@ -2,3 +2,4 @@ export { Map_View } from "./main_view";
export { Map_Splash } from "./splash"; export { Map_Splash } from "./splash";
export { Map_CreateNewPin } from "./create"; export { Map_CreateNewPin } from "./create";
export { Map_EditPin } from "./edit"; export { Map_EditPin } from "./edit";
export { Map_CustomPin } from "./custom_pin";

View File

@@ -1,11 +1,14 @@
import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate"; import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
import { ComponentMap_Header } from "../_component"; import { ComponentMap_Header } from "../_component";
import { UiMap_MapBoxView } from "../ui"; import { UiMap_MapBoxView } from "../ui";
import { map_funGetAllMap } from "../fun/get/fun_get_all_map";
export async function Map_View({ mapboxToken }: { mapboxToken: string }) { export async function Map_View({
const dataMap = await map_funGetAllMap(); dataMap,
mapboxToken,
}: {
dataMap: any[];
mapboxToken: string;
}) {
return ( return (
<> <>
<UIGlobal_LayoutTamplate header={<ComponentMap_Header />}> <UIGlobal_LayoutTamplate header={<ComponentMap_Header />}>

View File

@@ -0,0 +1,62 @@
"use client";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import {
Box,
Card,
Divider,
Group,
Skeleton,
Stack,
Text,
} from "@mantine/core";
export function ComponentNotifikasi_CardSkeleton() {
return (
<>
{Array.from(new Array(10)).map((e, i) => (
<Card
key={i}
py={30}
style={{
backgroundColor: MainColor.darkblue,
color: "gray",
border: `2px solid ${AccentColor.darkblue}`,
borderRadius: "10px 10px 10px 10px",
}}
mb={"xs"}
>
<Card.Section px={"lg"}>
<Stack>
<Group position="apart">
<Skeleton h={20} w={100} radius={"xl"} />
<Skeleton h={20} w={100} radius={"xl"} />
</Group>
<Divider color="gray" />
</Stack>
</Card.Section>
<Card.Section p={"lg"}>
<Stack>
<Skeleton h={20} radius={"xl"} />
<Skeleton h={20} radius={"xl"} />
</Stack>
</Card.Section>
<Card.Section px={"lg"}>
<Stack>
<Group position="apart">
<Skeleton h={20} w={100} radius={"xl"} />
<Skeleton h={20} w={100} radius={"xl"} />
</Group>
</Stack>
</Card.Section>
</Card>
))}
</>
);
}

View File

@@ -0,0 +1,5 @@
import { ComponentNotifikasi_CardSkeleton } from "./card_skeleton";
import { ComponentNotifiaksi_CardView } from "./card_view";
export { ComponentNotifiaksi_CardView };
export { ComponentNotifikasi_CardSkeleton };

View File

@@ -0,0 +1,17 @@
"use server";
import { funGlobal_getMasterKategoriApp } from "@/app_modules/_global/fun/get";
export async function notifikasi_funGetKategoriApp() {
const data = await funGlobal_getMasterKategoriApp();
data.unshift({
id: "0",
isActive: true,
createdAt: new Date(),
updatedAt: new Date(),
name: "Semua",
value: null,
});
return data;
}

View File

@@ -2,17 +2,39 @@
import prisma from "@/app/lib/prisma"; import prisma from "@/app/lib/prisma";
import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token"; import { user_getOneUserId } from "@/app_modules/fun_global/get_user_token";
import _ from "lodash";
export default async function notifikasi_getByUserId({ export default async function notifikasi_getByUserId({
page, page,
kategoriApp,
}: { }: {
page: number; page: number;
kategoriApp?: string;
}) { }) {
const userId = await user_getOneUserId(); const userId = await user_getOneUserId();
const takeData = 10; const takeData = 10;
const skipData = page * takeData - takeData; const skipData = page * takeData - takeData;
const data = await prisma.notifikasi.findMany({ if (kategoriApp === "Semua") {
const data = await prisma.notifikasi.findMany({
take: takeData,
skip: skipData,
orderBy: [
{
isRead: "asc",
},
{ createdAt: "desc" },
],
where: {
userId: userId,
userRoleId: "1",
},
});
return data;
}
const allData = await prisma.notifikasi.findMany({
take: takeData, take: takeData,
skip: skipData, skip: skipData,
orderBy: [ orderBy: [
@@ -24,8 +46,9 @@ export default async function notifikasi_getByUserId({
where: { where: {
userId: userId, userId: userId,
userRoleId: "1", userRoleId: "1",
kategoriApp: _.upperCase(kategoriApp),
}, },
}); });
return data; return allData;
} }

View File

@@ -0,0 +1,30 @@
export const kategoriApp = [
{
id: "1",
name: "Event",
},
{
id: "2",
name: "Job",
},
{
id: "3",
name: "Voting",
},
{
id: "4",
name: "Donasi",
},
{
id: "5",
name: "Investasi",
},
{
id: "6",
name: "Forum",
},
{
id: "7",
name: "Collaboration",
},
];

View File

@@ -0,0 +1,6 @@
import { atomWithStorage } from "jotai/utils";
export const gs_notifikasi_kategori_app = atomWithStorage(
"gs_notifikasi_kategori_app",
"Semua"
)

View File

@@ -0,0 +1,5 @@
import { gs_notifikasi_kategori_app } from "./global_state";
export { gs_notifikasi_kategori_app };

View File

@@ -0,0 +1,5 @@
import { Notifikasi_UiLayout } from "./ui_layout_notifikasi";
import { Notifikasi_UiView } from "./ui_notifiaksi";
export { Notifikasi_UiLayout };
export { Notifikasi_UiView };

View File

@@ -0,0 +1,91 @@
"use client";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import {
BackgroundImage,
Box,
Container,
Footer,
rem,
ScrollArea,
} from "@mantine/core";
import React from "react";
export function Notifikasi_UiLayout({
children,
header,
footer,
}: {
children: React.ReactNode;
header?: React.ReactNode;
footer?: React.ReactNode;
}) {
return (
<>
<Box
w={"100%"}
h={"100%"}
style={{
backgroundColor: MainColor.black,
overflowX: "auto",
overflowY: "auto",
position: "fixed",
}}
>
<Container mih={"100vh"} p={0} size={rem(500)} bg={MainColor.darkblue}>
<BackgroundImage
src={"/aset/global/main_background.png"}
h={"100vh"}
style={{ position: "relative" }}
>
<UIHeader header={header} />
<UIChildren footer={footer}>{children}</UIChildren>
</BackgroundImage>
</Container>
</Box>
</>
);
}
function UIHeader({ header }: { header: React.ReactNode }) {
return (
<>
{header ? (
<Box
h={"8vh"}
style={{
zIndex: 10,
}}
w={"100%"}
pos={"sticky"}
top={0}
>
{header}
</Box>
) : (
""
)}
</>
);
}
function UIChildren({
children,
footer,
}: {
children: React.ReactNode;
footer: React.ReactNode;
}) {
return (
<>
<Box style={{ zIndex: 0 }} h={"92vh"} px={"md"} pos={"static"}>
{children}
{/* <ScrollArea h={"100%"} px={"md"}>
</ScrollArea> */}
</Box>
</>
);
}

View File

@@ -1,43 +1,53 @@
"use client"; "use client";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data"; import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader"; import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { gs_job_hot_menu, gs_job_status } from "@/app_modules/job/global_state";
import { Box, Center } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useAtom } from "jotai";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { MODEL_NOTIFIKASI } from "../model/interface";
import { ComponentNotifiaksi_CardView } from "./card_view";
import {
gs_vote_hotMenu,
gs_vote_status,
} from "@/app_modules/vote/global_state";
import {
gs_event_hotMenu,
gs_event_status,
} from "@/app_modules/event/global_state";
import { import {
gs_donasi_hot_menu, gs_donasi_hot_menu,
gs_donasi_tabs_posting, gs_donasi_tabs_posting,
} from "@/app_modules/donasi/global_state"; } from "@/app_modules/donasi/global_state";
import {
gs_event_hotMenu,
gs_event_status,
} from "@/app_modules/event/global_state";
import { import {
gs_investas_menu, gs_investas_menu,
gs_investasi_status, gs_investasi_status,
} from "@/app_modules/investasi/g_state"; } from "@/app_modules/investasi/g_state";
import { gs_job_hot_menu, gs_job_status } from "@/app_modules/job/global_state";
import {
gs_vote_hotMenu,
gs_vote_status,
} from "@/app_modules/vote/global_state";
import { Box, Button, Center, Flex, Stack } from "@mantine/core";
import { useAtom } from "jotai";
import _, { find } from "lodash";
import { ScrollOnly } from "next-scroll-loader";
import { useState } from "react";
import { ComponentNotifikasi_CardSkeleton } from "../component";
import { ComponentNotifiaksi_CardView } from "../component/card_view";
import notifikasi_getByUserId from "../fun/get/get_notifiaksi_by_id";
import { MODEL_NOTIFIKASI } from "../model/interface";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { gs_notifikasi_kategori_app } from "../lib";
import { useShallowEffect } from "@mantine/hooks";
export function Notifikasi_UiView({ export function Notifikasi_UiView({
listNotifikasi, listNotifikasi,
masterKategori,
}: { }: {
listNotifikasi: MODEL_NOTIFIKASI[]; listNotifikasi: any[];
masterKategori: any[];
}) { }) {
const [data, setData] = useState(listNotifikasi); const [data, setData] = useState<MODEL_NOTIFIKASI[]>(listNotifikasi);
const [activePage, setActivePage] = useState(1); const [activePage, setActivePage] = useState(1);
const [mstrKategori, setMstrKategori] = useState(masterKategori);
const [activeKategori, setActiveKategori] = useAtom(
gs_notifikasi_kategori_app
);
// JOB // Kategori App
const [jobMenuId, setJobMenuId] = useAtom(gs_job_hot_menu); const [jobMenuId, setJobMenuId] = useAtom(gs_job_hot_menu);
const [jobStatus, setJobStatus] = useAtom(gs_job_status); const [jobStatus, setJobStatus] = useAtom(gs_job_status);
const [voteMenu, setVoteMenu] = useAtom(gs_vote_hotMenu); const [voteMenu, setVoteMenu] = useAtom(gs_vote_hotMenu);
@@ -49,27 +59,61 @@ export function Notifikasi_UiView({
const [investasiMenu, setInvestasiMenu] = useAtom(gs_investas_menu); const [investasiMenu, setInvestasiMenu] = useAtom(gs_investas_menu);
const [investasiStatus, setInvestasiStatus] = useAtom(gs_investasi_status); const [investasiStatus, setInvestasiStatus] = useAtom(gs_investasi_status);
// useShallowEffect(() => { useShallowEffect(() => {
// onLoadData({ onLoadDataNotifikasi({ kategoriApp: activeKategori });
// onLoad(val) { }, [activeKategori]);
// setData(val);
// },
// });
// }, []);
// async function onLoadData({ onLoad }: { onLoad: (val: any) => void }) { async function onLoadDataNotifikasi({
// const loadData = await notifikasi_getByUserId({ page: 1 }); kategoriApp,
// onLoad(loadData); }: {
// } kategoriApp: string;
}) {
const loadNotifikasi = await notifikasi_getByUserId({
page: 1,
kategoriApp: kategoriApp,
});
setData(loadNotifikasi as any);
}
return ( return (
<> <>
<Box> <Stack spacing={"xs"}>
<Box
style={{
display: "flex",
gap: "20px",
position: "relative",
overflowX: "scroll",
scrollbarWidth: "none",
}}
>
<Flex gap={"md"}>
{mstrKategori.map((e, i) => (
<Button
radius={"xl"}
key={i}
c={activeKategori === e.name ? "black" : "gray.5"}
style={{
transition: "0.3s",
backgroundColor:
activeKategori === e.name ? MainColor.yellow : "GrayText",
}}
onClick={() => {
setActiveKategori(e.name);
}}
>
{e.name}
</Button>
))}
</Flex>
</Box>
{_.isEmpty(data) ? ( {_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" /> <ComponentGlobal_IsEmptyData text="Tidak ada pemberitahuan" />
) : ( ) : (
<ScrollOnly <ScrollOnly
height="92vh" height="85vh"
renderLoading={() => ( renderLoading={() => (
<Center mt={"lg"}> <Center mt={"lg"}>
<ComponentGlobal_Loader /> <ComponentGlobal_Loader />
@@ -121,7 +165,7 @@ export function Notifikasi_UiView({
)} )}
</ScrollOnly> </ScrollOnly>
)} )}
</Box> </Stack>
</> </>
); );
} }

View File

@@ -0,0 +1,23 @@
import UIGlobal_LayoutHeaderTamplate from "../../_global/ui/ui_header_tamplate";
import { Notifikasi_UiLayout, Notifikasi_UiView } from "../ui";
export default function Notifikasi_MainView({
listNotifikasi,
masterKategori,
}: {
listNotifikasi: any[];
masterKategori: any[];
}) {
return (
<>
<Notifikasi_UiLayout
header={<UIGlobal_LayoutHeaderTamplate title="Notifikasi" />}
>
<Notifikasi_UiView
listNotifikasi={listNotifikasi}
masterKategori={masterKategori}
/>
</Notifikasi_UiLayout>
</>
);
}

View File

@@ -1,19 +0,0 @@
import UIGlobal_LayoutHeaderTamplate from "../_global/ui/ui_header_tamplate";
import UIGlobal_LayoutTamplate from "../_global/ui/ui_layout_tamplate";
import { Notifikasi_UiView } from "./component/ui_notifiaksi";
export default function Notifikasi_MainView({
listNotifikasi,
}: {
listNotifikasi: any[];
}) {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Notifikasi" />}
>
<Notifikasi_UiView listNotifikasi={listNotifikasi} />
</UIGlobal_LayoutTamplate>
</>
);
}

View File

@@ -0,0 +1,3 @@
import new_status_transaksi_investasi from "./new_status_transaksi.json";
export { new_status_transaksi_investasi };

View File

@@ -0,0 +1,22 @@
[
{
"id": "1",
"name": "Berhasil"
},
{
"id": "2",
"name": "Proses"
},
{
"id": "3",
"name": "Menunggu"
},
{
"id": "4",
"name": "Menolak"
},
{
"id": "5",
"name": "Gagal"
}
]

View File

@@ -0,0 +1,3 @@
import master_kategori_app from "./master_kategori_app.json";
export { master_kategori_app };

View File

@@ -0,0 +1,30 @@
[
{
"id": "1",
"name": "Event"
},
{
"id": "2",
"name": "Job"
},
{
"id": "3",
"name": "Voting"
},
{
"id": "4",
"name": "Donasi"
},
{
"id": "5",
"name": "Investasi"
},
{
"id": "6",
"name": "Forum"
},
{
"id": "7",
"name": "Collaboration"
}
]