yisroelbaum/BudgetingApp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

split up secitons for lines with parents and those without

Browse source 
enable update vendor on enter
This commit is contained in:
Yisroel Baum 2024-10-29 15:24:05 +02:00
parent ce2c163abe
commit bb7bc37a3e
2 changed files with 98 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

61
app/static/line_items_by_month.js
View file

@ -1,14 +1,15 @@
const monthSelector = document.getElementById('month-selector');
const tableBody = document.getElementById('table-body');
const childTableBody = document.getElementById('child-table-body');
var reassignButtons = document.getElementsByClassName('reassign-button');
function startEditMode(id){
async function startEditMode(id){
for(let i = 0; i < reassignButtons.length; i++){
reassignButtons[i].disabled = true;
}
const handleKeydown = (e) => {
const handleKeydown = async (e) => {
if (e.key === 'Enter') {
document.removeEventListener('keydown', handleKeydown);
const vendor = document.getElementById(`vendor-line-${id}`);
@ -17,7 +18,8 @@ function startEditMode(id){
if (vendorInput.parentNode) {
vendorInput.parentNode.removeChild(vendorInput);
}
var result = await fetch(`/update_vendor/${id}/${vendor.innerText}`, {method:'POST'});
var data = await result.json();
for(let i = 0; i < reassignButtons.length; i++){
reassignButtons[i].disabled = false;
}
@ -41,24 +43,43 @@ async function displayMonthLineItems(dateString){
var result = await fetch(`/get_month_line_items/${month}/${year}`, {method:'POST'});
var data = await result.json();
tableBody.innerHTML = ''
childTableBody.innerHTML = ''
data.forEach(li => {
const row = `
<tr id="${li.id}-row">
<th scope="row">${li.id}</th>
<th scope="row">${li.parent_line_item_id || ''}</th>
<th scope="row">${li.amount}</th>
<th scope="row">${li.currency_type}</th>
<th scope="row" id="vendor-line-${li.id}">${li.vendor}</th>
<th scope="row">${li.date}</th>
<th scope="row">${li.confirmation_code}</th>
<th scope="row">${li.note || ''}</th>
<th scope="row"><button id="${li.id}" class="btn btn-primary reassign-button">Click to reassign vendor</button></th>
<th scope="row"><a class="btn btn-primary" href="/split_line/${li.id}">Click to split line</a></th>
</tr>
`;
// Insert the row into the table body
tableBody.insertAdjacentHTML('beforeend', row);
if (!li.parent_line_item_id){
const row = `
<tr id="${li.id}-row">
<th scope="row">${li.id}</th>
<th scope="row">${li.amount}</th>
<th scope="row">${li.currency_type}</th>
<th scope="row" id="vendor-line-${li.id}">${li.vendor}</th>
<th scope="row">${li.date}</th>
<th scope="row">${li.confirmation_code}</th>
<th scope="row">${li.note || ''}</th>
<th scope="row"><button id="${li.id}" class="btn btn-primary reassign-button">Click to reassign vendor</button></th>
<th scope="row"><a class="btn btn-primary" href="/split_line/${li.id}">Click to split line</a></th>
</tr>
`;
// Insert the row into the table body
tableBody.insertAdjacentHTML('beforeend', row);
} else {
const row = `
<tr id="${li.id}-row">
<th scope="row">${li.id}</th>
<th scope="row">${li.parent_line_item_id}</th>
<th scope="row">${li.amount}</th>
<th scope="row">${li.currency_type}</th>
<th scope="row" id="vendor-line-${li.id}">${li.vendor}</th>
<th scope="row">${li.date}</th>
<th scope="row">${li.confirmation_code}</th>
<th scope="row">${li.note || ''}</th>
<th scope="row"><button id="${li.id}" class="btn btn-primary reassign-button">Click to reassign vendor</button></th>
</tr>
`;
// Insert the row into the table body
childTableBody.insertAdjacentHTML('beforeend', row);
}
});
addListenersToReassignButtons();

60
app/templates/line_items_by_month.html
View file

@ -5,7 +5,7 @@
<main>
<div class="container mt-5">
{% if files %}
<div class="card">
<div class="card mb-3">
<div class="card-header bg-primary text-white">
File available in static folder for upload -
New files must be formatted with the following columns in this order - Date, Vendor, Note, Confirmation Code, Charge, Deposit
@ -36,7 +36,35 @@
</div>
</div>
{% endif %}
<div class="card">
<div class="card mb-3">
<div class="card-header bg-primary text-white">
Add Line Item
</div>
<div class="card-body">
<form action="{{ url_for('add_line_item') }}" method="POST">
<div class="table-responsive">
<table class="table table-bordered">
<tbody id="add-line-item-table">
<tr>
<td><input type="text" class="form-control" name="ParentId" placeholder="ParentId"></td>
<td><input type="text" class="form-control" name="Amount" placeholder="Amount"></td>
<td><input type="text" class="form-control" name="Currency-Type" placeholder="Currency Type"></td>
<td><input type="text" class="form-control" name="Vendor" placeholder="Vendor"></td>
<td><input type="text" class="form-control" name="Date" placeholder="Date yyyy-mm-dd"></td>
<td><input type="text" class="form-control" name="Confirmation Code" placeholder="Confirmation Code"></td>
<td><input type="text" class="form-control" name="Note" placeholder="Note"></td>
</tr>
</tbody>
</table>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
<div class="card mb-3">
<div class="card-header bg-primary text-white">
Line Items
<br/>
@ -54,7 +82,6 @@
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Parent LineItem ID</th>
<th scope="col">Amount</th>
<th scope="col">Currency Type</th>
<th scope="col">Vendor</th>
@ -72,6 +99,33 @@
</div>
</div>
</div>
<div class="card mb-5">
<div class="card-header bg-primary text-white">
Child Line Items
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Parent LineItem ID</th>
<th scope="col">Amount</th>
<th scope="col">Currency Type</th>
<th scope="col">Vendor</th>
<th scope="col">Date</th>
<th scope="col">Confirmation Code</th>
<th scope="col">Note</th>
<th scope="col">Reassign Vendor</th>
</tr>
</thead>
<tbody id="child-table-body">
<tr><td>Loading...</td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</main>
<script src="{{url_for('.static', filename='line_items_by_month.js')}}"></script>