menu rekomendasi delegasi V1.2

actions/sanksi.js

@@ -51,3 +51,15 @@ 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;
+	}
+};

components/RekomendasiDelegasi/InputRekomendasi.js

@@ -1,14 +1,12 @@
 import React, { Component } from "react";
 import { insertPemeriksaan } from "@/actions/pemeriksaan";
-import Router from "next/router";
-import Datetime from "react-datetime";
-import moment from "moment";
-import { Row, Col, FormGroup, Input, Button } from "reactstrap";
-import { ToastContainer, toast } from "react-toastify";
+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 { getOneLaporan, updateLaporan } from "@/actions/pelaporan";
 import { connect } from "react-redux";
+import { getOneSanksi, addRekomendasiDelegasi } from "@/actions/sanksi";
+
 
 const selectInstanceId = 1;
 const checkIfFilesAreTooBig = (files) => {
@@ -35,7 +33,7 @@ const checkIfFilesAreCorrectType = (files) => {
 	return valid;
 };
 
-const RekomendasiDelegasiSchema = Yup.object().shape({
+const rekomendasiSchema = Yup.object().shape({
 	dokumen: Yup.array().min(1).required("Wajib diisi").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
 });
 
@@ -60,22 +58,12 @@ class InputRekomendasi extends Component {
 		this.state = {
 			dropdownOpen: false,
 			splitButtonOpen: false,
-			judulEvaluasi: "",
-			tanggal: moment().format("D MMMM YYYY"),
 			files: [],
-			delegasichecklist: false,
-			rolelldikti: false,
+			sanksi: {},
+			data: {},
 		};
 	}
 
-	setjudulEvaluasi = (e) => {
-		this.setState({ judulEvaluasi: e.target.value });
-	};
-
-	setTanggal = (moment) => {
-		this.setState({ tanggal: moment.format("D MMMM YYYY") });
-	};
-
 	toggleSplit = () => {
 		this.setState({
 			splitButtonOpen: !this.state.splitButtonOpen,
@@ -118,120 +106,120 @@ class InputRekomendasi extends Component {
 		});
 	};
 
-	onSubmit = async (data, { resetForm }) => {
+	static getInitialProps = async ({ query }) => {
+		return { query };
+	};
+
+
+	handelSimpan = async () => {
+
 		const { token, query } = this.props;
 		const { id } = query;
 		const formdata = new FormData();
-		data.dokumen.forEach((e) => {
+		this.state.files.forEach((e) => {
 			formdata.append("dokumen", e);
 		});
-		if (this.state.delegasichecklist == true) {
-			await toast.promise(insertPemeriksaan(token, id, formdata), {
-				pending: "Loading",
-				success: "Success",
-				error: "Error",
-
-			});
-
-			data.change_role = "true";
-			data.keterangan = "delegasi ke DIKTI"
-			Router.push("/app/pemeriksaan");
-			update = await updateLaporan(token, id, data);
+		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 {
-			await toast.promise(insertPemeriksaan(token, id, formdata), {
-				pending: "Loading",
-				success: "Success",
-				error: "Error",
-			});
+			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",
+			// });
+
 		}
-		this.setState({ files: [] });
-		resetForm();
-		const pelaporan = await getOneLaporan(token, query.id);
-		this.props.changePelaporan(pelaporan);
+
 	};
 	render() {
 		const { files } = this.state;
 
 		const thumbs = files.map((file, index) => (
 			<div md={3} key={index}>
-				{/* <img className="img-fluid mb-2" src={file.preview} alt="Item" /> */}
 				<span className="text-left">{index + 1}.{file.name}</span>
 			</div>
 		));
 		return (
-			<>
-				<p className="lead bb">Evaluasi</p>
-				<Formik
-					initialValues={{
-						dokumen: [],
-					}}
-					validationSchema={evaluasiSchema}
-					onSubmit={this.onSubmit}
-				>
-					<Form className="form-horizontal">
-
-						<FormGroup row>
-							<label className="col-md-2 col-form-label">Upload File Pendukung<span className="text-danger">*</span></label>
-							<div className="col-md-10">
-								<Field name="dokumen">
-									{({ field, form, meta }) => (
-										<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 name="dokumen" {...getInputProps()} />
-														<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>
+			<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>
-														</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="btn-login" type="submit">
-									<span className="font-color-white">
-										Simpan Evaluasi
-									</span>
-								</Button>
-							</div>
-						</FormGroup>
-					</Form>
-				</Formik>
-			</>
+														);
+													}}
+												</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>
 		);
 	}
 }

components/RekomendasiDelegasi/TableRiwayat.js

@@ -7,31 +7,42 @@ function TableRiwayat({ data }) {
 			<table className="table table-striped my-4 w-100">
 				<thead>
 					<tr>
-						<th>Tanggal Dibuat</th>
-						<th>Tanggal Dokumen</th>
-						<th>Judul Dokumen</th>
-						<th>File Pendukung</th>
+						<th>Tanggal</th>
+						<th>Keterangan</th>
+						<th>Nomor Surat Sanksi</th>
+						<th>Dokumen Surat Sanksi</th>
+						<th>Dokumen Perbaikan</th>
 					</tr>
 				</thead>
 				<tbody>
-					{data.evaluasi.map((e, index) => (
-						<tr key={index}>
-							<td>{moment(e.createdAt).format("D MMMM YYYY")}</td>
-							<td>{moment(e.tanggal).format("D MMMM YYYY")}</td>
-							<td>{e.judul}</td>
-							<td>
-								{e.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>
-						</tr>
-					))}
+
+					<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>
+						<td>
+							{data.perbaikan.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>
+					</tr>
 				</tbody>
 			</table>
 		</div>

pages/app/rekomendasi-delegasi/detail.js

@@ -1,66 +1,14 @@
 import React, { Component } from "react";
-import { Row, Col, Card, CardBody, FormGroup, Input, Button, Modal, ModalHeader, ModalBody, ModalFooter } from "reactstrap";
-import Router from "next/router";
-import classnames from "classnames";
+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 Header from "@/components/Main/Header";
+import TableRiwayat from "@/components/RekomendasiDelegasi/TableRiwayat"
+import InputRekomendasi from "@/components/RekomendasiDelegasi/InputRekomendasi";
 import Link from "next/link";
 import DetailPT from "@/components/Main/DetailPT";
-import { getPelaporan } from "@/actions/pelaporan";
-import { getOneSanksi } from "@/actions/sanksi";
+import { getOneSanksi, addRekomendasiDelegasi } from "@/actions/sanksi";
 import Loader from "@/components/Common/Loader";
 import { connect } from "react-redux";
-import { Formik, Form, Field, ErrorMessage } from "formik";
-import * as Yup from "yup";
-import { createLog } from "@/actions/log";
-
-const stepNavitemStyle = {
-	backgroundColor: "#fcfcfc",
-};
-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;
-	}
-}
-
-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().notRequired().test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
-});
 
 class Detail extends Component {
 	constructor(props) {
@@ -69,6 +17,7 @@ class Detail extends Component {
 			sanksi: {},
 			files: [],
 			pt: {},
+			data: {},
 		};
 	}
 
@@ -82,67 +31,14 @@ class Detail extends Component {
 		const sanksi = await getOneSanksi(token, idSanksi, { all: true });
 		const pt = sanksi.data.laporan.pt;
 		this.setState({ sanksi, pt });
-		console.log(this.state.sanksi)
-	};
-	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.",
-		});
-	};
+		console.log(sanksi)
 
-	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: [],
-		});
 	};
 
