import { Component, computed, input, output, signal } from '@angular/core';

export interface <%= classify(name) %>Result {
  principal: number;
  months: number;
  annualRate: number;
  monthlyPayment: number;
  totalPayment: number;
}

let nextId = 0;

@Component({
  selector: '<%= selector %>',
  imports: [],
  templateUrl: './<%= dasherize(name) %>.html',
  styleUrl: './<%= dasherize(name) %>.css',
})
export class <%= classify(name) %> {
  protected readonly instanceId = `<%= dasherize(name) %>-${nextId++}`;
  protected readonly principal = signal(10000);
  protected readonly months = signal(12);
  protected readonly annualRate = signal(18);
  protected readonly statusMessage = signal('');

  readonly title = input('Simulador de empréstimo');
  readonly principalLabel = input('Valor do empréstimo');
  readonly monthsLabel = input('Número de parcelas');
  readonly annualRateLabel = input('Taxa de juros anual');
  readonly submitLabel = input('Revisar simulação');
  readonly successMessage = input('A simulação de empréstimo está pronta para revisão.');
  readonly simulationSubmit = output<<%= classify(name) %>Result>();

  protected readonly titleId = computed(() => `${this.instanceId}-title`);
  protected readonly principalId = computed(() => `${this.instanceId}-principal`);
  protected readonly monthsId = computed(() => `${this.instanceId}-months`);
  protected readonly annualRateId = computed(() => `${this.instanceId}-annual-rate`);
  protected readonly resultId = computed(() => `${this.instanceId}-result`);
  protected readonly monthlyRate = computed(() => Math.max(this.annualRate(), 0) / 100 / 12);
  protected readonly monthlyPayment = computed(() => {
    const amount = Math.max(this.principal(), 0);
    const term = Math.max(this.months(), 1);
    const rate = this.monthlyRate();

    if (rate === 0) {
      return amount / term;
    }

    return amount * rate / (1 - Math.pow(1 + rate, -term));
  });
  protected readonly totalPayment = computed(() => this.monthlyPayment() * Math.max(this.months(), 1));
  protected readonly result = computed<<%= classify(name) %>Result>(() => ({
    principal: this.principal(),
    months: this.months(),
    annualRate: this.annualRate(),
    monthlyPayment: this.monthlyPayment(),
    totalPayment: this.totalPayment(),
  }));

  protected formatMoney(value: number): string {
    return new Intl.NumberFormat('pt-BR', { style: 'currency', currency: 'BRL' }).format(value);
  }

  protected updateNumber(field: 'principal' | 'months' | 'annualRate', event: Event): void {
    const value = Number((event.target as HTMLInputElement).value);
    const nextValue = Number.isFinite(value) ? value : 0;

    if (field === 'principal') {
      this.principal.set(nextValue);
      return;
    }

    if (field === 'months') {
      this.months.set(Math.max(1, Math.floor(nextValue)));
      return;
    }

    this.annualRate.set(nextValue);
  }

  protected submit(event: SubmitEvent): void {
    event.preventDefault();
    this.statusMessage.set(this.successMessage());
    this.simulationSubmit.emit(this.result());
  }
}