PrincipalReportComponent

Kind: Class

Source: Frontend/src/app/components/dashboard/_principalReport/principal-report.component.ts (line 86)

Part of: Frontend

PrincipalReportComponent manages the principal dashboard report view. It handles introduction modal state, date and numeral formatting, report period changes, window resizing, and page-number retrieval for report navigation.

Implements: OnInit

Methods

Properties

Where it refuses work

• PrincipalReportComponent stops the work with an early return when date.
• PrincipalReportComponent stops the work with an early return when this.isGenerating.
• PrincipalReportComponent stops the work with an early return when dataField == "OfferTotalPrice" || dataField == "OrderTotalPrice" || dataField == "OrderBa….
• PrincipalReportComponent stops the work with an early return when id == ReportSettingsEnum.ReportIntroduction.
• PrincipalReportComponent stops the work with an early return when id == ReportSettingsEnum.ReportSalesAnalysis.
• PrincipalReportComponent stops the work with an early return when id == ReportSettingsEnum.ReportLostOpportunities.

Diagram

mermaid
graph LR
  Dashboard[Dashboard View] --> Report[PrincipalReportComponent]
  Report --> Init[ngOnInit]
  Report --> Modal[Introduction and Outlines Modal]
  Report --> Formatting[Date and Numeral Formatting]
  Report --> Periods[History and Analysis Period Changes]
  Report --> Resize[resizeWindow]
  Report --> Pagination[getPageNumber]

  Modal --> Open[openIntroductionAndOutlinesPopup]
  Modal --> Close[closeIntroductionAndOutlinesModal]
  Periods --> Booking[BookingHistoryPeriodChanged]
  Periods --> Deliveries[DeliveriesHistoryPeriodChanged]
  Periods --> Analysis[OverallAnalysisPeriodChanged]

Usage

ts
import { AfterViewInit, Component, ViewChild } from '@angular/core';
import { PrincipalReportComponent } from './components/dashboard/_principalReport/principal-report.component';

@Component({
  selector: 'app-dashboard-host',
  template: `
    <app-principal-report></app-principal-report>
    <button (click)="showReportIntroduction()">Show introduction</button>
  `,
})
export class DashboardHostComponent implements AfterViewInit {
  @ViewChild(PrincipalReportComponent)
  reportComponent!: PrincipalReportComponent;

  ngAfterViewInit(): void {
    const pageNumber: number = this.reportComponent.getPageNumber();
    console.log('Current report page:', pageNumber);
  }

  showReportIntroduction(): void {
    this.reportComponent.openIntroductionAndOutlinesPopup();
  }

  closeReportIntroduction(): void {
    this.reportComponent.closeIntroductionAndOutlinesModal();
  }
}

AI Coding Instructions

• Keep modal interactions paired: open the introduction view with openIntroductionAndOutlinesPopup() and dismiss it with closeIntroductionAndOutlinesModal().
• Call report setup through Angular lifecycle hooks rather than invoking ngOnInit() from other components.
• Connect booking, delivery, and overall-analysis controls to their matching period-change methods.
• Preserve the return type of getPageNumber() as number when passing pagination state to related dashboard views.

Used by

2 references from 2 files. Each is a place in this repository where the symbol is actually used — go read one rather than trusting an example.

Imported by (2)

• DashboardWidgetsModule — Frontend/src/app/components/dashboard/dashboard-widgets.module.ts:1
• PrincipalReportRouteModule — Frontend/src/app/components/dashboard/principal-report-route.module.ts:1