import { Component, OnInit } from "@angular/core";
import { Router, ActivatedRoute } from "@angular/router";

import { ComplementInfo } from "@app/models/investment-proposal-form";
import { FormInvestmentProposalService } from "@app/services/form-investment-proposal.service";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { CatalogsService } from "@app/services/catalogs.service";
import { IAngularMyDpOptions, IMyDateModel } from "angular-mydatepicker";
import { formatDate, DatePipe } from "@angular/common";
import { parse } from "date-fns";

@Component({
  selector: "app-complement-info",
  templateUrl: "./complement-info.component.html"
})
export class ComplementInfoComponent implements OnInit {
  title: string = "Formulario propuesta de inversión";
  complementInfo: ComplementInfo;
  form: any;

  // For daterange
  daysLabels: any = {
    su: "Dom",
    mo: "Lun",
    tu: "Mar",
    we: "Mie",
    th: "Jue",
    fr: "Vie",
    sa: "Sab"
  };
  monthsLabels: any = {
    1: "Ene",
    2: "Feb",
    3: "Mar",
    4: "Abr",
    5: "May",
    6: "Jun",
    7: "Jul",
    8: "Ago",
    9: "Sep",
    10: "Oct",
    11: "Nov",
    12: "Dic"
  };
  myDpOptions: IAngularMyDpOptions = {
    dateRange: false,
    dateFormat: "dd/mm/yyyy",
    dayLabels: this.daysLabels,
    monthLabels: this.monthsLabels
  };
  myDateInit: boolean = true;

  investmentProposalForm: FormGroup;
  submitted: boolean = false;
  role_number: any;
  markets: any;
  emitters: any;
  periodicities: any;
  rate_agencies: any;
  scores: any;
  investmentProposalID: string;
  countries: any;
  companies: any;
  format_incomes: any;
  operations: any;
  payment_terms: any;

  complementInfoExists: boolean;
  constructor(
    private router: Router,
    private route: ActivatedRoute,
    private formBuilder: FormBuilder,
    private formDataService: FormInvestmentProposalService,
    private catalogService: CatalogsService
  ) {}

  ngOnInit() {
    this.route.params.subscribe(params => {
      this.investmentProposalID = params["id"];
      console.log(params);
      console.log(this.investmentProposalID);
    });
    if (this.investmentProposalID == undefined)
      this.investmentProposalID = this.route.snapshot.queryParamMap.get("id");

    this.complementInfo = this.formDataService.getComplementInfo();
    this.complementInfoExists = this.complementInfo == undefined;

    this.catalogService.getCompanies().subscribe(res => {
      this.companies = res;
    });
    this.catalogService.getCountries().subscribe(res => {
      this.countries = res;
    });

    this.catalogService.getMarketTypes().subscribe(res => {
      this.markets = res;
    });
    this.catalogService.getEmitterTypes().subscribe(res => {
      this.emitters = res;
    });

    this.catalogService.getRateAgencies().subscribe(res => {
      this.rate_agencies = res;
    });

    this.catalogService.getScores().subscribe(res => {
      this.scores = res;
    });

    this.catalogService.getPaymentTerms().subscribe(res => {
      this.payment_terms = res;
    });

    this.catalogService.getOperationTypes().subscribe(res => {
      this.operations = res;
    });

    this.investmentProposalForm = this.formBuilder.group({
      tipo_mercado: [
        this.complementInfoExists ? "" : this.complementInfo.tipo_mercado,
        [Validators.required]
      ],

      emisores: [
        this.complementInfoExists ? "" : this.complementInfo.emisores,
        [Validators.required]
      ],
      empresa: [
        this.complementInfoExists ? "" : this.complementInfo.empresa,
        [Validators.required]
      ],
      pais: [
        this.complementInfoExists ? "" : this.complementInfo.pais,
        [Validators.required]
      ],
      plazo: [
        this.complementInfoExists ? "" : this.complementInfo.plazo,
        [Validators.required]
      ],
      operaciones: [
        this.complementInfoExists ? "" : this.complementInfo.operaciones,
        [Validators.required]
      ],

      comentarios: [
        this.complementInfoExists ? "" : this.complementInfo.comentarios,
        []
      ],
      justificacion: [
        this.complementInfoExists ? "" : this.complementInfo.justificacion,
        []
      ]
    });
    console.log(this.complementInfo);
  }

  get f() {
    return this.investmentProposalForm.controls;
  }

  save(form: any): boolean {
    //if (!form.valid) {
    //return false;
    //}
    console.log(this.investmentProposalForm.value);
    this.formDataService.setComplementInfo(this.investmentProposalForm.value);
    return true;
  }

  goToPrevious() {
    this.submitted = true;
    if (this.investmentProposalID != undefined) {
      this.router.navigate(["/investment-proposal/instrument-work"], {
        queryParams: { id: this.investmentProposalID }
      });
    } else {
      this.router.navigate(["/investment-proposal/instrument-work"]);
    }
  }

  goToNext(form: any) {
    this.submitted = true;

    if (this.save(form)) {
      if (this.investmentProposalID != undefined) {
        this.router.navigate(["/investment-proposal/result"], {
          queryParams: { id: this.investmentProposalID }
        });
      } else {
        this.router.navigate(["/investment-proposal/result"]);
      }
    }
  }
}