import { HttpClient } from '@angular/common/http';
import { NgxSpinnerService } from 'ngx-spinner';
import { ActivatedRoute, Params } from '@angular/router';
import { Location } from '@angular/common';
import { AuthServiceService } from './../../../shared/auth-service.service';
import { ToastrService } from 'ngx-toastr';
import { DashboardService } from './../../../shared/dashboard.service';
import { Component, OnInit, ViewChild } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-unit-information-add',
  templateUrl: './unit-information-add.component.html',
  styleUrls: ['./unit-information-add.component.css']
})
export class UnitInformationAddComponent implements OnInit {

  constructor(
    private dashBoardSer: DashboardService,
    private toastr: ToastrService,
    public authSer: AuthServiceService,
    private route: ActivatedRoute,
    private spinner: NgxSpinnerService,
    private location: Location,
    private http: HttpClient
  ) { }

  @ViewChild('f') unitInfoForm : NgForm;

  typePage: string = '';
  locations =[];
  amount = [];
  Amount  = 0;
  show_amount = false;
  complex_list =[];
  building_types=[];
  valueType: string = '';
  checkSaveclick:boolean = false;
  check : boolean = false;
  isEdit: boolean = false;
  editPageId: number;
  showTypes = false;


  formData = {
    housing_complex_id:'',
    building_type_id:'',
    building_number:'',
    building_code:'',
    building_name: '',
    building_units:'',
    building_property:'',
    status: '1',
  }


  ngOnInit() {

    this.route.params.subscribe(
      (params: Params) => {
        this.editPageId = +params['listPageEditId'];
        console.log(this.editPageId);
      }
    );
    
    this.http.get(this.authSer.pathApi + '/housing_complexes_list').subscribe(
      res => {
        console.log(res);
        this.complex_list = res[('housing_complexes')];
      }
    );
    

    if (this.editPageId) {
      this.spinner.show();
      this.isEdit = true;
      this.show_amount = true;
      this.showTypes = true;
      this.typePage = 'تعديل';
      this.dashBoardSer.getItemData(this.editPageId, 'unitInformation' ).subscribe(
        res => {
          console.log('ssss', res);
          this.formData.housing_complex_id = res['building_information'].housing_complex_id;
          this.getBuildingsType(this.formData.housing_complex_id);
          this.formData.building_type_id = res['building_information'].building_type_id;
          this.formData.building_number = res['building_information'].building_number;
          // console.log('xxf',this.formData.building_type_id);        
          this.formData.building_code = res['building_information'].building_code;
          this.formData.building_name = res['building_information'].building_name;
          this.formData.building_units = res['building_information'].building_units;
          this.formData.building_property = res['building_information'].building_property;
          this.formData.status  = res['building_information'].status;
          this.spinner.hide();
          },
      
        err => {
          console.log(err);
        }
      );
     
    }else {
      this.typePage = 'اضافة';
    }


  }


  //get building list
  getBuildingsType(event){
    console.log(event);
    this.showTypes = true;
    const id = event;
  
    this.http.get(this.authSer.pathApi + '/building_types_list/' + id ).subscribe(
      res => {
        this.building_types = res['building_types'];
        console.log('building types' , this.building_types);
        if(this.editPageId) {
          this.typeNumber(this.formData.building_type_id);
        }
      },
      err => {
        console.log(err);
      }
    );
  } 

   typeNumber(event){
    this.show_amount = true;
    const id = event;
    //alert(id);
    //alert(this.building_types.length);
      
    for (let i = 0; i < this.building_types.length; i++) {
      if(id == this.building_types[i].id)
      { console.log('sssls',this.formData.building_type_id);
        this.amount = this.building_types[i].empty_ids; 
        this.amount.push(this.formData.building_number);
        console.log(this.amount);
        
      } 
    } 

  }

    onSubmitted(){
      this.checkSaveclick = true;
      console.log('HERE',this.unitInfoForm.value);
      if(this.editPageId) {
        this.dashBoardSer.editItem(this.editPageId, this.unitInfoForm.value, 'unitsInformation').subscribe(
          res => {
            console.log(res);
            this.toastr.success('تم التعديل بنجاح');
            this.location.back();
          },
          err => {
            console.log(err);
            this.toastr.error('خطأ في الخادم ، رجاء المحارله لاحقا');
          }
        )
      } else {
        this.dashBoardSer.addItem( this.unitInfoForm.value , 'unitsInformation').subscribe(
          res => {
            console.log('ADD',res);
            this.toastr.success('تم الإضافه بنجاح');
            this.checkSaveclick = false;
            this.location.back();
          },
          err => {
            console.log(err);
            this.checkSaveclick = false;
            this.toastr.error('خطأ في الخادم ، حاول لاحقا');
          }
        );
        }
    }
    
  }

