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

84 lines
2.6 KiB
TypeScript

import {Component, OnInit} from '@angular/core';
import {Location} from '@angular/common';
import {FormControl} from '@angular/forms';
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',
templateUrl: './squad-list.component.html',
styleUrls: ['./squad-list.component.css', '../../style/select-list.css']
})
export class SquadListComponent implements OnInit {
selectedSquadId: string | number = null;
squads$: Observable<Squad[]>;
searchTerm = new FormControl();
public radioModel: string;
readonly fraction = Fraction;
constructor(private squadService: SquadService,
private router: Router,
private route: ActivatedRoute,
private location: Location) {
}
ngOnInit() {
this.squads$ = this.squadService.squads$;
const paramsStream = this.route.queryParams
.map(params => decodeURI(params['query'] || ''))
.do(query => this.searchTerm.setValue(query));
const searchTermStream = this.searchTerm.valueChanges
.debounceTime(400)
.do(query => this.adjustBrowserUrl(query));
Observable.merge(paramsStream, searchTermStream)
.distinctUntilChanged()
.switchMap(query => this.squadService.findSquads(query, this.radioModel))
.subscribe();
}
openNewSquadForm() {
this.selectedSquadId = null;
this.router.navigate([{outlets: {'right': ['new']}}], {relativeTo: this.route});
}
selectSquad(squadId: string | number) {
this.selectedSquadId = squadId;
this.router.navigate([{outlets: {'right': ['edit', squadId]}}], {relativeTo: this.route});
}
deleteSquad(squad) {
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) => {
})
}
}
filterSquads() {
this.squads$ = this.squadService.findSquads(this.searchTerm.value, this.radioModel);
}
adjustBrowserUrl(queryString = '') {
const absoluteUrl = this.location.path().split('?')[0];
const queryPart = queryString !== '' ? `query=${queryString}` : '';
this.location.replaceState(absoluteUrl, queryPart);
}
}