From 296c89ce20ad38a013d2c627029326519188619f Mon Sep 17 00:00:00 2001
From: Alexis Lahouze <alexis@lahouze.org>
Date: Thu, 14 Jun 2018 11:54:35 +0200
Subject: [PATCH] Externalize operation list template.

---
 src/operations/operationList.component.html | 46 ++++++++++++++++++++
 src/operations/operationList.component.ts   | 47 +--------------------
 2 files changed, 47 insertions(+), 46 deletions(-)
 create mode 100644 src/operations/operationList.component.html

diff --git a/src/operations/operationList.component.html b/src/operations/operationList.component.html
new file mode 100644
index 0000000..c787c79
--- /dev/null
+++ b/src/operations/operationList.component.html
@@ -0,0 +1,46 @@
+<!-- vim: set tw=80 ts=2 sw=2 sts=2 : -->
+<div>
+  <div class="row">
+    <div class="col-md-8">
+      <balance-chart [account]="account"></balance-chart>
+    </div>
+
+    <div class="col-md-4">
+      <category-chart></category-chart>
+    </div>
+  </div>
+
+  <div class="row">
+    <table class="table table-striped table-condensed table-hover">
+      <thead>
+        <tr>
+          <th>#</th>
+          <th>Date d'op.</th>
+          <th>Libell&eacute; de l'op&eacute;ration</th>
+          <th>Montant</th>
+          <th>Solde</th>
+          <th>Cat&eacute;gorie</th>
+          <th>Actions</th>
+        </tr>
+      </thead>
+
+      <tbody>
+        <tr>
+          <td colspan="6">
+            <a class="btn btn-success"
+              [routerLink]="['new']">
+              Ajouter
+            </a>
+          </td>
+        </tr>
+
+        <tr [operation-row]="operation"
+          [account]="account"
+          (needsReload)="loadData()"
+          *ngFor="let operation of operations">
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+
diff --git a/src/operations/operationList.component.ts b/src/operations/operationList.component.ts
index befbb9a..8ee50a4 100644
--- a/src/operations/operationList.component.ts
+++ b/src/operations/operationList.component.ts
@@ -16,52 +16,7 @@ import { OperationService } from './operation.service';
 
 @Component({
   selector: 'operation-list',
-  template: `
-<div>
-  <div class="row">
-    <div class="col-md-8">
-      <balance-chart [account]="account"></balance-chart>
-    </div>
-
-    <div class="col-md-4">
-      <category-chart></category-chart>
-    </div>
-  </div>
-
-  <div class="row">
-    <table class="table table-striped table-condensed table-hover">
-      <thead>
-        <tr>
-          <th>#</th>
-          <th>Date d'op.</th>
-          <th>Libell&eacute; de l'op&eacute;ration</th>
-          <th>Montant</th>
-          <th>Solde</th>
-          <th>Cat&eacute;gorie</th>
-          <th>Actions</th>
-        </tr>
-      </thead>
-
-      <tbody>
-        <tr>
-          <td colspan="6">
-            <a class="btn btn-success"
-              [routerLink]="['new']">
-              Ajouter
-            </a>
-          </td>
-        </tr>
-
-        <tr [operation-row]="operation"
-          [account]="account"
-          (needsReload)="loadData()"
-          *ngFor="let operation of operations">
-        </tr>
-      </tbody>
-    </table>
-  </div>
-</div>
-    `
+  templateUrl: './operationList.component.html'
 })
 export class OperationListComponent implements OnInit {
   private account: Account;