import { Component, OnInit, Input } from '@angular/core';

import { DialogService, Message } from 'primeng/api';
import { ThrowStmt } from '@angular/compiler';
import { ActivityServicesService } from '../../shared/services/activity-services.service';
import { IDocumentStatus } from '../../shared/core/IDocumentStatus';
import { IDocuments } from '../../shared/core/IDocuments';
import { IDocumentTypes } from '../../shared/core/IDocumentTypes';



@Component({
  selector: 'app-job-documents',
  templateUrl: './job-documents.component.html',
  styleUrls: ['./job-documents.component.css'],
  providers: [ActivityServicesService]
})
export class JobDocumentsComponent implements OnInit {
  columns: { field: string; header: string; width: string }[];
  phases: any;
  brands: any;
  checked = true;

  // Document Status
  documentStatusLists: IDocumentStatus[] = [];

  // Selected Document status
  selectedDocumentStatus: IDocumentStatus;

  // Document Details
  documentList: IDocuments[] = [];

  // Document types
  docuementTypeList: IDocumentTypes[] = [];
  selectedDocumentType: IDocumentTypes;

  // Search
  searchDocument: string;
  pageSizes: { label: string; value: number; }[];

  // paginator
  numberOfRows = 20;
  // Input
  @Input() jobPlanId: number;

  // No data Message
  noDataMessage: Message[] = [];
  // No data flag
  nodataFlag = true;

  constructor(public dialogService: DialogService, private activitiesService: ActivityServicesService) {
    this.columns = [
      { field: 'name', header: 'Document Name', width: '30%' },
      { field: 'type', header: 'Document Type', width: '10%' },
      { field: 'uploadDate', header: 'Upload Date', width: '15%' },
      { field: 'uploadBy', header: 'Upload By', width: '10%' },
      { field: 'status', header: 'Status', width: '10%' },
    ];

    this.pageSizes = [

      {
        label: '20 record per page',
        value: 20
      },
      {
        label: '40 record per page',
        value: 40
      },
      {
        label: '100 record per page',
        value: 100
      }];
  }

  ngOnInit() {

    // No record message
    this.noDataMessage = [];
    this.noDataMessage.push({ severity: 'info', summary: 'No Documents Found', detail: '' });


    // Get All
    this.GetAllDocuments(this.jobPlanId);

    // Get Document Status
    this.activitiesService.GetAllDocumentStatus().subscribe(
      data => {
        this.documentStatusLists = data;
        this.selectedDocumentStatus = this.documentStatusLists[0];
        // console.log('Document Status');
        // console.log(this.documentStatusLists);
      });

    // Get All Document Types
    this.GetAllDocumentTypes();

  }
  showAddDocument() {
  }

  // Filterby Document Type
  FilterByDocumentType(type) {
    if (type.id === '0') {
      this.GetAllDocuments(this.jobPlanId);
    } else {
      // Get Filterd Document Type
      if (type.Description !== 'Any') {
        this.activitiesService.GetFilteredDocuments('TYPE', type.Description).subscribe(
          result => {
            this.documentList = result;
          }
        );
      } else {
        // Get All
        this.GetAllDocuments(this.jobPlanId);
      }
    }
  }

  // Filterby Document Status
  FilterByDocumentStatus(type) {
    // console.log(type);
    // Get Filterd Document Status
    this.activitiesService.GetFilteredDocuments('STATUS', type.Description).subscribe(
      result => {
        this.documentList = result;
      }
    );
  }

  GetAllDocuments(jobPlanId) {
    // Get All Documents
    this.activitiesService.GetAllDocuments(jobPlanId).subscribe(
      result => {
        this.documentList = result;
        if (this.documentList.length > 0) {
          this.nodataFlag = false;
        }
      }
    );
  }

  // Search
  FilterBySearch() {
    // console.log(event);
    this.activitiesService.GetFilteredDocuments('SEARCH', this.searchDocument).subscribe(
      result => {
        this.documentList = result;
      }
    );
  }

  pageSizesChange(e) {
    // console.log('Page size', e.value);
    this.numberOfRows = e.value;
  }

  // Get All Document Types
  GetAllDocumentTypes() {
    this.activitiesService.GetAllDocumentTypes().subscribe(
      data => {
        this.docuementTypeList = data;

        // console.log('Document Types');
        // console.log(this.docuementTypeList);
        this.docuementTypeList.push({
          Id: 0,
          Description: 'Any'
        });

        this.selectedDocumentType = this.docuementTypeList[0][0];

        // console.log('Document Types');
        // console.log(this.docuementTypeList);

      });
  }

}