add menu rekomendasi Delegasi

add menu perpanjangan sanksi.js
fix search di pemantauan dan pelaporan.js
menambahkan jumlah pt hasil search, posisi di search result
update versi 1.99 - 1.83

actions/auth.js

@@ -36,7 +36,7 @@ export const getUser = async () => {
 
 export const logout = async () => {
 	try {
-		const response = await axiosAPI.delete("/logout");
+		const response = await axiosAPI.delete("/auth/logout");
 		return response.data;
 	} catch (error) {
 		if (error.response) return error.response.data;

actions/graph.js

@@ -33,7 +33,6 @@ export const getGraph = async (token, query = {}) => {
 				parseURL.push(`tahun=${tahun}`);
 			}
 
-
 			url += parseURL.join("&");
 		}
 
@@ -48,13 +47,27 @@ export const getGraph = async (token, query = {}) => {
 export const getExcel = (token, filename, query = {}) => {
 	let url = API_URL + "/graph/" + token + "/" + filename + ".xlsx";
 	if (query != null) {
-		const { tahun } = query;
+		const { tahun, penjadwalan, pelaporan, pemeriksaan, delegasi, sanksi } = query;
 		url += "?";
 		const parseURL = [];
 		if (tahun) {
 			parseURL.push(`tahun=${tahun}`);
 		}
-
+		if (delegasi) {
+			parseURL.push(`delegasi=true`);
+		}
+		if (pelaporan) {
+			parseURL.push(`pelaporan=true`);
+		}
+		if (penjadwalan) {
+			parseURL.push(`penjadwalan=true`);
+		}
+		if (pemeriksaan) {
+			parseURL.push(`pemeriksaan=true`);
+		}
+		if (sanksi) {
+			parseURL.push(`sanksi=true`);
+		}
 		url += parseURL.join("&");
 	}
 
@@ -69,5 +82,24 @@ export const getlaporanselesai = async (token) => {
 		console.log("error", error);
 		return false;
 	}
-}
+};
+export const getjumlahStatusLaporan = async (token, query = {}) => {
+	try {
+		let url = API_URL + "/graph/jumlahStatusLaporan";
+		if (query != null) {
+			const { pembina_id } = query;
+			url += "?";
+			const parseURL = [];
+			if (pembina_id) {
+				parseURL.push(`pembina_id=${pembina_id}`);
+			}
 
+			url += parseURL.join("&");
+		}
+		const res = await axiosAPI.get(url, { headers: { Authorization: token } });
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};

actions/log.js

@@ -3,7 +3,7 @@ import axios2 from "axios";
 
 export const getLog = async (token, laporan_id) => {
 	try {
-		let url = `/pemantauan/${laporan_id}`;
+		let url = `/pemantauan/${laporan_id}?all=true`;
 		const res = await axios.get(url, {
 			headers: {
 				Authorization: token,

actions/pelaporan.js

@@ -6,7 +6,7 @@ export const getPelaporan = async (token, query = {}) => {
 	try {
 		let url = "/laporan";
 		if (query != null) {
-			const { jadwal, evaluasi, pt_id, delegasi, aktif, sanksi } = query;
+			const { jadwal, evaluasi, pt_id, delegasi, aktif, sanksi, all } = query;
 			url += "?";
 			const parseURL = [];
 			if (jadwal) {
@@ -15,9 +15,14 @@ export const getPelaporan = async (token, query = {}) => {
 				parseURL.push(`evaluasi=true`);
 			} else if (sanksi) {
 				parseURL.push(`sanksi=true`);
-			} else if (delegasi) {
+			}
+			if (all) {
+				parseURL.push(`all=true`);
+			}
+			if (delegasi) {
 				parseURL.push(`delegasi=true`);
 			}
+
 			if (pt_id) {
 				parseURL.push(`pt_id=${pt_id}`);
 			}
@@ -40,9 +45,12 @@ export const getOneLaporan = async (token, id, query = {}) => {
 	try {
 		let url = `/laporan/${id}`;
 		if (query != null) {
-			const { aktif } = query;
+			const { aktif, all } = query;
 			url += "?";
 			const parseURL = [];
+			if (all) {
+				parseURL.push(`all=true`);
+			}
 			if (aktif === false) {
 				parseURL.push(`aktif=false`);
 			}
@@ -124,6 +132,50 @@ export const jumlahLaporan = async (token) => {
 		return false;
 	}
 };
+export const getlaporanByPembina = async (token, idPembina, query = {}) => {
+	try {
+		let url = `/laporan/byPembina/${idPembina}`;
+		if (query != null) {
+			const { idPembina, penjadwalan, pemeriksaan, sanksi, keberatan, banding, perbaikan, cabutSanksi, aktif } = query;
+			url += "?";
+			const parseURL = [];
+			if (idPembina) {
+				parseURL.push(`idPembina=${idPembina}`);
+			};
+			if (penjadwalan) {
+				parseURL.push(`penjadwalan=true`);
+			};
+			if (pemeriksaan) {
+				parseURL.push(`pemeriksaan=true`);
+			};
+			if (sanksi) {
+				parseURL.push(`sanksi=true`);
+			};
+			if (keberatan) {
+				parseURL.push(`keberatan=true`);
+			};
+			if (banding) {
+				parseURL.push(`banding=true`);
+			};
+			if (perbaikan) {
+				parseURL.push(`perbaikan=true`);
+			};
+			if (cabutSanksi) {
+				parseURL.push(`cabutSanksi=true`);
+			};
+			if (aktif === false) {
+				parseURL.push(`aktif=false`);
+			}
+
+			url += parseURL.join("&");
+		}
+		const res = await axiosAPI.get(url, { headers: { Authorization: token } });
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};
 
 // export const activeLaporan = async ({ number, ptId }) => {
 // 	try {

actions/sanksi.js

@@ -1,4 +1,5 @@
 import axiosAPI from "../config/axios";
+import axios from "../config/axios";
 import { createLog } from "./log";
 
 export const createSanksi = async (token, id, data) => {
@@ -11,7 +12,7 @@ export const getSanksi = async (token, query = {}) => {
 	try {
 		let url = "/sanksi";
 		if (query != {}) {
-			const { keberatan, jawaban, banding, cabutSanksi, perbaikan, aktif } = query;
+			const { keberatan, jawaban, banding, cabutSanksi, perbaikan, aktif, delegasi } = query;
 			url += "?";
 			const parseURL = [];
 			if (keberatan) parseURL.push(`keberatan=true`);
@@ -19,6 +20,7 @@ export const getSanksi = async (token, query = {}) => {
 			if (cabutSanksi) parseURL.push(`cabutSanksi=true`);
 			if (perbaikan) parseURL.push(`perbaikan=true`);
 			if (jawaban) parseURL.push(`jawaban=true`);
+			if (delegasi) parseURL.push(`delegasi=true`);
 			if (aktif === false) parseURL.push(`aktif=false`);
 			url += parseURL.join("&");
 		}
@@ -35,11 +37,12 @@ export const getOneSanksi = async (token, id, query = {}) => {
 	try {
 		let url = `/sanksi/${id}`;
 		if (query != {}) {
-			const { banding, aktif } = query;
+			const { banding, aktif, all } = query;
 			url += "?";
 			const parseURL = [];
 			if (banding) parseURL.push(`banding=true`);
 			if (aktif === false) parseURL.push(`aktif=false`);
+			if (all) { parseURL.push(`all=true`); }
 			url += parseURL.join("&");
 		}
 		const res = await axiosAPI.get(url, { headers: { Authorization: token } });
@@ -49,3 +52,20 @@ export const getOneSanksi = async (token, id, query = {}) => {
 		return false;
 	}
 };
+
+export const addRekomendasiDelegasi = async (token, id, data) => {
+	try {
+		const res = await axiosAPI.post(`/rekomendasi/add/${id}`, data, { headers: { Authorization: token } });
+		await createLog(token, { aktivitas: `Berhasil melakukan Rekomendasi Delegasi, id: ${id}` });
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		await createLog(token, { aktivitas: `Gagal melakukan Rekomendasi Delegasi, id: ${id}` });
+		return false;
+	}
+};
+export const editTmt = async (token, id, data) => {
+	const res = await axios.put(`sanksi/tmt/update/${id}`, data, { headers: { Authorization: token } });
+	await createLog(token, { aktivitas: `Berhasil perpanjangan sanksi, id: ${id}` });
+	return res.data;
+};

components/Delegasi/DetailLaporan.js

@@ -0,0 +1,162 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import { Col, FormGroup } from "reactstrap";
+import { useSelector } from "react-redux";
+
+function DetailLaporan({ data, noTitle = false, noStatus = false }) {
+    const user = useSelector((state) => state.user);
+    return (
+        <>
+            {(!data.user.isPrivate || user?.role.id === 2020) && (
+                <>
+                    {noTitle ? (
+                        ""
+                    ) : (
+                        <div className="header-1">
+                            <h2 className="card-title-1">Identitas Pelapor - {data.user.isPublic ? "Umum" : "Internal"}</h2>
+                        </div>
+                    )}
+                    {data.user.nama && (
+                        <FormGroup row>
+                            <Col md="4">Nama Pelapor:</Col>
+                            <Col md="8">
+                                <strong>{data.user.nama}</strong>
+                            </Col>
+                        </FormGroup>
+                    )}
+                    <FormGroup row>
+                        <Col md="4">Nomor yang dapat dihubungi:</Col>
+                        <Col md="8">
+                            <strong>
+                                {data.user.no_hp} {data.user.verified && "(Terverifikasi)"}
+                            </strong>
+                        </Col>
+                    </FormGroup>
+                    {data.user.email && (
+                        <FormGroup row>
+                            <Col md="4">Email:</Col>
+                            <Col md="8">
+                                <strong>{data.user.email}</strong>
+                            </Col>
+                        </FormGroup>
+                    )}
+
+                    {data.user.isPublic && (
+                        <>
+                            {data.user.alamat && (
+                                <FormGroup row>
+                                    <Col md="4">Alamat:</Col>
+                                    <Col md="8">
+                                        <strong>{data.user.alamat}</strong>
+                                    </Col>
+                                </FormGroup>
+                            )}
+                            {data.user.foto && (
+                                <FormGroup row>
+                                    <Col md="4">Foto Kartu Identitas:</Col>
+                                    <Col md="8">
+                                        <img src={data.user.foto.path} height={200} alt="Foto Identitas" />
+                                    </Col>
+                                </FormGroup>
+                            )}
+                        </>
+                    )}
+                    {data.user.isPrivate && (
+                        <FormGroup row>
+                            <Col md="4">Dirahasiakan</Col>
+                            <Col md="8">
+                                <strong>Ya</strong>
+                            </Col>
+                        </FormGroup>
+                    )}
+                </>
+            )}
+            {noTitle ? (
+                ""
+            ) : (
+                <div className="header-1">
+                    <h2 className="card-title-1">Detail Laporan</h2>
+                </div>
+            )}
+            <form className="form-horizontal">
+                <FormGroup row>
+                    <Col md="4">Nomor Laporan:</Col>
+                    <Col md="8">
+                        <strong>{data.no_laporan}</strong>
+                    </Col>
+                </FormGroup>
+                <FormGroup row>
+                    <Col md="4">Nama Perguruan Tinggi yang Dilaporkan:</Col>
+                    <Col md="8">
+                        <strong>{data.pt.nama}</strong>
+                    </Col>
+                </FormGroup>
+                <FormGroup row>
+                    <Col md="4">Jenis Pelanggaran:</Col>
+                    <Col md="8">
+                        <Scrollable height="125px" className="list-group">
+                            <ul>
+                                {data.pelanggaran.map((e) => (
+                                    <li>{e.pelanggaran}</li>
+                                ))}
+                            </ul>
+                        </Scrollable>
+                    </Col>
+                </FormGroup>
+                <FormGroup row>
+                    <Col md="4">Keterangan Laporan:</Col>
+                    <Col md="8">
+                        <Scrollable height="100px" className="list-group">
+                            <p>{data.keterangan}</p>
+                        </Scrollable>
+                    </Col>
+                </FormGroup>
+                <FormGroup row>
+                    <Col md="4">Dibuat Pada:</Col>
+                    <Col md="8">
+                        <strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+                    </Col>
+                </FormGroup>
+                {!noStatus && data.aktif ? (
+                    <FormGroup row>
+                        <Col md="4">Status:</Col>
+                        <Col md="8">
+                            <div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+                        </Col>
+                    </FormGroup>
+                ) : (
+                    ""
+                )}
+                {/* <FormGroup row>
+					<Col md="4">Prioritas:</Col>
+					<Col md="8">{data.level == 3 ? <div className="badge badge-success">Tinggi</div> : data.level == 2 ? <div className="badge badge-info">Sedang</div> : <div className="badge badge-warning">Rendah</div>}</Col>
+				</FormGroup> */}
+                <FormGroup row>
+                    <Col md="4">Dokumen Pendukung:</Col>
+                    <Col md="8">
+                        <Scrollable height="120px" className="list-group">
+                            <table className="table table-bordered bg-transparent">
+                                <tbody>
+                                    {data.dokumen.map((e, index) => (
+                                        <tr key={`files-${index}`}>
+                                            <td>
+                                                <em className="fa-lg far fa-file-code"></em>
+                                            </td>
+                                            <td>
+                                                <a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+                                                    {e.judul}
+                                                </a>
+                                            </td>
+                                        </tr>
+                                    ))}
+                                </tbody>
+                            </table>
+                        </Scrollable>
+                    </Col>
+                </FormGroup>
+            </form>
+        </>
+    );
+}
+
+export default DetailLaporan;

components/Delegasi/TableLaporan.js

@@ -0,0 +1,90 @@
+import Datatable from "@/components/Tables/Datatable";
+import { Button } from "reactstrap";
+import Link from "next/link";
+import moment from "moment";
+
+function TableLaporan({ listData, to, linkName, status = false, noBy = false }) {
+    return (
+        <div className="card b ">
+            <div className="card-body card-over">
+                {listData && (
+                    <Datatable options={{ responsive: false, ordering: true }}>
+                        <table className="table w-100" data-order='[[3, "desc"]]'>
+                            <thead>
+                                <tr>
+                                    <th>No.Laporan</th>
+                                    <th>Deskripsi Laporan</th>
+                                    {status && <th>Status</th>}
+                                    {!noBy && <th>Dibuat Oleh</th>}
+                                    {/* <th>Created</th> */}
+                                    <th></th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {listData.map((data) => {
+                                    return (
+                                        <tr key={data._id}>
+                                            <td>
+                                                {/* <td>{data.no_laporan}</td> */}
+                                                <div className="media align-items-center">
+                                                    <div className="media-body d-flex">
+                                                        <div>
+                                                            <h4>{data.no_laporan}</h4>
+                                                            <p>{moment(data.createdAt).format("DD-MM-YYYY")}</p>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </td>
+
+                                            <td>
+                                                <div className="table-desc">
+                                                    <div className="media align-items-center">
+                                                        <div className="media-body d-flex">
+                                                            <div>
+                                                                <h4 className="m-0">{data.pt.nama.length > 64 ? data.pt.nama.substring(0, 64) + "..." : data.pt.nama}</h4>
+                                                                {/* <h4 className="m-0">{data.pt.nama}</h4> */}
+                                                                {/* <p className="w-105">{data.keterangan.length > 150 ? data.keterangan.substring(0, 150) + "..." : data.keterangan}</p> */}
+                                                                <p className="w-105">{data.keterangan}</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </td>
+
+                                            {status ? (
+                                                <td>
+                                                    <div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+                                                </td>
+                                            ) : (
+                                                ""
+                                            )}
+                                            {!noBy && <td>{data.user.isPrivate ? "" : data.user.nama}</td>}
+                                            <td>
+                                                <div className="ml-auto">
+                                                    <Link
+                                                        href={{
+                                                            pathname: to,
+                                                            query: { id: data._id },
+                                                        }}
+                                                    >
+                                                        <Button className="btn-login" color>
+                                                            <span className="font-color-white">
+                                                                {linkName}
+                                                            </span>
+                                                        </Button>
+                                                    </Link>
+                                                </div>
+                                            </td>
+                                        </tr>
+                                    );
+                                })}
+                            </tbody>
+                        </table>
+                    </Datatable>
+                )}
+            </div>
+        </div>
+    );
+}
+
+export default TableLaporan;

components/DocPerbaikan/Riwayat.js

@@ -21,21 +21,21 @@ function Riwayat({ data }) {
 						<tbody>
 							{data.length
 								? data.map((value) => (
-										<tr>
-											<td>{moment(value.createAt).format("DD MMMM YYYY")}</td>
-											<td>{value.keterangan}</td>
-											<td>
-												{value.dokumen.map((e) => (
-													<>
-														<em className="fa-lg far fa-file-code"></em>
-														<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
-															{e.judul}
-														</a>
-													</>
-												))}
-											</td>
-										</tr>
-								  ))
+									<tr>
+										<td>{moment(value.createdAt).format("DD MMMM YYYY")}</td>
+										<td>{value.keterangan}</td>
+										<td>
+											{value.dokumen.map((e) => (
+												<>
+													<em className="fa-lg far fa-file-code"></em>
+													<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+														{e.judul}
+													</a>
+												</>
+											))}
+										</td>
+									</tr>
+								))
 								: ""}
 						</tbody>
 					</table>

components/Extras/calendar.view.js

@@ -3,7 +3,7 @@ import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Card, CardBody, CardHeader, CardTitle, Button, Row, Col, FormGroup, Input } from "reactstrap";
 import { getPelaporan, getOneLaporan, updateLaporan } from "@/actions/pelaporan";
 import { updateJadwal } from "@/actions/penjadwalan";
-import DetailLaporan from "@/components/Main/DetailLaporan";
+import DetailLaporan from "@/components/Penjadwalan/DetailLaporan";
 import Link from "next/link";
 import FullCalendar from "@fullcalendar/react";
 import dayGridPlugin from "@fullcalendar/daygrid";
@@ -20,6 +20,8 @@ import { ToastContainer, toast } from "react-toastify";
 import { Formik, Form, Field, ErrorMessage } from "formik";
 import * as Yup from "yup";
 import Datetime from "react-datetime";
+import 'moment/locale/id';
+moment.locale('id')
 
 const status = [
 	{ value: "Ditindaklanjuti DIKTI", label: "Ditindaklanjuti DIKTI", className: "State-ACT" },
@@ -309,6 +311,7 @@ class Calendar extends Component {
 																				{({ field, form }) => (
 																					<Datetime
 																						timeFormat={false}
+																						locale="en-gb"
 																						inputProps={{ className: "form-control" }}
 																						value={field.value}
 																						onChange={(e) => {
@@ -327,6 +330,7 @@ class Calendar extends Component {
 																				{({ field, form }) => (
 																					<Datetime
 																						timeFormat={false}
+																						locale="en-gb"
 																						inputProps={{ className: "form-control" }}
 																						value={field.value}
 																						onChange={(e) => {

components/Layout/Footer.js

@@ -7,7 +7,7 @@ class Footer extends Component {
         return (
             <footer className="footer-container">
                 <span>Sidali Dikti &copy; {year}</span>
-                <span className=' float-right'>Version 1.94 ~ 1.60</span>
+                <span className=' float-right'>Version 1.99 ~ 1.83</span>
             </footer>
         );
     }

components/Layout/Header.js

@@ -4,6 +4,7 @@ import PropTypes from "prop-types";
 import Link from "next/link";
 import { UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, ListGroup, ListGroupItem } from "reactstrap";
 import { createLog } from "@/actions/log";
+import { logout } from "@/actions/auth";
 import { connect } from "react-redux";
 import { bindActionCreators } from "redux";
 import * as actions from "../../store/actions/actions";
@@ -56,7 +57,7 @@ class Header extends Component {
 
 	handleLogout = async (e) => {
 		e.preventDefault();
-		// await logout();
+		await logout();
 		await createLog(this.props.token, { aktivitas: "Berhasil Logout" });
 		this.props.tokenNull();
 		this.props.userNull();

components/Layout/Menu.js

@@ -67,6 +67,43 @@ const Menu = [
 		icon: "icon-shield",
 		translate: "sidebar.nav.PENCABUTAN_SANKSI",
 	},
+
+	///////------OPERASIONAL SANKSI-------\\\\\\
+	{
+		heading: "Operasional Sanksi",
+		translate: "sidebar.heading.OPERASIONAL_SANKSI",
+	},
+	{
+		name: "Rekomendasi Delegasi",
+		path: "/app/rekomendasi-delegasi",
+		icon: "icon-paper-plane",
+		translate: "sidebar.nav.REKOMENDASI_DELEGASI",
+	},
+	{
+		name: "Perpanjangan Sanksi",
+		path: "/app/perpanjangan-sanksi",
+		icon: "icon-pencil",
+		translate: "sidebar.nav.PERPANJANGAN_SANKSI",
+	},
+	{
+		name: "Perubahan Sanksi",
+		path: "/app/perubahan-sanksi",
+		icon: "fas fa-dna",
+		translate: "sidebar.nav.PERUBAHAN_SANKSI",
+		submenu: [
+			{
+				name: "a. Naik Sanksi",
+				path: "/app/perubahan-sanksi/naik-sanksi",
+			},
+			{
+				name: "b. Turun Sanksi",
+				path: "/app/perubahan-sanksi/turun-sanksi",
+			},
+		],
+	},
+
+	///////------ANALYTICS REPORT------\\\\\\\\\\\
+
 	{
 		heading: "Analytics Report",
 		translate: "sidebar.heading.ANALYTICS_REPORT",
@@ -83,6 +120,8 @@ const Menu = [
 		icon: "far fa-check-circle",
 		translate: "sidebar.nav.Pelaporan-tuntas",
 	},
+
+	/////////------BANTUAN-------\\\\\\\\\\\
 	{
 		heading: "Bantuan",
 		translate: "sidebar.heading.BANTUAN",

components/Layout/MenuLLDIKTI.js

@@ -55,6 +55,42 @@ const Menu = [
 		icon: "icon-shield",
 		translate: "sidebar.nav.PENCABUTAN_SANKSI",
 	},
+	///////------OPERASIONAL SANKSI-------\\\\\\
+	{
+		heading: "Operasional Sanksi",
+		translate: "sidebar.heading.OPERASIONAL_SANKSI",
+	},
+	{
+		name: "Rekomendasi Delegasi",
+		path: "/app/rekomendasi-delegasi",
+		icon: "icon-paper-plane",
+		translate: "sidebar.nav.REKOMENDASI_DELEGASI",
+	},
+	{
+		name: "Perpanjangan Sanksi",
+		path: "/app/perpanjangan-sanksi",
+		icon: "icon-pencil",
+		translate: "sidebar.nav.PERPANJANGAN_SANKSI",
+	},
+	{
+		name: "Perubahan Sanksi",
+		path: "/app/perubahan-sanksi",
+		icon: "fas fa-dna",
+		translate: "sidebar.nav.PERUBAHAN_SANKSI",
+		submenu: [
+			{
+				name: "a. Naik Sanksi",
+				path: "/app/perubahan-sanksi/naik-sanksi",
+			},
+			{
+				name: "b. Turun Sanksi",
+				path: "/app/perubahan-sanksi/turun-sanksi",
+			},
+		],
+	},
+
+	///////------ANALYTICS REPORT------\\\\\\\\\\\
+
 	{
 		heading: "Analytics Report",
 		translate: "sidebar.heading.ANALYTICS_REPORT",
@@ -65,6 +101,9 @@ const Menu = [
 		icon: "far fa-check-circle",
 		translate: "sidebar.nav.Pelaporan-tuntas",
 	},
+
+	/////////------BANTUAN-------\\\\\\\\\\\
+
 	{
 		heading: "Bantuan",
 		translate: "sidebar.heading.BANTUAN",

components/Main/DetailLaporan.js

@@ -125,7 +125,12 @@ function DetailLaporan({ data, noTitle = false, noStatus = false }) {
 						</Col>
 					</FormGroup>
 				) : (
-					""
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-danger">Ditutup</div>
+						</Col>
+					</FormGroup>
 				)}
 				{/* <FormGroup row>
 					<Col md="4">Prioritas:</Col>

components/Pemeriksaan/DetailLaporan.js

@@ -0,0 +1,167 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import { Col, FormGroup } from "reactstrap";
+import { useSelector } from "react-redux";
+
+function DetailLaporan({ data, noTitle = false, noStatus = false }) {
+	const user = useSelector((state) => state.user);
+	return (
+		<>
+			{(!data.user.isPrivate || user?.role.id === 2020) && (
+				<>
+					{noTitle ? (
+						""
+					) : (
+						<div className="header-1">
+							<h2 className="card-title-1">Identitas Pelapor - {data.user.isPublic ? "Umum" : "Internal"}</h2>
+						</div>
+					)}
+					{data.user.nama && (
+						<FormGroup row>
+							<Col md="4">Nama Pelapor:</Col>
+							<Col md="8">
+								<strong>{data.user.nama}</strong>
+							</Col>
+						</FormGroup>
+					)}
+					<FormGroup row>
+						<Col md="4">Nomor yang dapat dihubungi:</Col>
+						<Col md="8">
+							<strong>
+								{data.user.no_hp} {data.user.verified && "(Terverifikasi)"}
+							</strong>
+						</Col>
+					</FormGroup>
+					{data.user.email && (
+						<FormGroup row>
+							<Col md="4">Email:</Col>
+							<Col md="8">
+								<strong>{data.user.email}</strong>
+							</Col>
+						</FormGroup>
+					)}
+
+					{data.user.isPublic && (
+						<>
+							{data.user.alamat && (
+								<FormGroup row>
+									<Col md="4">Alamat:</Col>
+									<Col md="8">
+										<strong>{data.user.alamat}</strong>
+									</Col>
+								</FormGroup>
+							)}
+							{data.user.foto && (
+								<FormGroup row>
+									<Col md="4">Foto Kartu Identitas:</Col>
+									<Col md="8">
+										<img src={data.user.foto.path} height={200} alt="Foto Identitas" />
+									</Col>
+								</FormGroup>
+							)}
+						</>
+					)}
+					{data.user.isPrivate && (
+						<FormGroup row>
+							<Col md="4">Dirahasiakan</Col>
+							<Col md="8">
+								<strong>Ya</strong>
+							</Col>
+						</FormGroup>
+					)}
+				</>
+			)}
+			{noTitle ? (
+				""
+			) : (
+				<div className="header-1">
+					<h2 className="card-title-1">Detail Laporan</h2>
+				</div>
+			)}
+			<form className="form-horizontal">
+				<FormGroup row>
+					<Col md="4">Nomor Laporan:</Col>
+					<Col md="8">
+						<strong>{data.no_laporan}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Nama Perguruan Tinggi yang Dilaporkan:</Col>
+					<Col md="8">
+						<strong>{data.pt.nama}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Jenis Pelanggaran:</Col>
+					<Col md="8">
+						<Scrollable height="125px" className="list-group">
+							<ul>
+								{data.pelanggaran.map((e) => (
+									<li>{e.pelanggaran}</li>
+								))}
+							</ul>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Keterangan Laporan:</Col>
+					<Col md="8">
+						<Scrollable height="100px" className="list-group">
+							<p>{data.keterangan}</p>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Dibuat Pada:</Col>
+					<Col md="8">
+						<strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+					</Col>
+				</FormGroup>
+				{!noStatus && data.aktif ? (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+						</Col>
+					</FormGroup>
+				) : (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-danger">Ditutup</div>
+						</Col>
+					</FormGroup>
+				)}
+				{/* <FormGroup row>
+					<Col md="4">Prioritas:</Col>
+					<Col md="8">{data.level == 3 ? <div className="badge badge-success">Tinggi</div> : data.level == 2 ? <div className="badge badge-info">Sedang</div> : <div className="badge badge-warning">Rendah</div>}</Col>
+				</FormGroup> */}
+				<FormGroup row>
+					<Col md="4">Dokumen Pendukung:</Col>
+					<Col md="8">
+						<Scrollable height="120px" className="list-group">
+							<table className="table table-bordered bg-transparent">
+								<tbody>
+									{data.dokumen.map((e, index) => (
+										<tr key={`files-${index}`}>
+											<td>
+												<em className="fa-lg far fa-file-code"></em>
+											</td>
+											<td>
+												<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+													{e.judul}
+												</a>
+											</td>
+										</tr>
+									))}
+								</tbody>
+							</table>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+			</form>
+		</>
+	);
+}
+
+export default DetailLaporan;

components/Pemeriksaan/InputEvaluasi.js

@@ -257,7 +257,7 @@ class InputEvaluasi extends Component {
 								</p>
 							</div>
 						</FormGroup>
-						{this.props.user?.role.id === 2021 && this.props.data.role_asal === "dikti" ? (
+						{this.props.user?.role.id === 2021 ? (
 							<FormGroup row>
 								<label className="col-md-2 col-form-label">Delegasi ke dikti</label>
 								<div className="col-md-10 mt-2">

components/PencabutanSanksi/Riwayat.js

@@ -27,7 +27,7 @@ function Riwayat({ data }) {
 									<td>{data.status}</td>
 									<td>{data.keterangan}</td>
 									<td>
-										{data.dokumen.map((e) => (
+										{data.dokumen?.map((e) => (
 											<>
 												<em className="fa-lg far fa-file-code"></em>
 												<a className="text-muted" href={e.path} target="_blank" download={e.judul}>

components/Penjadwalan/DetailLaporan.js

@@ -1,124 +1,167 @@
-import React, { Component } from "react";
-import Select from "react-select";
 import Scrollable from "@/components/Common/Scrollable";
-import { addStatus } from "@/actions/pelaporan";
-import { Card, CardBody, CardHeader, CardTitle } from "reactstrap";
+import moment from "moment";
+import { Col, FormGroup } from "reactstrap";
+import { useSelector } from "react-redux";
 
-const status = [
-	{ value: "Ditindaklanjuti Dikti Ristek", label: "Ditindaklanjuti Dikti Ristek", className: "State-ACT" },
-	{ value: "Delegasi ke LLDIKTI", label: "Delegasi ke LLDIKTI", className: "State-ACT" },
-	{ value: "Ditutup", label: "Ditutup", className: "State-ACT" },
-];
-const selectInstanceId = 1;
-export class DetailLaporan extends Component {
-	constructor(props) {
-		super(props);
-		this.state = {
-			selectedOption: null,
-		};
-	}
+function DetailLaporan({ data, noTitle = false, noStatus = false }) {
+	const user = useSelector((state) => state.user);
+	return (
+		<>
+			{(!data.user.isPrivate || user?.role.id === 2020) && (
+				<>
+					{noTitle ? (
+						""
+					) : (
+						<div className="header-1">
+							<h2 className="card-title-1">Identitas Pelapor - {data.user.isPublic ? "Umum" : "Internal"}</h2>
+						</div>
+					)}
+					{data.user.nama && (
+						<FormGroup row>
+							<Col md="4">Nama Pelapor:</Col>
+							<Col md="8">
+								<strong>{data.user.nama}</strong>
+							</Col>
+						</FormGroup>
+					)}
+					<FormGroup row>
+						<Col md="4">Nomor yang dapat dihubungi:</Col>
+						<Col md="8">
+							<strong>
+								{data.user.no_hp} {data.user.verified && "(Terverifikasi)"}
+							</strong>
+						</Col>
+					</FormGroup>
+					{data.user.email && (
+						<FormGroup row>
+							<Col md="4">Email:</Col>
+							<Col md="8">
+								<strong>{data.user.email}</strong>
+							</Col>
+						</FormGroup>
+					)}
 
-	componentDidMount = () => {
-		const { data } = this.props;
-		if (data.status) {
-			const selectedOption = status.filter((e) => e.value === data.status)[0];
-			this.setState({ selectedOption });
-		} else {
-			this.setState({ selectedOption: { value: "Ditindaklanjuti", label: "Ditindaklanjuti Dikti Ristek", className: "State-ACT" } });
-			// const tes = await addStatus({ number, ptId }, { status: data.status || "ditindaklanjuti" });
-		}
-	};
-
-	handleChangeSelect = async (selectedOption) => {
-		const { ptId, number } = this.props.query;
-		this.props.handleChangeSelect(selectedOption);
-		this.setState({ selectedOption });
-		await addStatus({ number, ptId }, { status: selectedOption.value });
-	};
-
-	render() {
-		const { data } = this.props;
-		return (
-			<Card className="card b">
-				<CardHeader>
-					<CardTitle tag="h4">Detail Laporan</CardTitle>
-				</CardHeader>
-				<CardBody>
-					<table className="table">
-						<tbody>
-							<tr>
-								<td>
-									<strong>Status</strong>
-								</td>
-								<td>
-									<Select instanceId={selectInstanceId + 1} value={this.state.selectedOption} onChange={this.handleChangeSelect} options={status} required />
-								</td>
-							</tr>
-							<tr>
-								<td>
-									<strong>Nomor Laporan</strong>
-								</td>
-								<td>{data._number}</td>
-							</tr>
-							<tr>
-								<td>
-									<strong>Perguruan Tinggi</strong>
-								</td>
-								<td>{data.pt.nama}</td>
-							</tr>
-							<tr>
-								<td>
-									<strong>Jenis Pelanggaran</strong>
-								</td>
-								<td>
-									<Scrollable height="75px" className="list-group">
-										<ul>{data.pelanggaran ? data.pelanggaran.map((e) => <li>{e.pelanggaran}</li>) : ""}</ul>
-									</Scrollable>
-								</td>
-							</tr>
-							<tr>
-								<td>
-									<strong>Keterangan Laporan</strong>
-								</td>
-								<td>
-									<Scrollable height="100px" className="list-group">
-										<p>{data.description}</p>
-									</Scrollable>
-								</td>
-							</tr>
-							<tr>
-								<td>
-									<strong>File Pendukung</strong>
-								</td>
-								<td>
-									<Scrollable height="120px" className="list-group">
-										<table className="table table-bordered bg-transparent">
-											<tbody>
-												{data.files
-													? data.files.map((e) => (
-														<tr>
-															<td>
-																<em className="fa-lg far fa-file-code"></em>
-															</td>
-															<td>
-																<a className="text-muted" href={`data:${e.type};base64, ${Buffer.from(e.data).toString("base64")}`} download={e.name}>
-																	{e.name}
-																</a>
-															</td>
-														</tr>
-													))
-													: ""}
-											</tbody>
-										</table>
-									</Scrollable>
-								</td>
-							</tr>
-						</tbody>
-					</table>
-				</CardBody>
-			</Card>
-		);
-	}
+					{data.user.isPublic && (
+						<>
+							{data.user.alamat && (
+								<FormGroup row>
+									<Col md="4">Alamat:</Col>
+									<Col md="8">
+										<strong>{data.user.alamat}</strong>
+									</Col>
+								</FormGroup>
+							)}
+							{data.user.foto && (
+								<FormGroup row>
+									<Col md="4">Foto Kartu Identitas:</Col>
+									<Col md="8">
+										<img src={data.user.foto.path} height={200} alt="Foto Identitas" />
+									</Col>
+								</FormGroup>
+							)}
+						</>
+					)}
+					{data.user.isPrivate && (
+						<FormGroup row>
+							<Col md="4">Dirahasiakan</Col>
+							<Col md="8">
+								<strong>Ya</strong>
+							</Col>
+						</FormGroup>
+					)}
+				</>
+			)}
+			{noTitle ? (
+				""
+			) : (
+				<div className="header-1">
+					<h2 className="card-title-1">Detail Laporan</h2>
+				</div>
+			)}
+			<form className="form-horizontal">
+				<FormGroup row>
+					<Col md="4">Nomor Laporan:</Col>
+					<Col md="8">
+						<strong>{data.no_laporan}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Nama Perguruan Tinggi yang Dilaporkan:</Col>
+					<Col md="8">
+						<strong>{data.pt.nama}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Jenis Pelanggaran:</Col>
+					<Col md="8">
+						<Scrollable height="125px" className="list-group">
+							<ul>
+								{data.pelanggaran.map((e) => (
+									<li>{e.pelanggaran}</li>
+								))}
+							</ul>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Keterangan Laporan:</Col>
+					<Col md="8">
+						<Scrollable height="100px" className="list-group">
+							<p>{data.keterangan}</p>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Dibuat Pada:</Col>
+					<Col md="8">
+						<strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+					</Col>
+				</FormGroup>
+				{noStatus && data.aktif ? (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+						</Col>
+					</FormGroup>
+				) : (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-danger">Ditutup</div>
+						</Col>
+					</FormGroup>
+				)}
+				{/* <FormGroup row>
+					<Col md="4">Prioritas:</Col>
+					<Col md="8">{data.level == 3 ? <div className="badge badge-success">Tinggi</div> : data.level == 2 ? <div className="badge badge-info">Sedang</div> : <div className="badge badge-warning">Rendah</div>}</Col>
+				</FormGroup> */}
+				<FormGroup row>
+					<Col md="4">Dokumen Pendukung:</Col>
+					<Col md="8">
+						<Scrollable height="120px" className="list-group">
+							<table className="table table-bordered bg-transparent">
+								<tbody>
+									{data.dokumen.map((e, index) => (
+										<tr key={`files-${index}`}>
+											<td>
+												<em className="fa-lg far fa-file-code"></em>
+											</td>
+											<td>
+												<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+													{e.judul}
+												</a>
+											</td>
+										</tr>
+									))}
+								</tbody>
+							</table>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+			</form>
+		</>
+	);
 }
 
 export default DetailLaporan;

components/PerpanjanganSanksi/DetailSanksi.js

@@ -0,0 +1,132 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+import { CardBody, Col, FormGroup, Table, Card } from "reactstrap";
+import { API_URL } from "@/env";
+
+function DetailSanksi({ data, noTitle = false }) {
+	return (
+		<Card className="card-default">
+			<CardBody>
+				{noTitle ? "" : <p className="lead bb">Detail Sanksi</p>}
+				<form className="form-horizontal">
+					<FormGroup row>
+						<Col md="4">Nomor Sanksi:</Col>
+						<Col md="8">
+							<strong>{data.no_sanksi}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Nama Perguruan Tinggi:</Col>
+						<Col md="8">
+							<strong>{data.laporan.pt.nama}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Keterangan:</Col>
+						<Col md="8">
+							<Scrollable height="100px" className="list-group">
+								<p>{data.keterangan}</p>
+							</Scrollable>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Dibuat Pada:</Col>
+						<Col md="8">
+							<strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md={12}>
+							<div className="card b">
+								<div className="card-body bb">
+									<Table responsive>
+										<thead>
+											<tr>
+												<th>Jenis Pelanggaran</th>
+												<th>Sanksi</th>
+											</tr>
+										</thead>
+										<tbody>
+											{data.pelanggaran.map((jp, index) => (
+												<tr key={jp._id}>
+													<td width={50}>
+														<div className="media align-items-center">
+															<div className="media-body d-flex">
+																<div>
+																	<p>{jp.pelanggaran}</p>
+																	<p>TMT : {jp.tmt_bulan} Bulan</p>
+																	<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p>
+																</div>
+															</div>
+														</div>
+													</td>
+													<td width={50}>
+														<div className="media align-items-center">
+															<div className="media-body d-flex">
+																<div>
+																	<p>{jp.sanksi}</p>
+																	<p>Keterangan : {jp.keterangan_sanksi}</p>
+																</div>
+															</div>
+														</div>
+													</td>
+												</tr>
+											))}
+										</tbody>
+									</Table>
+								</div>
+							</div>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Nomor Surat:</Col>
+						<Col md="8">
+							<strong>{data.no_sanksi}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">TMT Berlaku:</Col>
+						<Col md="8">
+							{/* <strong>{moment(data.masa_berlaku.from_date).format("D MMMM YYYY")} - {moment(data.masa_berlaku.to_date).format("D MMMM YYYY")} </strong> */}
+							{data.masa_berlaku?.to_date ? (<strong>{moment(data.masa_berlaku?.from_date).format("DD-MMMM-YYYY")} - {moment(data.masa_berlaku?.to_date).format("DD-MMMM-YYYY")}</strong>) : (<strong className="m-0">6 Bulan</strong>)}
+
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Nomor Surat:</Col>
+						<Col md="8">
+							<strong>{data.pelanggaran.map((e) => e.sanksi)}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Dokumen Sanksi:</Col>
+						<Col md="8">
+							<Scrollable height="120px" className="list-group">
+								<table className="table table-bordered bg-transparent">
+									<tbody>
+										{data.dokumen.map((e) => (
+											<tr>
+												<td>
+													<em className="fa-lg far fa-file-code"></em>
+												</td>
+												<td>
+													<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+														{e.judul}
+													</a>
+												</td>
+											</tr>
+										))}
+									</tbody>
+								</table>
+							</Scrollable>
+						</Col>
+					</FormGroup>
+				</form>
+			</CardBody>
+		</Card>
+	);
+}
+
+export default DetailSanksi;

components/PerpanjanganSanksi/InputTanggal.js

@@ -0,0 +1,299 @@
+import React, { Component } from "react";
+import { Row, Col, Card, CardBody, FormGroup, Input, Button, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, CardTitle } from "reactstrap";
+import { toast } from "react-toastify";
+import { Formik, Form, Field, ErrorMessage } from "formik";
+import * as Yup from "yup";
+import { connect } from "react-redux";
+import { getOneSanksi, editTmt } from "@/actions/sanksi";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { addDays, addMonths } from 'date-fns';
+import id from 'date-fns/locale/id';
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+import Router from "next/router";
+
+
+const selectInstanceId = 1;
+const checkIfFilesAreTooBig = (files) => {
+    let valid = true;
+    if (files) {
+        files.map((file) => {
+            if (file.size > 15 * 1024 * 1024) {
+                valid = false;
+            }
+        });
+    }
+    return valid;
+};
+
+const checkIfFilesAreCorrectType = (files) => {
+    let valid = true;
+    if (files) {
+        files.map((file) => {
+            if (!["image/jpeg", "image/png"].includes(file.type)) {
+                valid = false;
+            }
+        });
+    }
+    return valid;
+};
+
+const rekomendasiSchema = Yup.object().shape({
+    from_date: Yup.date().required("Wajib diisi"),
+    to_date: Yup.date().required("Wajib diisi"),
+    dokumen: Yup.array().required("Wajib diisi").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
+});
+
+let Dropzone = null;
+
+class DropzoneWrapper extends Component {
+    state = {
+        isClient: false,
+    };
+    componentDidMount = () => {
+        Dropzone = require("react-dropzone").default;
+        this.setState({ isClient: true });
+    };
+    render() {
+        return Dropzone ? <Dropzone {...this.props}>{this.props.children}</Dropzone> : null;
+    }
+}
+
+class InputTanggal extends Component {
+    constructor(props) {
+        super(props);
+        const tmt_awal = new Date();
+        this.state = {
+            dropdownOpen: false,
+            splitButtonOpen: false,
+            files: [],
+            sanksi: {},
+            data: {},
+            from_date: "",
+            to_date: "",
+            startDay: tmt_awal,
+            sanksi: {},
+        };
+    }
+
+    async componentDidMount() {
+        const { token, query } = this.props;
+        const { id } = query;
+        const sanksi = await getOneSanksi(token, id);
+        this.setState({ sanksi })
+        console.log(this.state.sanksi)
+    }
+
+
+    toggleSplit = () => {
+        this.setState({
+            splitButtonOpen: !this.state.splitButtonOpen,
+        });
+    };
+
+    toggleDropDown = () => {
+        this.setState({
+            dropdownOpen: !this.state.dropdownOpen,
+        });
+    };
+
+    onDrop = (files) => {
+        this.setState({
+            files: files.map((file) =>
+                Object.assign(file, {
+                    preview: URL.createObjectURL(file),
+                })
+            ),
+            stat: "Added " + files.length + " file(s)",
+        });
+    };
+
+    uploadFiles = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        this.setState({
+            stat: this.state.files.length ? "Dropzone ready to upload " + this.state.files.length + " file(s)" : "No files added.",
+        });
+    };
+
+    clearFiles = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        this.setState({
+            stat: this.state.files.length ? this.state.files.length + " file(s) cleared." : "No files to clear.",
+        });
+        this.setState({
+            files: [],
+        });
+    };
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    };
+
+
+    handelSimpan = async (data) => {
+        const { token, query } = this.props;
+        const { id } = query;
+        const formdata = new FormData();
+        formdata.append("from_date", this.state.from_date);
+        formdata.append("to_date", this.state.to_date);
+        this.state.files.forEach((e) => {
+            formdata.append("dokumen", e);
+        });
+        const toastid = toast.loading("Please wait...");
+        const added = await editTmt(token, id, formdata);
+        if (!added) {
+            toast.update(toastid, { render: "All is not good", type: "error", isLoading: false, autoClose: true, closeButton: true });
+        } else {
+            toast.update(toastid, { render: "All is good", type: "success", isLoading: false, autoClose: true, closeButton: true });
+            Router.push("/app/perpanjangan-sanksi");
+
+        }
+
+    };
+    render() {
+        const { files, sanksi } = this.state;
+
+        const thumbs = files.map((file, index) => (
+            <div md={3} key={index}>
+                <span className="text-left">{index + 1}.{file.name}</span>
+            </div>
+        ));
+        return (
+            <Card className="card-default">
+                <CardBody>
+                    <p className="lead bb">Perpanjangan Sanksi</p>
+                    <Formik
+                        initialValues={{
+                            dokumen: [],
+                            from_date: "",
+                            to_date: "",
+
+                        }}
+                        validationSchema={rekomendasiSchema}
+                        onSubmit={async (data) => {
+                            this.setState({ data });
+                            await this.handelSimpan();
+                        }}
+                    >
+                        {() => (
+                            <Form className="form-horizontal">
+                                <FormGroup row className="mt-3">
+                                    <label className="col-md-2 col-form-label">Tanggal Perpanjangan Sanksi :</label>
+                                    <div className="col-md-6">
+                                        <Row >
+                                            <Col>
+                                                <FormGroup>
+                                                    <Field name="from_date">
+                                                        {({ field, form }) => (
+                                                            <DatePicker
+                                                                selected={this.state.from_date}
+                                                                onChange={(from_date) => {
+                                                                    this.setState({ from_date })
+                                                                    form.setFieldValue(field.name, from_date);
+                                                                }}
+                                                                dateFormat="dd/MM/yyyy"
+                                                                maxDate={this.state.startDay}
+                                                                placeholderText="Dari Tanggal"
+                                                                locale={id}
+                                                                className="form-control bg-white"
+                                                            />
+                                                        )}
+                                                    </Field>
+                                                    <ErrorMessage name="from_date" component="div" className="form-text text-danger" />
+                                                </FormGroup>
+                                            </Col>
+                                            <Col>
+                                                <FormGroup>
+                                                    <Field name="to_date">
+                                                        {({ field, form }) => (
+                                                            <DatePicker
+                                                                selected={this.state.to_date}
+                                                                onChange={(to_date) => {
+                                                                    this.setState({ to_date })
+                                                                    form.setFieldValue(field.name, to_date);
+                                                                }}
+                                                                dateFormat="dd/MM/yyyy"
+                                                                minDate={this.state.from_date}
+                                                                maxDate={addMonths(new Date(this.state.from_date), 6)}
+                                                                placeholderText="Sampai tanggal"
+                                                                locale={id}
+                                                                className="form-control bg-white"
+                                                            />
+                                                        )}
+                                                    </Field>
+                                                    <ErrorMessage name="to_date" component="div" className="form-text text-danger" />
+                                                </FormGroup>
+                                            </Col>
+                                        </Row>
+                                    </div>
+                                </FormGroup>
+                                <FormGroup row className="mt-3">
+                                    <label className="col-md-2 col-form-label">Dokumen Perpanjangan Sanksi : <span className="text-danger">*</span></label>
+                                    <div className="col-md-10">
+                                        <Field name="dokumen">
+                                            {({ field, form }) => (
+                                                <DropzoneWrapper
+                                                    className=""
+                                                    onDrop={(e) => {
+                                                        this.onDrop(e);
+                                                        form.setFieldValue(field.name, e);
+                                                    }}
+                                                >
+                                                    {({ getRootProps, getInputProps, isDragActive }) => {
+                                                        return (
+                                                            <div {...getRootProps()} className={"dropzone card" + (isDragActive ? "dropzone-drag-active" : "")}>
+                                                                <input {...getInputProps()} />
+                                                                <div className="dropzone-previews flex">
+                                                                    <div className="dropzone-style-1">
+                                                                        <div className="center-ver-hor dropzone-previews flex">{this.state.files.length > 0 ? <Row><span className="text-left">{thumbs}</span></Row> :
+                                                                            <div className="text-center fa-2x icon-cloud-upload mr-2 ">
+                                                                                <h5 className="text-center dz-default dz-message">Upload dokumen rekomendasi delegasi</h5>
+                                                                            </div>
+                                                                        }
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                                <div className="d-flex align-items-center">
+                                                                    <small className="ml-auto">
+                                                                        <button
+                                                                            type="button"
+                                                                            className="btn btn-link"
+                                                                            onClick={(e) => {
+                                                                                this.clearFiles(e);
+                                                                                form.setFieldValue(field.name, []);
+                                                                            }}
+                                                                        >
+                                                                            Reset dokumen
+                                                                        </button>
+                                                                    </small>
+                                                                </div>
+                                                            </div>
+                                                        );
+                                                    }}
+                                                </DropzoneWrapper>
+                                            )}
+                                        </Field>
+                                    </div>
+                                </FormGroup>
+                                <FormGroup row>
+                                    <div className="col-xl-10">
+                                        <Button color className="color-3e3a8e btn-login" type="submit">
+                                            <span className="font-color-white">Kirim</span>
+                                        </Button>
+                                    </div>
+                                </FormGroup>
+                            </Form>
+                        )}
+                    </Formik>
+                </CardBody>
+            </Card>
+        );
+    }
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(InputTanggal);

components/PerpanjanganSanksi/TableLaporan.js

@@ -0,0 +1,88 @@
+import Datatable from "@/components/Tables/Datatable";
+import { Button } from "reactstrap";
+import Link from "next/link";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+
+function TableLaporan({ listData, to, linkName, status = false, noBy = false }) {
+	return (
+		<div className="card b ">
+			<div className="card-body card-over">
+				{listData && (
+					<Datatable options={{ responsive: false, ordering: true }}>
+						<table className="table w-100" data-order='[[3, "desc"]]'>
+							<thead>
+								<tr>
+									<th>No.Laporan</th>
+									<th>Deskripsi Laporan</th>
+									{<th>TMT Berlaku</th>}
+									{/* {!noBy && <th>Dibuat Oleh</th>} */}
+									{/* <th>Created</th> */}
+									<th>Aksi</th>
+								</tr>
+							</thead>
+							<tbody>
+								{listData.map((data) => {
+									return (
+										<tr key={data._id}>
+											<td>
+												{/* <td>{data.no_laporan}</td> */}
+												<div className="media align-items-center">
+													<div className="media-body d-flex">
+														<div>
+															<h4>{data.no_laporan}</h4>
+															<p>{moment(data.createdAt).format("DD-MMMM-YYYY")}</p>
+														</div>
+													</div>
+												</div>
+											</td>
+
+											<td>
+												<div className="table-desc">
+													<div className="media align-items-center">
+														<div className="media-body d-flex">
+															<div>
+																<h4 className="m-0">{data.pt.nama.length > 64 ? data.pt.nama.substring(0, 64) + "..." : data.pt.nama}</h4>
+																<p className="w-105">{data.keterangan}</p>
+															</div>
+														</div>
+													</div>
+												</div>
+											</td>
+
+
+											<td>
+												{data.sanksi.masa_berlaku?.to_date ? (<h4 className="m-0"> {moment(data.sanksi.masa_berlaku?.from_date).format("DD MMMM YYYY")} - {moment(data.sanksi.masa_berlaku?.to_date).format("DD MMMM YYYY")}</h4>) : (<h4 className="m-0">6 Bulan</h4>)}
+												<p className="w-105">{data.sanksi.keterangan}</p>
+											</td>
+											{!noBy && <td>{data.user.isPrivate ? "" : data.user.nama}</td>}
+											<td>
+												<div className="ml-auto">
+													<Link
+														href={{
+															pathname: to,
+															query: { id: data.sanksi?._id },
+														}}
+													>
+														<Button className="btn-login" color>
+															<span className="font-color-white">
+																{linkName}
+															</span>
+														</Button>
+													</Link>
+												</div>
+											</td>
+										</tr>
+									);
+								})}
+							</tbody>
+						</table>
+					</Datatable>
+				)}
+			</div>
+		</div>
+	);
+}
+
+export default TableLaporan;

components/RekomendasiDelegasi/DetailLaporan.js

@@ -0,0 +1,169 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+import { Col, FormGroup } from "reactstrap";
+import { useSelector } from "react-redux";
+
+function DetailLaporan({ data, noTitle = false, noStatus = false }) {
+	const user = useSelector((state) => state.user);
+	return (
+		<>
+			{(!data.user.isPrivate || user?.role.id === 2020) && (
+				<>
+					{noTitle ? (
+						""
+					) : (
+						<div className="header-1">
+							<h2 className="card-title-1">Identitas Pelapor - {data.user.isPublic ? "Umum" : "Internal"}</h2>
+						</div>
+					)}
+					{data.user.nama && (
+						<FormGroup row>
+							<Col md="4">Nama Pelapor:</Col>
+							<Col md="8">
+								<strong>{data.user.nama}</strong>
+							</Col>
+						</FormGroup>
+					)}
+					<FormGroup row>
+						<Col md="4">Nomor yang dapat dihubungi:</Col>
+						<Col md="8">
+							<strong>
+								{data.user.no_hp} {data.user.verified && "(Terverifikasi)"}
+							</strong>
+						</Col>
+					</FormGroup>
+					{data.user.email && (
+						<FormGroup row>
+							<Col md="4">Email:</Col>
+							<Col md="8">
+								<strong>{data.user.email}</strong>
+							</Col>
+						</FormGroup>
+					)}
+
+					{data.user.isPublic && (
+						<>
+							{data.user.alamat && (
+								<FormGroup row>
+									<Col md="4">Alamat:</Col>
+									<Col md="8">
+										<strong>{data.user.alamat}</strong>
+									</Col>
+								</FormGroup>
+							)}
+							{data.user.foto && (
+								<FormGroup row>
+									<Col md="4">Foto Kartu Identitas:</Col>
+									<Col md="8">
+										<img src={data.user.foto.path} height={200} alt="Foto Identitas" />
+									</Col>
+								</FormGroup>
+							)}
+						</>
+					)}
+					{data.user.isPrivate && (
+						<FormGroup row>
+							<Col md="4">Dirahasiakan</Col>
+							<Col md="8">
+								<strong>Ya</strong>
+							</Col>
+						</FormGroup>
+					)}
+				</>
+			)}
+			{noTitle ? (
+				""
+			) : (
+				<div className="header-1">
+					<h2 className="card-title-1">Detail Laporan</h2>
+				</div>
+			)}
+			<form className="form-horizontal">
+				<FormGroup row>
+					<Col md="4">Nomor Laporan:</Col>
+					<Col md="8">
+						<strong>{data.no_laporan}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Nama Perguruan Tinggi yang Dilaporkan:</Col>
+					<Col md="8">
+						<strong>{data.pt.nama}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Jenis Pelanggaran:</Col>
+					<Col md="8">
+						<Scrollable height="125px" className="list-group">
+							<ul>
+								{data.pelanggaran.map((e) => (
+									<li>{e.pelanggaran}</li>
+								))}
+							</ul>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Keterangan Laporan:</Col>
+					<Col md="8">
+						<Scrollable height="100px" className="list-group">
+							<p>{data.keterangan}</p>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Dibuat Pada:</Col>
+					<Col md="8">
+						<strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+					</Col>
+				</FormGroup>
+				{!noStatus && data.aktif ? (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+						</Col>
+					</FormGroup>
+				) : (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-danger">Ditutup</div>
+						</Col>
+					</FormGroup>
+				)}
+				{/* <FormGroup row>
+					<Col md="4">Prioritas:</Col>
+					<Col md="8">{data.level == 3 ? <div className="badge badge-success">Tinggi</div> : data.level == 2 ? <div className="badge badge-info">Sedang</div> : <div className="badge badge-warning">Rendah</div>}</Col>
+				</FormGroup> */}
+				<FormGroup row>
+					<Col md="4">Dokumen Pendukung:</Col>
+					<Col md="8">
+						<Scrollable height="120px" className="list-group">
+							<table className="table table-bordered bg-transparent">
+								<tbody>
+									{data.dokumen.map((e, index) => (
+										<tr key={`files-${index}`}>
+											<td>
+												<em className="fa-lg far fa-file-code"></em>
+											</td>
+											<td>
+												<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+													{e.judul}
+												</a>
+											</td>
+										</tr>
+									))}
+								</tbody>
+							</table>
+						</Scrollable>
+					</Col>
+				</FormGroup>
+			</form>
+		</>
+	);
+}
+
+export default DetailLaporan;

components/RekomendasiDelegasi/DetailSanksi.js

@@ -0,0 +1,113 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+import { CardBody, Col, FormGroup, Table, Card } from "reactstrap";
+import { API_URL } from "@/env";
+
+function DetailSanksi({ data, noTitle = false }) {
+	return (
+		<Card className="card-default">
+			<CardBody>
+				{noTitle ? "" : <p className="lead bb">Detail Sanksi</p>}
+				<form className="form-horizontal">
+					<FormGroup row>
+						<Col md="4">Nomor Sanksi:</Col>
+						<Col md="8">
+							<strong>{data.no_sanksi}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Nama Perguruan Tinggi:</Col>
+						<Col md="8">
+							<strong>{data.laporan.pt.nama}</strong>
+						</Col>
+					</FormGroup>
+
+					<FormGroup row>
+						<Col md="4">Keterangan:</Col>
+						<Col md="8">
+							<Scrollable height="100px" className="list-group">
+								<p>{data.keterangan}</p>
+							</Scrollable>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Dibuat Pada:</Col>
+						<Col md="8">
+							<strong>{moment(data.createdAt).format("D MMMM YYYY")}</strong>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md="4">Dokumen Sanksi:</Col>
+						<Col md="8">
+							<Scrollable height="120px" className="list-group">
+								<table className="table table-bordered bg-transparent">
+									<tbody>
+										{data.dokumen.map((e) => (
+											<tr>
+												<td>
+													<em className="fa-lg far fa-file-code"></em>
+												</td>
+												<td>
+													<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+														{e.judul}
+													</a>
+												</td>
+											</tr>
+										))}
+									</tbody>
+								</table>
+							</Scrollable>
+						</Col>
+					</FormGroup>
+					<FormGroup row>
+						<Col md={12}>
+							<div className="card b">
+								<div className="card-body bb">
+									<Table responsive>
+										<thead>
+											<tr>
+												<th>Jenis Pelanggaran</th>
+												<th>Sanksi</th>
+											</tr>
+										</thead>
+										<tbody>
+											{data.pelanggaran.map((jp, index) => (
+												<tr key={jp._id}>
+													<td width={50}>
+														<div className="media align-items-center">
+															<div className="media-body d-flex">
+																<div>
+																	<p>{jp.pelanggaran}</p>
+																	<p>TMT : {jp.tmt_bulan} Bulan</p>
+																	<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p>
+																</div>
+															</div>
+														</div>
+													</td>
+													<td width={50}>
+														<div className="media align-items-center">
+															<div className="media-body d-flex">
+																<div>
+																	<p>{jp.sanksi}</p>
+																	<p>Keterangan : {jp.keterangan_sanksi}</p>
+																</div>
+															</div>
+														</div>
+													</td>
+												</tr>
+											))}
+										</tbody>
+									</Table>
+								</div>
+							</div>
+						</Col>
+					</FormGroup>
+				</form>
+			</CardBody>
+		</Card>
+	);
+}
+
+export default DetailSanksi;

components/RekomendasiDelegasi/InputRekomendasi.js

@@ -0,0 +1,231 @@
+import React, { Component } from "react";
+import { insertPemeriksaan } from "@/actions/pemeriksaan";
+import { Row, Col, Card, CardBody, FormGroup, Input, Button, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, CardTitle } from "reactstrap";
+import { toast } from "react-toastify";
+import { Formik, Form, Field, ErrorMessage } from "formik";
+import * as Yup from "yup";
+import { connect } from "react-redux";
+import { getOneSanksi, addRekomendasiDelegasi } from "@/actions/sanksi";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+
+
+const selectInstanceId = 1;
+const checkIfFilesAreTooBig = (files) => {
+	let valid = true;
+	if (files) {
+		files.map((file) => {
+			if (file.size > 15 * 1024 * 1024) {
+				valid = false;
+			}
+		});
+	}
+	return valid;
+};
+
+const checkIfFilesAreCorrectType = (files) => {
+	let valid = true;
+	if (files) {
+		files.map((file) => {
+			if (!["image/jpeg", "image/png"].includes(file.type)) {
+				valid = false;
+			}
+		});
+	}
+	return valid;
+};
+
+const rekomendasiSchema = Yup.object().shape({
+	dokumen: Yup.array().min(1).required("Wajib diisi").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
+});
+
+let Dropzone = null;
+
+class DropzoneWrapper extends Component {
+	state = {
+		isClient: false,
+	};
+	componentDidMount = () => {
+		Dropzone = require("react-dropzone").default;
+		this.setState({ isClient: true });
+	};
+	render() {
+		return Dropzone ? <Dropzone {...this.props}>{this.props.children}</Dropzone> : null;
+	}
+}
+
+class InputRekomendasi extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			dropdownOpen: false,
+			splitButtonOpen: false,
+			files: [],
+			sanksi: {},
+			data: {},
+		};
+	}
+
+	toggleSplit = () => {
+		this.setState({
+			splitButtonOpen: !this.state.splitButtonOpen,
+		});
+	};
+
+	toggleDropDown = () => {
+		this.setState({
+			dropdownOpen: !this.state.dropdownOpen,
+		});
+	};
+
+	onDrop = (files) => {
+		this.setState({
+			files: files.map((file) =>
+				Object.assign(file, {
+					preview: URL.createObjectURL(file),
+				})
+			),
+			stat: "Added " + files.length + " file(s)",
+		});
+	};
+
+	uploadFiles = (e) => {
+		e.preventDefault();
+		e.stopPropagation();
+		this.setState({
+			stat: this.state.files.length ? "Dropzone ready to upload " + this.state.files.length + " file(s)" : "No files added.",
+		});
+	};
+
+	clearFiles = (e) => {
+		e.preventDefault();
+		e.stopPropagation();
+		this.setState({
+			stat: this.state.files.length ? this.state.files.length + " file(s) cleared." : "No files to clear.",
+		});
+		this.setState({
+			files: [],
+		});
+	};
+
+	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+
+	handelSimpan = async () => {
+
+		const { token, query } = this.props;
+		const { id } = query;
+		const formdata = new FormData();
+		this.state.files.forEach((e) => {
+			formdata.append("dokumen", e);
+		});
+		const toastid = toast.loading("Please wait...");
+		const added = await addRekomendasiDelegasi(token, id, formdata);
+		if (!added) {
+			toast.update(toastid, { render: "All is not good", type: "error", isLoading: false, autoClose: true, closeButton: true });
+		} else {
+			toast.update(toastid, { render: "All is good", type: "success", isLoading: false, autoClose: true, closeButton: true });
+			const sanksi = await getOneSanksi(token, id);
+			this.setState({ sanksi, files: [] });
+			resetForm();
+			// Router.push({
+			// 	pathname: "/app/rekomendasi-delegasi",
+			// });
+
+		}
+
+	};
+	render() {
+		const { files } = this.state;
+
+		const thumbs = files.map((file, index) => (
+			<div md={3} key={index}>
+				<span className="text-left">{index + 1}.{file.name}</span>
+			</div>
+		));
+		return (
+			<Card className="card-default">
+				<CardBody>
+					<p className="lead bb">Dokumen Rekomendasi Delegasi</p>
+					<Formik
+						initialValues={{
+							dokumen: [],
+						}}
+						validationSchema={rekomendasiSchema}
+						onSubmit={async (data) => {
+							this.setState({ data });
+							await this.handelSimpan();
+						}}
+					>
+						{() => (
+							<Form className="form-horizontal">
+								<FormGroup>
+									<div className="row-md-10">
+										<Field name="dokumen">
+											{({ field, form }) => (
+												<DropzoneWrapper
+													className=""
+													onDrop={(e) => {
+														this.onDrop(e);
+														form.setFieldValue(field.name, e);
+													}}
+												>
+													{({ getRootProps, getInputProps, isDragActive }) => {
+														return (
+															<div {...getRootProps()} className={"dropzone card" + (isDragActive ? "dropzone-drag-active" : "")}>
+																<input {...getInputProps()} />
+																<div className="dropzone-previews flex">
+																	<div className="dropzone-style-1">
+																		<div className="center-ver-hor dropzone-previews flex">{this.state.files.length > 0 ? <Row><span className="text-left">{thumbs}</span></Row> :
+																			<div className="text-center fa-2x icon-cloud-upload mr-2 ">
+																				<h5 className="text-center dz-default dz-message">upload dokumen rekomendasi delegasi</h5>
+																			</div>
+																		}
+																		</div>
+																	</div>
+																</div>
+																<div className="d-flex align-items-center">
+																	<small className="ml-auto">
+																		<button
+																			type="button"
+																			className="btn btn-link"
+																			onClick={(e) => {
+																				this.clearFiles(e);
+																				form.setFieldValue(field.name, []);
+																			}}
+																		>
+																			Reset dokumen
+																		</button>
+																	</small>
+																</div>
+															</div>
+														);
+													}}
+												</DropzoneWrapper>
+											)}
+										</Field>
+										<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
+										<p className="mrgn-top-5">Ukuran setiap dokumen maksimal 15mb</p>
+									</div>
+								</FormGroup>
+								<FormGroup row>
+									<div className="col-xl-10">
+										<Button color className="color-3e3a8e btn-login" type="submit">
+											<span className="font-color-white">Kirim</span>
+										</Button>
+									</div>
+								</FormGroup>
+							</Form>
+						)}
+					</Formik>
+				</CardBody>
+			</Card>
+		);
+	}
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(InputRekomendasi);

components/RekomendasiDelegasi/TableLaporan.js

@@ -0,0 +1,91 @@
+import Datatable from "@/components/Tables/Datatable";
+import { Button } from "reactstrap";
+import Link from "next/link";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+
+function TableLaporan({ listData, to, linkName, status = false, noBy = false }) {
+	return (
+		<div className="card b ">
+			<div className="card-body card-over">
+				{listData && (
+					<Datatable options={{ responsive: false, ordering: true }}>
+						<table className="table w-100" data-order='[[3, "desc"]]'>
+							<thead>
+								<tr>
+									<th>No.Laporan</th>
+									<th>Deskripsi Laporan</th>
+									{status && <th>Status</th>}
+									{!noBy && <th>Dibuat Oleh</th>}
+									{/* <th>Created</th> */}
+									<th></th>
+								</tr>
+							</thead>
+							<tbody>
+								{listData.map((data) => {
+									return (
+										<tr key={data._id}>
+											<td>
+												{/* <td>{data.no_laporan}</td> */}
+												<div className="media align-items-center">
+													<div className="media-body d-flex">
+														<div>
+															<h4>{data.laporan.no_laporan}</h4>
+															<p>{moment(data.createdAt).format("DD-MMMM-YYYY")}</p>
+														</div>
+													</div>
+												</div>
+											</td>
+
+											<td>
+												<div className="table-desc">
+													<div className="media align-items-center">
+														<div className="media-body d-flex">
+															<div>
+																<h4 className="m-0">{data.laporan.pt.nama.length > 64 ? data.laporan.pt.nama.substring(0, 64) + "..." : data.laporan.pt.nama}</h4>
+																<p className="w-105">{data.laporan.keterangan}</p>
+															</div>
+														</div>
+													</div>
+												</div>
+											</td>
+
+											{status ? (
+												<td>
+													<h4 className="m-0">{data.laporan.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Delegasi Ke LLDIKTI"}</h4>
+													<p className="w-105">Sanksi Administratif: {data.pelanggaran.map((e) => e.label_sanksi)}</p>
+												</td>
+											) : (
+												""
+											)}
+											{!noBy && <td>{data.user.isPrivate ? "" : data.user.nama}</td>}
+											<td>
+												<div className="ml-auto">
+													<Link
+														href={{
+															pathname: to,
+															query: { id: data._id },
+														}}
+													>
+														<Button className="btn-login" color>
+															<span className="font-color-white">
+																{linkName}
+															</span>
+														</Button>
+													</Link>
+												</div>
+											</td>
+										</tr>
+									);
+								})}
+							</tbody>
+						</table>
+					</Datatable>
+				)}
+			</div>
+		</div>
+	);
+}
+
+export default TableLaporan;

components/RekomendasiDelegasi/TableRiwayat.js

@@ -0,0 +1,60 @@
+import Datatable from "@/components/Tables/Datatable";
+import moment from "moment";
+import 'moment/min/locales';
+moment.locale('id');
+
+function TableRiwayat({ data, perbaikan }) {
+	return (
+		// <Datatable options={{ responsive: true }}>
+		<div className="card-over">
+			<table className="table table-striped my-4 w-100">
+				<thead>
+					<tr>
+						<th>Tanggal</th>
+						<th>Keterangan</th>
+						<th>Nomor Surat Sanksi</th>
+						<th>Dokumen Surat Sanksi</th>
+						<th>Dokumen Perbaikan</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td>{moment(data.createdAt).format("D MMMM YYYY")}</td>
+						<td>{data.keterangan}</td>
+						<td>{data.no_sanksi}</td>
+						<td>
+							{data.dokumen.map((e, index) => (
+								<>
+									<em key="index" className="fa-lg far fa-file-code"></em>
+									<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+										{e.judul}
+									</a>
+									<br />
+								</>
+							))}
+						</td>
+						{perbaikan.length
+							? perbaikan.map((value) => (
+								<tr>
+									<td>
+										{value.dokumen.map((e) => (
+											<>
+												<em className="fa-lg far fa-file-code"></em>
+												<a className="text-muted" href={e.path} target="_blank" download={e.judul}>
+													{e.judul}
+												</a>
+											</>
+										))}
+									</td>
+								</tr>
+							))
+							: ""}
+					</tr>
+				</tbody>
+			</table>
+		</div>
+		// </Datatable>
+	);
+}
+
+export default TableRiwayat;

components/Riwayat/ChartData.js

@@ -1,9 +1,10 @@
 import React, { Component } from "react";
-import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Container, Row, Col, Card, CardHeader, CardBody } from "reactstrap";
 import FlotChart from "@/components/Charts/Flot.js";
 import { connect } from "react-redux";
 import { getPengunjung } from "@/actions/pengunjung";
+
+//sudah live
 class ChartData extends Component {
 	constructor(props) {
 		super(props);

components/Riwayat/ChartDataBar.js

@@ -3,9 +3,10 @@ import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Container, Row, Col, Card, CardHeader, CardBody } from "reactstrap";
 import { connect } from "react-redux";
 import { jumlahLaporan } from "@/actions/pelaporan";
+import { getjumlahStatusLaporan } from "@/actions/graph";
 import dynamic from "next/dynamic";
 const ReactApexChart = dynamic(() => import("react-apexcharts"), { ssr: false });
-
+//sudah live
 class ChartDataBar extends React.Component {
 	constructor(props) {
 		super(props);
@@ -83,7 +84,6 @@ class ChartDataBar extends React.Component {
 			},
 		}));
 	}
-
 	render() {
 		return (
 			<Card className="card-default">

components/Riwayat/ChartRadarA.js

@@ -0,0 +1,82 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Container, Row, Col, Card, CardHeader, CardBody } from "reactstrap";
+import { connect } from "react-redux";
+import { jumlahLaporan } from "@/actions/pelaporan";
+import dynamic from "next/dynamic";
+import { getjumlahStatusLaporan } from "../../actions/graph";
+const ReactApexChart = dynamic(() => import("react-apexcharts"), { ssr: false });
+
+
+class ChartRadarA extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            series: [{
+                name: 'Penjadwalan Evaluasi',
+                data: [8, 5, 3, 4, 5, 1, 6, 8, 3, 9, 5, 2, 9, 6, 4, 2],
+            }, {
+                name: 'Pemeriksaan',
+                data: [2, 3, 4, 2, 5, 4, 3, 6, 7, 8, 6, 5, 4, 3, 2, 1],
+            }, {
+                name: 'Sanksi',
+                data: [4, 6, 8, 5, 7, 5, 6, 8, 9, 4, 3, 2, 4, 5, 6, 7],
+            }
+            ],
+            options: {
+                chart: {
+                    height: 150,
+                    type: 'radar',
+                },
+                xaxis: {
+                    categories: ["I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "XI", "XII", "XIII", "XIV", "XV", "XVI"]
+                },
+                chart: {
+                    toolbar: {
+                        show: true,
+                        tools: {
+                            download: false,
+                        },
+                    },
+                },
+
+                // legend: {
+                //     show: false,
+                // }
+            },
+
+        };
+    }
+    async componentDidMount() {
+        const { token } = this.props;
+        const data = await getjumlahStatusLaporan(this.props.token);
+        this.setState((prevState) => ({
+            ...prevState,
+            series: [{ data: data.data.map((e) => e.jumlah_jadwal_evaluasi), name: "penjadwalan Evaluasi" }
+                , { data: data.data.map((e) => e.jumlah_pemeriksaan), name: "Pemeriksaan" },
+            { data: data.data.map((e) => e.jumlah_sanksi), name: "sanksi" }],
+            options: {
+                ...prevState,
+                xaxis: {
+                    categories: data.data.map((data) => data.pembina.name),
+                },
+            },
+        }));
+    }
+
+    render() {
+        return (
+            <Card className="card-default">
+                <CardBody>
+                    <div id="chart">
+                        <ReactApexChart options={this.state.options} series={this.state.series} type="radar" height={400} />
+                    </div>
+                </CardBody>
+            </Card>
+        );
+    }
+}
+
+const MapStateToProps = (state) => ({ token: state.token });
+export default connect(MapStateToProps)(ChartRadarA);

components/Riwayat/ChartRadarB.js

@@ -0,0 +1,88 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Container, Row, Col, Card, CardHeader, CardBody } from "reactstrap";
+import { connect } from "react-redux";
+import { jumlahLaporan } from "@/actions/pelaporan";
+import dynamic from "next/dynamic";
+import { getjumlahStatusLaporan } from "../../actions/graph";
+const ReactApexChart = dynamic(() => import("react-apexcharts"), { ssr: false });
+
+
+class ChartRadarB extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            series: [
+                {
+                    name: 'Keberatan',
+                    data: [8, 6, 8, 1, 2, 3, 4, 5, 6, 7, 8, 8, 7, 6, 5, 3],
+                },
+                {
+                    name: 'Banding',
+                    data: [4, 6, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1, 2, 3, 4, 4],
+                }
+                , {
+                    name: 'Pemantauan Perbaikan',
+                    data: [4, 6, 8, 4, 5, 6, 7, 8, 8, 9, 3, 4, 5, 6, 7, 3],
+                }
+                , {
+                    name: 'Pencabutan Sanksi',
+                    data: [4, 6, 6, 9, 8, 7, 6, 3, 2, 1, 8, 5, 4, 3, 6, 7],
+                    colors: "#B2B0D2",
+                },],
+            options: {
+                chart: {
+                    height: 150,
+                    type: 'radar',
+                },
+                xaxis: {
+                    categories: ["I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "XI", "XII", "XIII", "XIV", "XV", "XVI"]
+                },
+                chart: {
+                    toolbar: {
+                        show: true,
+                        tools: {
+                            download: false,
+                        },
+                    },
+                },
+                // legend: {
+                //     show: false,
+                // }
+            },
+        };
+    }
+
+    async componentDidMount() {
+        const { token } = this.props;
+        const data = await getjumlahStatusLaporan(this.props.token);
+        this.setState((prevState) => ({
+            ...prevState,
+            series: [{ data: data.data.map((e) => e.jumlah_keberatan), name: "Keberatan" }
+                , { data: data.data.map((e) => e.jumlah_banding), name: "Banding" },
+            { data: data.data.map((e) => e.jumlah_pemantauan_perbaikan), name: "Pemantauan perbaikan" },
+            { data: data.data.map((e) => e.jumlah_pencabutan_sanksi), name: "Pencabutan sanksi" }],
+            options: {
+                ...prevState,
+                xaxis: {
+                    categories: data.data.map((data) => data.pembina.name),
+                },
+            },
+        }));
+    }
+    render() {
+        return (
+            <Card className="card-default">
+                <CardBody>
+                    <div id="chart">
+                        <ReactApexChart options={this.state.options} series={this.state.series} type="radar" height={400} />
+                    </div>
+                </CardBody>
+            </Card>
+        );
+    }
+}
+
+const MapStateToProps = (state) => ({ token: state.token });
+export default connect(MapStateToProps)(ChartRadarB);

components/Riwayat/Maps.js

@@ -10,44 +10,80 @@ const defaultColors = {
     scaleColors: ["#146804", "#ff0000"],
     regionFill: '#bbbec6'
 };
-
 const RegionValues = {
-    'ID_su': 1,
-    'ID_su': 2,
-    'ID_ss': 3,
-    'ID_la': 4,
-    'ID_be': 5,
-    'ID_bb': 6,
-    'ID_jk': 2,
-    'ID_jb': 9,
-    'ID_bt': 9,
-    'ID_yo': 8,
-    'ID_jt': 5,
-    'ID_jl': 1,
-    'ID_ba': 2,
-    'ID_nb': 1,
-    'ID_sg': 1,
-    'ID_sn': 1,
-    'ID_sr': 1,
-    'ID_sb': 10,
-    'ID_ri': 10,
-    'ID_kr': 10,
-    'ID_ja': 10,
-    'ID_ks': 11,
-    'ID_kb': 11,
-    'ID_ki': 11,
-    'ID_kt': 11,
-    'ID_ku': 11,
-    'ID_ma': 12,
-    'ID_mu': 12,
-    'ID_ac': 13,
-    'ID_pa': 14,
-    'ID_pb': 14,
-    'ID_nt': 15,
-    'ID_go': 16,
-    'ID_st': 16,
-    'ID_sa': 16,
+    'ID_su': 0,
+    'ID_su': 0,
+    'ID_ss': 0,
+    'ID_la': 0,
+    'ID_be': 0,
+    'ID_bb': 0,
+    'ID_jk': 33,
+    'ID_jb': 0,
+    'ID_bt': 0,
+    'ID_yo': 0,
+    'ID_jt': 0,
+    'ID_jl': 0,
+    'ID_ba': 0,
+    'ID_nb': 0,
+    'ID_sg': 0,
+    'ID_sn': 0,
+    'ID_sr': 0,
+    'ID_sb': 0,
+    'ID_ri': 0,
+    'ID_kr': 0,
+    'ID_ja': 0,
+    'ID_ks': 0,
+    'ID_kb': 0,
+    'ID_ki': 0,
+    'ID_kt': 0,
+    'ID_ku': 0,
+    'ID_ma': 0,
+    'ID_mu': 0,
+    'ID_ac': 0,
+    'ID_pa': 0,
+    'ID_pb': 0,
+    'ID_nt': 0,
+    'ID_go': 0,
+    'ID_st': 0,
+    'ID_sa': 0,
 }
+// const RegionValues = {
+//     'ID_su': 1,
+//     'ID_su': 2,
+//     'ID_ss': 3,
+//     'ID_la': 4,
+//     'ID_be': 5,
+//     'ID_bb': 6,
+//     'ID_jk': 2,
+//     'ID_jb': 9,
+//     'ID_bt': 9,
+//     'ID_yo': 8,
+//     'ID_jt': 5,
+//     'ID_jl': 1,
+//     'ID_ba': 2,
+//     'ID_nb': 1,
+//     'ID_sg': 1,
+//     'ID_sn': 1,
+//     'ID_sr': 1,
+//     'ID_sb': 10,
+//     'ID_ri': 10,
+//     'ID_kr': 10,
+//     'ID_ja': 10,
+//     'ID_ks': 11,
+//     'ID_kb': 11,
+//     'ID_ki': 11,
+//     'ID_kt': 11,
+//     'ID_ku': 11,
+//     'ID_ma': 12,
+//     'ID_mu': 12,
+//     'ID_ac': 13,
+//     'ID_pa': 14,
+//     'ID_pb': 14,
+//     'ID_nt': 15,
+//     'ID_go': 16,
+//     'ID_st': 16,
+//     'ID_sa': 16,
+// }
 const LLDIKTI = {
     'ID_su': '<h5>LLDIKTI Wilayah I</h5>',
     'ID_ss': '<h5>LLDIKTI Wilayah II</h5>',

components/Riwayat/TableLaporan.js

@@ -0,0 +1,90 @@
+import Datatable from "@/components/Tables/Datatable";
+import { Button } from "reactstrap";
+import Link from "next/link";
+import moment from "moment";
+
+function TableLaporan({ listData, to, linkName, status = false, noBy = false }) {
+    return (
+        <div className="card b ">
+            <div className="card-body card-over">
+                {listData && (
+                    <Datatable options={{ responsive: false, ordering: true }}>
+                        <table className="table w-100" data-order='[[1, "desc"]]'>
+                            <thead>
+                                <tr>
+                                    <th>No.Laporan</th>
+                                    <th>Deskripsi Laporan</th>
+                                    {status && <th>Status</th>}
+                                    {!noBy && <th>Dibuat Oleh</th>}
+                                    {/* <th>Created</th> */}
+                                    {/* <th></th> */}
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {listData.map((data) => {
+                                    return (
+                                        <tr key={data._id}>
+                                            <td>
+                                                {/* <td>{data.no_laporan}</td> */}
+                                                <div className="media align-items-center">
+                                                    <div className="media-body d-flex">
+                                                        <div>
+                                                            <h4>{data.no_laporan}</h4>
+                                                            <p>{moment(data.createdAt).format("DD-MM-YYYY")}</p>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </td>
+
+                                            <td>
+                                                <div className="table-desc">
+                                                    <div className="media align-items-center">
+                                                        <div className="media-body d-flex">
+                                                            <div>
+                                                                <h4 className="m-0">{data.pt.nama.length > 64 ? data.pt.nama.substring(0, 64) + "..." : data.pt.nama}</h4>
+                                                                {/* <h4 className="m-0">{data.pt.nama}</h4> */}
+                                                                {/* <p className="w-105">{data.keterangan.length > 150 ? data.keterangan.substring(0, 150) + "..." : data.keterangan}</p> */}
+                                                                <p className="w-105">{data.keterangan}</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </td>
+
+                                            {status ? (
+                                                <td>
+                                                    <div className="badge badge-info">{data.role_data === "dikti" ? "Ditindaklanjuti DIKTI" : "Ditindaklanjuti LLDIKTI"}</div>
+                                                </td>
+                                            ) : (
+                                                ""
+                                            )}
+                                            {!noBy && <td>{data.user.isPrivate ? "" : data.user.nama}</td>}
+                                            {/* <td>
+                                                <div className="ml-auto">
+                                                    <Link
+                                                        href={{
+                                                            pathname: to,
+                                                            query: { id: data._id },
+                                                        }}
+                                                    >
+                                                        <Button className="btn-login" color>
+                                                            <span className="font-color-white">
+                                                                {linkName}
+                                                            </span>
+                                                        </Button>
+                                                    </Link>
+                                                </div>
+                                            </td> */}
+                                        </tr>
+                                    );
+                                })}
+                            </tbody>
+                        </table>
+                    </Datatable>
+                )}
+            </div>
+        </div>
+    );
+}
+
+export default TableLaporan;

components/Riwayat/TableRadar.js

@@ -1,196 +1,161 @@
 import React, { Component } from 'react';
 import ContentWrapper from '@/components/Layout/ContentWrapper';
-import { Row, Col, Card, CardHeader, CardBody, Table } from 'reactstrap';
+import Link from "next/link";
+import { Row, Col, Card, CardHeader, CardBody, Table, Button } from 'reactstrap';
+import cabutSanksi from '../../pages/app/riwayat/cabutSanksi';
 
 
-function TableRadar() {
+function TableRadar({ listData, to, linkName, jadwal, pemeriksaan, sanksi, keberatan, banding, perbaikan, cabutSanksi }) {
     return (
-        <Col xl="12">
-            <Card className="card-default">
-                {/* <CardHeader>Context Classes</CardHeader> */}
-                <CardBody>
-                    <Table responsive bordered>
-                        <thead>
-                            <tr>
-                                <th>Menu\Wilayah LLDikti</th>
-                                <th>I</th>
-                                <th>II</th>
-                                <th>III</th>
-                                <th>IV</th>
-                                <th>V</th>
-                                <th>VI</th>
-                                <th>VII</th>
-                                <th>VIII</th>
-                                <th>IX</th>
-                                <th>X</th>
-                                <th>XI</th>
-                                <th>XII</th>
-                                <th>XIII</th>
-                                <th>XIV</th>
-                                <th>XV</th>
-                                <th>XVI</th>
-                            </tr>
-                        </thead>
-                        <thead>
-                            <tr style={{
+        <Card className="card-default">
+            <CardBody>
+                <Table bordered responsive>
+                    <thead>
+                        <tr >
+                            <th>Wilayah LLDikti\Menu</th>
+                            <th style={{
                                 backgroundColor: '#80b1ff',
                                 color: "black",
-                            }}>
-                                <th>Penjadwalan Evaluasi</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Penjadwalan Evaluasi</th>
+                            <th style={{
                                 backgroundColor: '#de8383',
                                 color: "black",
-                            }}>
-                                <th>Pemeriksaan</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-444</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Pemeriksaan</th>
+                            <th style={{
                                 backgroundColor: '#fdda80',
                                 color: "black",
-                            }}>
-                                <th>Sanksi</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Sanksi</th>
+                            <th style={{
                                 backgroundColor: '#cfab80',
                                 color: "black",
-                            }}>
-                                <th>Keberatan</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Keberatan</th>
+                            <th style={{
                                 backgroundColor: '#ef90df',
                                 color: "black",
-                            }}>
-                                <th>Banding</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Banding</th>
+                            <th style={{
                                 backgroundColor: '#80df89',
                                 color: "black",
-                            }}>
-                                <th>Pemantauan perbaikan</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                            <tr style={{
+                            }}>Pemantauan perbaikan</th>
+                            <th style={{
                                 backgroundColor: '#a3d4d1',
                                 color: "black",
-                            }}>
-                                <th>Pencabutan Sanksi</th>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                                <td>-</td>
-                            </tr>
-                        </thead>
-                    </Table>
-                </CardBody>
-            </Card>
-        </Col>
+                            }}>Pencabutan Sanksi</th>
+                            <th style={{
+                                backgroundColor: '#e8f2f1',
+                                color: "black",
+                            }}>Lihat Laporan</th>
+                        </tr>
+                    </thead>
+                    {listData.map((data) => {
+                        return (
+                            <tr key={data.id}>
+                                <td>{data.pembina.name}</td>
+                                <Link
+                                    href={{
+                                        pathname: jadwal,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#80b1ff',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_jadwal_evaluasi}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: pemeriksaan,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#de8383',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_pemeriksaan}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: sanksi,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#fdda80',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_sanksi}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: keberatan,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#cfab80',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_keberatan}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: banding,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#ef90df',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_banding}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: perbaikan,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#80df89',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_pemantauan_perbaikan}</td>
+                                </Link>
+                                <Link
+                                    href={{
+                                        pathname: cabutSanksi,
+                                        query: { id: data.pembina.id },
+                                    }}
+                                >
+                                    <td style={{
+                                        backgroundColor: '#a3d4d1',
+                                        color: "black",
+                                        textAlign: "center",
+                                    }}>{data.jumlah_pencabutan_sanksi}</td>
+                                </Link>
+                                <td>
+                                    <div className="ml-auto">
+                                        <Link
+                                            href={{
+                                                pathname: to,
+                                                query: { id: data.pembina.id },
+                                            }}
+                                        >
+                                            <Button className="btn-login" color>
+                                                <span className="font-color-white">
+                                                    {linkName}
+                                                </span>
+                                            </Button>
+                                        </Link>
+                                    </div>
+                                </td>
+                            </tr>)
+                    })}
+                </Table>
+            </CardBody>
+        </Card>
     )
 }
 

components/Riwayat/TableRadarr.js

@@ -0,0 +1,92 @@
+import React, { Component } from 'react';
+import ContentWrapper from '@/components/Layout/ContentWrapper';
+import { Row, Col, Card, CardHeader, CardBody, Table } from 'reactstrap';
+
+
+function TableRadarr({ listData }) {
+    return (
+        <Card className="card-default">
+            <CardBody>
+                <Table bordered responsive>
+                    <thead>
+                        <tr >
+                            <th>Wilayah LLDikti\Menu</th>
+                            <th style={{
+                                backgroundColor: '#80b1ff',
+                                color: "black",
+                            }}>Penjadwalan Evaluasi</th>
+                            <th style={{
+                                backgroundColor: '#de8383',
+                                color: "black",
+                            }}>Pemeriksaan</th>
+                            <th style={{
+                                backgroundColor: '#fdda80',
+                                color: "black",
+                            }}>Sanksi</th>
+                            <th style={{
+                                backgroundColor: '#cfab80',
+                                color: "black",
+                            }}>Keberatan</th>
+                            <th style={{
+                                backgroundColor: '#ef90df',
+                                color: "black",
+                            }}>Banding</th>
+                            <th style={{
+                                backgroundColor: '#80df89',
+                                color: "black",
+                            }}>Pemantauan perbaikan</th>
+                            <th style={{
+                                backgroundColor: '#a3d4d1',
+                                color: "black",
+                            }}>Pencabutan Sanksi</th>
+                        </tr>
+                    </thead>
+                    {listData.map((data) => {
+                        return (
+                            <tr key={data.id}>
+                                <td>{data.pembina.name}</td>
+                                <td style={{
+                                    backgroundColor: '#80b1ff',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_jadwal_evaluasi}</td>
+                                <td style={{
+                                    backgroundColor: '#de8383',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_pemeriksaan}</td>
+                                <td style={{
+                                    backgroundColor: '#fdda80',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_sanksi}</td>
+                                <td style={{
+                                    backgroundColor: '#cfab80',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_keberatan}</td>
+                                <td style={{
+                                    backgroundColor: '#ef90df',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_banding}</td>
+                                <td style={{
+                                    backgroundColor: '#80df89',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_pemantauan_perbaikan}</td>
+                                <td style={{
+                                    backgroundColor: '#a3d4d1',
+                                    color: "black",
+                                    textAlign: "center",
+                                }}>{data.jumlah_pencabutan_sanksi}</td>
+                            </tr>)
+                    })}
+                </Table>
+            </CardBody>
+        </Card>
+    )
+}
+
+export default TableRadarr
+

components/Riwayat/TableRiwayatt.js

@@ -20,7 +20,7 @@ class TableRiwayatt extends Component {
     }
 
     render() {
-        console.log(this.state.dataRiwayat.data?.map(e => e.id))
+        // console.log(this.state.dataRiwayat.data?.map(e => e.id))
         return (
             <div className="card b ">
                 <div style={{ height: 500 }} className="card-body card-over">

components/Sanksi/TableLaporan.js

@@ -55,7 +55,7 @@ function TableLaporan({ listData }) {
 													<Link
 														href={{
 															pathname: data.sanksi ? "/app/sanksi/detail" : "/app/sanksi/proses",
-															query: { id: data.sanksi || data._id },
+															query: { id: data.sanksi?._id || data._id },
 														}}
 													>
 														<Button className="btn-login" color>

pages/app/Bantuan/index.js

@@ -37,6 +37,10 @@ class Bantuan extends React.Component {
                                             </Button>
                                         </span>
                                     </a>
+                                    <div style={{
+                                        marginTop: "20px",
+                                        fontSize: "15px"
+                                    }}>Buku Panduan versi 7.3</div>
                                 </p>
 
                             </Col>
@@ -47,7 +51,7 @@ class Bantuan extends React.Component {
                     </Jumbotron>
                 </ContentWrapper>
 
-            </div>
+            </div >
 
         )
     }

pages/app/index.js

@@ -112,7 +112,7 @@ class App extends Component {
               </Col>
             </Row>
           </Jumbotron>
-          <span>Version 1.94 ~ 1.60</span>
+          <span>Version 1.99 ~ 1.83</span>
         </ContentWrapper>
       </div>
     );

pages/app/laporan-delegasi/detail.js

@@ -3,7 +3,7 @@ import Header from "@/components/Main/Header";
 import DetailPT from "@/components/Main/DetailPT";
 import { getOneLaporan } from "@/actions/pelaporan";
 import { getLog } from "@/actions/log";
-import DetailLaporan from "@/components/Main/DetailLaporan";
+import DetailLaporan from "@/components/Delegasi/DetailLaporan";
 import Link from "next/link";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Card, CardBody, Button, FormGroup } from "reactstrap";
@@ -28,11 +28,12 @@ class DetailPelaporan extends Component {
 
 	componentDidMount = async () => {
 		const { token, query } = this.props;
-		const pelaporan = await getOneLaporan(this.props.token, query.id + "?delegasi=true");
+		const pelaporan = await getOneLaporan(this.props.token, query.id + "?delegasi=true&?aktif=false");
 		await createLog(token, { aktivitas: `Mengakses halaman detail Laporan Delegasi dengan No. Laporan ${pelaporan.data.no_laporan}`, menu: "Laporan Delegasi" });
 		const pemantauan = await getLog(this.props.token, query.id + "?delegasi=true&asc=true");
 		pemantauan.data = pemantauan.data.filter((e) => e.action != "CREATE LAPORAN");
 		this.setState({ pelaporan, pemantauan });
+		console.log(pelaporan);
 	};
 
 	render() {

pages/app/pelaporan/index.js

@@ -62,6 +62,7 @@ class Pelaporan extends Component {
 	excel = () => {
 		const url = getExcel(this.props.token, "Laporan", {
 			tahun: this.state.tahun,
+			pelaporan: true,
 		});
 		Router.push(url);
 	};
@@ -81,12 +82,8 @@ class Pelaporan extends Component {
 					</Link>
 				</div>
 				<Row>
-					<Col lg="4">
-						{graph?.data ? <CaseProgress data={graph.data} nextButton={this.nextButton} prevButton={this.prevButton} tahun={this.state.tahun} newLaporan={newLaporan} excel={this.excel} /> : <Loader />}
-					</Col>
-					<Col lg="8">
-						{pelaporan?.data ? <TableLaporan listData={pelaporan.data} to="/app/pelaporan/detail" linkName="Detail" /> : <Loader />}
-					</Col>
+					<Col lg="4">{graph?.data ? <CaseProgress data={graph.data} nextButton={this.nextButton} prevButton={this.prevButton} tahun={this.state.tahun} newLaporan={newLaporan} excel={this.excel} /> : <Loader />}</Col>
+					<Col lg="8">{pelaporan?.data ? <TableLaporan listData={pelaporan.data} to="/app/pelaporan/detail" linkName="Detail" /> : <Loader />}</Col>
 				</Row>
 			</ContentWrapper>
 		);

pages/app/pelaporan/search.js

@@ -18,6 +18,7 @@ class Search extends Component {
 		data: [],
 		pembina: [],
 		loading: false,
+		noData: false,
 	};
 
 	componentDidMount = async () => {
@@ -58,29 +59,13 @@ class Search extends Component {
 	};
 
 	fetchData = async () => {
-		const pembina = this.props.user.role.id === 2021 ? this.props.user.lembaga.id : this.state.selectedOptionMulti.map((e) => e.value).join(",");
+		const pembina = this.props.user.role.id === 2021 ? this.props.user.lembaga.id : this.state.selectedOptionMulti?.map((e) => e.value).join(",");
 		const searchValue = document.getElementById("searchInput").value;
 		const jsonData = await getPT(this.props.token, { search: searchValue, pembina });
 		this.setState({ data: jsonData.data });
 	};
 
-	handleApplyClick = () => {
-		this.setState({ loading: true });
-		this.fetchData();
-		this.setState({ loading: false });
-		if (this.state.data && this.state.data.length) {
-			this.renderTableData();
-		}
-	};
 
-	handleSearchClick = () => {
-		this.setState({ loading: true });
-		this.fetchData();
-		this.setState({ loading: false });
-		if (this.state.data.length) {
-			this.renderTableData();
-		}
-	};
 
 	renderTableData() {
 		return (
@@ -119,6 +104,25 @@ class Search extends Component {
 			})
 		);
 	}
+	handleApplyClick = () => {
+		this.setState({ loading: true });
+		this.fetchData();
+		this.setState({ loading: false });
+		if (this.state.data && this.state.data.length) {
+			this.renderTableData();
+			this.setState({ noData: true });
+		}
+	};
+
+	handleSearchClick = () => {
+		this.setState({ loading: true });
+		this.fetchData();
+		this.setState({ loading: false });
+		if (this.state.data.length) {
+			this.renderTableData();
+			this.setState({ noData: true });
+		}
+	};
 
 	render() {
 		const { selectedOptionMulti, pembina } = this.state;
@@ -159,8 +163,7 @@ class Search extends Component {
 							</div>
 						</div>
 						<div className="card card-default">
-							<div className="card-header">Search Results</div>
-							<Table striped bordered hover>
+							{this.state.data.length ? (<div className="card-header">Jumlah Pencarian : {this.state.data.length}</div>) : (<div className="card-header">Search results</div>)}							<Table striped bordered hover>
 								<thead>
 									<tr>
 										<th>No. </th>
@@ -170,7 +173,7 @@ class Search extends Component {
 								<tbody>{this.renderTableData()}</tbody>
 							</Table>
 							<div className="card-footer">
-								<div className="d-flex"></div>
+								<div >{!this.state.data.length > 0 && this.state.noData && (<h3 className=" text-center">Data tidak ditemukan</h3>)}</div>
 							</div>
 						</div>
 					</Col>

pages/app/pemantauan/index.js

@@ -15,6 +15,7 @@ class Search extends Component {
 		pembina: [],
 		selectedOptionMulti: [],
 		data: [],
+		nodata: false,
 	};
 
 	componentDidMount = async () => {
@@ -53,26 +54,11 @@ class Search extends Component {
 	};
 
 	fetchData = async () => {
-		const pembina = this.props.user.role.id === 2021 ? null : this.state.selectedOptionMulti.map((e) => e.value).join(",");
+		const pembina = this.props.user.role.id === 2021 ? null : this.state.selectedOptionMulti?.map((e) => e.value).join(",");
 		const searchValue = document.getElementById("searchInput").value;
 		const jsonData = await getPT(this.props.token, { search: searchValue, pembina });
 		this.setState({ data: jsonData.data ? jsonData.data : [] });
 	};
-
-	handleApplyClick = () => {
-		this.fetchData();
-		if (this.state.data && this.state.data.length) {
-			this.renderTableData();
-		}
-	};
-
-	handleSearchClick = () => {
-		this.fetchData();
-		if (this.state.data && this.state.data.length) {
-			this.renderTableData();
-		}
-	};
-
 	renderTableData() {
 		return (
 			this.state.data &&
@@ -112,6 +98,22 @@ class Search extends Component {
 		);
 	}
 
+	handleApplyClick = () => {
+		this.fetchData();
+		if (this.state.data && this.state.data.length > 0) {
+			this.renderTableData();
+			this.setState({ noData: true });
+		}
+	};
+
+	handleSearchClick = () => {
+		this.fetchData();
+		if (this.state.data && this.state.data.length) {
+			this.renderTableData();
+			this.setState({ noData: true });
+		}
+	};
+
 	render() {
 		const { selectedOptionMulti, pembina } = this.state;
 		return (
@@ -133,6 +135,7 @@ class Search extends Component {
 								onKeyPress={(e) => {
 									if (e.key === "Enter") {
 										this.handleApplyClick();
+										this.handleSearchClick();
 									}
 								}}
 							/>
@@ -145,7 +148,7 @@ class Search extends Component {
 						</div>
 						{/* START card */}
 						<div className="card card-default">
-							<div className="card-header">Search Results</div>
+							{this.state.data.length ? (<div className="card-header">Jumlah Pencarian : {this.state.data.length}</div>) : (<div className="card-header">Search results</div>)}
 							{/* START table-responsive */}
 							<Table striped bordered hover>
 								<thead>
@@ -158,7 +161,7 @@ class Search extends Component {
 							</Table>
 							{/* END table-responsive */}
 							<div className="card-footer">
-								<div className="d-flex"></div>
+								<div >{!this.state.data.length > 0 && this.state.noData && (<h3 className=" text-center">Data tidak ditemukan</h3>)}</div>
 							</div>
 						</div>
 						{/* END card */}

pages/app/pemantauan/timeline.js

@@ -12,8 +12,7 @@ import Loader from "@/components/Common/Loader";
 import DetailPT from "@/components/Main/DetailPT";
 import moment from "moment";
 import Datatable from "@/components/Tables/Datatable";
-<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
-
+<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>;
 
 class Pemantauan extends Component {
 	constructor(props) {
@@ -26,26 +25,24 @@ class Pemantauan extends Component {
 		};
 	}
 
-
 	static async getInitialProps({ query }) {
 		return { query };
 	}
 
 	componentDidMount = async () => {
 		const { query, token } = this.props;
-		const ptId = query.ptId
-		const pelaporan = await getPelaporan(token, { pt_id: ptId });
+		const ptId = query.ptId;
+		const pelaporan = await getPelaporan(token, { pt_id: ptId, all: true, aktif: false });
 		const pt = await getOnePT(token, ptId);
 		this.setState({ pelaporan, pt });
-
 	};
 
 	handleLihatPemantaun = async (e, id_laporan) => {
 		const { token } = this.props;
-		const log = await getLog(token, id_laporan)
-		const detailLaporanPt = await getOneLaporan(token, id_laporan)
+		const log = await getLog(token, id_laporan);
+		const detailLaporanPt = await getOneLaporan(token, id_laporan, { all: true, aktif: false });
 		this.setState({ detailLaporanPt, log });
-	}
+	};
 
 	render() {
 		const { detailLaporanPt, log, pt, pelaporan } = this.state;
@@ -57,9 +54,7 @@ class Pemantauan extends Component {
 						<div className="ml-auto">
 							<Link href="/app/pemantauan">
 								<Button className="color-3e3a8e" color>
-									<span className="font-color-white">
-										&lt; Kembali
-									</span>
+									<span className="font-color-white">&lt; Kembali</span>
 								</Button>
 							</Link>
 						</div>
@@ -97,18 +92,15 @@ class Pemantauan extends Component {
 																	</div>
 																</td>
 
-																<td>{data.user.isPrivate ? "" : data.user.nama}</td>
+																<td>
+																	{data.user.isPrivate ? "" : data.user.nama} - {data.role_asal}
+																</td>
 
 																<td>
 																	<div>
-
 																		<Button color className="color-3e3a8e" onClick={(e) => this.handleLihatPemantaun(e, data._id)}>
-																			<span className="font-color-white">
-																				Detail
-																			</span>
-
+																			<span className="font-color-white">Detail</span>
 																		</Button>
-
 																	</div>
 																</td>
 															</tr>
@@ -117,9 +109,13 @@ class Pemantauan extends Component {
 												</tbody>
 											</table>
 										</Datatable>
-									) : pelaporan.data ? "Pelaporan tidak ada" : <Loader />}
-								</div >
-							</div >
+									) : pelaporan.data ? (
+										"Pelaporan tidak ada"
+									) : (
+										<Loader />
+									)}
+								</div>
+							</div>
 						</Col>
 						<Col xl={3}>{pt?.data ? <DetailPT data={pt.data} /> : <Loader />}</Col>
 					</Row>
@@ -129,9 +125,7 @@ class Pemantauan extends Component {
 								<Card className="card-default">
 									<CardBody>
 										<Row>
-											<Col lg={12}>
-												{<DetailLaporan data={detailLaporanPt.data} />}
-											</Col>
+											<Col lg={12}>{<DetailLaporan data={detailLaporanPt.data} />}</Col>
 										</Row>
 									</CardBody>
 								</Card>
@@ -148,11 +142,9 @@ class Pemantauan extends Component {
 						)}
 					</Row>
 				</div>
-
-
 			</ContentWrapper>
 		);
 	}
 }
 const mapStateToProps = (state) => ({ user: state.user, token: state.token });
-export default connect(mapStateToProps)(Pemantauan);
+export default connect(mapStateToProps)(Pemantauan);

pages/app/pemeriksaan/new.js

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import DetailPT from "@/components/Main/DetailPT";
 import Header from "@/components/Main/Header";
-import DetailLaporan from "@/components/Main/DetailLaporan";
+import DetailLaporan from "@/components/Pemeriksaan/DetailLaporan";
 import InputEvaluasi from "@/components/Pemeriksaan/InputEvaluasi";
 import TableRiwayat from "@/components/Pemeriksaan/TableRiwayat";
 import { getOneLaporan } from "@/actions/pelaporan";

pages/app/pencabutan-sanksi/detail.js

@@ -238,57 +238,111 @@ class JawabanPencabutanSanksi extends Component {
 															) : (
 																""
 															)}
-															<FormGroup>
-																<label className="row-form-label">Upload Dokumen:</label>
-																<div className="row-md-10">
-																	<Field name="dokumen">
-																		{({ field, form }) => (
-																			<DropzoneWrapper
-																				className=""
-																				onDrop={(e) => {
-																					this.onDrop(e);
-																					form.setFieldValue(field.name, e);
-																				}}
-																			>
-																				{({ getRootProps, getInputProps, isDragActive }) => {
-																					return (
-																						<div {...getRootProps()} className={"dropzone card p-3 " + (isDragActive ? "dropzone-drag-active" : "")}>
-																							<input {...getInputProps()} />
-																							<div className="dropzone-previews flex">
-																								<div className="dropzone-style-1">
-																									<div className="center-ver-hor dropzone-previews flex">{this.state.files.length > 0 ? <Row><span className="text-left">{thumbs}</span></Row> :
-																										<div className="text-center fa-2x icon-cloud-upload mr-2 ">
-																											<h5 className="text-center dz-default dz-message">Klik untuk upload dokumen</h5>
+															{selectedOption && selectedOption.value === "Rekomendasi Perbaikan" ? (
+																<FormGroup>
+																	<label className="row-form-label">Upload Dokumen  &#40;Opsional&#41; :</label>
+																	<div className="row-md-10">
+																		<Field name="dokumen">
+																			{({ field, form }) => (
+																				<DropzoneWrapper
+																					className=""
+																					onDrop={(e) => {
+																						this.onDrop(e);
+																						form.setFieldValue(field.name, e);
+																					}}
+																				>
+																					{({ getRootProps, getInputProps, isDragActive }) => {
+																						return (
+																							<div {...getRootProps()} className={"dropzone card p-3 " + (isDragActive ? "dropzone-drag-active" : "")}>
+																								<input {...getInputProps()} />
+																								<div className="dropzone-previews flex">
+																									<div className="dropzone-style-1">
+																										<div className="center-ver-hor dropzone-previews flex">{this.state.files.length > 0 ? <Row><span className="text-left">{thumbs}</span></Row> :
+																											<div className="text-center fa-2x icon-cloud-upload mr-2 ">
+																												<h5 className="text-center dz-default dz-message">Klik untuk upload dokumen</h5>
+																											</div>
+																										}
 																										</div>
-																									}
-																									</div>
-																								</div>																							</div>
-																							<div className="d-flex align-items-center">
-																								<small className="ml-auto">
-																									<button
-																										type="button"
-																										className="btn btn-link"
-																										onClick={(e) => {
-																											this.clearFiles(e);
-																											form.setFieldValue(field.name, []);
-																										}}
-																									>
-																										Reset dokumen
-																									</button>
-																								</small>
+																									</div>																							</div>
+																								<div className="d-flex align-items-center">
+																									<small className="ml-auto">
+																										<button
+																											type="button"
+																											className="btn btn-link"
+																											onClick={(e) => {
+																												this.clearFiles(e);
+																												form.setFieldValue(field.name, []);
+																											}}
+																										>
+																											Reset dokumen
+																										</button>
+																									</small>
+																								</div>
 																							</div>
-																						</div>
-																					);
-																				}}
-																			</DropzoneWrapper>
-																		)}
-																	</Field>
-																	<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
-																	<p className="mrgn-top-5">
-																		Ukuran setiap dokumen maksimal 15mb
-																	</p>
-																</div>
-															</FormGroup>
+																						);
+																					}}
+																				</DropzoneWrapper>
+																			)}
+																		</Field>
+																		<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
+																		<p className="mrgn-top-5">
+																			Ukuran setiap dokumen maksimal 15mb
+																		</p>
+																	</div>
+																</FormGroup>
+															) : (
+																<FormGroup>
+																	<label className="row-form-label">Upload Dokumen <span className=" text-danger">*</span>:</label>
+																	<div className="row-md-10">
+																		<Field name="dokumen">
+																			{({ field, form }) => (
+																				<DropzoneWrapper
+																					className=""
+																					onDrop={(e) => {
+																						this.onDrop(e);
+																						form.setFieldValue(field.name, e);
+																					}}
+																				>
+																					{({ getRootProps, getInputProps, isDragActive }) => {
+																						return (
+																							<div {...getRootProps()} className={"dropzone card p-3 " + (isDragActive ? "dropzone-drag-active" : "")}>
+																								<input {...getInputProps()} />
+																								<div className="dropzone-previews flex">
+																									<div className="dropzone-style-1">
+																										<div className="center-ver-hor dropzone-previews flex">{this.state.files.length > 0 ? <Row><span className="text-left">{thumbs}</span></Row> :
+																											<div className="text-center fa-2x icon-cloud-upload mr-2 ">
+																												<h5 className="text-center dz-default dz-message">Klik untuk upload dokumen</h5>
+																											</div>
+																										}
+																										</div>
+																									</div>																							</div>
+																								<div className="d-flex align-items-center">
+																									<small className="ml-auto">
+																										<button
+																											type="button"
+																											className="btn btn-link"
+																											onClick={(e) => {
+																												this.clearFiles(e);
+																												form.setFieldValue(field.name, []);
+																											}}
+																										>
+																											Reset dokumen
+																										</button>
+																									</small>
+																								</div>
+																							</div>
+																						);
+																					}}
+																				</DropzoneWrapper>
+																			)}
+																		</Field>
+																		<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
+																		<p className="mrgn-top-5">
+																			Ukuran setiap dokumen maksimal 15mb
+																		</p>
+																	</div>
+																</FormGroup>
+															)}
 															<FormGroup>
 																<div className="row-xl-10">
 																	<Button color className="color-3e3a8e" type="submit">
@@ -322,8 +376,8 @@ class JawabanPencabutanSanksi extends Component {
 				<Modal isOpen={this.state.modal} toggle={this.toggleModal}>
 					<ModalBody>Apakah anda yakin ingin mengubah jawaban sebelumnya?</ModalBody>
 					<ModalFooter>
-						<Button color="primary" onClick={this.handleSimpan}>
-							Ya
+						<Button color className=" btn-login" onClick={this.handleSimpan}>
+							<span className=" font-color-white">Ya</span>
 						</Button>{" "}
 						<Button color="secondary" onClick={this.toggleModal}>
 							Tidak

pages/app/perpanjangan-sanksi/detail.js

@@ -0,0 +1,76 @@
+import React, { Component } from "react";
+import { Row, Col, Card, CardBody, FormGroup, Input, Button, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, CardTitle } from "reactstrap";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import DetailSanksi from "@/components/PerpanjanganSanksi/DetailSanksi";
+import Link from "next/link";
+import DetailPT from "@/components/Main/DetailPT";
+import { getOneSanksi, addRekomendasiDelegasi } from "@/actions/sanksi";
+import Loader from "@/components/Common/Loader";
+import { connect } from "react-redux";
+import InputTanggal from "../../../components/PerpanjanganSanksi/InputTanggal";
+
+
+class Detail extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			sanksi: {},
+			files: [],
+			pt: {},
+			data: {},
+		};
+	}
+
+	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+	componentDidMount = async () => {
+		const { query, token } = this.props;
+		const idSanksi = query.id;
+		const sanksi = await getOneSanksi(token, idSanksi, { all: true });
+		const pt = sanksi.data.laporan.pt;
+		this.setState({ sanksi, pt });
+
+	};
+
+
+	render() {
+		const { files, sanksi, pt } = this.state;
+		const { query, token } = this.props;
+		return (
+			<ContentWrapper unwrap>
+				{/* <Header /> */}
+				<div className="p-3">
+					<div className="content-heading">
+						<span className="font-color-white">
+							Perpanjangan Sanksi
+						</span>
+						<div className="ml-auto">
+							<Link href="/app/sanksi">
+								<Button className="color-3e3a8e" color>
+									<span className="font-color-white">
+										&lt; Kembali
+									</span>
+								</Button>
+							</Link>
+						</div>
+					</div>
+					{sanksi.data && (
+						<Row>
+
+							<Col xl="9">
+								<DetailSanksi data={sanksi.data} />
+								<InputTanggal query={query} token={token} data={sanksi.data} />
+							</Col>
+							<Col lg="3">{pt ? <DetailPT data={pt} /> : <Loader />}</Col>
+						</Row>
+					)}
+				</div>
+			</ContentWrapper>
+		);
+	}
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Detail);

pages/app/perpanjangan-sanksi/index.js

@@ -0,0 +1,46 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Row, Col } from "reactstrap";
+import { getPelaporan } from "@/actions/pelaporan";
+import { getSanksi } from "@/actions/sanksi";
+import TableLaporan from "@/components/PerpanjanganSanksi/TableLaporan";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+
+class PerpanjanganSanksi extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			pelaporan: {},
+			graph: {},
+			tahun: new Date().getFullYear(),
+			sanksi: {}
+		};
+	}
+
+	componentDidMount = async () => {
+		const { token } = this.props;
+		const pelaporan = await getPelaporan(token, { sanksi: true });
+		const sanksi = await getSanksi(token)
+		this.setState({ pelaporan, sanksi });
+		console.log(this.state.sanksi)
+	};
+
+	render() {
+		const { pelaporan, sanksi } = this.state;
+		return (
+			<ContentWrapper>
+				<div className="content-heading">
+					<span className="font-color-white">Perpanjangan Masa Sanksi</span>
+				</div>
+				<Row>
+					{/* <Col lg="12">{graph?.data ? <CaseProgress data={graph.data} nextButton={this.nextButton} prevButton={this.prevButton} tahun={this.state.tahun} excel={this.excel} /> : <Loader />}</Col> */}
+					<Col lg="12">{sanksi?.data ? <TableLaporan status noBy listData={pelaporan.data} to="/app/perpanjangan-sanksi/detail" linkName="Detail" /> : <Loader />}</Col>
+				</Row>
+			</ContentWrapper>
+		);
+	}
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(PerpanjanganSanksi);

pages/app/rekomendasi-delegasi/detail.js

@@ -0,0 +1,87 @@
+import React, { Component } from "react";
+import { Row, Col, Card, CardBody, FormGroup, Input, Button, Modal, ModalHeader, ModalBody, ModalFooter, CardHeader, CardTitle } from "reactstrap";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import DetailSanksi from "@/components/RekomendasiDelegasi/DetailSanksi";
+import TableRiwayat from "@/components/RekomendasiDelegasi/TableRiwayat"
+import InputRekomendasi from "@/components/RekomendasiDelegasi/InputRekomendasi";
+import Link from "next/link";
+import DetailPT from "@/components/Main/DetailPT";
+import { getOneSanksi, addRekomendasiDelegasi } from "@/actions/sanksi";
+import Loader from "@/components/Common/Loader";
+import { connect } from "react-redux";
+
+class Detail extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			sanksi: {},
+			files: [],
+			pt: {},
+			data: {},
+			perbaikan: {},
+		};
+	}
+
+	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+	componentDidMount = async () => {
+		const { query, token } = this.props;
+		const idSanksi = query.id;
+		const sanksi = await getOneSanksi(token, idSanksi, { all: true });
+		const pt = sanksi.data.laporan.pt;
+		const perbaikan = sanksi.data.perbaikan.map((e) => e.dokumen)
+		this.setState({ sanksi, pt, perbaikan });
+		console.log(perbaikan)
+
+	};
+
+
+	render() {
+		const { files, sanksi, pt, perbaikan } = this.state;
+		const { query, token } = this.props;
+		return (
+			<ContentWrapper unwrap>
+				{/* <Header /> */}
+				<div className="p-3">
+					<div className="content-heading">
+						<span className="font-color-white">
+							Rekomendasi Delegasi
+						</span>
+						<div className="ml-auto">
+							<Link href="/app/sanksi">
+								<Button className="color-3e3a8e" color>
+									<span className="font-color-white">
+										&lt; Kembali
+									</span>
+								</Button>
+							</Link>
+						</div>
+					</div>
+					{sanksi.data && (
+						<Row>
+
+							<Col xl="9">
+								<DetailSanksi data={sanksi.data} />
+								<Card className="card-default">
+									<CardHeader>
+										<CardTitle>Riwayat</CardTitle>
+									</CardHeader>
+									<CardBody>
+										<TableRiwayat data={sanksi.data} perbaikan={sanksi.data.perbaikan} />
+									</CardBody>
+								</Card>
+								<InputRekomendasi query={query} token={token} data={sanksi.data} />
+							</Col>
+							<Col lg="3">{pt ? <DetailPT data={pt} /> : <Loader />}</Col>
+						</Row>
+					)}
+				</div>
+			</ContentWrapper>
+		);
+	}
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Detail);

pages/app/rekomendasi-delegasi/index.js

@@ -0,0 +1,44 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Row, Col } from "reactstrap";
+import { getPelaporan } from "@/actions/pelaporan";
+import { getSanksi } from "@/actions/sanksi";
+import TableLaporan from "@/components/RekomendasiDelegasi/TableLaporan";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+
+class RekomendasiDelegasi extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			pelaporan: {},
+			graph: {},
+			tahun: new Date().getFullYear(),
+		};
+	}
+
+	componentDidMount = async () => {
+		const { token } = this.props;
+		const pelaporan = await getSanksi(token, { delegasi: true, sanksi: true, cabutSanksi: true });
+		this.setState({ pelaporan });
+	};
+
+	render() {
+		const { pelaporan } = this.state;
+		return (
+			<ContentWrapper>
+				<div className="content-heading">
+					<span className="font-color-white">
+						Rekomendasi Delegasi</span>
+				</div>
+				<Row>
+					{/* <Col lg="12">{graph?.data ? <CaseProgress data={graph.data} nextButton={this.nextButton} prevButton={this.prevButton} tahun={this.state.tahun} excel={this.excel} /> : <Loader />}</Col> */}
+					<Col lg="12">{pelaporan?.data ? <TableLaporan status noBy listData={pelaporan.data} to="/app/rekomendasi-delegasi/detail" linkName="Detail" /> : <Loader />}</Col>
+				</Row>
+			</ContentWrapper>
+		);
+	}
+}
+
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(RekomendasiDelegasi);

pages/app/riwayat/banding.js

@@ -0,0 +1,64 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class Banding extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+            laporan: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { banding: true });
+        const laporan = laporanPembina.data.sanksi.map((e) => e.laporan)
+        this.setState({ laporanPembina, laporan });
+    };
+
+    render() {
+        const { laporanPembina, laporan } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Banding);

pages/app/riwayat/cabutSanksi.js

@@ -0,0 +1,63 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class cabutSanksi extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { cabutSanksi: true });
+        const laporan = laporanPembina.data.sanksi.map((e) => e.laporan)
+        this.setState({ laporanPembina, laporan });
+    };
+
+    render() {
+        const { laporanPembina, laporan } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(cabutSanksi);

pages/app/riwayat/detail.js

@@ -0,0 +1,63 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class laporanByPembina extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+            // pembina: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina);
+        this.setState({ laporanPembina });
+    };
+
+    render() {
+        const { laporanPembina } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporanPembina.data.laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(laporanByPembina);

pages/app/riwayat/index.js

@@ -1,11 +1,7 @@
 import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import Link from "next/link";
-import { Row, Col, Button } from "reactstrap";
-import { getPelaporan } from "@/actions/pelaporan";
-import { getGraph, getExcel } from "@/actions/graph";
-import CaseProgress from "@/components/Pelaporan/CaseProgress";
-import TableLaporan from "@/components/Pelaporan/TableLaporan";
+import { Row, Col, Button, Card, CardBody, Table } from "reactstrap";
 import { connect } from "react-redux";
 import Loader from "@/components/Common/Loader";
 import Router from "next/router";
@@ -13,15 +9,40 @@ import TableRiwayat from "@/components/Riwayat/TableRiwayat";
 import ChartData from "@/components/Riwayat/ChartData";
 import ChartDataBar from "@/components/Riwayat/ChartDataBar";
 import Maps from "@/components/Riwayat/Maps"
-import ChartRadar from "../../../components/Riwayat/ChartRadarBelum";
-import ChartRadarBelum from "../../../components/Riwayat/ChartRadarBelum";
-import ChartRadarSudah from "../../../components/Riwayat/ChartRadarSudah";
-import TableRadar from "../../../components/Riwayat/TableRadar";
 import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+
+
 
 
 class Riwayat extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      jumlahStatusLaporan: {}
+    };
+  }
+  handleClick = (e, idPembina) => {
+    e.preventDefault();
+    Router.push({
+      pathname: "/app/riwayat/detail",
+      query: { id: idPembina },
+    });
+  };
+
+  componentDidMount = async () => {
+    const { token } = this.props;
+    const jumlahStatusLaporan = await getjumlahStatusLaporan(token);
+    this.setState({ jumlahStatusLaporan });
+    console.log(jumlahStatusLaporan)
+  };
+
+
   render() {
+    const { jumlahStatusLaporan } = this.state;
     return (
       <ContentWrapper>
         <div className="content-heading">
@@ -35,14 +56,15 @@ class Riwayat extends Component {
             <Maps />
           </Col>
           <Col lg="6">
-            <ChartRadarBelum />
+            <ChartRadarA />
           </Col>
           <Col lg="6">
-            <ChartRadarSudah />
+            <ChartRadarB />
+          </Col>
+          <Col lg="12">
+            {jumlahStatusLaporan?.data ? <TableRadar listData={jumlahStatusLaporan.data} to="/app/riwayat/detail" jadwal="/app/riwayat/penjadwalan" pemeriksaan="/app/riwayat/pemeriksaan" sanksi="/app/riwayat/sanksi" keberatan="/app/riwayat/keberatan" banding="/app/riwayat/banding" perbaikan="/app/riwayat/perbaikan" cabutSanksi="/app/riwayat/cabutSanksi" linkName="Lihat" /> : <Loader />}
           </Col>
-          <TableRadar />
           <ChartData />
-          {/* <TableRiwayat /> */}
           <Col lg="12">
             <TableRiwayatt />
           </Col>
@@ -51,4 +73,5 @@ class Riwayat extends Component {
     );
   }
 }
-export default Riwayat;
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Riwayat);

pages/app/riwayat/keberatan.js

@@ -0,0 +1,64 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class Keberatan extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+            laporan: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { keberatan: true });
+        const laporan = laporanPembina.data.sanksi.map((e) => e.laporan)
+        this.setState({ laporanPembina, laporan });
+    };
+
+    render() {
+        const { laporanPembina, laporan } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Keberatan);

pages/app/riwayat/pemeriksaan.js

@@ -0,0 +1,63 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class Pemeriksaan extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { pemeriksaan: true });
+        // const pembina = laporanPembina.data.laporan.map((e) => e.pt.pembina)
+        this.setState({ laporanPembina, });
+    };
+
+    render() {
+        const { laporanPembina } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporanPembina.data.laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Pemeriksaan);

pages/app/riwayat/penjadwalan.js

@@ -0,0 +1,62 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class Penjadwalan extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { penjadwalan: true });
+        this.setState({ laporanPembina, });
+    };
+
+    render() {
+        const { laporanPembina } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporanPembina.data.laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Penjadwalan);

pages/app/riwayat/perbaikan.js

@@ -0,0 +1,64 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class Perbaikan extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+            laporan: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { perbaikan: true });
+        const laporan = laporanPembina.data.sanksi.map((e) => e.laporan)
+        this.setState({ laporanPembina, laporan });
+    };
+
+    render() {
+        const { laporanPembina, laporan } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(Perbaikan);

pages/app/riwayat/sanksi.js

@@ -0,0 +1,64 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import Link from "next/link";
+import { Row, Col, Button } from "reactstrap";
+import { connect } from "react-redux";
+import Loader from "@/components/Common/Loader";
+import Router from "next/router";
+import TableRiwayat from "@/components/Riwayat/TableRiwayat";
+import ChartData from "@/components/Riwayat/ChartData";
+import ChartDataBar from "@/components/Riwayat/ChartDataBar";
+import Maps from "@/components/Riwayat/Maps"
+import TableRiwayatt from "../../../components/Riwayat/TableRiwayatt";
+import TableRadar from "../../../components/Riwayat/TableRadar";
+import { getjumlahStatusLaporan } from "../../../actions/graph";
+import { getOneLaporan, getPelaporan, getlaporanByPembina } from "../../../actions/pelaporan";
+import ChartRadarB from "../../../components/Riwayat/ChartRadarB";
+import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
+import TableLaporan from "../../../components/Riwayat/TableLaporan";
+
+
+
+class sanksi extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            laporanPembina: {},
+            laporan: {},
+
+        };
+    }
+
+    static getInitialProps = async ({ query }) => {
+        return { query };
+    }
+
+    componentDidMount = async () => {
+        const { token, query } = this.props;
+        const id = query.id;
+        const idPembina = id;
+        const laporanPembina = await getlaporanByPembina(token, idPembina, { sanksi: true });
+        const laporan = laporanPembina.data.sanksi.map((e) => e.laporan)
+        this.setState({ laporanPembina, laporan });
+    };
+
+    render() {
+        const { laporanPembina, laporan } = this.state;
+        return (
+            <ContentWrapper>
+                <div className="content-heading">
+                    <span className="font-color-white">List Laporan Wilayah</span>
+                </div>
+                <Row>
+                    <Col lg="12">
+                        {laporanPembina.data && < TableLaporan listData={laporan} to="/app/pelaporan/detail" linkName="Detail" />}
+
+
+                    </Col>
+                </Row>
+            </ContentWrapper>
+        );
+    }
+}
+const mapStateToProps = (state) => ({ user: state.user, token: state.token });
+export default connect(mapStateToProps)(sanksi);

pages/app/tuntas/detail.js

@@ -24,7 +24,7 @@ class DetailPelaporan extends Component {
 
 	componentDidMount = async () => {
 		const { token, query } = this.props;
-		const pelaporan = await getOneLaporan(this.props.token, query.id);
+		const pelaporan = await getOneLaporan(this.props.token, query.id + "?aktif=false");
 		await createLog(token, { aktivitas: `Mengakses halaman detail Pelaporan Tuntas dengan No. Laporan ${pelaporan.data.no_laporan}`, menu: "Pelaporan" });
 		this.setState({ pelaporan });
 	};