diff options
Diffstat (limited to 'templates/history.html')
| -rw-r--r-- | templates/history.html | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/templates/history.html b/templates/history.html new file mode 100644 index 0000000..e461269 --- /dev/null +++ b/templates/history.html @@ -0,0 +1,51 @@ +{% extends "layout.html" %} + +{% block title %} + Spending History +{% endblock %} + +{% block main %} + <!-- Option to search & filter the table --> + <div class="mb-4"> + <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16" style="margin-right: 5px;"> + <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/> + </svg> + <input type="text" id="search_history" onkeyup="filter()" placeholder="Filter for:"> + + <input type="radio" id="expense" name="select" value="0" checked> + <label for="expense">Expense</label> + <input type="radio" id="category" name="select" value="1"> + <label for="category">Category</label> + <input type="radio" id="amount" name="select" value="2"> + <label for="amount">Amount</label> + <input type="radio" id="date" name="select" value="3"> + <label for="date">Date</label><br> + </div> + + <!-- Table displaying details of all user-submitted expenses, sorted by date --> + <div class="table-responsive"> + <table class="table table-success table-striped table-hover" id="history"> + <thead class="table-dark"> + <tr> + <th>Expense</th> + <th>Category</th> + <th>Amount</th> + <th>Date</th> + </tr> + </thead> + <tbody> + {% for item in record %} + <tr> + <td>{{ item.comment }}</td> + <td>{{ item.category }}</td> + <td><strong>- {{ item.amount | usd }}</strong></td> + <td>{{ item.date }}</td> + </tr> + {% endfor %} + </tbody> + </table> + </div> + + <!-- Implements search & filters --> + <script src="/static/filter.js"></script> +{% endblock %} |