106 lines
3.6 KiB
JavaScript
106 lines
3.6 KiB
JavaScript
const LostItemsTab = () => {
|
|
// State untuk modal
|
|
const [showOptionModal, setShowOptionModal] = React.useState(false);
|
|
const [showFormModal, setShowFormModal] = React.useState(false);
|
|
const [selectedLostItem, setSelectedLostItem] = React.useState(null);
|
|
const [selectedMethod, setSelectedMethod] = React.useState(null); // 'direct' or 'manager'
|
|
|
|
// 1. Handler saat tombol "Saya Menemukan" ditekan
|
|
const handleSayaMenemukanClick = (lostItem) => {
|
|
setSelectedLostItem(lostItem);
|
|
setShowOptionModal(true); // Tampilkan Modal Opsi
|
|
};
|
|
|
|
// 2. Handler saat Opsi dipilih di Modal
|
|
const handleOptionSelect = (method) => {
|
|
// method akan bernilai "direct" atau "manager"
|
|
console.log("Metode dipilih:", method);
|
|
|
|
// 1. Simpan metode pilihan user
|
|
setSelectedMethod(method);
|
|
|
|
// 2. Tutup modal opsi
|
|
setShowOptionModal(false);
|
|
|
|
// 3. Langsung buka modal Form Pengisian Data (Form Penemu)
|
|
// Form ini akan sama untuk kedua opsi, tapi cara handling submit-nya nanti beda
|
|
setShowFormModal(true);
|
|
};
|
|
|
|
// 3. Handler Submit Form Barang Ditemukan
|
|
const handleFormSubmit = async (formData) => {
|
|
try {
|
|
// Siapkan payload data
|
|
const payload = {
|
|
...formData, // Data dari form (foto, lokasi, dll)
|
|
lost_item_id: selectedLostItem.id, // ID barang hilang yang diklaim
|
|
|
|
// LOGIKA KUNCI:
|
|
// Jika "direct", set flag is_direct_to_owner = true.
|
|
// Backend harus membaca flag ini untuk bypass status manager verification.
|
|
is_direct_to_owner: selectedMethod === "direct",
|
|
};
|
|
|
|
console.log("Submitting payload:", payload);
|
|
|
|
// Kirim ke endpoint (Pastikan backend Anda menangani field is_direct_to_owner)
|
|
await ApiUtils.post("/api/items/found-linked", payload);
|
|
|
|
// Berikan feedback yang sesuai ke user
|
|
if (selectedMethod === "direct") {
|
|
alert("Berhasil! Laporan dikirim LANGSUNG ke pemilik untuk approval.");
|
|
} else {
|
|
alert("Berhasil! Laporan dikirim ke MANAGER untuk verifikasi.");
|
|
}
|
|
|
|
// Reset dan tutup modal
|
|
setShowFormModal(false);
|
|
// Refresh data list jika perlu
|
|
// loadLostItems();
|
|
} catch (error) {
|
|
console.error("Error submitting found report:", error);
|
|
alert("Gagal mengirim laporan: " + error.message);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
{/* List Barang Hilang */}
|
|
{lostItems.map((item) => (
|
|
<div key={item.id} className="card">
|
|
<h3>{item.name}</h3>
|
|
<button
|
|
onClick={() => handleSayaMenemukanClick(item)}
|
|
className="bg-blue-600 text-white px-4 py-2 rounded"
|
|
>
|
|
✋ Saya Menemukan
|
|
</button>
|
|
</div>
|
|
))}
|
|
|
|
{/* Modal Pilihan Opsi */}
|
|
<FoundOptionModal
|
|
isOpen={showFoundOptionModal}
|
|
onClose={() => setShowFoundOptionModal(false)}
|
|
onSelectOption={handleSelectFoundOption}
|
|
/>
|
|
|
|
<ReportFoundModal
|
|
isOpen={state.showReportFoundModal}
|
|
onClose={() => state.setShowReportFoundModal(false)}
|
|
onSubmit={handlers.submitReportFound} // Gunakan handler yang baru
|
|
// Opsional: Kirim data barang hilang untuk pre-fill deskripsi otomatis
|
|
linkedLostItem={selectedLostItemForFound}
|
|
/>
|
|
|
|
{/* Modal Form Pengisian (Gunakan komponen CreateItemModal yang sudah ada tapi dimodifikasi prop onSubmitnya) */}
|
|
<CreateFoundItemModal
|
|
isOpen={showFormModal}
|
|
onClose={() => setShowFormModal(false)}
|
|
onSubmit={handleFormSubmit}
|
|
targetItemName={selectedLostItem?.name}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|