import { Component, OnInit, ViewChild } from '@angular/core';
import { LocalStorage } from '../../core/services/local_storage.service';
import { HyperService } from '../../core/services/http.service';
import { Router, ActivatedRoute } from '@angular/router';
import * as moment from 'moment';
import { Location,DatePipe } from '@angular/common';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { DatepickerOptions } from 'ng2-datepicker';
import { DomSanitizer, SafeResourceUrl, SafeUrl } from '@angular/platform-browser';

@Component({
  selector: 'app-ilearn-reports',
  templateUrl: './ilearn-reports.component.html',
  styleUrls: ['./ilearn-reports.component.scss']
})
export class IlearnReportsComponent implements OnInit {
  excel_load: boolean=false;
  type: any;
  export_url: any;
  startdate:any="";
  enddate:any="";
  today=new Date();
  year = this.today.getFullYear();
  month = this.today.getMonth()+1;
  day = this.today.getDate();

  options_start: DatepickerOptions = {
        minYear: 2010,
        maxYear: 2025,
        displayFormat: 'DD-MM-YYYY',
     //   barTitleFormat: 'MMMM YYYY',
        dayNamesFormat: 'dd',
        firstCalendarDay: 0, // 0 - Sunday, 1 - Monday
        minDate: new Date("Sun Dec 31 1899 17:58:53 GMT+0530 (India Standard Time)"), // Minimal selectable date
        maxDate: new Date(Date.now())  // Maximal selectable date
        //barTitleIfEmpty: 'Click to select a date',
  }
  options_end: DatepickerOptions = {
        minYear: 2010,
        maxYear: 2025,
        displayFormat: 'DD-MM-YYYY',
     //   barTitleFormat: 'MMMM YYYY',
        dayNamesFormat: 'dd',
        firstCalendarDay: 0, // 0 - Sunday, 1 - Monday
        minDate: new Date(Date.now()), // Minimal selectable date
        maxDate: new Date(Date.now())  // Maximal selectable date
      // barTitleIfEmpty: 'Click to select a date',
  }
  constructor(private server: HyperService,private formBuilder: FormBuilder,private router: Router, private route: ActivatedRoute,private _location: Location,public datepipe: DatePipe,private sanitizer: DomSanitizer) { }

  ngOnInit() {
    console.log("this.day-->",this.day)
    this.startdate=this.month+"-"+this.day+"-"+this.year;
    this.enddate=this.month+"-"+this.day+"-"+this.year;

  }
  //==Change From Date==
  changestartdate(tempvalue){
    this.options_end={
      minYear: 2010,
      maxYear: 2025,
      displayFormat: 'DD-MM-YYYY',
     //   barTitleFormat: 'MMMM YYYY',
      dayNamesFormat: 'dd',
      firstCalendarDay: 0, // 0 - Sunday, 1 - Monday
      minDate: new Date(tempvalue), // Minimal selectable date
      maxDate: new Date(Date.now()),  // Maximal selectable date
    }
  }
  //=
  changeenddate(tempvalue){
    if((this.startdate=='')||(this.startdate==undefined)){
     // alert("Please select the from date ");
      this.enddate='';
     // return false;
    }else{

    }
  }
  //==
  getExcel(){
    if((this.startdate =='')||(this.startdate ==undefined)&&(this.enddate =='')||(this.enddate ==undefined)){
      alert("Please select the from date and the end date");
      return false;
    }else{
      let from_date=this.datepipe.transform(this.startdate, 'yyyy-MM-dd');
      let end_date=this.datepipe.transform(this.enddate, 'yyyy-MM-dd');
      this.server.post("managerexport/ilearnreport", {
        fromdate:from_date,
        todate:end_date
      })
          .then((data) => {
              if (data.status == 200) {
              this.excel_load=true;
              this.export_url = (data.result.data);
              setTimeout(() => this.export_url = "", 1000);
              this.excelExport();
            } else {
              alert("error");
            }
          });
    }
    
  }
  //==
  excelExport() {
    return this.sanitizer.bypassSecurityTrustResourceUrl(this.export_url);
  }

}
