import { Component, OnInit } from '@angular/core';
import {Router} from '@angular/router';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {LocationService, UserService} from '@app/_services';
import {first} from 'rxjs/operators';
import {CustomErrorStateMatcher} from '@app/_helpers';

@Component({
  selector: 'app-create-account',
  templateUrl: './create-account.component.html',
  styleUrls: ['./create-account.component.scss']
})
export class CreateAccountComponent implements OnInit {
  createForm: FormGroup;
  matcher = new CustomErrorStateMatcher();
  submitted: boolean = false;
  locations: any;

  constructor(
    private formBuilder: FormBuilder,
    private router: Router,
    private userService: UserService,
    private locationService: LocationService
  ) { }

  ngOnInit(): void {
    this.createForm = this.formBuilder.group({
      accountType: ['', Validators.required],
      idNumber: ['', Validators.required],
      phoneNumber: ['', Validators.required],
      givenName: ['', Validators.required],
      surname: ['', Validators.required],
      directoryEntry: ['', Validators.required],
      location: ['', Validators.required],
      gender: ['', Validators.required],
      referrer: ['', Validators.required],
      businessCategory: ['', Validators.required]
    });
    this.locationService.getLocations();
    this.locationService.locationsSubject.subscribe(locations => {
      this.locations = locations;
    });
  }

  get createFormStub(): any { return this.createForm.controls; }

  onSubmit(): void {
    this.submitted = true;
    if (this.createForm.invalid) { return; }
    this.userService.createAccount(
      this.createFormStub.accountType.value,
      this.createFormStub.idNumber.value,
      this.createFormStub.phoneNumber.value,
      this.createFormStub.givenName.value,
      this.createFormStub.surname.value,
      this.createFormStub.directoryEntry.value,
      this.createFormStub.location.value,
      this.createFormStub.gender.value,
      this.createFormStub.referrer.value,
      this.createFormStub.businessCategory.value,
    ).pipe(first()).subscribe(res => {
      console.log(res);
    });
    // this.router.navigateByUrl(`/accounts`);
    this.submitted = false;
  }
}