andrew
/
finnow
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

Run formatting.
Build and Deploy Web App / build-and-deploy (push) Successful in 19s Details

This commit is contained in:
Andrew Lalis 2026-03-14 22:58:57 -04:00
parent 8f098f6cac
commit a007acee8d
1 changed files with 79 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
web-app/src/pages/TransactionSearchPage.vue
View File

@ -233,42 +233,83 @@ function loadAllParamValues(key: string): string[] {
<AppPage title="Transactions">
<AppForm>
<FormGroup>
<FormControl label="Search" hint="Free-form text search against description, tags, vendor, category, account.">
<input v-model="searchQuery" type="text" placeholder="Search for transactions..." />
<FormControl
label="Search"
hint="Free-form text search against description, tags, vendor, category, account."
>
<input
v-model="searchQuery"
type="text"
placeholder="Search for transactions..."
/>
</FormControl>
</FormGroup>
<FormGroup>
<div class="vueselect-control">
<h5>Tag</h5>
<VueSelect v-model="tagFilters" :options="tagOptions" placeholder="Select tags" is-multi />
<VueSelect
v-model="tagFilters"
:options="tagOptions"
placeholder="Select tags"
is-multi
/>
</div>
<div class="vueselect-control">
<h5>Vendor</h5>
<VueSelect v-model="vendorFilters" :options="vendorOptions" placeholder="Select vendors" is-multi />
<VueSelect
v-model="vendorFilters"
:options="vendorOptions"
placeholder="Select vendors"
is-multi
/>
</div>
<div class="vueselect-control">
<h5>Category</h5>
<VueSelect v-model="categoryFilters" :options="categoryOptions" placeholder="Select categories" is-multi />
<VueSelect
v-model="categoryFilters"
:options="categoryOptions"
placeholder="Select categories"
is-multi
/>
</div>
<div class="vueselect-control">
<h5>Account</h5>
<VueSelect v-model="accountFilters" :options="accountOptions" placeholder="Select accounts" is-multi />
<VueSelect
v-model="accountFilters"
:options="accountOptions"
placeholder="Select accounts"
is-multi
/>
</div>
</FormGroup>
<FormGroup>
<FormControl label="Max Amount">
<input v-model="maxAmountFilter" type="number" min="0" step="1" />
<input
v-model="maxAmountFilter"
type="number"
min="0"
step="1"
/>
</FormControl>
<FormControl label="Min Amount">
<input v-model="minAmountFilter" type="number" min="0" step="1" />
<input
v-model="minAmountFilter"
type="number"
min="0"
step="1"
/>
</FormControl>
</FormGroup>
<FormGroup>
<FormControl label="Sort By">
<select v-model="selectedSort">
<option v-for="sortOpt in SORT_PROPERTIES" :key="sortOpt.property" :value="sortOpt.property">
<option
v-for="sortOpt in SORT_PROPERTIES"
:key="sortOpt.property"
:value="sortOpt.property"
>
{{ sortOpt.label }}
</option>
</select>
@ -281,19 +322,42 @@ function loadAllParamValues(key: string): string[] {
</FormControl>
</FormGroup>
<ButtonBar>
<AppButton size="sm" icon="home" @click="goToHome()">Back to Homepage</AppButton>
<AppButton size="sm" icon="trash" @click="clearFilters()">Clear Filters</AppButton>
<AppButton size="sm" icon="file-export" @click="exportToFile()">Export to CSV</AppButton>
<AppButton
size="sm"
icon="home"
@click="goToHome()"
>Back to Homepage</AppButton
>
<AppButton
size="sm"
icon="trash"
@click="clearFilters()"
>Clear Filters</AppButton
>
<AppButton
size="sm"
icon="file-export"
@click="exportToFile()"
>Export to CSV</AppButton
>
</ButtonBar>
</AppForm>
<PaginationControls :page="page" @update="(pr) => fetchPage(pr.page, pr.size)" class="align-right" />
<PaginationControls
:page="page"
@update="(pr) => fetchPage(pr.page, pr.size)"
class="align-right"
/>
<AppBadge size="sm">
{{ page.totalElements }} search
{{ page.totalElements == 1 ? 'result' : 'results' }}
in {{ lastFetchTime }} milliseconds
</AppBadge>
<TransactionCard v-for="txn in page.items" :key="txn.id" :tx="txn" />
<TransactionCard
v-for="txn in page.items"
:key="txn.id"
:tx="txn"
/>
</AppPage>
</template>
<style lang="css" scoped>