ptb-fe/components/Sanksi/Ringkasan.js

import Scrollable from "@/components/Common/Scrollable";
import { Card, Row, Col, Table, FormGroup } from "reactstrap";

function Ringkasan() {
	return (
		<>
			<Row>
				<Col>
					<p className="lead bb">Detail Laporan</p>
					<form className="form-horizontal">
						<FormGroup row>
							<Col md="4">Nomor Laporan:</Col>
							<Col md="8">
								<strong>987654</strong>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Nama Perguruan Tinggi:</Col>
							<Col md="8">
								<strong>Universitas Satyagama</strong>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Jenis Pelanggaran:</Col>
							<Col md="8">
								<Scrollable height="75px" className="list-group">
									<ul>
										<li>Lorem ipsum dolor sit amet.</li>
										<li>Lorem, ipsum dolor.</li>
										<li>Lorem ipsum dolor sit.</li>
									</ul>
								</Scrollable>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Keterangan Laporan:</Col>
							<Col md="8">
								<Scrollable height="100px" className="list-group">
									<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Amet dicta placeat enim illo aspernatur adipisci neque repellendus itaque blanditiis fugit. Quam obcaecati sed perferendis facere.</p>
								</Scrollable>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Dibuat Pada:</Col>
							<Col md="8">
								<strong>23 Januari 2022</strong>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Status</Col>
							<Col md="8">
								<div className="badge badge-info">Ditindaklanjuti</div>
							</Col>
						</FormGroup>
					</form>
				</Col>
			</Row>
			<Row>
				<Col>
					<p className="lead bb">Penetapan Sanksi</p>
					<Card className="card-default">
						<Table bordered hover responsive>
							<thead>
								<tr>
									<th>No</th>
									<th>Jenis Pelanggaran</th>
									<th>Sanksi</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>1</td>
									<td>
										<div className="media align-items-center">
											<div className="media-body d-flex">
												<div>
													<p>Pengelolaan perguruan tinggi tidak berprinsip nirlaba</p>
													<p>TMT : 6 Bulan</p>
													<p>Level Pelanggaran : Berat</p>
												</div>
											</div>
										</div>
									</td>
									<td>
										<div className="media align-items-center">
											<div className="media-body d-flex">
												<div>
													<p>Penghentian pembinaan</p>
													<p>Keterangan : Penarikan Dosen Pegawai Negeri Sipil yang dipekerjakan</p>
												</div>
											</div>
										</div>
									</td>
								</tr>
							</tbody>
						</Table>
					</Card>
				</Col>
			</Row>
			<Row>
				<Col>
					<p className="lead bb">Nomor Surat keputusan Sanksi</p>
					<form className="form-horizontal">
						<FormGroup row>
							<Col md="4">Nomor Surat:</Col>
							<Col md="8">
								<strong>987654</strong>
							</Col>
						</FormGroup>
						<FormGroup row>
							<Col md="4">Surat Sanksi:</Col>
							<Col md="8">
								<Scrollable height="120px" className="list-group">
									<table className="table table-bordered bg-transparent">
										<tbody>
											<tr>
												<td>
													<em className="fa-lg far fa-file-code"></em>
												</td>
												<td>
													<a className="text-muted" href="">
														database.controller.js
													</a>
												</td>
											</tr>
										</tbody>
									</table>
								</Scrollable>
							</Col>
						</FormGroup>
					</form>
				</Col>
			</Row>
		</>
	);
}

export default Ringkasan;