|  | @@ -0,0 +1,160 @@
 | 
	
		
			
				|  |  | +import Datatable from "@/components/Tables/Datatable";
 | 
	
		
			
				|  |  | +import { Button } from "reactstrap";
 | 
	
		
			
				|  |  | +import Link from "next/link";
 | 
	
		
			
				|  |  | +import moment from "moment";
 | 
	
		
			
				|  |  | +import { bypassCabutSanksi } from "../../actions/cabutSanksi";
 | 
	
		
			
				|  |  | +import { useSelector } from "react-redux";
 | 
	
		
			
				|  |  | +import { ToastContainer, toast } from "react-toastify";
 | 
	
		
			
				|  |  | +import Router from "next/router";
 | 
	
		
			
				|  |  | +import { useState } from "react";
 | 
	
		
			
				|  |  | +import { Modal, ModalBody, ModalFooter } from "reactstrap";
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +function TableBypass({ listData, to, linkName }) {
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    const token = useSelector((state) => state.token)
 | 
	
		
			
				|  |  | +    const [modalIsOpen, setModalIsOpen] = useState(false)
 | 
	
		
			
				|  |  | +    const [seledtedID, setSelectedID] = useState("")
 | 
	
		
			
				|  |  | +    const setmodal = (id) => {
 | 
	
		
			
				|  |  | +        setModalIsOpen(true)
 | 
	
		
			
				|  |  | +        setSelectedID(id)
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    return (
 | 
	
		
			
				|  |  | +        <div className="card b">
 | 
	
		
			
				|  |  | +            <Modal isOpen={modalIsOpen} >
 | 
	
		
			
				|  |  | +                <ModalBody>Apakah Anda yakin akan mencabut sanksi pada laporan ini?</ModalBody>
 | 
	
		
			
				|  |  | +                <ModalFooter>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +                    <Button color className="btn-login" onClick={async () => {
 | 
	
		
			
				|  |  | +                        await toast.promise(bypassCabutSanksi(token, seledtedID), {
 | 
	
		
			
				|  |  | +                            pending: "Loading",
 | 
	
		
			
				|  |  | +                            success: "Success",
 | 
	
		
			
				|  |  | +                            error: "Error",
 | 
	
		
			
				|  |  | +                        });
 | 
	
		
			
				|  |  | +                        Router.push(`/app/pencabutan-sanksi/detail?id=${seledtedID}`);
 | 
	
		
			
				|  |  | +                        setModalIsOpen(false)
 | 
	
		
			
				|  |  | +                    }}>
 | 
	
		
			
				|  |  | +                        <span className="font-color-white">Ya</span>
 | 
	
		
			
				|  |  | +                    </Button>
 | 
	
		
			
				|  |  | +                    <Button color className="btn-v2" onClick={setModalIsOpen}>
 | 
	
		
			
				|  |  | +                        Tidak
 | 
	
		
			
				|  |  | +                    </Button>
 | 
	
		
			
				|  |  | +                </ModalFooter>
 | 
	
		
			
				|  |  | +            </Modal>
 | 
	
		
			
				|  |  | +            <div className="card-body card-over">
 | 
	
		
			
				|  |  | +                <Datatable options={{ responsive: false, ordering: true }}>
 | 
	
		
			
				|  |  | +                    <table className="table w-100" data-order='[[3, "desc"]]'>
 | 
	
		
			
				|  |  | +                        <thead>
 | 
	
		
			
				|  |  | +                            <tr>
 | 
	
		
			
				|  |  | +                                <th>Nomor Sanksi</th>
 | 
	
		
			
				|  |  | +                                <th>Deskripsi Sanksi</th>
 | 
	
		
			
				|  |  | +                                {/* <th>Created</th> */}
 | 
	
		
			
				|  |  | +                                <th>Status</th>
 | 
	
		
			
				|  |  | +                                <th>Aksi</th>
 | 
	
		
			
				|  |  | +                            </tr>
 | 
	
		
			
				|  |  | +                        </thead>
 | 
	
		
			
				|  |  | +                        <tbody>
 | 
	
		
			
				|  |  | +                            {listData.length
 | 
	
		
			
				|  |  | +                                ? listData.map((data) => {
 | 
	
		
			
				|  |  | +                                    return (
 | 
	
		
			
				|  |  | +                                        <tr key={data._id}>
 | 
	
		
			
				|  |  | +                                            {/* <td>{data.no_sanksi}</td> */}
 | 
	
		
			
				|  |  | +                                            <td>
 | 
	
		
			
				|  |  | +                                                <div className="media align-items-center">
 | 
	
		
			
				|  |  | +                                                    <div className="media-body d-flex">
 | 
	
		
			
				|  |  | +                                                        <div>
 | 
	
		
			
				|  |  | +                                                            <h4>{data.no_sanksi}</h4>
 | 
	
		
			
				|  |  | +                                                            <p>{moment(data.createdAt).format("DD-MM-YYYY")}</p>
 | 
	
		
			
				|  |  | +                                                        </div>
 | 
	
		
			
				|  |  | +                                                    </div>
 | 
	
		
			
				|  |  | +                                                </div>
 | 
	
		
			
				|  |  | +                                            </td>
 | 
	
		
			
				|  |  | +                                            <td>
 | 
	
		
			
				|  |  | +                                                <div className="table-desc">
 | 
	
		
			
				|  |  | +                                                    <div className="media align-items-center">
 | 
	
		
			
				|  |  | +                                                        <div className="media-body d-flex">
 | 
	
		
			
				|  |  | +                                                            <div>
 | 
	
		
			
				|  |  | +                                                                {/* <h4 className="m-0">{data.laporan.pt.nama}</h4> */}
 | 
	
		
			
				|  |  | +                                                                <h4 className="m-0">{data.laporan.pt.nama.length > 64 ? data.laporan.pt.nama.substring(0, 64) + "..." : data.laporan.pt.nama}</h4>
 | 
	
		
			
				|  |  | +                                                                {/* <p className="w-105">{data.keterangan.length > 150 ? data.keterangan.substring(0, 150) + "..." : data.keterangan}</p> */}
 | 
	
		
			
				|  |  | +                                                                <p className="w-105">{data.keterangan}</p>
 | 
	
		
			
				|  |  | +                                                            </div>
 | 
	
		
			
				|  |  | +                                                        </div>
 | 
	
		
			
				|  |  | +                                                    </div>
 | 
	
		
			
				|  |  | +                                                </div>
 | 
	
		
			
				|  |  | +                                            </td>
 | 
	
		
			
				|  |  | +                                            {/* <td>{moment(data.createdAt).fromNow()}</td> */}
 | 
	
		
			
				|  |  | +                                            {/* <td>{moment(data.createdAt).format("DD MMMM YYYY")}</td> */}
 | 
	
		
			
				|  |  | +                                            <td>{data.last_step ?
 | 
	
		
			
				|  |  | +                                                <div>
 | 
	
		
			
				|  |  | +                                                    <div className="badge badge-green">{data.last_step}</div>
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Permohonan Keberatan" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">Sanksi dalam proses pengajuan permohonan keberatan</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Jawaban Atas Permohonan Keberatan" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">PDDIKTI sudah memberikan jawaban atas permohonan keberatan</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Permohonan Banding" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">Sanksi dalam proses pengajuan permohonan banding</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Jawaban Atas Permohonan Banding" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">PDDIKTI sudah memberikan jawaban atas permohonan banding</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Permohonan Pencabutan Sanksi" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">Sanksi dalam proses permohonan pencabutan sanksi</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Jawaban Atas Permohonan Pencabutan Sanksi" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">PDDIKTI sudah memberikan jawaban atas permohonan pencabutan sanksi</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +                                                    {data.last_step === "Dokumen Perbaikan" && (
 | 
	
		
			
				|  |  | +                                                        <p className="w-105">Proses perbaikan dokumen</p>
 | 
	
		
			
				|  |  | +                                                    )}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +                                                </div>
 | 
	
		
			
				|  |  | +                                                :
 | 
	
		
			
				|  |  | +                                                <div>
 | 
	
		
			
				|  |  | +                                                    <div className="badge badge-red">Belum Diperiksa</div>
 | 
	
		
			
				|  |  | +                                                    <p className="w-105">Sanksi belum diperiksa</p>
 | 
	
		
			
				|  |  | +                                                </div>}
 | 
	
		
			
				|  |  | +                                            </td>
 | 
	
		
			
				|  |  | +                                            <td
 | 
	
		
			
				|  |  | +                                                style={{ width: "25%" }}
 | 
	
		
			
				|  |  | +                                            >
 | 
	
		
			
				|  |  | +                                                <Link
 | 
	
		
			
				|  |  | +                                                    href={{
 | 
	
		
			
				|  |  | +                                                        pathname: to,
 | 
	
		
			
				|  |  | +                                                        query: { id: data._id },
 | 
	
		
			
				|  |  | +                                                    }}
 | 
	
		
			
				|  |  | +                                                >
 | 
	
		
			
				|  |  | +                                                    <Button className="btn-login float-right" color
 | 
	
		
			
				|  |  | +                                                        style={{ borderRadius: "7px" }}
 | 
	
		
			
				|  |  | +                                                    >
 | 
	
		
			
				|  |  | +                                                        <span className="font-color-white">
 | 
	
		
			
				|  |  | +                                                            {linkName}
 | 
	
		
			
				|  |  | +                                                        </span>
 | 
	
		
			
				|  |  | +                                                    </Button>
 | 
	
		
			
				|  |  | +                                                </Link>
 | 
	
		
			
				|  |  | +                                                <Button className="btn-v2 float-right mr-2" color
 | 
	
		
			
				|  |  | +                                                    style={{ borderRadius: "7px" }}
 | 
	
		
			
				|  |  | +                                                    onClick={() => { setmodal(data._id) }}
 | 
	
		
			
				|  |  | +                                                >
 | 
	
		
			
				|  |  | +                                                    <span className="font-color-black">
 | 
	
		
			
				|  |  | +                                                        Cabut Sanksi
 | 
	
		
			
				|  |  | +                                                    </span>
 | 
	
		
			
				|  |  | +                                                </Button>
 | 
	
		
			
				|  |  | +                                            </td>
 | 
	
		
			
				|  |  | +                                        </tr>
 | 
	
		
			
				|  |  | +                                    );
 | 
	
		
			
				|  |  | +                                })
 | 
	
		
			
				|  |  | +                                : ""}
 | 
	
		
			
				|  |  | +                        </tbody>
 | 
	
		
			
				|  |  | +                    </table>
 | 
	
		
			
				|  |  | +                </Datatable>
 | 
	
		
			
				|  |  | +            </div>
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +    );
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +export default TableBypass;
 |