diff --git a/BankingService.Api/ClientApp/src/app/app.component.css b/BankingService.Api/ClientApp/src/app/app.component.css index 52947f5..665d49e 100644 --- a/BankingService.Api/ClientApp/src/app/app.component.css +++ b/BankingService.Api/ClientApp/src/app/app.component.css @@ -41,7 +41,7 @@ color: lightgray; font-family: Ubuntu; font-size: large; - margin-right: 15px + margin-right: 15px; } .header-link-current { @@ -51,3 +51,8 @@ .link-active { color: red; } + +.octicon-link { + fill: lightgray; + margin-left: auto; +} diff --git a/BankingService.Api/ClientApp/src/app/app.component.html b/BankingService.Api/ClientApp/src/app/app.component.html index 3c24454..63ef94c 100644 --- a/BankingService.Api/ClientApp/src/app/app.component.html +++ b/BankingService.Api/ClientApp/src/app/app.component.html @@ -8,6 +8,10 @@ Dashboard + +
diff --git a/BankingService.Api/ClientApp/src/app/dashboard/dashboard.component.html b/BankingService.Api/ClientApp/src/app/dashboard/dashboard.component.html index ed3028f..7a820ff 100644 --- a/BankingService.Api/ClientApp/src/app/dashboard/dashboard.component.html +++ b/BankingService.Api/ClientApp/src/app/dashboard/dashboard.component.html @@ -3,28 +3,31 @@
Date Selection
-
-
-
-
Categories
- + @if (hasData) { +
+
+
+
Categories
+ +
+
+
Categories without costs
+ +
-
-
Categories without costs
- +
+
+
Misc Data
+ +
+
+
Treasury per date
+ + +
-
-
-
Misc Data
- -
-
-
Treasury per date
- - -
-
-
-
No data for this period.
+ } @else { +
No data for this period.
+ }
diff --git a/BankingService.Api/ClientApp/src/app/dashboard/date-selector/date-selector.component.html b/BankingService.Api/ClientApp/src/app/dashboard/date-selector/date-selector.component.html index 2f53bc2..d585039 100644 --- a/BankingService.Api/ClientApp/src/app/dashboard/date-selector/date-selector.component.html +++ b/BankingService.Api/ClientApp/src/app/dashboard/date-selector/date-selector.component.html @@ -2,7 +2,9 @@

Quick Select Month

    -
  • {{ m | monthToText }}
  • + @for (m of months; track m) { +
  • {{ m | monthToText }}
  • + }
diff --git a/BankingService.Api/ClientApp/src/app/dashboard/misc-data/misc-data.component.html b/BankingService.Api/ClientApp/src/app/dashboard/misc-data/misc-data.component.html index 7e09172..f3d672a 100644 --- a/BankingService.Api/ClientApp/src/app/dashboard/misc-data/misc-data.component.html +++ b/BankingService.Api/ClientApp/src/app/dashboard/misc-data/misc-data.component.html @@ -1,14 +1,15 @@
-

Without Savings

- + @if(!slideChecked) { +

Without Savings

+ } @else {

With Savings

-
+ }
- + @if(!slideChecked) {
Positive Sum
{{ report?.positiveSumWithoutSavings | numberToMoney }}
@@ -21,8 +22,7 @@

With Savings

Balance
{{ report?.balanceWithoutSavings | numberToMoney }}
-
- + } @else {
Positive Sum
{{ report?.positiveSum| numberToMoney }}
@@ -35,18 +35,20 @@

With Savings

Balance
{{ report?.balance | numberToMoney }}
-
+ }

Highest Transactions

- - - - - - + @for(t of report?.highestTransactions; track t.id) { + + + + + + + }
{{ t.date | date:'YYYY-MM-dd' }}{{ t.flow | numberToMoney }}{{ t.type }}
{{ t.category }}
{{ t.autoComment }}
{{ t.comment }}
{{ t.date | date:'YYYY-MM-dd' }}{{ t.flow | numberToMoney }}{{ t.type }}
{{ t.category }}
{{ t.autoComment }}
{{ t.comment }}
diff --git a/BankingService.Api/ClientApp/src/app/pipe/filter-transactions.pipe.ts b/BankingService.Api/ClientApp/src/app/pipe/filter-transactions.pipe.ts index 9684851..03ab0f1 100644 --- a/BankingService.Api/ClientApp/src/app/pipe/filter-transactions.pipe.ts +++ b/BankingService.Api/ClientApp/src/app/pipe/filter-transactions.pipe.ts @@ -17,11 +17,12 @@ export class FilterTransactionsPipe implements PipeTransform { const search = filters.search; if (search !== undefined && search !== '') { + const normalizedSearch = this.normalize(search); newTransactions = newTransactions.filter( (x) => - x.label.toLowerCase().includes(search.toLowerCase()) || - x.comment.toLowerCase().includes(search.toLowerCase()) || - x.autoComment.toLowerCase().includes(search.toLowerCase()) + this.normalize(x.label).includes(normalizedSearch) || + this.normalize(x.comment).includes(normalizedSearch) || + this.normalize(x.autoComment).includes(normalizedSearch) ); } @@ -43,4 +44,8 @@ export class FilterTransactionsPipe implements PipeTransform { return newTransactions; } + + private normalize (str: string) { + return str.normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase(); + } } diff --git a/BankingService.Api/ClientApp/src/app/pipe/number-to-money.pipe.ts b/BankingService.Api/ClientApp/src/app/pipe/number-to-money.pipe.ts index e076164..e1f66d4 100644 --- a/BankingService.Api/ClientApp/src/app/pipe/number-to-money.pipe.ts +++ b/BankingService.Api/ClientApp/src/app/pipe/number-to-money.pipe.ts @@ -8,7 +8,7 @@ export class NumberToMoneyPipe implements PipeTransform { transform(value: number | undefined): string { if (!value || isNaN(value)) - return 'Invalid input'; + return '0 €'; const roundedValue = Math.round(value * 100) / 100; const roundedString = roundedValue.toFixed(2); diff --git a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.css b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.css index 9147568..78993ab 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.css +++ b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.css @@ -21,7 +21,7 @@ } -.clear-button { +.line-end-button { font-size: larger; font-weight: 450; padding: 8px; @@ -60,6 +60,11 @@ padding: 1px; } +.refresh-icon { + cursor: pointer; + padding-right: 5px; +} + ::ng-deep .mat-datepicker-toggle-default-icon { color: lightgray !important; } diff --git a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.html b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.html index 849cddd..e79d24e 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.html +++ b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.html @@ -39,30 +39,32 @@
- - + @for(t of types; track t) { }
- - + @for(c of categories; track c) { }
- {{ resultCount }} results +
{{ resultCount }} results
+
{{ filteredAmount | numberToMoney }}
+
diff --git a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.ts b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.ts index dae2d25..22da0f7 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.ts +++ b/BankingService.Api/ClientApp/src/app/transactions/filters/filters.component.ts @@ -11,6 +11,7 @@ import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { TransactionFilters } from '../../model/transaction-filters'; import { MatIconModule } from '@angular/material/icon'; +import { NumberToMoneyPipe } from "../../pipe/number-to-money.pipe"; @Component({ selector: 'app-filters', @@ -27,8 +28,9 @@ import { MatIconModule } from '@angular/material/icon'; MatFormFieldModule, MatDatepickerModule, MatMenuModule, - MatIconModule - ], + MatIconModule, + NumberToMoneyPipe +], }) export class FiltersComponent implements OnInit { filters: TransactionFilters = { @@ -41,6 +43,7 @@ export class FiltersComponent implements OnInit { @Output() filterOutput = new EventEmitter(undefined); @Input() resultCount: number = 0; + @Input() filteredAmount: number = 0; NO_FILTER: string = "NO_FILTER"; @@ -57,7 +60,7 @@ export class FiltersComponent implements OnInit { this.setCurrentMonth(true); } - onMenuItemClicked(): void { + onEmitFilters(): void { this.emitFilters(); } diff --git a/BankingService.Api/ClientApp/src/app/transactions/transaction-item/transaction-item.component.html b/BankingService.Api/ClientApp/src/app/transactions/transaction-item/transaction-item.component.html index f7ab02c..83d734a 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/transaction-item/transaction-item.component.html +++ b/BankingService.Api/ClientApp/src/app/transactions/transaction-item/transaction-item.component.html @@ -6,54 +6,49 @@
- {{ transaction.autoComment }}{{ separator }}{{transaction.comment }} - + @if (areEditableFieldsDisabled) { + {{ transaction.autoComment }}{{ separator }}{{transaction.comment }} + } @else { {{ transaction.autoComment }}{{ separator }} - - + (keydown.enter)="onSaveTransactionClicked()" + /> + } - - + @if(areEditableFieldsDisabled) { + + } @else { + + }
{{ transaction.date | date:'YYYY-MM-dd' }} {{ ' . ' }} - + @if(areEditableFieldsDisabled) { {{ transaction.category }} - - + } @else { - - + } - + @if (!areEditableFieldsDisabled) { {{ ' . ' }} - - + }
- {{ transaction.label }}
diff --git a/BankingService.Api/ClientApp/src/app/transactions/transactions.component.html b/BankingService.Api/ClientApp/src/app/transactions/transactions.component.html index e4d6105..5bdc0bd 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/transactions.component.html +++ b/BankingService.Api/ClientApp/src/app/transactions/transactions.component.html @@ -1,13 +1,20 @@
- + + -
+ @if ((transactions | filterTransactions:filters).length > 0) {
    -
  • - -
  • + @for (t of transactions | filterTransactions:filters; track t.id) { +
  • + +
  • + }
-
-
No data to display.
+ } @else { +
No data to display.
+ }
diff --git a/BankingService.Api/ClientApp/src/app/transactions/transactions.component.ts b/BankingService.Api/ClientApp/src/app/transactions/transactions.component.ts index a2bc6a6..9d281a2 100644 --- a/BankingService.Api/ClientApp/src/app/transactions/transactions.component.ts +++ b/BankingService.Api/ClientApp/src/app/transactions/transactions.component.ts @@ -18,7 +18,6 @@ import { TransactionService } from '../services/transaction.service'; CommonModule, ImportComponent, FiltersComponent, - TransactionHeadersComponent, TransactionItemComponent, FilterTransactionsPipe ] @@ -26,7 +25,13 @@ import { TransactionService } from '../services/transaction.service'; export class TransactionsComponent implements OnInit { transactions: Transaction[] = []; - filters: TransactionFilters | undefined; + filters: TransactionFilters = { + category: undefined, + type: undefined, + search: undefined, + startDate: undefined, + endDate: undefined, + }; constructor(private dbService: TransactionService) { } @@ -43,4 +48,7 @@ export class TransactionsComponent implements OnInit { this.filters = filters; } + sumFlow(transactions: Transaction[]): number { + return transactions.reduce((acc, item) => acc + item.flow, 0); + } } diff --git a/BankingService.Api/ClientApp/src/environments/environment.development.ts b/BankingService.Api/ClientApp/src/environments/environment.development.ts index bddf6be..7b10a46 100644 --- a/BankingService.Api/ClientApp/src/environments/environment.development.ts +++ b/BankingService.Api/ClientApp/src/environments/environment.development.ts @@ -1,5 +1,5 @@ export const environment = { - version: '2.2.0-dev', + version: '2.3.0-dev', production: false, apiUrl: 'https://localhost:44335' }; diff --git a/BankingService.Api/ClientApp/src/environments/environment.ts b/BankingService.Api/ClientApp/src/environments/environment.ts index 19dc8f0..92363bd 100644 --- a/BankingService.Api/ClientApp/src/environments/environment.ts +++ b/BankingService.Api/ClientApp/src/environments/environment.ts @@ -1,5 +1,5 @@ export const environment = { - version: '2.2.0', + version: '2.3.0', production: true, apiUrl: 'http://localhost:10001' };