179 lines
4.7 KiB
TypeScript
179 lines
4.7 KiB
TypeScript
// vim: set tw=80 ts=2 sw=2 sts=2 :
|
|
import { CurrencyPipe } from '@angular/common';
|
|
import { Component, Inject, Input, Output, EventEmitter, OnInit } from '@angular/core';
|
|
|
|
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';
|
|
import { AccountBalancesService } from './accountBalances.service';
|
|
import { AccountService } from './account.service';
|
|
import { AccountDeleteModalComponent } from './accountDeleteModal.component';
|
|
import { AccountEditModalComponent } from './accountEditModal.component';
|
|
|
|
@Component({
|
|
selector: 'tr[account-row]',
|
|
host: {
|
|
"[id]": "account.id",
|
|
"[class.warning]": "warning",
|
|
"[class.danger]": "danger"
|
|
},
|
|
template: `
|
|
<td>
|
|
<a href="#!/account/{{ account.id }}/operations">{{ account.name }}</a>
|
|
</td>
|
|
|
|
<td>
|
|
<span (ngClass)="valueClass(account, accountBalances?.current)">
|
|
{{ accountBalances?.current | currency:"EUR" }}
|
|
</span>
|
|
</td>
|
|
|
|
<td>
|
|
<span (ngClass)="valueClass(account, accountBalances?.pointed)">
|
|
{{ accountBalances?.pointed | currency:"EUR" }}
|
|
</span>
|
|
</td>
|
|
|
|
<td>{{ account.authorized_overdraft | currency:"EUR" }}</td>
|
|
|
|
<td>
|
|
<div class="btn-group btn-group-xs">
|
|
<!-- Edit account. -->
|
|
<button type="button" class="btn btn-success"
|
|
(click)="modify()">
|
|
<span class="fa fa-pencil-square-o"></span>
|
|
</button>
|
|
|
|
<!-- Delete account, with confirm. -->
|
|
<button type="button" class="btn btn-default"
|
|
(click)="confirmDelete()">
|
|
<span class="fa fa-trash-o"></span>
|
|
</button>
|
|
|
|
<!-- Open account scheduler. -->
|
|
<a class="btn btn-default"
|
|
[hidden]="!account.id"
|
|
href="#!/account/{{ account.id }}/scheduler">
|
|
<span class="fa fa-clock-o"></span>
|
|
</a>
|
|
</div>
|
|
</td>
|
|
`
|
|
})
|
|
export class AccountRowComponent implements OnInit {
|
|
@Input('account-row') account: Account;
|
|
@Output() needsReload: EventEmitter<void> = new EventEmitter<void>();
|
|
|
|
accountBalances: AccountBalances;
|
|
|
|
constructor(
|
|
private accountService: AccountService,
|
|
private accountBalancesService: AccountBalancesService,
|
|
private toastrService: ToastrService,
|
|
private logger: Logger,
|
|
private modal: NgbModal
|
|
) {
|
|
this.logger.log("AccountRowComponent constructor");
|
|
}
|
|
|
|
ngOnInit() {
|
|
this.logger.log(this.account);
|
|
this.accountBalancesService
|
|
.get(this.account.id)
|
|
.subscribe((accountBalances: AccountBalances) => {
|
|
this.accountBalances = accountBalances;
|
|
})
|
|
}
|
|
|
|
get warning() {
|
|
return this.account && this.accountBalances
|
|
&& this.account.authorized_overdraft < this.accountBalances.current
|
|
&& this.accountBalances.current < 0;
|
|
};
|
|
|
|
get error() {
|
|
return this.account && this.accountBalances
|
|
&& this.accountBalances.current < this.account.authorized_overdraft;
|
|
};
|
|
|
|
/*
|
|
* Return the class for a value compared to account authorized overdraft.
|
|
*/
|
|
valueClass(value: number) {
|
|
if (!value) {
|
|
return;
|
|
}
|
|
|
|
if (value < this.account.authorized_overdraft) {
|
|
return 'text-danger';
|
|
} else if (value < 0) {
|
|
return 'text-warning';
|
|
}
|
|
};
|
|
|
|
confirmDelete() {
|
|
const modal = this.modal.open(AccountDeleteModalComponent, {
|
|
windowClass: 'in'
|
|
});
|
|
|
|
modal.componentInstance.account = this.account;
|
|
|
|
modal.result.then((account: Account) => {
|
|
this.delete(account);
|
|
}, (reason) => function(reason) {
|
|
});
|
|
};
|
|
|
|
/*
|
|
* Delete an account.
|
|
*/
|
|
delete(account: Account) {
|
|
var id = account.id;
|
|
|
|
this.accountService.delete(account).subscribe(account => {
|
|
this.toastrService.success('account #' + id + ' deleted.');
|
|
|
|
this.needsReload.emit();
|
|
}, function(result) {
|
|
this.toastrService.error(
|
|
'An error occurred while trying to delete account #' +
|
|
id + ':<br />' + result
|
|
);
|
|
});
|
|
};
|
|
|
|
/*
|
|
* Open the popup to modify the account, save it on confirm.
|
|
*/
|
|
modify() {
|
|
const modal = this.modal.open(AccountEditModalComponent, {
|
|
windowClass: 'in'
|
|
});
|
|
|
|
modal.componentInstance.account = this.account;
|
|
|
|
modal.result.then((account: Account) => {
|
|
this.logger.log("Modal closed => save account", account);
|
|
this.save(account);
|
|
}, (reason) => function(reason) {
|
|
});
|
|
};
|
|
|
|
save(account: Account) {
|
|
this.accountService.update(account).subscribe((account: Account) => {
|
|
this.toastrService.success('Account #' + account.id + ' saved.');
|
|
|
|
this.needsReload.emit();
|
|
}, result => {
|
|
this.logger.error('Error while saving account', account, result);
|
|
|
|
this.toastrService.error(
|
|
'Error while saving account: ' + result.message
|
|
);
|
|
});
|
|
};
|
|
}
|