upd: dashboard admin

Deskripsi:
- ttd pada semua format surat
- fix api warga -- salah summary
- nama file surat saat download

No Issues

src/components/ModalSurat.tsx

@@ -44,7 +44,6 @@ export default function ModalSurat({ open, onClose, surat }: { open: boolean, on
 
    const downloadPDF = async () => {
       const element = hiddenRef.current;
-
       const canvas = await html2canvas(element, {
          scale: 2,
          useCORS: true,
@@ -64,7 +63,7 @@ export default function ModalSurat({ open, onClose, surat }: { open: boolean, on
 
       pdf.addImage(imgData, "JPEG", 0, 0, imgWidth, imgHeight);
 
-      pdf.save("surat-keterangan-usaha.pdf");
+      pdf.save(`${data?.data?.surat?.nameCategory}.pdf`);
    };
 
    return (

src/components/surat/SKBedaBiodataDiri.tsx

@@ -1,11 +1,42 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKBedaBiodataDiri({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>();
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
+
    return (
       <div style={{ lineHeight: "1.25" }}>
          {/* HEADER */}
@@ -113,13 +144,12 @@ export default function SKBedaBiodataDiri({ data }: { data: any }) {
          </div>
 
          {/* TANDA TANGAN */}
-         <div style={{ marginTop: "30px", display: "flex", justifyContent: "flex-end", width: "100%" }}>
+         <div style={{ marginTop: "0px", display: "flex", justifyContent: "flex-end", width: "100%" }}>
             <div style={{ textAlign: "center" }}>
-
-               <br /><br />
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /><br />
-               {data.setting.perbekelNama} <br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
+               <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/components/surat/SKBelumKawin.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKBelumKawin({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>();
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
          {/* HEADER */}
@@ -62,13 +92,14 @@ export default function SKBelumKawin({ data }: { data: any }) {
             <div style={{ textAlign: "center" }}>
                <br /><br />
                Pemohon
-               <br /><br /><br /><br />
+               <br /><br /><br /><br /><br /><br />
                <u>{getValue("nama")}</u> <br />
             </div>
             <div style={{ textAlign: "center" }}>
                <br /><br />
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /><br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
                <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>

src/components/surat/SKDomisiliOrganisasi.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKDomisiliOrganisasi({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
          {/* HEADER */}
@@ -79,11 +109,11 @@ export default function SKDomisiliOrganisasi({ data }: { data: any }) {
          {/* TANDA TANGAN */}
          <div style={{ marginTop: "40px", display: "flex", justifyContent: "flex-end", width: "100%" }}>
             <div style={{ textAlign: "center" }}>
-
+               <br />
-               <br /><br />
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /><br />
-               {data.setting.perbekelNama} <br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
+               <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/components/surat/SKKelahiran.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKKelahiran({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.2" }}>
 
@@ -102,8 +132,9 @@ export default function SKKelahiran({ data }: { data: any }) {
          <div style={{ marginTop: "40px", width: "100%", display: "flex", justifyContent: "flex-end" }}>
             <div style={{ textAlign: "center" }}>
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br />
-               {data.setting.perbekelNama} <br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
+               <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/components/surat/SKKelakuanBaik.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKKelakuanBaik({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
 
@@ -103,8 +133,9 @@ export default function SKKelakuanBaik({ data }: { data: any }) {
          <div style={{ width: "100%", display: "flex", justifyContent: "flex-end" }}>
             <div style={{ textAlign: "center" }}>
                Kepala Desa {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /> <br />
-               {data.setting.perbekelNama}<br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
+               <u>{data.setting.perbekelNama}</u><br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/components/surat/SKKematian.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKKematian({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
          {/* HEADER */}
@@ -72,13 +102,14 @@ export default function SKKematian({ data }: { data: any }) {
             <div style={{ textAlign: "center" }}>
                <br /><br />
                Pemohon
-               <br /><br /><br /><br />
+               <br /><br /><br /><br /> <br />
                <u>{getValue("nama")}</u> <br />
             </div>
             <div style={{ textAlign: "center" }}>
-               <br /><br />
+               <br />
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /><br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /><br />
                <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>

src/components/surat/SKPenghasilan.tsx

@@ -1,11 +1,41 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKPenghasilan({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (jenis: string) =>
       _.upperFirst(
          data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
       );
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
          {/* HEADER */}
@@ -102,8 +132,9 @@ export default function SKPenghasilan({ data }: { data: any }) {
          <div style={{ marginTop: "40px", display: "flex", justifyContent: "flex-end" }}>
             <div style={{ textAlign: "center" }}>
                Kepala Desa / Lurah {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /> <br />
-               {data.setting.perbekelNama} <br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /><br />
+               <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/components/surat/SKTempatUsaha.tsx

@@ -1,9 +1,40 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKTempatUsaha({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (key: string) =>
       _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
+
    return (
       <div style={{ lineHeight: "1.5" }}>
          {/* TITLE */}
@@ -68,8 +99,8 @@ export default function SKTempatUsaha({ data }: { data: any }) {
             {/* TANDA TANGAN */}
             <div style={{ width: "100%", display: "flex", justifyContent: "flex-end" }}>
                <div style={{ textAlign: "center" }}>
-                  {data.setting.desaNama}, {data.surat.createdAt} <br /><br /><br />
+                  {data.setting.desaKabupaten}, {data.surat.createdAt} <br /> <br />
-
+                  <img src={viewImg || undefined} alt="ttd perbekel" width={100} /><br />
                   <u>{data.setting.perbekelNama}</u><br />
                   {data.setting.perbekelJabatan + " " + data.setting.desaNama}
                </div>

src/components/surat/SKTidakMampu.tsx

@@ -1,9 +1,40 @@
 import _ from "lodash";
+import { useEffect, useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKTidakMampu({ data }: { data: any }) {
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (key: string) =>
       _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
 
+
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.5" }}>
          {/* TITLE */}
@@ -59,8 +90,8 @@ export default function SKTidakMampu({ data }: { data: any }) {
             {/* TANDA TANGAN */}
             <div style={{ width: "100%", display: "flex", justifyContent: "flex-end" }}>
                <div style={{ textAlign: "center" }}>
-                  {data.setting.desaNama}, {data.surat.createdAt} <br /><br /><br />
+                  {data.setting.desaKabupaten}, {data.surat.createdAt} <br /> <br />
-
+                  <img src={viewImg || undefined} alt="ttd perbekel" width={100} /><br />
                   <u>{data.setting.perbekelNama}</u><br />
                   {data.setting.perbekelJabatan + " " + data.setting.desaNama}
                </div>

src/components/surat/SKUsaha.tsx

@@ -132,13 +132,12 @@ export default function SKUsaha({ data }: { data: any }) {
          </div>
 
          {/* TANDA TANGAN */}
-         <div style={{ marginTop: "20px", display: "flex", justifyContent: "flex-end", width: "100%" }}>
+         <div style={{ marginTop: "10px", display: "flex", justifyContent: "flex-end", width: "100%" }}>
             <div style={{ textAlign: "center" }}>
-
+               <br />
-               <br /><br />
                Kepala Desa / Lurah {data.setting.desaNama}
                <br /><br />
-               <img src={viewImg} alt="ttd perbekel" width={100} />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} />
                <br />
                <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}

src/components/surat/SKYatimPiatu.tsx

@@ -1,10 +1,40 @@
+import { useShallowEffect } from "@mantine/hooks";
 import _ from "lodash";
+import { useState } from "react";
+import notification from "../notificationGlobal";
 
 export default function SKYatim({ data }: { data: any }) {
-
+   const [viewImg, setViewImg] = useState<string>("");
    const getValue = (key: string) =>
       _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
 
+   const loadImage = async () => {
+      try {
+         setViewImg("");
+         if (!data.setting.perbekelTTD) return;
+
+         const urlApi = '/api/pengaduan/image?folder=syarat-dokumen&fileName=' + data.setting.perbekelTTD;
+         // Fetch manual agar mendapatkan Response asli
+         const res = await fetch(urlApi);
+         if (!res.ok)
+            return notification({
+               title: "Error",
+               message: "Failed to load image sign",
+               type: "error",
+            });
+         const blob = await res.blob();
+         const url = URL.createObjectURL(blob);
+
+         setViewImg(url);
+      } catch (err) {
+         console.error("Gagal load gambar:", err);
+      }
+   };
+
+   useShallowEffect(() => {
+      loadImage();
+   }, [data]);
+
    return (
       <div style={{ lineHeight: "1.3" }}>
 
@@ -146,14 +176,15 @@ export default function SKYatim({ data }: { data: any }) {
             </tbody>
          </table>
 
-         <br /><br />
+         <br />
 
          {/* TTD */}
          <div style={{ width: "100%", display: "flex", justifyContent: "flex-end" }}>
             <div style={{ textAlign: "center" }}>
                Kepala Desa {data.setting.desaNama}
-               <br /><br /><br /><br />
+               <br /><br />
-               {data.setting.perbekelNama} <br />
+               <img src={viewImg || undefined} alt="ttd perbekel" width={100} /> <br />
+               <u>{data.setting.perbekelNama}</u> <br />
                NIP. {data.setting.perbekelNIP}
             </div>
          </div>

src/server/routes/surat_route.ts

@@ -21,6 +21,11 @@ const SuratRoute = new Elysia({
                select: {
                   DataTextPelayanan: true,
                }
+            },
+            CategoryPelayanan: {
+               select: {
+                  name: true,
+               }
             }
          }
       })
@@ -37,6 +42,7 @@ const SuratRoute = new Elysia({
          surat: {
             id: dataSurat?.id,
             idCategory: dataSurat?.idCategory,
+            nameCategory: dataSurat?.CategoryPelayanan?.name,
             noSurat: dataSurat?.noSurat,
             dataText: dataSurat?.PelayananAjuan?.DataTextPelayanan,
             createdAt: dataSurat?.createdAt.toLocaleDateString("id-ID", { day: "numeric", month: "long", year: "numeric" }),

src/server/routes/warga_route.ts

@@ -62,8 +62,8 @@ const WargaRoute = new Elysia({
          phone: t.String({ minLength: 1 })
       }),
       detail: {
-         summary: "edit konfigurasi desa",
+         summary: "Edit Warga",
-         description: `tool untuk edit konfigurasi desa`
+         description: `tool untuk edit warga`
       }
    })
    .get("/detail", async ({ query }) => {