commit

.gitignore

@@ -17,3 +17,5 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+/.vscode

actions/log.js

@@ -1,8 +1,21 @@
 import { get } from "../config/request";
 
-export const getLog = async ({ ptId }) => {
+export const getLog = async ({ ptId, isPT }) => {
 	try {
-		const res = await get(`/log?ptId=${ptId}`);
+		let url = `/log?ptId=${ptId}`;
+		if (isPT) url += `&isPT=true`;
+		const res = await get(url);
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};
+
+export const getLogPublic = async ({ ptId, laporanId }) => {
+	try {
+		let url = `/log/public?ptId=${ptId}&laporan=${laporanId}`;
+		const res = await get(url);
 		return res.data;
 	} catch (error) {
 		console.log("error", error);

actions/pelaporan.js

@@ -1,6 +1,5 @@
 import { get, post, del, put } from "../config/request";
 import axiosAPI from "../config/axios";
-import { remove } from "jszip";
 
 export const getPelaporan = async (query = {}) => {
 	try {
@@ -25,6 +24,16 @@ export const getPelaporan = async (query = {}) => {
 	}
 };
 
+export const getPelaporanPublic = async ({ number, noHp }) => {
+	try {
+		const res = await get(`/pelaporan/public?number=${number}&noHp=${noHp}`);
+		return res.data;
+	} catch (error) {
+		console.log("error", error.response.data);
+		return false;
+	}
+};
+
 export const createPelaporan = async (data) => {
 	try {
 		const res = await axiosAPI.post("/pelaporan/create", data);

components/Main/DetailLaporan.js

@@ -7,16 +7,6 @@ import { getPT } from "@/actions/PT";
 
 function DetailLaporan({ data, noTitle = false, noStatus = false }) {
 	const user = useSelector((state) => state.user);
-	console.log(user.peran[0].peran.id);
-	// const [pt, setPT] = useState({});
-
-	// useEffect(() => {
-	// 	const fetchPT = async () => {
-	// 		const pt = await getPT({ id: data.pt_id });
-	// 		setPT(pt.data[0]);
-	// 	};
-	// 	fetchPT();
-	// }, []);
 
 	return (
 		<>

components/Main/Timeline.js

@@ -1,6 +1,6 @@
 import moment from "moment";
 
-function Timeline({ data }) {
+function Timeline({ data, noFile = false }) {
 	const date = data && [...new Set(data.map((e) => moment(e.createdAt).format("DD MMMM YYYY")))];
 	return (
 		<ul className="timeline-alt">
@@ -22,18 +22,20 @@ function Timeline({ data }) {
 												<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${data.role === "PT" ? "/univ-avatar.png" : "/logo-single.png"}`} alt="Avatar" />
+														<img
+															className="mr-3 rounded-circle thumb48"
+															src={`/static/img${data.role === "PT" ? "/univ-avatar.png" : data.role === "UMUM" ? "/user/user.png" : "/logo-single.png"}`}
+															alt="Avatar"
+														/>
 														<p className="m-0">
 															<strong>{data.role_name}</strong>
-															{/* <br />
-															{data.laporan_id} */}
 															<br />
 															{data.description}
 															<br />
 															<p className="text-muted">{moment(data.createdAt).format("hh:mm")}</p>
 														</p>
 													</div>
-													{data.data.files && (
+													{(!noFile || data.for_public) && data.data.files && (
 														<>
 															<p className="text-muted my-2">Dokumen</p>
 															{data.data.files.map((e) => (

components/PT/Timeline.js

@@ -12,7 +12,6 @@ function Timeline({ data, dataPelaporan }) {
 						.filter((e) => e.for_pt && moment(e.createdAt).format("DD MMMM YYYY") === value)
 						.map((data, i) => (
 							<>
-								{console.log(data)}
 								<li className={data.role === "PT" ? "timeline-inverted" : ""}>
 									<div className={`timeline-badge ${data.role === "PT" ? " danger" : "info"}`}>
 										<em className={`fas fa-${data.role === "PT" ? "graduation-cap" : "file"}`}></em>
@@ -25,7 +24,7 @@ function Timeline({ data, dataPelaporan }) {
 												<div className="d-flex align-items-center mb-3">
 													<img className="mr-3 rounded-circle thumb48" src={`/static/img${data.role === "PT" ? "/univ-avatar.png" : "/logo-single.png"}`} alt="Avatar" />
 													<p className="m-0">
-														<strong>{data.role_name}</strong>
+														<strong>{ data.role_name}</strong>
 														<br />
 														{data.description}
 														<br />

components/Pelaporan/InputData.js

@@ -103,6 +103,7 @@ export class InputData extends Component {
 		formdata.append("user_id", user._id);
 		formdata.append("pt_id", this.props.query.ptId);
 		formdata.append("description", this.state.keteranganLaporan);
+		formdata.append("is_public", false);
 		formdata.append("pelanggaran", this.state.selectedOptionMulti.map((e) => e.value).join());
 		if (this.state.files.length > 0) {
 			this.state.files.forEach((e) => {
@@ -112,6 +113,7 @@ export class InputData extends Component {
 
 		const create = await createPelaporan(formdata);
 		// console.log(create);
+		// console.log(create);
 		// await this.props.dispatch(createPelaporan(formdata));
 		// this.props.dispatch(listPelaporan());
 		if (create) {

components/Public/DetailLaporan.js

@@ -0,0 +1,86 @@
+import Scrollable from "@/components/Common/Scrollable";
+import moment from "moment";
+import { Col, FormGroup } from "reactstrap";
+
+function DetailLaporan({ data }) {
+	return (
+		<>
+			<p className="lead bb">Detail Laporan</p>
+			<form className="form-horizontal">
+				<FormGroup row>
+					<Col md="4">Nomor Laporan:</Col>
+					<Col md="8">
+						<strong>{data._number}</strong>
+					</Col>
+				</FormGroup>
+				<FormGroup row>
+					<Col md="4">Nama Perguruan Tinggi:</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.description}</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>
+				{data.status ? (
+					<FormGroup row>
+						<Col md="4">Status:</Col>
+						<Col md="8">
+							<div className="badge badge-info">{data.status}</div>
+						</Col>
+					</FormGroup>
+				) : (
+					""
+				)}
+				<FormGroup row>
+					<Col md="4">File Pendukung:</Col>
+					<Col md="8">
+						<Scrollable height="120px" className="list-group">
+							<table className="table table-bordered bg-transparent">
+								<tbody>
+									{data.files.map((e, index) => (
+										<tr key={`files-${index}`}>
+											<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>
+					</Col>
+				</FormGroup>
+			</form>
+		</>
+	);
+}
+
+export default DetailLaporan;

pages/app/pt/pemantauan.js

@@ -19,7 +19,7 @@ class Pemantauan extends Component {
 
 	componentDidMount = async () => {
 		const { user } = this.props;
-		const log = await getLog({ ptId: user.peran[0].organisasi.id });
+		const log = await getLog({ ptId: user.peran[0].organisasi.id, isPT: true });
 		const pelaporan = await getPelaporan({ ptId: user.peran[0].organisasi.id });
 		this.setState({ log, pelaporan });
 	};

pages/laporan/new/index.js

@@ -98,8 +98,9 @@ class App extends Component {
 
 	handleKirim = async (e) => {
 		e.preventDefault();
+		const { nama } = this.state;
 		const user_id = await this.createUser();
-		await this.createLaporan(user_id);
+		await this.createLaporan(user_id, nama);
 		// validasi
 		// if (nama === '')  msgError.push({nama: 'Wajib diisi'})
 	};
@@ -118,13 +119,15 @@ class App extends Component {
 		return false;
 	};
 
-	createLaporan = async (user_id) => {
+	createLaporan = async (user_id, nama) => {
 		const { pelaporanNumber, selectedPerguruanTinggi, keteranganLaporan, selectedJenis, files } = this.state;
 		const formdata = new FormData();
 		formdata.append("number", pelaporanNumber);
 		formdata.append("user_id", user_id);
 		formdata.append("pt_id", selectedPerguruanTinggi.value);
 		formdata.append("description", keteranganLaporan);
+		formdata.append("is_public", true);
+		formdata.append("nama", nama);
 		formdata.append("pelanggaran", selectedJenis.map((e) => e.value).join());
 		if (files.length > 0) {
 			Array.from(files).forEach((e) => {
@@ -132,7 +135,6 @@ class App extends Component {
 			});
 		}
 		const create = await createPelaporan(formdata);
-		console.log(create);
 		if (create.success) return create;
 		return false;
 	};

pages/pemantauan.js

@@ -1,8 +1,12 @@
 import React, { Component } from "react";
 import BasePage from "@/components/Layout/BasePage";
-import { Row, Col, FormGroup, Input, Card, CardBody, Button, CustomInput, Navbar, NavItem, NavLink, NavbarBrand, NavbarToggler, Nav, Collapse } from "reactstrap";
+import { Row, Col, FormGroup, Input, Card, CardBody, Button, Navbar, NavItem, NavLink, NavbarBrand, NavbarToggler, Nav, Collapse } from "reactstrap";
 import Link from "next/link";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { getPelaporanPublic } from "@/actions/pelaporan";
+import DetailLaporan from "@/components/Public/DetailLaporan";
+import { getLogPublic } from "@/actions/log";
+import Timeline from "@/components/Main/Timeline";
 
 const menu = [
 	{
@@ -28,9 +32,10 @@ class App extends Component {
 		this.state = {
 			isOpen: false,
 			no_laporan: "",
-			pelaporanNumber: Math.floor(Date.now() * Math.random()),
 			no_hp: "",
 			msgError: [],
+			laporan: {},
+			log: {},
 		};
 	}
 
@@ -44,11 +49,15 @@ class App extends Component {
 
 	handleLihatPemantaun = async (e) => {
 		e.preventDefault();
-		// validasi
-		// if (nama === '')  msgError.push({nama: 'Wajib diisi'})
+		const { no_hp, no_laporan } = this.state;
+		const laporan = await getPelaporanPublic({ number: no_laporan, noHp: no_hp });
+		const log = await getLogPublic({ ptId: laporan.data[0].pt_id, laporanId: laporan.data[0]._id });
+		this.setState({ laporan });
+		this.setState({ log });
 	};
 
 	render() {
+		const { laporan, log } = this.state;
 		return (
 			<div>
 				<Navbar color="info" expand="md" dark>
@@ -97,6 +106,22 @@ class App extends Component {
 									</form>
 								</CardBody>
 							</Card>
+							<Card className="card-default">
+								<CardBody>
+									{laporan.data && log.data ? (
+										<>
+											<DetailLaporan data={laporan.data[0]} />
+											<p className="lead bb">Pemantauan</p>
+											<Timeline data={log.data} noFile />{" "}
+										</>
+									) : (
+										""
+									)}
+								</CardBody>
+							</Card>
+							{/* <Card className="card-default">
+								<CardBody></CardBody>
+							</Card> */}
 						</Col>
 					</Row>
 				</ContentWrapper>