import {Component, Inject, OnInit} from "@angular/core";
import {HttpClient} from "@angular/common/http";
import {ReplaySubject} from "rxjs";
import {MatSnackBar} from "@angular/material/snack-bar";
import {PersonService} from "./person/person.service";
import {Router} from "@angular/router";
import {RxStompService} from "@stomp/ng2-stompjs";
import {MatDialog, MatDialogRef} from "@angular/material/dialog";
import {PersonDebitDialogComponent} from "./person/person.page.component";

@Component({
  selector: 'app-login',
  templateUrl: 'app.login.component.html',
})
export class AppLoginComponent implements OnInit {

  public qr: ReplaySubject<QrResponse>
  public code: string
  public valid: number = null;

  constructor(private personService: PersonService, private router: Router, private httpClient: HttpClient, private snackBar: MatSnackBar, private rxStompService: RxStompService, @Inject("_") public _: any, private matDialog: MatDialog) {
    this.qr = new ReplaySubject<QrResponse>();
  }

  ngOnInit(): void {
    this.qr = new ReplaySubject<QrResponse>();
    this.personService.getCurrentPerson().subscribe(person => this.httpClient.get("/api/new/person/qr", {params: {siteId: person.siteId}}).subscribe((res: QrResponse) => this.qr.next(res), error => this.snackBar.open("Ошибка получения данных")));
  }

  checkCode(c: String) {
    if (c && c.length == 6) {
      this.qr.subscribe(qrRes => {
        this.personService.getCurrentPerson().subscribe(person => {
          this.httpClient.post("/api/new/person/check6", {siteId: person.siteId, code: c, key: qrRes.key}).subscribe((res: QrSixResponse) => {
            this.valid = res.ok ? 1 : 0;
            if (res.ok) {
              this.personService.setCurrentPerson(res.token)
              this.router.navigateByUrl("/personal")
            }
          })
        })
      })
    }
    this.valid = null
  }

  showRecoverDialog() {
    let ref = this.matDialog.open(AppLoginRecoverDialogComponent, {
      width: '360px', height: '300px'
    })
  }
}

@Component({
  selector: "app-login-recover-dialog",
  templateUrl: "app.login.recover.dialog.component.html"
})
export class AppLoginRecoverDialogComponent {

  codeMask = [/[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, '-', /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, '-', /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, '-', /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/, /[0-9a-zA-Z]/]
  code: string
  siteId: string
  num: number
  valid: number = null;

  constructor(private dialogRef: MatDialogRef<PersonDebitDialogComponent>, private personService: PersonService, private httpClient: HttpClient, @Inject("_") public _: any) {
    this.siteId = personService.getSiteId();
    this.num = Math.round(1 + 15 * Math.random())
  }

  onCodeChange(e) {
    this.valid = null
  }

  sendRecoverCode() {
    this.httpClient.post(`/api/new/person/check16`, {num: this.num, siteId: this.siteId, code: this.code}).subscribe(res => {
      this.valid = 1;
    }, err => {
      this.valid = 0;
    })
  }

}

export class QrSixResponse {
  public ok: boolean
  public register: boolean
  public token: string
}

export class QrResponse {
  public key: string
  public img: string
}
