import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Tab1Service } from '../tab1/tab1.service';
import { Router } from '@angular/router';
import { Eventoi } from '../interfaces/eventoi';
import { DatePipe } from '@angular/common'
import { ViewEventoPageRoutingModule } from '../view-evento/view-evento-routing.module';

@Component({
  selector: 'app-prompt-evento',
  templateUrl: './prompt-evento.page.html',
  styleUrls: ['./prompt-evento.page.scss'],
})
export class PromptEventoPage implements OnInit{
  submitted = false;
  editarEvento = false;
  eventoForm = new FormGroup({
      nombre: new FormControl(null, Validators.required),
      fecha: new FormControl(null, Validators.required),
      hora: new FormControl(null, Validators.required),
      precio1: new FormControl(null, Validators.required),
      precio2: new FormControl(null, Validators.required),
      descripcion: new FormControl(null, Validators.required),
  });

  eventos: Eventoi[];

  constructor(private tab1Service: Tab1Service, private router: Router) {

   }
  
   ngOnInit(){
    if (this.tab1Service.editarEvento==true){
      this.eventoForm = this.tab1Service.eventoForms[this.tab1Service.eventoIndex];
    }
  }
  onSubmit(){
    this.submitted = true;
    if (this.eventoForm.valid){
      this.asignarEvento(this.tab1Service.eventos[this.tab1Service.eventoIndex]);
    }
  }
  asignarEvento(evento: Eventoi){
    evento.nombre = this.eventoForm.get('nombre').value;
    evento.descripcion = this.eventoForm.get('descripcion').value;
    var fecha = this.eventoForm.get('fecha').value;
    fecha = fecha.split("T")[0];
    evento.fecha = fecha;
    var hora = this.eventoForm.get('hora').value;
    if (!this.tab1Service.editarEvento){
      hora = hora.split("T")[1];}
    hora = hora.split(":")[0]+(":")+hora.split(":")[1];
    console.log(hora);
    evento.hora = hora;
    evento.precio1 = this.eventoForm.get('precio1').value;
    evento.precio2 = this.eventoForm.get('precio2').value;
    if (!this.tab1Service.eventos){
      this.tab1Service.eventos=[];}
    if(!this.tab1Service.eventoForms){
      this.tab1Service.initEventoForms();}
    this.tab1Service.postEvento(evento);
    }
    
  get nombre(){
    return this.eventoForm.get('nombre');
  }

  get fecha(){
    return this.eventoForm.get('fecha');
  }

  get hora(){
    return this.eventoForm.get('hora');
  }

  get precio1() {
    return this.eventoForm.get('precio1');
  }

  get precio2() {
    return this.eventoForm.get('precio2');
  }

  get descripcion(){
    return this.eventoForm.get('descripcion');
  }


}
