Basdat/web/js/pages/admin/tabs/ReportsTab.js
2025-12-20 00:01:08 +07:00

56 lines
2.4 KiB
JavaScript

// assets/js/pages/admin/tabs/ReportsTab.js
const ReportsTab = ({ handlers, loading }) => {
const { handleExport } = handlers;
return (
<div className="bg-gradient-to-br from-slate-800 to-slate-900 rounded-xl p-6 shadow-xl border border-slate-700">
<h2 className="text-xl font-semibold mb-6 text-white">Export Laporan</h2>
<div className="space-y-4">
<div>
<label className="block font-semibold mb-2 text-slate-300">
Periode
</label>
<select
name="period"
className="w-full px-4 py-3 bg-slate-700 border-2 border-slate-600 rounded-xl text-white focus:border-blue-500 focus:outline-none"
>
<option value="month">Bulan Ini</option>
<option value="semester">Semester Ini</option>
<option value="year">Tahun Ini</option>
</select>
</div>
<div>
<label className="block font-semibold mb-2 text-slate-300">
Tipe Laporan
</label>
<select
name="report_type"
className="w-full px-4 py-3 bg-slate-700 border-2 border-slate-600 rounded-xl text-white focus:border-blue-500 focus:outline-none"
>
<option value="items">Barang Ditemukan</option>
<option value="archives">Arsip</option>
<option value="claims">Klaim</option>
</select>
</div>
<div className="flex gap-4 pt-4">
<button
onClick={() => handleExport("pdf")}
disabled={loading}
className="flex-1 px-6 py-3 bg-gradient-to-r from-green-600 to-green-700 text-white rounded-xl hover:from-green-700 hover:to-green-800 transition font-semibold shadow-lg disabled:from-slate-600 disabled:to-slate-700 disabled:cursor-not-allowed"
>
{loading ? "⏳ Exporting..." : "📄 Export PDF"}
</button>
<button
onClick={() => handleExport("excel")}
disabled={loading}
className="flex-1 px-6 py-3 bg-gradient-to-r from-green-600 to-green-700 text-white rounded-xl hover:from-green-700 hover:to-green-800 transition font-semibold shadow-lg disabled:from-slate-600 disabled:to-slate-700 disabled:cursor-not-allowed"
>
{loading ? "⏳ Exporting..." : "📊 Export Excel"}
</button>
</div>
</div>
</div>
);
};