opt-cc/static/src/app/users/edit-user/edit-user.component.ts

import {Component, ViewChild} from "@angular/core";
import {ActivatedRoute, Router} from "@angular/router";
import {Rank, Squad, User} from "../../models/model-interfaces";
import {UserService} from "../../services/user-service/user.service";
import {SquadService} from "../../services/squad-service/squad.service";
import {RankService} from "../../services/rank-service/rank.service";
import {Subscription} from "rxjs";
import {NgForm} from "@angular/forms";


@Component({
  templateUrl: './edit-user.component.html',
  styleUrls: ['./edit-user.component.css', '../../style/entry-form.css'],
})
export class EditUserComponent {

  @ViewChild(NgForm) form: NgForm;

  subscription: Subscription;

  user: User = {username: '', squad: '0', rank: {level: 0}};

  squads: Squad[] = [];

  ranks: Rank[] = [];

  showSuccessLabel = false;

  ranksDisplay = 'none';

  constructor(private router: Router,
              private route: ActivatedRoute,
              private userService: UserService,
              private squadService: SquadService,
              private rankService: RankService) {
  }

  ngOnInit() {

    this.subscription = this.route.params
      .map(params => params['id'])
      .filter(id => id != undefined)
      .flatMap(id => this.userService.getUser(id))
      .subscribe(user => {
        if (!user.squad) {
          user.squad = "0";
          this.ranksDisplay = 'none';
        } else {
          this.rankService.findRanks('', user.squad.fraction).subscribe(ranks => {
            this.ranks = ranks;
            this.ranksDisplay = 'block';
          });
        }
        this.user = user;
      });

    this.squadService.findSquads().subscribe(squads => {
      this.squads = squads;
    });
  }

  toggleRanks() {
    if (this.user.squad != '0') {
      this.rankService.findRanks('', this.user.squad.fraction).subscribe(
        ranks => {
          this.ranks = ranks;
          this.ranksDisplay = 'block';
        }
      );
    } else {
      this.ranksDisplay = 'none';
    }
  }

  saveUser(rankLevel) {
    const updateObject = {
      _id: this.user._id,
      username: this.user.username,
      rankLvl: rankLevel,
      squadId: null
    };
    if (this.user.squad._id !== '0') {
      updateObject.squadId = this.user.squad._id
    }

    if (this.user._id) {
      this.userService.updateUser(updateObject)
        .subscribe(user => {
          if (!user.squad) {
            user.squad = '0';
          }
          this.user = user;
          this.showSuccessLabel = true;
          setTimeout(() => {
            this.showSuccessLabel = false;
          }, 2000)
        })
    } else {
      this.userService.submitUser(updateObject)
        .subscribe(user => {
          this.router.navigate(['..'], {relativeTo: this.route});
          return true;
        })
    }
  }

  cancel() {
    this.router.navigate([this.user._id ? '../..' : '..'], {relativeTo: this.route});
    return false;
  }

  /**
   * compare ngValue with ngModel to assign selected element
   */
  equals(o1: Squad, o2: Squad) {
    if (o1 && o2) {
      return o1._id === o2._id;
    }
  }

}