wibu/jenna-mcp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'amalia/28-nov-25' (#42) from amalia/28-nov-25 into main

Browse Source 
Reviewed-on: http://wibugit.wibudev.com/wibu/jenna-mcp/pulls/42
This commit is contained in:
amaliadwiy
2025-11-28 17:02:35 +08:00
parent f9b84f89eb fe3ebf4bd3
commit f901cff3b1
8 changed files with 80 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/DashboardGrafik.tsx
View File

@@ -1,6 +1,6 @@
import apiFetch from "@/lib/apiFetch";
import { Card, Divider, Flex, Stack, Title } from "@mantine/core";
import { IconSettings } from "@tabler/icons-react";
import { Card, Divider, Flex, Stack, Text, Title } from "@mantine/core";
import { IconChartBar } from "@tabler/icons-react";
import type { EChartsOption } from "echarts";
import EChartsReact from "echarts-for-react";
import { useEffect, useState } from "react";
@@ -21,7 +21,7 @@ export default function DashboardGrafik() {
darkMode: true,
animation: true,
legend: {
textStyle: { color: "#fff" } // warna legend putih
textStyle: { color: "#fff" }
},
tooltip: {},
dataset: {
@@ -34,7 +34,8 @@ export default function DashboardGrafik() {
},
yAxis: {
type: "value",
minInterval: 1
minInterval: 1,
axisLabel: { color: "#fff" }
},
color: ["#1abc9c", "#10816aff"],
series: [
@@ -62,20 +63,19 @@ export default function DashboardGrafik() {
boxShadow: "0 0 25px rgba(0,255,200,0.08)",
}}
>
<Stack gap="md">
<Stack gap="sm">
<Flex align="center" justify="space-between">
<Title order={4} c="gray.0">
System Performance
</Title>
<IconSettings size={20} color="gray" />
<Flex direction={"column"}>
<Title order={4} c="gray.0">
Grafik Pengaduan dan Pelayanan Surat
</Title>
<Text size="sm">7 Hari Terakhir</Text>
</Flex>
<IconChartBar size={20} color="gray" />
</Flex>
<Divider my="xs" />
<Stack gap="sm">
<EChartsReact style={{ height: 400, width: "100%" }} option={options} />
{/* <ProgressSection label="CPU Usage" value={68} color="teal" />
<ProgressSection label="Memory Usage" value={75} color="cyan" />
<ProgressSection label="Network Load" value={42} color="blue" />
<ProgressSection label="Disk Space" value={88} color="red" /> */}
<EChartsReact style={{ height: 400 }} option={options} />
</Stack>
</Stack>
</Card>

2
src/components/DashboardLastData.tsx
View File

@@ -80,7 +80,7 @@ export default function DashboardLastData() {
<PengaduanSection
key={index}
id={item.id}
nomer={item.noPengaduan}
nomer={item.noPengajuan}
judul={item.title}
status={item.status}
updated={item.updatedAt}

18
src/components/ModalFile.tsx
View File

@@ -7,6 +7,7 @@ export default function ModalFile({ open, onClose, folder, fileName }: { open: b
const [viewFile, setViewFile] = useState<string>("");
const [loading, setLoading] = useState<boolean>(false);
const [typeFile, setTypeFile] = useState<string>("");
const [error, setError] = useState<boolean>(false);
useEffect(() => {
if (open && fileName) {
@@ -27,23 +28,36 @@ export default function ModalFile({ open, onClose, folder, fileName }: { open: b
// load file
const urlApi = '/api/pengaduan/image?folder=' + folder + '&fileName=' + fileName;
const res = await fetch(urlApi);
if (!res.ok)
if (!res.ok) {
setError(true);
return notification({
title: "Error",
message: "Failed to load image",
type: "error",
});
}
const blob = await res.blob();
const url = URL.createObjectURL(blob);
setViewFile(url);
} catch (err) {
console.error("Gagal load gambar:", err);
setError(true);
notification({
title: "Error",
message: "Failed to load image",
type: "error",
});
} finally {
setLoading(false);
}
};
useEffect(() => {
if (error) {
onClose();
}
}, [error]);
return (

14
src/lib/categoryPelayananSurat.ts
View File

@@ -17,7 +17,7 @@ export const categoryPelayananSurat = [
{ name: "ktp/kk", desc: "Fotokopi KTP atau Kartu Keluarga" },
{ name: "akta cerai", desc: "Fotokopi Akta Cerai bagi yang berstatus janda/duda" }
],
dataText: ["nik", "nama", "tempat tanggal lahir", "jenis kelamin", "alamat", "status perkawinan"]
dataText: ["nik", "nama", "tempat tanggal lahir", "jenis kelamin", "alamat", "agama", "pekerjaan"]
},
{
id: "skdomisiliorganisasi",
@@ -27,7 +27,7 @@ export const categoryPelayananSurat = [
{ name: "skt organisasi", desc: "Fotokopi Surat Keterangan Terdaftar (SKT) Organisasi atau Pengukuhan Kelompok" },
{ name: "susunan pengurus", desc: "Jika Pengajuan baru pembuatan SKT maka melengkapi Susunan Pengurus lengkap denganKop Organisasi" }
],
dataText: ["nama organisasi", "alamat organisasi", "nama pemohon", "jabatan pemohon", "kontak", "penanggung jawab", "tanggal berdiri"]
dataText: ["nama organisasi", "jenis organisasi", "alamat organisasi/sekretariat", "no telepon", "nama pimpinan", "keperluan"]
},
{
id: "skkelahiran",
@@ -45,7 +45,7 @@ export const categoryPelayananSurat = [
{ name: "pengantar kelian", desc: "Surat Pengantar Kelian Banjar Dinas" },
{ name: "ktp/kk", desc: "Fotokopi KTP atau Kartu Keluarga" }
],
dataText: ["nik", "nama", "tempat tanggal lahir", "jenis kelamin", "alamat", "polsek"]
dataText: ["nik", "nama", "tempat tanggal lahir", "jenis kelamin", "agama", "alamat", "pekerjaan", "polsek"]
},
{
id: "skkematian",
@@ -55,7 +55,7 @@ export const categoryPelayananSurat = [
{ name: "ktp/kk", desc: "Fotokopi KTP atau Kartu Keluarga" },
{ name: "surat kematian", desc: "Surat Keterangan Kematian dari Rumah Sakit/Dokter (jika ada)" }
],
dataText: ["nama almarhum", "nik", "tempat tanggal lahir", "alamat", "tanggal kematian", "waktu kematian", "penyebab kematian"]
dataText: ["nik pelapor", "nama pelapor", "pekerjaan pelapor", "alamat pelapor", "hubungan pelapor dengan almarhum", "nama almarhum", "nik almarhum", "tempat tanggal lahir almarhum", "alamat almarhum", "agama almarhum", "tanggal kematian", "waktu kematian", "tempat kematian", "penyebab kematian"]
},
{
id: "skpenghasilan",
@@ -65,7 +65,7 @@ export const categoryPelayananSurat = [
{ name: "ktp ortu/kk", desc: "Fotokopi KTP orang tua atau Kartu Keluarga" },
{ name: "surat pernyataan", desc: "Surat Pernyataan Penghasilan bermaterai" }
],
dataText: ["nama", "nik", "alamat", "pekerjaan", "jenis usaha", "penghasilan", "alasan permohonan"]
dataText: ["nama", "tempat tanggal lahir", "jenis kelamin", "alamat", "pekerjaan", "penghasilan", "alasan permohonan"]
},
{
id: "sktempatusaha",
@@ -76,7 +76,7 @@ export const categoryPelayananSurat = [
{ name: "foto lokasi", desc: "Foto lokasi usaha dicetak dalam selembar kertas, diparaf dan distempel oleh Kelian" },
{ name: "sppt/sertifikat/sewa", desc: "Fotokopi SPPT, Sertifikat Hak Milik, Surat Perjanjian Sewa, atau Kwitansi Pembayaran Sewa 3 bulan terakhir" }
],
dataText: ["nama usaha", "bidang usaha", "alamat usaha", "status tempat usaha", "luas tempat usaha", "jumlah karyawan", "tujuan pembuatan surat"]
dataText: ["nik", "nama pemilik", "tempat tanggal lahir", "alamat pemilik", "nama usaha", "bidang usaha", "alamat usaha", "status tempat usaha", "luas tempat usaha", "jumlah karyawan", "tujuan pembuatan surat"]
},
{
id: "sktidakmampu",
@@ -104,6 +104,6 @@ export const categoryPelayananSurat = [
{ name: "pengantar kelian", desc: "Surat Pengantar Kelian Banjar Dinas" },
{ name: "ktp/kia/kk", desc: "Fotokopi KTP, KIA, atau Kartu Keluarga" }
],
dataText: ["nama anak", "nama ayah", "status ayah", "nama ibu", "status ibu"]
dataText: ["nik", "nama", "tempat tanggal lahir", "jenis kelamin", "alamat", "pekerjaan", "nama ayah", "status ayah", "nama ibu", "status ibu"]
}
];

19
src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
View File

@@ -1,3 +1,4 @@
import ModalFile from "@/components/ModalFile";
import ModalSurat from "@/components/ModalSurat";
import notification from "@/components/notificationGlobal";
import apiFetch from "@/lib/apiFetch";
@@ -77,7 +78,9 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
const [host, setHost] = useState<User | null>(null);
const [noSurat, setNoSurat] = useState("");
const [openedPreview, setOpenedPreview] = useState(false);
const [openedPreviewFile, setOpenedPreviewFile] = useState(false);
const [permissions, setPermissions] = useState<JsonValue[]>([]);
const [viewImg, setViewImg] = useState("");
useEffect(() => {
async function fetchHost() {
@@ -128,8 +131,22 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
}
}
useShallowEffect(() => {
if (viewImg) {
setOpenedPreviewFile(true);
}
}, [viewImg]);
return (
<>
<ModalFile
open={openedPreviewFile && !_.isEmpty(viewImg)}
onClose={() => {
setOpenedPreviewFile(false)
}}
folder="syarat-dokumen"
fileName={viewImg}
/>
{/* MODAL KONFIRMASI */}
<Modal
@@ -246,7 +263,7 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
>
{syaratDokumen?.map((v: any) => (
<List.Item key={v.id}>
<Anchor href="https://mantine.dev/" target="_blank">
<Anchor onClick={() => { setViewImg(v.value) }}>
{v.jenis}
</Anchor>
</List.Item>

24
src/pages/scr/dashboard/pengaduan/detail_page.tsx
View File

@@ -1,3 +1,4 @@
import ModalFile from "@/components/ModalFile";
import notification from "@/components/notificationGlobal";
import apiFetch from "@/lib/apiFetch";
import {
@@ -10,13 +11,12 @@ import {
Flex,
Grid,
Group,
Image,
Modal,
Stack,
Table,
Text,
Textarea,
Title,
Title
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import {
@@ -73,9 +73,7 @@ export default function DetailPengaduanPage() {
function DetailDataPengaduan({ data, onAction }: { data: any, onAction: () => void }) {
const [opened, { open, close }] = useDisclosure(false);
const [catModal, setCatModal] = useState<"tolak" | "terima">("tolak");
const [imageSrc, setImageSrc] = useState<string | null>(null);
const [openedModalImage, { open: openModalImage, close: closeModalImage }] =
useDisclosure(false);
const [openedPreview, setOpenedPreview] = useState(false);
const [keterangan, setKeterangan] = useState("");
const [host, setHost] = useState<User | null>(null);
const [permissions, setPermissions] = useState<JsonValue[]>([]);
@@ -173,14 +171,12 @@ function DetailDataPengaduan({ data, onAction }: { data: any, onAction: () => vo
{/* MODAL GAMBAR */}
<Modal
opened={openedModalImage}
onClose={closeModalImage}
title="Gambar Pengaduan"
overlayProps={{ backgroundOpacity: 0.55, blur: 3 }}
>
<Image src={imageSrc!} />
</Modal>
<ModalFile
open={openedPreview && !_.isEmpty(data?.image)}
onClose={() => setOpenedPreview(false)}
folder="pengaduan"
fileName={data?.image}
/>
<Card
radius="md"
@@ -266,7 +262,7 @@ function DetailDataPengaduan({ data, onAction }: { data: any, onAction: () => vo
{
data?.image != null && data?.image != ""
?
<Anchor href="#" onClick={() => { }}>
<Anchor href="#" onClick={() => { setOpenedPreview(true) }}>
Lihat Gambar
</Anchor>
:

6
src/server/routes/dashboard_route.ts
View File

@@ -57,7 +57,7 @@ const DashboardRoute = new Elysia({
const kenaikanPengaduan =
dataPengaduanYesterday === 0
? dataPengaduanToday > 0
? 100
? dataPengaduanToday * 100
: 0
: ((dataPengaduanToday - dataPengaduanYesterday) / dataPengaduanYesterday) * 100;
@@ -87,7 +87,7 @@ const DashboardRoute = new Elysia({
const kenaikanPelayanan =
dataPelayananYesterday === 0
? dataPelayananToday > 0
? 100
? dataPelayananToday * 100
: 0
: ((dataPelayananToday - dataPelayananYesterday) / dataPelayananYesterday) * 100;
@@ -143,6 +143,7 @@ const DashboardRoute = new Elysia({
select: {
id: true,
status: true,
noPengajuan: true,
updatedAt: true,
CategoryPelayanan: {
select: {
@@ -155,6 +156,7 @@ const DashboardRoute = new Elysia({
const dataPelayananFix = dataPelayanan.map((item) => {
return {
id: item.id,
noPengajuan: item.noPengajuan,
title: item.CategoryPelayanan.name,
status: item.status,
updatedAt: 'terakhir diperbarui ' + getLastUpdated(item.updatedAt),

12
src/server/routes/pelayanan_surat_route.ts
View File

@@ -436,13 +436,13 @@ const PelayananRoute = new Elysia({
jenis: t.String({
minLength: 1,
description: "Jenis field yang dibutuhkan oleh kategori pelayanan. Biasanya dinamis.",
examples: ["nama", "alamat", "pekerjaan", "keperluan"],
examples: ["nama", "jenis kelamin", "tempat tanggal lahir", "negara", "agama", "status perkawinan", "alamat", "pekerjaan", "jenis usaha", "alamat usaha"],
error: "jenis harus diisi"
}),
value: t.String({
minLength: 1,
description: "Isi atau nilai dari jenis field terkait.",
examples: ["Budi Santoso", "Jl. Mawar No. 10", "Karyawan Swasta"],
examples: ["Budi Santoso", "Laki-laki", "Denpasar, 28 Februari 1990", "Indonesia", "Islam", "Belum menikah", "Jl. Mawar No. 10", "Karyawan Swasta", "usaha makanan", "Jl. Melati No. 21"],
error: "value harus diisi"
}),
}),
@@ -450,6 +450,14 @@ const PelayananRoute = new Elysia({
description: "Kumpulan data text dinamis sesuai kategori layanan.",
examples: [
[
{ jenis: "nama", value: "Budi Santoso" },
{ jenis: "jenis kelamin", value: "Laki-laki" },
{ jenis: "tempat tanggal lahir", value: "Denpasar, 28 Februari 1990" },
{ jenis: "negara", value: "Indonesia" },
{ jenis: "agama", value: "Islam" },
{ jenis: "status perkawinan", value: "Belum menikah" },
{ jenis: "alamat", value: "Jl. Mawar No. 10" },
{ jenis: "pekerjaan", value: "Karyawan Swasta" },
{ jenis: "jenis usaha", value: "usaha makanan" },
{ jenis: "alamat usaha", value: "Jl. Melati No. 21" },
]