Add Operation Edit Modal component.

src/operations/operation.module.ts

@@ -16,6 +16,7 @@ import { OperationService } from './operation.service';
 import { OperationListComponent } from './operationList.component';
 import { OperationDeleteModalComponent } from './operationDeleteModal.component';
 import { OperationFormComponent } from './operationForm.component';
+import { OperationEditModalComponent } from './operationEditModal.component'
 
 export function $modalServiceFactory(i: any) {
   return i.get('$modal');
@@ -53,6 +54,7 @@ export function accountIdServiceFactory(i: any) {
     OperationListComponent,
     OperationDeleteModalComponent,
     OperationFormComponent,
+    OperationEditModalComponent,
   ],
   entryComponents: [
     BalanceChartComponent,
@@ -61,6 +63,7 @@ export function accountIdServiceFactory(i: any) {
     OperationListComponent,
     OperationDeleteModalComponent,
     OperationFormComponent,
+    OperationEditModalComponent,
   ]
 })
 export class OperationModule {}

src/operations/operationEditModal.component.ts

@@ -0,0 +1,53 @@
+// vim: set tw=80 ts=2 sw=2 sts=2:
+import { Component, Input } from '@angular/core';
+import { NgForm } from '@angular/forms';
+
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+
+import { Operation } from './operation';
+
+@Component({
+  selector: 'operation-edit-modal',
+  template: `
+<div class="modal-header">
+  <h3 class="modal-title" id="modal-title">{{ title() }}</h3>
+</div>
+
+<div class="modal-body" id="modal-body">
+  <operation-form [(operation)]="operation" (onValid)="valid=$event"></operation-form>
+</div>
+
+<div class="modal-footer">
+  <button class="btn btn-primary" [disabled]="!valid" (click)="submit()">
+    Save
+  </button>
+
+  <button class="btn btn-default" (click)="cancel()">
+    Cancel
+  </button>
+</div>
+  `
+})
+export class OperationEditModalComponent {
+  @Input() operation: Operation;
+
+  valid: boolean = false;
+
+  constructor(private activeModal: NgbActiveModal) {}
+
+  title(): string {
+    if(this.operation.id) {
+      return "Operation #" + this.operation.id;
+    } else {
+      return "New operation";
+    }
+  }
+
+  submit(): void {
+    this.activeModal.close(this.operation);
+  }
+
+  cancel(): void {
+    this.activeModal.dismiss("closed");
+  }
+}