ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.ts

   1 import { Component, OnDestroy, OnInit } from '@angular/core';
   2
   3 import { I18n } from '@ngx-translate/i18n-polyfill';
   4 import * as _ from 'lodash';
   5 import { Subscription } from 'rxjs/Subscription';
   6
   7 import { HealthService } from '../../../shared/api/health.service';
   8 import { Permissions } from '../../../shared/models/permissions';
   9 import { AuthStorageService } from '../../../shared/services/auth-storage.service';
  10 import {
  11   FeatureTogglesMap$,
  12   FeatureTogglesService
  13 } from '../../../shared/services/feature-toggles.service';
  14 import { RefreshIntervalService } from '../../../shared/services/refresh-interval.service';
  15 import { PgCategoryService } from '../../shared/pg-category.service';
  16 import { HealthPieColor } from '../health-pie/health-pie-color.enum';
  17
  18 @Component({
  19   selector: 'cd-health',
  20   templateUrl: './health.component.html',
  21   styleUrls: ['./health.component.scss']
  22 })
  23 export class HealthComponent implements OnInit, OnDestroy {
  24   healthData: any;
  25   interval = new Subscription();
  26   permissions: Permissions;
  27   enabledFeature$: FeatureTogglesMap$;
  28
  29   constructor(
  30     private healthService: HealthService,
  31     private i18n: I18n,
  32     private authStorageService: AuthStorageService,
  33     private pgCategoryService: PgCategoryService,
  34     private featureToggles: FeatureTogglesService,
  35     private refreshIntervalService: RefreshIntervalService
  36   ) {
  37     this.permissions = this.authStorageService.getPermissions();
  38     this.enabledFeature$ = this.featureToggles.get();
  39   }
  40
  41   ngOnInit() {
  42     this.getHealth();
  43     this.interval = this.refreshIntervalService.intervalData$.subscribe(() => {
  44       this.getHealth();
  45     });
  46   }
  47
  48   ngOnDestroy() {
  49     this.interval.unsubscribe();
  50   }
  51
  52   getHealth() {
  53     this.healthService.getMinimalHealth().subscribe((data: any) => {
  54       this.healthData = data;
  55     });
  56   }
  57
  58   prepareReadWriteRatio(chart) {
  59     const ratioLabels = [];
  60     const ratioData = [];
  61
  62     ratioLabels.push(this.i18n('Writes'));
  63     ratioData.push(this.healthData.client_perf.write_op_per_sec);
  64     ratioLabels.push(this.i18n('Reads'));
  65     ratioData.push(this.healthData.client_perf.read_op_per_sec);
  66
  67     chart.dataset[0].data = ratioData;
  68     chart.labels = ratioLabels;
  69   }
  70
  71   prepareRawUsage(chart, data) {
  72     const percentAvailable = Math.round(
  73       100 *
  74         ((data.df.stats.total_bytes - data.df.stats.total_used_raw_bytes) /
  75           data.df.stats.total_bytes)
  76     );
  77
  78     const percentUsed = Math.round(
  79       100 * (data.df.stats.total_used_raw_bytes / data.df.stats.total_bytes)
  80     );
  81
  82     chart.dataset[0].data = [data.df.stats.total_used_raw_bytes, data.df.stats.total_avail_bytes];
  83     if (chart === 'doughnut') {
  84       chart.options.cutoutPercentage = 65;
  85     }
  86     chart.labels = [
  87       `${this.i18n('Used')} (${percentUsed}%)`,
  88       `${this.i18n('Avail.')} (${percentAvailable}%)`
  89     ];
  90   }
  91
  92   preparePgStatus(chart, data) {
  93     const categoryPgAmount = {};
  94     chart.labels = [
  95       this.i18n('Clean'),
  96       this.i18n('Working'),
  97       this.i18n('Warning'),
  98       this.i18n('Unknown')
  99     ];
 100     chart.colors = [
 101       {
 102         backgroundColor: [
 103           HealthPieColor.DEFAULT_GREEN,
 104           HealthPieColor.DEFAULT_BLUE,
 105           HealthPieColor.DEFAULT_ORANGE,
 106           HealthPieColor.DEFAULT_RED
 107         ]
 108       }
 109     ];
 110
 111     _.forEach(data.pg_info.statuses, (pgAmount, pgStatesText) => {
 112       const categoryType = this.pgCategoryService.getTypeByStates(pgStatesText);
 113
 114       if (_.isUndefined(categoryPgAmount[categoryType])) {
 115         categoryPgAmount[categoryType] = 0;
 116       }
 117       categoryPgAmount[categoryType] += pgAmount;
 118     });
 119
 120     chart.dataset[0].data = this.pgCategoryService
 121       .getAllTypes()
 122       .map((categoryType) => categoryPgAmount[categoryType]);
 123   }
 124
 125   isClientReadWriteChartShowable() {
 126     const readOps = this.healthData.client_perf.read_op_per_sec || 0;
 127     const writeOps = this.healthData.client_perf.write_op_per_sec || 0;
 128
 129     return readOps + writeOps > 0;
 130   }
 131 }