Covid-app/src/app/loggin/loggin.page.ts

import { Component, OnInit, ViewChild } from '@angular/core';
import { NgForm } from '@angular/forms';
import { NavController, LoadingController } from '@ionic/angular';
import { AuthService } from '../services/auth.service';
import { HttpErrorResponse } from '@angular/common/http';
import { Router } from '@angular/router';
import { AlertController } from '@ionic/angular';

@Component({
  selector: 'app-loggin',
  templateUrl: './loggin.page.html',
  styleUrls: ['./loggin.page.scss'],
})
export class LogginPage implements OnInit {
  @ViewChild(NgForm, {static: true}) ngForm: NgForm;
  errorMessage = null;
  data = {cuenta: null, password: null, carer:null};
  constructor(private auth: AuthService,
              private loading: LoadingController,
              private nav: NavController,
              public router : Router,
              public alertController: AlertController) { }

  ngOnInit() {
  }
  carreras = [
    {code:20321,name: "Actuaría",isChecked:false},
    {code:20121,name: "Arquitectura",isChecked:false},
    {code:20422,name: "Ciencias Políticas y Administración Pública",isChecked:false},
    {code:20425,name: "Comunicación",isChecked:false},
    {code:20721,name: "Derecho",isChecked:false},
    {code:20226,name: "Diseño Gráfico",isChecked:false},
    {code:20821,name: "Economía",isChecked:false},
    {code:24121,name: "Enseñanza del Inglés",isChecked:false},
    {code:21011,name: "Filosofía",isChecked:false},
    {code:21021,name: "Historia",isChecked:false},
    {code:21121,name: "Ingeniería Civil",isChecked:false},
    {code:21013,name: "Lengua y Literaturas Hispánicas",isChecked:false},
    {code:24022,name: "Matemáticas Aplicadas y Computación",isChecked:false},
    {code:21025,name: "Pedagogía",isChecked:false},
    {code:20421,name: "Relaciones Internacionales",isChecked:false},
    {code:20423,name: "Sociología",isChecked:false}
  ];
  
  login() {
    if (this.ngForm.invalid) {
      this.errorMessage = 'Complete el formulario';
      return;
    }
    localStorage.setItem('carer', this.data.carer);
    this.startLoading()
    .then(async _ =>  {await new Promise(r => setTimeout(r, 2000)); console.log("Data", this.data.cuenta, " ,", this.data.password)})
    .then(_ => this.auth.signup(this.data).toPromise())
    .then(success => this.handleSuccess(success), error => this.handleError(error))
    .finally(() => this.stopoading());
  }
  async startLoading(): Promise<void>  {
    const loading = await this.loading.create({
      message: '',
      translucent: true,
      cssClass: 'custom-loading'
    });
    return await loading.present();
  }

  async stopoading(): Promise<void> {
    this.loading.dismiss();
    
  }

  handleSuccess(response) {
    this.routeDirector(response);
    this.errorMessage = null;
  }

  handleError(errorResponse: HttpErrorResponse) {
    console.error(errorResponse.error);

    switch (errorResponse.error.message) {
      case 'Bad credentials':
        this.errorMessage = 'El usuario o la contraseña son inválidos';
        this.presentAlertErrores('El usuario o la contraseña son inválidos')
        break;
      default:
        this.presentAlertErrores(errorResponse.error.message)
        this.errorMessage = 'Intentelo de nuevo más tarde.';
        if (errorResponse.error.message) {
          this.errorMessage = this.errorMessage + ` [${errorResponse.error.message}]`;
        } else {
          this.errorMessage = this.errorMessage + ` [${errorResponse.message}]`;
        }
    }
  }

  routeDirector(userRole){
    console.log(userRole.details.authorities)
    if(userRole.details.authorities[0]==="ROLE_USER"){
      this.nav.navigateForward('/tabs/user');
    } else if (userRole.details.authorities[0]==="ROLE_SECRETARY"){
      this.nav.navigateForward('/admintabs');
    } else if (userRole.details.authorities[0]==="ROLE_ADMIN"){
      this.nav.navigateForward('/admin');
    }
  }

  onGoToNextPage(data){ 
    if(data.details.authorities[0]=== "ROLE_USER"){
      this.router.navigate(['/tabs/user'],{
      queryParams: {
         value : JSON.stringify(data)
        },
      });
    } else if (data.details.authorities[0]=== "ROLE_SECRETARY"){
      this.router.navigate(['/admintabs'],{
        queryParams: {
           value : JSON.stringify(data)
          },
        });
    } else if (data.details.authorities[0]=== "ROLE_ADMIN"){
      this.router.navigate(['/admin'],{
        queryParams: {
           value : JSON.stringify(data)
          },
        });
    }
  }

  async presentAlertCredenciales() {
    const alert = await this.alertController.create({
      cssClass: 'my-custom-class',
      header: 'Atención',
      subHeader: 'Recuerda',
      message: 'Para ingresar deberás utilizar las mismas credenciales que usas en servicios escolares.',
      buttons: ['OK']
    });
  }
  async presentAlertErrores(message) {
    const alert = await this.alertController.create({
      cssClass: 'my-custom-class',
      header: 'Atención',
      message: message,
      buttons: ['OK']
    });
  }
}