53 lines
2.1 KiB
TypeScript
53 lines
2.1 KiB
TypeScript
export default function PostRecapTable() {
|
|
const postsData = [
|
|
{ name: "POLDA SUMUT", posts: 5304 },
|
|
{ name: "SATWIL", posts: 4043 },
|
|
{ name: "POLDA JATENG", posts: 3482 },
|
|
{ name: "POLDA JATIM", posts: 3138 },
|
|
{ name: "POLDA SUMSEL", posts: 2677 },
|
|
{ name: "POLDA JABAR", posts: 1677 },
|
|
{ name: "POLDA KALTIM", posts: 1565 },
|
|
{ name: "POLDA RIAU", posts: 1192 },
|
|
{ name: "POLDA KALBAR", posts: 920 },
|
|
{ name: "POLDA SULBAR", posts: 730 },
|
|
{ name: "POLDA METRO JAYA", posts: 707 },
|
|
{ name: "POLDA BALI", posts: 580 },
|
|
{ name: "POLDA SULTRA", posts: 375 },
|
|
{ name: "POLDA MALUKU", posts: 373 },
|
|
{ name: "POLDA BABEL", posts: 344 },
|
|
];
|
|
|
|
return (
|
|
<div className="p-4 bg-white shadow-md rounded-lg w-full lg:w-[55%]">
|
|
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-center mb-4">
|
|
<h2 className="font-semibold text-xs sm:text-sm">Rekapitulasi Post Berita Polda/Polres Pada Website</h2>
|
|
<p className="text-xs mt-2 sm:mt-0 sm:text-right">
|
|
<span className="font-semibold">01-05-2025</span> - <span className="font-semibold">08-05-2025</span>
|
|
</p>
|
|
</div>
|
|
|
|
{/* Scrollable container */}
|
|
<div className="max-h-[400px] overflow-y-auto overflow-x-auto rounded">
|
|
<table className="min-w-full text-sm text-left">
|
|
<thead className="text-black sticky top-0 z-10 bg-white">
|
|
<tr>
|
|
<th className="border px-4 py-2 w-10">NO</th>
|
|
<th className="border px-4 py-2">POLDA/POLRES</th>
|
|
<th className="border px-4 py-2 text-right">JUMLAH POST BERITA</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="text-gray-700">
|
|
{postsData.map((item, index) => (
|
|
<tr key={index} className="hover:bg-gray-50">
|
|
<td className="border px-4 py-2 text-center">{index + 1}</td>
|
|
<td className="border px-4 py-2">{item.name}</td>
|
|
<td className="border px-4 py-2 text-right">{item.posts}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|