document.addEventListener('DOMContentLoaded', () => { // --- CONFIGURATION --- const workerUrl = 'https://form-handler-worker.aiagents.workers.dev/'; // Ensure this is your correct worker URL // --- ELEMENT SELECTIONS --- // Forms const submissionForm = document.getElementById('vessel-exchange-form'); const lookupForm = document.getElementById('deal-lookup-form'); const adminForm = document.getElementById('admin-action-form'); // Buttons const showSubmissionButton = document.getElementById('show-submission-button'); const submissionFormSubmitButton = document.getElementById('submit-button'); const adminApproveButton = document.getElementById('admin-approve-button'); const adminDeclineButton = document.getElementById('admin-decline-button'); const submissionModalCloseButton = document.getElementById('submission-modal-close-button'); const dealModalCloseButton = document.getElementById('modal-close-button'); // Modals & Containers const submissionModal = document.getElementById('submission-modal'); const dealModal = document.getElementById('deal-modal'); const lookupContainer = document.getElementById('lookup-container'); const lookupInput = document.getElementById('lookup-deal-id'); // Status Message Areas const submissionStatus = document.getElementById('status-message'); const adminStatus = document.getElementById('admin-status-message'); // --- EVENT LISTENERS --- // Show the submission form modal if(showSubmissionButton) { showSubmissionButton.addEventListener('click', () => { submissionModal.classList.remove('hidden'); }); } // Close the submission form modal if(submissionModal) { submissionModalCloseButton.addEventListener('click', () => closeModal(submissionModal)); submissionModal.addEventListener('click', (event) => { if (event.target === submissionModal) closeModal(submissionModal); }); } // Close the deal info modal if (dealModal) { dealModalCloseButton.addEventListener('click', () => closeModal(dealModal)); dealModal.addEventListener('click', (event) => { if (event.target === dealModal) closeModal(dealModal); }); } // Handle New Deal Submissions if (submissionForm) { submissionForm.addEventListener('submit', handleFormSubmit); } // Handle Deal Status Lookups if (lookupForm) { lookupForm.addEventListener('submit', handleLookupSubmit); } // Handle Admin Actions if (adminForm) { adminApproveButton.addEventListener('click', () => handleAdminClick('approve')); adminDeclineButton.addEventListener('click', () => handleAdminClick('decline')); } // --- HANDLER FUNCTIONS --- /** * Handles the main form submission to create a new deal. */ async function handleFormSubmit(event) { event.preventDefault(); showStatus(submissionStatus, 'Submitting...'); submissionFormSubmitButton.disabled = true; try { const formData = new FormData(submissionForm); const response = await fetch(workerUrl, { method: 'POST', body: formData }); const resultText = await response.text(); if (!response.ok) { throw new Error(resultText); } const result = JSON.parse(resultText); const dealId = result.deal_id; showSuccess(submissionStatus, `Success! Deal ID copied below.`); lookupInput.value = dealId; lookupContainer.classList.add('highlight'); setTimeout(() => lookupContainer.classList.remove('highlight'), 2000); submissionForm.reset(); // This logic now correctly closes the modal after a success setTimeout(() => closeModal(submissionModal), 2500); } catch (error) { showError(submissionStatus, error.message); } finally { submissionFormSubmitButton.disabled = false; } } /** * Handles the lookup form submission to check a deal's status. */ async function handleLookupSubmit(event) { event.preventDefault(); const lookupButton = document.getElementById('lookup-button'); lookupButton.disabled = true; try { if (!lookupInput.value) throw new Error("Please enter a Deal ID."); const response = await fetch(`${workerUrl}?deal_id=${lookupInput.value}`, { method: 'GET' }); const result = await response.json(); if (!response.ok) throw new Error(result.error || 'Failed to fetch deal.'); openDealInfoModal(result); } catch (error) { alert(`Error: ${error.message}`); } finally { lookupButton.disabled = false; } } /** * Handles clicks on the admin approve/decline buttons. */ async function handleAdminClick(action) { const dealId = document.getElementById('admin-deal-id').value; if (!dealId) { showError(adminStatus, 'Please enter a Deal ID.'); return; } showStatus(adminStatus, 'Processing action...'); adminApproveButton.disabled = true; adminDeclineButton.disabled = true; const formData = new FormData(); formData.append('action', action); formData.append('deal_id', dealId); try { const response = await fetch(workerUrl, { method: 'POST', body: formData }); const resultText = await response.text(); const result = JSON.parse(resultText); if (!response.ok) throw new Error(result.message || result.error || resultText); showSuccess(adminStatus, result.message); } catch (error) { showError(adminStatus, error.message); } finally { adminApproveButton.disabled = false; adminDeclineButton.disabled = false; } } // --- UI HELPER FUNCTIONS --- function openDealInfoModal(dealData) { /* ... (same as before) ... */ } function closeModal(modalElement) { if (modalElement) { modalElement.classList.add('hidden'); } } function showStatus(element, message) { /* ... (same as before) ... */ } function showSuccess(element, message) { /* ... (same as before) ... */ } function showError(element, message) { /* ... (same as before) ... */ } });