-	handelSimpan = async () => {
-		const { data } = this.state;
-		const { query, token } = this.props;
-		const { id } = query;
-		const formdata = new FormData();
-		data.dokumen.forEach((e) => {
-			formdata.append("dokumen", e);
-		});
-		const toastid = toast.loading("Please wait...");
-		const added = await addJawabanKeberatan(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({
-				pathname: "/app/rekomendasi-delegasi",
-			});
-		}
-	};
 
 	render() {
 		const { files, sanksi, pt } = this.state;
-
-		const thumbs = files.map((file, index) => (
-			<div md={3} key={index}>
-				{/* <img className="img-fluid mb-2" src={file.preview} alt="Item" /> */}
-				<span className="text-left">{index + 1}.{file.name}</span>
-			</div>
-		));
-
+		const { query, token } = this.props;
 		return (
 			<ContentWrapper unwrap>
 				{/* <Header /> */}
@@ -163,94 +59,20 @@ class Detail extends Component {
 					</div>
 					{sanksi.data && (
 						<Row>
-							<Col xl={9}>
+
+							<Col xl="9">
 								<DetailSanksi data={sanksi.data} />
-								<Card>
+								<Card className="card-default">
+									<CardHeader>
+										<CardTitle>Riwayat Evaluasi</CardTitle>
+									</CardHeader>
 									<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>
-													<div className="row-xl-10"> */}
-													<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>
-													{/* <Button color="primary" onClick={sanksi.data.jawaban?.keberatan ? this.toggleModal : this.handelSimpan}>
-															Simpan
-														</Button> */}
-													{/* </div>
-												</FormGroup> */}
-												</Form>
-											)}
-										</Formik>
+										<TableRiwayat data={sanksi.data} />
 									</CardBody>
 								</Card>
-
+								<InputRekomendasi query={query} token={token} data={sanksi.data} />
 							</Col>
-							<Col xl="3">{pt ? <DetailPT data={pt} /> : <Loader />}</Col>
+							<Col lg="3">{pt ? <DetailPT data={pt} /> : <Loader />}</Col>
 						</Row>
 					)}
 				</div>

pages/app/rekomendasi-delegasi/index.js

@@ -26,7 +26,6 @@ class Pemeriksaan extends Component {
 		const { token } = this.props;
 		const pelaporan = await getPelaporan(token, { delegasi: true, sanksi: true });
 		this.setState({ pelaporan });
-		console.log(this.state.pelaporan);
 	};
 
 	render() {