start work on deleting line items

app/routes.py

@@ -134,7 +134,14 @@ def add_line_item():
         )
         db.session.commit()
         return redirect(url_for('line_items_by_month'))
-    
+
+@app.route('/delete_line_item/<id>', methods=['POST'])
+def delete_line_item(id):
+    if request.method == 'POST':
+        db.session.execute(delete(LineItem).where(LineItem.id==id))
+        db.session.commit()
+        return redirect(url_for('line_items_by_month'))
+
 @app.route('/add_vendor', methods=['POST'])
 def add_vendor():
     if request.method == 'POST':

app/static/line_items_by_month.js

@@ -57,6 +57,7 @@ async function displayMonthLineItems(dateString){
                     <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>
+                    <th scope="row"><button id="${li.id}" class="btn btn-danger delete-button">Delete</button></th>
                 </tr>
             `;
     
@@ -74,6 +75,7 @@ async function displayMonthLineItems(dateString){
                     <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"><button id="${li.id}" class="btn btn-danger delete-button">Delete</button></th>
                 </tr>
             `;
     
@@ -94,6 +96,15 @@ function addListenersToReassignButtons() {
     }
 }
 
+function addListenersToDeleteButtons() {
+    deleteButtons = document.getElementsByClassName('delete-button');
+    for(let i = 0; i < deleteButtons.length; i++){
+        deleteButtons[i].addEventListener('click', e => {
+            // startEditMode(parseInt(e.target.id));
+        })
+    }
+}
+
 document.addEventListener("DOMContentLoaded", (event) => {
     displayMonthLineItems(monthSelector.value);
     monthSelector.addEventListener('change', (e) => {

app/templates/line_items_by_month.html

@@ -90,6 +90,7 @@
                                 <th scope="col">Note</th>
                                 <th scope="col">Reassign Vendor</th>
                                 <th scope="col">Split Line?</th>
+                                <th scope="col">Delete</th>
                             </tr>
                         </thead>
                         <tbody id="table-body">
@@ -117,6 +118,7 @@
                                 <th scope="col">Confirmation Code</th>
                                 <th scope="col">Note</th>
                                 <th scope="col">Reassign Vendor</th>
+                                <th scope="col">Delete</th>
                             </tr>
                         </thead>
                         <tbody id="child-table-body">