Skip to main content

Details Modal Wrapper

This section describes the BfmFinancialRecordDetailsModalWrapperComponent component.

Composition​

The BfmFinancialRecordDetailsModalWrapperComponent is composed of the following components:

Usage​

You must import the BfmFinancialRecordDetailsModalWrapperComponent and provide it to ModalService to open the modal.

info

Modals are not components. They must be used with the ModalService to be opened.

To a better understanding, check the Modals documentation.

This is a specific implementation of a modal wrapper. To learn how to create your own custom modal wrappers, see the Custom Modal Wrapper documentation.

modal-wrapper.component.ts
import { BfmFinancialRecordDetailsComponent } from '@celerofinancas/ui-cash-flow';
import { ModalService } from "@celerofinancas/ui-modals";
import { Component, inject } from '@angular/core';

@Component({
  standalone: true,
  selector: 'bfm-financial-record-modal-wrapper',
  imports: [BfmFinancialRecordDetailsComponent],
  templateUrl: './modal-wrapper.component.html',
  styleUrls: ['./modal-wrapper.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BfmFinancialRecordDetailsModalWrapperComponent {
  /**
   * Modal service for handling modals
   */
  private modalService = inject(ModalService);

  /**
   * Open the modal
   */
  public openModal(): void {
    this.modalService.open(BfmFinancialRecordDetailsComponent, {
      financialRecordPk: 'financialRecordPkValue',
      showAuthorizationSection: true,
      chargeType: 'chargeTypeValue',
    });
  };

  /**
   * Handles modal close click event
   */
  public onClose(): void {
    this.modalService.close();
  }
}