import { Component, Output, EventEmitter } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { BtcService } from '../../service/btc.service';

@Component({
  selector: 'app-sidebar',
  templateUrl: './sidebar.component.html',
  styleUrls: ['./sidebar.component.css'],
  standalone: true,
  imports: [CommonModule, FormsModule],
})
export class SidebarComponent {
  @Output() ticketingClick = new EventEmitter<void>();
  @Output() withdrawClick = new EventEmitter<void>();
  @Output() depositClick = new EventEmitter<void>();
  @Output() payoutClick = new EventEmitter<void>();
  @Output() cancelClick = new EventEmitter<void>();

  showCancel: boolean = false;
  ticketNo: string = '';

  showPayout: boolean = false;
  payoutTicketNo: string = '';

  showDeposit: boolean = false;
  depositOperatorId = '';
  depositShroffId = '';
  depositAmount = '';

  showWithdraw: boolean = false;
  withdrawOperatorId = '';
  withdrawShroffId = '';
  withdrawAmount = '';

  showViewRc: boolean = false;

  // Modal handlers...
  openCancelPopup() {
    this.cancelClick.emit();
    this.showCancel = true;
  }

  closeCancelPopup() {
    this.showCancel = false;
    this.ticketNo = '';
  }

  printTicket() {
    alert(`Printing Ticket No: ${this.ticketNo}`);
    this.closeCancelPopup();
  }

  openPayoutPopup() {
    this.payoutClick.emit();
    this.showPayout = true;
  }

  closePayoutPopup() {
    this.showPayout = false;
    this.payoutTicketNo = '';
  }

  erasePayoutTicket() {
    this.payoutTicketNo = '';
  }

  printPayoutTicket() {
    alert(`Printing Payout Ticket No: ${this.payoutTicketNo}`);
    this.closePayoutPopup();
  }

  openDepositPopup() {
    this.depositClick.emit();
    this.showDeposit = true;
  }

  closeDepositPopup() {
    this.showDeposit = false;
    this.depositOperatorId = '';
    this.depositShroffId = '';
    this.depositAmount = '';
  }

  printDeposit() {
    alert(`Deposit: ₹${this.depositAmount}`);
    this.closeDepositPopup();
  }

  openWithdrawPopup() {
    this.withdrawClick.emit();
    this.showWithdraw = true;
  }

  closeWithdrawPopup() {
    this.showWithdraw = false;
    this.withdrawOperatorId = '';
    this.withdrawShroffId = '';
    this.withdrawAmount = '';
  }

  printWithdraw() {
    alert(`Withdraw: ₹${this.withdrawAmount}`);
    this.closeWithdrawPopup();
  }


  raceCardData: any = null; // ✅ Hold fetched data
  

  constructor(
    private btcService: BtcService

  ) {}

  openViewRcPopup() {
  const cachedData = localStorage.getItem('raceCardData');

  if (cachedData) {
    this.raceCardData = JSON.parse(cachedData);
    console.log('📦 Loaded race card from localStorage:', this.raceCardData);
  } else {
    this.raceCardData = { error: 'Race card not available locally' };
    console.warn('⚠️ No race card data found in localStorage.');
  }

  this.showViewRc = true;
}

objectKeys = Object.keys;

  closeViewRcPopup() {
    this.showViewRc = false;
  }

  printViewRc() {
    // Implement print logic here
    window.print();
  }

  onNumpadClick(value: string, type: 'deposit' | 'withdraw') {
    if (type === 'deposit') {
      this.depositAmount += value;
    } else if (type === 'withdraw') {
      this.withdrawAmount += value;
    }
  }

  onBackspace(type: 'deposit' | 'withdraw') {
    if (type === 'deposit') {
      this.depositAmount = this.depositAmount.slice(0, -1);
    } else if (type === 'withdraw') {
      this.withdrawAmount = this.withdrawAmount.slice(0, -1);
    }
  }
}