Skip to main content

Bill Detail

This section describes the BfmBillDetailComponent component.

Usage​

You need to import it in your module and use it in your template.

bill-detail.component.ts
import { BfmBillDetailComponent } from '@celerofinancas/ui-charges';

@Component({
  standalone: true,
  selector: 'bill-detail',
  imports: [BfmBillDetailComponent],
  templateUrl: './bill-detail.component.html',
})
export class BillDetailComponent {}

Then, in your template, you can use the component like this:

bill-detail.component.html
<bfm-bill-detail
  [billInformationList]="billInformationList"
  [billList]="billList"
  [dateList]="dateList"
  [invalid]="invalid"
  [specificFields]="specificFields"
  [taxList]="taxList"
/>

Inputs​

The BfmBillDetailComponent component has the following inputs:

billInformationList​

Bill Data Information List

Type
FormItem[]

Default value:

[
  {
    label: 'Valor',
    value: ({ external_data }) => formatMoney(external_data.value),
    invalid: ({ external_data }) => external_data.value === 0,
    class: 'money',
  },
  {
    label: 'Descrição',
    value: ({ external_data }) => external_data.description,
    invalid: ({ external_data }) => !external_data.description,
    class: 'description',
  },
]

billList​

Bill List or unitary object

TypeDefault
BillDetail[][]

dateList​

Date Items List

Type
FormItem[]

Default value:

[
  {
    label: 'Emissão',
    value: ({ external_data }) => dateFormatter(external_data.emit_at),
    invalid: ({ external_data }) => !external_data.emit_at || !isDateBiggerOrEqualThanToday(external_data.emit_at),
  },
  {
    label: 'Vencimento',
    value: ({ external_data }) => dateFormatter(external_data.due_at),
    invalid: ({ external_data }) => !external_data.due_at || !isDateBiggerOrEqualThanToday(external_data.due_at),
  },
]

invalid​

Massive bill validation

TypeDefault
booleanfalse

specificFields​

Bill-Specific Data Fields List

Type
FormItem[]

Default value:

[
  {
    label: 'Negativação automática',
    value: () => 'Não',
    invalid: () => false,
  },
  {
    label: 'Incluir beneficiário final?',
    value: () => 'Não',
    invalid: () => false,
  },
]

taxList​

Tax Data List

Type
FormItem[]

Default value:

[
  {
    label: 'Multa',
    value: ({ external_data }) => `${external_data.bill_fine}%`,
    invalid: ({ external_data }) => external_data.bill_fine < 0,
  },
  {
    label: 'Juros',
    value: ({ external_data }) => `${external_data.interest}%`,
    invalid: ({ external_data }) => external_data.interest < 0,
  },
  {
    label: 'Dias desconto Máximo',
    value: ({ external_data }) => external_data.maximum_discount,
    invalid: ({ external_data }) => external_data.maximum_discount < 0,
    class: 'bigger',
  },
  {
    label: 'Desconto',
    value: ({ external_data }) => formatMoney(external_data.discount_value),
    invalid: ({ external_data }) => external_data.discount_value < 0,
  },
]

Events​

The BfmBillDetailComponent component has no events.