delegasi to lldikti di penetapan jenis pelanggaran

components/Sanksi/BeritaAcara_A.js

@@ -1,40 +1,31 @@
-import React, { useRef } from 'react';
+import React, { useRef, Component } from 'react';
 import { useReactToPrint } from "react-to-print";
-const BeritaAcara = () => {
-    const componentRef = useRef();
-    const handlePrint = useReactToPrint({
-        content: () => componentRef.current,
-    });
+import { Row, Col, Button } from "reactstrap";
+import Head from 'next/head'
+import SignatureCanvas from 'react-signature-canvas'
+import ComponentToPrint from "./SuratBA";
+import ReactToPrint, { PrintContextConsumer } from 'react-to-print';
 
-    return (<>
-        <div class="print__section">
-            <div class="container">
-                <div class="row">
-                    <div class="col-md-12">
-                        <button onClick={handlePrint} className="print__button">  Print </button>
-                        <div ref={componentRef} className="card">
-                            <div class="float__start">
-                                <h3 class="card-title mb-3">Information</h3>
-                            </div>
-                            <hr />
-                            <div class="float__infoss">
-                                <ul>
-                                    <li> Name : <span> Dr Andrew C S Koh </span> </li>
-                                    <li> Email : <span> Andrew@gmail.com </span> </li>
-                                    <li> Gender : <span> Male </span> </li>
-                                    <li> Date of Birth : <span> 07-24-1982</span> </li>
-                                    <li> Phone No: <span> </span> 9856231456 </li>
-                                    <li> Address : <span> 26 Wyle Cop, Shrewsbury, Shropshire, SY1 1XD </span> </li>
-                                    <li> Website : <span> www.Andrew.com </span> </li>
-                                    <li> Country : <span> United states </span> </li>
-                                </ul>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </>
-    )
+
+
+class BeritaAcara extends Component {
+
+    render() {
+        return (
+            <div>
+                <h1>kekekekekekek</h1>
+                <ReactToPrint content={() => this.componentRef}>
+                    <PrintContextConsumer>
+                        {({ handlePrint }) => (
+                            <button onClick={handlePrint}>Print this out!</button>
+                        )}
+                    </PrintContextConsumer>
+                </ReactToPrint>
+                <ComponentToPrint ref={el => (this.componentRef = el)} />
+
+            </div >
+
+        );
+    }
 }
 export default BeritaAcara

components/Sanksi/TablePenetapanSanksi.js

@@ -42,36 +42,11 @@ export class TablePenetapanSanksi extends Component {
 		const item = evt.target.value;
 		if (checked && label_sanksi === "Ringan") this.state.labelSanksi.push({ value: item, labelSanksi: label_sanksi });
 		else if (label_sanksi === "Ringan") this.state.labelSanksi = this.state.labelSanksi.filter((e) => e.value != item);
-		console.log(this.state.labelSanksi)
 	}
 
-	// handleDelegasi = async (value) => {
-	// 	const { token, query, data } = this.props;
-	// 	let update = null;
-	// 	if (this.state.labelSanksi.length > 0) {
-	// 		data.change_role = "true";
-	// 		data.keterangan = "delegasi ke LLDIKTI"
-	// 		update = await updateLaporan(token, query, data);
-	// 		Router.push("/app/sanksi");
-	// 	}
-
-	// }
-
-	handleDelegasi = async (e) => {
-		const toastid = toast.loading("Please wait...");
-		const { query, token, data } = this.props;
-		data.change_role = "true";
-		await updateLaporan(token, query, data);
-		toast.update(toastid, { render: "All is good", type: "success", isLoading: false, autoClose: true, closeButton: true });
-		Router.push({
-			pathname: "/app/sanksi",
-		});
-	};
-
-
-
-
-
+	ondelegasi = () => {
+		this.props.handleDelegasi(this.state)
+	}
 
 	render() {
 		const { pelanggaran, labelSanksi } = this.state;
@@ -131,17 +106,20 @@ export class TablePenetapanSanksi extends Component {
 							: ""}
 					</tbody>
 				</Table>
-				{
-					labelSanksi.length ? (
-						<Button className="btn-login" color onClick={this.handleDelegasi} >
-							<span className="font-color-white">
-								Delegasi ke LLDIKTI
-							</span>
-						</Button>
-					) : ("")
+				<div className="float-right m-2 ">
+					{
+						labelSanksi.length ? (
+							<Button className="btn-login float-right" color onClick={this.ondelegasi} >
+								<span className="font-color-white">
+									Delegasi ke LLDIKTI
+								</span>
+							</Button>
+						) : ("")
+
 
+					}
+				</div>
 
-				}
 			</Card>
 		);
 	}

pages/app/sanksi/proses.js

@@ -10,7 +10,7 @@ import UploadSurat from "@/components/Sanksi/UploadSurat";
 import Ringkasan from "@/components/Sanksi/Ringkasan";
 import TablePenetapanSanksi from "@/components/Sanksi/TablePenetapanSanksi";
 import Link from "next/link";
-import { getOneLaporan } from "@/actions/pelaporan";
+import { getOneLaporan, updateLaporan } from "@/actions/pelaporan";
 import { createSanksi } from "@/actions/sanksi";
 import { getPelanggaran, getPelanggaranSanksi } from "@/actions/pelanggaran";
 import { connect } from "react-redux";
@@ -80,6 +80,24 @@ class ProsesSanksi extends Component {
 		}
 	};
 
+
+	handleDelegasi = async (data) => {
+		const { token, query } = this.props;
+		const { id } = query;
+		let update = null;
+		const toastid = toast.loading("Please wait...");
+		data.change_role = "true";
+		data.keterangan = "delegasi ke DIKTI"
+		update = await updateLaporan(token, id, data);
+
+		if (!update) {
+			toast.update(toastid, { render: "Laporan gagal didelegasi", type: "error", isLoading: false, autoClose: true, closeButton: true });
+		} else {
+			toast.update(toastid, { render: "Laporan berhasil didelegasi", type: "success", isLoading: false, autoClose: true, closeButton: true });
+			Router.push("/app/sanksi");
+		}
+	};
+
 	toggleStep = (activeStep) => () => {
 		if (this.state.activeStep !== activeStep) {
 			this.setState({
@@ -227,7 +245,7 @@ class ProsesSanksi extends Component {
 										<TabPane tabId="3">
 											<div className="pt-3 mb-3">
 												<h2>Penetapan Jenis Pelanggaran</h2>
-												<TablePenetapanSanksi setCheckedData={this.setCheckedData} dataPelanggaran={dataPelanggaran.data} data={pelaporan.data} />
+												<TablePenetapanSanksi handleDelegasi={this.handleDelegasi} setCheckedData={this.setCheckedData} dataPelanggaran={dataPelanggaran.data} data={pelaporan.data} />
 											</div>
 											<hr />
 											<div className="d-flex">
@@ -241,7 +259,7 @@ class ProsesSanksi extends Component {
 										</TabPane>
 										<TabPane tabId="4">
 											<Card>
-												{/* <BeritaAcara /> */}
+												<BeritaAcara />
 											</Card>
 
 											<div className="d-flex">