diff --git a/src/AppRoutes.tsx b/src/AppRoutes.tsx
index b083d0e..fc5ebc6 100644
--- a/src/AppRoutes.tsx
+++ b/src/AppRoutes.tsx
@@ -18,6 +18,7 @@ import Home from "./pages/Home";
import CredentialPage from "./pages/scr/dashboard/credential/credential_page";
import DashboardHome from "./pages/scr/dashboard/dashboard_home";
import ListPelayananPage from "./pages/scr/dashboard/pelayanan-surat/list_pelayanan_page";
+import DetailPelayananPage from "./pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page";
import ListPage from "./pages/scr/dashboard/pengaduan/list_page";
import DetailPage from "./pages/scr/dashboard/pengaduan/detail_page";
import ApikeyPage from "./pages/scr/dashboard/apikey/apikey_page";
@@ -99,6 +100,10 @@ export default function AppRoutes() {
path="/scr/dashboard/pelayanan-surat/list-pelayanan"
element={}
/>
+ }
+ />
}
diff --git a/src/clientRoutes.ts b/src/clientRoutes.ts
index 42ce0b8..b1b098a 100644
--- a/src/clientRoutes.ts
+++ b/src/clientRoutes.ts
@@ -20,6 +20,7 @@ const clientRoutes = {
"/scr/dashboard/credential/credential": "/scr/dashboard/credential/credential",
"/scr/dashboard/dashboard-home": "/scr/dashboard/dashboard-home",
"/scr/dashboard/pelayanan-surat/list-pelayanan": "/scr/dashboard/pelayanan-surat/list-pelayanan",
+ "/scr/dashboard/pelayanan-surat/detail-pelayanan": "/scr/dashboard/pelayanan-surat/detail-pelayanan",
"/scr/dashboard/pengaduan/list": "/scr/dashboard/pengaduan/list",
"/scr/dashboard/pengaduan/detail": "/scr/dashboard/pengaduan/detail",
"/scr/dashboard/apikey/apikey": "/scr/dashboard/apikey/apikey",
diff --git a/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx b/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
new file mode 100644
index 0000000..c088207
--- /dev/null
+++ b/src/pages/scr/dashboard/pelayanan-surat/detail_pelayanan_page.tsx
@@ -0,0 +1,370 @@
+import apiFetch from "@/lib/apiFetch";
+import {
+ Anchor,
+ Badge,
+ Button,
+ Card,
+ Container,
+ Divider,
+ Flex,
+ Grid,
+ Group,
+ Modal,
+ Stack,
+ Table,
+ Text,
+ Textarea,
+ Title,
+} from "@mantine/core";
+import { useDisclosure, useShallowEffect } from "@mantine/hooks";
+import {
+ IconAlignJustified,
+ IconCategory,
+ IconFileCertificate,
+ IconInfoTriangle,
+ IconMapPin,
+ IconMessageReport,
+ IconPhotoScan,
+ IconUser,
+} from "@tabler/icons-react";
+import { useState } from "react";
+import { useLocation } from "react-router-dom";
+import useSwr from "swr";
+
+export default function DetailPelayananPage() {
+ const { search } = useLocation();
+ const query = new URLSearchParams(search);
+ const id = query.get("id");
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+function DetailDataPelayanan() {
+ const [opened, { open, close }] = useDisclosure(false);
+ const [catModal, setCatModal] = useState<"tolak" | "terima">("tolak");
+
+ return (
+ <>
+
+
+ {catModal === "tolak" ? (
+ <>
+
+ Anda yakin ingin menolak pengaduan ini? Berikan alasan penolakan
+
+
+
+
+
+
+
+
+ ) : (
+ <>
+ Anda yakin ingin menerima pengaduan ini?
+
+
+
+
+
+ )}
+
+
+
+
+
+
+
+
+ Pelayanan Surat
+
+
+ #PGf-2345-33
+
+
+
+ antrian
+
+
+
+
+
+
+
+
+
+ Judul
+
+
+ Judul Pelayanan Surat
+
+
+
+
+
+ Lokasi
+
+
+ fwef
+
+
+
+
+
+
+
+
+
+ Kategori
+
+
+ fwef
+
+
+
+
+
+ Gambar
+
+
+ Lihat Gambar
+
+
+
+
+
+
+
+
+
+ Detail
+
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit.
+ Illum, corporis iusto. Suscipit veritatis quas, non nobis
+ fuga, laudantium accusantium tempora sint aliquid architecto
+ totam esse eum excepturi nostrum fugiat ut.
+
+
+
+
+
+ Keterangan
+
+
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. At
+ fugiat eligendi nesciunt dolore? Maiores a cumque vitae
+ suscipit incidunt quos beatae modi, vel, id ullam quae
+ voluptas, deserunt quas placeat.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+function DetailDataHistori() {
+ const elements = [
+ { position: 6, mass: 12.011, symbol: "C", name: "Carbon" },
+ { position: 7, mass: 14.007, symbol: "N", name: "Nitrogen" },
+ { position: 39, mass: 88.906, symbol: "Y", name: "Yttrium" },
+ { position: 56, mass: 137.33, symbol: "Ba", name: "Barium" },
+ { position: 58, mass: 140.12, symbol: "Ce", name: "Cerium" },
+ ];
+
+ const rows = elements.map((element) => (
+
+ {element.position}
+ {element.name}
+ {element.symbol}
+ {element.mass}
+
+ ));
+ return (
+
+
+
+
+ Histori Pengaduan
+
+
+
+
+
+
+ Tanggal
+ Deskripsi
+ Status
+ User
+
+
+ {rows}
+
+
+
+ );
+}
+
+function DetailUserPelayanan() {
+ const [page, setPage] = useState(1);
+ const [value, setValue] = useState("");
+ const { data, mutate, isLoading } = useSwr("/", () =>
+ apiFetch.api.pengaduan.list.get({
+ query: {
+ status,
+ search: value,
+ take: "",
+ page: "",
+ },
+ }),
+ );
+
+ useShallowEffect(() => {
+ mutate();
+ }, [status, value]);
+
+ const list = data?.data || [];
+
+ return (
+
+
+
+
+
+ Warga
+
+
+
+
+
+
+
+
+ Nama
+
+
+ Amalia Dwi Yustiani
+
+
+
+
+
+ Telepon
+
+
+ 08123456789
+
+
+
+
+
+ Jumlah Pengaduan
+
+
+ 10
+
+
+
+
+
+ Jumlah Pelayanan Surat
+
+
+ 10
+
+
+
+
+
+ );
+}
diff --git a/src/pages/scr/dashboard/pelayanan-surat/list_pelayanan_page.tsx b/src/pages/scr/dashboard/pelayanan-surat/list_pelayanan_page.tsx
index 6a5c0aa..db5a160 100644
--- a/src/pages/scr/dashboard/pelayanan-surat/list_pelayanan_page.tsx
+++ b/src/pages/scr/dashboard/pelayanan-surat/list_pelayanan_page.tsx
@@ -133,6 +133,8 @@ function ListPelayananSurat({ status }: { status: StatusKey }) {
mutate();
}, [status, value]);
+ const navigate = useNavigate();
+
if (isLoading)
return (
}
/>
- {/*
- Menampilkan {Number(data?.data?.length) * (page - 1) + 1} – {Math.min(10, Number(data?.data?.length) * page)} dari {Number(data?.data?.length)}
-
- */}
{list.length === 0 ? (
- No pengaduan have been added yet.
+ No pelayanan surat have been added yet.
@@ -196,6 +194,9 @@ function ListPelayananSurat({ status }: { status: StatusKey }) {
borderColor: "rgba(100,100,100,0.2)",
boxShadow: "0 0 20px rgba(0,255,200,0.08)",
}}
+ onClick={() => {
+ navigate(`/scr/dashboard/pelayanan-surat/detail-pelayanan?id=${v.id}`);
+ }}
>
diff --git a/src/pages/scr/dashboard/pengaduan/detail_page.tsx b/src/pages/scr/dashboard/pengaduan/detail_page.tsx
index 11fb9a1..dedffa2 100644
--- a/src/pages/scr/dashboard/pengaduan/detail_page.tsx
+++ b/src/pages/scr/dashboard/pengaduan/detail_page.tsx
@@ -1,345 +1,370 @@
import apiFetch from "@/lib/apiFetch";
import {
- Anchor,
- Badge,
- Button,
- Card,
- Container,
- Divider,
- Flex,
- Grid,
- Group,
- Modal,
- Stack,
- Table,
- Text,
- Textarea,
- Title
+ Anchor,
+ Badge,
+ Button,
+ Card,
+ Container,
+ Divider,
+ Flex,
+ Grid,
+ Group,
+ Modal,
+ Stack,
+ Table,
+ Text,
+ Textarea,
+ Title,
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import {
- IconAlignJustified,
- IconCategory,
- IconFileCertificate,
- IconInfoTriangle,
- IconMapPin,
- IconMessageReport,
- IconPhotoScan,
- IconUser
+ IconAlignJustified,
+ IconCategory,
+ IconFileCertificate,
+ IconInfoTriangle,
+ IconMapPin,
+ IconMessageReport,
+ IconPhotoScan,
+ IconUser,
} from "@tabler/icons-react";
import { useState } from "react";
import { useLocation } from "react-router-dom";
import useSwr from "swr";
export default function DetailPengaduanPage() {
- const { search } = useLocation();
- const query = new URLSearchParams(search);
- const id = query.get("id");
+ const { search } = useLocation();
+ const query = new URLSearchParams(search);
+ const id = query.get("id");
- return (
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
}
function DetailDataPengaduan() {
- const [opened, { open, close }] = useDisclosure(false);
- const [catModal, setCatModal] = useState<'tolak' | 'terima'>('tolak');
+ const [opened, { open, close }] = useDisclosure(false);
+ const [catModal, setCatModal] = useState<"tolak" | "terima">("tolak");
- return (
- <>
-
-
- {
- catModal === 'tolak'
- ? (
- <>
- Anda yakin ingin menolak pengaduan ini? Berikan alasan penolakan
+ return (
+ <>
+
+
+ {catModal === "tolak" ? (
+ <>
+
+ Anda yakin ingin menolak pengaduan ini? Berikan alasan penolakan
+
-
-
-
-
-
-
- )
- :
- (
- <>
- Anda yakin ingin menerima pengaduan ini?
-
-
-
-
-
- )
- }
+
+
+
+
+
+
+ ) : (
+ <>
+ Anda yakin ingin menerima pengaduan ini?
+
+
+
+
+
+ )}
+
+
-
-
-
-
-
-
+
+
+
+
+
+ Pengaduan
+
+
+ #PGf-2345-33
+
+
+
+ antrian
+
+
+
+
+
+
+
-
- Pengaduan
-
-
- #PGf-2345-33
-
+
+ Judul
-
- antrian
-
-
-
-
-
-
-
-
-
-
- Judul
-
-
- Judul Pengaduan
-
-
-
-
-
- Lokasi
-
-
- fwef
-
-
-
-
-
-
-
-
-
- Kategori
-
-
- fwef
-
-
-
-
-
- Gambar
-
-
-
- Lihat Gambar
-
-
-
-
-
-
-
-
-
-
- Detail
-
-
-
- Lorem ipsum dolor sit, amet consectetur adipisicing elit. Illum, corporis iusto. Suscipit veritatis quas, non nobis fuga, laudantium accusantium tempora sint aliquid architecto totam esse eum excepturi nostrum fugiat ut.
-
-
-
-
-
-
- Keterangan
-
-
-
- Lorem ipsum dolor, sit amet consectetur adipisicing elit. At fugiat eligendi nesciunt dolore? Maiores a cumque vitae suscipit incidunt quos beatae modi, vel, id ullam quae voluptas, deserunt quas placeat.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
+
+ Judul Pengaduan
+
+
+
+
+
+ Lokasi
+
+
+ fwef
+
+
+
+
+
+
+
+
+
+ Kategori
+
+
+ fwef
+
+
+
+
+
+ Gambar
+
+
+ Lihat Gambar
+
+
+
+
+
+
+
+
+
+ Detail
+
+
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit.
+ Illum, corporis iusto. Suscipit veritatis quas, non nobis
+ fuga, laudantium accusantium tempora sint aliquid architecto
+ totam esse eum excepturi nostrum fugiat ut.
+
+
+
+
+
+ Keterangan
+
+
+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. At
+ fugiat eligendi nesciunt dolore? Maiores a cumque vitae
+ suscipit incidunt quos beatae modi, vel, id ullam quae
+ voluptas, deserunt quas placeat.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
}
function DetailDataHistori() {
- const elements = [
- { position: 6, mass: 12.011, symbol: 'C', name: 'Carbon' },
- { position: 7, mass: 14.007, symbol: 'N', name: 'Nitrogen' },
- { position: 39, mass: 88.906, symbol: 'Y', name: 'Yttrium' },
- { position: 56, mass: 137.33, symbol: 'Ba', name: 'Barium' },
- { position: 58, mass: 140.12, symbol: 'Ce', name: 'Cerium' },
- ];
+ const elements = [
+ { position: 6, mass: 12.011, symbol: "C", name: "Carbon" },
+ { position: 7, mass: 14.007, symbol: "N", name: "Nitrogen" },
+ { position: 39, mass: 88.906, symbol: "Y", name: "Yttrium" },
+ { position: 56, mass: 137.33, symbol: "Ba", name: "Barium" },
+ { position: 58, mass: 140.12, symbol: "Ce", name: "Cerium" },
+ ];
- const rows = elements.map((element) => (
-
- {element.position}
- {element.name}
- {element.symbol}
- {element.mass}
-
- ));
- return (
-
-
-
-
- Histori Pengaduan
-
-
-
-
-
-
- Tanggal
- Deskripsi
- Status
- User
-
-
- {rows}
-
-
-
-
- )
+ const rows = elements.map((element) => (
+
+ {element.position}
+ {element.name}
+ {element.symbol}
+ {element.mass}
+
+ ));
+ return (
+
+
+
+
+ Histori Pengaduan
+
+
+
+
+
+
+ Tanggal
+ Deskripsi
+ Status
+ User
+
+
+ {rows}
+
+
+
+ );
}
function DetailUserPengaduan() {
- const [page, setPage] = useState(1);
- const [value, setValue] = useState("");
- const { data, mutate, isLoading } = useSwr("/", () =>
- apiFetch.api.pengaduan.list.get({
- query: {
- status,
- search: value,
- take: "",
- page: "",
- },
- }),
- );
+ const [page, setPage] = useState(1);
+ const [value, setValue] = useState("");
+ const { data, mutate, isLoading } = useSwr("/", () =>
+ apiFetch.api.pengaduan.list.get({
+ query: {
+ status,
+ search: value,
+ take: "",
+ page: "",
+ },
+ }),
+ );
- useShallowEffect(() => {
- mutate();
- }, [status, value]);
+ useShallowEffect(() => {
+ mutate();
+ }, [status, value]);
- const list = data?.data || [];
+ const list = data?.data || [];
- return (
-
-
-
-
-
- Warga
-
-
-
-
-
-
-
-
-
- Nama
-
-
- Amalia Dwi Yustiani
-
-
-
-
-
- Telepon
-
-
- 08123456789
-
-
-
-
-
- Jumlah Pengaduan
-
-
- 10
-
-
-
-
-
- Jumlah Pelayanan Surat
-
-
- 10
-
-
-
-
- );
+ return (
+
+
+
+
+
+ Warga
+
+
+
+
+
+
+
+
+ Nama
+
+
+ Amalia Dwi Yustiani
+
+
+
+
+
+ Telepon
+
+
+ 08123456789
+
+
+
+
+
+ Jumlah Pengaduan
+
+
+ 10
+
+
+
+
+
+ Jumlah Pelayanan Surat
+
+
+ 10
+
+
+
+
+
+ );
}
diff --git a/src/pages/scr/dashboard/pengaduan/list_page.tsx b/src/pages/scr/dashboard/pengaduan/list_page.tsx
index a3e94f3..a39ed65 100644
--- a/src/pages/scr/dashboard/pengaduan/list_page.tsx
+++ b/src/pages/scr/dashboard/pengaduan/list_page.tsx
@@ -198,7 +198,9 @@ function ListPengaduan({ status }: { status: StatusKey }) {
borderColor: "rgba(100,100,100,0.2)",
boxShadow: "0 0 20px rgba(0,255,200,0.08)",
}}
- onClick={() => navigate(`/scr/dashboard/pengaduan/detail?id=${v.id}`)}
+ onClick={() =>
+ navigate(`/scr/dashboard/pengaduan/detail?id=${v.id}`)
+ }
>