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

import {Component, OnInit} from '@angular/core';

import {FormControl} from '@angular/forms';
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';
import {MatButtonToggleGroup} from '@angular/material';
import {UIHelpers} from '../../utils/global.helpers';

@Component({
  selector: 'decoration-list',
  templateUrl: './decoration-list.component.html',
  styleUrls: ['./decoration-list.component.css', '../../style/select-list.css']
})
export class DecorationListComponent implements OnInit {

  selectedDecorationId: string | number = null;

  decorations$: Observable<Decoration[]>;

  searchTerm = new FormControl();

  radioModel = '';

  readonly fraction = Fraction;

  constructor(private decorationService: DecorationService,
              private router: Router,
              private route: ActivatedRoute) {
  }

  ngOnInit() {
    this.decorations$ = this.decorationService.decorations$;
  }

  initObservable(observables: any) {
    Observable.merge(observables.params as Observable<string>, observables.searchTerm)
              .distinctUntilChanged()
              .switchMap(query => this.decorationService.findDecorations(query, this.radioModel))
              .subscribe();
  }

  openNewDecorationForm() {
    this.selectedDecorationId = null;
    this.router.navigate([{outlets: {'right': ['new']}}], {relativeTo: this.route});
  }

  selectDecoration(decorationId: string | number) {
    this.selectedDecorationId = decorationId;
    this.router.navigate([{outlets: {'right': ['edit', decorationId]}}], {relativeTo: this.route});
  }

  deleteDecoration(decoration) {
    let fraction = 'Global';
    if (decoration.fraction === 'BLUFOR') {
      fraction = Fraction.BLUFOR;
    } else if (decoration.fraction === 'OPFOR') {
      fraction = Fraction.OPFOR;
    }

    if (confirm('Soll die Auszeichnung "' + decoration.name + '" (' + fraction + ') wirklich gelöscht werden?')) {
      this.decorationService.deleteDecoration(decoration)
          .subscribe((res) => {
          });
    }
  }

  filterDecorations(group?: MatButtonToggleGroup) {
    this.radioModel = UIHelpers.toggleReleaseButton(this.radioModel, group);
    this.decorations$ = this.decorationService.findDecorations(this.searchTerm.value, this.radioModel);
  }
}