Upgrade AccountListComponent to Angular.
This commit is contained in:
parent
88e0599cd7
commit
79d55bfc44
@ -12,6 +12,7 @@ import { ToastrModule } from 'ngx-toastr';
|
|||||||
|
|
||||||
import { AccountService } from './account.service';
|
import { AccountService } from './account.service';
|
||||||
import { AccountBalancesService } from './accountBalances.service';
|
import { AccountBalancesService } from './accountBalances.service';
|
||||||
|
import { AccountListComponent } from './accountList.component';
|
||||||
import { AccountDeleteModalComponent } from './accountDeleteModal.component';
|
import { AccountDeleteModalComponent } from './accountDeleteModal.component';
|
||||||
import { AccountEditModalComponent } from './accountEditModal.component';
|
import { AccountEditModalComponent } from './accountEditModal.component';
|
||||||
import { AccountFormComponent } from './accountForm.component';
|
import { AccountFormComponent } from './accountForm.component';
|
||||||
@ -31,11 +32,13 @@ import { AccountFormComponent } from './accountForm.component';
|
|||||||
AccountBalancesService,
|
AccountBalancesService,
|
||||||
],
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
|
AccountListComponent,
|
||||||
AccountDeleteModalComponent,
|
AccountDeleteModalComponent,
|
||||||
AccountEditModalComponent,
|
AccountEditModalComponent,
|
||||||
AccountFormComponent
|
AccountFormComponent
|
||||||
],
|
],
|
||||||
entryComponents: [
|
entryComponents: [
|
||||||
|
AccountListComponent,
|
||||||
AccountDeleteModalComponent,
|
AccountDeleteModalComponent,
|
||||||
AccountEditModalComponent,
|
AccountEditModalComponent,
|
||||||
AccountFormComponent
|
AccountFormComponent
|
||||||
|
@ -1,3 +1,5 @@
|
|||||||
|
import { CurrencyPipe } from '@angular/common';
|
||||||
|
import { Component, Inject } from '@angular/core';
|
||||||
import { Observable } from 'rxjs/Rx';
|
import { Observable } from 'rxjs/Rx';
|
||||||
|
|
||||||
import { Logger } from '@nsalaun/ng-logger';
|
import { Logger } from '@nsalaun/ng-logger';
|
||||||
@ -10,6 +12,80 @@ import { AccountService } from './account.service';
|
|||||||
import { AccountBalancesService } from './accountBalances.service';
|
import { AccountBalancesService } from './accountBalances.service';
|
||||||
import { AccountDeleteModalComponent } from './accountDeleteModal.component';
|
import { AccountDeleteModalComponent } from './accountDeleteModal.component';
|
||||||
import { AccountEditModalComponent } from './accountEditModal.component';
|
import { AccountEditModalComponent } from './accountEditModal.component';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'account-list',
|
||||||
|
template: `
|
||||||
|
<div class="row">
|
||||||
|
<table class="table table-striped table-condensed table-hover">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Nom du compte</th>
|
||||||
|
<th class="col-md-1">Solde courant</th>
|
||||||
|
<th class="col-md-1">Solde pointé</th>
|
||||||
|
<th class="col-md-1">Découvert autorisé</th>
|
||||||
|
<th class="col-md-1">Actions</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td colspan="5">
|
||||||
|
<button class="btn btn-success" (click)="add()">
|
||||||
|
Ajouter
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr id="{{ account.id }}"
|
||||||
|
class="form-inline" ng-class="rowClass(account)"
|
||||||
|
*ngFor="let account of accounts">
|
||||||
|
<td>
|
||||||
|
<a href="#!/account/{{ account.id }}/operations">{{ account.name }}</a>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<span (ngClass)="valueClass(account, account.balances.current)">
|
||||||
|
{{ account.balances?.current | currency:"EUR" }}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<span ng-class="valueClass(account, account.balancess.pointed)">
|
||||||
|
{{ account.balances?.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(account)">
|
||||||
|
<span class="fa fa-pencil-square-o"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Delete account, with confirm. -->
|
||||||
|
<button type="button" class="btn btn-default"
|
||||||
|
(click)="confirmDelete(account)">
|
||||||
|
<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>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
`,
|
||||||
|
})
|
||||||
export class AccountListComponent {
|
export class AccountListComponent {
|
||||||
static $inject = [
|
static $inject = [
|
||||||
'AccountService',
|
'AccountService',
|
||||||
|
@ -20,44 +20,20 @@
|
|||||||
var angular = require('angular');
|
var angular = require('angular');
|
||||||
|
|
||||||
//declare var angular: angular.IAngularStatic;
|
//declare var angular: angular.IAngularStatic;
|
||||||
import { downgradeInjectable } from '@angular/upgrade/static';
|
import {
|
||||||
|
downgradeInjectable,
|
||||||
|
downgradeComponent
|
||||||
|
} from '@angular/upgrade/static';
|
||||||
|
|
||||||
var ngResource = require('angular-resource'),
|
|
||||||
ngMessages = require('angular-messages'),
|
|
||||||
ngUiNotification = require('angular-ui-notification'),
|
|
||||||
ngStrap = require('angular-strap');
|
|
||||||
|
|
||||||
import { Logger } from '@nsalaun/ng-logger';
|
|
||||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
|
|
||||||
import { ToastrService } from 'ngx-toastr';
|
|
||||||
|
|
||||||
var accountsTmpl = require('./accounts.html');
|
|
||||||
|
|
||||||
import { AccountBalancesService } from './accountBalances.service';
|
|
||||||
import { AccountService } from './account.service';
|
import { AccountService } from './account.service';
|
||||||
import { AccountListComponent } from './accountList.component';
|
import { AccountListComponent } from './accountList.component';
|
||||||
|
|
||||||
export default angular.module('accountant.accounts', [
|
export default angular.module('accountant.accounts', [])
|
||||||
ngResource,
|
|
||||||
ngMessages,
|
|
||||||
ngUiNotification,
|
|
||||||
ngStrap,
|
|
||||||
])
|
|
||||||
|
|
||||||
.factory('ToastrService', downgradeInjectable(ToastrService))
|
|
||||||
|
|
||||||
.factory('Logger', downgradeInjectable(Logger))
|
|
||||||
|
|
||||||
.factory('NgbModal', downgradeInjectable(NgbModal))
|
|
||||||
|
|
||||||
.factory('AccountBalancesService', downgradeInjectable(AccountBalancesService))
|
|
||||||
|
|
||||||
.factory('AccountService', downgradeInjectable(AccountService))
|
.factory('AccountService', downgradeInjectable(AccountService))
|
||||||
|
|
||||||
.component('accountList', {
|
.directive('accountList', downgradeComponent({
|
||||||
controller: AccountListComponent,
|
component: AccountListComponent
|
||||||
controllerAs: 'accountsCtrl',
|
}))
|
||||||
templateUrl: accountsTmpl
|
|
||||||
})
|
|
||||||
|
|
||||||
.name;
|
.name;
|
||||||
|
Loading…
Reference in New Issue
Block a user