git.apps.os.sepia.ceph.com Git - ceph-ci.git/blob

   1 import { Component, OnDestroy, OnInit } from '@angular/core';
   2
   3 import _ from 'lodash';
   4 import { Observable, ReplaySubject, Subscription, of } from 'rxjs';
   5
   6 import { Permissions } from '~/app/shared/models/permissions';
   7 import { AuthStorageService } from '~/app/shared/services/auth-storage.service';
   8 import { RefreshIntervalService } from '~/app/shared/services/refresh-interval.service';
   9 import { RgwDaemonService } from '~/app/shared/api/rgw-daemon.service';
  10 import { RgwRealmService } from '~/app/shared/api/rgw-realm.service';
  11 import { RgwZoneService } from '~/app/shared/api/rgw-zone.service';
  12 import { RgwZonegroupService } from '~/app/shared/api/rgw-zonegroup.service';
  13 import { RgwBucketService } from '~/app/shared/api/rgw-bucket.service';
  14 import { PrometheusService } from '~/app/shared/api/prometheus.service';
  15
  16 import { RgwPromqls as queries } from '~/app/shared/enum/dashboard-promqls.enum';
  17 import { HealthService } from '~/app/shared/api/health.service';
  18 import { Icons } from '~/app/shared/enum/icons.enum';
  19 import { RgwMultisiteService } from '~/app/shared/api/rgw-multisite.service';
  20 import { catchError, shareReplay, switchMap, tap } from 'rxjs/operators';
  21
  22 @Component({
  23   selector: 'cd-rgw-overview-dashboard',
  24   templateUrl: './rgw-overview-dashboard.component.html',
  25   styleUrls: ['./rgw-overview-dashboard.component.scss']
  26 })
  27 export class RgwOverviewDashboardComponent implements OnInit, OnDestroy {
  28   icons = Icons;
  29
  30   interval = new Subscription();
  31   permissions: Permissions;
  32   rgwDaemonCount = 0;
  33   rgwRealmCount = 0;
  34   rgwZonegroupCount = 0;
  35   rgwZoneCount = 0;
  36   rgwBucketCount = 0;
  37   objectCount = 0;
  38   UserCount = 0;
  39   totalPoolUsedBytes = 0;
  40   averageObjectSize = 0;
  41   realmData: any;
  42   daemonSub: Subscription;
  43   realmSub: Subscription;
  44   multisiteInfo: object[] = [];
  45   ZonegroupSub: Subscription;
  46   ZoneSUb: Subscription;
  47   HealthSub: Subscription;
  48   BucketSub: Subscription;
  49   queriesResults: { [key: string]: [] } = {
  50     RGW_REQUEST_PER_SECOND: [],
  51     BANDWIDTH: [],
  52     AVG_GET_LATENCY: [],
  53     AVG_PUT_LATENCY: []
  54   };
  55   timerGetPrometheusDataSub: Subscription;
  56   chartTitles = ['Metadata Sync', 'Data Sync'];
  57   realm: string;
  58   zonegroup: string;
  59   zone: string;
  60   metadataSyncInfo: string;
  61   replicaZonesInfo: any = [];
  62   metadataSyncData: {};
  63   showMultisiteCard = true;
  64   loading = true;
  65   multisiteSyncStatus$: Observable<any>;
  66   subject = new ReplaySubject<any>();
  67   syncCardLoading = true;
  68
  69   constructor(
  70     private authStorageService: AuthStorageService,
  71     private healthService: HealthService,
  72     private refreshIntervalService: RefreshIntervalService,
  73     private rgwDaemonService: RgwDaemonService,
  74     private rgwRealmService: RgwRealmService,
  75     private rgwZonegroupService: RgwZonegroupService,
  76     private rgwZoneService: RgwZoneService,
  77     private rgwBucketService: RgwBucketService,
  78     private prometheusService: PrometheusService,
  79     private rgwMultisiteService: RgwMultisiteService
  80   ) {
  81     this.permissions = this.authStorageService.getPermissions();
  82   }
  83
  84   ngOnInit() {
  85     this.interval = this.refreshIntervalService.intervalData$.subscribe(() => {
  86       this.daemonSub = this.rgwDaemonService.list().subscribe((data: any) => {
  87         this.rgwDaemonCount = data.length;
  88       });
  89       this.HealthSub = this.healthService.getClusterCapacity().subscribe((data: any) => {
  90         this.objectCount = data['total_objects'];
  91         this.totalPoolUsedBytes = data['total_pool_bytes_used'];
  92         this.averageObjectSize = data['average_object_size'];
  93       });
  94       setTimeout(() => {
  95         this.getSyncStatus();
  96       });
  97     });
  98     this.BucketSub = this.rgwBucketService
  99       .getTotalBucketsAndUsersLength()
 100       .subscribe((data: any) => {
 101         this.rgwBucketCount = data['buckets_count'];
 102         this.UserCount = data['users_count'];
 103       });
 104     this.realmSub = this.rgwRealmService.list().subscribe((data: any) => {
 105       this.rgwRealmCount = data['realms'].length;
 106     });
 107     this.ZonegroupSub = this.rgwZonegroupService.list().subscribe((data: any) => {
 108       this.rgwZonegroupCount = data['zonegroups'].length;
 109     });
 110     this.ZoneSUb = this.rgwZoneService.list().subscribe((data: any) => {
 111       this.rgwZoneCount = data['zones'].length;
 112     });
 113     this.getPrometheusData(this.prometheusService.lastHourDateObject);
 114     this.multisiteSyncStatus$ = this.subject.pipe(
 115       switchMap(() =>
 116         this.rgwMultisiteService.getSyncStatus().pipe(
 117           tap((data: any) => {
 118             this.loading = false;
 119             this.replicaZonesInfo = data['dataSyncInfo'];
 120             this.metadataSyncInfo = data['metadataSyncInfo'];
 121             if (this.replicaZonesInfo.length === 0) {
 122               this.showMultisiteCard = false;
 123               this.syncCardLoading = false;
 124               this.loading = false;
 125             }
 126             [this.realm, this.zonegroup, this.zone] = data['primaryZoneData'];
 127           }),
 128           catchError((err) => {
 129             this.showMultisiteCard = false;
 130             this.syncCardLoading = false;
 131             this.loading = false;
 132             err.preventDefault();
 133             return of(true);
 134           })
 135         )
 136       ),
 137       shareReplay(1)
 138     );
 139   }
 140
 141   ngOnDestroy() {
 142     this.interval.unsubscribe();
 143     this.daemonSub.unsubscribe();
 144     this.realmSub.unsubscribe();
 145     this.ZonegroupSub.unsubscribe();
 146     this.ZoneSUb.unsubscribe();
 147     this.BucketSub.unsubscribe();
 148     this.HealthSub.unsubscribe();
 149     this.prometheusService.unsubscribe();
 150   }
 151
 152   getPrometheusData(selectedTime: any) {
 153     this.queriesResults = this.prometheusService.getPrometheusQueriesData(
 154       selectedTime,
 155       queries,
 156       this.queriesResults,
 157       true
 158     );
 159   }
 160
 161   getSyncStatus() {
 162     this.subject.next();
 163   }
 164
 165   trackByFn(zone: any) {
 166     return zone;
 167   }
 168 }