Preview Surat
- return (
- <>
-
- Preview Surat
-
+
- {
- data && data.data
- ? data.data.surat.idCategory == "skusaha"
- ?
-
+ {data && data.data ? (
+ data.data.surat.idCategory == "skusaha" ? (
+
+
- {/* HEADER */}
- ();
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState();
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN BEDA BIODATA DIRI
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini:
-
-
-
-
-
- {/* IDENTITAS ORANG YG MEMINTA SURAT */}
- | Nama | -: | -{data.setting.perbekelNama} | -
| Jabatan | -: | -{data.setting.perbekelJabatan + " " + data.setting.desaNama} | -
| Kecamatan | -: | -{data.setting.desaKecamatan} | -
| Kabupaten | -: | -{data.setting.desaKabupaten} | -
- Dengan ini menerangkan bahwa berdasarkan keterangan dari yang bersangkutan:
-
-
-
-
-
- | Nama | : | {getValue("nama")} |
| Tempat/Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Jenis Kelamin | : | {getValue("jenis kelamin")} |
| Alamat | : | {getValue("alamat")} |
| Pekerjaan | : | {getValue("pekerjaan")} |
| NIK | : | {getValue("nik")} |
- Bahwa orang tersebut di atas benar merupakan orang yang sama, meskipun terdapat perbedaan data pribadi (biodata) pada beberapa dokumen, sebagai berikut:
-
-
-
-
-
-
-
-
- | 1. Nama | : | {getValue("nama")} |
| Tertulis pada dokumen A | : | {getValue("tertulis pada dokumen a")} |
| Tertulis pada dokumen B | : | {getValue("tertulis pada dokumen b")} |
-
-
-
-
-
- | 2. Tempat/Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Tertulis pada dokumen A | : | {getValue("tertulis pada dokumen a")} |
| Tertulis pada dokumen B | : | {getValue("tertulis pada dokumen b")} |
-
-
-
-
-
- | 3. Nama Orang Tua | : | {getValue("nama orang tua")} |
| Tertulis pada dokumen A | : | {getValue("tertulis pada dokumen a")} |
| Tertulis pada dokumen B | : | {getValue("tertulis pada dokumen b")} |
- Perbedaan tersebut terjadi karena kesalahan penulisan/pencatatan administratif, namun yang bersangkutan adalah orang yang sama.
-
- Dengan surat keterangan ini dibuat dengan sebenar-benarnya untuk dipergunakan sebagaimana mestinya. -
-
- - Dengan surat keterangan ini dibuat dengan sebenar-benarnya untuk dipergunakan sebagaimana mestinya. -
- Dikeluarkan di {data.setting.desaNama}
- Pada tanggal {data.surat.createdAt} -
-
- {/* TANDA TANGAN */}
- - Pada tanggal {data.surat.createdAt} -
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
- Kepala Desa / Lurah {data.setting.desaNama}
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- -
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKBelumKawin.tsx b/src/components/surat/SKBelumKawin.tsx
index 46f0f23..1b69835 100644
--- a/src/components/surat/SKBelumKawin.tsx
+++ b/src/components/surat/SKBelumKawin.tsx
@@ -3,108 +3,166 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKBelumKawin({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN BEDA BIODATA DIRI
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini:
+
+
+
+
+
+ {/* IDENTITAS ORANG YG MEMINTA SURAT */}
+ | Nama | +: | +{data.setting.perbekelNama} | +
| Jabatan | +: | ++ {data.setting.perbekelJabatan + " " + data.setting.desaNama} + | +
| Kecamatan | +: | +{data.setting.desaKecamatan} | +
| Kabupaten | +: | +{data.setting.desaKabupaten} | +
+ Dengan ini menerangkan bahwa berdasarkan keterangan dari yang
+ bersangkutan:
+
+
+
+
+
+ | Nama | +: | +{getValue("nama")} | +
| Tempat/Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Alamat | +: | +{getValue("alamat")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| NIK | +: | +{getValue("nik")} | +
+ Bahwa orang tersebut di atas benar merupakan orang yang sama,
+ meskipun terdapat perbedaan data pribadi (biodata) pada beberapa
+ dokumen, sebagai berikut:
+
+
+
+
+
+
+
+
+ | 1. Nama | +: | +{getValue("nama")} | +
| Tertulis pada dokumen A | +: | +{getValue("tertulis pada dokumen a")} | +
| Tertulis pada dokumen B | +: | +{getValue("tertulis pada dokumen b")} | +
+
+
+
+
+
+ | 2. Tempat/Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Tertulis pada dokumen A | +: | +{getValue("tertulis pada dokumen a")} | +
| Tertulis pada dokumen B | +: | +{getValue("tertulis pada dokumen b")} | +
+
+
+
+
+
+ | 3. Nama Orang Tua | +: | +{getValue("nama orang tua")} | +
| Tertulis pada dokumen A | +: | +{getValue("tertulis pada dokumen a")} | +
| Tertulis pada dokumen B | +: | +{getValue("tertulis pada dokumen b")} | +
+ Perbedaan tersebut terjadi karena{" "}
+ kesalahan penulisan/pencatatan administratif, namun yang
+ bersangkutan adalah orang yang sama.
+
+ Dengan surat keterangan ini dibuat dengan sebenar-benarnya untuk + dipergunakan sebagaimana mestinya. +
+
+ + Dengan surat keterangan ini dibuat dengan sebenar-benarnya untuk + dipergunakan sebagaimana mestinya. +
+ Dikeluarkan di {data.setting.desaNama}
+ Pada tanggal {data.surat.createdAt} +
+
+ {/* TANDA TANGAN */}
+ + Pada tanggal {data.surat.createdAt} +
+
+
+ Kepala Desa / Lurah {data.setting.desaNama}
+
+
+{" "}
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ +
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
- {/* HEADER */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN BELUM KAWIN
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini {data.setting.perbekelJabatan} {data.setting.desaNama}, Kecamatan {data.setting.desaKecamatan}, Kabupaten {data.setting.desaKabupaten}, dengan ini menerangkan bahwa:
-
-
- {/* IDENTITAS ORANG YG MEMINTA SURAT */}
-
-
-
-
-
-
- | Nama | : | {getValue("nama")} |
| NIK | : | {getValue("nik")} |
| Tempat/Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Jenis Kelamin | : | {getValue("jenis kelamin")} |
| Agama | : | {getValue("agama")} |
| Pekerjaan | : | {getValue("pekerjaan")} |
| Alamat | : | {getValue("alamat")} |
- Berdasarkan keterangan dari yang bersangkutan dan data administrasi kependudukan yang ada di Desa {data.setting.desaNama},
- yang bersangkutan benar sampai saat ini belum pernah menikah, baik secara adat, agama, maupun hukum negara.
-
-
-
- Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat digunakan sebagaimana mestinya.
-
-
-
- Dikeluarkan di {data.setting.desaNama}
- Pada tanggal {data.surat.createdAt} -
-
- {/* TANDA TANGAN */}
- - Pada tanggal {data.surat.createdAt} -
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
-
- Pemohon -
- {getValue("nama")}
-
- - Pemohon -
- {getValue("nama")}
-
-
- Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- - Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKDomisiliOrganisasi.tsx b/src/components/surat/SKDomisiliOrganisasi.tsx
index 769d70a..3885123 100644
--- a/src/components/surat/SKDomisiliOrganisasi.tsx
+++ b/src/components/surat/SKDomisiliOrganisasi.tsx
@@ -3,121 +3,163 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKDomisiliOrganisasi({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN BELUM KAWIN
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini {data.setting.perbekelJabatan}{" "}
+ {data.setting.desaNama}, Kecamatan {data.setting.desaKecamatan},
+ Kabupaten {data.setting.desaKabupaten}, dengan ini menerangkan bahwa:
+
+
+ {/* IDENTITAS ORANG YG MEMINTA SURAT */}
+
+
+
+
+
+
+ | Nama | +: | +{getValue("nama")} | +
| NIK | +: | +{getValue("nik")} | +
| Tempat/Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Agama | +: | +{getValue("agama")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| Alamat | +: | +{getValue("alamat")} | +
+ Berdasarkan keterangan dari yang bersangkutan dan data administrasi
+ kependudukan yang ada di Desa {data.setting.desaNama}, yang bersangkutan
+ benar sampai saat ini belum pernah menikah, baik secara adat, agama,
+ maupun hukum negara.
+
+
+
+ Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat
+ digunakan sebagaimana mestinya.
+
+
+
+ Dikeluarkan di {data.setting.desaNama}
+ Pada tanggal {data.surat.createdAt} +
+
+ {/* TANDA TANGAN */}
+ + Pada tanggal {data.surat.createdAt} +
+
+
+
+
+ Pemohon +
+
+
+
+
+
+ {getValue("nama")}
+
+ +
+ Pemohon +
+
+
+
+
+
+ {getValue("nama")}
+
+
+
+ Kepala Desa / Lurah {data.setting.desaNama} +
+
+{" "}
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ +
+ Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
- {/* HEADER */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN DOMISILI ORGANISASI
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini:
-
-
-
-
-
- {/* IDENTITAS ORANG YG MEMINTA SURAT */}
- | Nama | -: | -{data.setting.perbekelNama} | -
| Jabatan | -: | -{data.setting.perbekelJabatan} | -
| Alamat Kantor | -: | -{data.setting.desaAlamat} | -
- Dengan ini menerangkan bahwa:
-
-
-
-
-
- | Nama Organisasi | : | {getValue("nama")} |
| Jenis Organisasi | : | {getValue("jenis kelamin")} |
| Alamat | : | {getValue("tempat tanggal lahir")} |
| Nomor Telepon | : | {getValue("negara")} |
| Nama Pimpinan | : | {getValue("agama")} |
- Benar bahwa organisasi tersebut berdomisili di wilayah Desa / Kelurahan {data.setting.desaNama}, Kecamatan {data.setting.desaKecamatan}, Kabupaten {data.setting.desaKabupaten}.
- Dan sampai saat ini masih aktif melakukan kegiatan sesuai dengan bidangnya.
- Surat keterangan ini dibuat untuk keperluan {getValue("keperluan")}. -
-
- - Surat keterangan ini dibuat untuk keperluan {getValue("keperluan")}. -
- Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat digunakan sebagaimana mestinya.
-
-
-
- Dikeluarkan di {data.setting.desaNama}
- Pada tanggal {data.surat.createdAt} -
-
- {/* TANDA TANGAN */}
- - Pada tanggal {data.surat.createdAt} -
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
-
- Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- - Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKKelahiran.tsx b/src/components/surat/SKKelahiran.tsx
index 9d7722b..751e749 100644
--- a/src/components/surat/SKKelahiran.tsx
+++ b/src/components/surat/SKKelahiran.tsx
@@ -3,142 +3,244 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKKelahiran({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN DOMISILI ORGANISASI
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini:
+
+
+
+
+
+ {/* IDENTITAS ORANG YG MEMINTA SURAT */}
+ | Nama | +: | +{data.setting.perbekelNama} | +
| Jabatan | +: | +{data.setting.perbekelJabatan} | +
| Alamat Kantor | +: | +{data.setting.desaAlamat} | +
+ Dengan ini menerangkan bahwa:
+
+
+
+
+
+ | Nama Organisasi | +: | +{getValue("nama")} | +
| Jenis Organisasi | +: | +{getValue("jenis kelamin")} | +
| Alamat | +: | +{getValue("tempat tanggal lahir")} | +
| Nomor Telepon | +: | +{getValue("negara")} | +
| Nama Pimpinan | +: | +{getValue("agama")} | +
+ Benar bahwa organisasi tersebut berdomisili di wilayah Desa / Kelurahan{" "}
+ {data.setting.desaNama}, Kecamatan {data.setting.desaKecamatan},
+ Kabupaten {data.setting.desaKabupaten}. Dan sampai saat ini masih aktif
+ melakukan kegiatan sesuai dengan bidangnya.
+
+ Surat keterangan ini dibuat untuk keperluan {getValue("keperluan")}. +
+
+ + Surat keterangan ini dibuat untuk keperluan {getValue("keperluan")}. +
+ Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat
+ digunakan sebagaimana mestinya.
+
+
+
+ Dikeluarkan di {data.setting.desaNama}
+ Pada tanggal {data.surat.createdAt} +
+
+ {/* TANDA TANGAN */}
+ + Pada tanggal {data.surat.createdAt} +
+
+
+
+ Kepala Desa / Lurah {data.setting.desaNama} +
+
+{" "}
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ + Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
-
- {/* HEADER */}
-
-
-
-
- {/* TANDA TANGAN */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN/KOTA {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat} -
- SURAT KETERANGAN KELAHIRAN
- Nomor : {data.surat.noSurat} -
-
- {/* PEMBUKA */}
- - Nomor : {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini, {data.setting.perbekelJabatan}
- {` ${data.setting.desaNama}, Kecamatan ${data.setting.desaKecamatan}, Kabupaten/Kota ${data.setting.desaKabupaten}`}
- , dengan ini menerangkan bahwa:
-
-
- {/* DATA KELAHIRAN ANAK */}
-
- Telah lahir seorang anak pada:
-
-
-
-
-
- {/* DATA IBU */}
- | Tanggal Lahir | : | {getValue("tanggal lahir anak")} |
| Pukul | : | {getValue("pukul lahir anak")} |
| Tempat Kelahiran | : | {getValue("tempat lahir anak")} |
| Jenis Kelamin | : | {getValue("jenis kelamin anak")} |
| Anak ke | : | {getValue("anak ke")} |
| Nama Anak | : | {getValue("nama anak")} |
- Dari seorang ibu bernama:
-
-
-
-
-
- {/* DATA AYAH */}
- | Nama Lengkap Ibu | : | {getValue("nama ibu")} |
| NIK | : | {getValue("nik ibu")} |
| Tempat & Tanggal Lahir | : | {getValue("tempat tanggal lahir ibu")} |
| Pekerjaan | : | {getValue("pekerjaan ibu")} |
| Alamat | : | {getValue("alamat ibu")} |
- Dan seorang ayah bernama:
-
-
-
-
-
- {/* DATA PELAPOR */}
- | Nama Lengkap Ayah | : | {getValue("nama ayah")} |
| NIK | : | {getValue("nik ayah")} |
| Tempat & Tanggal Lahir | : | {getValue("tempat tanggal lahir ayah")} |
| Pekerjaan | : | {getValue("pekerjaan ayah")} |
| Alamat | : | {getValue("alamat ayah")} |
- Berdasarkan laporan dari:
-
-
-
-
-
- {/* PENUTUP */}
- | Nama Pelapor | : | {getValue("nama pelapor")} |
| Hubungan dengan Anak | : | {getValue("hubungan pelapor")} |
| Alamat | : | {getValue("alamat pelapor")} |
- Demikian Surat Keterangan Kelahiran ini dibuat dengan sebenarnya agar dapat digunakan sebagaimana mestinya.
-
-
- {/* TEMPAT TANGGAL */}
- | Dikeluarkan di | : | {data.setting.desaNama} |
| Pada tanggal | : | {data.surat.createdAt} |
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
- Kepala Desa / Lurah {data.setting.desaNama}
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- -
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+
+
+
+ {/* TANDA TANGAN */}
+
+ );
}
diff --git a/src/components/surat/SKKelakuanBaik.tsx b/src/components/surat/SKKelakuanBaik.tsx
index fdb862d..668aebf 100644
--- a/src/components/surat/SKKelakuanBaik.tsx
+++ b/src/components/surat/SKKelakuanBaik.tsx
@@ -3,143 +3,153 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKKelakuanBaik({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+
+ PEMERINTAH KABUPATEN/KOTA {_.upperCase(data.setting.desaKabupaten)}
+
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat}
+
+ SURAT KETERANGAN KELAHIRAN
+
+
+ Nomor : {data.surat.noSurat} +
+
+ {/* PEMBUKA */}
+ + Nomor : {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini, {data.setting.perbekelJabatan}
+ {` ${data.setting.desaNama}, Kecamatan ${data.setting.desaKecamatan}, Kabupaten/Kota ${data.setting.desaKabupaten}`}
+ , dengan ini menerangkan bahwa:
+
+
+ {/* DATA KELAHIRAN ANAK */}
+
+ Telah lahir seorang anak pada:
+
+
+
+
+
+ {/* DATA IBU */}
+ | Tanggal Lahir | +: | +{getValue("tanggal lahir anak")} | +
| Pukul | +: | +{getValue("pukul lahir anak")} | +
| Tempat Kelahiran | +: | +{getValue("tempat lahir anak")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin anak")} | +
| Anak ke | +: | +{getValue("anak ke")} | +
| Nama Anak | +: | +{getValue("nama anak")} | +
+ Dari seorang ibu bernama:
+
+
+
+
+
+ {/* DATA AYAH */}
+ | Nama Lengkap Ibu | +: | +{getValue("nama ibu")} | +
| NIK | +: | +{getValue("nik ibu")} | +
| Tempat & Tanggal Lahir | +: | +{getValue("tempat tanggal lahir ibu")} | +
| Pekerjaan | +: | +{getValue("pekerjaan ibu")} | +
| Alamat | +: | +{getValue("alamat ibu")} | +
+ Dan seorang ayah bernama:
+
+
+
+
+
+ {/* DATA PELAPOR */}
+ | Nama Lengkap Ayah | +: | +{getValue("nama ayah")} | +
| NIK | +: | +{getValue("nik ayah")} | +
| Tempat & Tanggal Lahir | +: | +{getValue("tempat tanggal lahir ayah")} | +
| Pekerjaan | +: | +{getValue("pekerjaan ayah")} | +
| Alamat | +: | +{getValue("alamat ayah")} | +
+ Berdasarkan laporan dari:
+
+
+
+
+
+ {/* PENUTUP */}
+ | Nama Pelapor | +: | +{getValue("nama pelapor")} | +
| Hubungan dengan Anak | +: | +{getValue("hubungan pelapor")} | +
| Alamat | +: | +{getValue("alamat pelapor")} | +
+ Demikian Surat Keterangan Kelahiran ini dibuat dengan sebenarnya agar
+ dapat digunakan sebagaimana mestinya.
+
+
+ {/* TEMPAT TANGGAL */}
+ | Dikeluarkan di | +: | +{data.setting.desaNama} | +
| Pada tanggal | +: | +{data.surat.createdAt} | +
+
+
+ Kepala Desa / Lurah {data.setting.desaNama}
+
+{" "}
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ +
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
-
- {/* HEADER */}
-
-
-
-
- {/* ISI */}
-
-
-
-
- {/* TANDA TANGAN */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- SURAT KETERANGAN KELAKUAN BAIK
- (PENGANTAR SKCK)
- Nomor: {data.surat.noSurat} -
-
- {/* PEMBUKA */}
- - (PENGANTAR SKCK)
- Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini menerangkan dengan sebenarnya bahwa:
-
-
- {/* IDENTITAS PENDUDUK */}
- | Nama lengkap | -: | -{getValue("nama")} | -
| NIK | -: | -{getValue("nik")} | -
| Tempat/Tgl Lahir | -: | -{getValue("tempat tanggal lahir")} | -
| Jenis Kelamin | -: | -{getValue("jenis kelamin")} | -
| Agama | -: | -{getValue("agama")} | -
| Pekerjaan | -: | -{getValue("pekerjaan")} | -
| Alamat | -: | -{getValue("alamat")} | -
- Adalah benar penduduk yang berdomisili di wilayah kami dan selama tinggal di lingkungan
- Desa {data.setting.desaNama}, berkelakuan baik, tidak pernah terlibat perbuatan melanggar hukum,
- serta dikenal sopan dan aktif dalam kegiatan kemasyarakatan.
-
-
-
- Surat keterangan ini diberikan sebagai pengantar permohonan penerbitan Surat Keterangan
- Catatan Kepolisian (SKCK) ke Polsek/Polres {getValue("polsek")}.
-
-
-
- Surat ini berlaku selama 6 (enam) bulan sejak tanggal diterbitkan, kecuali terdapat perubahan
- data yang mendasar.
-
-
-
- Demikian surat keterangan ini dibuat dengan sebenarnya untuk dipergunakan sebagaimana mestinya.
-
-
- {/* TANGGAL */}
- | Dikeluarkan di | -: | -{data.setting.desaNama} | -
| Pada tanggal | -: | -{data.surat.createdAt} | -
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
- Kepala Desa {data.setting.desaNama}
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- -
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+
+
+
+ {/* ISI */}
+
+
+
+
+ {/* TANDA TANGAN */}
+
+ );
}
diff --git a/src/components/surat/SKKematian.tsx b/src/components/surat/SKKematian.tsx
index 417544b..2554422 100644
--- a/src/components/surat/SKKematian.tsx
+++ b/src/components/surat/SKKematian.tsx
@@ -3,118 +3,201 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKKematian({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ SURAT KETERANGAN KELAKUAN BAIK
+
+ (PENGANTAR SKCK) +
+ Nomor: {data.surat.noSurat}
- );
+
+ {/* PEMBUKA */}
+ + (PENGANTAR SKCK) +
+ Nomor: {data.surat.noSurat}
+ Yang bertanda tangan di bawah ini menerangkan dengan sebenarnya bahwa:
+
+
+ {/* IDENTITAS PENDUDUK */}
+ | Nama lengkap | +: | +{getValue("nama")} | +
| NIK | +: | +{getValue("nik")} | +
| Tempat/Tgl Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Agama | +: | +{getValue("agama")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| Alamat | +: | +{getValue("alamat")} | +
+ Adalah benar penduduk yang berdomisili di wilayah kami dan selama
+ tinggal di lingkungan Desa {data.setting.desaNama}, berkelakuan baik,
+ tidak pernah terlibat perbuatan melanggar hukum, serta dikenal sopan dan
+ aktif dalam kegiatan kemasyarakatan.
+
+
+
+ Surat keterangan ini diberikan sebagai pengantar permohonan penerbitan
+ Surat Keterangan Catatan Kepolisian (SKCK) ke Polsek/Polres{" "}
+ {getValue("polsek")}.
+
+
+
+ Surat ini berlaku selama 6 (enam) bulan sejak tanggal diterbitkan,
+ kecuali terdapat perubahan data yang mendasar.
+
+
+
+ Demikian surat keterangan ini dibuat dengan sebenarnya untuk
+ dipergunakan sebagaimana mestinya.
+
+
+ {/* TANGGAL */}
+ | Dikeluarkan di | +: | +{data.setting.desaNama} | +
| Pada tanggal | +: | +{data.surat.createdAt} | +
+
+
+ Kepala Desa {data.setting.desaNama}
+
+{" "}
+
+ {data.setting.perbekelNama} +
+ NIP. {data.setting.perbekelNIP} +
+ +
+ {data.setting.perbekelNama} +
+ NIP. {data.setting.perbekelNIP} +
- {/* HEADER */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
+ useEffect(() => {
+ loadImage();
+ }, [data]);
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN KEMATIAN
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini:
-
-
-
-
-
- | Nama | : | {getValue("nama")} |
| NIK | : | {getValue("nik")} |
| Pekerjaan | : | {getValue("pekerjaan")} |
| Alamat | : | {getValue("alamat")} |
| Hubungan dengan almarhum/almarhumah | : | {getValue("hubungan dengan almarhum")} |
- Melaporkan bahwa:
-
-
-
-
-
- | Nama | : | {getValue("nama")} |
| NIK | : | {getValue("nik")} |
| Jenis Kelamin | : | {getValue("jenis kelamin")} |
| Tempat/Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Agama | : | {getValue("agama")} |
| Alamat | : | {getValue("alamat")} |
- Telah meninggal dunia pada:
-
-
-
-
-
- | Tanggal Kematian | : | {getValue("tanggal kematian")} |
| Waktu Kematian | : | {getValue("waktu kematian")} |
| Tempat Kematian | : | {getValue("tempat kematian")} |
| Penyebab Kematian | : | {getValue("penyebab kematian")} |
- Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat digunakan sebagaimana mestinya.
-
-
- {/* TANDA TANGAN */}
-
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
-
- Pemohon -
- {getValue("nama")}
-
- - Pemohon -
- {getValue("nama")}
-
-
- Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- - Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKPenghasilan.tsx b/src/components/surat/SKPenghasilan.tsx
index 0b920f2..b11028a 100644
--- a/src/components/surat/SKPenghasilan.tsx
+++ b/src/components/surat/SKPenghasilan.tsx
@@ -3,141 +3,180 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKPenghasilan({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN KEMATIAN
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini:
+
+
+
+
+
+ | Nama | +: | +{getValue("nama")} | +
| NIK | +: | +{getValue("nik")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| Alamat | +: | +{getValue("alamat")} | +
| Hubungan dengan almarhum/almarhumah | +: | +{getValue("hubungan dengan almarhum")} | +
+ Melaporkan bahwa:
+
+
+
+
+
+ | Nama | +: | +{getValue("nama")} | +
| NIK | +: | +{getValue("nik")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Tempat/Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Agama | +: | +{getValue("agama")} | +
| Alamat | +: | +{getValue("alamat")} | +
+ Telah meninggal dunia pada:
+
+
+
+
+
+ | Tanggal Kematian | +: | +{getValue("tanggal kematian")} | +
| Waktu Kematian | +: | +{getValue("waktu kematian")} | +
| Tempat Kematian | +: | +{getValue("tempat kematian")} | +
| Penyebab Kematian | +: | +{getValue("penyebab kematian")} | +
+ Demikian surat keterangan ini dibuat dengan sebenarnya agar dapat
+ digunakan sebagaimana mestinya.
+
+
+ {/* TANDA TANGAN */}
+
+
+
+
+
+ Pemohon +
+
+
+
+ {getValue("nama")}
+
+ +
+ Pemohon +
+
+
+
+ {getValue("nama")}
+
+
+ Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ + Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
- {/* HEADER */}
- ("");
- const getValue = (key: string) =>
- _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
+ useEffect(() => {
+ loadImage();
+ }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN PENGHASILAN
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini:
-
-
-
-
-
- {/* IDENTITAS */}
- | Nama | -: | -{data.setting.perbekelNama} | -
| Jabatan | -: | -{data.setting.perbekelJabatan} | -
| Kecamatan | -: | -{data.setting.desaKecamatan} | -
| Kabupaten | -: | -{data.setting.desaKabupaten} | -
- Dengan ini menerangkan bahwa:
-
-
-
-
-
- {/* PENGHASILAN */}
- | Nama | : | {getValue("nama")} |
| Jenis Kelamin | : | {getValue("jenis kelamin")} |
| Tempat / Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Pekerjaan | : | {getValue("pekerjaan")} |
| Alamat | : | {getValue("alamat")} |
- Berdasarkan keterangan yang bersangkutan, orang tersebut memiliki penghasilan rata-rata:
-
-
-
-
-
- {/* KEPERLUAN */}
- | Penghasilan | -: | -- Rp {getValue("penghasilan")} - {" "} - ({getValue("penghasilan terbilang")}) per bulan - | -
- Surat keterangan ini dibuat untuk keperluan: {getValue("alasan permohonan")}.
-
-
-
- Demikian surat keterangan ini dibuat dengan sebenarnya untuk dapat dipergunakan sebagaimana mestinya.
-
-
- {/* TANGGAL & TANDA TANGAN */}
-
- Dikeluarkan di {data.setting.desaNama}
- Pada tanggal {data.surat.createdAt} -
-
- - Pada tanggal {data.surat.createdAt} -
-
+ return (
+
- Kepala Desa / Lurah {data.setting.desaNama}
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- -
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKTempatUsaha.tsx b/src/components/surat/SKTempatUsaha.tsx
index 96d4b28..260ee15 100644
--- a/src/components/surat/SKTempatUsaha.tsx
+++ b/src/components/surat/SKTempatUsaha.tsx
@@ -3,119 +3,142 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKTempatUsaha({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN PENGHASILAN
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini:
+
+
+
+
+
+ {/* IDENTITAS */}
+ | Nama | +: | +{data.setting.perbekelNama} | +
| Jabatan | +: | +{data.setting.perbekelJabatan} | +
| Kecamatan | +: | +{data.setting.desaKecamatan} | +
| Kabupaten | +: | +{data.setting.desaKabupaten} | +
+ Dengan ini menerangkan bahwa:
+
+
+
+
+
+ {/* PENGHASILAN */}
+ | Nama | +: | +{getValue("nama")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Tempat / Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| Alamat | +: | +{getValue("alamat")} | +
+ Berdasarkan keterangan yang bersangkutan, orang tersebut memiliki
+ penghasilan rata-rata:
+
+
+
+
+
+ {/* KEPERLUAN */}
+ | Penghasilan | +: | ++ Rp {getValue("penghasilan")} ( + {getValue("penghasilan terbilang")}) per bulan + | +
+ Surat keterangan ini dibuat untuk keperluan:{" "}
+ {getValue("alasan permohonan")}.
+
+
+
+ Demikian surat keterangan ini dibuat dengan sebenarnya untuk dapat
+ dipergunakan sebagaimana mestinya.
+
+
+ {/* TANGGAL & TANDA TANGAN */}
+
+ Dikeluarkan di {data.setting.desaNama}
+ Pada tanggal {data.surat.createdAt} +
+
+ + Pada tanggal {data.surat.createdAt} +
+
+
+ Kepala Desa / Lurah {data.setting.desaNama}
+
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ +
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
- {/* TITLE */}
- ("");
- const getValue = (key: string) =>
- _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
- try {
- setViewImg("");
- if (!data.setting.perbekelTTD) return;
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ }
+ };
- setViewImg(url);
- } catch (err) {
- console.error("Gagal load gambar:", err);
- }
- };
+ useEffect(() => {
+ loadImage();
+ }, [data]);
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- SURAT KETERANGAN TEMPAT USAHA
- Nomor: {data.surat.noSurat} -
-
- {/* ISI */}
- - Nomor: {data.surat.noSurat} -
-
- -
- -
- - {/* TANDA TANGAN */} -
+ return (
+
- Yang bertanda tangan dibawah ini, saya:
-
-
- {/* DATA PEJABAT */}
-
- |
- |
- |
-
-
- - -
Dengan ini menerangkan bahwa:
-
- {/* DATA WARGA */}
-
- |
- |
- |
- |
-
-
- - -
Benar yang bersangkutan memiliki tempat usaha dengan keterangan seperti berikut:
-
-
- |
- |
- |
- |
- |
- |
-
-
- - Surat keterangan ini dibuat untuk keperluan {getValue("alasan permohonan")}. -
- -- Demikian surat keterangan ini dibuat dengan sebenarnya untuk dapat dipergunakan sebagaimana mestinya. -
- -
- |
- |
-
-
- - - {/* TANDA TANGAN */} -
-
-
- {data.setting.desaKabupaten}, {data.surat.createdAt}
-
- {data.setting.perbekelNama}
- {data.setting.perbekelJabatan + " " + data.setting.desaNama} -
- -
- {data.setting.perbekelNama}
- {data.setting.perbekelJabatan + " " + data.setting.desaNama} -
+ {/* TITLE */}
+
+ );
}
-function Row({ label, value }: { label: string, value: string }) {
- return (
-
+ SURAT KETERANGAN TEMPAT USAHA
+
+ Nomor: {data.surat.noSurat}
- );
+
+ {/* ISI */}
+ + Nomor: {data.surat.noSurat}
+
+ +
+ +
+
+ + {/* TANDA TANGAN */} +
+
+ Yang bertanda tangan dibawah ini, saya:
+
+
+ {/* DATA PEJABAT */}
+
+ |
+ |
+ |
+
+
+ + +
Dengan ini menerangkan bahwa:
+
+ {/* DATA WARGA */}
+
+ |
+ |
+ |
+ |
+
+
+ + +
+ Benar yang bersangkutan memiliki tempat usaha dengan keterangan
+ seperti berikut:
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+ + Surat keterangan ini dibuat untuk keperluan{" "} + {getValue("alasan permohonan")}. +
+ ++ Demikian surat keterangan ini dibuat dengan sebenarnya untuk dapat + dipergunakan sebagaimana mestinya. +
+ +
+ |
+ |
+
+
+ +
+ + {/* TANDA TANGAN */} +
+
+
+ {data.setting.desaKabupaten}, {data.surat.createdAt}
+
+
+ {data.setting.perbekelNama} +
+ {data.setting.perbekelJabatan + " " + data.setting.desaNama} +
+ +
+ {data.setting.perbekelNama} +
+ {data.setting.perbekelJabatan + " " + data.setting.desaNama} +
-
- );
+function Row({ label, value }: { label: string; value: string }) {
+ return (
+ {label}
- :
- {value}
-
+
+ );
}
diff --git a/src/components/surat/SKTidakMampu.tsx b/src/components/surat/SKTidakMampu.tsx
index f483e6c..47a224f 100644
--- a/src/components/surat/SKTidakMampu.tsx
+++ b/src/components/surat/SKTidakMampu.tsx
@@ -3,110 +3,118 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKTidakMampu({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState{label}
+ :
+ {value}
+
- {/* TITLE */}
- ("");
- const getValue = (jenis: string) =>
- _.upperFirst(
- data.surat.dataText.find((item: any) => item.jenis === jenis)?.value || ""
- );
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- SURAT KETERANGAN TIDAK MAMPU
- Nomor: {data.surat.noSurat} -
-
- {/* ISI */}
- - Nomor: {data.surat.noSurat} -
-
- -
- -
- - {/* TANDA TANGAN */} -
+ return (
+
- Yang bertanda tangan dibawah ini, saya
-
-
- {/* DATA PEJABAT */}
-
-
- |
- |
- |
-
-
-
- - -
Dengan ini menerangkan bahwa:
-
- {/* DATA WARGA */}
-
-
- |
- |
- |
- |
-
-
-
- - -
- Orang tersebut benar-benar penduduk desa {data.setting.desaNama} dan termasuk keluarga tidak mampu. - Surat keterangan ini dipergunakan untuk - {getValue("alasan permohonan")}. -
- -- Demikian surat keterangan ini kami buat dengan sebenar-benarnya untuk dapat dipergunakan - sebagaimana mestinya. -
- -- - {/* TANDA TANGAN */} -
-
-
- {data.setting.desaKabupaten}, {data.surat.createdAt}
-
- {data.setting.perbekelNama}
- {data.setting.perbekelJabatan + " " + data.setting.desaNama} -
- -
- {data.setting.perbekelNama}
- {data.setting.perbekelJabatan + " " + data.setting.desaNama} -
+ {/* TITLE */}
+
+ );
}
-function Row({ label, value }: { label: string, value: string }) {
- return (
-
+ SURAT KETERANGAN TIDAK MAMPU
+
+ Nomor: {data.surat.noSurat}
- );
+
+ {/* ISI */}
+ + Nomor: {data.surat.noSurat}
+
+ +
+ +
+
+ + {/* TANDA TANGAN */} +
+
+ Yang bertanda tangan dibawah ini, saya
+
+
+ {/* DATA PEJABAT */}
+
+ |
+ |
+ |
+
+
+ + +
Dengan ini menerangkan bahwa:
+
+ {/* DATA WARGA */}
+
+ |
+ |
+ |
+ |
+
+
+ + +
+ Orang tersebut benar-benar penduduk desa {data.setting.desaNama} dan + termasuk keluarga tidak mampu. Surat keterangan ini dipergunakan untuk + {getValue("alasan permohonan")}. +
+ ++ Demikian surat keterangan ini kami buat dengan sebenar-benarnya untuk + dapat dipergunakan sebagaimana mestinya. +
+ ++
+ + {/* TANDA TANGAN */} +
+
+
+ {data.setting.desaKabupaten}, {data.surat.createdAt}
+
+
+ {data.setting.perbekelNama} +
+ {data.setting.perbekelJabatan + " " + data.setting.desaNama} +
+ +
+ {data.setting.perbekelNama} +
+ {data.setting.perbekelJabatan + " " + data.setting.desaNama} +
-
- );
+function Row({ label, value }: { label: string; value: string }) {
+ return (
+ {label}
- :
- {value}
-
+
+ );
}
diff --git a/src/components/surat/SKUsaha.tsx b/src/components/surat/SKUsaha.tsx
index 470d188..c35be99 100644
--- a/src/components/surat/SKUsaha.tsx
+++ b/src/components/surat/SKUsaha.tsx
@@ -3,147 +3,217 @@ import { useEffect, useState } from "react";
import notification from "../notificationGlobal";
export default function SKUsaha({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState{label}
+ :
+ {value}
+
- {/* HEADER */}
- ("");
- const getValue = (key: string) =>
- _.upperFirst(data.surat.dataText.find((i: any) => i.jenis === key)?.value || "");
+ const [viewImg, setViewImg] = useState("");
+ 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 loadImage = async () => {
+ try {
+ setViewImg("");
+ if (!data.setting.perbekelTTD) return;
- const urlApi = '/api/pengaduan/image?folder=lainnya&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);
+ const urlApi =
+ "/api/pengaduan/image?folder=lainnya&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);
- }
- };
+ setViewImg(url);
+ } catch (err) {
+ console.error("Gagal load gambar:", err);
+ }
+ };
- useShallowEffect(() => {
- loadImage();
- }, [data]);
-
- return (
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
-
- {/* JUDUL */}
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA / KELURAHAN {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}
- Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN USAHA
- Nomor: {data.surat.noSurat} -
-
- {/* YANG BERTANDA TANGAN */}
- - Nomor: {data.surat.noSurat} -
- Yang bertanda tangan di bawah ini:
-
-
-
-
-
- {/* IDENTITAS ORANG YG MEMINTA SURAT */}
- | Nama | -: | -{data.setting.perbekelNama} | -
| Jabatan | -: | -{data.setting.perbekelJabatan} | -
| Kecamatan | -: | -{data.setting.desaKecamatan} | -
| Kabupaten | -: | -{data.setting.desaKabupaten} | -
- Dengan ini menerangkan dengan sesungguhnya bahwa:
-
-
-
-
-
- {/* DOMISILI */}
- | Nama | : | {getValue("nama")} |
| Jenis Kelamin | : | {getValue("jenis kelamin")} |
| Tempat / Tanggal Lahir | : | {getValue("tempat tanggal lahir")} |
| Warga Negara | : | {getValue("negara")} |
| Agama | : | {getValue("agama")} |
| Status | : | {getValue("status perkawinan")} |
| Pekerjaan | : | {getValue("pekerjaan")} |
| Alamat | : | {getValue("alamat")} |
- Bahwa orang tersebut di atas benar-benar penduduk:
-
-
-
-
-
- {/* USAHA */}
- | Desa / Kelurahan | : | {data.setting.desaNama} |
| Kecamatan | : | {data.setting.desaKecamatan} |
| Kabupaten | : | {data.setting.desaKabupaten} |
- Dan yang bersangkutan benar memiliki usaha:
-
-
-
-
-
- | Jenis Usaha | : | {getValue("jenis usaha")} |
| Alamat Usaha | : | {getValue("alamat usaha")} |
- Surat keterangan ini dibuat dengan sebenarnya untuk dipergunakan sebagaimana mestinya.
-
-
-
- Dikeluarkan di {data.setting.desaNama}
- Pada tanggal {data.surat.createdAt} -
-
- {/* TANDA TANGAN */}
- - Pada tanggal {data.surat.createdAt} -
-
+ useEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
-
- Kepala Desa / Lurah {data.setting.desaNama} -
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- - Kepala Desa / Lurah {data.setting.desaNama} -
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ );
}
diff --git a/src/components/surat/SKYatimPiatu.tsx b/src/components/surat/SKYatimPiatu.tsx
index e8c18f8..c2a86c1 100644
--- a/src/components/surat/SKYatimPiatu.tsx
+++ b/src/components/surat/SKYatimPiatu.tsx
@@ -4,191 +4,209 @@ import { useState } from "react";
import notification from "../notificationGlobal";
export default function SKYatim({ data }: { data: any }) {
- const [viewImg, setViewImg] = useState
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
- );
+
+ {/* JUDUL */}
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA / KELURAHAN {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat} +
+ Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN USAHA
+
+
+ Nomor: {data.surat.noSurat} +
+
+ {/* YANG BERTANDA TANGAN */}
+ + Nomor: {data.surat.noSurat} +
+ Yang bertanda tangan di bawah ini:
+
+
+
+
+
+ {/* IDENTITAS ORANG YG MEMINTA SURAT */}
+ | Nama | +: | +{data.setting.perbekelNama} | +
| Jabatan | +: | +{data.setting.perbekelJabatan} | +
| Kecamatan | +: | +{data.setting.desaKecamatan} | +
| Kabupaten | +: | +{data.setting.desaKabupaten} | +
+ Dengan ini menerangkan dengan sesungguhnya bahwa:
+
+
+
+
+
+ {/* DOMISILI */}
+ | Nama | +: | +{getValue("nama")} | +
| Jenis Kelamin | +: | +{getValue("jenis kelamin")} | +
| Tempat / Tanggal Lahir | +: | +{getValue("tempat tanggal lahir")} | +
| Warga Negara | +: | +{getValue("negara")} | +
| Agama | +: | +{getValue("agama")} | +
| Status | +: | +{getValue("status perkawinan")} | +
| Pekerjaan | +: | +{getValue("pekerjaan")} | +
| Alamat | +: | +{getValue("alamat")} | +
+ Bahwa orang tersebut di atas benar-benar penduduk:
+
+
+
+
+
+ {/* USAHA */}
+ | Desa / Kelurahan | +: | +{data.setting.desaNama} | +
| Kecamatan | +: | +{data.setting.desaKecamatan} | +
| Kabupaten | +: | +{data.setting.desaKabupaten} | +
+ Dan yang bersangkutan benar memiliki usaha:
+
+
+
+
+
+ | Jenis Usaha | +: | +{getValue("jenis usaha")} | +
| Alamat Usaha | +: | +{getValue("alamat usaha")} | +
+ Surat keterangan ini dibuat dengan sebenarnya untuk dipergunakan
+ sebagaimana mestinya.
+
+
+
+ Dikeluarkan di {data.setting.desaNama}
+ Pada tanggal {data.surat.createdAt} +
+
+ {/* TANDA TANGAN */}
+ + Pada tanggal {data.surat.createdAt} +
+
+
+
+ Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ + Kepala Desa / Lurah {data.setting.desaNama} +
+
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
-
- {/* HEADER */}
-
- - {/* BAGIAN PENANDATANGAN */} -
-
-
-
-
- - {/* BAGIAN IDENTITAS ANAK */} -
-
-
-
-
- - {/* KETERANGAN ORANG TUA */} -
- -
-
-
-
-
- -
-
-
-
-
- -
- -
- - {/* TANGGAL & TEMPAT */} -
-
-
-
-
- - {/* TTD */} -
+ {label}
+ {hint && (
+
+
+
+
+ )}
+
+ );
+}
+
+function FormSection({
+ title,
+ icon,
+ children,
+ description,
+}: {
+ title: string;
+ icon?: React.ReactNode;
+ children: React.ReactNode;
+ description?: string;
+}) {
+ return (
+
+
+
+ {icon}
+ {title}
+
+ {description && {description} }
+
+
+ {children}
+
+ );
+}
+
+// =========================
+// Main form component
+// =========================
+
+export default function FormSurat() {
+ const { data, mutate, isLoading } = useSWR("category-pelayanan-list", () =>
+ apiFetch.api.pelayanan.category.get(),
+ );
+
+ const listCategory = data?.data || [];
+
+
+ useShallowEffect(() => {
+ mutate();
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+ Form Length: 3 Sections
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/pages/scr/dashboard/dashboard_home.tsx b/src/pages/scr/dashboard/dashboard_home.tsx
index 554cd4e..64a33c7 100644
--- a/src/pages/scr/dashboard/dashboard_home.tsx
+++ b/src/pages/scr/dashboard/dashboard_home.tsx
@@ -9,7 +9,7 @@ import {
Progress,
Stack,
Text,
- Title
+ Title,
} from "@mantine/core";
export default function Dashboard() {
diff --git a/src/pages/scr/dashboard/dashboard_layout.tsx b/src/pages/scr/dashboard/dashboard_layout.tsx
index ca3f687..0a7b5ae 100644
--- a/src/pages/scr/dashboard/dashboard_layout.tsx
+++ b/src/pages/scr/dashboard/dashboard_layout.tsx
@@ -285,45 +285,47 @@ function NavigationDashboard() {
return (
- {navItems.filter((item) => permissions.includes(item.key)).map((item) => (
-
- {item.label}
- {isActive(item.path as keyof typeof clientRoute) && (
-
- Active
-
- )}
-
- }
- description={item.description}
- onClick={() =>
- navigate(clientRoutes[item.path as keyof typeof clientRoute])
- }
- style={{
- backgroundColor: isActive(item.path as keyof typeof clientRoute)
- ? "rgba(0,255,200,0.1)"
- : "transparent",
- borderRadius: "8px",
- transition: "all 0.2s ease",
- }}
- styles={{
- label: { color: "white" },
- description: { color: "#aaa" },
- section: { color: "teal" },
- }}
- />
- ))}
+ {navItems
+ .filter((item) => permissions.includes(item.key))
+ .map((item) => (
+
+ {item.label}
+ {isActive(item.path as keyof typeof clientRoute) && (
+
+ Active
+
+ )}
+
+ }
+ description={item.description}
+ onClick={() =>
+ navigate(clientRoutes[item.path as keyof typeof clientRoute])
+ }
+ style={{
+ backgroundColor: isActive(item.path as keyof typeof clientRoute)
+ ? "rgba(0,255,200,0.1)"
+ : "transparent",
+ borderRadius: "8px",
+ transition: "all 0.2s ease",
+ }}
+ styles={{
+ label: { color: "white" },
+ description: { color: "#aaa" },
+ section: { color: "teal" },
+ }}
+ />
+ ))}
);
}
diff --git a/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx b/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
index 75e9d4b..701da8f 100644
--- a/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
+++ b/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
@@ -19,7 +19,7 @@ import {
Text,
Textarea,
ThemeIcon,
- Title
+ Title,
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import {
@@ -29,7 +29,7 @@ import {
IconFileCheck,
IconMessageReport,
IconPhone,
- IconUser
+ IconUser,
} from "@tabler/icons-react";
import type { User } from "generated/prisma";
import type { JsonValue } from "generated/prisma/runtime/library";
@@ -59,7 +59,14 @@ export default function DetailPengajuanPage() {
- { mutate(); }} />
+ {
+ mutate();
+ }}
+ />
@@ -71,7 +78,17 @@ export default function DetailPengajuanPage() {
);
}
-function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data: any, syaratDokumen: any, dataText: any, onAction: () => void }) {
+function DetailDataPengajuan({
+ data,
+ syaratDokumen,
+ dataText,
+ onAction,
+}: {
+ data: any;
+ syaratDokumen: any;
+ dataText: any;
+ onAction: () => void;
+}) {
const [opened, { open, close }] = useDisclosure(false);
const [catModal, setCatModal] = useState<"tolak" | "terima">("tolak");
const [keterangan, setKeterangan] = useState("");
@@ -88,7 +105,9 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
setHost(data?.user ?? null);
if (data?.permissions && Array.isArray(data.permissions)) {
- const onlySetting = data.permissions.filter((p: any) => p.startsWith("pelayanan"));
+ const onlySetting = data.permissions.filter((p: any) =>
+ p.startsWith("pelayanan"),
+ );
setPermissions(onlySetting);
}
}
@@ -99,10 +118,15 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
try {
const res = await apiFetch.api.pelayanan["update-status"].post({
id: data?.id,
- status: cat == 'tolak' ? 'ditolak' : data.status == 'antrian' ? 'diterima' : 'selesai',
+ status:
+ cat == "tolak"
+ ? "ditolak"
+ : data.status == "antrian"
+ ? "diterima"
+ : "selesai",
keterangan: keterangan,
idUser: host?.id ?? "",
- noSurat: noSurat
+ noSurat: noSurat,
});
if (res?.status === 200) {
@@ -120,7 +144,6 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
type: "error",
});
}
-
} catch (error) {
console.error(error);
notification({
@@ -129,7 +152,7 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
type: "error",
});
}
- }
+ };
useShallowEffect(() => {
if (viewImg) {
@@ -142,7 +165,7 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
{
- setOpenedPreviewFile(false)
+ setOpenedPreviewFile(false);
}}
folder="syarat-dokumen"
fileName={viewImg}
@@ -159,14 +182,25 @@ function DetailDataPengajuan({ data, syaratDokumen, dataText, onAction }: { data
{catModal === "tolak" ? (
<>
- Anda yakin ingin menolak pengajuan surat ini? Berikan alasan penolakan
+ Anda yakin ingin menolak pengajuan surat ini? Berikan alasan
+ penolakan
-
- PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
- KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}. Kode Pos: {data.setting.desaPos} -
-
- - KECAMATAN {_.upperCase(data.setting.desaKecamatan)}
- DESA {_.upperCase(data.setting.desaNama)}
- Alamat: {data.setting.desaAlamat}. Kode Pos: {data.setting.desaPos} -
- SURAT KETERANGAN YATIM / PIATU / YATIM PIATU
- Nomor: {data.surat.noSurat} -
-
- - Nomor: {data.surat.noSurat} -
- - {/* BAGIAN PENANDATANGAN */} -
Yang bertanda tangan di bawah ini:
- | Nama | -: {data.setting.perbekelNama} | -
| Jabatan | -: {data.setting.perbekelJabatan} | -
| Alamat Kantor | -: {data.setting.desaAlamat} | -
- - {/* BAGIAN IDENTITAS ANAK */} -
Dengan ini menerangkan bahwa:
-
- | Nama | -: {getValue("nama")} | -
| Tempat/Tanggal Lahir | -: {getValue("tempat tanggal lahir")} | -
| Jenis Kelamin | -: {getValue("jenis kelamin")} | -
| Alamat | -: {getValue("alamat")} | -
| NIK | -: {getValue("nik")} | -
| Pekerjaan | -: {getValue("pekerjaan")} | -
- - {/* KETERANGAN ORANG TUA */} -
- Benar bahwa yang bersangkutan adalah anak (Yatim / Piatu / Yatim Piatu),
- dengan keterangan sebagai berikut:
-
-
- - -
1. Nama Ayah
- | Nama Ayah | -: {getValue("nama ayah")} | -
| Status | -: {getValue("status ayah")} | -
- -
2. Nama Ibu
- | Nama Ibu | -: {getValue("nama ibu")} | -
| Status | -: {getValue("status ibu")} | -
- -
- Dengan demikian, berdasarkan keterangan pihak keluarga dan data di Kantor Desa,
- maka benar bahwa yang bersangkutan adalah
- anak (Yatim / Piatu / Yatim Piatu).
-
-
- - -
- Surat keterangan ini dibuat dengan sebenar-benarnya untuk dipergunakan sebagaimana mestinya.
-
-
- - - {/* TANGGAL & TEMPAT */} -
| Dikeluarkan di | -: {data.setting.desaNama} | -
| Pada tanggal | -: {data.surat.createdAt} | -
- - {/* TTD */} -
-
+ useShallowEffect(() => {
+ loadImage();
+ }, [data]);
+ return (
+
- Kepala Desa {data.setting.desaNama}
-
-
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
- -
- {data.setting.perbekelNama}
- NIP. {data.setting.perbekelNIP} -
+ {/* HEADER */}
+
+ + {/* BAGIAN PENANDATANGAN */} +
+
+
+
+
+ + {/* BAGIAN IDENTITAS ANAK */} +
+
+
+
+
+ + {/* KETERANGAN ORANG TUA */} +
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+ +
+ + {/* TANGGAL & TEMPAT */} +
+
+
+
+
+ + {/* TTD */} +
+ );
}
diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index 6c9a759..da726da 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -28,16 +28,19 @@ export default function Login() {
window.location.href = clientRoutes["/scr/dashboard/warga/list-warga"];
break;
case "credential":
- window.location.href = clientRoutes["/scr/dashboard/credential/credential"];
+ window.location.href =
+ clientRoutes["/scr/dashboard/credential/credential"];
break;
case "setting":
- window.location.href = clientRoutes["/scr/dashboard/setting/detail-setting"];
+ window.location.href =
+ clientRoutes["/scr/dashboard/setting/detail-setting"];
break;
case "api_key":
window.location.href = clientRoutes["/scr/dashboard/apikey/apikey"];
break;
case "pelayanan":
- window.location.href = clientRoutes["/scr/dashboard/pelayanan-surat/list-pelayanan"];
+ window.location.href =
+ clientRoutes["/scr/dashboard/pelayanan-surat/list-pelayanan"];
break;
default:
window.location.href = clientRoutes["/scr/dashboard"];
diff --git a/src/pages/darmasaba/surat.tsx b/src/pages/darmasaba/surat.tsx
new file mode 100644
index 0000000..be6a19f
--- /dev/null
+++ b/src/pages/darmasaba/surat.tsx
@@ -0,0 +1,331 @@
+import apiFetch from "@/lib/apiFetch";
+import {
+ ActionIcon,
+ Badge,
+ Box,
+ Button,
+ Card,
+ Container,
+ Divider,
+ Grid,
+ Group,
+ Select,
+ Stack,
+ Text,
+ TextInput,
+ Textarea,
+ Tooltip
+} from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import {
+ IconBuildingCommunity,
+ IconInfoCircle,
+ IconMapPin,
+ IconUser
+} from "@tabler/icons-react";
+import React from "react";
+import useSWR from "swr";
+
+// =========================
+// Reusable UI components
+// =========================
+
+function FieldLabel({ label, hint }: { label: string; hint?: string }) {
+ return (
+
+ PEMERINTAH KABUPATEN {_.upperCase(data.setting.desaKabupaten)}
+
+ KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat}. Kode Pos: {data.setting.desaPos}
- );
+
+ + KECAMATAN {_.upperCase(data.setting.desaKecamatan)} +
+ DESA {_.upperCase(data.setting.desaNama)} +
+ Alamat: {data.setting.desaAlamat}. Kode Pos: {data.setting.desaPos}
+
+ SURAT KETERANGAN YATIM / PIATU / YATIM PIATU
+
+
+ Nomor: {data.surat.noSurat} +
+
+ + Nomor: {data.surat.noSurat} +
+ + {/* BAGIAN PENANDATANGAN */} +
Yang bertanda tangan di bawah ini:
+ | Nama | +: {data.setting.perbekelNama} | +
| Jabatan | +: {data.setting.perbekelJabatan} | +
| Alamat Kantor | +: {data.setting.desaAlamat} | +
+ + {/* BAGIAN IDENTITAS ANAK */} +
Dengan ini menerangkan bahwa:
+
+ | Nama | +: {getValue("nama")} | +
| Tempat/Tanggal Lahir | +: {getValue("tempat tanggal lahir")} | +
| Jenis Kelamin | +: {getValue("jenis kelamin")} | +
| Alamat | +: {getValue("alamat")} | +
| NIK | +: {getValue("nik")} | +
| Pekerjaan | +: {getValue("pekerjaan")} | +
+ + {/* KETERANGAN ORANG TUA */} +
+ Benar bahwa yang bersangkutan adalah{" "}
+ anak (Yatim / Piatu / Yatim Piatu), dengan keterangan sebagai
+ berikut:
+
+
+ + +
+ 1. Nama Ayah
+
+ | Nama Ayah | +: {getValue("nama ayah")} | +
| Status | +: {getValue("status ayah")} | +
+ +
+ 2. Nama Ibu
+
+ | Nama Ibu | +: {getValue("nama ibu")} | +
| Status | +: {getValue("status ibu")} | +
+ +
+ Dengan demikian, berdasarkan keterangan pihak keluarga dan data di
+ Kantor Desa, maka benar bahwa yang bersangkutan adalah
+ anak (Yatim / Piatu / Yatim Piatu).
+
+
+ + +
+ Surat keterangan ini dibuat dengan sebenar-benarnya untuk dipergunakan
+ sebagaimana mestinya.
+
+
+ + + {/* TANGGAL & TEMPAT */} +
| Dikeluarkan di | +: {data.setting.desaNama} | +
| Pada tanggal | +: {data.surat.createdAt} | +
+ + {/* TTD */} +
+
+
+ Kepala Desa {data.setting.desaNama}
+
+
+{" "}
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+ +
+
+ {data.setting.perbekelNama}
+ NIP. {data.setting.perbekelNIP} +
+
+ Surat Keterangan Tidak Mampu (SKTM)
+
+
+ Blangko resmi untuk pengajuan Surat Keterangan Tidak Mampu —
+ digunakan untuk keperluan pendidikan, kesehatan, atau
+ administrasi.
+
+
+