@@ -60,10 +63,10 @@
There are {{ facility.notification }} open cases regarding this facility
-
- New Case
+ >
+ New Case
diff --git a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts
index 5aa99a81..4cb9788e 100644
--- a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts
+++ b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts
@@ -1,13 +1,13 @@
import { CommonModule } from '@angular/common';
import {
- ChangeDetectionStrategy,
- Component,
- computed,
- inject,
- OnInit,
- Signal,
- signal,
- ViewEncapsulation,
+ ChangeDetectionStrategy,
+ Component,
+ computed,
+ inject,
+ OnInit,
+ Signal,
+ signal,
+ ViewEncapsulation,
} from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { ActivatedRoute, Router, RouterLink } from '@angular/router';
@@ -18,10 +18,16 @@ import { IxModule, ModalService } from '@siemens/ix-angular';
import { convertThemeName, registerTheme } from '@siemens/ix-echarts';
import * as echarts from 'echarts';
import { EChartsOption } from 'echarts';
+import { IPumpMetrics } from 'facilities-shared-models';
+import { defaults, map } from 'lodash';
import { NgxEchartsModule } from 'ngx-echarts';
+import { $enum } from 'ts-enum-util';
-import { Colors } from './colors';
import LockModalComponent from './lock-modal/lockModal.component';
+import { Colors } from './models/colors';
+import { EMetricsCategory } from './models/metrics-category.enum';
+import { METRIC_CATEGORY_COLOR_INFORMATION } from './models/metrics-category-information.map';
+import { PUMP_METRICS_FULL_NAME_MAP } from './models/pump-metrics-full-name.map';
@Component({
selector: 'lib-detail',
@@ -54,6 +60,18 @@ export class XdDetailPage implements OnInit {
}),
);
private readonly defaultOptions: EChartsOption = {
+ tooltip: {
+ trigger: 'axis',
+ renderMode: 'auto',
+ axisPointer: {
+ axis: 'auto',
+ crossStyle: {
+ textStyle: {
+ precision: 2,
+ }
+ }
+ }
+ },
xAxis: {
type: 'time',
name: 'Time',
@@ -75,6 +93,35 @@ export class XdDetailPage implements OnInit {
top: 80,
},
};
+ private readonly barChartOptions: EChartsOption = {
+ tooltip: {
+ trigger: 'axis',
+ renderMode: 'auto',
+ axisPointer: {
+ axis: 'auto',
+ crossStyle: {
+ textStyle: {
+ precision: 2,
+ }
+ }
+ }
+ },
+ legend: {
+ top: 30,
+ left: 80,
+ },
+ grid: {
+ top: 80,
+ },
+ title: {
+ text: 'Pump Metrics',
+ left: 'center',
+ },
+ yAxis: {
+ type: 'value',
+ nameLocation: 'middle',
+ },
+ }
private readonly pumpOptions: EChartsOption = {
...this.defaultOptions,
title: {
@@ -162,21 +209,59 @@ export class XdDetailPage implements OnInit {
},
],
};
- protected readonly envChart: Signal