69 lines
2.8 KiB
JavaScript
69 lines
2.8 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const addBillForm = document.getElementById('addBillForm');
|
|
if (addBillForm) {
|
|
addBillForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
const formData = new FormData(this);
|
|
axios.post('/api/add-bill', formData)
|
|
.then(function(response) {
|
|
console.log('Bill added successfully');
|
|
loadBills();
|
|
})
|
|
.catch(function(error) {
|
|
console.error('Error adding bill:', error);
|
|
});
|
|
});
|
|
}
|
|
|
|
// Load bills if on the dashboard page
|
|
if (document.getElementById('billsTable')) {
|
|
loadBills();
|
|
}
|
|
|
|
// Event delegation for dynamically added "Mark as Paid" buttons
|
|
document.addEventListener('click', function(e) {
|
|
if (e.target && e.target.matches('.mark-bill-paid-btn')) {
|
|
const billId = e.target.getAttribute('data-bill-id');
|
|
axios.post('/api/mark-bill-paid', { id: billId })
|
|
.then(function(response) {
|
|
console.log('Bill marked as paid successfully');
|
|
loadBills();
|
|
})
|
|
.catch(function(error) {
|
|
console.error('Error marking bill as paid:', error);
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
function loadBills() {
|
|
const billsTableBody = document.querySelector('#billsTable tbody');
|
|
billsTableBody.innerHTML = '<tr><td colspan="4" class="text-center">Loading bills...</td></tr>';
|
|
|
|
axios.get('/api/bills')
|
|
.then(function(response) {
|
|
const bills = response.data;
|
|
billsTableBody.innerHTML = '';
|
|
|
|
bills.forEach(function(bill) {
|
|
const row = `
|
|
<tr>
|
|
<td>${bill.description}</td>
|
|
<td>$${parseFloat(bill.amount).toFixed(2)}</td>
|
|
<td>${bill.due_date}</td>
|
|
<td>
|
|
${bill.is_paid ? '' : '<button type="button" class="btn btn-success btn-sm mark-bill-paid-btn" data-bill-id="' + bill.id + '">Mark as Paid</button>'}
|
|
<button type="button" class="btn btn-primary btn-sm edit-bill-btn" data-bill-id="${bill.id}">Edit</button>
|
|
<button type="button" class="btn btn-danger btn-sm delete-bill-btn" data-bill-id="${bill.id}">Delete</button>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
billsTableBody.innerHTML += row;
|
|
});
|
|
})
|
|
.catch(function(error) {
|
|
console.error('Error loading bills:', error);
|
|
billsTableBody.innerHTML = '<tr><td colspan="4" class="text-center">Error loading bills.</td></tr>';
|
|
});
|
|
}
|