commit

actions/PT.js

@@ -18,3 +18,20 @@ export const getPT = async (params) => {
 		return false;
 	}
 };
+
+export const getPembina = async (params) => {
+	try {
+		let url = "/perguruan-tinggi/lembaga";
+		if (params) {
+			url += "?";
+			if (params.search) {
+				url += `search=${params.search}`;
+			}
+		}
+		const response = await get(url);
+		return response.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};

components/Extras/calendar.view.js

@@ -21,7 +21,7 @@ class Calendar extends Component {
 	calendarHeader = {
 		left: "prev,next today",
 		center: "title",
-		right: "dayGridMonth,timeGridWeek,timeGridDay,listWeek",
+		right: "dayGridMonth,timeGridWeek,timeGridDay",
 	};
 
 	constructor(props) {
@@ -132,7 +132,7 @@ class Calendar extends Component {
 						<div className="col-xl-4 col-lg-5">
 							<div className="row">
 								<div className="col-lg-12 col-md-6 col-12">
-									{selectedOption && selectedOption.value === "ditutup" ? (
+									{selectedOption && selectedOption.value === "Ditutup" ? (
 										""
 									) : (
 										<Card className="card-default" title="">
@@ -157,7 +157,7 @@ class Calendar extends Component {
 											</CardBody>
 										</Card>
 									)}
-									{laporan ? <DetailLaporan query={this.props.query} data={laporan} handleChangeSelect={this.handleChangeSelect} /> : ""}
+									{laporan && <DetailLaporan query={this.props.query} data={laporan} handleChangeSelect={this.handleChangeSelect} />}
 								</div>
 							</div>
 						</div>

components/Keberatan/Riwayat.js

@@ -3,7 +3,6 @@ import moment from "moment";
 import { Card, CardHeader, CardBody, CardTitle } from "reactstrap";
 
 function Riwayat({ data }) {
-	const jawaban = data.sanksi.keberatan.jawaban;
 	return (
 		<Card className="card-default">
 			<CardHeader>
@@ -21,13 +20,13 @@ function Riwayat({ data }) {
 							</tr>
 						</thead>
 						<tbody>
-							{jawaban ? (
+							{data ? (
 								<tr>
-									<td>{moment(jawaban.createAt).format("DD MMMM YYYY")}</td>
-									<td>{jawaban.status}</td>
-									<td>{jawaban.description}</td>
+									<td>{moment(data.createAt).format("DD MMMM YYYY")}</td>
+									<td>{data.status}</td>
+									<td>{data.description}</td>
 									<td>
-										{jawaban.files.map((e) => (
+										{data.files.map((e) => (
 											<>
 												<em className="fa-lg far fa-file-code"></em>
 												<a className="text-muted" href={`data:${e.type};base64, ${Buffer.from(e.data).toString("base64")}`} download={e.name}>

components/Keberatan/TableSanksi.js

@@ -0,0 +1,65 @@
+import Datatable from "@/components/Tables/Datatable";
+import { Button } from "reactstrap";
+import Link from "next/link";
+import moment from "moment";
+
+function TableSanksi({ listData, to, linkName }) {
+	return (
+		<div className="card b">
+			<div className="card-body">
+				<Datatable options={{ responsive: true }}>
+					<table className="table w-100">
+						<thead>
+							<tr>
+								<th>Nomor Sanksi</th>
+								<th>Keterangan Sanksi</th>
+								<th>Created</th>
+								<th>Status</th>
+								<th></th>
+							</tr>
+						</thead>
+						<tbody>
+							{listData.length
+								? listData.map((data) => {
+										return (
+											<tr key={data._id}>
+												<td>{data.sanksi.no_sanksi}</td>
+												<td>
+													<div className="media align-items-center">
+														<div className="media-body d-flex">
+															<div>
+																<h4 className="m-0">Universitas Satyagama</h4>
+																<p>{data.sanksi.description}</p>
+															</div>
+														</div>
+													</div>
+												</td>
+												<td>{moment(data.sanksi.createdAt).fromNow()}</td>
+												<td>{data.sanksi.keberatan.jawaban ? <div className="badge badge-info">Sudah Dijawab</div> : <div className="badge badge-danger">Belum Dijawab</div>}</td>
+												<td>
+													<div className="ml-auto">
+														<Link
+															href={{
+																pathname: to,
+																query: { noSanksi: data.sanksi.no_sanksi, ptId: data.pt_id },
+															}}
+														>
+															<Button color="primary" size="sm">
+																{linkName}
+															</Button>
+														</Link>
+													</div>
+												</td>
+											</tr>
+										);
+								  })
+								: ""}
+						</tbody>
+					</table>
+				</Datatable>
+			</div>
+		</div>
+	);
+}
+
+export default TableSanksi;

components/Main/DetailLaporan.js

@@ -61,8 +61,8 @@ function DetailLaporan({ data, noTitle = false }) {
 						<Scrollable height="120px" className="list-group">
 							<table className="table table-bordered bg-transparent">
 								<tbody>
-									{data.files.map((e) => (
-										<tr>
+									{data.files.map((e, index) => (
+										<tr key={`files-${index}`}>
 											<td>
 												<em className="fa-lg far fa-file-code"></em>
 											</td>

components/Main/TableLaporan.js

@@ -33,7 +33,13 @@ function TableLaporan({ listData, to, linkName, status = false }) {
 												</div>
 											</div>
 										</td>
-										{status ? <td>{data.status}</td> : ""}
+										{status ? (
+											<td>
+												<div className="badge badge-info">{data.status}</div>
+											</td>
+										) : (
+											""
+										)}
 										<td>{moment(data.createdAt).fromNow()}</td>
 										<td>
 											<div className="ml-auto">

components/Main/Timeline.js

@@ -1,59 +1,58 @@
 import moment from "moment";
 
 function Timeline({ data }) {
-	const date = [...new Set(data.data.map((e) => moment(e.createdAt).format("DD MMMM YYYY")))];
+	const date = data && [...new Set(data.map((e) => moment(e.createdAt).format("DD MMMM YYYY")))];
 	return (
 		<ul className="timeline">
-			{date.map((value) => (
-				<>
-					<li className="timeline-separator" data-datetime={value}></li>
-					{data.data
-						.filter((e) => moment(e.createdAt).format("DD MMMM YYYY") === value)
-						.map((data, i) => (
-							<>
-								<li className={data.role === "PT" ? "timeline-inverted" : ""}>
-									<div className="timeline-badge info">
-										<em className="far fa-file"></em>
-									</div>
+			{data &&
+				date.map((value) => (
+					<>
+						<li className="timeline-separator" data-datetime={value}></li>
+						{data
+							.filter((e) => moment(e.createdAt).format("DD MMMM YYYY") === value)
+							.map((data, i) => (
+								<>
+									<li className={data.role === "PT" ? "timeline-inverted" : ""}>
+										<div className="timeline-badge info">
+											<em className="far fa-file"></em>
+										</div>
 
-									<div className="timeline-card">
-										<div className="popover right">
-											<div className="arrow"></div>
-											<div className="popover-body">
-												<div className="d-flex align-items-center mb-3">
-													<img className="mr-3 rounded-circle thumb48" src="/static/img/user/admin.png" alt="Avatar" />
-													<p className="m-0">
-														<strong>{data.role_name}</strong>
-														<br />
-														{data.description}
-													</p>
-												</div>
-												{data.data.files ? (
-													<>
-														<p className="text-muted my-2">Dokumen</p>
-														{data.data.files.map((e) => (
-															<div className="media bb p-2">
-																<div className="media-body">
-																	<p className="m-0">
-																		<a href={`data:${e.type};base64, ${Buffer.from(e.data).toString("base64")}`} download={e.name}>
-																			<strong>{e.name}</strong>
-																		</a>
-																	</p>
+										<div className="timeline-card">
+											<div className="popover right">
+												<div className="arrow"></div>
+												<div className="popover-body">
+													<div className="d-flex align-items-center mb-3">
+														<img className="mr-3 rounded-circle thumb48" src="/static/img/user/admin.png" alt="Avatar" />
+														<p className="m-0">
+															<strong>{data.role_name}</strong>
+															<br />
+															{data.description}
+														</p>
+													</div>
+													{data.files && (
+														<>
+															<p className="text-muted my-2">Dokumen</p>
+															{data.files.map((e) => (
+																<div className="media bb p-2">
+																	<div className="media-body">
+																		<p className="m-0">
+																			<a href={`data:${e.type};base64, ${Buffer.from(e.data).toString("base64")}`} download={e.name}>
+																				<strong>{e.name}</strong>
+																			</a>
+																		</p>
+																	</div>
 																</div>
-															</div>
-														))}
-													</>
-												) : (
-													""
-												)}
+															))}
+														</>
+													)}
+												</div>
 											</div>
 										</div>
-									</div>
-								</li>
-							</>
-						))}
-				</>
-			))}
+									</li>
+								</>
+							))}
+					</>
+				))}
 
 			<li className="timeline-end">
 				<a className="timeline-badge">

components/PT/Keberatan/ModalPermohonan.js

@@ -75,7 +75,7 @@ export class ModalPermohonan extends Component {
 				formdata.append("files", e);
 			});
 
-			const added = await addKeberatan({ noSanksi, ptId: user.data.peran[0].organisasi.id }, formdata);
+			const added = await addKeberatan({ noSanksi, ptId: user.peran[0].organisasi.id }, formdata);
 			// formdata.append("keberatan", added.add.sanksi.keberatan._id);
 			// formdata.append("data", added.add.sanksi.keberatan._id);
 			// formdata.append("model", "Keberatan");

components/PT/TableSanksi.js

@@ -12,7 +12,7 @@ function TableSanksi({ listData, to, linkName }) {
 							<th>Nomor Sanksi</th>
 							<th>Keterangan Sanksi</th>
 							<th>Created</th>
-							<th></th>
+							<th>Status</th>
 						</tr>
 					</thead>
 					<tbody>

components/PT/TableSanksiJawaban.js

@@ -0,0 +1,55 @@
+import moment from "moment";
+import { Button, Table } from "reactstrap";
+import Link from "next/link";
+
+function TableSanksi({ listData, to, linkName }) {
+	return (
+		<div className="card b">
+			<div className="card-body">
+				<Table className="table w-100">
+					<thead>
+						<tr>
+							<th>Nomor Sanksi</th>
+							<th>Keterangan Sanksi</th>
+							<th>Created</th>
+							<th>Status</th>
+						</tr>
+					</thead>
+					<tbody>
+						{listData.map((data) => {
+							return (
+								<tr key={data._id}>
+									<td>{data.sanksi.no_sanksi}</td>
+									<td className="text-nowrap">
+										<div className="media align-items-center">
+											{/* <img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" /> */}
+											<div className="media-body d-flex">
+												<div>
+													<h4 className="m-0">Universitas Satyagama</h4>
+													{/* <small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small> */}
+													<p>{data.sanksi.description}</p>
+												</div>
+											</div>
+										</div>
+									</td>
+									<td>{moment(data.sanksi.createAt).format("DD MMMM YYYY")}</td>
+									<td>
+										{data.sanksi.keberatan?.jawaban || data.sanksi.banding?.jawaban || data.sanksi.cabut_sanksi?.jawaban ? (
+											<Link href={{ pathname: to, query: { noSanksi: data.sanksi.no_sanksi } }}>
+												<Button color="primary">{linkName}</Button>
+											</Link>
+										) : (
+											<div className="badge-info badge">Menunggu Jawaban</div>
+										)}
+									</td>
+								</tr>
+							);
+						})}
+					</tbody>
+				</Table>
+			</div>
+		</div>
+	);
+}
+
+export default TableSanksi;

components/Pelaporan/InputData.js

@@ -4,6 +4,7 @@ import { getPelanggaran } from "@/actions/pelanggaran";
 import { createPelaporan } from "@/actions/pelaporan";
 import Select from "react-select";
 import { Row, Col, FormGroup, Input } from "reactstrap";
+import { connect } from "react-redux";
 
 let Dropzone = null;
 class DropzoneWrapper extends Component {
@@ -95,9 +96,11 @@ export class InputData extends Component {
 	};
 
 	onSubmit = async (e) => {
+		const { user } = this.props;
 		e.preventDefault();
 		const formdata = new FormData();
 		formdata.append("number", this.state.pelaporanNumber);
+		formdata.append("user_id", user.id);
 		formdata.append("pt_id", this.props.query.ptId);
 		formdata.append("description", this.state.keteranganLaporan);
 		formdata.append("pelanggaran", this.state.selectedOptionMulti.map((e) => e.value).join());
@@ -183,4 +186,5 @@ export class InputData extends Component {
 	}
 }
 
-export default InputData;
+const mapStateToProps = (state) => ({ user: state.user });
+export default connect(mapStateToProps)(InputData);

components/Pemeriksaan/InputEvaluasi.js

@@ -156,7 +156,7 @@ export default class InputEvaluasi extends Component {
 					<FormGroup>
 						<div>
 							<button className="btn btn-sm btn-primary" type="submit">
-								Submit Evaluasi
+								Simpan Evaluasi
 							</button>
 						</div>
 					</FormGroup>

components/Pemeriksaan/TableRiwayat.js

@@ -6,20 +6,20 @@ function TableRiwayat({ data }) {
 			<table className="table table-striped my-4 w-100">
 				<thead>
 					<tr>
-                        <th>Tanggal Dibuat</th>
+						<th>Tanggal Dibuat</th>
 						<th>Tanggal Dokumen</th>
 						<th>Judul Dokumen</th>
 						<th>File Pendukung</th>
 					</tr>
 				</thead>
 				<tbody>
-					{data.penjadwalan.pemeriksaan.map((e) => (
-						<tr>
+					{data.penjadwalan.pemeriksaan.map((e, index) => (
+						<tr key={`riwayatPemeriksaan-${index}`}>
 							<td>{moment(e.createdAt).format("D MMMM YYYY")}</td>
 							<td>{moment(e.date).format("D MMMM YYYY")}</td>
 							<td>{e.title}</td>
 							<td>
-								{e.files.map((e) => (
+								{e.files.map((e, index) => (
 									<>
 										<em className="fa-lg far fa-file-code"></em>
 										<a className="text-muted" href={`data:${e.type};base64, ${Buffer.from(e.data).toString("base64")}`} download={e.name}>

components/Penjadwalan/DetailLaporan.js

@@ -4,6 +4,11 @@ import Scrollable from "@/components/Common/Scrollable";
 import { addStatus } from "@/actions/pelaporan";
 import { Card, CardBody, CardHeader, CardTitle } from "reactstrap";
 
+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) {
@@ -13,21 +18,26 @@ export class DetailLaporan extends Component {
 		};
 	}
 
-	componentDidMount = async () => {
-		this.setState({ selectedOption: { value: "ditindaklanjuti", label: "Ditindaklanjuti Dikti Ristek", className: "State-ACT" } });
-		// const tes = await addStatus({ number, ptId }, { status: data.status || "ditindaklanjuti" });
+	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 });
-		const tes = await addStatus({ number, ptId }, { status: selectedOption.value });
+		await addStatus({ number, ptId }, { status: selectedOption.value });
 	};
 
 	render() {
 		const { data } = this.props;
-		console.log(data);
 		return (
 			<Card className="card b">
 				<CardHeader>
@@ -41,17 +51,7 @@ export class DetailLaporan extends Component {
 									<strong>Status</strong>
 								</td>
 								<td>
-									<Select
-										instanceId={selectInstanceId + 1}
-										value={this.state.selectedOption}
-										onChange={this.handleChangeSelect}
-										options={[
-											{ value: "ditindaklanjuti", 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" },
-										]}
-										required
-									/>
+									<Select instanceId={selectInstanceId + 1} value={this.state.selectedOption} onChange={this.handleChangeSelect} options={status} required />
 								</td>
 							</tr>
 							<tr>

pages/app/keberatan/detail.js

@@ -11,6 +11,7 @@ import { getSanksi } from "@/actions/sanksi";
 import { addJawabanKeberatan } from "@/actions/keberatan";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Card, CardBody, FormGroup, Input, Button } from "reactstrap";
+import { getPT } from "@/actions/PT";
 
 let Dropzone = null;
 class DropzoneWrapper extends Component {
@@ -35,12 +36,19 @@ class DetailKeberatan extends Component {
 			selectedOption: null,
 			files: [],
 			keterangan: "",
+			sanksi: {},
 		};
 	}
 
 	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+	componentDidMount = async () => {
+		const { query } = this.props;
 		const sanksi = await getSanksi(query);
-		return { sanksi, query };
+		const pt = await getPT({ id: query.ptId });
+		this.setState({ pt, sanksi });
 	};
 
 	handleChangeSelect = (selectedOption) => {
@@ -99,8 +107,7 @@ class DetailKeberatan extends Component {
 	};
 
 	render() {
-		const { files } = this.state;
-		const { sanksi } = this.props;
+		const { files, sanksi, pt } = this.state;
 
 		const thumbs = files.map((file, index) => (
 			<Col md={3} key={index}>
@@ -125,14 +132,10 @@ class DetailKeberatan extends Component {
 							<Card className="card-default">
 								<CardBody>
 									<Row>
-										<Col lg={12}>
-											<DetailSanksi data={sanksi.data[0]} />
-										</Col>
+										<Col lg={12}>{sanksi.data && sanksi.data.length && <DetailSanksi data={sanksi.data[0]} />}</Col>
 									</Row>
 									<Row>
-										<Col lg={12}>
-											<PermohonanPT data={sanksi.data[0].sanksi.keberatan} />
-										</Col>
+										<Col lg={12}>{sanksi.data && sanksi.data.length && <PermohonanPT data={sanksi.data[0].sanksi.keberatan} />}</Col>
 									</Row>
 									<Row>
 										<Col lg={12}>
@@ -199,14 +202,10 @@ class DetailKeberatan extends Component {
 								</CardBody>
 							</Card>
 						</Col>
-						<Col xl="3">
-							<DetailPT />
-						</Col>
+						<Col xl="3">{pt?.data && <DetailPT data={pt.data[0]} />}</Col>
 					</Row>
 					<Row>
-						<Col>
-							<Riwayat data={sanksi.data[0]} />
-						</Col>
+						<Col>{sanksi.data && sanksi.data.length && <Riwayat data={sanksi.data[0].sanksi.keberatan.jawaban} />}</Col>
 					</Row>
 				</div>
 			</ContentWrapper>

pages/app/keberatan/index.js

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col } from "reactstrap";
 import CaseProgress from "@/components/Main/CaseProgress";
-import TableSanksi from "@/components/Main/TableSanksi";
+import TableSanksi from "@/components/Keberatan/TableSanksi";
 import { getSanksi } from "@/actions/sanksi";
 
 class Keberatan extends Component {
@@ -11,7 +11,7 @@ class Keberatan extends Component {
 	}
 
 	static getInitialProps = async () => {
-		const sanksi = await getSanksi({keberatan: true});
+		const sanksi = await getSanksi({ keberatan: true });
 		return { sanksi };
 	};
 

pages/app/pelaporan/detail.js

@@ -6,18 +6,33 @@ import DetailLaporan from "@/components/Main/DetailLaporan";
 import Link from "next/link";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Card, CardBody } from "reactstrap";
+import { getPT } from "@/actions/PT";
 
 class DetailPelaporan extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			pt: {},
+		};
+	}
+
 	static getInitialProps = async ({ query }) => {
 		const pelaporan = await getPelaporan({ ptId: query.ptId, number: query.number });
 		return { query, pelaporan };
 	};
 
+	componentDidMount = async () => {
+		const { query } = this.props;
+		const pt = await getPT({ id: query.ptId });
+		this.setState({ pt });
+	};
+
 	render() {
+		const { pt } = this.state;
 		const { pelaporan } = this.props;
 		return (
 			<ContentWrapper unwrap>
-				<Header />
+				{/* <Header /> */}
 				<div className="p-3">
 					<div className="content-heading">
 						<div>Detail Pelaporan</div>
@@ -39,9 +54,7 @@ class DetailPelaporan extends Component {
 								</CardBody>
 							</Card>
 						</Col>
-						<Col xl="3">
-							<DetailPT />
-						</Col>
+						<Col xl="3">{pt?.data && <DetailPT data={pt.data[0]} />}</Col>
 					</Row>
 				</div>
 			</ContentWrapper>

pages/app/pelaporan/new.js

@@ -3,16 +3,31 @@ import Header from "@/components/Main/Header";
 import DetailPT from "@/components/Main/DetailPT";
 import InputData from "@/components/Pelaporan/InputData";
 import Link from "next/link";
+import { getPT } from "@/actions/PT";
 
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Card, CardHeader, CardBody } from "reactstrap";
 
 class PelaporanNew extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			pt: {},
+		};
+	}
+
 	static getInitialProps = async ({ query }) => {
 		return { query };
 	};
 
+	componentDidMount = async () => {
+		const { query } = this.props;
+		const pt = await getPT({ id: query.ptId });
+		this.setState({ pt });
+	};
+
 	render() {
+		const { pt } = this.state;
 		return (
 			<ContentWrapper unwrap>
 				{/* <Header /> */}
@@ -41,9 +56,7 @@ class PelaporanNew extends Component {
 								</CardBody>
 							</Card>
 						</Col>
-						<Col xl="3">
-							<DetailPT />
-						</Col>
+						<Col xl="3">{pt?.data && <DetailPT data={pt.data[0]} />}</Col>
 					</Row>
 				</div>
 			</ContentWrapper>

pages/app/pelaporan/search.js

@@ -3,7 +3,7 @@ import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Button, Table, Pagination, PaginationItem, PaginationLink } from "reactstrap";
 import Link from "next/link";
-import { getPT } from "@/actions/PT";
+import { getPT, getPembina } from "@/actions/PT";
 // React Slider
 import Slider from "rc-slider";
 import "rc-slider/assets/index.css";
@@ -13,11 +13,22 @@ import Select from "react-select";
 import "react-datetime/css/react-datetime.css";
 
 var pembina = [];
-
+const selectInstanceId = 1;
 class Search extends Component {
 	state = {
 		selectedOptionMulti: [],
 		data: [],
+		pembina: [],
+		search: "",
+	};
+
+	componentDidMount = async () => {
+		const dataPembina = await getPembina();
+		this.setState({ pembina: dataPembina.data });
+	};
+
+	optionsPembina = (pembina) => {
+		return pembina.map((e) => ({ value: e.id, label: e.nama, className: "State-ACT" }));
 	};
 
 	handleChangeSelectMulti = (selectedOptionMulti) => {
@@ -46,12 +57,13 @@ class Search extends Component {
 
 	fetchData = async () => {
 		const searchValue = document.getElementById("searchInput").value;
+		this.setState({ search: searchValue });
 		const jsonData = await getPT({ search: searchValue });
-		this.setState({ data: jsonData });
+		this.setState({ data: jsonData.data });
 	};
 
 	handleApplyClick = () => {
-		console.log("selectedOptionMulti : ", this.state.selectedOptionMulti);
+		// console.log("selectedOptionMulti : ", this.state.selectedOptionMulti);
 		this.fetchData();
 		if (this.state.data.length) {
 			this.renderTableData();
@@ -99,11 +111,11 @@ class Search extends Component {
 				);
 			})
 		);
-		//}
 	}
 
 	render() {
-		const { selectedOptionMulti } = this.state;
+		const { selectedOptionMulti, pembina } = this.state;
+		console.log(pembina);
 
 		return (
 			<ContentWrapper>
@@ -150,7 +162,7 @@ class Search extends Component {
 						<div className="form-group mb-4">
 							<label className="col-form-label mb-2">by Pembina</label>
 							<br />
-							<Select name="multi-select-name" isMulti simpleValue value={selectedOptionMulti} onChange={this.handleChangeSelectMulti} options={pembina} />
+							<Select instanceId={selectInstanceId + 1} isMulti value={selectedOptionMulti} onChange={this.handleChangeSelectMulti} options={pembina ? this.optionsPembina(pembina) : []} required />
 						</div>
 						<Button color="secondary" size="lg" onClick={(e) => this.handleApplyClick()}>
 							Apply

pages/app/pemantauan/index.js

@@ -3,7 +3,7 @@ import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Button, Table, Pagination, PaginationItem, PaginationLink } from "reactstrap";
 // React Slider
-import { getPT } from "@/actions/PT";
+import { getPT, getPembina } from "@/actions/PT";
 import Slider from "rc-slider";
 import "rc-slider/assets/index.css";
 // React Select
@@ -18,19 +18,22 @@ import CardTool from "@/components/Common/CardTool";
 
 import dummyData from "../PT-ID.json";
 
-var pembina = [];
-
+const selectInstanceId = 1;
 class Search extends Component {
-	static async getInitialProps(ctx) {
-		pembina = [];
-		const httpsAgent = new https.Agent({
-			rejectUnauthorized: false,
-		});
-	}
-
 	state = {
+		pembina: [],
 		selectedOptionMulti: [],
 		data: [],
+		search: "",
+	};
+
+	componentDidMount = async () => {
+		const dataPembina = await getPembina();
+		this.setState({ pembina: dataPembina.data });
+	};
+
+	optionsPembina = (pembina) => {
+		return pembina.map((e) => ({ value: e.id, label: e.nama, className: "State-ACT" }));
 	};
 
 	handleChangeSelectMulti = (selectedOptionMulti) => {
@@ -49,7 +52,6 @@ class Search extends Component {
 	};
 
 	handleClick = (e, PT_ID) => {
-		const query = { ptId: PT_ID };
 		e.preventDefault();
 		Router.push({
 			pathname: "/app/pemantauan/timeline",
@@ -59,13 +61,13 @@ class Search extends Component {
 
 	fetchData = async () => {
 		const searchValue = document.getElementById("searchInput").value;
+		this.setState({ search: searchValue });
 		const jsonData = await getPT({ search: searchValue });
-		console.log(jsonData);
-		// this.setState({ data: jsonData });
+		this.setState({ data: jsonData.data });
 	};
 
 	handleApplyClick = () => {
-		console.log("selectedOptionMulti : ", this.state.selectedOptionMulti);
+		// console.log("selectedOptionMulti : ", this.state.selectedOptionMulti);
 		this.fetchData();
 		if (this.state.data && this.state.data.length) {
 			this.renderTableData();
@@ -74,9 +76,9 @@ class Search extends Component {
 
 	handleSearchClick = () => {
 		this.fetchData();
-		// if (this.state.data && this.state.data.length) {
-		// 	this.renderTableData();
-		// }
+		if (this.state.data && this.state.data.length) {
+			this.renderTableData();
+		}
 	};
 
 	renderTableData() {
@@ -113,13 +115,11 @@ class Search extends Component {
 				);
 			})
 		);
-		//}
 	}
 
 	render() {
-		// used for react select
-		const { selectedOptionMulti } = this.state;
-
+		const { selectedOptionMulti, pembina } = this.state;
+		console.log(pembina);
 		return (
 			<ContentWrapper>
 				<div className="content-heading">
@@ -164,7 +164,7 @@ class Search extends Component {
 						<div className="form-group mb-4">
 							<label className="col-form-label mb-2">by Pembina</label>
 							<br />
-							<Select name="multi-select-name" multi simpleValue value={selectedOptionMulti} onChange={this.handleChangeSelectMulti} options={pembina} />
+							<Select instanceId={selectInstanceId + 1} isMulti value={selectedOptionMulti} onChange={this.handleChangeSelectMulti} options={pembina ? this.optionsPembina(pembina) : []} required />
 						</div>
 						<Button color="secondary" size="lg" onClick={(e) => this.handleApplyClick()}>
 							Apply

pages/app/pemantauan/timeline.js

@@ -12,24 +12,24 @@ class Pemantauan extends Component {
 		super(props);
 		this.state = {
 			pt: {},
+			log: {},
 		};
 	}
 
 	static async getInitialProps({ query }) {
-		const log = await getLog({ ptId: query.ptId });
-		return { log, query };
+		return { query };
 	}
 
 	componentDidMount = async () => {
 		const { query } = this.props;
+		const log = await getLog({ ptId: query.ptId });
+		this.setState({ log });
 		const pt = await getPT({ id: query.ptId });
 		this.setState({ pt });
 	};
 
 	render() {
-		const { log } = this.props;
-		const { pt } = this.state;
-		console.log(pt);
+		const { pt, log } = this.state;
 
 		return (
 			<ContentWrapper unwrap>
@@ -37,9 +37,9 @@ class Pemantauan extends Component {
 				<div className="p-3">
 					<Row>
 						<Col xl="9">
-							<Timeline data={log} />
+							<Timeline data={log.data} />
 						</Col>
-						<Col xl="3">{/* <DetailPT data={pt.data[0]} /> */}</Col>
+						<Col xl="3">{pt?.data && <DetailPT data={pt.data[0]} />}</Col>
 					</Row>
 				</div>
 			</ContentWrapper>

pages/app/pemeriksaan/new.js

@@ -7,17 +7,31 @@ import InputEvaluasi from "@/components/Pemeriksaan/InputEvaluasi";
 import TableRiwayat from "@/components/Pemeriksaan/TableRiwayat";
 import { getPelaporan } from "@/actions/pelaporan";
 import Link from "next/link";
+import { getPT } from "@/actions/PT";
 import { Row, Col, Card, CardBody, CardHeader, CardTitle } from "reactstrap";
 
 class PemeriksaanNew extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			pt: {},
+			pelaporan: {},
+		};
+	}
 	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+	componentDidMount = async () => {
+		const { query } = this.props;
 		const pelaporan = await getPelaporan({ ptId: query.ptId, number: query.number });
-		return { query, pelaporan };
+		const pt = await getPT({ id: query.ptId });
+		this.setState({ pt, pelaporan });
 	};
 
 	render() {
-		const { pelaporan, query } = this.props;
-
+		const { query } = this.props;
+		const { pelaporan, pt } = this.state;
 		return (
 			<ContentWrapper unwrap>
 				{/* <Header /> */}
@@ -36,16 +50,14 @@ class PemeriksaanNew extends Component {
 								<CardBody>
 									<Row>
 										<Col lg={12}>
-											<DetailLaporan data={pelaporan.data[0]} />
+											{pelaporan.data && pelaporan.data.length && <DetailLaporan data={pelaporan.data[0]} />}
 											<InputEvaluasi query={query} />
 										</Col>
 									</Row>
 								</CardBody>
 							</Card>
 						</Col>
-						<Col xl="3">
-							<DetailPT />
-						</Col>
+						<Col xl="3">{pt?.data && <DetailPT data={pt.data[0]} />}</Col>
 					</Row>
 					<Row>
 						<Col>
@@ -53,9 +65,7 @@ class PemeriksaanNew extends Component {
 								<CardHeader>
 									<CardTitle>Riwayat Evaluasi</CardTitle>
 								</CardHeader>
-								<CardBody>
-									<TableRiwayat data={pelaporan.data[0]} />
-								</CardBody>
+								<CardBody>{pelaporan.data && pelaporan.data.length && <TableRiwayat data={pelaporan.data[0]} />}</CardBody>
 							</Card>
 						</Col>
 					</Row>

pages/app/pt/jawaban-banding/index.js

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col } from "reactstrap";
 import { getSanksi } from "@/actions/sanksi";
-import TableSanksi from "@/components/PT/TableSanksi";
+import TableSanksi from "@/components/PT/TableSanksiJawaban";
 import { connect } from "react-redux";
 class JawabanKeberatan extends Component {
 	constructor(props) {
@@ -14,8 +14,8 @@ class JawabanKeberatan extends Component {
 
 	componentDidMount = async () => {
 		const { user } = this.props;
-		const org_id = user.data.peran[0].organisasi.id;
-		const sanksi = await getSanksi({ banding: true, jawaban: true, ptId: org_id });
+		const org_id = user.peran[0].organisasi.id;
+		const sanksi = await getSanksi({ banding: true, ptId: org_id });
 		this.setState({ sanksi });
 	};
 

pages/app/pt/jawaban-keberatan/index.js

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col } from "reactstrap";
 import { getSanksi } from "@/actions/sanksi";
-import TableSanksi from "@/components/PT/TableSanksi";
+import TableSanksi from "@/components/PT/TableSanksiJawaban";
 import { connect } from "react-redux";
 
 class JawabanKeberatan extends Component {
@@ -15,8 +15,8 @@ class JawabanKeberatan extends Component {
 
 	componentDidMount = async () => {
 		const { user } = this.props;
-		const org_id = user.data.peran[0].organisasi.id;
-		const sanksi = await getSanksi({ keberatan: true, jawaban: true, ptId: org_id });
+		const org_id = user.peran[0].organisasi.id;
+		const sanksi = await getSanksi({ keberatan: true, ptId: org_id });
 		this.setState({ sanksi });
 	};
 

pages/app/pt/keberatan/detail.js

@@ -20,7 +20,7 @@ class Keberatan extends Component {
 	componentDidMount = async () => {
 		const { user } = this.props;
 		const { noSanksi } = this.props.router.query;
-		const sanksi = await getSanksi({ noSanksi, ptId: user.data.peran[0].organisasi.id });
+		const sanksi = await getSanksi({ noSanksi, ptId: user.peran[0].organisasi.id });
 		this.setState({ sanksi });
 	};
 
@@ -77,9 +77,7 @@ class Keberatan extends Component {
 								</CardBody>
 							</Card>
 						</Col>
-						<Col xl="3">
-							<DetailPT />
-						</Col>
+						<Col xl="3">{this.props.pt && <DetailPT data={this.props.pt[0]} />}</Col>
 					</Row>
 					<Row>
 						<Col>{sanksi && sanksi.data && <Riwayat data={sanksi.data[0]} />}</Col>
@@ -90,5 +88,5 @@ class Keberatan extends Component {
 	}
 }
 
-const mapStateToProps = (state) => ({ user: state.user });
+const mapStateToProps = (state) => ({ user: state.user, pt: state.pt });
 export default connect(mapStateToProps)(withRouter(Keberatan));

pages/app/pt/pemantauan.js

@@ -14,7 +14,7 @@ class Pemantauan extends Component {
 	constructor(props) {
 		super(props);
 		this.state = {
-			log: [],
+			log: [], 
 			pelaporan: {},
 		};
 	}

pages/login.js

@@ -65,11 +65,11 @@ class Login extends Component {
 		if (!hasError) {
 			const { username, password } = this.state.formLogin;
 			const auth = await login(username, password);
-			// console.log(auth);
+			console.log(auth);
 			if (auth.success) {
 				axiosAPI.defaults.headers.Authorization = `Bearer ${auth.access_token}`;
 				const dataUser = await getUser();
-				// console.log(dataUser);
+				console.log(dataUser);
 				this.props.setUser(dataUser.data);
 				if (dataUser.data.peran[0].peran.id === 2022) {
 					const org_id = dataUser.data.peran[0].organisasi.id;