# WidgetBookingVSTargetTodayComponent

**Kind:** Class

**Source:** `Frontend/src/app/components/dashboard/dashboard-libary/widgets/widget-booking-vstarget-today/widget-booking-vstarget-today.component.ts` (line 20)

**Part of:** [Frontend](subsystem-frontend-src-app)

`WidgetBookingVSTargetTodayComponent` renders dashboard data that compares today’s bookings with a target. It checks subscription access, initializes and sorts widget data, manages cached state, and handles chart initialization and planned-visit clicks.

**Extends:** `BaseWidgetComponent`

**Implements:** `OnInit`

## Methods

| Method | Signature | Returns |
|---|---|---|
| `viewData` | `viewData()` | `void` |
| `getDashboardData` | `getDashboardData()` | `void` |
| `checkFeatureSubscription` | `checkFeatureSubscription()` | `boolean` |
| `insializeWidget` | `insializeWidget(value: any[])` | `void` |
| `sortingByIndex` | `sortingByIndex(index: number)` | `void` |
| `ngOnInit` | `ngOnInit()` | `void` |
| `onChartInit` | `onChartInit(e: any)` | `void` |
| `onPlannedVisitsChartClick` | `onPlannedVisitsChartClick(e: undefined)` | `void` |
| `setChaching` | `setChaching()` | `void` |
| `getChaching` | `getChaching()` | `void` |
| `switchChartRefernceCommissionHandler` | `switchChartRefernceCommissionHandler()` | `void` |

## Properties

| Property | Type |
|---|---|
| `_widget` | `Widget` |
| `todayWidgetsEnum` | `any` |
| `sortingByEnum` | `any` |
| `sortingDirectionEnum` | `any` |
| `requestSortingDirection` | `number` |
| `sortingArray` | `SortingArray[]` |
| `propertyName` | `string` |
| `data` | `any[]` |
| `originalData` | `any[]` |
| `initOpts` | `any` |
| `series` | `any[]` |
| `header` | `any` |
| `echartsIntance` | `any` |
| `options` | `any` |
| `cachingWidgetData` | `CachingWidgetData` |
| `withNominal` | `boolean` |
| `currenFeature` | `number` |
| `showDataOnChart` | `boolean` |

## Where it refuses work

- `WidgetBookingVSTargetTodayComponent` stops the work with an early return when `a[this.propertyName] < b[this.propertyName]`, in 2 places.
- `WidgetBookingVSTargetTodayComponent` stops the work with an early return when `a[this.propertyName] > b[this.propertyName]`, in 2 places.
- `WidgetBookingVSTargetTodayComponent` stops the work with an early return when `this.dashboardLibraryService.checkFeatureSubscription(this.widget.chartEnumId)`.

## Diagram

```mermaid
graph LR
  Init[ngOnInit] --> Subscription[checkFeatureSubscription]
  Subscription --> Widget[insializeWidget]
  Widget --> Data[getDashboardData]
  Data --> Sort[sortingByIndex]
  Data --> Cache[setChaching]
  Cache --> View[viewData]

  Chart[onChartInit] --> View
  Chart --> Click[onPlannedVisitsChartClick]

  Restore[getChaching] --> Widget
```

## Usage

```ts
// Obtain the component through Angular dependency injection, a fixture,
// or the dashboard widget host.
const widgetComponent: WidgetBookingVSTargetTodayComponent = component;

widgetComponent.ngOnInit();

// Called when the chart instance is ready.
widgetComponent.onChartInit();

// Called from the planned-visits chart interaction.
widgetComponent.onPlannedVisitsChartClick();
```

## AI Coding Instructions

- Keep dashboard loading inside `getDashboardData()` and update the displayed state through `viewData()`.
- Check `checkFeatureSubscription()` before requesting or displaying subscription-gated widget data.
- Preserve the existing `setChaching()` and `getChaching()` method names unless all callers are updated together.
- Keep chart event handling in `onChartInit()` and `onPlannedVisitsChartClick()` rather than placing chart logic in lifecycle setup.

## 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)

- `DashboardWidgetsModule` — `Frontend/src/app/components/dashboard/dashboard-widgets.module.ts`:1