Use fraction enum in decoration module

static/src/app/decorations/decoration-list/decoration-item.component.html

@@ -6,8 +6,8 @@
         <a>{{decoration.name}}</a>
       </span>
       <br>
-      <small *ngIf="decoration.fraction == 'OPFOR'">CSAT</small>
+      <small *ngIf="decoration.fraction == 'OPFOR'">{{fraction.OPFOR}}</small>
-      <small *ngIf="decoration.fraction == 'BLUFOR'">NATO</small>
+      <small *ngIf="decoration.fraction == 'BLUFOR'">{{fraction.BLUFOR}}</small>
       <small *ngIf="decoration.fraction == 'GLOBAL'">Global</small>
       <small> - Sortierung: {{decoration.sortingNumber}}</small>
     </div>

static/src/app/decorations/decoration-list/decoration-item.component.ts

@@ -1,9 +1,9 @@
 import {ChangeDetectionStrategy, Component, EventEmitter} from "@angular/core";
-import {Router} from "@angular/router";
 import {Decoration} from "../../models/model-interfaces";
+import {Fraction} from "../../utils/fraction.enum";
 
 @Component({
-  selector: 'pjm-decoration-item',
+  selector: 'decoration-item',
   templateUrl: './decoration-item.component.html',
   styleUrls: ['./decoration-item.component.css', '../../style/list-entry.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -20,7 +20,9 @@ export class DecorationItemComponent {
   decorationSelected = new EventEmitter();
   decorationDelete = new EventEmitter();
 
-  constructor(private router: Router) {
+  readonly fraction = Fraction;
+
+  constructor() {
   }
 
   ngOnInit() {

static/src/app/decorations/decoration-list/decoration-list.component.html

@@ -1,9 +1,9 @@
 <div class="select-list">
   <div class="input-group list-header pull-left">
     <div class="btn-group" (click)="filterDecorations()">
-      <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>
-      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="global" uncheckable>Global</label>
+      <label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="GLOBAL" uncheckable>Global</label>
     </div>
     <a class="pull-right btn btn-success" (click)="openNewDecorationForm()">+</a>
   </div>
@@ -22,12 +22,12 @@
   </div>
 
   <div>
-    <pjm-decoration-item *ngFor="let decoration of decorations$ | async"
+    <decoration-item *ngFor="let decoration of decorations$ | async"
                          [decoration]="decoration"
                          (decorationDelete)="deleteDecoration(decoration)"
                          (decorationSelected)="selectDecoration($event)"
                          [selected]="decoration._id == selectedDecorationId">
-    </pjm-decoration-item>
+    </decoration-item>
   </div>
 
 </div>

static/src/app/decorations/decoration-list/decoration-list.component.ts

@@ -6,6 +6,7 @@ import {ActivatedRoute, Router} from "@angular/router";
 import {Observable} from "rxjs/Observable";
 import {Decoration} from "../../models/model-interfaces";
 import {DecorationService} from "../../services/army-management/decoration.service";
+import {Fraction} from "../../utils/fraction.enum";
 
 @Component({
   selector: 'decoration-list',
@@ -22,6 +23,8 @@ export class DecorationListComponent implements OnInit {
 
   public radioModel: string;
 
+  readonly fraction = Fraction;
+
   constructor(private decorationService: DecorationService,
               private router: Router,
               private route: ActivatedRoute,
@@ -29,7 +32,6 @@ export class DecorationListComponent implements OnInit {
   }
 
   ngOnInit() {
-
     this.decorations$ = this.decorationService.decorations$;
 
     const paramsStream = this.route.queryParams
@@ -44,7 +46,6 @@ export class DecorationListComponent implements OnInit {
       .distinctUntilChanged()
       .switchMap(query => this.decorationService.findDecorations(query, this.radioModel))
       .subscribe();
-
   }
 
   openNewDecorationForm() {
@@ -59,8 +60,8 @@ export class DecorationListComponent implements OnInit {
 
   deleteDecoration(decoration) {
     let fraction = 'Global';
-    if (decoration.fraction === 'BLUFOR') fraction = 'NATO';
+    if (decoration.fraction === 'BLUFOR') fraction = Fraction.BLUFOR;
-    else if (decoration.fraction === 'OPFOR') fraction = 'CSAT';
+    else if (decoration.fraction === 'OPFOR') fraction = Fraction.OPFOR;
 
     if (confirm('Soll die Auszeichnung "' + decoration.name + '" (' + fraction + ') wirklich gelöscht werden?')) {
       this.decorationService.deleteDecoration(decoration)

static/src/app/decorations/edit-decoration/edit-decoration.component.html

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

static/src/app/decorations/edit-decoration/edit-decoration.component.ts

@@ -4,6 +4,7 @@ import {NgForm} from "@angular/forms";
 import {Decoration} from "../../models/model-interfaces";
 import {DecorationService} from "../../services/army-management/decoration.service";
 import {Subscription} from "rxjs/Subscription";
+import {Fraction} from "../../utils/fraction.enum";
 
 @Component({
   templateUrl: './edit-decoration.component.html',
@@ -25,6 +26,8 @@ export class EditDecorationComponent {
 
   @ViewChild(NgForm) form: NgForm;
 
+  readonly fraction = Fraction;
+
   constructor(private route: ActivatedRoute,
               private router: Router,
               private decorationService: DecorationService) {