From 19c6dee1a50f6c231d5a9bc4fdd3cb4431ac7a42 Mon Sep 17 00:00:00 2001 From: Muskan Khedia <36980003+muskankhedia@users.noreply.github.com> Date: Sat, 4 Jul 2020 12:58:20 +0530 Subject: [PATCH] feat: add recurring deposit account tab (datatables) (#987) Fixes: 986 --- .../datatable-tabs.component.html | 4 + .../datatable-tabs.component.scss | 0 .../datatable-tabs.component.spec.ts | 25 +++ .../datatable-tabs.component.ts | 31 +++ .../multi-row/multi-row.component.html | 33 +++ .../multi-row/multi-row.component.scss | 10 + .../multi-row/multi-row.component.spec.ts | 25 +++ .../multi-row/multi-row.component.ts | 184 ++++++++++++++++ .../single-row/single-row.component.html | 41 ++++ .../single-row/single-row.component.scss | 11 + .../single-row/single-row.component.spec.ts | 25 +++ .../single-row/single-row.component.ts | 207 ++++++++++++++++++ ...rring-deposits-account-view.component.html | 7 + ...curring-deposits-account-view.component.ts | 6 +- .../recurring-deposits-routing.module.ts | 23 +- .../recurring-deposits.module.ts | 8 +- .../savings-datatable.resolver.ts | 2 +- 17 files changed, 636 insertions(+), 6 deletions(-) create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.html create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.scss create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.spec.ts create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.ts create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.html create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.scss create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.spec.ts create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.ts create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.html create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.scss create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.spec.ts create mode 100644 src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.ts diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.html b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.html new file mode 100644 index 000000000..9c0757115 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.html @@ -0,0 +1,4 @@ +
+ + +
\ No newline at end of file diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.scss b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.spec.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.spec.ts new file mode 100644 index 000000000..0f1dfa604 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DatatableTabsComponent } from './datatable-tabs.component'; + +describe('DatatableTabsComponent', () => { + let component: DatatableTabsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DatatableTabsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DatatableTabsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.ts new file mode 100644 index 000000000..460799d42 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/datatable-tabs.component.ts @@ -0,0 +1,31 @@ +/** Angular Imports */ +import { Component } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; + +/** + * Savings Datatable Tabs Component + */ +@Component({ + selector: 'mifosx-datatable-tabs', + templateUrl: './datatable-tabs.component.html', + styleUrls: ['./datatable-tabs.component.scss'] +}) +export class DatatableTabsComponent { + + /** Savings Datatable */ + savingsDatatable: any; + /** Multi Row Datatable Flag */ + multiRowDatatableFlag: boolean; + + /** + * Fetches Savings and datatables data from `resolve` + * @param {ActivatedRoute} route Activated Route. + */ + constructor(private route: ActivatedRoute) { + this.route.data.subscribe((data: { savingsDatatable: any }) => { + this.savingsDatatable = data.savingsDatatable; + this.multiRowDatatableFlag = this.savingsDatatable.columnHeaders[0].columnName === 'id' ? true : false; + }); + } + +} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.html b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.html new file mode 100644 index 000000000..c339f8643 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.html @@ -0,0 +1,33 @@ +
+ +
+
+

{{datatableName}}

+
+
+ + + + + + +
+
+ + + + + + + + + + + +
{{datatableColumn}} {{data.row[i]}}
+ +
diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.scss b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.scss new file mode 100644 index 000000000..6fa6a5f4e --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.scss @@ -0,0 +1,10 @@ +.tab-container { + padding: 1%; + margin: 1%; + .action-button{ + margin-left: auto; + } + table { + width: 100%; + } +} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.spec.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.spec.ts new file mode 100644 index 000000000..dd46589d8 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MultiRowComponent } from './multi-row.component'; + +describe('MultiRowComponent', () => { + let component: MultiRowComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ MultiRowComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MultiRowComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.ts new file mode 100644 index 000000000..04f514d4b --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component.ts @@ -0,0 +1,184 @@ +/** Angular Imports */ +import { Component, OnChanges, OnInit, Input, ViewChild } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { MatTable } from '@angular/material/table'; +import { MatDialog } from '@angular/material'; +import { DatePipe } from '@angular/common'; + +/** Custom Dialogs */ +import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component'; +import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component'; + +/** Custom Models */ +import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base'; +import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base'; +import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base'; +import { CheckboxBase } from 'app/shared/form-dialog/formfield/model/checkbox-base'; +import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base'; + +/** Custom Services */ +import { SavingsService } from 'app/savings/savings.service'; + +/** + * Savings Account Multi Row Data Tables + */ +@Component({ + selector: 'mifosx-multi-row', + templateUrl: './multi-row.component.html', + styleUrls: ['./multi-row.component.scss'] +}) +export class MultiRowComponent implements OnInit, OnChanges { + + /** Data Object */ + @Input() dataObject: any; + + /** Data Table Name */ + datatableName: string; + /** Data Table Columns */ + datatableColumns: string[] = []; + /** Data Table Data */ + datatableData: any; + /** Account Id */ + accountId: string; + /** Toggle button visibility */ + showDeleteBotton: boolean; + + /** Data Table Reference */ + @ViewChild('dataTable') dataTableRef: MatTable; + + /** + * Fetches savings account Id from parent route params. + * @param {ActivatedRoute} route Activated Route. + * @param {DatePipe} datePipe Date Pipe. + * @param {SavingsService} savingsService Savingss Service. + * @param {MatDialog} dialog Mat Dialog. + */ + constructor(private route: ActivatedRoute, + private datePipe: DatePipe, + private savingsService: SavingsService, + private dialog: MatDialog) { + this.accountId = this.route.parent.parent.snapshot.paramMap.get('fixedDepositAccountId'); + } + + /** + * Updates related variables on changes to dataObject. + */ + ngOnChanges() { + this.datatableColumns = this.dataObject.columnHeaders.map((columnHeader: any) => { + return columnHeader.columnName; + }); + this.datatableData = this.dataObject.data; + this.showDeleteBotton = this.datatableData[0] ? true : false; + } + + /** + * Fetches data table name from route params. + * subscription is required due to asynchronicity. + */ + ngOnInit() { + this.route.params.subscribe((routeParams: any) => { + this.datatableName = routeParams.datatableName; + }); + } + + /** + * Adds a new row to the given multi row data table. + */ + add() { + let dataTableEntryObject: any = { locale: 'en' }; + const dateTransformColumns: string[] = []; + const columns = this.dataObject.columnHeaders.filter((column: any) => { + return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id')); + }); + const formfields: FormfieldBase[] = columns.map((column: any) => { + switch (column.columnDisplayType) { + case 'INTEGER': + case 'STRING': + case 'DECIMAL': + case 'TEXT': return new InputBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: (column.columnDisplayType === 'INTEGER' || column.columnDisplayType === 'DECIMAL') ? 'number' : 'text', + required: (column.isColumnNullable) ? false : true + }); + case 'BOOLEAN': return new CheckboxBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'checkbox', + required: (column.isColumnNullable) ? false : true + }); + case 'CODELOOKUP': return new SelectBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + options: { label: 'value', value: 'id', data: column.columnValues }, + required: (column.isColumnNullable) ? false : true + }); + case 'DATE': { + dateTransformColumns.push(column.columnName); + dataTableEntryObject.dateFormat = 'yyyy-MM-dd'; + return new DatepickerBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'date', + required: (column.isColumnNullable) ? false : true + }); + } + case 'DATETIME': { + dateTransformColumns.push(column.columnName); + dataTableEntryObject.dateFormat = 'yyyy-MM-dd HH:mm'; + return new DatepickerBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'datetime-local', + required: (column.isColumnNullable) ? false : true + }); + } + } + }); + const data = { + title: 'Add ' + this.datatableName, + formfields: formfields + }; + const addDialogRef = this.dialog.open(FormDialogComponent, { data }); + addDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + dateTransformColumns.forEach((column) => { + response.data.value[column] = this.datePipe.transform(response.data.value[column], dataTableEntryObject.dateFormat); + }); + dataTableEntryObject = { ...response.data.value, ...dataTableEntryObject }; + this.savingsService.addSavingsDatatableEntry(this.accountId, this.datatableName, dataTableEntryObject).subscribe(() => { + this.savingsService.getSavingsDatatable(this.accountId, this.datatableName).subscribe((dataObject: any) => { + this.datatableData = dataObject.data; + this.dataTableRef.renderRows(); + }); + }); + } + }); + } + + /** + * Deletes all rows of the given multi row data table. + */ + delete() { + const deleteDataTableDialogRef = this.dialog.open(DeleteDialogComponent, { + data: { deleteContext: `the contents of ${this.datatableName}` } + }); + deleteDataTableDialogRef.afterClosed().subscribe((response: any) => { + if (response.delete) { + this.savingsService.deleteDatatableContent(this.accountId, this.datatableName).subscribe(() => { + this.savingsService.getSavingsDatatable(this.accountId, this.datatableName).subscribe((dataObject: any) => { + this.datatableData = dataObject.data; + this.showDeleteBotton = false; + this.dataTableRef.renderRows(); + }); + }); + } + }); + } + +} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.html b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.html new file mode 100644 index 000000000..c06b9402c --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.html @@ -0,0 +1,41 @@ +
+ +
+ +
+

{{datatableName}}

+
+ +
+
+ + + + + + + + + +
+
+ +
+ + + +
+ + + {{columnHeader.columnName}} : {{dataObject.data[0].row[i]}} + + +
+ +
diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.scss b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.scss new file mode 100644 index 000000000..54136dee3 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.scss @@ -0,0 +1,11 @@ +.tab-container { + padding: 1%; + margin: 1%; + .delete-button { + margin-left: 1%; + } +} + +.tableName { + padding-left: 2%; +} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.spec.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.spec.ts new file mode 100644 index 000000000..8aece650c --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SingleRowComponent } from './single-row.component'; + +describe('SingleRowComponent', () => { + let component: SingleRowComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SingleRowComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SingleRowComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.ts new file mode 100644 index 000000000..88c13ccf2 --- /dev/null +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/datatable-tabs/single-row/single-row.component.ts @@ -0,0 +1,207 @@ +/** Angular Imports */ +import { Component, Input, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { MatDialog } from '@angular/material'; +import { DatePipe } from '@angular/common'; + +/** Custom Components */ +import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component'; +import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component'; + +/** Custom Models */ +import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base'; +import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base'; +import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base'; +import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base'; +import { CheckboxBase } from 'app/shared/form-dialog/formfield/model/checkbox-base'; + +/** Custom Services */ +import { SavingsService } from 'app/savings/savings.service'; + + +/** + * Savings Account Single Row Data Tables + */ +@Component({ + selector: 'mifosx-single-row', + templateUrl: './single-row.component.html', + styleUrls: ['./single-row.component.scss'] +}) +export class SingleRowComponent implements OnInit { + + /** Data Object */ + @Input() dataObject: any; + + /** Data Table Name */ + datatableName: string; + /** Account Id */ + accountId: string; + + /** + * Fetches savings account Id from parent route params. + * @param {ActivatedRoute} route Activated Route. + * @param {DatePipe} datePipe Date Pipe. + * @param {SavingsService} savingsService Savingss Service. + * @param {MatDialog} dialog Mat Dialog. + */ + constructor(private route: ActivatedRoute, + private datePipe: DatePipe, + private dialog: MatDialog, + private savingsService: SavingsService) { + this.accountId = this.route.parent.parent.snapshot.paramMap.get('fixedDepositAccountId'); + } + + /** + * Fetches data table name from route params. + * subscription is required due to asynchronicity. + */ + ngOnInit() { + this.route.params.subscribe((routeParams: any) => { + this.datatableName = routeParams.datatableName; + }); + } + + /** + * Creates a new instance of the given single row data table. + */ + add() { + let dataTableEntryObject: any = { locale: 'en' }; + const dateTransformColumns: string[] = []; + const columns = this.dataObject.columnHeaders.filter((column: any) => { + return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id')); + }); + const formfields: FormfieldBase[] = this.getFormfields(columns, dateTransformColumns, dataTableEntryObject); + const data = { + title: 'Add ' + this.datatableName, + formfields: formfields + }; + const addDialogRef = this.dialog.open(FormDialogComponent, { data }); + addDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + dateTransformColumns.forEach((column) => { + response.data.value[column] = this.datePipe.transform(response.data.value[column], dataTableEntryObject.dateFormat); + }); + dataTableEntryObject = { ...response.data.value, ...dataTableEntryObject }; + this.savingsService.addSavingsDatatableEntry(this.accountId, this.datatableName, dataTableEntryObject).subscribe(() => { + this.savingsService.getSavingsDatatable(this.accountId, this.datatableName).subscribe((dataObject: any) => { + this.dataObject = dataObject; + }); + }); + } + }); + } + + /** + * Edits the current instance of single row data table. + */ + edit() { + let dataTableEntryObject: any = { locale: 'en' }; + const dateTransformColumns: string[] = []; + const columns = this.dataObject.columnHeaders.filter((column: any) => { + return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id')); + }); + let formfields: FormfieldBase[] = this.getFormfields(columns, dateTransformColumns, dataTableEntryObject); + formfields = formfields.map((formfield: FormfieldBase, index: number) => { + formfield.value = (this.dataObject.data[0].row[index + 1]) ? this.dataObject.data[0].row[index + 1] : ''; + return formfield; + }); + const data = { + title: 'Edit ' + this.datatableName, + layout: { addButtonText: 'Confirm' }, + formfields: formfields + }; + const editDialogRef = this.dialog.open(FormDialogComponent, { data }); + editDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + dateTransformColumns.forEach((column) => { + response.data.value[column] = this.datePipe.transform(response.data.value[column], dataTableEntryObject.dateFormat); + }); + dataTableEntryObject = { ...response.data.value, ...dataTableEntryObject }; + this.savingsService.editSavingsDatatableEntry(this.accountId, this.datatableName, dataTableEntryObject).subscribe(() => { + this.savingsService.getSavingsDatatable(this.accountId, this.datatableName).subscribe((dataObject: any) => { + this.dataObject = dataObject; + }); + }); + } + }); + } + + /** + * Deletes the current instance of single row data table. + */ + delete() { + const deleteDataTableDialogRef = this.dialog.open(DeleteDialogComponent, { + data: { deleteContext: `the contents of ${this.datatableName}` } + }); + deleteDataTableDialogRef.afterClosed().subscribe((response: any) => { + if (response.delete) { + this.savingsService.deleteDatatableContent(this.accountId, this.datatableName) + .subscribe(() => { + this.savingsService.getSavingsDatatable(this.accountId, this.datatableName).subscribe((dataObject: any) => { + this.dataObject = dataObject; + }); + }); + } + }); + } + + /** + * Maps API response to data table form fields. + * @param {any} columns Data Table Columns. + * @param {string[]} dateTransformColumns Columns transformed with date pipe. + * @param {any} dataTableEntryObject Additional data table details. + */ + getFormfields(columns: any, dateTransformColumns: string[], dataTableEntryObject: any) { + return columns.map((column: any) => { + switch (column.columnDisplayType) { + case 'INTEGER': + case 'STRING': + case 'DECIMAL': + case 'TEXT': return new InputBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: (column.columnDisplayType === 'INTEGER' || column.columnDisplayType === 'DECIMAL') ? 'number' : 'text', + required: (column.isColumnNullable) ? false : true + }); + case 'BOOLEAN': return new CheckboxBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'checkbox', + required: (column.isColumnNullable) ? false : true + }); + case 'CODELOOKUP': return new SelectBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + options: { label: 'value', value: 'id', data: column.columnValues }, + required: (column.isColumnNullable) ? false : true + }); + case 'DATE': { + dateTransformColumns.push(column.columnName); + dataTableEntryObject.dateFormat = 'yyyy-MM-dd'; + return new DatepickerBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'date', + required: (column.isColumnNullable) ? false : true + }); + } + case 'DATETIME': { + dateTransformColumns.push(column.columnName); + dataTableEntryObject.dateFormat = 'yyyy-MM-dd HH:mm'; + return new DatepickerBase({ + controlName: column.columnName, + label: column.columnName, + value: '', + type: 'datetime-local', + required: (column.isColumnNullable) ? false : true + }); + } + } + }); + } + +} 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 5a7c7bf50..4de21a862 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 @@ -216,6 +216,13 @@ Standing Instructions + + + {{savingsDatatable.registeredTableName}} + + diff --git a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.ts b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.ts index 17f7d3e16..53adefa3c 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.ts +++ b/src/app/deposits/recurring-deposits/recurring-deposits-account-view/recurring-deposits-account-view.component.ts @@ -24,7 +24,8 @@ export class RecurringDepositsAccountViewComponent implements OnInit { recurringDepositsAccountData: any; buttonConfig: RecurringDepositsButtonsConfiguration; charges: any; - + /** Savings Data Tables */ + savingsDatatables: any; /** * Fetches recurringDeposits account data from `resolve` * @param {ActivatedRoute} route Activated Route @@ -36,9 +37,10 @@ export class RecurringDepositsAccountViewComponent implements OnInit { private datePipe: DatePipe, private recurringDepositsService: RecurringDepositsService, public dialog: MatDialog) { - this.route.data.subscribe((data: { recurringDepositsAccountData: any }) => { + this.route.data.subscribe((data: { recurringDepositsAccountData: any, savingsDatatables: any }) => { this.recurringDepositsAccountData = data.recurringDepositsAccountData; this.charges = this.recurringDepositsAccountData.charges; + this.savingsDatatables = data.savingsDatatables; }); } 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 2dd0e2d6e..2b52837a4 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts +++ b/src/app/deposits/recurring-deposits/recurring-deposits-routing.module.ts @@ -15,6 +15,9 @@ import { RecurringDepositsAccountViewResolver } from './common-resolvers/recurri import { RecurringDepositsAccountDataResolver } from './common-resolvers/recurring-deposits-account-data.resolver'; import { StandingInstructionsTabComponent } from './recurring-deposits-account-view/standing-instructions-tab/standing-instructions-tab.component'; import { ChargesTabComponent } from './recurring-deposits-account-view/charges-tab/charges-tab.component'; +import { DatatableTabsComponent } from './recurring-deposits-account-view/datatable-tabs/datatable-tabs.component'; +import { SavingsDatatableResolver } from 'app/savings/common-resolvers/savings-datatable.resolver'; +import { SavingsDatatablesResolver } from 'app/savings/common-resolvers/savings-datatables.resolver'; const routes: Routes = [ { @@ -26,7 +29,8 @@ const routes: Routes = [ data: { title: extract('RecurringDeposit Account View'), routeParamBreadcrumb: 'recurringDepositAccountId' }, component: RecurringDepositsAccountViewComponent, resolve: { - recurringDepositsAccountData: RecurringDepositsAccountViewResolver + recurringDepositsAccountData: RecurringDepositsAccountViewResolver, + savingsDatatables: SavingsDatatablesResolver }, children: [ { @@ -58,6 +62,19 @@ const routes: Routes = [ recurringDepositsAccountData: RecurringDepositsAccountDataResolver } }, + { + path: 'datatables', + children: [ + { + path: ':datatableName', + component: DatatableTabsComponent, + data: { title: extract('View Data Table'), routeParamBreadcrumb: 'datatableName' }, + resolve: { + savingsDatatable: SavingsDatatableResolver + } + } + ] + } ] } ] @@ -69,7 +86,9 @@ const routes: Routes = [ declarations: [], providers: [ RecurringDepositsAccountViewResolver, - RecurringDepositsAccountDataResolver + RecurringDepositsAccountDataResolver, + SavingsDatatableResolver, + SavingsDatatablesResolver ] }) export class RecurringDepositsRoutingModule {} diff --git a/src/app/deposits/recurring-deposits/recurring-deposits.module.ts b/src/app/deposits/recurring-deposits/recurring-deposits.module.ts index 64b97c11b..e40be9947 100644 --- a/src/app/deposits/recurring-deposits/recurring-deposits.module.ts +++ b/src/app/deposits/recurring-deposits/recurring-deposits.module.ts @@ -14,6 +14,9 @@ import { InterestRateChartTabComponent } from './recurring-deposits-account-view import { TransactionsTabComponent } from './recurring-deposits-account-view/transactions-tab/transactions-tab.component'; import { StandingInstructionsTabComponent } from './recurring-deposits-account-view/standing-instructions-tab/standing-instructions-tab.component'; import { ChargesTabComponent } from './recurring-deposits-account-view/charges-tab/charges-tab.component'; +import { DatatableTabsComponent } from './recurring-deposits-account-view/datatable-tabs/datatable-tabs.component'; +import { MultiRowComponent } from './recurring-deposits-account-view/datatable-tabs/multi-row/multi-row.component'; +import { SingleRowComponent } from './recurring-deposits-account-view/datatable-tabs/single-row/single-row.component'; /** * RecurringDeposits Module @@ -32,7 +35,10 @@ import { ChargesTabComponent } from './recurring-deposits-account-view/charges-t InterestRateChartTabComponent, TransactionsTabComponent, StandingInstructionsTabComponent, - ChargesTabComponent + ChargesTabComponent, + DatatableTabsComponent, + MultiRowComponent, + SingleRowComponent ], providers: [DatePipe] }) diff --git a/src/app/savings/common-resolvers/savings-datatable.resolver.ts b/src/app/savings/common-resolvers/savings-datatable.resolver.ts index d43d1109d..c0eaf97df 100644 --- a/src/app/savings/common-resolvers/savings-datatable.resolver.ts +++ b/src/app/savings/common-resolvers/savings-datatable.resolver.ts @@ -24,7 +24,7 @@ export class SavingsDatatableResolver implements Resolve { * @returns {Observable} */ resolve(route: ActivatedRouteSnapshot): Observable { - const accountId = route.parent.parent.paramMap.get('savingAccountId') || route.parent.parent.paramMap.get('fixedDepositAccountId'); + const accountId = route.parent.parent.paramMap.get('savingAccountId') || route.parent.parent.paramMap.get('fixedDepositAccountId') || route.parent.parent.paramMap.get('recurringDepositAccountId'); const datatableName = route.paramMap.get('datatableName'); return this.savingsService.getSavingsDatatable(accountId, datatableName); }