From e28500c5573f68c3525b5ace285ddb882a96214f Mon Sep 17 00:00:00 2001 From: Alexis Lahouze Date: Fri, 21 Jul 2017 00:29:03 +0200 Subject: [PATCH] Use ngx-toastr for notifications in account module. --- package.json | 1 + src/accounts/account.module.ts | 2 ++ src/accounts/accountList.component.ts | 19 +++++++++++++------ src/accounts/index.ts | 3 +++ src/app.module.ts | 2 ++ src/main.less | 2 ++ 6 files changed, 23 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 6a49a13..91469d5 100644 --- a/package.json +++ b/package.json @@ -69,6 +69,7 @@ "meanie-angular-storage": "^1.3.1", "moment": "^2.18", "ngx-restangular": "^1.0.11", + "ngx-toastr": "^5.3.1", "reflect-metadata": "^0.1.10", "rxjs": "^5.4.2", "zone.js": "^0.8.12" diff --git a/src/accounts/account.module.ts b/src/accounts/account.module.ts index a818c64..26a3370 100644 --- a/src/accounts/account.module.ts +++ b/src/accounts/account.module.ts @@ -8,6 +8,7 @@ import { HttpModule } from '@angular/http'; import { NgLoggerModule, Level } from '@nsalaun/ng-logger'; import { RestangularModule } from 'ngx-restangular'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; +import { ToastrModule } from 'ngx-toastr'; import { AccountService } from './account.service'; import { AccountBalancesService } from './accountBalances.service'; @@ -22,6 +23,7 @@ import { AccountFormComponent } from './accountForm.component'; FormsModule, NgLoggerModule, RestangularModule, + ToastrModule, NgbModule ], providers: [ diff --git a/src/accounts/accountList.component.ts b/src/accounts/accountList.component.ts index 33e95e9..c91c585 100644 --- a/src/accounts/accountList.component.ts +++ b/src/accounts/accountList.component.ts @@ -2,6 +2,7 @@ import { Observable } from 'rxjs/Rx'; import { Logger } from '@nsalaun/ng-logger'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; +import { ToastrService } from 'ngx-toastr'; import { Account } from './account'; import { AccountBalances } from './accountBalances'; @@ -10,14 +11,20 @@ import { AccountBalancesService } from './accountBalances.service'; import { AccountDeleteModalComponent } from './accountDeleteModal.component'; import { AccountEditModalComponent } from './accountEditModal.component'; export class AccountListComponent { - static $inject = ['AccountService', 'AccountBalancesService', 'Notification', 'Logger', 'NgbModal']; + static $inject = [ + 'AccountService', + 'AccountBalancesService', + 'ToastrService', + 'Logger', + 'NgbModal' + ]; accounts: Account[]; constructor( private AccountService: AccountService, private AccountBalancesService: AccountBalancesService, - private Notification, + private ToastrService: ToastrService, private Logger: Logger, private NgbModal: NgbModal ) { @@ -93,13 +100,13 @@ export class AccountListComponent { } observable.subscribe(account => { - this.Notification.success('Account #' + account.id + ' saved.'); + this.ToastrService.success('Account #' + account.id + ' saved.'); this.load(); }, result => { this.Logger.error('Error while saving account', account, result); - this.Notification.error( + this.ToastrService.error( 'Error while saving account: ' + result.message ); }); @@ -124,13 +131,13 @@ export class AccountListComponent { var id = account.id; this.AccountService.delete(account).subscribe(account => { - this.Notification.success('account #' + id + ' deleted.'); + this.ToastrService.success('account #' + id + ' deleted.'); this.load(); return account; }, function(result) { - this.Notification.error( + this.ToastrService.error( 'An error occurred while trying to delete account #' + id + ':
' + result ); diff --git a/src/accounts/index.ts b/src/accounts/index.ts index 3c53e50..5e35fae 100644 --- a/src/accounts/index.ts +++ b/src/accounts/index.ts @@ -29,6 +29,7 @@ var ngResource = require('angular-resource'), import { Logger } from '@nsalaun/ng-logger'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; +import { ToastrService } from 'ngx-toastr'; var accountsTmpl = require('./accounts.html'); @@ -43,6 +44,8 @@ export default angular.module('accountant.accounts', [ ngStrap, ]) + .factory('ToastrService', downgradeInjectable(ToastrService)) + .factory('Logger', downgradeInjectable(Logger)) .factory('NgbModal', downgradeInjectable(NgbModal)) diff --git a/src/app.module.ts b/src/app.module.ts index f0bca68..5fbb5b1 100644 --- a/src/app.module.ts +++ b/src/app.module.ts @@ -12,6 +12,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { NgLoggerModule } from '@nsalaun/ng-logger'; import { RestangularModule } from 'ngx-restangular'; +import { ToastrModule } from 'ngx-toastr'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { AccountModule } from './accounts/account.module'; @@ -36,6 +37,7 @@ import { ApiBaseURL, LogLevel } from './app.config'; } ); }), + ToastrModule.forRoot(), NgbModule.forRoot() ] }) diff --git a/src/main.less b/src/main.less index 8fe1882..dc244c4 100644 --- a/src/main.less +++ b/src/main.less @@ -6,6 +6,8 @@ @import (inline) '~bootstrap-additions/dist/bootstrap-additions.css'; +@import (inline) '~ngx-toastr/toastr.css'; + .italic { font-style: italic; }