import { Component, OnInit, Output, EventEmitter, ViewChild } from '@angular/core';

@Component({
  selector: 'app-car-summary-header',
  templateUrl: './car-summary-header.component.html',
  styleUrls: ['./car-summary-header.component.scss']
})
export class CarSummaryHeaderComponent implements OnInit {

  @Output() public testDrive: EventEmitter<any> = new EventEmitter();
  @Output() public editInfo: EventEmitter<any> = new EventEmitter();
  @Output() public sendMail: EventEmitter<any> = new EventEmitter();
  @Output() public addToWishlist: EventEmitter<any> = new EventEmitter();
  @Output() public financeOptions: EventEmitter<any> = new EventEmitter();
  @ViewChild('basicModal') modal;
  @ViewChild('mailModal') mailModal;

  financingOptionsItems = [
    {
        'label': 'Cash', 'linkValue': '/FinancingOptions:Cash', 'amount': 840120.00,
        'paymentType': 'One-time Payment', 'currency': 'KRW'
    },
    {
        'label': 'Installments', 'linkValue': '/FinancingOptions:Installments',
        'amount': 2550.00,
        'paymentType': 'Per Month', 'currency': 'KRW'
    },
    {
        'label': 'Lease', 'linkValue': '/FinancingOptions:Lease',
        'amount': 3251.00,
        'paymentType': 'Per Month', 'currency': 'SGD'
    },
    {
        'label': 'Third Party', 'linkValue': '/FinancingOptions:Third Party',
        'amount': 4528.00,
        'paymentType': 'Per Month', 'currency': 'USD'
    }
];
  constructor() { }

  ngOnInit() {
  }

  drive() {
    this.testDrive.emit('');
  }

  editInformation() {
    this.editInfo.emit('');
  }

  mailToSelf() {
    this.mailModal.show();
    //this.sendMail.emit('');
  }

  wishList() {
    this.addToWishlist.emit('');
  }

  financingOptions(e?: any) {
    //this.financeOptions.emit('');
    this.modal.show();
  }

  closeDialog() {
    this.modal.nativeElement.style.display = `none`;
  }

}
