import React, { Component } from "react";
import Router from "next/router";
import ContentWrapper from "@/components/Layout/ContentWrapper";
import { Row, Col, Progress, Modal, ModalHeader, ModalBody, ModalFooter, Button, Table } from "reactstrap";
import { getPelaporan } from "../../../../actions/pelaporan";

import Sparkline from "@/components/Common/Sparklines";
import Datatable from "@/components/Tables/Datatable";
import moment from "moment";

class Keberatan extends Component {
	constructor(props) {
		super(props);
		this.state = {
			modal: false,
		};
	}

	// static getInitialProps = async () => {
	// 	const pelaporan = await getPelaporan();
	// 	return { pelaporan };
	// };

	detailKeberatanClick = (e, ptId, number) => {
		e.preventDefault();
		Router.push({
			pathname: "/app/pt/keberatan/detail",
		});
	};

	render() {
		console.log(this.state);
		// const { pelaporan } = this.props;
		return (
			<ContentWrapper>
				<div className="content-heading">Permohonan Keberatan</div>
				<Row>
					<Col lg={12}>
						<div className="card b">
							<div className="card-body">
								<Table options={{ responsive: true }}>
									{/* <table className="table w-100"> */}
									<thead>
										<tr>
											<th>#ID</th>
											<th>Description</th>
											<th>Created</th>
											<th>Status</th>
											<th></th>
										</tr>
									</thead>
									<tbody>
										{/* {pelaporan.data.map((value) => {
											return ( */}
										<tr key={1}>
											<td>BI:408066447929</td>
											<td className="text-nowrap">
												<div className="media align-items-center">
													<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
													<div className="media-body d-flex">
														<div>
															<h4 className="m-0">Universitas Satyagama</h4>
															<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
															<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit, animi?</p>
														</div>
													</div>
												</div>
											</td>
											<td>{moment().fromNow()}</td>
											<td>
												<div className="inline wd-xxs badge badge-success">open</div>
											</td>
											<td>
												<Button color="primary" onClick={(e) => this.detailKeberatanClick(e)}>
													Detail
												</Button>

												{/* <Swal options={this.state.swalOption} callback={this.swalCallback} className="btn btn-primary">
															Ajukan
														</Swal> */}
												{/* START card */}
												{/* Button trigger modal */}
												{/* <Button color="primary" onClick={(e) => this.permohonanClick(e, value.pt_id, value.number)}>
															Ajukan
														</Button> */}
												{/* END card */}
												{/* <Button onClick={(e) => this.permohonanClick(e, value.pt_id, value.number)} className="btn-primary">
															Ajukan
														</Button> */}
											</td>
										</tr>
										{/* );
										})} */}
									</tbody>
									{/* </table> */}
								</Table>
							</div>
						</div>
					</Col>
				</Row>
			</ContentWrapper>
		);
	}
}

export default Keberatan;