diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.html b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.html index e0aadd883..27fad52bd 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.html +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.html @@ -201,6 +201,12 @@ [active]="IRC.isActive"> Interest Rate Chart + + + Transactions + + diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.html b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.html new file mode 100644 index 000000000..e921f7187 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.html @@ -0,0 +1,46 @@ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ID {{ transaction.id }} Transaction Date {{ transaction.date | date }} Transaction Type {{ transaction.transactionType.value }} Debit + {{ isDebit(transaction.transactionType) ? transaction.amount : 'N/A'}} Credit + {{ !isDebit(transaction.transactionType) ? transaction.amount : 'N/A' }} Balance {{ transaction.runningBalance }}
+ +
+ +
\ No newline at end of file diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.scss b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.scss new file mode 100644 index 000000000..587f08f74 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.scss @@ -0,0 +1,15 @@ +.tab-container { + padding: 1%; + margin: 1%; + h3 { + margin:1% auto; + } + table { + width: 100%; + } +} + +.strike { + text-decoration: line-through; + color: red; +} \ No newline at end of file diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.spec.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.spec.ts new file mode 100644 index 000000000..a67fc2279 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TransactionsTabComponent } from './transactions-tab.component'; + +describe('TransactionsTabComponent', () => { + let component: TransactionsTabComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ TransactionsTabComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(TransactionsTabComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.ts new file mode 100644 index 000000000..36adf738b --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.ts @@ -0,0 +1,49 @@ +/** Angular Imports */ +import { Component, OnInit } from '@angular/core'; +import { MatTableDataSource } from '@angular/material'; +import { ActivatedRoute } from '@angular/router'; + +/** + * Transactions Tab Component. + */ +@Component({ + selector: 'mifosx-transactions-tab', + templateUrl: './transactions-tab.component.html', + styleUrls: ['./transactions-tab.component.scss'] +}) +export class TransactionsTabComponent implements OnInit { + + /** Recurring Deposits Account Status */ + status: any; + /** Transactions Data */ + transactionsData: any; + /** Columns to be displayed in transactions table. */ + displayedColumns: string[] = ['id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance']; + /** Data source for transactions table. */ + dataSource: MatTableDataSource; + + /** + * Retrieves recurring deposits account data from `resolve`. + * @param {ActivatedRoute} route Activated Route. + */ + constructor(private route: ActivatedRoute) { + this.route.parent.data.subscribe((data: { recurringDepositsAccountData: any }) => { + this.transactionsData = data.recurringDepositsAccountData.transactions; + this.status = data.recurringDepositsAccountData.status.value; + }); + } + + ngOnInit() { + this.dataSource = new MatTableDataSource(this.transactionsData); + } + + /** + * Checks if transaction is debit. + * @param {any} transactionType Transaction Type + */ + isDebit(transactionType: any) { + return transactionType.withdrawal === true || transactionType.feeDeduction === true + || transactionType.overdraftInterest === true || transactionType.withholdTax === true; + } + +} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts b/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts index c651a7571..f88966540 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts +++ b/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts @@ -8,6 +8,7 @@ import { extract } from '../../core/i18n/i18n.service'; /** Custom Components */ import { RecurringDepositsAccountViewComponent } from './recurring-deposits-account-view/recurring-deposits-account-view.component'; import { InterestRateChartTabComponent } from './recurring-deposits-account-view/interest-rate-chart-tab/interest-rate-chart-tab.component'; +import { TransactionsTabComponent } from './recurring-deposits-account-view/transactions-tab/transactions-tab.component'; /** Custom Resolvers */ import { RecurringDepositsAccountViewResolver } from './common-resolvers/recurring-deposits-account-view.resolver'; @@ -33,6 +34,14 @@ const routes: Routes = [ resolve: { recurringDepositsAccountData: RecurringDepositsAccountDataResolver } + }, + { + path: 'transactions', + component: TransactionsTabComponent, + data: { title: extract('Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false }, + resolve: { + recurringDepositsAccountData: RecurringDepositsAccountDataResolver + } } ] } diff --git a/src/app/deposits/recurring-deposits/recurring-deposits.module.ts b/src/app/deposits/recurring-deposits/recurring-deposits.module.ts index eb1fb34d1..7040346dd 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits.module.ts +++ b/src/app/deposits/recurring-deposits/recurring-deposits.module.ts @@ -11,6 +11,7 @@ import { DirectivesModule } from '../../directives/directives.module'; /** Custom Components */ import { RecurringDepositsAccountViewComponent } from './recurring-deposits-account-view/recurring-deposits-account-view.component'; import { InterestRateChartTabComponent } from './recurring-deposits-account-view/interest-rate-chart-tab/interest-rate-chart-tab.component'; +import { TransactionsTabComponent } from './recurring-deposits-account-view/transactions-tab/transactions-tab.component'; /** * RecurringDeposits Module @@ -26,7 +27,8 @@ import { InterestRateChartTabComponent } from './recurring-deposits-account-view ], declarations: [ RecurringDepositsAccountViewComponent, - InterestRateChartTabComponent + InterestRateChartTabComponent, + TransactionsTabComponent ], providers: [DatePipe] })