WidgetForecastVsTargetThisYearComponent

reference

1 min readUpdated 2026-08-11

Kind: Class

Source: Pams/Web/Pams.Web/Client/app/components/dashboard/dashboard-libary/widgets/widget-forecast-vs-target-this-year/widget-forecast-vs-target-this-year.component.ts (line 31)

Part of: Pams

WidgetForecastVsTargetThisYearComponent manages the dashboard widget that compares this year's forecast with its target. It loads dashboard data, prepares display values, calculates the forecast-versus-target result, and responds to forecast and chart-type switches.

Implements: OnInit

Methods

Method	Signature	Returns
`ngOnInit`	`ngOnInit()`	`void`
`getDashboardData`	`getDashboardData()`	`void`
`initalizingData`	`initalizingData(value: MonthData[])`	`void`
`getpriceFormatted`	`getpriceFormatted(x: undefined)`	`string`
`calculatForecastVsTarget`	`calculatForecastVsTarget(value: MonthData)`	`number`
`switchIsForecastHandler`	`switchIsForecastHandler()`	`void`
`switchChartTypeHandler`	`switchChartTypeHandler()`	`void`
`onChartInit`	`onChartInit(e: any, index: number)`	`void`
`ngOnDestroy`	`ngOnDestroy()`	`void`
`setValue`	`setValue(value: number)`	`void`

Properties

Property	Type
`_widget`	`Widget`
`withNominal`	`boolean`
`selectedYear`	`number`
`todayWidgetsEnum`	`any`
`Branches`	`BranchessTendancy[]`
`MonthData`	`MonthData[]`
`subscription`	`Subscription`
`IsForecast`	`boolean`
`initOpts`	`any`
`series`	`any[]`
`headerData`	`any`
`echartsIntance`	`any`
`options`	`any`
`TargetBooking`	`string
`AchievedBooking`	`string

Diagram

mermaid
graph LR
    Dashboard[Dashboard data source] --> Load[getDashboardData]
    Load --> Init[initalizingData]
    Init --> Calculate[calculatForecastVsTarget]
    Init --> Format[getpriceFormatted]
    ToggleForecast[switchIsForecastHandler] --> Calculate
    ToggleChart[switchChartTypeHandler] --> Chart[Chart instance]
    ChartInit[onChartInit] --> Chart
    SetValue[setValue] --> Chart
    Destroy[ngOnDestroy] --> Chart

Usage

ts
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { WidgetForecastVsTargetThisYearComponent } from './widget-forecast-vs-target-this-year.component';

let fixture: ComponentFixture<WidgetForecastVsTargetThisYearComponent>;
let component: WidgetForecastVsTargetThisYearComponent;

beforeEach(async () => {
  await TestBed.configureTestingModule({
    declarations: [WidgetForecastVsTargetThisYearComponent],
  }).compileComponents();

  fixture = TestBed.createComponent(WidgetForecastVsTargetThisYearComponent);
  component = fixture.componentInstance;

  fixture.detectChanges();
});

it('updates the forecast view', () => {
  component.ngOnInit();
  component.switchIsForecastHandler();
  component.switchChartTypeHandler();

  const formattedPrice = component.getpriceFormatted();
  const comparison = component.calculatForecastVsTarget();

  expect(formattedPrice).toBeDefined();
  expect(comparison).toBeDefined();
});

AI Coding Instructions

Call getDashboardData() and initalizingData() through the component lifecycle flow rather than duplicating dashboard-data preparation.
Keep forecast comparison logic in calculatForecastVsTarget() so displayed values and chart values remain aligned.
Update chart state through onChartInit() and setValue() after the chart instance is available.
Preserve cleanup behavior in ngOnDestroy() when adding subscriptions, timers, or chart resources.
Keep the existing initalizingData and calculatForecastVsTarget method names when calling them, including their current spelling.

Used by

1 reference from 1 file. Each is a place in this repository where the symbol is actually used — go read one rather than trusting an example.

Imported by (1)

TranslateHandler — Pams/Web/Pams.Web/Client/app/app.module.ts:1

Was this page helpful?

Download as PDF

ADocs generated by Atloria — from the code, always in sync →