Receivables Summary

The receivables summary page renders the acquiring receivables dashboard: a progress bar for received vs pending amounts (split by card and Pix), card brand breakdown, a calendar and an optional period filter.

BfmReceivablesSummaryComponent

This section describes the BfmReceivablesSummaryComponent component.

Composition

The BfmReceivablesSummaryComponent is composed of the following components:

• BfmProgressBarComponent - Progress bar for received vs pending receivables.
• BfmCardBrandComponent - Card brand breakdown.
• BfmCalendarComponent - Calendar of receivables.
• BfmAcquiringSummaryFilterComponent - Period filter (this month / this week / custom).

Usage

You can import the BfmReceivablesSummaryComponent directly in your route configuration.

import { BfmReceivablesSummaryComponent } from '@celerofinancas/ui-acquiring';

const routes = [
  {
    path: 'receivables-summary',
    component: BfmReceivablesSummaryComponent,
  },
];

But if you need more customization, you need to import it in your module and use it in your template.

receivables-summary.component.ts

import { BfmReceivablesSummaryComponent } from '@celerofinancas/ui-acquiring';

@Component({
  standalone: true,
  selector: 'example-component',
  imports: [BfmReceivablesSummaryComponent],
  templateUrl: './receivables-summary.component.html',
})
export class ExampleComponent {}

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

receivables-summary.component.html

<bfm-receivables-summary />

Inputs

The BfmReceivablesSummaryComponent component has no inputs.

Events

The BfmReceivablesSummaryComponent component has no events.

Feature flags

The component reacts to the following feature flags:

Flag	Behavior
enable_qrcode_pix	Includes Pix amounts in the confirmed total.
hide_acquiring_summary_period_filter	Displays the period filter and defers data loading.