import { Component, OnInit, ViewChild } from "@angular/core";
import { Router } from "@angular/router";
import { RequestService } from "../../services/request.service";
import { UtilsService } from "../../services/utils.service";
import { IonContent, Config, NavController } from "@ionic/angular";
import { TranslateService } from "@ngx-translate/core";
import { HomeService } from "../../services/home.service";
import { ActivatedRoute } from "@angular/router";
import { Location } from '@angular/common';

@Component({
  selector: "page-request",
  templateUrl: "request.html",
  styleUrls: ["./request.scss"],
})
export class RequestPage implements OnInit {
  @ViewChild(IonContent, { static: true }) content: IonContent;
  ios: boolean;
  startDate = new Date(1990, 0, 1);
  formInfo: any = [];
  multiselectValues = {};

  //
  currentDate: any;
  currentYear: any;
  dateFull: any;
  nameControl: any = [];
  optionsControl: any = [];
  form_id: any;
  constructor(
    public homeProvider: HomeService,
    public router: Router,
    public requestService: RequestService,
    public utilsService: UtilsService,
    public config: Config,
    private translate: TranslateService,
    private route: ActivatedRoute,
    public navCtrl: NavController,
    private location: Location
  ) { }

  ngOnInit() {
    this.form_id = this.route.snapshot.paramMap.get("form_id");
    this.getForm(this.form_id);

    this.ios = this.config.get("mode") === "ios";
    this.currentDate = this.utilsService.currentDateToISOString(this.utilsService.currentDate());
    this.currentYear = new Date().getFullYear();
    this.dateFull = this.currentDate.substring(0, 10);
  }

  getForm(form_id, event?) {
    this.requestService.getForm(form_id).then((getForm) => {
      this.formInfo = getForm["data"];
      if (this.formInfo.fields.length) {
        for (let i = 0; i < this.formInfo.fields.length; i++) {
          let field = this.formInfo.fields[i];
          if (field.field_value_id && field.field_value.name == "current_date") {
            this.nameControl.push(this.currentDate);
          } else if (field.field_input.name == "select") {
            if (field.field_value_id) {
              this.nameControl.push(field.field_value.value);
            } else {
              this.nameControl.push(null);
            }
            if (field.field_datasource.type == "service") {
              this.requestService
                .getOptionsSelects(field.field_datasource.url)
                .then((options) => {
                  this.optionsControl[i] = options["data"];
                })
                .catch((error) => {
                  console.log("error getOptionsSelects: ", error);
                });
            } else {
              this.optionsControl[i] = field.field_datasource.main_datasource.manual_datasources;
            }
          } else {
            this.nameControl.push(null);
          }
        }
      }
      if (event) {
        event.target.complete();
      }
    })
      .catch((error) => {
        console.log("error getForm: ", error);
      });
  }

  changeCheckbox(field, index) { }

  changeInput(field, index) { }

  removeScale(index, field) {
    let currentValue = this.nameControl[index] ? parseFloat(this.nameControl[index]) : 0;
    let currentSum = currentValue - parseFloat(field.scale);
    if (field.min && field.min > currentSum) {
      return;
    }
    if (currentSum % 1 != 0) {
      this.nameControl[index] = currentSum.toFixed(2);
    } else {
      this.nameControl[index] = currentSum;
    }
  }

  addScale(index, field) {
    let currentValue = this.nameControl[index] ? parseFloat(this.nameControl[index]) : 0;
    let currentSum = currentValue + parseFloat(field.scale);
    if (field.max && field.max < currentSum) {
      return;
    }
    if (currentSum % 1 != 0) {
      this.nameControl[index] = currentSum.toFixed(2);
    } else {
      this.nameControl[index] = currentSum;
    }
  }

  multiselectDataRegister(option, name_control,event) {

    if (!this.multiselectValues[name_control]) {
      this.multiselectValues[name_control] = [];
    }

    let checked = event.target.checked;

    if (checked && !this.multiselectValues[name_control].includes(option.value)) {
      this.multiselectValues[name_control].push(option.value);
    }

    if (!checked){
      this.multiselectValues[name_control].splice(this.multiselectValues[name_control].indexOf(option.value), 1);
    }
  }

  createRequest(form) {
    for (key in this.multiselectValues) {
      if(this.multiselectValues.hasOwnProperty(key)){
        form.value[key] = this.multiselectValues[key];
      }
    }
   
    for (let i = 0; i < this.formInfo.fields.length; i++) {
      const field = this.formInfo.fields[i];
      if (field.required && this.nameControl[i] == null) {
        this.utilsService.presentToast(
          "3000",
          "warning",
          "top",
          this.translate.instant("FIELD_REQUIRED", {
            field: field.name,
          })
        );
        return;
      }
    }

    let specific_data = [];
    for (var j in form.value) {
      var key = j;
      var val = form.value[j];
      let item = this.formInfo.fields.find((field) => field.name_control == key);
      if (item.field_input_id == 2 || item.field_input_id == 10) {
        if (val) {
          val = "Si";
        } else {
          val = "No";
        }
      }
      if (val == null) {
        val = "";
      }
      if (item) {
        let current_fiel = {
          field_id: item.id,
          value: val,
          is_multiple: item.multiple,
        };
        specific_data.push(current_fiel);
      }
    }
    let data = {
      form_id: this.form_id,
      specific_data,
    };

    this.requestService
      .createRequest(data)
      .then((reps) => {
        if (reps["status"]) {
          this.location.back();
        }
      })
      .catch((error) => {
        console.log("error createRequest: ", error);
      });
  }

}