Paginated Financial List

This section describes the BfmPaginatedFinancialListComponent component.

Composition

The BfmPaginatedFinancialListComponent is composed of the following components:

• BfmFinancialRecordsListComponent - Base component for displaying financial records.
• InfiniteScrollDirective - Directive for infinite scrolling functionality.
• ActionsPanelModule - Module for bulk actions panel.
• BackToTopModule - Module for back to top functionality.

Usage

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

paginated-financial-list.component.ts

import { BfmPaginatedFinancialListComponent } from '@celerofinancas/ui-cash-flow';

@Component({
  standalone: true,
  selector: 'bfm-paginated-financial-list',
  imports: [BfmPaginatedFinancialListComponent],
  templateUrl: './paginated-financial-list.component.html',
})
export class PaginatedFinancialListComponent {}

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

paginated-financial-list.component.html

<bfm-paginated-financial-list 
  [headers]="{}"
  [columnsList]="[]"
  [headerClick]="true"
  [bankDetails]="false"
  [statusIcons]="{}"
  [initialFilters]="{}"
/>

Inputs

The BfmPaginatedFinancialListComponent component has the following inputs:

headers

Headers for the financial records list.

Type	Default
Headers	{ name: 'Nome', description: 'Descrição', payment_method: 'Método de pagamento', due_at: 'Vencimento', paid_at: 'Data', created_at: 'Envio', scheduled_date: 'Agendado para', cost_center: 'Centro de Custos', coa_name: 'Plano de Contas', value: 'Valor', include: 'Incluir', bank_id: 'Banco', processing_status: 'Status de Processamento', status: 'Status', edit: '', solve: '', has_document: '' }

columnsList

List of columns to be displayed in the financial records list.

Type	Default
ColumnItem[]	[{ name: 'Nome', description: 'Descrição', payment_method: 'Método de pagamento', due_at: 'Vencimento', paid_at: 'Data', created_at: 'Envio', scheduled_date: 'Agendado para', cost_center: 'Centro de Custos', coa_name: 'Plano de Contas', value: 'Valor', include: 'Incluir', bank_id: 'Banco', processing_status: 'Status de Processamento', status: 'Status', edit: '', solve: '', has_document: '' }]

headerClick

Whether to enable the header click functionality.

Type	Default
boolean	true

bankDetails

Whether to show bank details in the financial records list.

Type	Default
boolean	false

statusIcons

Status icons to be displayed in the financial records list.

Type	Default
StatusIcons?	-

initialFilters

Filters to be applied to the financial records list.

Type	Default
Filter	null

info

getNextMonth is imported from @celerofinancas/core-ts.

Events

The BfmPaginatedFinancialListComponent component does not emit any events.