110 lines
4.8 KiB
Text
110 lines
4.8 KiB
Text
package templates
|
|
|
|
templ TransactionsPage(userID int, accounts *[]string) {
|
|
<title>Transactions</title>
|
|
<div class="d-flex-col mx-4 h-100" data-main-body="true">
|
|
<div class="c-crust row cr-all p-5" style="height: fit-content">
|
|
<button
|
|
class="borderless-btn dropdown-button"
|
|
aria-describedby="filter-popup"
|
|
data-dropdown-target="filter-popup"
|
|
data-dropdown-direction="bottom-start"
|
|
data-dropdown-motion="expand-down"
|
|
>
|
|
<i class="" data-feather="filter"></i>
|
|
<span class="ms-3 my-auto">Add Filter</span>
|
|
</button>
|
|
<div class="popup-menu" id="filter-popup" role="tooltip" style="display:none;">
|
|
<div class="d-flex p-3">
|
|
<select class="select-swapout select">
|
|
<option data-select-div="filter-accounts">Account</option>
|
|
<option data-select-div="filter-two-inputs">Amount</option>
|
|
<option data-select-div="filter-between-dates">Date</option>
|
|
<option data-select-div="filter-contains">Description</option>
|
|
<option data-select-div="filter-two-inputs">ID</option>
|
|
</select>
|
|
<div id="filter-two-inputs" class="d-flex" style="display: none;">
|
|
<input class="input" type="text"></input>
|
|
<select class="ms-2 select">
|
|
<option>></option>
|
|
<option>=</option>
|
|
<option>{"<"}</option>
|
|
</select>
|
|
<input class="ms-2 input" type="text"></input>
|
|
</div>
|
|
<div id="filter-contains" class="d-flex" style="display: none;">
|
|
<select class="ms-2 select">
|
|
<option>Contains</option>
|
|
<option>Does Not Contain</option>
|
|
</select>
|
|
<input class="ms-2 input" type="text"></input>
|
|
</div>
|
|
<div id="filter-accounts" class="d-flex">
|
|
<select class="ms-2 select">
|
|
<option>=</option>
|
|
</select>
|
|
<select class="ms-2 select">
|
|
for _, value := range *accounts {
|
|
<option>{value}</option>
|
|
}
|
|
</select>
|
|
</div>
|
|
<div id="filter-between-dates" class="d-flex" style="display: none;">
|
|
<input class="input" type="date"></input>
|
|
<select class="ms-2 select">
|
|
<option>></option>
|
|
<option>=</option>
|
|
<option>{"<"}</option>
|
|
</select>
|
|
<input class="ms-2 input" type="date"></input>
|
|
</div>
|
|
<button
|
|
class="cr-all ms-3 btn btn-sm invert c-green"
|
|
>Add
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="ms-5 borderless-btn">
|
|
<span class="my-auto mx-3">No Filters</span>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="row mt-5">
|
|
<table class="card-table table table-striped cr-all">
|
|
<colgroup>
|
|
<col style="width: 2%"></col>
|
|
<col style="width: 15%"></col>
|
|
<col style="width: 30%"></col>
|
|
<col style="width: 15%"></col>
|
|
<col style="width: 3%"></col>
|
|
<col style="width: 1%"></col>
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
<td>
|
|
</td>
|
|
<td>
|
|
<div class="d-flex">
|
|
<span class="my-auto me-0">
|
|
ID
|
|
</span>
|
|
<i class="my-auto ms-0 me-auto" data-feather="chevron-up"></i>
|
|
</div>
|
|
</td>
|
|
<td>Account</td>
|
|
<td>Date</td>
|
|
<td></td>
|
|
<td class="t-e" style="width:auto">Amount</td>
|
|
</tr>
|
|
</thead>
|
|
<tbody
|
|
hx-trigger="load delay:0.25s"
|
|
hx-get="/components/data/transaction_table_rows"
|
|
hx-params=""
|
|
>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
}
|