TableSanksi.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. import moment from "moment";
  2. import { Button, Table } from "reactstrap";
  3. import Link from "next/link";
  4. function TableSanksi({ listData, to, linkName }) {
  5. return (
  6. <div className="card b">
  7. <div className="card-body card-over">
  8. <Table className="table w-100">
  9. <thead>
  10. <tr>
  11. <th>Nomor Sanksi</th>
  12. <th>Keterangan Sanksi</th>
  13. {/* <th>Created</th> */}
  14. <th>Status</th>
  15. </tr>
  16. </thead>
  17. <tbody>
  18. {listData.map((data) => {
  19. return (
  20. <tr key={data._id}>
  21. {/* <td>{data.no_sanksi}</td> */}
  22. <td>
  23. <div className="media align-items-center">
  24. <div className="media-body d-flex">
  25. <div>
  26. <h4>{data.no_sanksi}</h4>
  27. <p>{moment(data.createdAt).format("DD-MM-YYYY")}</p>
  28. </div>
  29. </div>
  30. </div>
  31. </td>
  32. <td>
  33. <div className="table-desc">
  34. <div className="media align-items-center">
  35. <div className="media-body d-flex">
  36. <div>
  37. <h4 className="m-0">{data.laporan.pt.nama.length > 64 ? data.laporan.pt.nama.substring(0, 64) + "..." : data.laporan.pt.nama}</h4>
  38. <p className="w-105">{data.keterangan}</p>
  39. </div>
  40. </div>
  41. </div>
  42. </div>
  43. </td>
  44. {/* <td>{moment(data.createdAt).format("DD MMMM YYYY")}</td> */}
  45. <td>{data.is_pengajuan_keberatan === true || data.is_pengajuan_keberatan === false ? <div className="badge badge-green">Sudah Diperiksa</div> : <div className="badge badge-red">Belum Diperiksa</div>}</td>
  46. <td>
  47. <Link href={{ pathname: to, query: { id: data._id } }}>
  48. <Button className="btn-login" color >
  49. <span className="font-color-white">
  50. {linkName}
  51. </span>
  52. </Button>
  53. </Link>
  54. </td>
  55. </tr>
  56. );
  57. })}
  58. </tbody>
  59. </Table>
  60. </div>
  61. </div>
  62. );
  63. }
  64. export default TableSanksi;