import { Component,  OnInit, ViewChild, ElementRef } from '@angular/core';
import { MatSort, Sort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { ActivatedRoute, Router } from '@angular/router';
import { apiUrl } from 'src/app/_providers/_resources/api-url.properties';
import { MasterService } from 'src/app/_providers/_services/master.service';
import { UiService } from 'src/app/_providers/_services/ui.service';

@Component({
  selector: 'app-payment-details',
  templateUrl: './payment-details.component.html',
  styleUrls: ['./payment-details.component.scss']
})
export class PaymentDetailsComponent implements OnInit {
 

  title = 'Payment Details';

  today: Date = new Date();

  @ViewChild('table', { static: false }) table: ElementRef;

  @ViewChild(MatSort, { static: false }) sort: MatSort;

  displaycolumns: string[] = ['slNo', 'name', 'mobileNumber', 'email', 'transId', 'Paymentstatus'];

  dataSource: MatTableDataSource<unknown>;

  tenderId: number;

  headerData: any;

  tableData: any;

  tenderInputId: any;


  paymentStatus: any;
  userId: string;

  constructor(
    private _router: Router,
    private _masterService: MasterService,
    private route: ActivatedRoute,
    private _ui:UiService,
    ) {
      this.tenderId = +this.route.snapshot.paramMap.get('id');
     }

  ngOnInit(): void {
    this.getHeaderData(this.tenderId);
    this.getTableData(this.tenderId);
  }

  getHeaderData(id) {
    this._masterService.getMasterDatabyId(apiUrl.getTender, id).then(res => {
      this.headerData = res;
      
      this.tenderInputId = res.tenderId
    })
  }

  getTableData(id) {
    this._masterService.getMasterDatabyId(apiUrl.bidReport, id).then(res => {
      console.log("res",res);
      
      this.tableData = res.report
      this.tableData.forEach(element => {
        if (element.status === 'P') {
          element.paymentStatus = 'P';
        }
        if(element.status === 'S'){
          element.paymentStatus = 'S';
        }
        if(element.status === 'D'){
          element.paymentStatus = 'D';
        }
      });

      this.tableData.sort((a, b) => {
        if (a.status === 'P' && b.status !== 'P') {
          return -1;
        } else if (a.status !== 'P' && b.status === 'P') {
          return 1; 
        } else {
          return 0;
        }
      });
      
      this.dataSource = new MatTableDataSource(this.tableData);
      this.dataSource.sort = this.sort;
    })
  }

  navigateTo(destination) {
    this._router.navigate([destination])
  }

  backButton() {
    this.navigateTo('/dashboard')
    // this.backClick.emit()
  }

  sortData(sort: Sort) {}

  onPaymentStatusChange(userId, paymentStatus){
     console.log("this.paymentStatus",paymentStatus);
    let message = '';
  if (paymentStatus === 'S') {
    message = 'Payment confirmed message'; 
  } else if (paymentStatus === 'D') {
    message = 'Payment declined message'; 
  }

  let body = {
      status : paymentStatus,
      notificationViewed:'N',
      message:message
    }
    this._masterService.postMasterData(apiUrl.paymentupdatePaymentStatus,body,`${userId}/${this.tenderId}`).then((res) =>{
      console.log(res);
      this._ui.toastMessage(res.data)
      
    },err=>{
      this._ui.toastMessage(err.error.message);
      

    })
  }

  ConfirmMail(userName,email){
    // console.log("this is for userName",userName);
    // console.log("this is for email",email);
    let body ={
      custName:userName,
      email: email
    }
    this._masterService.saveMasterData(apiUrl.confirmPayment,body).then((res) =>{
      console.log(res);
      
    })
    
  }

}