| 
					
				 | 
			
			
				@@ -7,6 +7,7 @@ import { getOneLaporan, updateLaporan } from "@/actions/pelaporan"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import Router from "next/router"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import { ToastContainer, toast } from "react-toastify"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import { getAutoSave } from "@/actions/autosave"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import Datatable from "@/components/Tables/Datatable"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -17,7 +18,7 @@ export class TablePenetapanSanksi extends Component { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 	constructor(props) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 		super(props); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 		this.state = { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-			pelanggaran: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			// pelanggaran: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 			checkedData: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 			labelSanksi: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 			btnDelegasi: false, 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -61,76 +62,74 @@ export class TablePenetapanSanksi extends Component { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 		const { pelanggaran, labelSanksi, checkedData } = this.state; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 		return ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-			<Card className="card-default"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-				<Table bordered hover responsive> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					<thead> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-						<tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							<th>No</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							<th>Jenis Pelanggaran</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							<th>Sanksi</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							<th></th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-						</tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					</thead> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					<tbody> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-						{pelanggaran 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							? pelanggaran.data.map((jp, index) => ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-								<tr key={jp._id}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										<label>{index + 1}</label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										<div className="media align-items-center"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-											<div className="media-body d-flex"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-												<div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													<p>{jp.pelanggaran}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													{/* <p>TMT : {jp.tmt_bulan} Bulan</p> */} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<div className="card b "> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<div className="card-body card-over"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					{pelanggaran && <Datatable options={{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						responsive: false, ordering: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						paging: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						// searching:false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						ordering: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						// info: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					}}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						<table className="table w-100" > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							<thead> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<th>No</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<th>Jenis Pelanggaran</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<th>Sanksi</th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<th></th> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								</tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							</thead> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							<tbody> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								{pelanggaran?.data?.map((jp, index) => 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<tr key={jp._id}> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											<label>{index + 1}</label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											<div className="media align-items-center"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+												<div className="media-body d-flex"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													<div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														<p>{jp.pelanggaran}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														{/* <p>TMT : {jp.tmt_bulan} Bulan</p> */} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 												</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 											</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										<div className="media align-items-center"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-											<div className="media-body d-flex"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-												<div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													<p>{jp.sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													<p>Keterangan : {jp.keterangan_sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											<div className="media align-items-center"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+												<div className="media-body d-flex"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													<div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														<p>{jp.sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														<p>Keterangan : {jp.keterangan_sanksi}</p> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 												</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 											</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										<div className="checkbox c-checkbox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-											<label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-												<input type="checkbox" checked={checkedData.find(id => id === jp._id)} value={jp._id} onChange={(evt) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													this.onHandleChange(evt) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													this.setLabelSanksi(evt, jp.label_sanksi) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-													this.props.handleAutoSave() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-												}} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-												<span className="fa fa-check"></span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-											</label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-										</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-								</tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							)) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							: ""} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					</tbody> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-				</Table> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-				<div className="float-right m-2 "> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					{this.props.user?.role.id === 2020 ? ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-						labelSanksi.length && labelSanksi.filter((e) => e.labelSanksi === "Ringan" || e.labelSanksi === "Sedang").length === labelSanksi.length ? ( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							<Button className="btn-login float-right" color onClick={this.ondelegasi} > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-								<span className="font-color-white"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-									Delegasi ke LLDIKTI 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-								</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-							</Button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-						) : ("") 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-					) : ("") 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										<td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											<div className="checkbox c-checkbox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+												<label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													<input type="checkbox" checked={checkedData.find(id => id === jp._id)} value={jp._id} onChange={(evt) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														this.onHandleChange(evt) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														this.setLabelSanksi(evt, jp.label_sanksi) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+														this.props.handleAutoSave() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													}} /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+													<span className="fa fa-check"></span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+												</label> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										</td> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									</tr> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							</tbody> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						</table> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					</Datatable> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 					} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 				</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-			</Card> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 		); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 |