accountant-ui/src/scheduler/scheduleList.component.ts

128 lines
3.4 KiB
TypeScript
Raw Normal View History

import { Component, Inject, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Rx';
2017-07-22 09:17:50 +02:00
import { Logger } from '@nsalaun/ng-logger';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ToastrService } from 'ngx-toastr';
import { ScheduleService } from './schedule.service';
import { Schedule } from './schedule';
var scheduleFormTmpl = require('./schedule.form.tmpl.html');
@Component({
selector: 'schedule-list',
template: `
<div class="row">
<table class="table table-striped table-condensed table-hover">
<thead>
<tr>
<th class="col-md-1">Date de d&eacute;but</th>
<th class="col-md-1">Date de fin</th>
<th class="col-md-1">Jour</th>
<th class="col-md-1">Fr&eacute;q.</th>
<th>Libell&eacute; de l'op&eacute;ration</th>
<th class="col-md-1">Montant</th>
<th class="col-md-2">Cat&eacute;gorie</th>
<th class="col-md-1">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="8">
<button class="btn btn-success" (click)="add()">
Ajouter
</button>
</td>
</tr>
<tr *ngFor="let schedule of schedules"
[schedule-row]="schedule" (needsReload)="load()">
</tr>
</tbody>
</table>
</div>
`
})
2017-07-25 16:56:57 +02:00
export class ScheduleListComponent implements OnInit {
accountId: number;
schedules = [];
constructor(
2017-07-22 09:17:50 +02:00
private toastrService: ToastrService,
private scheduleService: ScheduleService,
2017-07-22 14:29:29 +02:00
private logger: Logger,
@Inject('$modal') private $modal,
@Inject('accountIdService') private accountIdService
) {}
2017-07-23 07:53:26 +02:00
$onInit() {
this.ngOnInit();
}
ngOnInit() {
this.logger.log("ngOnInit");
this.accountId = this.accountIdService.get();
// Load operations on controller initialization.
this.load();
}
/*
* Add a new operation at the beginning of th array.
*/
2017-07-23 07:53:26 +02:00
add() {
var schedule = new Schedule();
schedule.account_id = this.accountId;
var title = "New schedule";
this.$modal({
templateUrl: scheduleFormTmpl,
controller: function($scope, title, schedule, $save) {
$scope.title = title;
$scope.operation = schedule;
$scope.$save = () => {
$scope.$hide();
$save($scope.operation);
};
},
locals: {
title: title,
schedule: schedule,
$save: (schedule) => {
this.save(schedule);
}
}
});
};
2017-07-23 07:53:26 +02:00
load() {
this.logger.log("Loading schedules for accountId", this.accountId);
if(!this.accountId) {
return;
}
this.scheduleService.query(this.accountId)
.subscribe((schedules: Schedule[]) => {
this.logger.log("Schedules loaded.", schedules);
this.schedules = schedules;
}, (reason) => {
this.logger.log("Got error", reason);
}
);
};
save(schedule: Schedule) {
return this.scheduleService.update(schedule).subscribe((schedule: Schedule) => {
this.toastrService.success('Schedule #' + schedule.id + ' saved.');
this.load();
2017-07-22 09:17:50 +02:00
}, (result) => {
this.toastrService.error(
'Error while saving schedule: ' + result.message
);
});
};
};