|
|
@@ -1,12 +1,8 @@
|
|
|
import React, { Component } from "react";
|
|
|
-import Router from "next/router";
|
|
|
import ContentWrapper from "@/components/Layout/ContentWrapper";
|
|
|
-import { Row, Col, Progress, Button } from "reactstrap";
|
|
|
-import { getPelaporan } from "../../../actions/pelaporan";
|
|
|
-
|
|
|
-import Sparkline from "@/components/Common/Sparklines";
|
|
|
-import Datatable from "@/components/Tables/Datatable";
|
|
|
-import moment from "moment";
|
|
|
+import { Row, Col } from "reactstrap";
|
|
|
+import CaseProgress from "@/components/Main/CaseProgress";
|
|
|
+import TableSanksi from "@/components/Main/TableSanksi";
|
|
|
|
|
|
class Keberatan extends Component {
|
|
|
constructor(props) {
|
|
|
@@ -14,154 +10,19 @@ class Keberatan extends Component {
|
|
|
}
|
|
|
|
|
|
static getInitialProps = async () => {
|
|
|
- const pelaporan = await getPelaporan();
|
|
|
- return { pelaporan };
|
|
|
- };
|
|
|
-
|
|
|
- newReportClick = (e) => {
|
|
|
- e.preventDefault();
|
|
|
- Router.push({
|
|
|
- pathname: "/app/pelaporan/search",
|
|
|
- });
|
|
|
- };
|
|
|
-
|
|
|
- detailKeberatanClick = (e, ptId, number) => {
|
|
|
- e.preventDefault();
|
|
|
- Router.push({
|
|
|
- pathname: "/app/keberatan/detail",
|
|
|
- });
|
|
|
+ return {};
|
|
|
};
|
|
|
|
|
|
render() {
|
|
|
- const { pelaporan } = this.props;
|
|
|
+ const { sanksi } = this.props;
|
|
|
return (
|
|
|
<ContentWrapper>
|
|
|
<div className="content-heading">Keberatan</div>
|
|
|
<Row>
|
|
|
<Col lg="4">
|
|
|
- <div className="card b">
|
|
|
- <div className="card-body bb">
|
|
|
- <p>Overvall progress</p>
|
|
|
- <div className="d-flex align-items-center mb-2">
|
|
|
- <div className="w-100">
|
|
|
- <Progress className="progress-xs m0" color="info" value={20} />
|
|
|
- </div>
|
|
|
- <div className="ml-auto">
|
|
|
- <div className="col wd-xxs text-right">
|
|
|
- <div className="text-bold text-muted">20%</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div className="card-body">
|
|
|
- <p>Metrics</p>
|
|
|
- <div className="row text-center">
|
|
|
- <div className="col-6 col-lg-6 col-xl-6">
|
|
|
- <Sparkline
|
|
|
- values={[20, 80]}
|
|
|
- options={{
|
|
|
- type: "pie",
|
|
|
- height: "50",
|
|
|
- sliceColors: ["#edf1f2", "#23b7e5"],
|
|
|
- }}
|
|
|
- className="sparkline"
|
|
|
- />
|
|
|
- <p className="mt-3">Open Case</p>
|
|
|
- </div>
|
|
|
- <div className="col-6 col-lg-6 col-xl-6">
|
|
|
- <Sparkline
|
|
|
- values={[80, 20]}
|
|
|
- options={{
|
|
|
- type: "pie",
|
|
|
- height: "50",
|
|
|
- sliceColors: ["#edf1f2", "#27c24c"],
|
|
|
- }}
|
|
|
- className="sparkline"
|
|
|
- />
|
|
|
- <p className="mt-3">Close Case</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <table className="table bb">
|
|
|
- <tbody>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <strong>Open Case</strong>
|
|
|
- </td>
|
|
|
- <td>80</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <strong>Close Case</strong>
|
|
|
- </td>
|
|
|
- <td>20</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <strong>Performance</strong>
|
|
|
- </td>
|
|
|
- <td>
|
|
|
- <em className="far fa-smile fa-lg text-warning"></em>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <strong>Last Case Closed</strong>
|
|
|
- </td>
|
|
|
- <td>BI:1107 - 12/01/2016</td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- </div>
|
|
|
- </Col>
|
|
|
- <Col lg="8">
|
|
|
- <div className="card b">
|
|
|
- <div className="card-body">
|
|
|
- <Datatable options={{ responsive: true }}>
|
|
|
- <table className="table w-100">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th>#ID</th>
|
|
|
- <th>Description</th>
|
|
|
- <th>Created</th>
|
|
|
- <th>Status</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- {pelaporan.data.map((value) => {
|
|
|
- return (
|
|
|
- <tr key={value._id}>
|
|
|
- <td>BI:{value._number}</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>{value.description}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- <td>{moment(value.createdAt).fromNow()}</td>
|
|
|
- {/* <td>
|
|
|
- <div className="inline wd-xxs badge badge-success">open</div>
|
|
|
- </td> */}
|
|
|
- <td>
|
|
|
- <Button color="primary" onClick={(e) => this.detailKeberatanClick(e, value.pt_id, value.number)}>
|
|
|
- Detail
|
|
|
- </Button>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- );
|
|
|
- })}
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- </Datatable>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <CaseProgress />
|
|
|
</Col>
|
|
|
+ <Col lg="8">{/* <TableSanksi listData={sanksi.data} to="/app/keberatan/detail" linkName="Detail" /> */}</Col>
|
|
|
</Row>
|
|
|
</ContentWrapper>
|
|
|
);
|