89 lines
2.7 KiB
TypeScript
89 lines
2.7 KiB
TypeScript
import {Component, OnDestroy, OnInit} from '@angular/core';
|
|
import {ActivatedRoute, Router} from '@angular/router';
|
|
|
|
import {Fraction} from '../../utils/fraction.enum';
|
|
import {Decoration} from '../../models/model-interfaces';
|
|
import {DecorationService} from '../../services/army-management/decoration.service';
|
|
import {MatBottomSheet} from '@angular/material';
|
|
import {UserListSheetComponent} from '../user-list-sheet/user-list-sheet.component';
|
|
import {Location} from '@angular/common';
|
|
|
|
|
|
@Component({
|
|
selector: 'cc-decoration-overview',
|
|
templateUrl: './decoration-overview.component.html',
|
|
styleUrls: ['./decoration-overview.component.scss']
|
|
})
|
|
export class DecorationOverviewComponent implements OnInit, OnDestroy {
|
|
|
|
decorations: Decoration[];
|
|
|
|
medals: Decoration[];
|
|
|
|
ribbons: Decoration[];
|
|
|
|
active: string;
|
|
|
|
selectedType = 0;
|
|
|
|
readonly fraction = Fraction;
|
|
|
|
constructor(private router: Router,
|
|
private route: ActivatedRoute,
|
|
private location: Location,
|
|
private decorationService: DecorationService,
|
|
private bottomSheet: MatBottomSheet) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
// init decoration data
|
|
this.decorationService.findDecorations()
|
|
.subscribe(decorations => {
|
|
this.decorations = decorations;
|
|
const queryParams = this.route.snapshot.queryParams;
|
|
if (queryParams.type < 2) {
|
|
this.selectedType = queryParams.type;
|
|
}
|
|
|
|
const fract = queryParams.fraction;
|
|
if (fract && (fract === 'BLUFOR' || fract === 'OPFOR' || fract === 'GLOBAL')) {
|
|
this.switchFraction(queryParams.fraction);
|
|
} else {
|
|
this.switchFraction('BLUFOR');
|
|
}
|
|
});
|
|
};
|
|
|
|
ngOnDestroy() {
|
|
this.bottomSheet.dismiss();
|
|
}
|
|
|
|
switchFraction(value: any) {
|
|
this.medals = this.decorations.filter(d => d.fraction === value && d.isMedal);
|
|
this.ribbons = this.decorations.filter(d => d.fraction === value && !d.isMedal);
|
|
this.active = value;
|
|
this.adjustBrowserUrl(value)
|
|
}
|
|
|
|
switchTab(tabIndex) {
|
|
this.selectedType = tabIndex;
|
|
this.adjustBrowserUrl(this.active)
|
|
}
|
|
|
|
select(decoration: Decoration) {
|
|
this.bottomSheet.open(UserListSheetComponent, {data: {decoration: decoration}});
|
|
}
|
|
|
|
adjustBrowserUrl(fractionKey = '') {
|
|
const absoluteUrl = this.location.path().split('?')[0];
|
|
if (fractionKey === 'BLUFOR' && this.selectedType === 0) {
|
|
this.location.replaceState(absoluteUrl);
|
|
return;
|
|
}
|
|
const queryPart = fractionKey !== '' ? 'fraction='.concat(fractionKey)
|
|
.concat('&type=' + this.selectedType) : 'type=0';
|
|
|
|
this.location.replaceState(absoluteUrl, queryPart);
|
|
}
|
|
}
|