fix

pages/app/perpanjangan-sanksi/edit_catatan.js

@@ -1,522 +0,0 @@
-import React, { Component } from "react";
-import Router from "next/router";
-import { connect } from "react-redux";
-import ContentWrapper from "@/components/Layout/ContentWrapper";
-import { Row, Col, Card, CardHeader, CardBody, Button, FormGroup, Popover, PopoverHeader, Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
-// import { Editor } from 'react-draft-wysiwyg';
-import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
-import { EditorState, ContentState, convertFromHTML, convertToRaw, convertFromRaw } from 'draft-js';
-// import 'draft-js/dist/Draft.css';
-import dynamic from 'next/dynamic';
-const Editor = dynamic(
-    () => import('react-draft-wysiwyg').then(mod => mod.Editor),
-    { ssr: false })
-import draftToHtml from 'draftjs-to-html';
-import pdfMake from "pdfmake/build/pdfmake";
-// import StateToPdfMake from "draft-js-export-pdfmake";
-import pdfFonts from "pdfmake/build/vfs_fonts";
-import { toast } from "react-toastify";
-import { addCatatan, deletePeserta, getOneCatatan, updateCatatan } from "../../../actions/catatan";
-import { getCsrf } from "../../../actions/security";
-pdfMake.vfs = pdfFonts.pdfMake.vfs;
-import { ENV } from '../../../env.js';
-import CopyToClipboard from "react-copy-to-clipboard";
-import ReactToPrint from "react-to-print";
-import ComponentToPrint from "../../../components/Main/presensi_print.js";
-import SummerNote from "../../../components/Extras/summernote";
-import Datetime from "react-datetime";
-
-import ContentEditable from 'react-contenteditable'
-import { getOneSanksi } from "@/actions/sanksi";
-
-
-
-class EditFile extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            tanggal: "",
-            modalRemovePeserta: false,
-            setTanggal: false,
-            isEditTanggal: false,
-            isEditTempat: false,
-            simpulan: "  ",
-            rekomendasi: "  ",
-            selectedPeserta: "",
-            isi: [
-                {
-                    Aspek_Perbaikan: "",
-                    Laporan_Perbaikan: "",
-                    Hasil_Verifikasi: "",
-                },
-            ],
-        };
-    }
-
-    static getInitialProps = async ({ query }) => {
-        return { query };
-
-    };
-
-
-    componentDidMount = async () => {
-        const { token, query } = this.props;
-        const { id } = query;
-        const getCatatan = await getOneCatatan(token, id)
-        // const sanksi = await getOneSanksi(token, idSanksi, { all: true });
-        const pt = getCatatan.data?.isi.pt;
-        const catatan = getCatatan.data
-        const judul = getCatatan.data.judul
-
-        const tempat = catatan.isi.tempat
-        const setTanggal = catatan.isi.setTanggal
-        const isi = catatan.isi.isi
-        const tanggal = catatan.isi.tanggal
-        const isEditTanggal = catatan.isi.isEditTanggal
-        const isEditTempat = catatan.isi.isEditTempat
-        const simpulan = catatan.isi.simpulan
-        const rekomendasi = catatan.isi.rekomendasi
-        this.setState({ isi, catatan, judul, pt, tanggal, tempat, isEditTanggal, isEditTempat, simpulan, rekomendasi, setTanggal });
-
-    }
-
-
-    handelSimpan = async (data) => {
-        if (this.props?.user?.role.id === 2071) {
-            Swal.fire({
-                icon: 'error',
-                title: 'Oops...',
-                html: 'Maaf anda tidak memiliki akses untuk menyelesaikan<p> proses ini.</p>',
-                confirmButtonColor: "#3e3a8e",
-                confirmButtonText: 'Oke'
-            })
-        } else {
-            const getToken = await getCsrf();
-            const _csrf = getToken.token;
-            const { token, query } = this.props;
-            const { id } = query;
-            // const isi = ("editorState", draftToHtml(convertToRaw(this.state.editorState.getCurrentContent())))
-            const toastid = toast.loading("Please wait...");
-            const added = await updateCatatan(token, this.state.catatan.sanksi_id, {
-                "judul": this.state.judul,
-                "isi": this.state,
-                "catatan_id": id,
-                "menu": "Perpanjangan Sanksi"
-            }, _csrf);
-            if (!added) {
-                toast.update(toastid, { render: "Error", type: "error", isLoading: false, autoClose: true, closeButton: true });
-            } else {
-                toast.update(toastid, { render: "Success", type: "success", isLoading: false, autoClose: true, closeButton: true });
-                Router.push(`/app/perpanjangan-sanksi/detail?id=${this.state.catatan.sanksi_id}`);
-            }
-        }
-
-    };
-
-    setHandleJudul = (e) => {
-        this.setState({ judul: e.target.value });
-    };
-    CloseCopiedd = () => {
-
-        setTimeout(() => {
-            this.setState({
-                copiedd: !this.state.copiedd
-            });
-        }, 1000);
-    }
-
-    Copiedd = () => this.setState({
-        copiedd: !this.state.copiedd
-    })
-    isEditTanggal = () => {
-        // this.state.isEditTanggal = !this.state.isEditTanggal
-        this.setState({
-            isEditTanggal: !this.state.isEditTanggal,
-        })
-    }
-
-    isEditTempat = () => {
-        this.setState({
-            isEditTempat: !this.state.isEditTempat,
-        })
-    }
-    handleAspek = (evt, id, field) => {
-        const newValue = evt.target.value || evt.target.innerHTML;
-
-        this.setState(prevState => ({
-            isi: prevState.isi.map((item, index) =>
-                index === id
-                    ? { ...item, [field]: newValue }
-                    : item
-            )
-        }));
-
-    };
-    addRow = () => {
-        this.setState(prevState => ({
-            isi: [
-                ...prevState.isi,
-                {
-                    Aspek_Perbaikan: "",
-                    Laporan_Perbaikan: "",
-                    Hasil_Verifikasi: ""
-                }
-            ]
-        }));
-    };
-    setDataCatatan = (data) => {
-        this.setState({ dataCatatan: data });
-    }
-    removeRow = (index) => {
-        this.setState(prevState => ({
-            isi: prevState.isi.filter((_, i) => i !== index)
-        }));
-    };
-    setModalRemovePeserta = (modalRemovePeserta) => {
-        this.setState({
-            modalRemovePeserta: !this.state.modalRemovePeserta
-        })
-    }
-    handlePaste = (event) => {
-        event.preventDefault();
-        const text = event.clipboardData.getData('text/plain');
-        document.execCommand('insertText', false, text);
-    };
-    render() {
-        const { catatan, pt, isEditTanggal, tanggal } = this.state;
-        return (
-            <ContentWrapper>
-                <Modal isOpen={this.state.modalRemovePeserta} >
-                    <ModalBody>Apakah anda ingin menghapus peserta?</ModalBody>
-                    <ModalFooter>
-
-                        <Button color className="btn-login"
-                            onClick={async () => {
-                                const { token } = this.props;
-                                let update = null;
-                                const toastid = toast.loading("Please wait...");
-                                const id_catatan = catatan._id
-                                const peserta = this.state.selectedPeserta
-                                update = await deletePeserta(token, { "peserta_id": peserta }, id_catatan);
-                                if (!update) {
-                                    toast.update(toastid, { render: "Gagal hapus peserta", type: "error", isLoading: false, autoClose: true, closeButton: true });
-                                } else {
-                                    toast.update(toastid, { render: "Berhasil hapus peserta", type: "success", isLoading: false, autoClose: true, closeButton: true });
-                                    Router.push(`/app/perpanjangan-sanksi/edit_catatan?id=${catatan._id}`);
-                                    this.setModalRemovePeserta()
-                                }
-                            }}
-                        >
-
-                            <span className="font-color-white">Ya</span>
-                        </Button>
-                        <Button color className="btn-v2" onClick={this.setModalRemovePeserta}>
-                            Tidak
-                        </Button>
-                    </ModalFooter>
-                </Modal>
-                <Row>
-                    <Col lg={12}>
-                        <Card body className="card-default">
-                            <FormGroup row>
-                                <label className="col-md-1  col-form-label">Judul Catatan</label>
-                                <div className="col-md-8">
-
-                                    <input type="text" name="article-title" placeholder="Judul Catatan" className="mb-3 form-control form-control-lg" onChange={this.setHandleJudul} value={this.state.judul} />
-                                </div>
-                                <div className="col-md-3">
-                                    {/* <span className=" d-inline-flex">
-                                        <Button className="btn-login mr-2" color onClick={this.handleGeneratePDF}>
-                                            <span className="font-color-white">
-                                                Print Notulensi
-                                            </span>
-                                        </Button>
-                                    </span> */}
-                                    <span className=" d-inline-flex">
-                                        <ReactToPrint
-                                            trigger={() => {
-                                                return <span className="btn-radius">
-
-                                                    <Button color className="ml-0 btn-v1-outline-purple">                                         Print Dokumen
-                                                    </Button>
-                                                </span>
-                                            }}
-                                            content={() => this.componentRef}
-                                        />
-                                    </span>
-                                </div>
-                            </FormGroup>
-                            <div style={{ display: "none" }}>
-                                <ComponentToPrint ref={el => (this.componentRef = el)} query={this.props.query} />
-                            </div>
-                            <div className='page  py-5 m-0 mb-3'>
-                                <div className='BA-Header'>
-                                    <img className='BA-logo' src="/static/img/logo-single-1-login.png" alt="logo" />
-                                    <h4 >LAPORAN HASIL VERIFIKASI DAN VALIDASI DOKUMEN USUL PENCABUTAN SANKSI ADMINISTRATIF</h4>
-                                    {pt && (<h4 className='text-uppercase' >{pt.nama}</h4>)}
-                                </div>
-                                <div className='BA-body px-5 pt-3 '>
-                                    <p>
-                                        Pada hari ini
-                                        <span style={{ textIndent: "0rem" }}>
-                                            {isEditTanggal &&
-                                                <span style={{ textIndent: "0rem" }}>
-                                                    <Datetime
-                                                        timeFormat={false}
-                                                        inputProps={{ className: "form-control" }}
-                                                        value={tanggal ? new Date(tanggal) : tanggal || "Isi Tanggal"}
-                                                        onChange={(tanggal) => {
-                                                            this.setState({ tanggal, setTanggal: true })
-                                                        }}
-                                                        closeOnSelect={true}
-
-                                                    />
-                                                    <button className='bg-transparent button-transparent border-0 fas fa-times-circle text-danger' onClick={this.isEditTanggal} />
-                                                    <button className='bg-transparent button-transparent border-0 fas fa-check-circle text-success' onClick={this.isEditTanggal}
-                                                    />
-                                                </span>
-                                            }
-                                        </span>
-                                        {this.state?.setTanggal === true ?
-                                            <span onClick={this.isEditTanggal}> {moment(tanggal || this.state?.tanggal).locale("id").format("dddd")}, tanggal&nbsp;{moment(tanggal || this.state?.tanggal).format("D")}&nbsp;bulan&nbsp;{moment(tanggal || this.state?.tanggal).locale("id").format("MMMM")} tahun &nbsp;{moment(tanggal || this.state?.tanggal).format("YYYY")},</span> :
-                                            <span onClick={this.isEditTanggal}><strong>&nbsp;[Mohon Diisi] &nbsp;</strong></span>
-                                        }
-                                        &nbsp;bertempat di
-                                        {this.state.isEditTempat &&
-                                            <span>
-                                                <input type='text'
-                                                    defaultValue={""}
-                                                    ref="inputTempat"
-                                                    onChange={() => {
-                                                        this.setState({ tempat: this.refs.inputTempat.value })
-                                                    }}
-                                                />
-                                                <button className='bg-transparent button-transparent border-0 fas fa-times-circle text-danger' onClick={this.isEditTempat} />
-                                                <button className='bg-transparent button-transparent border-0 fas fa-check-circle text-success' onClick={() => { this.isEditTempat() }} />
-                                            </span>
-                                        }
-                                        {this.state?.tempat ?
-                                            <span onClick={this.isEditTempat} className='hhh'>
-                                                &nbsp;{this.state?.tempat}
-                                            </span>
-                                            :
-                                            <span onClick={this.isEditTempat}><strong>&nbsp;[Mohon Diisi] &nbsp;</strong></span>
-                                        }
-
-                                        ,
-                                        telah dilakukan rapat Verifikasi dan Validasi Dokumen Usul Pencabutan Sanksi Administratif {pt && (<span>{pt.nama}</span>)}, yang dihadiri oleh:
-
-                                        <ol>
-                                            {catatan?.daftar_kehadiran_peserta?.map((value) =>
-                                                <li>
-                                                    {value.nama}
-                                                    <button className="bg-transparent button-transparent border-0 fas fa-trash text-danger float-right"
-                                                        onClick={() => {
-                                                            this.setState({
-                                                                selectedPeserta: value._id
-                                                            })
-                                                            this.setModalRemovePeserta()
-                                                        }} />
-                                                </li>)}
-                                        </ol>
-                                    </p>
-                                    <div className='table-a my-4 pl-5 pr-5' >
-                                        <div className=' d-inline-block'>
-                                            <Button color="primary" className="mb-2 float-md-right" onClick={this.addRow}>Tambah Baris</Button>
-                                        </div>
-
-                                        <table className=' ml-auto mr-auto'>
-                                            <thead >
-                                                <tr>
-                                                    <th >NO</th>
-                                                    <th>ASPEK PERBAIKAN</th>
-                                                    <th >LAPORAN PERBAIKAN</th>
-                                                    <th >HASIL VERIFIKASI DAN VALIDASI</th>
-                                                </tr>
-                                            </thead>
-                                            <tbody>
-                                                {this.state.isi?.map((isi, index) => (
-                                                    <tr key={index}>
-                                                        <td>{index + 1}</td>
-
-                                                        <td style={{ width: "30%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Aspek_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-
-                                                        <td style={{ width: "30%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Laporan_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-
-                                                        <td style={{ width: "40%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Hasil_Verifikasi}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-                                                        <td style={{ border: "transparent" }}>
-                                                            <button onClick={() => this.removeRow(index)} className="bg-transparent button-transparent border-0 fas fa-trash text-danger float-right" />
-                                                        </td>
-                                                    </tr>
-                                                ))}
-                                            </tbody>
-                                        </table>
-                                    </div>
-                                    <div className='table-b my-4 pl-4 pr-5' >
-                                        <tr>
-                                            <td style={{ width: "8%" }}>Simpulan&nbsp;:</td>
-                                            <td >
-                                                <ContentEditable
-                                                    html={this.state.simpulan}
-                                                    disabled={false}
-                                                    onChange={(e) => {
-                                                        this.setState({ simpulan: e.target.value });
-                                                    }}
-                                                    tagName="text"
-                                                    onPaste={this.handlePaste}
-                                                />
-                                            </td>
-                                        </tr>
-                                    </div>
-                                    <div className='table-b my-4 pl-4 pr-5' >
-                                        <tr>
-                                            <td style={{ width: "8%" }}>Rekomendasi&nbsp;:</td>
-                                            <td >
-                                                <ContentEditable
-                                                    html={this.state.rekomendasi}
-                                                    disabled={false}
-                                                    onChange={(e) => {
-                                                        this.setState({ rekomendasi: e.target.value });
-                                                    }}
-                                                    tagName="text"
-                                                    onPaste={this.handlePaste}
-                                                />
-                                            </td>
-                                        </tr>
-                                    </div>
-
-                                    <Row>
-                                        <Col xl={{ size: 8, offset: 2 }}>
-                                            <div className="mt-5"  >
-                                                <div className='header-ttd signature-border pt-1 pb-1'>
-                                                    <text className='header-ttd font-weight-bold '>PESERTA RAPAT</text>
-                                                </div>
-                                                <div id="ttd">
-                                                    {catatan
-                                                        ? catatan.daftar_kehadiran_peserta?.map((value) => (
-                                                            <div className='ttd-div'>
-                                                                <div className='sign-ttd'>
-                                                                    <img
-                                                                        className='sign-ttd'
-                                                                        src={value?.ttd?.path} />
-                                                                </div>
-                                                                <div className='sign-nama'>
-                                                                    <text>
-                                                                        {value.nama}
-                                                                    </text>
-                                                                </div>
-                                                            </div>
-                                                        )) : ""}
-                                                </div>
-                                            </div>
-                                        </Col>
-                                    </Row>
-                                </div>
-                            </div>
-                            <Row>
-                                <Col>
-                                    {ENV === "local" &&
-                                        <CopyToClipboard
-                                            text={`http://localhost:3000/signature/letter/${catatan?._id}`}
-                                            options={{ asHtml: true }}
-                                        >
-                                            <div>
-                                                <span className="btn-radius">
-                                                    <Button color id="Popover1" className="ml-0  mb-2 btn-v1-outline-purple" onClick={() => {
-                                                        this.CloseCopiedd()
-                                                    }} ><span><em className="fas fa-project-diagram float-left mt-1 mr-1" />&nbsp;Link Dokumen Berita Acara</span>
-
-                                                        {/* <h5 className="p-0 mt-3 float-right"> <em className="fas fa-project-diagram float-left mt-1" /> &nbsp;Link Dokumen Berita Acara</h5> */}
-                                                    </Button>
-                                                </span>
-                                                <Popover placement="bottom" isOpen={this.state.copiedd} target="Popover1" toggle={this.Copiedd}>
-                                                    <PopoverHeader>Link Berhasil Disalin</PopoverHeader>
-                                                </Popover>
-                                            </div>
-
-                                        </CopyToClipboard>
-                                    }
-                                    {ENV === "production" &&
-                                        <CopyToClipboard
-                                            text={`https://sidali.kemdikbud.go.id/signature/letter/${catatan?._id}`}
-                                            options={{ asHtml: true }}
-                                        >
-                                            <div>
-                                                <span className="btn-radius">
-                                                    <Button color id="Popover1" className="ml-0 mt-2 mb-2 btn-v1-outline-purple" onClick={() => {
-                                                        this.CloseCopiedd()
-                                                    }} ><span><em className="fas fa-project-diagram float-left mt-1 mr-1" />&nbsp;Link Dokumen Berita Acara</span>
-
-                                                        {/* <h5 className="p-0 mt-3 float-right"> <em className="fas fa-project-diagram float-left mt-1" /> &nbsp;Link Dokumen Berita Acara</h5> */}
-                                                    </Button>
-                                                </span>
-                                                <Popover placement="bottom" isOpen={this.state.copiedd} target="Popover1" toggle={this.Copiedd}>
-                                                    <PopoverHeader>Link Berhasil Disalin</PopoverHeader>
-                                                </Popover>
-                                            </div>
-
-                                        </CopyToClipboard>
-                                    }
-                                    {ENV === "development" &&
-                                        <CopyToClipboard
-                                            text={`https://dev.sidali.kemdikbud.go.id/signature/letter/${catatan?._id}`}
-                                            options={{ asHtml: true }}
-                                        >
-                                            <div>
-                                                <span className="btn-radius">
-                                                    <Button color id="Popover1" className="ml-0 mt-2 mb-2 btn-v1-outline-purple" onClick={() => {
-                                                        this.CloseCopiedd()
-                                                    }} ><span><em className="fas fa-project-diagram float-left mt-1 mr-1" />&nbsp;Link Dokumen Berita Acara</span>
-
-                                                        {/* <h5 className="p-0 mt-3 float-right"> <em className="fas fa-project-diagram float-left mt-1" /> &nbsp;Link Dokumen Berita Acara</h5> */}
-                                                    </Button>
-                                                </span>
-                                                <Popover placement="bottom" isOpen={this.state.copiedd} target="Popover1" toggle={this.Copiedd}>
-                                                    <PopoverHeader>Link Berhasil Disalin</PopoverHeader>
-                                                </Popover>
-                                            </div>
-
-                                        </CopyToClipboard>
-                                    }
-
-                                </Col>
-                                <Col>
-                                    <div>
-                                        <Button color className="btn-login float-right" onClick={this.handelSimpan} disabled={this.state.judul === ""} >
-                                            <span className="font-color-white">
-                                                Simpan Catatan
-                                            </span>
-                                        </Button>
-                                    </div>
-
-                                </Col>
-                            </Row>
-
-                        </Card>
-                    </Col>
-
-                </Row>
-            </ContentWrapper>
-        );
-    }
-}
-const mapStateToProps = (state) => ({ user: state.user, token: state.token });
-export default connect(mapStateToProps)(EditFile);

pages/app/perpanjangan-sanksi/new_catatan.js

@@ -1,328 +0,0 @@
-import React, { useRef, Component } from 'react';
-import { Row, Col, Button, Popover, PopoverHeader, PopoverBody, Card, CardBody, Modal, ModalBody, ModalFooter, FormGroup } from "reactstrap";
-import ReactToPrint, { PrintContextConsumer } from 'react-to-print';
-import id from 'date-fns/locale/id';
-import CopyToClipboard from "react-copy-to-clipboard";
-import { getAutoSave } from "@/actions/autosave";
-import ContentEditable from 'react-contenteditable'
-import { ToastContainer, toast } from "react-toastify";
-import Router from "next/router";
-import ContentWrapper from "@/components/Layout/ContentWrapper";
-import Swal from 'sweetalert2';
-import Datetime from "react-datetime";
-import { getOneSanksi } from "@/actions/sanksi";
-import { addCatatan } from "../../../actions/catatan";
-import { getCsrf } from "../../../actions/security";
-class Catatan extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            judul: "",
-            tanggal: "",
-            setTanggal: false,
-            isEditTanggal: false,
-            isEditTempat: false,
-            simpulan: "",
-            rekomendasi: "",
-            isi: [
-                {
-                    Aspek_Perbaikan: "",
-                    Laporan_Perbaikan: "",
-                    Hasil_Verifikasi: ""
-                },
-            ],
-        };
-    }
-    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 });
-
-    };
-    handelSimpan = async (data) => {
-        if (this.props?.user?.role.id === 2071) {
-            Swal.fire({
-                icon: 'error',
-                title: 'Oops...',
-                html: 'Maaf anda tidak memiliki akses untuk menyelesaikan<p> proses ini.</p>',
-                confirmButtonColor: "#3e3a8e",
-                confirmButtonText: 'Oke'
-            })
-        } else {
-            const getToken = await getCsrf();
-            const _csrf = getToken.token;
-            const { token, query } = this.props;
-            const { id } = query;
-            // const isi = ("editorState", draftToHtml(convertToRaw(this.state.editorState.getCurrentContent())))
-            const toastid = toast.loading("Please wait...");
-            const added = await addCatatan(token, id, {
-                "judul": this.state.judul,
-                "isi": this.state,
-                "menu": "Perpanjangan Sanksi"
-            }, _csrf);
-            if (!added) {
-                toast.update(toastid, { render: "Error", type: "error", isLoading: false, autoClose: true, closeButton: true });
-            } else {
-                toast.update(toastid, { render: "Success", type: "success", isLoading: false, autoClose: true, closeButton: true });
-                Router.push(`/app/perpanjangan-sanksi/detail?id=${id}`);
-                // this.setState({ simpan: true })
-            }
-        }
-
-    };
-
-    setHandleJudul = (e) => {
-        this.setState({ judul: e.target.value }, this.setDataCatatan);
-    };
-    isEditTanggal = () => {
-        // this.state.isEditTanggal = !this.state.isEditTanggal
-        this.setState({
-            isEditTanggal: !this.state.isEditTanggal,
-        })
-    }
-
-    isEditTempat = () => {
-        this.setState({
-            isEditTempat: !this.state.isEditTempat,
-        })
-    }
-    handleAspek = (evt, id, field) => {
-        const newValue = evt.target.value || evt.target.innerHTML;
-
-        this.setState(prevState => ({
-            isi: prevState.isi.map((item, index) =>
-                index === id
-                    ? { ...item, [field]: newValue }
-                    : item
-            )
-        }));
-
-    };
-    addRow = () => {
-        this.setState(prevState => ({
-            isi: [
-                ...prevState.isi,
-                {
-                    Aspek_Perbaikan: "",
-                    Laporan_Perbaikan: "",
-                    Hasil_Verifikasi: ""
-                }
-            ]
-        }));
-    };
-    setDataCatatan = (data) => {
-        this.setState({ dataCatatan: data });
-    }
-    removeRow = (index) => {
-        this.setState(prevState => ({
-            isi: prevState.isi.filter((_, i) => i !== index)
-        }));
-    };
-    handlePaste = (event) => {
-        event.preventDefault();
-        const text = event.clipboardData.getData('text/plain');
-        document.execCommand('insertText', false, text);
-    };
-    
-    render() {
-        const { pt } = this.state
-        const { tanggal, isEditTanggal, simpulan, catatan } = this.state
-        return (
-            <ContentWrapper>
-                <Row>
-                    <Col lg={12}>
-                        <Card body className="card-default">
-                            <FormGroup row>
-                                <label className="col-md-1  col-form-label">Judul Catatan</label>
-                                <div className="col-md-11">
-
-                                    <input type="text" name="article-title" placeholder="Judul Catatan" className="mb-3 form-control form-control-lg" onChange={this.setHandleJudul} />
-                                </div>
-                            </FormGroup>
-                            <div className='page  py-5 m-0 '>
-                                <div className='BA-Header'>
-                                    <img className='BA-logo' src="/static/img/logo-single-1-login.png" alt="logo" />
-                                    <h4 >LAPORAN HASIL VERIFIKASI DAN VALIDASI DOKUMEN USUL PENCABUTAN SANKSI ADMINISTRATIF</h4>
-                                    {pt && (<h4 className='text-uppercase' >{pt.nama}</h4>)}
-                                </div>
-                                <div className='BA-body px-5 pt-3'>
-                                    <p>
-                                        Pada hari ini
-                                        <span style={{ textIndent: "0rem" }}>
-                                            {isEditTanggal &&
-                                                <span style={{ textIndent: "0rem" }}>
-                                                    <Datetime
-                                                        timeFormat={false}
-                                                        inputProps={{ className: "form-control" }}
-                                                        value={tanggal ? new Date(tanggal) : tanggal || "Isi Tanggal"}
-                                                        onChange={(tanggal) => {
-                                                            this.setState({ tanggal, setTanggal: true })
-                                                        }}
-                                                        closeOnSelect={true}
-
-                                                    />
-                                                    <button className='bg-transparent button-transparent border-0 fas fa-times-circle text-danger' onClick={this.isEditTanggal} />
-                                                    <button className='bg-transparent button-transparent border-0 fas fa-check-circle text-success' onClick={this.isEditTanggal}
-                                                    />
-                                                </span>
-                                            }
-                                        </span>
-                                        {this.state?.setTanggal === true ?
-                                            <span onClick={this.isEditTanggal}> {moment(tanggal || this.state?.tanggal).locale("id").format("dddd")}, tanggal&nbsp;{moment(tanggal || this.state?.tanggal).format("D")}&nbsp;bulan&nbsp;{moment(tanggal || this.state?.tanggal).locale("id").format("MMMM")} tahun &nbsp;{moment(tanggal || this.state?.tanggal).format("YYYY")},</span> :
-                                            <span onClick={this.isEditTanggal}><strong>&nbsp;[Mohon Diisi] &nbsp;</strong></span>
-                                        }
-                                        &nbsp;bertempat di
-                                        {this.state.isEditTempat &&
-                                            <span>
-                                                <input type='text'
-                                                    defaultValue={""}
-                                                    ref="inputTempat"
-                                                    onChange={() => {
-                                                        this.setState({ tempat: this.refs.inputTempat.value })
-                                                    }}
-                                                />
-                                                <button className='bg-transparent button-transparent border-0 fas fa-times-circle text-danger' onClick={this.isEditTempat} />
-                                                <button className='bg-transparent button-transparent border-0 fas fa-check-circle text-success' onClick={() => { this.isEditTempat() }} />
-                                            </span>
-                                        }
-                                        {this.state?.tempat ?
-                                            <span onClick={this.isEditTempat} className='hhh'>
-                                                &nbsp;{this.state?.tempat}
-                                            </span>
-                                            :
-                                            <span onClick={this.isEditTempat}><strong>&nbsp;[Mohon Diisi] &nbsp;</strong></span>
-                                        }
-
-                                        ,
-                                        telah dilakukan rapat Verifikasi dan Validasi Dokumen Usul Pencabutan Sanksi Administratif {pt && (<span>{pt.nama}</span>)}, yang dihadiri oleh:
-                                        <ol>
-                                            {catatan?.daftar_kehadiran_peserta?.map((value) =>
-                                                <li>
-                                                    {value.nama}
-                                                    {/* <button className="bg-transparent button-transparent border-0 fas fa-trash text-danger float-right"
-                                            onClick={() => {
-                                                this.setState({
-                                                    selectedPeserta: value._id
-                                                })
-                                                this.setModalRemovePeserta()
-                                            }} /> */}
-                                                </li>)}
-                                        </ol>
-                                    </p>
-                                    <div className='table-a my-4 pl-5 pr-5' >
-                                        <div className=' d-inline-block'>
-                                            <Button color="primary" className="mb-2 float-md-right" onClick={this.addRow}>Tambah Baris</Button>
-                                        </div>
-
-                                        <table className=' ml-auto mr-auto'>
-                                            <thead >
-                                                <tr>
-                                                    <th >NO</th>
-                                                    <th>ASPEK PERBAIKAN</th>
-                                                    <th >LAPORAN PERBAIKAN</th>
-                                                    <th >HASIL VERIFIKASI DAN VALIDASI</th>
-                                                </tr>
-                                            </thead>
-                                            <tbody>
-                                                {this.state.isi.map((isi, index) => (
-                                                    <tr key={index}>
-                                                        <td>{index + 1}</td>
-
-                                                        <td style={{ width: "30%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Aspek_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-
-                                                        <td style={{ width: "30%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Laporan_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-
-                                                        <td style={{ width: "40%" }}>
-                                                            <ContentEditable
-                                                                html={isi.Hasil_Verifikasi}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-                                                                onPaste={this.handlePaste}
-                                                            />
-                                                        </td>
-                                                        <td style={{ border: "transparent" }}>
-                                                            <button onClick={() => this.removeRow(index)} className="bg-transparent button-transparent border-0 fas fa-trash text-danger float-right" />
-                                                        </td>
-                                                    </tr>
-                                                ))}
-                                            </tbody>
-                                        </table>
-                                    </div>
-                                    <div className='table-b my-4 pl-4 pr-5' >
-                                        <tr>
-                                            <td style={{ width: "8%" }}>Simpulan&nbsp;:</td>
-                                            <td >
-                                                <ContentEditable
-                                                    html={this.state.simpulan}
-                                                    disabled={false}
-                                                    onChange={(e) => {
-                                                        this.setState({ simpulan: e.target.value });
-                                                    }}
-                                                    tagName="text"
-                                                    onPaste={this.handlePaste}
-                                                />
-                                            </td>
-                                        </tr>
-                                    </div>
-                                    <div className='table-b my-4 pl-4 pr-5' >
-                                        <tr>
-                                            <td style={{ width: "8%" }}>Rekomendasi&nbsp;:</td>
-                                            <td >
-                                                <ContentEditable
-                                                    html={this.state.rekomendasi}
-                                                    disabled={false}
-                                                    onChange={(e) => {
-                                                        this.setState({ rekomendasi: e.target.value });
-                                                        console.log(e)
-                                                    }}
-                                                    tagName="text"
-                                                    onPaste={this.handlePaste}
-                                                />
-                                            </td>
-                                        </tr>
-                                    </div>
-
-                                    <p>
-
-                                    </p>
-                                </div>
-                            </div>
-                        </Card>
-                    </Col>
-                    <Col>
-                        <footer>
-                            <Button color className="btn-login float-right" onClick={this.handelSimpan} disabled={this.state.judul === ""}>
-                                <span className="font-color-white">
-                                    Simpan Catatan
-                                </span>
-                            </Button>
-                        </footer>
-                    </Col>
-
-                </Row>
-
-            </ContentWrapper>
-        )
-    }
-
-}
-
-export default Catatan
-