Use fraction enum in squads module

static/src/app/squads/edit-squad/edit-squad.component.html

@@ -18,8 +18,8 @@
     <select id="fraction" name="fraction" class="form-control btn dropdown-toggle"
             required
             [(ngModel)]="squad.fraction">
-      <option value="OPFOR">CSAT</option>
+      <option value="OPFOR">{{fraction.OPFOR}}</option>
-      <option value="BLUFOR">NATO</option>
+      <option value="BLUFOR">{{fraction.BLUFOR}}</option>
     </select>
     <show-error text="Fraktion" path="fraction"></show-error>
   </div>

static/src/app/squads/edit-squad/edit-squad.component.ts

@@ -4,6 +4,7 @@ import {NgForm} from "@angular/forms";
 import {Squad} from "../../models/model-interfaces";
 import {SquadService} from "../../services/army-management/squad.service";
 import {Subscription} from "rxjs/Subscription";
+import {Fraction} from "../../utils/fraction.enum";
 
 
 @Component({
@@ -28,6 +29,8 @@ export class EditSquadComponent {
 
   @ViewChild(NgForm) form: NgForm;
 
+  readonly fraction = Fraction;
+
   constructor(private route: ActivatedRoute,
               private router: Router,
               private squadService: SquadService) {

static/src/app/squads/squad-list/squad-item.component.html

@@ -6,8 +6,8 @@
         <a>{{squad.name}}</a>
       </span>
       <br>
-      <small *ngIf="squad.fraction == 'OPFOR'">CSAT</small>
+      <small *ngIf="squad.fraction == 'OPFOR'">{{fraction.OPFOR}}</small>
-      <small *ngIf="squad.fraction == 'BLUFOR'">NATO</small>
+      <small *ngIf="squad.fraction == 'BLUFOR'">{{fraction.BLUFOR}}</small>
     </div>
 
     <div class="col-xs-4">

static/src/app/squads/squad-list/squad-item.component.ts

@@ -1,6 +1,6 @@
 import {ChangeDetectionStrategy, Component, EventEmitter} from "@angular/core";
-import {Router} from "@angular/router";
 import {Squad} from "../../models/model-interfaces";
+import {Fraction} from "../../utils/fraction.enum";
 
 @Component({
   selector: 'pjm-squad-item',
@@ -20,7 +20,9 @@ export class SquadItemComponent {
 
   imageSrc;
 
-  constructor(private router: Router) {
+  readonly fraction = Fraction;
+
+  constructor() {
   }
 
   ngOnInit() {

static/src/app/squads/squad-list/squad-list.component.html

@@ -1,8 +1,8 @@
 <div class="select-list">
   <div class="input-group list-header pull-left">
     <div class="btn-group" (click)="filterSquads()">
-      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="blufor" uncheckable>NATO</label>
+      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="blufor" uncheckable>{{fraction.BLUFOR}}</label>
-      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="opfor" uncheckable>CSAT</label>
+      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="opfor" uncheckable>{{fraction.OPFOR}}</label>
     </div>
     <a class="pull-right btn btn-success" (click)="openNewSquadForm()">+</a>
   </div>

static/src/app/squads/squad-list/squad-list.component.ts

@@ -6,6 +6,7 @@ import {ActivatedRoute, Router} from "@angular/router";
 import {Observable} from "rxjs/Observable";
 import {Squad} from "../../models/model-interfaces";
 import {SquadService} from "../../services/army-management/squad.service";
+import {Fraction} from "../../utils/fraction.enum";
 
 @Component({
   selector: 'squad-list',
@@ -22,6 +23,8 @@ export class SquadListComponent implements OnInit {
 
   public radioModel: string;
 
+  readonly fraction = Fraction;
+
   constructor(private squadService: SquadService,
               private router: Router,
               private route: ActivatedRoute,
@@ -58,7 +61,7 @@ export class SquadListComponent implements OnInit {
   }
 
   deleteSquad(squad) {
-    const fraction = squad.fraction === 'OPFOR' ? 'CSAT' : 'NATO';
+    const fraction = squad.fraction === 'OPFOR' ? Fraction.OPFOR : Fraction.BLUFOR;
     if (confirm('Soll das Squad "' + squad.name + '" (' + fraction + ') wirklich gelöscht werden?')) {
       this.squadService.deleteSquad(squad)
         .subscribe((res) => {