diff --git a/src/app/admin/(dashboard)/_com/modalNonaktif.tsx b/src/app/admin/(dashboard)/_com/modalNonaktif.tsx new file mode 100644 index 00000000..9b3c3826 --- /dev/null +++ b/src/app/admin/(dashboard)/_com/modalNonaktif.tsx @@ -0,0 +1,36 @@ +// components/modal/ModalKonfirmasiHapus.tsx +import colors from "@/con/colors" +import { Modal, Text, Button, Flex } from "@mantine/core" + +interface ModalKonfirmasiNonAktifProps { + opened: boolean + loading?: boolean + onClose: () => void + onConfirm: () => void + text: string +} + +export function ModalKonfirmasiNonAktif({ + opened, + loading = false, + onClose, + onConfirm, + text, +}: ModalKonfirmasiNonAktifProps) { + return ( + Konfirmasi Non Aktif} + centered + > + {text} + + + + + + ) +} diff --git a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/_lib/layoutTabs.tsx b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/_lib/layoutTabs.tsx index ff6d98fc..e252c31d 100644 --- a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/_lib/layoutTabs.tsx +++ b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/_lib/layoutTabs.tsx @@ -2,6 +2,7 @@ 'use client' import colors from '@/con/colors'; import { + Box, ScrollArea, Stack, Tabs, @@ -85,36 +86,76 @@ function LayoutTabs({ children }: { children: React.ReactNode }) { keepMounted={false} > {/* ✅ Scroll horizontal wrapper */} - - + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + + + + - {tabs.map((tab, i) => ( - - {tab.label} - - ))} - - + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + {tabs.map((tab, i) => ( + {/* Header */} - - + + {/* Desktop Table */} + +
- Tahun - Pembiayaan - Belanja - Pendapatan - Aksi + + Tahun + + + Pembiayaan + + + Belanja + + + Pendapatan + + + Aksi + {filteredData.length > 0 ? ( filteredData.map((item) => ( - {item.tahun} - {formatRupiah( - item.pembiayaan.reduce( - (sum, val) => sum + Number(val.value), - 0 - ) - )} + {item.tahun} - {formatRupiah( - item.belanja.reduce( - (sum, val) => sum + Number(val.value), - 0 - ) - )} + + {formatRupiah( + item.pembiayaan.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + - {formatRupiah( - item.pendapatan.reduce( - (sum, val) => sum + Number(val.value), - 0 - ) - )} + + {formatRupiah( + item.belanja.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + + + + + {formatRupiah( + item.pendapatan.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + @@ -154,7 +186,7 @@ function ListAPBDesa({ search }: { search: string }) {
- + Tidak ada data APB Desa yang cocok
@@ -164,7 +196,81 @@ function ListAPBDesa({ search }: { search: string }) {
+ + {/* Mobile Cards */} + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + Tahun + {item.tahun} + + + Pembiayaan + + {formatRupiah( + item.pembiayaan.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + + + + Belanja + + {formatRupiah( + item.belanja.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + + + + Pendapatan + + {formatRupiah( + item.pendapatan.reduce( + (sum, val) => sum + Number(val.value), + 0 + ) + )} + + + + + + )) + ) : ( +
+ + Tidak ada data APB Desa yang cocok + +
+ )} + + +
+ {/* Header */} - - + +
- Nama - Nilai - Persentase - Aksi + Nama + Nilai + Persentase + Aksi @@ -123,15 +140,19 @@ function ListBelanja({ search }: { search: string }) { {filteredData.map((item) => ( - + {item.name} - {formatRupiah(item.value)} - {totalBelanja > 0 - ? ((item.value / totalBelanja) * 100).toFixed(0) + '%' - : '0%'} + {formatRupiah(item.value)} + + + + {totalBelanja > 0 + ? ((item.value / totalBelanja) * 100).toFixed(0) + '%' + : '0%'} + @@ -165,18 +186,20 @@ function ListBelanja({ search }: { search: string }) { ))} - Total + Total - {formatRupiah(totalBelanja)} + {formatRupiah(totalBelanja)} ) : ( -
- Tidak ada data belanja yang cocok +
+ + Tidak ada data belanja yang cocok +
@@ -186,21 +209,107 @@ function ListBelanja({ search }: { search: string }) { + {/* Mobile Cards */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Nama + + + {item.name} + + + + + Nilai + + + {formatRupiah(item.value)} + + + + + Persentase + + + {totalBelanja > 0 + ? ((item.value / totalBelanja) * 100).toFixed(0) + '%' + : '0%'} + + + + + + + + + )) + ) : ( + +
+ + Tidak ada data belanja yang cocok + +
+ + )} + + {filteredData.length > 0 && ( + + + + Total + + + {formatRupiah(totalBelanja)} + + + + )} + + {/* Pagination */} -
- { - load(newPage, 10, search); - window.scrollTo({ top: 0, behavior: 'smooth' }); - }} - total={totalPages} - mt="md" - mb="md" - color="blue" - radius="md" - /> -
+ {(totalPages > 1 || page > 1) && ( +
+ { + load(newPage, 10, search); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }} + total={totalPages} + mt="md" + color="blue" + radius="md" + /> +
+ )} {/* Modal Konfirmasi Hapus */} - + ); } -export default Belanja; +export default Belanja; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/layout.tsx b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/layout.tsx index 3a414c77..34fe9efa 100644 --- a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/layout.tsx +++ b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/layout.tsx @@ -1,7 +1,30 @@ +'use client' import React from 'react'; import LayoutTabs from './_lib/layoutTabs'; +import { usePathname } from 'next/navigation'; +import { Box } from '@mantine/core'; function Layout({ children }: { children: React.ReactNode }) { +const pathname = usePathname(); + + // Contoh path: + // - /darmasaba/desa/berita/semua → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan/123 → panjang 6 → detail + + const segments = pathname.split('/').filter(Boolean); + const isDetailPage = segments.length >= 5; + + if (isDetailPage) { + // Tampilkan tanpa tab menu + return ( + + {children} + + ); + } + + return ( {children} diff --git a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pembiayaan/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pembiayaan/[id]/page.tsx index c7e642dd..b0b0ed38 100644 --- a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pembiayaan/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pembiayaan/[id]/page.tsx @@ -105,7 +105,7 @@ function EditPembiayaan() { }; return ( - + {/* Header */} - -
+ {/* Desktop Table */} + +
- Nama - Nilai - Persentase + Nama + Nilai + Persentase Aksi @@ -122,15 +134,19 @@ function ListPembiayaan({ search }: { search: string }) { {filteredData.map((item) => ( - + {item.name} - {formatRupiah(item.value)} - {totalPembiayaan > 0 - ? ((item.value / totalPembiayaan) * 100).toFixed(0) + '%' - : '0%'} + {formatRupiah(item.value)} + + + + {totalPembiayaan > 0 + ? ((item.value / totalPembiayaan) * 100).toFixed(0) + '%' + : '0%'} + @@ -163,16 +179,20 @@ function ListPembiayaan({ search }: { search: string }) { {/* Total Row */} - Total + Total + + + {formatRupiah(totalPembiayaan)} - {formatRupiah(totalPembiayaan)} ) : (
- Tidak ada data pembiayaan yang cocok + + Tidak ada data pembiayaan yang cocok +
@@ -180,6 +200,79 @@ function ListPembiayaan({ search }: { search: string }) {
+ + {/* Mobile Card View */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + Nama + + {item.name} + + + + Nilai + + {formatRupiah(item.value)} + + + + Persentase + + {totalPembiayaan > 0 + ? ((item.value / totalPembiayaan) * 100).toFixed(0) + '%' + : '0%'} + + + + + + + + + )) + ) : ( +
+ + Tidak ada data pembiayaan yang cocok + +
+ )} + + {filteredData.length > 0 && ( + + + Total + {formatRupiah(totalPembiayaan)} + + + )} + {/* Pagination */} @@ -205,8 +298,8 @@ function ListPembiayaan({ search }: { search: string }) { onConfirm={handleDelete} text="Apakah anda yakin ingin menghapus pembiayaan ini?" /> - + ); } -export default Pembiayaan; +export default Pembiayaan; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pendapatan/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pendapatan/[id]/page.tsx index 0ae681e0..5b68ff7e 100644 --- a/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pendapatan/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/PADesa-pendapatan-asli-desa/pendapatan/[id]/page.tsx @@ -114,7 +114,7 @@ function EditPendapatan() { }; return ( - + {/* Header with Back Button */} - - + {/* Desktop Table */} + +
- Nama - Nilai - Edit - Delete + + Nama + + + Nilai + + + Edit + + + Delete + @@ -123,11 +142,13 @@ function ListPendapatan({ search }: { search: string }) { {filteredData.map((item) => ( - + {item.name} - {formatRupiah(item.value)} + + {formatRupiah(item.value)} + @@ -149,8 +172,10 @@ function ListPendapatan({ search }: { search: string }) { setSelectedId(item.id); setModalHapus(true); }} + fz="sm" + px="xs" > - + Hapus @@ -159,19 +184,21 @@ function ListPendapatan({ search }: { search: string }) { {/* Row total */} - - Total + + Total - {formatRupiah(totalValue)} + {formatRupiah(totalValue)} ) : ( -
- Tidak ada data pendapatan yang cocok +
+ + Tidak ada data pendapatan yang cocok +
@@ -179,23 +206,85 @@ function ListPendapatan({ search }: { search: string }) {
+ + {/* Mobile Cards */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + Nama + {item.name} + + + Nilai + {formatRupiah(item.value)} + + + + + + + + )) + ) : ( +
+ + Tidak ada data pendapatan yang cocok + +
+ )} + + {filteredData.length > 0 && ( + + + Total + {formatRupiah(totalValue)} + + + )} + {/* Pagination */} -
- { - load(newPage, 10, search); - window.scrollTo({ top: 0, behavior: 'smooth' }); - }} - total={totalPages} - mt="md" - mb="md" - color="blue" - radius="md" - /> -
+ {totalPages > 1 && ( +
+ { + load(newPage, 10, search); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }} + total={totalPages} + color="blue" + radius="md" + size="sm" + /> +
+ )} {/* Modal Konfirmasi Hapus */} + }, + { + label: "Posisi Organisasi", + value: "posisiorganisasi", + href: "/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/posisi-organisasi", + icon: + }, + { + label: "Struktur Organisasi", + value: "strukturorganisasi", + href: "/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/struktur-organisasi", + icon: + } + ]; + + const currentTab = tabs.find((tab) => tab.href === pathname); + const [activeTab, setActiveTab] = useState( + currentTab?.value || tabs[0].value + ); + + const handleTabChange = (value: string | null) => { + const tab = tabs.find((t) => t.value === value); + if (tab) { + router.push(tab.href); + } + setActiveTab(value); + }; + + useEffect(() => { + const match = tabs.find((tab) => tab.href === pathname); + if (match) { + setActiveTab(match.value); + } + }, [pathname]); + + return ( + + + Struktur Organisasi & SK Pengurus BUMDes + + + + {/* ✅ Scroll horizontal biar rapi kalau label panjang */} + + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + + + + + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + + {tabs.map((tab, i) => ( + + {children} + + ))} + + + ); +} + +export default LayoutTabs; diff --git a/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/layout.tsx b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/layout.tsx new file mode 100644 index 00000000..cfb11bcd --- /dev/null +++ b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/layout.tsx @@ -0,0 +1,33 @@ +'use client' + +import { usePathname } from "next/navigation"; +import LayoutTabs from "./_lib/layoutTabs" +import { Box } from "@mantine/core"; + + +export default function Layout({ children }: { children: React.ReactNode }) { + const pathname = usePathname(); + + // Contoh path: + // - /darmasaba/desa/berita/semua → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan/123 → panjang 6 → detail + + const segments = pathname.split('/').filter(Boolean); + const isDetailPage = segments.length >= 5; + + if (isDetailPage) { + // Tampilkan tanpa tab menu + return ( + + {children} + + ); + } + + return ( + + {children} + + ) +} \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/[id]/edit/page.tsx similarity index 98% rename from src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/[id]/edit/page.tsx rename to src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/[id]/edit/page.tsx index 89046ef6..ef14160e 100644 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/[id]/edit/page.tsx @@ -143,7 +143,7 @@ export default function EditPegawaiBumDes() { if (id && !stateOrganisasi.edit.id) stateOrganisasi.edit.id = id; const success = await stateOrganisasi.edit.submit(); - if (success) router.push('/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai'); + if (success) router.push('/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai'); } catch (error) { console.error('Error updating pegawai:', error); toast.error(error instanceof Error ? error.message : 'Gagal memperbarui data pegawai'); @@ -153,12 +153,12 @@ export default function EditPegawaiBumDes() { }; return ( - + - Edit Data Pegawai PPID + Edit Data Pegawai BumDes + - Tambah Pegawai BUMDesa + Tambah Pegawai BUMDes diff --git a/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/page.tsx b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/page.tsx new file mode 100644 index 00000000..e6b6078c --- /dev/null +++ b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai/page.tsx @@ -0,0 +1,232 @@ +/* eslint-disable react-hooks/exhaustive-deps */ +'use client' +import colors from '@/con/colors'; +import { Badge, Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, ThemeIcon, Title } from '@mantine/core'; +import { IconCheck, IconDeviceImacCog, IconPlus, IconSearch, IconX } from '@tabler/icons-react'; +import { useRouter } from 'next/navigation'; +import { useEffect, useState } from 'react'; +import { useProxy } from 'valtio/utils'; +import HeaderSearch from '../../../_com/header'; +import stateStrukturBumDes from '../../../_state/ekonomi/struktur-organisasi/struktur-organisasi'; +import { useDebouncedValue } from '@mantine/hooks'; + +function PegawaiBumDes() { + const [search, setSearch] = useState(""); + return ( + + } + value={search} + onChange={(e) => setSearch(e.currentTarget.value)} + /> + + + ); +} + +function ListPegawaiBumdes({ search }: { search: string }) { + const stateOrganisasi = useProxy(stateStrukturBumDes.pegawai); + const router = useRouter(); + const [debouncedSearch] = useDebouncedValue(search, 1000); + + const { + data, + page, + totalPages, + loading, + load, + } = stateOrganisasi.findMany; + + useEffect(() => { + load(page, 10, debouncedSearch); + }, [page, debouncedSearch]); + + const filteredData = data || []; + + // Handle loading state + if (loading || !data) { + return ( + + + + ); + } + + if (data.length === 0) { + return ( + + + + Daftar Pegawai BUMDes + Daftar Pegawai BUMDes + + +
+ + Tidak ada data pegawai yang ditemukan + +
+ + + ); + } + + const sortedData = [...filteredData].sort((a, b) => { + if (a.isActive === b.isActive) { + return a.namaLengkap.localeCompare(b.namaLengkap); + } + return Number(b.isActive) - Number(a.isActive); + }); + + return ( + + + + Daftar Pegawai BUMDes + Daftar Pegawai BUMDes + + + + {/* Desktop: Table */} + + + + + Nama Lengkap + Posisi + Status + Aksi + + + + {sortedData.map((item) => ( + + + + {item.namaLengkap} + + + + + {item.posisi?.nama || 'Belum diatur'} + + + + + {item.isActive ? "Aktif" : "Tidak Aktif"} + + + + + + + ))} + +
+ + + {/* Mobile: Card List */} + + {sortedData.map((item) => ( + + + + Nama Lengkap + + {item.namaLengkap} + + + + Posisi + + {item.posisi?.nama || 'Belum diatur'} + + + + Status + + {item.isActive ? ( + + + + + Aktif + + ) : ( + + + + + Tidak Aktif + + )} + + + + + + + + ))} + + +
+ { + load(newPage, 10); + window.scrollTo(0, 0); + }} + total={totalPages} + withEdges + withControls + radius="md" + /> +
+ + + ); +} + +export default PegawaiBumDes; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/posisi-organisasi/[id]/page.tsx similarity index 97% rename from src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/[id]/page.tsx rename to src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/posisi-organisasi/[id]/page.tsx index a58d838c..cb9f03ff 100644 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/posisi-organisasi/[id]/page.tsx @@ -95,7 +95,7 @@ function EditPosisiOrganisasiBumDes() { const success = await stateOrganisasi.edit.update(); if (success) { - router.push('/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi'); + router.push('/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/posisi-organisasi'); } } catch (err) { console.error('Error updating posisi organisasi:', err); @@ -106,7 +106,7 @@ function EditPosisiOrganisasiBumDes() { }; return ( - + + + + {/* Desktop Table */} + + + + + + + Nama Posisi + + + + + Deskripsi + + + + + Hierarki + + + + + Edit + + + + + Hapus + + + + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + {item.nama} + + + + + {item.deskripsi || '-'} + + + + {item.hierarki || '-'} + + + + + + + + + )) + ) : ( + + +
+ + Tidak ada data posisi organisasi yang cocok + +
+ + + )} + +
+ + + {/* Mobile Cards */} + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Nama Posisi + + + {item.nama} + + + + + Deskripsi + + + {item.deskripsi || '-'} + + + + + Hierarki + + + {item.hierarki || '-'} + + + + + + + + + )) + ) : ( +
+ + Tidak ada data posisi organisasi yang cocok + +
+ )} + + + + + {totalPages > 1 && ( +
+ { + load(newPage, 10, search); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }} + total={totalPages} + mt="md" + mb="md" + color="blue" + radius="md" + /> +
+ )} + + {/* Modal Hapus */} + setModalHapus(false)} + onConfirm={handleHapus} + text="Apakah anda yakin ingin menghapus posisi organisasi BumDes ini?" + /> + + ); +} + +export default PosisiOrganisasiBumDes; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/struktur-organisasi/page.tsx b/src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/struktur-organisasi/page.tsx similarity index 100% rename from src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/struktur-organisasi/page.tsx rename to src/app/admin/(dashboard)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/struktur-organisasi/page.tsx diff --git a/src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/[id]/page.tsx index 31f4eb71..4ad28f5e 100644 --- a/src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/[id]/page.tsx @@ -118,7 +118,7 @@ export default function EditDemografiPekerjaan() { }; return ( - + {/* Header */} - - + {/* Desktop Table */} + +
- Pekerjaan - Laki - Laki - Perempuan - Edit - Hapus + Pekerjaan + Laki - Laki + Perempuan + Edit + Hapus {filteredData.length > 0 ? ( filteredData.map((item) => ( - {item.pekerjaan} - {item.lakiLaki} - {item.perempuan} + {item.pekerjaan} + {item.lakiLaki} + {item.perempuan} @@ -158,17 +175,22 @@ function ListDemografiPekerjaan({ search }: { search: string }) { setSelectedId(item.id); setModalHapus(true); }} + fz="sm" + px="xs" + py="xs" > - + )) ) : ( - +
- Tidak ada data demografi pekerjaan yang cocok + + Tidak ada data demografi pekerjaan yang cocok +
@@ -176,6 +198,78 @@ function ListDemografiPekerjaan({ search }: { search: string }) {
+ + {/* Mobile Card */} + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Pekerjaan + + + {item.pekerjaan} + + + + + Laki - Laki + + + {item.lakiLaki} + + + + + Perempuan + + + {item.perempuan} + + + + + + + + + )) + ) : ( +
+ + Tidak ada data demografi pekerjaan yang cocok + +
+ )} + + {/* Pagination */} @@ -195,10 +289,13 @@ function ListDemografiPekerjaan({ search }: { search: string }) {
{/* Chart */} - - - - + <Box mt={{ base: 'lg', md: 'xl' }}> + <Paper bg={colors['white-1']} p={{ base: 'md', md: 'lg' }} radius="md" withBorder> + <Stack gap="xs"> + <Title + order={4} + lh={{ base: 1.2, md: 1.15 }} + > Grafik Demografi Pekerjaan {mounted && chartData.length > 0 ? ( @@ -213,17 +310,23 @@ function ListDemografiPekerjaan({ search }: { search: string }) { ]} /> ) : ( - Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik + )} - - - - - Laki - Laki + + + + + + Laki - Laki + - - - Perempuan + + + + Perempuan + @@ -242,4 +345,4 @@ function ListDemografiPekerjaan({ search }: { search: string }) { ); } -export default DemografiPekerjaan; +export default DemografiPekerjaan; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin/[id]/page.tsx index 8187abde..6dd1ff92 100644 --- a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin/[id]/page.tsx @@ -100,7 +100,7 @@ function EditJumlahPendudukMiskin() { }; return ( - + - - + {/* Desktop Table */} + +
- Tahun - Jumlah Penduduk Miskin - Edit - Delete + + + Tahun + + + + + Jumlah Penduduk Miskin + + + + + Edit + + + + + Delete + + {filteredData.length > 0 ? ( filteredData.map((item) => ( - {item.year} - {item.totalPoorPopulation} + + + {item.year} + + + + + {item.totalPoorPopulation} + +
+ + {/* Mobile Card View */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Tahun + + + {item.year} + + + + + Jumlah Penduduk Miskin + + + {item.totalPoorPopulation} + + + + + + + + + )) + ) : ( +
+ + Tidak ada data yang cocok + +
+ )} + {/* Pagination */} @@ -185,9 +276,9 @@ function ListJumlahPendudukMiskin({ search }: { search: string }) { {/* Bar Chart */} - - - + <Paper bg={colors['white-1']} p={{ base: 'sm', md: 'md' }} mt="lg" withBorder radius="md"> + <Stack gap="xs"> + <Title order={4} lh={1.2} mb="sm"> Grafik Jumlah Penduduk Miskin {mounted && chartData.length > 0 ? ( @@ -198,14 +289,14 @@ function ListJumlahPendudukMiskin({ search }: { search: string }) { value: item.totalPoorPopulation, }))} dataKey="name" - series={[ - { name: 'value', color: colors['blue-button'] }, - ]} + series={[{ name: 'value', color: colors['blue-button'] }]} withTooltip valueFormatter={(v) => `${v.toLocaleString()} jiwa`} /> ) : ( - Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik + )} @@ -217,8 +308,8 @@ function ListJumlahPendudukMiskin({ search }: { search: string }) { onConfirm={handleDelete} text="Apakah anda yakin ingin menghapus data ini?" /> - + ); } -export default JumlahPendudukMiskin; +export default JumlahPendudukMiskin; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/_lib/layoutTabs.tsx b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/_lib/layoutTabs.tsx index ee70c101..495cc876 100644 --- a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/_lib/layoutTabs.tsx +++ b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/_lib/layoutTabs.tsx @@ -2,6 +2,7 @@ 'use client' import colors from '@/con/colors'; import { + Box, ScrollArea, Stack, Tabs, @@ -61,36 +62,76 @@ function LayoutTabs({ children }: { children: React.ReactNode }) { radius="lg" keepMounted={false} > - - + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + + + + - {tabs.map((tab, i) => ( - - {tab.label} - - ))} - - + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + {tabs.map((tab, i) => ( = 5; + + if (isDetailPage) { + // Tampilkan tanpa tab menu + return ( + + {children} + + ); + } + return ( {children} diff --git a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/[id]/page.tsx index e2991004..bb0a39e6 100644 --- a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/[id]/page.tsx @@ -93,7 +93,7 @@ function EditGrafikBerdasarkanPendidikan() { }; return ( - + - - + + + List Pengangguran Berdasarkan Pendidikan + + + + + {/* Desktop Table */} + +
- SD - SMP - SMA - D3 - S1 - Edit - Delete + SD + SMP + SMA + D3 + S1 + Edit + Delete @@ -147,7 +177,7 @@ function ListGrafikBerdasarkanPendidikan({ search }: { search: string }) {
- + Belum ada data grafik responden
@@ -156,11 +186,31 @@ function ListGrafikBerdasarkanPendidikan({ search }: { search: string }) { ) : ( filteredData.map((item) => ( - {item.SD} - {item.SMP} - {item.SMA} - {item.D3} - {item.S1} + + + {item.SD} + + + + + {item.SMP} + + + + + {item.SMA} + + + + + {item.D3} + + + + + {item.S1} + +
+ + {/* Mobile Cards */} + + {filteredData.length === 0 ? ( +
+ + Belum ada data grafik responden + +
+ ) : ( + + {filteredData.map((item) => ( + + + + + SD + + + {item.SD} + + + + + SMP + + + {item.SMP} + + + + + SMA + + + {item.SMA} + + + + + D3 + + + {item.D3} + + + + + S1 + + + {item.S1} + + + + + + + + + ))} + + )} + {/* Pagination */} @@ -211,10 +347,10 @@ function ListGrafikBerdasarkanPendidikan({ search }: { search: string }) { /> - {/* Donut Chart */} - - - + {/* Section: Donut Chart */} + <Paper withBorder bg={colors['white-1']} p={{ base: 'sm', md: 'lg' }} shadow="md" radius="md"> + <Stack gap="md"> + <Title order={4} lh={1.2}> Grafik Pengangguran Berdasarkan Pendidikan
@@ -228,7 +364,7 @@ function ListGrafikBerdasarkanPendidikan({ search }: { search: string }) { thickness={40} /> ) : ( - + Belum ada data untuk ditampilkan dalam grafik )} @@ -243,8 +379,8 @@ function ListGrafikBerdasarkanPendidikan({ search }: { search: string }) { onConfirm={handleDelete} text="Apakah anda yakin ingin menghapus grafik pengangguran berdasarkan pendidikan ini?" /> - + ); } -export default GrafikBerdasarkanPendidikan; +export default GrafikBerdasarkanPendidikan; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/[id]/page.tsx b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/[id]/page.tsx index ce974a57..51244c13 100644 --- a/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/[id]/page.tsx @@ -106,7 +106,7 @@ function EditGrafikBerdasarkanUsiaKerjaYangMenganggur() { }; return ( - + - - + + + List Pengangguran Berdasarkan Usia Kerja + + + + + {/* Desktop Table */} + +
- Usia 18-25 - Usia 26-35 - Usia 36-45 - Usia 46+ - Edit - Delete + Usia 18-25 + Usia 26-35 + Usia 36-45 + Usia 46+ + Edit + Delete {filteredData.length > 0 ? ( filteredData.map((item) => ( - {item.usia18_25} - {item.usia26_35} - {item.usia36_45} - {item.usia46_keatas} + + {item.usia18_25} + + + {item.usia26_35} + + + {item.usia36_45} + + + {item.usia46_keatas} +
+ + {/* Mobile Card View */} + + {filteredData.length > 0 ? ( + + {filteredData.map((item) => ( + + + + + Usia 18-25 + + + {item.usia18_25} + + + + + Usia 26-35 + + + {item.usia26_35} + + + + + Usia 36-45 + + + {item.usia36_45} + + + + + Usia 46+ + + + {item.usia46_keatas} + + + + + + + + + ))} + + ) : ( +
+ + Belum ada data grafik responden + +
+ )} + @@ -189,8 +301,8 @@ function ListGrafikBerdasarkanUsiaKerjaYangMenganggur({ search }: { search: stri {/* Donut Chart */} - - + <Stack gap="md"> + <Title order={4} lh={1.2}> Grafik Pengangguran Berdasarkan Usia Kerja {donutData.length > 0 ? ( @@ -205,7 +317,9 @@ function ListGrafikBerdasarkanUsiaKerjaYangMenganggur({ search }: { search: stri />
) : ( - Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik + )} @@ -221,4 +335,4 @@ function ListGrafikBerdasarkanUsiaKerjaYangMenganggur({ search }: { search: stri ); } -export default GrafikBerdasarkanUsiaKerjaYangMenganggur; +export default GrafikBerdasarkanUsiaKerjaYangMenganggur; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran/[id]/edit/page.tsx index 9b6b8872..4a3bf4f3 100644 --- a/src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran/[id]/edit/page.tsx @@ -176,7 +176,7 @@ function EditDetailDataPengangguran() { }; return ( - + - - + {/* Desktop Table */} + +
- Bulan - Terdidik - Tidak Terdidik - Aksi + Bulan + Terdidik + Tidak Terdidik + Aksi {filteredData.length > 0 ? ( filteredData.map((item) => ( - {item.month} {item.year} - {item.educatedUnemployment} - {item.uneducatedUnemployment} + + + {item.month} {item.year} + + + + + {item.educatedUnemployment} + + + + + {item.uneducatedUnemployment} + + @@ -128,7 +155,9 @@ function ListDetailDataPengangguran({ search }: { search: string }) {
- Tidak ada data yang cocok + + Tidak ada data yang cocok +
@@ -136,25 +165,85 @@ function ListDetailDataPengangguran({ search }: { search: string }) {
+ + {/* Mobile Card View */} + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Bulan + + + {item.month} {item.year} + + + + + Terdidik + + + {item.educatedUnemployment} + + + + + Tidak Terdidik + + + {item.uneducatedUnemployment} + + + + + + )) + ) : ( +
+ + Tidak ada data yang cocok + +
+ )} + + -
- { - load(newPage, 10); - window.scrollTo({ top: 0, behavior: 'smooth' }); - }} - total={totalPages} - mt="md" - mb="md" - color="blue" - radius="md" - /> -
+ + {/* Pagination */} + {totalPages > 1 && ( +
+ { + load(newPage, 10); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }} + total={totalPages} + mt="md" + mb="md" + color="blue" + radius="md" + /> +
+ )} {/* Chart Section */} - - + <Paper withBorder bg={colors['white-1']} p={{ base: 'sm', md: 'lg' }} shadow="md" radius="md"> + <Title order={4} lh={1.2} mb={{ base: 'sm', md: 'md' }}> Data Pengangguran Terdidik & Tidak Terdidik {mounted && chartData.length > 0 ? ( @@ -170,11 +259,13 @@ function ListDetailDataPengangguran({ search }: { search: string }) { /> ) : ( - Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik + )} ); } -export default DetailDataPengangguran; +export default DetailDataPengangguran; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/edit/page.tsx index 0cc7b4b6..3fdad936 100644 --- a/src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/[id]/edit/page.tsx @@ -125,7 +125,7 @@ function EditLowonganKerja() { }; return ( - + + - - + {/* Desktop Table */} + +
- Pekerjaan - Nama Perusahaan - Lokasi - Aksi + + Pekerjaan + + + Nama Perusahaan + + + Lokasi + + + Aksi + {filteredData.length > 0 ? ( filteredData.map((item) => ( - - + + {item.posisi} - - + + {item.namaPerusahaan} - - + + {item.lokasi} - + @@ -128,8 +147,8 @@ function ListLowonganKerjaLokal({ search }: { search: string }) { ) : ( -
- +
+ Tidak ada data lowongan kerja yang cocok
@@ -139,6 +158,57 @@ function ListLowonganKerjaLokal({ search }: { search: string }) {
+ + {/* Mobile Card List */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + Pekerjaan + + {item.posisi} + + + + Nama Perusahaan + + {item.namaPerusahaan} + + + + Lokasi + + {item.lokasi} + + + + + + )) + ) : ( +
+ + Tidak ada data lowongan kerja yang cocok + +
+ )} +
@@ -159,4 +229,4 @@ function ListLowonganKerjaLokal({ search }: { search: string }) { ); } -export default LowonganKerjaLokal; +export default LowonganKerjaLokal; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/pasar-desa/_lib/layoutTabs.tsx b/src/app/admin/(dashboard)/ekonomi/pasar-desa/_lib/layoutTabs.tsx index a4edbe61..e82db659 100644 --- a/src/app/admin/(dashboard)/ekonomi/pasar-desa/_lib/layoutTabs.tsx +++ b/src/app/admin/(dashboard)/ekonomi/pasar-desa/_lib/layoutTabs.tsx @@ -2,6 +2,7 @@ 'use client' import colors from '@/con/colors'; import { + Box, ScrollArea, Stack, Tabs, @@ -68,36 +69,76 @@ function LayoutTabs({ children }: { children: React.ReactNode }) { keepMounted={false} > {/* ✅ Scroll horizontal wrapper */} - - - {tabs.map((tab, i) => ( - - {tab.label} - - ))} - - + + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + + + + + + + {tabs.map((tab, i) => ( + + {tab.label} + + ))} + + + {tabs.map((tab, i) => ( + {/* Header dengan tombol back */} + + Daftar Kategori Produk + + - - + {/* Desktop Table */} + +
- Nama Kategori - Edit - Delete + + + Nama Kategori + + + + + Edit + + + + + Delete + + @@ -92,38 +127,48 @@ function ListKategoriProduk({ search2 }: { search2: string }) { filteredData.map((item) => ( - + {item.nama} +
+
+
- +
+ )) ) : ( -
- Tidak ada data kategori produk yang cocok +
+ + Tidak ada data kategori produk yang cocok +
@@ -131,14 +176,69 @@ function ListKategoriProduk({ search2 }: { search2: string }) {
+ + {/* Mobile Card */} + + {filteredData.length > 0 ? ( + + {filteredData.map((item) => ( + + + + Nama Kategori + + + {item.nama} + + + + + + + + ))} + + ) : ( +
+ + Tidak ada data kategori produk yang cocok + +
+ )} +
{ - load(newPage, 10) - window.scrollTo({ top: 0, behavior: 'smooth' }) + load(newPage, 10); + window.scrollTo({ top: 0, behavior: 'smooth' }); }} total={totalPages} mt="md" @@ -156,7 +256,7 @@ function ListKategoriProduk({ search2 }: { search2: string }) { text='Apakah anda yakin ingin menghapus kategori produk ini?' /> - ) + ); } -export default KategoriProduk; +export default KategoriProduk; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/pasar-desa/layout.tsx b/src/app/admin/(dashboard)/ekonomi/pasar-desa/layout.tsx index 9ebad0e4..db66e722 100644 --- a/src/app/admin/(dashboard)/ekonomi/pasar-desa/layout.tsx +++ b/src/app/admin/(dashboard)/ekonomi/pasar-desa/layout.tsx @@ -1,9 +1,29 @@ 'use client' +import { usePathname } from "next/navigation"; import LayoutTabs from "./_lib/layoutTabs" +import { Box } from "@mantine/core"; -export default function Layout({children} : {children: React.ReactNode}) { +export default function Layout({ children }: { children: React.ReactNode }) { + const pathname = usePathname(); + + // Contoh path: + // - /darmasaba/desa/berita/semua → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan → panjang 5 → list + // - /darmasaba/desa/berita/Pemerintahan/123 → panjang 6 → detail + + const segments = pathname.split('/').filter(Boolean); + const isDetailPage = segments.length >= 5; + + if (isDetailPage) { + // Tampilkan tanpa tab menu + return ( + + {children} + + ); + } return ( {children} diff --git a/src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/edit/page.tsx index 70cb1458..f1116ae9 100644 --- a/src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/pasar-desa/produk-pasar-desa/[id]/edit/page.tsx @@ -157,7 +157,7 @@ function EditPasarDesa() { }; return ( - + - - + {/* Desktop Table */} + +
- Nama Produk - Harga Produk - Rating - Alamat Usaha - Aksi + Nama Produk + Harga Produk + Rating + Alamat Usaha + Aksi @@ -95,18 +104,18 @@ function ListPasarDesa({ search }: { search: string }) { filteredData.map((item) => ( - + {item.nama} - Rp.{item.harga} + Rp.{item.harga} - {item.rating || '-'} + {item.rating || '-'} - + {item.alamatUsaha || '-'} @@ -121,7 +130,7 @@ function ListPasarDesa({ search }: { search: string }) { } > - Detail + Detail @@ -129,8 +138,8 @@ function ListPasarDesa({ search }: { search: string }) { ) : ( -
- +
+ Tidak ada produk pasar desa yang cocok
@@ -140,6 +149,57 @@ function ListPasarDesa({ search }: { search: string }) {
+ + {/* Mobile Cards */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + Nama Produk + {item.nama} + + + Harga Produk + Rp.{item.harga} + + + Rating + {item.rating || '-'} + + + Alamat Usaha + + {item.alamatUsaha || '-'} + + + + + + + + )) + ) : ( +
+ + Tidak ada produk pasar desa yang cocok + +
+ )} +
@@ -160,4 +220,4 @@ function ListPasarDesa({ search }: { search: string }) { ); } -export default PasarDesa; +export default PasarDesa; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/edit/page.tsx index 5eae8178..f3cbf5bb 100644 --- a/src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/program-kemiskinan/[id]/edit/page.tsx @@ -142,7 +142,7 @@ function EditProgramKemiskinan() { }; return ( - + {/* Header */} - - + + {/* Desktop Table */} + +
- Judul Program - Deskripsi Singkat - Jumlah Masyarakat Miskin - Aksi + + + Judul Program + + + + + Deskripsi Singkat + + + + + Jumlah Masyarakat Miskin + + + + + Aksi + + {filteredData.length > 0 ? ( - filteredData.map(item => ( + filteredData.map((item) => ( - {item.nama} + + {item.nama} + - + + + + + {item.statistik?.jumlah || '-'} + - {item.statistik?.jumlah || '-'} @@ -110,7 +177,9 @@ function ListProgramKemiskinan({ search }: { search: string }) {
- Tidak ada data program kemiskinan yang cocok + + Tidak ada data program kemiskinan yang cocok +
@@ -118,6 +187,61 @@ function ListProgramKemiskinan({ search }: { search: string }) {
+ + {/* Mobile Cards */} + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Judul Program + + + {item.nama} + + + + + Deskripsi Singkat + + + + + + Jumlah Masyarakat Miskin + + + {item.statistik?.jumlah || '-'} + + + + + + + + )) + ) : ( +
+ + Tidak ada data program kemiskinan yang cocok + +
+ )} + + {/* Pagination */} @@ -137,25 +261,45 @@ function ListProgramKemiskinan({ search }: { search: string }) {
{/* Chart */} - - - Grafik Berdasarkan Responden + + + + Grafik Berdasarkan Responden + {mounted && lineChart.length > 0 ? ( - - - - - - [`${value} orang`, name]} - labelFormatter={(label: any) => `Tahun: ${label}`} - /> - - - + + + + + + + [`${value} orang`, 'Jumlah']} + labelFormatter={(label: any) => `Tahun: ${label}`} + /> + + + + ) : ( - Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik + )} @@ -163,4 +307,4 @@ function ListProgramKemiskinan({ search }: { search: string }) { ); } -export default ProgramKemiskinan; +export default ProgramKemiskinan; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/[id]/edit/page.tsx b/src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/[id]/edit/page.tsx index 51122258..592e7a35 100644 --- a/src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/[id]/edit/page.tsx +++ b/src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/[id]/edit/page.tsx @@ -101,7 +101,7 @@ function EditSektorUnggulanDesa() { }; return ( - + - {loading ? ( - - ) : ( - - - - - Nama Sektor - Deskripsi - Detail - - - - {filteredData.length > 0 ? ( - filteredData.map((item) => ( - - - - - {item.name} - - - - - - - - - - - - - )) - ) : ( - - -
- Tidak ada data sektor unggulan yang cocok -
+ + {/* Desktop Table */} + +
+ + + Nama Sektor + Deskripsi + Detail + + + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + {item.name} + + + + + + + - )} - -
- - )} + )) + ) : ( + + +
+ + Tidak ada data sektor unggulan yang cocok + +
+ + + )} + + + + + {/* Mobile Cards */} + + {filteredData.length > 0 ? ( + filteredData.map((item) => ( + + + + + Nama Sektor + + + {item.name} + + + + + Deskripsi + + + + + + + + + + + )) + ) : ( +
+ + Tidak ada data sektor unggulan yang cocok + +
+ )} + + {/* Pagination */}
- {/* Chart */} - - + {/* Chart Section */} + <Paper withBorder bg={colors['white-1']} p={{ base: 'md', md: 'lg' }} shadow="md" radius="md"> + <Title order={4} lh={1.2} pb={{ base: 'sm', md: 'md' }}> Grafik Sektor Unggulan Desa {loading ? ( ) : chartData.length > 0 ? ( - + @@ -186,7 +248,9 @@ function ListSektorUnggulanDesa({ search }: { search: string }) { ) : (
- Belum ada data untuk ditampilkan dalam grafik + + Belum ada data untuk ditampilkan dalam grafik +
)} @@ -194,4 +258,4 @@ function ListSektorUnggulanDesa({ search }: { search: string }) { ); } -export default SektorUnggulanDesa; +export default SektorUnggulanDesa; \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/_lib/layoutTabs.tsx b/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/_lib/layoutTabs.tsx deleted file mode 100644 index c85ac68f..00000000 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/_lib/layoutTabs.tsx +++ /dev/null @@ -1,131 +0,0 @@ -/* eslint-disable react-hooks/exhaustive-deps */ -'use client' -import colors from '@/con/colors'; -import { - ScrollArea, - Stack, - Tabs, - TabsList, - TabsPanel, - TabsTab, - Title -} from '@mantine/core'; -import { - IconBuildingCommunity, - IconHierarchy, - IconUsers -} from '@tabler/icons-react'; -import { usePathname, useRouter } from 'next/navigation'; -import React, { useEffect, useState } from 'react'; - -function LayoutTabs({ children }: { children: React.ReactNode }) { - const router = useRouter(); - const pathname = usePathname(); - - const tabs = [ - { - label: "Pegawai", - value: "pegawai", - href: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai", - icon: - }, - { - label: "Posisi Organisasi", - value: "posisiorganisasi", - href: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi", - icon: - }, - { - label: "Struktur Organisasi", - value: "strukturorganisasi", - href: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/struktur-organisasi", - icon: - } - ]; - - const currentTab = tabs.find((tab) => tab.href === pathname); - const [activeTab, setActiveTab] = useState( - currentTab?.value || tabs[0].value - ); - - const handleTabChange = (value: string | null) => { - const tab = tabs.find((t) => t.value === value); - if (tab) { - router.push(tab.href); - } - setActiveTab(value); - }; - - useEffect(() => { - const match = tabs.find((tab) => tab.href === pathname); - if (match) { - setActiveTab(match.value); - } - }, [pathname]); - - return ( - - - Struktur Organisasi & SK Pengurus BUMDesa - - - - {/* ✅ Scroll horizontal biar rapi kalau label panjang */} - - - {tabs.map((tab, i) => ( - - {tab.label} - - ))} - - - - {tabs.map((tab, i) => ( - - {children} - - ))} - - - ); -} - -export default LayoutTabs; diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/layout.tsx b/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/layout.tsx deleted file mode 100644 index 57a94a4f..00000000 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/layout.tsx +++ /dev/null @@ -1,12 +0,0 @@ -'use client' - -import LayoutTabs from "./_lib/layoutTabs" - - -export default function Layout({ children }: { children: React.ReactNode }) { - return ( - - {children} - - ) -} \ No newline at end of file diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/page.tsx b/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/page.tsx deleted file mode 100644 index fd17d099..00000000 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai/page.tsx +++ /dev/null @@ -1,185 +0,0 @@ -/* eslint-disable react-hooks/exhaustive-deps */ -'use client' -import colors from '@/con/colors'; -import { Badge, Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, ThemeIcon, Title } from '@mantine/core'; -import { IconCheck, IconDeviceImacCog, IconPlus, IconSearch, IconX } from '@tabler/icons-react'; -import { useRouter } from 'next/navigation'; -import { useEffect, useState } from 'react'; -import { useProxy } from 'valtio/utils'; -import HeaderSearch from '../../../_com/header'; -import stateStrukturBumDes from '../../../_state/ekonomi/struktur-organisasi/struktur-organisasi'; - - -function PegawaiBumDes() { - const [search, setSearch] = useState(""); - return ( - - } - value={search} - onChange={(e) => setSearch(e.currentTarget.value)} - /> - - - ); -} - -function ListPegawaiBumdes({ search }: { search: string }) { - const stateOrganisasi = useProxy(stateStrukturBumDes.pegawai); - const router = useRouter(); - - const { - data, - page, - totalPages, - loading, - load, - } = stateOrganisasi.findMany; - - useEffect(() => { - load(page, 10, search); - }, [page, search]); - - const filteredData = data || [] - - // Handle loading state - if (loading || !data) { - return ( - - - - ); - } - - if (data.length === 0) { - return ( - - - - Daftar Pegawai BUMDesa - - -
- Tidak ada data pegawai yang ditemukan -
- - - ); - } - return ( - - - - Daftar Pegawai BUMDesa - - - - - - - Nama Lengkap - Posisi - Status - Aksi - - - - {(() => { - console.log('Rendering table with items:', stateOrganisasi.findMany.data); - return null; - })()} - {([...filteredData] - .sort((a, b) => { - if (a.isActive === b.isActive) { - return a.namaLengkap.localeCompare(b.namaLengkap); // kalau status sama, urut nama - } - return Number(b.isActive) - Number(a.isActive); // aktif duluan - }) // Aktif di atas - ).map((item) => ( - - - - - {item.namaLengkap} - - - - - - - {item.posisi?.nama || 'Belum diatur'} - - - - - - - - {item.isActive ? "Aktif" : "Tidak Aktif"} - - - - {item.isActive ? ( - - - - ) : ( - - - - )} - - - - - - - - ))} - -
- -
- { - load(newPage, 10); - window.scrollTo(0, 0); - }} - total={totalPages} - withEdges - withControls - radius="md" - /> -
- - - ); -} - -export default PegawaiBumDes; diff --git a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/page.tsx b/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/page.tsx deleted file mode 100644 index bf9dc0a2..00000000 --- a/src/app/admin/(dashboard)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/posisi-organisasi/page.tsx +++ /dev/null @@ -1,169 +0,0 @@ -'use client' -import colors from '@/con/colors'; -import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core'; -import { useShallowEffect } from '@mantine/hooks'; -import { IconEdit, IconPlus, IconSearch, IconTrash } from '@tabler/icons-react'; -import { useRouter } from 'next/navigation'; -import { useState } from 'react'; -import { useProxy } from 'valtio/utils'; -import HeaderSearch from '../../../_com/header'; -import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus'; -import stateStrukturBumDes from '../../../_state/ekonomi/struktur-organisasi/struktur-organisasi'; - - -function PosisiOrganisasiBumDes() { - const [search, setSearch] = useState(""); - return ( - - } - value={search} - onChange={(e) => setSearch(e.currentTarget.value)} - /> - - - ); -} - -function ListPosisiOrganisasiBumDes({ search }: { search: string }) { - const stateOrganisasi = useProxy(stateStrukturBumDes.posisiOrganisasi) - const router = useRouter(); - const [modalHapus, setModalHapus] = useState(false) - const [selectedId, setSelectedId] = useState(null) - - const { - data, - page, - totalPages, - loading, - load, - } = stateOrganisasi.findMany; - - useShallowEffect(() => { - load(page, 10, search); - }, [page, search]); - - const handleHapus = async () => { - if (selectedId) { - await stateOrganisasi.delete.byId(selectedId); - setModalHapus(false) - setSelectedId(null) - } - } - - const filteredData = data || [] - - if (loading || !data) { - return ( - - - - ); - } - - return ( - - - - Daftar Posisi Organisasi BumDes - - - - - - - Nama Posisi - Deskripsi - Hierarki - Edit - Hapus - - - - {filteredData.length > 0 ? ( - filteredData.map((item) => ( - - - {item.nama} - - - - - - - - {item.hierarki || '-'} - - - - - - - - - )) - ) : ( - - -
- Tidak ada data posisi organisasi yang cocok -
- - - )} - -
- - -
- { - load(newPage, 10, search); - window.scrollTo({ top: 0, behavior: 'smooth' }); - }} - total={totalPages} - mt="md" - mb="md" - color="blue" - radius="md" - /> -
- {/* Modal Hapus */} - setModalHapus(false)} - onConfirm={handleHapus} - text="Apakah anda yakin ingin menghapus posisi organisasi BumDes ini?" - /> - - ); -} - -export default PosisiOrganisasiBumDes; diff --git a/src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/page.tsx b/src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/page.tsx index 3429f21d..aba452dc 100644 --- a/src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/page.tsx +++ b/src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/page.tsx @@ -1,5 +1,6 @@ 'use client' import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus'; +import { ModalKonfirmasiNonAktif } from '@/app/admin/(dashboard)/_com/modalNonaktif'; import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID'; import colors from '@/con/colors'; import { Box, Button, Group, Image, Paper, Skeleton, Stack, Text } from '@mantine/core'; @@ -186,7 +187,7 @@ function DetailPegawai() { /> {/* Modal NonActive */} - setModalNonActive(false)} onConfirm={handleNonActive} diff --git a/src/app/admin/_com/list_PageAdmin.tsx b/src/app/admin/_com/list_PageAdmin.tsx index 6574cdb7..02509bfd 100644 --- a/src/app/admin/_com/list_PageAdmin.tsx +++ b/src/app/admin/_com/list_PageAdmin.tsx @@ -223,8 +223,8 @@ export const devBar = [ }, { id: "Ekonomi_3", - name: "Struktur Organisasi Dan Sk Pengurus Bumdesa", - path: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai" + name: "Struktur Organisasi Dan Sk Pengurus BumDes", + path: "/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai" }, { id: "Ekonomi_4", @@ -628,7 +628,7 @@ export const navBar = [ { id: "Ekonomi_3", name: "Struktur Organisasi Dan Sk Pengurus Bumdesa", - path: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai" + path: "/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai" }, { id: "Ekonomi_4", @@ -990,7 +990,7 @@ export const role1 = [ { id: "Ekonomi_3", name: "Struktur Organisasi Dan Sk Pengurus Bumdesa", - path: "/admin/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/pegawai" + path: "/admin/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/pegawai" }, { id: "Ekonomi_4", diff --git a/src/app/darmasaba/(pages)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/[id]/page.tsx b/src/app/darmasaba/(pages)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/[id]/page.tsx similarity index 100% rename from src/app/darmasaba/(pages)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/[id]/page.tsx rename to src/app/darmasaba/(pages)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/[id]/page.tsx diff --git a/src/app/darmasaba/(pages)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/page.tsx b/src/app/darmasaba/(pages)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/page.tsx similarity index 99% rename from src/app/darmasaba/(pages)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/page.tsx rename to src/app/darmasaba/(pages)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/page.tsx index 8432fb34..23cc5ccc 100644 --- a/src/app/darmasaba/(pages)/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/page.tsx +++ b/src/app/darmasaba/(pages)/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/page.tsx @@ -509,7 +509,7 @@ function NodeCard({ node, router }: any) { mt={8} radius="md" onClick={() => - router.push(`/darmasaba/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa/${node.data.id}`) + router.push(`/darmasaba/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes/${node.data.id}`) } style={{ height: 32, diff --git a/src/app/darmasaba/_com/searchUrl.tsx b/src/app/darmasaba/_com/searchUrl.tsx index 2eca0785..7e87139b 100644 --- a/src/app/darmasaba/_com/searchUrl.tsx +++ b/src/app/darmasaba/_com/searchUrl.tsx @@ -47,7 +47,7 @@ const getDetailUrl = (item: { type?: string; id: string | number;[key: string]: 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', + strukturOrganisasi: () => '/darmasaba/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes', jumlahPendudukUsiaKerjaYangMenganggurUsia: () => '/darmasaba/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur', jumlahPendudukUsiaKerjaYangMenganggurPendidikan: () => '/darmasaba/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur', jumlahPendudukMiskin: () => '/darmasaba/ekonomi/jumlah-penduduk-miskin', diff --git a/src/con/navbar-list-menu.ts b/src/con/navbar-list-menu.ts index 35fbebc2..b78fb6f8 100644 --- a/src/con/navbar-list-menu.ts +++ b/src/con/navbar-list-menu.ts @@ -183,7 +183,7 @@ const navbarListMenu = [ { id: "5.3", name: "Struktur Organisasi dan SK Pengurus BUMDesa", - href: "/darmasaba/ekonomi/struktur-organisasi-dan-sk-pengurus-bumdesa" + href: "/darmasaba/ekonomi/Struktur-Organisasi-Dan-Sk-Pengurus-BumDes" }, { id: "5.4",