ADAM / AIAHTML5

import { Component, OnInit, ViewChild,HostListener } from '@angular/core';
import { Router } from '@angular/router';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
//import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/filter';
import { ImageExportReports } from '../reports/reportdatamodel';
import { ReportService } from '../reports/report.service';
import { GlobalService } from '../../shared/global';
import { BsModalService } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
import { DatePipe } from '@angular/common';
import { BsDatepickerModule, BsDatepickerConfig } from 'ngx-bootstrap';
import { Http, Response } from '@angular/http';
import { LoadingService } from '../../shared/loading.service';
import { PagerComponent } from '../../shared/pager/pager.component';
import { ConfirmService } from '../../shared/confirm/confirm.service';
declare var $: any;

@Component({
  templateUrl: './imageexportreport.component.html'
})

export class ImageExportReport implements OnInit {
  public lstImageExportReport: any;
  ImageExportReportForm: FormGroup;
  ImageExportReports: ImageExportReports[];
  numberOfImageExportReport: number;
  limit: number;
  page: number = 1;
  error;
  imageexportreport = new ImageExportReports();
  modalAlerts: string;
  divClass: string = '';
  topPos: string = '2000px';
  selectedRow: number = 0;
  datePipe: DatePipe = new DatePipe('en-US');
  bsValue1: Date = new Date();
  bsValue2: Date = new Date();
  selectedId: number = 0;
  modalRef: BsModalRef;
  date = new Date();
  previousdate = new Date();
  NoRecord: string;
  alerts: string;
  ExportingStart: boolean;
  bsConfig: Partial<BsDatepickerConfig>;
  buttonStatus: boolean;
  @ViewChild(PagerComponent) pagerComponent: PagerComponent;
  recordCount: number;
  pageNo: number;
  pageLength: number;
  // Declare height and width variables
  scrHeight:any;
  scrWidth:any;
  @HostListener('window:resize', ['$event'])
  getScreenSize(event?) {

   var $ua = navigator.userAgent;
   if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
     this.scrHeight = window.innerHeight-430;
   }
   else
   {
     this.scrHeight = window.innerHeight-385;
   }
  }

  constructor(private router: Router, private reportservice: ReportService, private fb: FormBuilder, 
    private modalService: BsModalService, public global: GlobalService, 
    private _loadingService: LoadingService, private _confirmService: ConfirmService) {this.getScreenSize(); }

  ngOnInit(): void {
    this.buttonStatus = false;
    this.ExportingStart = false;
    this.bsConfig = Object.assign({}, { containerClass: 'theme-dark-blue' });
    this.NoRecord = this.global.NoRecords;
    let imageexportreport = new ImageExportReports();
    this.previousdate.setDate(this.previousdate.getDate());
    this.ImageExportReportForm = this.fb.group({
      sFromDate: [this.previousdate],
      sToDate: [this.date],
      sAccountNumber: ['']
    });
    this.alerts = '';
    this._loadingService.HideLoading("global-loading");
    $('#fixed_hdr2').fxdHdrCol({
      fixedCols: 0,
      width: "100%",
      height: this.scrHeight,
      colModal: [
        { width: 250, align: 'center' },
        { width: 200, align: 'center' },
        { width: 200, align: 'Center' },
        { width: 250, align: 'Center' },
        { width: 200, align: 'Center' },
        { width: 150, align: 'Center' },
        { width: 200, align: 'center' },        
        { width: 150, align: 'center' },
        { width: 180, align: 'center' },
      ],
      sort: true
    });
    this.pageNo = 1;
    this.pageLength = 10;
    this.NoRecord = this.global.NoRecords;
    this.recordCount = 0;
    this.pagerComponent = new PagerComponent();
            
    if(document.getElementById("fixed_table_rc") != null){
      document.getElementById("fixed_table_rc").remove();
      var testScript = document.createElement("script");
      testScript.setAttribute("id", "fixed_table_rc");
      testScript.setAttribute("src", "../assets/scripts/fixed_table_rc.js");
      testScript.setAttribute("type", "text/javascript");
      document.body.appendChild(testScript);
    }
  }

  GetImageExportReport(evt: any) {
    var tempArr = evt.split(',');
    this.pageNo = parseInt(tempArr[0]);
    var actulalength=this.pageLength;
    this.pageLength = parseInt(tempArr[1]);
    this.alerts = '';
    this.global.compareTwoDates(this.ImageExportReportForm.controls['sToDate'].value, this.ImageExportReportForm.controls['sFromDate'].value);
    if (this.global.ValidationMsg != '') {
      this.alerts = this.global.ValidationMsg
    }
    if (this.alerts == '') {
      this._loadingService.ShowLoading("global-loading");
      this.imageexportreport = this.ImageExportReportForm.value;
      var obj = this.imageexportreport;
      if (this.ExportingStart) {
        this.reportservice.GetImageExportReport(obj, this.pageNo, this.pageLength).subscribe((ImageExportReports: ImageExportReports[]) => { 
           //reset length after csvexport
           this.pageLength=actulalength;
          this.ExportService(ImageExportReports); }, error => this.error = <any>error);
      }
      else {
        this.reportservice.GetImageExportReport(obj, this.pageNo, this.pageLength).subscribe((ImageExportReports: ImageExportReports[]) => { this.BindFormFields(ImageExportReports); }, error => this.error = <any>error);
      }
    }
  }

  SearchRecords() {
    this.ExportingStart = false;
    this.GetImageExportReport('1, ' + this.pageLength);
  }

  BindFormFields(data) {
    this.recordCount = data.RecordCount;
    this.lstImageExportReport = data.ImageExportList;
    //this.numberOfImageExportReport = this.lstImageExportReport.length; 
    //this.limit = this.lstImageExportReport.length;
    if (this.lstImageExportReport.length > 0) {
      this.NoRecord = '';
      this.buttonStatus = true;
      this._loadingService.HideLoading("global-loading");
    }
    if (this.lstImageExportReport.length == 0) {
      this.NoRecord = this.global.NoRecords;
      this._loadingService.HideLoading("global-loading");
      this.buttonStatus = false;
    }
  }

  ExportEvent() {
    if (this.buttonStatus) {
      this.ExportingStart = true;
      this.GetImageExportReport('1, ' + this.recordCount);
      this.ExportingStart = false;
    }
  }

  ExportService(data: any) {
    for (let c = 0; c < this.global.RemoveColumns.length; c++) {
      for (let i = 0; i < data.ImageExportList.length; i++) {
        delete data.ImageExportList[i][this.global.RemoveColumns[c].toString()];
      }
    }
    this._loadingService.HideLoading("global-loading");
    this.global.ExportToCSV(data.ImageExportList, "ImageExportReport-" + this.date.getDay() + "-" + this.date.getMonth() + "-" + this.date.getSeconds())
    
  }

}