import React, { Component } from 'react';
import ContentWrapper from '@/components/Layout/ContentWrapper';
import { Row, Col, Card, CardHeader, CardBody, Table } from 'reactstrap';


function TableRadarr({ listData }) {
    return (
        <Card className="card-default">
            <CardBody>
                <Table bordered responsive>
                    <thead>
                        <tr >
                            <th>Wilayah LLDikti\Menu</th>
                            <th style={{
                                backgroundColor: '#80b1ff',
                                color: "black",
                            }}>Penjadwalan Evaluasi</th>
                            <th style={{
                                backgroundColor: '#de8383',
                                color: "black",
                            }}>Pemeriksaan</th>
                            <th style={{
                                backgroundColor: '#fdda80',
                                color: "black",
                            }}>Sanksi</th>
                            <th style={{
                                backgroundColor: '#cfab80',
                                color: "black",
                            }}>Keberatan</th>
                            <th style={{
                                backgroundColor: '#ef90df',
                                color: "black",
                            }}>Banding</th>
                            <th style={{
                                backgroundColor: '#80df89',
                                color: "black",
                            }}>Pemantauan perbaikan</th>
                            <th style={{
                                backgroundColor: '#a3d4d1',
                                color: "black",
                            }}>Pencabutan Sanksi</th>
                        </tr>
                    </thead>
                    {listData.map((data) => {
                        return (
                            <tr key={data.id}>
                                <td>{data.pembina.name}</td>
                                <td style={{
                                    backgroundColor: '#80b1ff',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_jadwal_evaluasi}</td>
                                <td style={{
                                    backgroundColor: '#de8383',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_pemeriksaan}</td>
                                <td style={{
                                    backgroundColor: '#fdda80',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_sanksi}</td>
                                <td style={{
                                    backgroundColor: '#cfab80',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_keberatan}</td>
                                <td style={{
                                    backgroundColor: '#ef90df',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_banding}</td>
                                <td style={{
                                    backgroundColor: '#80df89',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_pemantauan_perbaikan}</td>
                                <td style={{
                                    backgroundColor: '#a3d4d1',
                                    color: "black",
                                    textAlign: "center",
                                }}>{data.jumlah_pencabutan_sanksi}</td>
                            </tr>)
                    })}
                </Table>
            </CardBody>
        </Card>
    )
}

export default TableRadarr