From 82670ce86bf9e943d1d490455ba739aa1f287c6a Mon Sep 17 00:00:00 2001 From: Alexis Lahouze Date: Sun, 17 Sep 2017 01:28:58 +0200 Subject: [PATCH] Finish migration of account list to material. --- src/accounts/account.dataSource.ts | 34 +++++ src/accounts/account.module.ts | 4 + src/accounts/accountEditModal.component.ts | 3 +- src/accounts/accountList.component.ts | 170 +++++++++++++++------ 4 files changed, 166 insertions(+), 45 deletions(-) create mode 100644 src/accounts/account.dataSource.ts diff --git a/src/accounts/account.dataSource.ts b/src/accounts/account.dataSource.ts new file mode 100644 index 0000000..227d79b --- /dev/null +++ b/src/accounts/account.dataSource.ts @@ -0,0 +1,34 @@ +import { Injectable } from '@angular/core'; +import { DataSource } from '@angular/cdk/collections'; +import { Observable } from 'rxjs/Rx'; + +import { Account } from './account'; +import { AccountBalances } from './accountBalances'; +import { AccountBalancesService } from './accountBalances.service'; +import { AccountService } from './account.service'; + +@Injectable() +export class AccountDataSource extends DataSource { + constructor( + private accountService: AccountService, + private accountBalancesService: AccountBalancesService, + ) { + super(); + } + + connect(): Observable { + return this.accountService.query().map((accounts: Account[]) => { + for(let account of accounts) { + this.accountBalancesService + .get(account.id) + .subscribe((accountBalances: AccountBalances) => { + account.balances = accountBalances; + }) + } + + return accounts; + }); + } + + disconnect() {} +} diff --git a/src/accounts/account.module.ts b/src/accounts/account.module.ts index 58028f8..d911003 100644 --- a/src/accounts/account.module.ts +++ b/src/accounts/account.module.ts @@ -6,6 +6,7 @@ import { ReactiveFormsModule } from '@angular/forms'; import { MdButtonModule, MdDialogModule, + MdIconModule, MdInputModule, MdListModule, MdTableModule, @@ -20,6 +21,7 @@ import { ToastrModule } from 'ngx-toastr'; import { AccountService } from './account.service'; import { AccountBalancesService } from './accountBalances.service'; import { AccountListComponent } from './accountList.component'; +import { AccountDataSource } from './account.dataSource'; import { AccountDeleteModalComponent } from './accountDeleteModal.component'; import { AccountEditModalComponent } from './accountEditModal.component'; import { AccountFormComponent } from './accountForm.component'; @@ -37,6 +39,7 @@ import { AccountListState } from './account.states' ]), MdButtonModule, MdDialogModule, + MdIconModule, MdInputModule, MdListModule, MdTableModule, @@ -46,6 +49,7 @@ import { AccountListState } from './account.states' ], providers: [ AccountService, + AccountDataSource, AccountBalancesService, DailyBalanceService, ], diff --git a/src/accounts/accountEditModal.component.ts b/src/accounts/accountEditModal.component.ts index a66aa86..22aa10a 100644 --- a/src/accounts/accountEditModal.component.ts +++ b/src/accounts/accountEditModal.component.ts @@ -11,7 +11,8 @@ import { AccountFormComponent } from './accountForm.component';

{{ title() }}

- + + diff --git a/src/accounts/accountList.component.ts b/src/accounts/accountList.component.ts index 3718287..c9f03de 100644 --- a/src/accounts/accountList.component.ts +++ b/src/accounts/accountList.component.ts @@ -1,5 +1,5 @@ // vim: set tw=80 ts=2 sw=2 sts=2 : -import { Component, Inject, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; import { MdDialog } from '@angular/material'; import { Observable } from 'rxjs/Rx'; @@ -8,47 +8,100 @@ import { ToastrService } from 'ngx-toastr'; import { Account } from './account'; import { AccountBalances } from './accountBalances'; +import { AccountDataSource } from './account.dataSource'; import { AccountService } from './account.service'; +import { AccountDeleteModalComponent } from './accountDeleteModal.component'; import { AccountEditModalComponent } from './accountEditModal.component'; @Component({ selector: 'account-list', template: ` -
-
- - - - - - - - - - +
+
+ +
-
- - - +
+ + + Nom du compte + + + {{ account.name }} + + + -
- - -
Nom du compteSolde courantSolde pointéDécouvert autoriséActions
- -
+ + Solde courant + + + {{ account.balances?.current | currency:"EUR":true }} + + + + + + Solde pointé + + + {{ account.balances?.pointed | currency:"EUR":true }} + + + + + + Découvert autorisé + + {{ account.authorized_overdraft | currency:"EUR":true }} + + + + + Actions + + + + + + + + + + + + + + + +
`, }) -export class AccountListComponent implements OnInit { - accounts: Account[]; +export class AccountListComponent { + displayedColumns: String[] = [ + 'name', 'current', 'pointed', 'authorizedOverdraft', 'actions' + ]; constructor( + private accounts: AccountDataSource, private accountService: AccountService, private toastrService: ToastrService, private logger: Logger, @@ -56,25 +109,20 @@ export class AccountListComponent implements OnInit { ) { } - ngOnInit() { - // Load accounts. - this.load(); - } - - load() { - this.logger.log("Load accounts."); - this.accountService.query().subscribe(accounts => { - this.accounts = accounts; - }); - }; - /* * Add an empty account. */ add() { + this.modify(new Account()); + }; + + /* + * Modify an account. + */ + modify(account: Account) { let dialogRef = this.mdDialog.open(AccountEditModalComponent, { data: { - account: new Account(), + account: account, } }); @@ -87,7 +135,7 @@ export class AccountListComponent implements OnInit { } }, (reason) => function(reason) { }); - }; + } /* * Save account. @@ -95,8 +143,6 @@ export class AccountListComponent implements OnInit { save(account) { this.accountService.create(account).subscribe(account => { this.toastrService.success('Account #' + account.id + ' saved.'); - - this.load(); }, result => { this.logger.error('Error while saving account', account, result); @@ -105,4 +151,40 @@ export class AccountListComponent implements OnInit { ); }); }; + + /* + * Show a dialog to confirm account deletion. + */ + confirmDelete(account: Account) { + let dialogRef = this.mdDialog.open(AccountDeleteModalComponent, { + data: { + account: account, + } + }); + + dialogRef.afterClosed().subscribe((account: Account) => { + if(account) { + this.logger.debug("Deleting account", account); + //this.delete(account); + } + }); + }; + + /* + * Delete an account. + */ + delete(account: Account) { + var id = account.id; + + this.accountService.delete(account).subscribe(account => { + this.toastrService.success('account #' + id + ' deleted.'); + + // FIXME Alexis Lahouze 2017-09-17 Remove from array. + }, function(result) { + this.toastrService.error( + 'An error occurred while trying to delete account #' + + id + ':
' + result + ); + }); + }; };