Add Operation Form component.
This commit is contained in:
parent
10d8959178
commit
3f6d60bb50
@ -15,6 +15,7 @@ import { CategoryService } from './category.service';
|
|||||||
import { OperationService } from './operation.service';
|
import { OperationService } from './operation.service';
|
||||||
import { OperationListComponent } from './operationList.component';
|
import { OperationListComponent } from './operationList.component';
|
||||||
import { OperationDeleteModalComponent } from './operationDeleteModal.component';
|
import { OperationDeleteModalComponent } from './operationDeleteModal.component';
|
||||||
|
import { OperationFormComponent } from './operationForm.component';
|
||||||
|
|
||||||
export function $modalServiceFactory(i: any) {
|
export function $modalServiceFactory(i: any) {
|
||||||
return i.get('$modal');
|
return i.get('$modal');
|
||||||
@ -51,6 +52,7 @@ export function accountIdServiceFactory(i: any) {
|
|||||||
OperationRowComponent,
|
OperationRowComponent,
|
||||||
OperationListComponent,
|
OperationListComponent,
|
||||||
OperationDeleteModalComponent,
|
OperationDeleteModalComponent,
|
||||||
|
OperationFormComponent,
|
||||||
],
|
],
|
||||||
entryComponents: [
|
entryComponents: [
|
||||||
BalanceChartComponent,
|
BalanceChartComponent,
|
||||||
@ -58,6 +60,7 @@ export function accountIdServiceFactory(i: any) {
|
|||||||
OperationRowComponent,
|
OperationRowComponent,
|
||||||
OperationListComponent,
|
OperationListComponent,
|
||||||
OperationDeleteModalComponent,
|
OperationDeleteModalComponent,
|
||||||
|
OperationFormComponent,
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
export class OperationModule {}
|
export class OperationModule {}
|
||||||
|
63
src/operations/operationForm.component.ts
Normal file
63
src/operations/operationForm.component.ts
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
// vim: set tw=80 ts=2 sw=2 sts=2 :
|
||||||
|
import { AfterViewChecked, Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
|
||||||
|
import { NgForm } from '@angular/forms';
|
||||||
|
|
||||||
|
import { Operation } from './operation';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'operation-form',
|
||||||
|
template: `
|
||||||
|
<form class="form-horizontal simple-form">
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-sm-4 control-label" for="operation-date">Date</label>
|
||||||
|
<div class="col-sm-8">
|
||||||
|
<input class="form-control" id="operation-date" name="operation_date"
|
||||||
|
type="text" [(ngModel)]="operation.operation_date"
|
||||||
|
[textMask]="{mask: dateMask}"
|
||||||
|
placeholder="Operation date">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-sm-4 control-label" for="label">Label</label>
|
||||||
|
<div class="col-sm-8">
|
||||||
|
<input class="form-control" id="label" name="label"
|
||||||
|
[(ngModel)]="operation.label" type="text" placeholder="Label">
|
||||||
|
</input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-sm-4 control-label" for="value">Montant</label>
|
||||||
|
<div class="col-sm-8">
|
||||||
|
<input class="form-control" id="value" name="value"
|
||||||
|
[(ngModel)]="operation.value" type="number" placeholder="Value">
|
||||||
|
</input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-sm-4 control-label" for="category">Catégorie</label>
|
||||||
|
<div class="col-sm-8">
|
||||||
|
<input class="form-control" id="category" name="category"
|
||||||
|
[(ngModel)]="operation.category" type="text" placeholder="Category">
|
||||||
|
</input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
`
|
||||||
|
})
|
||||||
|
export class OperationFormComponent implements AfterViewChecked {
|
||||||
|
@Input() operation: Operation;
|
||||||
|
@Output() onValid: EventEmitter<boolean> = new EventEmitter<boolean>();
|
||||||
|
@ViewChild('form') form: NgForm;
|
||||||
|
|
||||||
|
//dateMask = [/\d{4}/, '-', /0[1-9]|1[0-2]/, '-', /[0-2]\d|3[0-1]/];
|
||||||
|
dateMask = ['2', '0', /\d/, /\d/, '-', /[0-1]/, /\d/, '-', /[0-3]/, /\d/];
|
||||||
|
|
||||||
|
constructor() {}
|
||||||
|
|
||||||
|
ngAfterViewChecked() {
|
||||||
|
this.onValid.emit(this.form.form.valid);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user