wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Fix QC Kak Inno : tanggal 14 Oktober

Browse Source 
Fitur Search bisa digunakan di 6 Menu, sisa 3 Menu Lagi
This commit is contained in:
nico
2025-10-15 17:29:57 +08:00
parent ccf39bc778
commit 0b574406e2
16 changed files with 1300 additions and 407 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/admin/(dashboard)/landing-page/profile/_lib/layoutTabs.tsx
View File

@@ -66,7 +66,7 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
return (
<Stack gap="lg">
<Title order={2} fw={700} style={{ color: "#1A1B1E" }}>
Profil Desa
Profile Desa
</Title>
<Tabs

663
src/app/api/[[...slugs]]/_lib/search/findMany.ts
View File

@@ -4,7 +4,7 @@ import prisma from "@/lib/prisma";
export default async function searchFindMany(context: Context) {
const { query, page = 1, limit = 10, type } = context.query as any;
// Convert to numbers
const pageNum = parseInt(String(page), 10) || 1;
const limitNum = parseInt(String(limit), 10) || 10;
@@ -304,6 +304,403 @@ export default async function searchFindMany(context: Context) {
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= LAYANAN DESA ========================================= //
if (type === "pelayananSuratKeterangan") {
const data = await prisma.pelayananSuratKeterangan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
if (type === "pelayananPerizinanBerusaha") {
const data = await prisma.pelayananPerizinanBerusaha.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
if (type === "pelayananTelunjukSaktiDesa") {
const data = await prisma.pelayananTelunjukSaktiDesa.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
if (type === "pelayananPendudukNonPermanen") {
const data = await prisma.pelayananPendudukNonPermanen.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PENGHARGAAN ========================================= //
if (type === "penghargaan") {
const data = await prisma.penghargaan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= MENU KESEHATAN ========================================= //
// ========================================= POSYANDU ========================================= //
if (type === "posyandu") {
const data = await prisma.posyandu.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= DATA KESEHATAN WARGA ========================================= //
// ========================================= FASILITAS KESEHATAN ========================================= //
if (type === "fasilitasKesehatan") {
const data = await prisma.fasilitasKesehatan.findMany({
where: {
name: { contains: query, mode: "insensitive" },
informasiumum: { fasilitas: { contains: query, mode: "insensitive" } },
layananunggulan: { content: { contains: query, mode: "insensitive" } },
dokterdantenagamedis: {
name: { contains: query, mode: "insensitive" },
},
fasilitaspendukung: {
content: { contains: query, mode: "insensitive" },
},
prosedurpendaftaran: {
content: { contains: query, mode: "insensitive" },
},
tarifdanlayanan: { layanan: { contains: query, mode: "insensitive" } },
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= JADWAL KEGIATAN ========================================= //
if (type === "jadwalKegiatan") {
const data = await prisma.jadwalKegiatan.findMany({
where: {
content: { contains: query, mode: "insensitive" },
informasijadwalkegiatan: {
name: { contains: query, mode: "insensitive" },
},
deskripsijadwalkegiatan: {
deskripsi: { contains: query, mode: "insensitive" },
},
layananjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
syaratketentuanjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
dokumenjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
pendaftaranjadwalkegiatan: {
name: { contains: query, mode: "insensitive" },
},
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= ARTIKEL KESEHATAN ========================================= //
if (type === "artikelKesehatan") {
const data = await prisma.artikelKesehatan.findMany({
where: {
title: { contains: query, mode: "insensitive" },
content: { contains: query, mode: "insensitive" },
introduction: {
content: { contains: query, mode: "insensitive" },
},
symptom: {
title: { contains: query, mode: "insensitive" },
},
prevention: {
title: { contains: query, mode: "insensitive" },
},
firstaid: {
title: { contains: query, mode: "insensitive" },
},
mythvsfact: {
title: { contains: query, mode: "insensitive" },
},
doctorsign: {
content: { contains: query, mode: "insensitive" },
},
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PUSKESMAS ========================================= //
if (type === "puskesmas") {
const data = await prisma.puskesmas.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PROGRAM KESEHATAN ========================================= //
if (type === "programKesehatan") {
const data = await prisma.programKesehatan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PENANGANAN DARURAT ========================================= //
if (type === "penangananDarurat") {
const data = await prisma.penangananDarurat.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= KONTAK DARURAT ========================================= //
if (type === "kontakDarurat") {
const data = await prisma.kontakDarurat.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= INFO WABAH PENYAKIT ========================================= //
if (type === "infoWabahPenyakit") {
const data = await prisma.infoWabahPenyakit.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= MENU KEAMANAN ========================================= //
// ========================================= KEAMANAN LINGKUNGAN ========================================= //
if (type === "keamananLingkungan") {
const data = await prisma.keamananLingkungan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= POLSEK TERDEKAT ========================================= //
if (type === "polsekTerdekat") {
const data = await prisma.polsekTerdekat.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= KONTAK DARURAT ========================================= //
if (type === "kontakDaruratKeamanan") {
const data = await prisma.kontakDaruratKeamanan.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PENCEGAHAN KRIMINALITAS ========================================= //
if (type === "pencegahanKriminalitas") {
const data = await prisma.pencegahanKriminalitas.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= LAPORAN PUBLIK ========================================= //
if (type === "laporanPublik") {
const data = await prisma.laporanPublik.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= TIPS KEAMANAN ========================================= //
if (type === "tipsKeamanan") {
const data = await prisma.menuTipsKeamanan.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= MENU EKONOMI ========================================= //
// ========================================= PASAR DESA ========================================= //
if (type === "pasarDesa") {
const data = await prisma.pasarDesa.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= LOWONGAN KERJA LOKAL ========================================= //
if (type === "lowonganKerjaLokal") {
const data = await prisma.lowonganPekerjaan.findMany({
where: {
OR: [
{ posisi: { contains: query, mode: "insensitive" } },
{ namaPerusahaan: { contains: query, mode: "insensitive" } },
{ lokasi: { contains: query, mode: "insensitive" } },
{ tipePekerjaan: { contains: query, mode: "insensitive" } },
{ gaji: { contains: query, mode: "insensitive" } },
{ deskripsi: { contains: query, mode: "insensitive" } },
{ kualifikasi: { contains: query, mode: "insensitive" } },
{ notelp: { contains: query, mode: "insensitive" } },
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= STRUKTUR ORGANISASI ========================================= //
if (type === "strukturOrganisasi") {
const data = await prisma.strukturBumDes.findMany({
where: {
OR: [
{ name: { contains: query, mode: "insensitive" } },
{ PosisiOrganisasiBumDes: { nama: { contains: query, mode: "insensitive" } } },
{ PegawaiBumDes: { namaLengkap: { contains: query, mode: "insensitive" } } },
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= JUMLAH PENDUDUK USIA KERJA YANG MENGANGGUR ========================================= //
if (type === "jumlahPendudukUsiaKerjaYangMenganggurUsia") {
const data = await prisma.grafikMenganggurBerdasarkanUsia.findMany({
where: {
OR: [
{ usia18_25: { contains: query, mode: "insensitive" } },
{ usia26_35: { contains: query, mode: "insensitive" } },
{ usia36_45: { contains: query, mode: "insensitive" } },
{ usia46_keatas: { contains: query, mode: "insensitive" } },
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= JUMLAH PENDUDUK USIA KERJA YANG MENGANGGUR ========================================= //
if (type === "jumlahPendudukUsiaKerjaYangMenganggurPendidikan") {
const data = await prisma.grafikMenganggurBerdasarkanPendidikan.findMany({
where: {
OR: [
{ SD: { contains: query, mode: "insensitive" } },
{ SMP: { contains: query, mode: "insensitive" } },
{ SMA: { contains: query, mode: "insensitive" } },
{ D3: { contains: query, mode: "insensitive" } },
{ S1: { contains: query, mode: "insensitive" } },
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= JUMLAH PENDUDUK MISKIN ========================================= //
if (type === "jumlahPendudukMiskin") {
const data = await prisma.grafikJumlahPendudukMiskin.findMany({
where: {
OR: [
// Convert year to string for partial matching
...(isNaN(Number(query)) ? [] : [
{ year: { equals: Number(query) } }
]),
// Convert totalPoorPopulation to string for partial matching
...(isNaN(Number(query)) ? [] : [
{ totalPoorPopulation: { equals: Number(query) } }
])
].filter(Boolean), // Remove any empty arrays from the spread
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= PROGRAM KEMISKINAN ========================================= //
if (type === "programKemiskinan") {
const data = await prisma.programKemiskinan.findMany({
where: {
OR: [
{ nama: { contains: query, mode: "insensitive" } },
{ deskripsi: { contains: query, mode: "insensitive" } },
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= SEKTOR UNGGULAN DESA ========================================= //
if (type === "sektorUnggulanDesa") {
const data = await prisma.sektorUnggulanDesa.findMany({
where: {
OR: [
{ name: { contains: query, mode: "insensitive" } },
{ description: { contains: query, mode: "insensitive" } }
],
},
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// ========================================= DEMOGRAFI PEKERJAAN ========================================= //
if (type === "demografiPekerjaan") {
const data = await prisma.dataDemografiPekerjaan.findMany({
where: { pekerjaan: { contains: query, mode: "insensitive" } },
skip,
take: limitNum,
});
return { data, nextPage: data.length < limitNum ? null : pageNum + 1 };
}
// 🌍 GLOBAL SEARCH — cari di beberapa modul sekaligus
const [
pejabatdesa,
@@ -337,8 +734,32 @@ export default async function searchFindMany(context: Context) {
pelayananSuratKeterangan,
pelayananPerizinanBerusaha,
pelayananTelunjukSaktiDesa,
pelayananPendudukNonPermanent,
penghargaan
pelayananPendudukNonPermanen,
penghargaan,
posyandu,
fasilitasKesehatan,
jadwalKegiatan,
artikelKesehatan,
puskesmas,
programKesehatan,
penangananDarurat,
kontakDarurat,
infoWabahPenyakit,
keamananLingkungan,
polsekTerdekat,
kontakDaruratKeamanan,
pencegahanKriminalitas,
laporanPublik,
tipsKeamanan,
pasarDesa,
lowonganKerjaLokal,
strukturOrganisasi,
jumlahPendudukUsiaKerjaYangMenganggurUsia,
jumlahPendudukUsiaKerjaYangMenganggurPendidikan,
jumlahPendudukMiskin,
programKemiskinan,
sektorUnggulanDesa,
demografiPekerjaan,
] = await Promise.all([
prisma.pejabatDesa.findMany({
where: { name: { contains: query, mode: "insensitive" } },
@@ -486,6 +907,197 @@ export default async function searchFindMany(context: Context) {
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.posyandu.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.fasilitasKesehatan.findMany({
where: {
name: { contains: query, mode: "insensitive" },
informasiumum: { fasilitas: { contains: query, mode: "insensitive" } },
layananunggulan: { content: { contains: query, mode: "insensitive" } },
dokterdantenagamedis: {
name: { contains: query, mode: "insensitive" },
},
fasilitaspendukung: {
content: { contains: query, mode: "insensitive" },
},
prosedurpendaftaran: {
content: { contains: query, mode: "insensitive" },
},
tarifdanlayanan: { layanan: { contains: query, mode: "insensitive" } },
},
take: limitNum,
}),
prisma.jadwalKegiatan.findMany({
where: {
content: { contains: query, mode: "insensitive" },
informasijadwalkegiatan: {
name: { contains: query, mode: "insensitive" },
},
deskripsijadwalkegiatan: {
deskripsi: { contains: query, mode: "insensitive" },
},
layananjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
syaratketentuanjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
dokumenjadwalkegiatan: {
content: { contains: query, mode: "insensitive" },
},
pendaftaranjadwalkegiatan: {
name: { contains: query, mode: "insensitive" },
},
},
take: limitNum,
}),
prisma.artikelKesehatan.findMany({
where: {
title: { contains: query, mode: "insensitive" },
content: { contains: query, mode: "insensitive" },
introduction: {
content: { contains: query, mode: "insensitive" },
},
symptom: {
title: { contains: query, mode: "insensitive" },
},
prevention: {
title: { contains: query, mode: "insensitive" },
},
firstaid: {
title: { contains: query, mode: "insensitive" },
},
mythvsfact: {
title: { contains: query, mode: "insensitive" },
},
doctorsign: {
content: { contains: query, mode: "insensitive" },
},
},
take: limitNum,
}),
prisma.puskesmas.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.programKesehatan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.penangananDarurat.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.kontakDarurat.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.infoWabahPenyakit.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.keamananLingkungan.findMany({
where: { name: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.polsekTerdekat.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.kontakDaruratKeamanan.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.pencegahanKriminalitas.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.laporanPublik.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.menuTipsKeamanan.findMany({
where: { judul: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.pasarDesa.findMany({
where: { nama: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.lowonganPekerjaan.findMany({
where: { posisi: { contains: query, mode: "insensitive" } },
take: limitNum,
}),
prisma.strukturBumDes.findMany({
where: {
OR: [
{ name: { contains: query, mode: "insensitive" } },
{ PosisiOrganisasiBumDes: { nama: { contains: query, mode: "insensitive" } } },
{ PegawaiBumDes: { namaLengkap: { contains: query, mode: "insensitive" } } },
],
},
take: limitNum,
}),
prisma.grafikMenganggurBerdasarkanUsia.findMany({
where: {
OR: [
{ usia18_25: { contains: query, mode: "insensitive" } },
{ usia26_35: { contains: query, mode: "insensitive" } },
{ usia36_45: { contains: query, mode: "insensitive" } },
{ usia46_keatas: { contains: query, mode: "insensitive" } },
],
},
take: limitNum,
}),
prisma.grafikMenganggurBerdasarkanPendidikan.findMany({
where: {
OR: [
{ SD: { contains: query, mode: "insensitive" } },
{ SMP: { contains: query, mode: "insensitive" } },
{ SMA: { contains: query, mode: "insensitive" } },
{ D3: { contains: query, mode: "insensitive" } },
{ S1: { contains: query, mode: "insensitive" } },
],
},
take: limitNum,
}),
prisma.grafikJumlahPendudukMiskin.findMany({
where: {
OR: [
...(isNaN(Number(query)) ? [] : [
{ year: { equals: Number(query) } },
{ totalPoorPopulation: { equals: Number(query) } }
])
].filter(Boolean),
},
take: limitNum,
}),
prisma.programKemiskinan.findMany({
where: {
OR: [
{ nama: { contains: query, mode: "insensitive" } },
{ deskripsi: { contains: query, mode: "insensitive" } },
],
},
take: limitNum,
}),
prisma.sektorUnggulanDesa.findMany({
where: {
OR: [
{ name: { contains: query, mode: "insensitive" } },
{ description: { contains: query, mode: "insensitive" } }
],
},
take: limitNum,
}),
prisma.dataDemografiPekerjaan.findMany({
where: {
pekerjaan: { contains: query, mode: "insensitive" }
},
take: limitNum,
})
]);
return {
@@ -527,11 +1139,48 @@ export default async function searchFindMany(context: Context) {
...pengumuman.map((b) => ({ type: "pengumuman", ...b })),
...galleryFoto.map((b) => ({ type: "galleryFoto", ...b })),
...galleryVideo.map((b) => ({ type: "galleryVideo", ...b })),
...pelayananSuratKeterangan.map((b) => ({ type: "pelayananSuratKeterangan", ...b })),
...pelayananPerizinanBerusaha.map((b) => ({ type: "pelayananPerizinanBerusaha", ...b })),
...pelayananTelunjukSaktiDesa.map((b) => ({ type: "pelayananTelunjukSaktiDesa", ...b })),
...pelayananPendudukNonPermanent.map((b) => ({ type: "pelayananPendudukNonPermanent", ...b })),
...pelayananSuratKeterangan.map((b) => ({
type: "pelayananSuratKeterangan",
...b,
})),
...pelayananPerizinanBerusaha.map((b) => ({
type: "pelayananPerizinanBerusaha",
...b,
})),
...pelayananTelunjukSaktiDesa.map((b) => ({
type: "pelayananTelunjukSaktiDesa",
...b,
})),
...pelayananPendudukNonPermanen.map((b) => ({
type: "pelayananPendudukNonPermanen",
...b,
})),
...penghargaan.map((b) => ({ type: "penghargaan", ...b })),
...posyandu.map((b) => ({ type: "posyandu", ...b })),
...fasilitasKesehatan.map((b) => ({ type: "fasilitasKesehatan", ...b })),
...jadwalKegiatan.map((b) => ({ type: "jadwalKegiatan", ...b })),
...artikelKesehatan.map((b) => ({ type: "artikelKesehatan", ...b })),
...puskesmas.map((b) => ({ type: "puskesmas", ...b })),
...programKesehatan.map((b) => ({ type: "programKesehatan", ...b })),
...penangananDarurat.map((b) => ({ type: "penangananDarurat", ...b })),
...kontakDarurat.map((b) => ({ type: "kontakDarurat", ...b })),
...infoWabahPenyakit.map((b) => ({ type: "infoWabahPenyakit", ...b })),
...keamananLingkungan.map((b) => ({ type: "keamananLingkungan", ...b })),
...polsekTerdekat.map((b) => ({ type: "polsekTerdekat", ...b })),
...kontakDaruratKeamanan.map((b) => ({ type: "kontakDaruratKeamanan", ...b })),
...pencegahanKriminalitas.map((b) => ({ type: "pencegahanKriminalitas", ...b })),
...laporanPublik.map((b) => ({ type: "laporanPublik", ...b })),
...tipsKeamanan.map((b) => ({ type: "tipsKeamanan", ...b })),
...pasarDesa.map((b) => ({ type: "pasarDesa", ...b })),
...lowonganKerjaLokal.map((b) => ({ type: "lowonganKerjaLokal", ...b })),
...strukturOrganisasi.map((b) => ({ type: "strukturOrganisasi", ...b })),
...jumlahPendudukUsiaKerjaYangMenganggurUsia.map((b) => ({ type: "jumlahPendudukUsiaKerjaYangMenganggurUsia", ...b })),
...jumlahPendudukUsiaKerjaYangMenganggurPendidikan.map((b) => ({ type: "jumlahPendudukUsiaKerjaYangMenganggurPendidikan", ...b })),
...jumlahPendudukMiskin.map((b) => ({ type: "jumlahPendudukMiskin", ...b })),
...programKemiskinan.map((b) => ({ type: "programKemiskinan", ...b })),
...sektorUnggulanDesa.map((b) => ({ type: "sektorUnggulanDesa", ...b })),
...demografiPekerjaan.map((b) => ({ type: "demografiPekerjaan", ...b })),
],
nextPage: null, // bisa dibuat lebih kompleks kalau perlu
};

144
src/app/api/[[...slugs]]/_lib/search/searchState.ts
View File

@@ -1,11 +1,11 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client';
import { proxy, subscribe } from 'valtio';
import { proxy } from 'valtio';
import { debounce } from 'lodash';
import ApiFetch from '@/lib/api-fetch';
interface SearchResult {
type?: string; // optional biar gak error
type?: string;
id: string | number;
title?: string;
[key: string]: any;
@@ -21,36 +21,30 @@ const searchState = proxy({
loading: false,
async fetch() {
if (!searchState.query) return;
if (!searchState.query) {
searchState.results = [];
return;
}
searchState.loading = true;
try {
const res = await ApiFetch.api.search.findMany.get({
query: {
query: searchState.query,
page: searchState.page,
limit: searchState.limit,
type: searchState.type,
},
});
const res = await ApiFetch.api.search.findMany.get({
query: {
query: searchState.query,
page: searchState.page,
limit: searchState.limit,
type: searchState.type,
},
});
const data = (res.data?.data || []).map((item: any) => ({
type: item.type ?? 'unknown', // pastikan selalu ada type
...item,
}));
if (searchState.page === 1) {
searchState.results = data;
} else {
searchState.results.push(...data);
}
searchState.nextPage = res.data?.nextPage || null;
} catch (e) {
console.error('Search fetch error:', e);
} finally {
searchState.loading = false;
if (searchState.page === 1) {
searchState.results = res.data?.data || [];
} else {
searchState.results.push(...(res.data?.data || []));
}
searchState.nextPage = res.data?.nextPage || null;
searchState.loading = false;
},
async next() {
@@ -60,15 +54,95 @@ const searchState = proxy({
},
});
// 🔁 Auto debounce search trigger
const debouncedFetch = debounce(() => {
if (!searchState.query) return;
// 🕒 debounce-nya tetap kita export biar bisa dipanggil manual
export const debouncedFetch = debounce(() => {
searchState.page = 1;
searchState.fetch();
}, 500);
subscribe(searchState, () => {
debouncedFetch();
});
export default searchState;
// 'use client';
// import { proxy, subscribe } from 'valtio';
// import { debounce } from 'lodash';
// import ApiFetch from '@/lib/api-fetch';
// interface SearchResult {
// type?: string;
// id: string | number;
// title?: string;
// [key: string]: any;
// }
// const searchState = proxy({
// query: '',
// page: 1,
// limit: 10,
// type: '', // kosong = global search
// results: [] as SearchResult[],
// nextPage: null as number | null,
// loading: false,
// // --- fetch utama ---
// async fetch() {
// if (!searchState.query.trim()) {
// // 🧹 kalau query kosong, kosongin data dan stop
// searchState.results = [];
// searchState.nextPage = null;
// searchState.loading = false;
// return;
// }
// searchState.loading = true;
// try {
// const res = await ApiFetch.api.search.findMany.get({
// query: {
// query: searchState.query,
// page: searchState.page,
// limit: searchState.limit,
// type: searchState.type,
// },
// });
// const newData = res.data?.data || [];
// // Kalau ini page pertama, replace data
// if (searchState.page === 1) {
// searchState.results = newData;
// } else {
// // Kalau page berikutnya, append data
// searchState.results = [...searchState.results, ...newData];
// }
// searchState.nextPage = res.data?.nextPage || null;
// } catch (err) {
// console.error('Search fetch error:', err);
// } finally {
// searchState.loading = false;
// }
// },
// // --- load next page (infinite scroll) ---
// async next() {
// if (!searchState.nextPage || searchState.loading) return;
// searchState.page = searchState.nextPage;
// await searchState.fetch();
// },
// });
// // --- debounce agar gak fetch tiap ketik ---
// const debouncedFetch = debounce(() => {
// // reset pagination setiap query berubah
// searchState.page = 1;
// searchState.fetch();
// }, 500);
// // --- auto trigger setiap query berubah ---
// subscribe(searchState, () => {
// // kalau query berubah, jalankan debounce fetch
// debouncedFetch();
// });
// export default searchState;

49
src/app/darmasaba/(pages)/desa/profile/page.tsx
View File

@@ -10,31 +10,36 @@ import ProfilPerbekel from './ui/profilPerbekel';
// import LembagaDesa from './ui/lembagaDesa';
import MotoDesa from './ui/motoDesa';
import SemuaPerbekel from './ui/semuaPerbekel';
import ScrollToTopButton from '@/app/darmasaba/_com/scrollToTopButton';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align='center' gap={0}>
<Text fz={{base: "h1", md: "2.5rem"}} c={colors["blue-button"]} fw={"bold"}>
Profile Desa
</Text>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<ProfileDesa />
<SejarahDesa />
<VisimisiDesa />
<LambangDesa />
<MaskotDesa />
<ProfilPerbekel />
<MotoDesa />
<SemuaPerbekel/>
</Box>
</Stack>
<Box>
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align='center' gap={0}>
<Text fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
Profile Desa
</Text>
</Stack>
</Container>
<Box px={{ base: "md", md: 100 }}>
<ProfileDesa />
<SejarahDesa />
<VisimisiDesa />
<LambangDesa />
<MaskotDesa />
<ProfilPerbekel />
<MotoDesa />
<SemuaPerbekel />
</Box>
</Stack>
{/* Tombol Scroll ke Atas */}
<ScrollToTopButton />
</Box>
);
}

37
src/app/darmasaba/(pages)/kesehatan/data-kesehatan-warga/page.tsx
View File

@@ -2,7 +2,7 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
import colors from '@/con/colors';
import { BarChart as MantineBarChart } from '@mantine/charts';
import { Box, Center, ColorSwatch, Flex, Paper, SimpleGrid, Skeleton, Stack, Text } from '@mantine/core';
import { Box, Center, ColorSwatch, Flex, Paper, SimpleGrid, Skeleton, Stack, Text, Title } from '@mantine/core';
import { useEffect, useState } from 'react';
import BackButton from '../../desa/layanan/_com/BackButto';
@@ -107,20 +107,7 @@ function Page() {
<Box>
<Paper p={"xl"} bg={colors['white-trans-1']}>
<Box pb={30}>
<Flex pb={30} justify={'flex-end'} gap={'xl'} align={'center'}>
<Box>
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kematian</Text>
<ColorSwatch color="#EF3E3E" size={30} />
</Flex>
</Box>
<Box>
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kelahiran</Text>
<ColorSwatch color="#3290CA" size={30} />
</Flex>
</Box>
</Flex>
<Title order={2} mb="md">Data Kematian dan Kelahiran</Title>
{chartData.length === 0 ? (
<Text c="dimmed" ta="center" py="xl">
Belum ada data yang tersedia untuk ditampilkan
@@ -150,6 +137,20 @@ function Page() {
</Center>
</>
)}
<Flex pb={30} justify={'center'} gap={'xl'} align={'center'}>
<Box>
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kematian</Text>
<ColorSwatch color="#EF3E3E" size={30} />
</Flex>
</Box>
<Box>
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kelahiran</Text>
<ColorSwatch color="#3290CA" size={30} />
</Flex>
</Box>
</Flex>
</Box>
</Paper>
</Box>
@@ -163,11 +164,11 @@ function Page() {
}}
>
{/* Fasilitas Kesehatan */}
<FasilitasKesehatan/>
<FasilitasKesehatan />
{/* Jadwal Kegiatan */}
<JadwalKegiatan/>
<JadwalKegiatan />
{/* Artikel Kesehatan */}
<ArtikelKesehatanPage/>
<ArtikelKesehatanPage />
</SimpleGrid>
</Box>
</Stack>

22
src/app/darmasaba/(pages)/ppid/permohonan-informasi-publik/page.tsx
View File

@@ -12,10 +12,9 @@ import {
SimpleGrid,
Stack,
Text,
TextInput,
Tooltip,
TextInput
} from '@mantine/core';
import { IconDownload, IconSend2 } from '@tabler/icons-react';
import { IconSend2 } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { useProxy } from 'valtio/utils';
import BackButton from '../../desa/layanan/_com/BackButto';
@@ -150,23 +149,6 @@ function Page() {
</Paper>
))}
</SimpleGrid>
<Center pb={30}>
<Tooltip label="Unduh dokumen tata cara permohonan" withArrow>
<Button
fz="sm"
size="md"
radius="md"
bg={colors['blue-button']}
leftSection={
<IconDownload size={20} color={colors['white-1']} />
}
>
Unduh Tata Cara
</Button>
</Tooltip>
</Center>
<Group justify="center">
<Paper
p="xl"

189
src/app/darmasaba/(pages)/ppid/profile-ppid/page.tsx
View File

@@ -6,6 +6,7 @@ import { useShallowEffect } from '@mantine/hooks';
import { IconBuildingCommunity, IconTargetArrow, IconTimeline, IconUser } from '@tabler/icons-react';
import { useProxy } from 'valtio/utils';
import BackButton from '../../desa/layanan/_com/BackButto';
import ScrollToTopButton from '@/app/darmasaba/_com/scrollToTopButton';
function Page() {
const allList = useProxy(stateProfilePPID)
@@ -36,99 +37,103 @@ function Page() {
: [allList.profile.data]
return (
<Stack pos="relative" bg={colors.Bg} py="xl" gap="22">
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
<Box px={{ base: 'md', md: 100 }}>
<Text ta="center" fz={{ base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem" }} c={colors["blue-button"]} fw="bold">
Profil PPID Desa Darmasaba
</Text>
</Box>
{dataArray.map((item) => (
<Box key={item.id} px={{ base: "md", md: 100 }}>
<Paper p="xl" bg={colors['white-trans-1']} radius="lg" shadow="xl">
<Box px={{ base: "md", md: 100 }}>
<Flex align="center" gap={40} justify="center">
<Image loading='lazy' src="/darmasaba-icon.png" h={{ base: 70, md: 120 }} alt="Logo Desa" />
<Text fz={{ base: "1.5rem", md: "2rem", lg: "2.5rem", xl: "3rem" }} fw="bold">
Pejabat Pengelola Informasi Publik
</Text>
</Flex>
</Box>
<Divider my="lg" />
<Box px={{ base: 0, md: 50 }} pb={40}>
<SimpleGrid cols={{ base: 1, xl: 2 }} spacing="xl">
<Box px={{ base: 0, md: 50 }}>
<Paper bg={colors['white-trans-1']} radius="lg" shadow="sm">
<Stack gap="md">
<Center>
<Image
loading='lazy'
src={item.image?.link ? `${item.image.link}?t=${Date.now()}` : "/perbekel.png"}
w={{ base: 220, md: 330 }}
alt="Foto Pimpinan"
radius="md"
/>
</Center>
<Paper bg={colors['blue-button']} py={25} radius="lg" className="glass3">
<Text ta="center" c={colors['white-1']} fw="bolder" fz={{ base: "1.5rem", md: "2rem" }}>
{item.name}
</Text>
</Paper>
</Stack>
</Paper>
</Box>
<Box>
<Stack gap="xl">
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconUser size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Biografi</Text>
</Flex>
<Text fz={{ base: "1rem", md: "1.125rem", lg: "1.25rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.biodata }} style={{wordBreak: "break-word", whiteSpace: "normal"}} />
</Box>
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconTimeline size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Riwayat Karir</Text>
</Flex>
<Text fz={{ base: "1rem", md: "1.125rem", lg: "1.25rem" }} dangerouslySetInnerHTML={{ __html: item.riwayat }} style={{wordBreak: "break-word", whiteSpace: "normal"}} />
</Box>
</Stack>
</Box>
</SimpleGrid>
</Box>
<Box pb={40}>
<Flex align="center" gap="sm" mb="sm">
<IconBuildingCommunity size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Pengalaman Organisasi</Text>
</Flex>
<List spacing="xs" size="sm">
<Box px={20}>
<Text fz={{ base: "1rem", md: "1.125rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.pengalaman }} style={{wordBreak: "break-word", whiteSpace: "normal"}} />
</Box>
</List>
</Box>
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconTargetArrow size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Program Unggulan</Text>
</Flex>
<List spacing="xs" size="sm">
<Box px={20}>
<Text fz={{ base: "1rem", md: "1.125rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.unggulan }} style={{wordBreak: "break-word", whiteSpace: "normal"}} />
</Box>
</List>
</Box>
</Paper>
<Box>
<Stack pos="relative" bg={colors.Bg} py="xl" gap="22">
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
))}
</Stack>
<Box px={{ base: 'md', md: 100 }}>
<Text ta="center" fz={{ base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem" }} c={colors["blue-button"]} fw="bold">
Profil PPID Desa Darmasaba
</Text>
</Box>
{dataArray.map((item) => (
<Box key={item.id} px={{ base: "md", md: 100 }}>
<Paper p="xl" bg={colors['white-trans-1']} radius="lg" shadow="xl">
<Box px={{ base: "md", md: 100 }}>
<Flex align="center" gap={40} justify="center">
<Image loading='lazy' src="/darmasaba-icon.png" h={{ base: 70, md: 120 }} alt="Logo Desa" />
<Text fz={{ base: "1.5rem", md: "2rem", lg: "2.5rem", xl: "3rem" }} fw="bold">
Pejabat Pengelola Informasi Publik
</Text>
</Flex>
</Box>
<Divider my="lg" />
<Box px={{ base: 0, md: 50 }} pb={40}>
<SimpleGrid cols={{ base: 1, xl: 2 }} spacing="xl">
<Box px={{ base: 0, md: 50 }}>
<Paper bg={colors['white-trans-1']} radius="lg" shadow="sm">
<Stack gap="md">
<Center>
<Image
loading='lazy'
src={item.image?.link ? `${item.image.link}?t=${Date.now()}` : "/perbekel.png"}
w={{ base: 220, md: 330 }}
alt="Foto Pimpinan"
radius="md"
/>
</Center>
<Paper bg={colors['blue-button']} py={25} radius="lg" className="glass3">
<Text ta="center" c={colors['white-1']} fw="bolder" fz={{ base: "1.5rem", md: "2rem" }}>
{item.name}
</Text>
</Paper>
</Stack>
</Paper>
</Box>
<Box>
<Stack gap="xl">
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconUser size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Biografi</Text>
</Flex>
<Text fz={{ base: "1rem", md: "1.125rem", lg: "1.25rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.biodata }} style={{ wordBreak: "break-word", whiteSpace: "normal" }} />
</Box>
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconTimeline size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Riwayat Karir</Text>
</Flex>
<Text fz={{ base: "1rem", md: "1.125rem", lg: "1.25rem" }} dangerouslySetInnerHTML={{ __html: item.riwayat }} style={{ wordBreak: "break-word", whiteSpace: "normal" }} />
</Box>
</Stack>
</Box>
</SimpleGrid>
</Box>
<Box pb={40}>
<Flex align="center" gap="sm" mb="sm">
<IconBuildingCommunity size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Pengalaman Organisasi</Text>
</Flex>
<List spacing="xs" size="sm">
<Box px={20}>
<Text fz={{ base: "1rem", md: "1.125rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.pengalaman }} style={{ wordBreak: "break-word", whiteSpace: "normal" }} />
</Box>
</List>
</Box>
<Box>
<Flex align="center" gap="sm" mb="sm">
<IconTargetArrow size={28} />
<Text fz={{ base: "1.25rem", md: "1.5rem" }} fw="bold">Program Unggulan</Text>
</Flex>
<List spacing="xs" size="sm">
<Box px={20}>
<Text fz={{ base: "1rem", md: "1.125rem" }} ta="justify" dangerouslySetInnerHTML={{ __html: item.unggulan }} style={{ wordBreak: "break-word", whiteSpace: "normal" }} />
</Box>
</List>
</Box>
</Paper>
</Box>
))}
</Stack>
{/* Tombol Scroll ke Atas */}
<ScrollToTopButton />
</Box>
)
}

157
src/app/darmasaba/(pages)/ppid/struktur-ppid/[id]/page.tsx Normal file
View File

@@ -0,0 +1,157 @@
'use client';
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
import colors from '@/con/colors';
import {
Box,
Divider,
Group,
Image,
Paper,
Skeleton,
Stack,
Text,
Title,
} from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { IconArrowBack } from '@tabler/icons-react';
import { useParams, useRouter } from 'next/navigation';
import { useProxy } from 'valtio/utils';
function DetailPegawaiUser() {
const statePegawai = useProxy(stateStrukturPPID.pegawai);
const params = useParams();
const router = useRouter();
useShallowEffect(() => {
stateStrukturPPID.posisiOrganisasi.findMany.load();
statePegawai.findUnique.load(params?.id as string);
}, []);
if (!statePegawai.findUnique.data) {
return (
<Stack py="lg">
<Skeleton height={500} radius="md" />
</Stack>
);
}
const data = statePegawai.findUnique.data;
return (
<Box px={{ base: 'sm', md: 'lg' }} py="xl">
{/* Back button */}
<Group mb="lg">
<Box
onClick={() => router.back()}
style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
gap: 8,
}}
>
<IconArrowBack size={22} color={colors['blue-button']} />
<Text c={colors['blue-button']} fw={500}>
Kembali
</Text>
</Box>
</Group>
<Paper
w={{ base: '100%', md: '70%' }}
mx="auto"
p="xl"
radius="lg"
shadow="sm"
bg="white"
style={{
border: '1px solid #eaeaea',
}}
>
<Stack align="center" gap="md">
{/* Foto Profil */}
<Image
src={data.image?.link || '/placeholder-profile.png'}
alt={data.namaLengkap || 'Foto Profil'}
w={160}
h={160}
radius={100}
fit="cover"
style={{ border: `2px solid ${colors['blue-button']}` }}
loading="lazy"
/>
{/* Nama & Jabatan */}
<Stack align="center" gap={2}>
<Title order={3} fw={700} c={colors['blue-button']}>
{data.namaLengkap || '-'} {data.gelarAkademik || ''}
</Title>
<Text fz="sm" c="dimmed">
{data.posisi?.nama || 'Posisi tidak tersedia'}
</Text>
</Stack>
</Stack>
<Divider my="lg" />
{/* Informasi Detail */}
<Stack gap="md">
<InfoRow label="Email" value={data.email} />
<InfoRow label="Telepon" value={data.telepon} />
<InfoRow label="Alamat" value={data.alamat} multiline />
<InfoRow
label="Tanggal Masuk"
value={
data.tanggalMasuk
? new Date(data.tanggalMasuk).toLocaleDateString('id-ID', {
day: '2-digit',
month: 'long',
year: 'numeric',
})
: '-'
}
/>
<InfoRow
label="Status"
value={data.isActive ? 'Aktif' : 'Tidak Aktif'}
valueColor={data.isActive ? 'green' : 'red'}
/>
</Stack>
</Paper>
</Box>
);
}
/* Komponen kecil untuk menampilkan baris informasi */
function InfoRow({
label,
value,
valueColor,
multiline = false,
}: {
label: string;
value?: string | null;
valueColor?: string;
multiline?: boolean;
}) {
return (
<Box>
<Text fz="sm" fw={600} c="dark">
{label}
</Text>
<Text
fz="sm"
c={valueColor || 'dimmed'}
style={{
whiteSpace: multiline ? 'normal' : 'nowrap',
wordBreak: 'break-word',
}}
>
{value || '-'}
</Text>
</Box>
);
}
export default DetailPegawaiUser;

158
src/app/darmasaba/(pages)/ppid/struktur-ppid/page.tsx
View File

@@ -1,129 +1,8 @@
/* eslint-disable react-hooks/exhaustive-deps */
/* eslint-disable @typescript-eslint/no-explicit-any */
// /* eslint-disable react-hooks/exhaustive-deps */
// /* eslint-disable @typescript-eslint/no-explicit-any */
// 'use client'
// import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
// import colors from '@/con/colors';
// import { Box, Image, Paper, Skeleton, Stack, Text, Title } from '@mantine/core';
// import { OrganizationChart } from 'primereact/organizationchart';
// import { useEffect } from 'react';
// import { useProxy } from 'valtio/utils';
// import BackButton from '../../desa/layanan/_com/BackButto';
// function Page() {
// return (
// <Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
// <Box px={{ base: 'md', md: 100 }}>
// <BackButton />
// </Box>
// <Title ta={"center"} fz={{ base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.5rem" }} c={colors["blue-button"]} fw={"bold"}>Struktur PPID</Title>
// <StrukturOrganisasiPPID />
// </Stack>
// );
// }
// function StrukturOrganisasiPPID() {
// const stateOrganisasi = useProxy(stateStrukturPPID.pegawai)
// useEffect(() => {
// stateOrganisasi.findMany.load()
// }, [])
// if (!stateOrganisasi.findMany.data || stateOrganisasi.findMany.data.length === 0) {
// return (
// <Stack py={10}>
// <Skeleton h={500} />
// </Stack>
// );
// }
// // Step 1: Group pegawai berdasarkan posisiId
// const posisiMap = new Map<string, any>();
// for (const pegawai of stateOrganisasi.findMany.data) {
// const posisiId = pegawai.posisi.id;
// if (!posisiMap.has(posisiId)) {
// posisiMap.set(posisiId, {
// ...pegawai.posisi,
// pegawaiList: [],
// children: []
// });
// }
// posisiMap.get(posisiId)!.pegawaiList.push(pegawai);
// }
// // Step 2: Buat struktur pohon berdasarkan parentId
// const root: any[] = [];
// posisiMap.forEach((posisi) => {
// if (posisi.parentId) {
// const parent = posisiMap.get(posisi.parentId);
// if (parent) {
// parent.children.push(posisi);
// }
// } else {
// root.push(posisi);
// }
// });
// // Step 3: Ubah struktur ke format OrganizationChart
// function toOrgChartFormat(node: any): any {
// return {
// expanded: true,
// type: 'person',
// styleClass: 'p-person',
// data: {
// name: node.pegawaiList?.[0]?.namaLengkap || 'Tidak ada pegawai',
// status: node.nama,
// image: node.pegawaiList?.[0]?.image?.link || '/img/default.png'
// },
// children: node.children.map(toOrgChartFormat)
// };
// }
// const chartData = root.map(toOrgChartFormat);
// return (
// <Box py={10}>
// <Paper bg={colors.grey} p="md" style={{ overflowX: 'auto' }}>
// <OrganizationChart style={{ color: colors['blue-button'] }} value={chartData} nodeTemplate={nodeTemplate} />
// </Paper>
// </Box>
// );
// }
// function nodeTemplate(node: any) {
// const imageSrc = node?.data?.image || '/img/default.png';
// const name = node?.data?.name || 'Tanpa Nama';
// const status = node?.data?.status || 'Tidak ada deskripsi';
// return (
// <Stack pos={"relative"} py={"xl"} gap={"22"}>
// <Stack align="center" gap={4}>
// <Image
// src={imageSrc}
// alt={name}
// radius="xl"
// w={120}
// h={120}
// fit="cover"
// />
// <Text fw={600} ta="center">{name}</Text>
// <Text size="sm" c="dimmed" ta="center">{status}</Text>
// </Stack>
// </Stack>
// );
// }
// export default Page;
'use client'
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID'
import colors from '@/con/colors'
import {
Box,
Button,
@@ -145,7 +24,8 @@ import { OrganizationChart } from 'primereact/organizationchart'
import { useEffect } from 'react'
import { useProxy } from 'valtio/utils'
import BackButton from '../../desa/layanan/_com/BackButto'
import colors from '@/con/colors'
import { useTransitionRouter } from 'next-view-transitions'
import ScrollToTopButton from '@/app/darmasaba/_com/scrollToTopButton'
export default function Page() {
return (
@@ -180,12 +60,16 @@ export default function Page() {
<StrukturOrganisasiPPID />
</Box>
</Container>
{/* Tombol Scroll ke Atas */}
<ScrollToTopButton />
</Box>
)
}
function StrukturOrganisasiPPID() {
const stateOrganisasi: any = useProxy(stateStrukturPPID.pegawai)
const router = useTransitionRouter()
useEffect(() => {
void stateOrganisasi.findMany.load()
@@ -292,19 +176,21 @@ function StrukturOrganisasiPPID() {
})
function toOrgChartFormat(node: any): any {
const pegawai = node.pegawaiList?.[0];
return {
expanded: true,
type: 'person',
styleClass: 'p-person',
data: {
name: node.pegawaiList?.[0]?.namaLengkap || 'Belum ditugaskan',
id: pegawai?.id || null, // tambahin ini bro
name: pegawai?.namaLengkap || 'Belum ditugaskan',
title: node.nama || 'Tanpa jabatan',
image: node.pegawaiList?.[0]?.image?.link || '/img/default.png',
image: pegawai?.image?.link || '/img/default.png',
description: node.deskripsi || '',
positionId: node.id || null,
},
children: node.children?.map(toOrgChartFormat) || [],
}
};
}
const chartData = root.map(toOrgChartFormat)
@@ -322,21 +208,22 @@ function StrukturOrganisasiPPID() {
>
<OrganizationChart
value={chartData}
nodeTemplate={nodeTemplate}
nodeTemplate={(node) => nodeTemplate(node, router)}
/>
</Paper>
</Box>
)
}
function nodeTemplate(node: any) {
function nodeTemplate(node: any, router: ReturnType<typeof useTransitionRouter>) {
const imageSrc = node?.data?.image || '/img/default.png'
const name = node?.data?.name || 'Tanpa Nama'
const title = node?.data?.title || 'Tanpa Jabatan'
const description = node?.data?.description || ''
return (
<Transition mounted transition="pop" duration={240}>
<Transition mounted transition="pop" duration={240}>
{(styles) => (
<Card
radius="lg"
@@ -374,19 +261,17 @@ function nodeTemplate(node: any) {
<Text size="xs" c="dimmed" mt={8} lineClamp={3}>
{description || 'Belum ada deskripsi.'}
</Text>
<Tooltip label="Kembali ke struktur organisasi" withArrow position="bottom">
<Tooltip label="Lihat Detail" withArrow position="bottom">
<Button
variant="light"
size="xs"
mt="md"
onClick={() => {
const id = node?.data?.positionId
if (id && (window as any).scrollTo) {
;(window as any).scrollTo({ top: 0, behavior: 'smooth' })
}
const id = node?.data?.id
router.push(`/darmasaba/ppid/struktur-ppid/${id}`)
}}
>
Kembali
Lihat Detail
</Button>
</Tooltip>
</Card>
@@ -394,6 +279,3 @@ function nodeTemplate(node: any) {
</Transition>
)
}

4
src/app/darmasaba/(pages)/ppid/visi-misi-ppid/page.tsx
View File

@@ -73,7 +73,7 @@ function Page() {
<Text
fz={{ base: 'md', md: 'lg' }}
lh={1.7}
ta="justify"
ta="center"
dangerouslySetInnerHTML={{ __html: item.visi }}
style={{wordBreak: "break-word", whiteSpace: "normal"}}
/>
@@ -88,7 +88,7 @@ function Page() {
<Text
fz={{ base: 'md', md: 'lg' }}
lh={1.7}
ta="justify"
ta="center"
dangerouslySetInnerHTML={{ __html: item.misi }}
style={{wordBreak: "break-word", whiteSpace: "normal"}}
/>

69
src/app/darmasaba/_com/NavBarSearch.tsx
View File

@@ -1,20 +1,63 @@
import { useRef, useState, useEffect } from 'react';
import stateNav from "@/state/state-nav";
import { Container, Stack, Tooltip } from "@mantine/core";
import { Container, Stack, ActionIcon, Box } from "@mantine/core";
import { IconX } from '@tabler/icons-react';
import GlobalSearch from "./globalSearch";
export function NavbarSearch() {
const [isOpen, setIsOpen] = useState(false);
const containerRef = useRef<HTMLDivElement>(null);
// Close when clicking outside
useEffect(() => {
function handleClickOutside(event: MouseEvent) {
if (containerRef.current && !containerRef.current.contains(event.target as Node)) {
setIsOpen(false);
stateNav.clear();
}
}
// Add event listener
document.addEventListener('mousedown', handleClickOutside);
return () => {
// Clean up
document.removeEventListener('mousedown', handleClickOutside);
};
}, []);
return (
<Container
w={{ base: "100%", md: "80%" }}
fluid
py="xl"
onMouseLeave={stateNav.clear}
<Box
ref={containerRef}
style={{ position: 'relative' }}
>
<Stack pt="xl">
<Tooltip label="Type to search across the site" position="bottom-start" withArrow>
<GlobalSearch />
</Tooltip>
</Stack>
</Container>
<Container
w={{ base: "100%", md: "80%" }}
fluid
py="xl"
>
<Stack pt="xl">
<Box style={{ position: 'relative' }}>
<GlobalSearch />
{isOpen && (
<ActionIcon
onClick={() => {
setIsOpen(false);
stateNav.clear();
}}
style={{
position: 'absolute',
right: 10,
top: '50%',
transform: 'translateY(-50%)',
zIndex: 1000
}}
>
<IconX size={16} />
</ActionIcon>
)}
</Box>
</Stack>
</Container>
</Box>
);
}
}

86
src/app/darmasaba/_com/globalSearch.tsx
View File

@@ -1,53 +1,17 @@
'use client';
import { TextInput, Loader, Stack, Box, Text } from '@mantine/core';
import { useSnapshot } from 'valtio';
import { useRouter } from 'next/navigation';
import searchState, { debouncedFetch } from '@/app/api/[[...slugs]]/_lib/search/searchState';
import { Box, Center, Loader, Stack, Text, TextInput } from '@mantine/core';
import { IconX } from '@tabler/icons-react';
import { useEffect } from 'react';
import searchState from '@/app/api/[[...slugs]]/_lib/search/searchState';
import { useSnapshot } from 'valtio';
import getDetailUrl from './searchUrl';
// Mapping type ke URL
const getDetailUrl = (item: { type?: string; id: string | number; [key: string]: unknown }) => {
const { type, id, kategori } = item;
const typeUrlMap: Record<string, string> = {
programinovasi: `/darmasaba/program-inovasi/${id}`,
desaantikorupsi: '/darmasaba/desa-anti-korupsi',
sdgsdesa: '/darmasaba/sdgs-desa',
apbdes: '/darmasaba/apbdes',
prestasidesa: '/darmasaba/prestasi-desa',
pejabatdesa: '/darmasaba/profile/pejabat-desa',
strukturppid: '/darmasaba/ppid/struktur-ppid',
visimisippid: '/darmasaba/ppid/visi-misi',
dasarhukumppid: '/darmasaba/ppid/dasar-hukum',
profileppid: '/darmasaba/ppid/profile',
daftarinformasipublik: '/darmasaba/ppid/daftar-informasi-publik',
perbekeldarmasaba: '/darmasaba/desa/profile',
berita: `/darmasaba/desa/berita/${kategori}/${id}`,
pengumuman: `/darmasaba/desa/pengumuman/${kategori}/${id}`,
sejarahdesa: '/darmasaba/desa/profile',
visimisidesa: '/darmasaba/desa/profile',
lambangdesa: '/darmasaba/desa/profile',
maskotdesa: '/darmasaba/desa/profile',
profilperbekel: '/darmasaba/desa/profile',
potensi: '/darmasaba/desa/potensi-desa',
galleryFoto: '/darmasaba/desa/gallery/foto',
galleryVideo: '/darmasaba/desa/gallery/video',
pelayananSuratKeterangan: '/darmasaba/desa/layanan',
pelayananPerizinanBerusaha: '/darmasaba/desa/layanan',
pelayananTelunjukSaktiDesa: '/darmasaba/desa/layanan',
pelayananPendudukNonPermanent: '/darmasaba/desa/layanan',
penghargaan: '/darmasaba/desa/penghargaan',
};
return type ? typeUrlMap[type] || '/darmasaba' : '/darmasaba';
};
export default function GlobalSearch() {
const snap = useSnapshot(searchState);
const router = useRouter();
// Infinite scroll listener
// Infinite scroll
useEffect(() => {
const handleScroll = () => {
const bottom =
@@ -59,13 +23,32 @@ export default function GlobalSearch() {
}, [snap.loading]);
return (
<Stack>
<Stack maw={800} mx="auto">
{/* 🔍 Search input */}
<TextInput
placeholder="Cari apapun..."
value={snap.query}
onChange={(e) => (searchState.query = e.currentTarget.value)}
onChange={(e) => (
searchState.query = e.currentTarget.value,
debouncedFetch()
)}
radius="xl"
rightSection={
snap.query ? (
<IconX
size={16}
style={{ cursor: 'pointer' }}
onClick={() => {
searchState.query = '';
searchState.results = [];
}}
/>
) : undefined
}
/>
{/* 📄 Hasil pencarian */}
<div style={{ maxHeight: '400px', overflowY: 'auto' }}>
{snap.results.map((item, i) => (
<Box
key={i}
@@ -74,12 +57,16 @@ export default function GlobalSearch() {
borderBottom: '1px solid #eee',
cursor: 'pointer',
transition: 'background 0.2s',
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
maxWidth: '100%'
}}
onMouseEnter={(e) => (e.currentTarget.style.background = '#f5f5f5')}
onMouseLeave={(e) => (e.currentTarget.style.background = 'transparent')}
onClick={() => {
const url = getDetailUrl(item);
router.push(url);
window.location.href = url;
}}
>
<Text size="sm" fw={500}>
@@ -90,8 +77,15 @@ export default function GlobalSearch() {
</Text>
</Box>
))}
</div>
{snap.loading && <Loader size="sm" />}
{/* ⏳ Loader di bawah hasil */}
{snap.loading && (
<Center py="md">
<Loader size="sm" />
</Center>
)}
</Stack>
);
}

2
src/app/darmasaba/_com/main-page/penghargaan/index.tsx
View File

@@ -68,7 +68,7 @@ function Penghargaan() {
variant="gradient"
gradient={{ from: "cyan", to: "blue", deg: 60 }}
>
Penghargaan & Prestasi Desa
Penghargaan Desa
</Text>
{loading ? (

36
src/app/darmasaba/_com/scrollToTopButton.tsx Normal file
View File

@@ -0,0 +1,36 @@
'use client'
import { useWindowScroll } from '@mantine/hooks';
import { ActionIcon, Transition } from '@mantine/core';
import { IconArrowUp } from '@tabler/icons-react';
import colors from '@/con/colors';
function ScrollToTopButton() {
const [scroll, scrollTo] = useWindowScroll();
return (
<Transition
mounted={scroll.y > 300}
transition="slide-up"
duration={300}
timingFunction="ease"
>
{(styles) => (
<ActionIcon
style={styles}
size="xl"
radius="xl"
variant="filled"
color={colors['blue-button']}
onClick={() => scrollTo({ y: 0 })}
pos="fixed"
bottom={24}
right={24}
aria-label="Kembali ke atas"
>
<IconArrowUp size={20} />
</ActionIcon>
)}
</Transition>
);
}
export default ScrollToTopButton

60
src/app/darmasaba/_com/searchUrl.tsx Normal file
View File

@@ -0,0 +1,60 @@
const getDetailUrl = (item: { type?: string; id: string | number; [key: string]: unknown }) => {
const { type, id, kategori } = item;
const typeUrlMap: Record<string, string> = {
programinovasi: `/darmasaba/program-inovasi/${id}`,
desaantikorupsi: '/darmasaba/desa-anti-korupsi',
sdgsdesa: '/darmasaba/sdgs-desa',
apbdes: '/darmasaba/apbdes',
prestasidesa: '/darmasaba/prestasi-desa',
pejabatdesa: '/darmasaba/profile/pejabat-desa',
strukturppid: '/darmasaba/ppid/struktur-ppid',
visimisippid: '/darmasaba/ppid/visi-misi',
dasarhukumppid: '/darmasaba/ppid/dasar-hukum',
profileppid: '/darmasaba/ppid/profile',
daftarinformasipublik: '/darmasaba/ppid/daftar-informasi-publik',
perbekeldarmasaba: '/darmasaba/desa/profile',
berita: `/darmasaba/desa/berita/${kategori}/${id}`,
pengumuman: `/darmasaba/desa/pengumuman/${kategori}/${id}`,
sejarahdesa: '/darmasaba/desa/profile',
visimisidesa: '/darmasaba/desa/profile',
lambangdesa: '/darmasaba/desa/profile',
maskotdesa: '/darmasaba/desa/profile',
profilperbekel: '/darmasaba/desa/profile',
potensi: '/darmasaba/desa/potensi-desa',
galleryFoto: '/darmasaba/desa/gallery/foto',
galleryVideo: '/darmasaba/desa/gallery/video',
pelayananSuratKeterangan: '/darmasaba/desa/layanan',
pelayananPerizinanBerusaha: '/darmasaba/desa/layanan',
pelayananTelunjukSaktiDesa: '/darmasaba/desa/layanan',
pelayananPendudukNonPermanent: '/darmasaba/desa/layanan',
penghargaan: '/darmasaba/desa/penghargaan',
posyandu: '/darmasaba/kesehatan/posyandu',
fasilitasKesehatan: '/darmasaba/kesehatan/data-kesehatan-warga',
jadwalKegiatan: '/darmasaba/kesehatan/data-kesehatan-warga',
artikelKesehatan: '/darmasaba/kesehatan/data-kesehatan-warga',
puskesmas: '/darmasaba/kesehatan/puskesmas',
programKesehatan: '/darmasaba/kesehatan/program-kesehatan',
penangananDarurat: '/darmasaba/kesehatan/penanganan-darurat',
kontakDarurat: '/darmasaba/kesehatan/kontak-darurat',
infoWabahPenyakit: '/darmasaba/kesehatan/info-wabah-penyakit',
keamananLingkungan: '/darmasaba/keamanan/keamanan-lingkungan-pecalang-patwal',
polsekTerdekat: '/darmasaba/keamanan/polsek-terdekat',
kontakDaruratKeamanan: '/darmasaba/keamanan/kontak-darurat',
pencegahanKriminalitas: '/darmasaba/keamanan/pencegahan-kriminalitas',
laporanPublik: '/darmasaba/keamanan/laporan-publik',
tipsKeamanan: '/darmasaba/keamanan/tips-keamanan',
pasarDesa: '/darmasaba/ekonomi/pasar-desa',
lowonganKerjaLokal: '/darmasaba/ekonomi/lowongan-kerja-lokal',
strukturOrganisasi: '/darmasaba/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa',
jumlahPendudukUsiaKerjaYangMenganggurUsia: '/darmasaba/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur',
jumlahPendudukUsiaKerjaYangMenganggurPendidikan: '/darmasaba/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur',
jumlahPendudukMiskin: '/darmasaba/ekonomi/jumlah-penduduk-miskin',
programKemiskinan: '/darmasaba/ekonomi/program-kemiskinan',
sektorUnggulanDesa: '/darmasaba/ekonomi/sektor-unggulan-desa',
demografiPekerjaan: '/darmasaba/ekonomi/demografi-pekerjaan',
};
return typeUrlMap[type || ''] || '/darmasaba';
};
export default getDetailUrl;

29
src/app/darmasaba/page.tsx
View File

@@ -8,23 +8,28 @@ import colors from "@/con/colors";
import SDGS from "./_com/main-page/sdgs";
// import ApiFetch from "@/lib/api-fetch";
import { Stack } from "@mantine/core";
import { Box, Stack } from "@mantine/core";
import Apbdes from "./_com/main-page/apbdes";
import Prestasi from "./_com/main-page/prestasi";
import ScrollToTopButton from "./_com/scrollToTopButton";
export default function Page() {
return (
<Stack bg={colors.grey[1]} gap={"4rem"}>
<LandingPage />
<Penghargaan />
<Layanan />
<Potensi />
<DesaAntiKorupsi />
<Kepuasan />
<SDGS />
<Apbdes />
<Prestasi/>
</Stack>
<Box>
<Stack bg={colors.grey[1]} gap={"4rem"}>
<LandingPage />
<Penghargaan />
<Layanan />
<Potensi />
<DesaAntiKorupsi />
<Kepuasan />
<SDGS />
<Apbdes />
<Prestasi />
</Stack>
{/* Tombol Scroll ke Atas */}
<ScrollToTopButton />
</Box>
);
}