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

@Component({
  selector: 'app-budget-progress',
  standalone: true,
  templateUrl: './budget-progress.component.html',
  styleUrls: ['./budget-progress.component.scss']
})
export class BudgetProgressComponent implements OnInit {
  @Input() total: number = 0;
  @Input() spent: number = 0;
  @Input() remaining: number = 0;
  @Input() percentage: number = 0;

  ngOnInit(): void {
    // Animation for progress bar
    setTimeout(() => {
      const progressBar = document.querySelector('.progress-bar') as HTMLElement;
      if (progressBar) {
        progressBar.style.width = `${this.percentage}%`;
      }
    }, 500);
  }
}