ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-daemon-list/service-daemon-list.component.ts

   1 import {
   2   AfterViewInit,
   3   Component,
   4   Input,
   5   OnChanges,
   6   OnDestroy,
   7   OnInit,
   8   QueryList,
   9   TemplateRef,
  10   ViewChild,
  11   ViewChildren
  12 } from '@angular/core';
  13 import { I18n } from '@ngx-translate/i18n-polyfill';
  14
  15 import * as _ from 'lodash';
  16
  17 import { Observable, Subscription } from 'rxjs';
  18 import { CephServiceService } from '../../../../shared/api/ceph-service.service';
  19 import { HostService } from '../../../../shared/api/host.service';
  20 import { OrchestratorService } from '../../../../shared/api/orchestrator.service';
  21 import { TableComponent } from '../../../../shared/datatable/table/table.component';
  22 import { CellTemplate } from '../../../../shared/enum/cell-template.enum';
  23 import { CdTableColumn } from '../../../../shared/models/cd-table-column';
  24 import { CdTableFetchDataContext } from '../../../../shared/models/cd-table-fetch-data-context';
  25 import { Daemon } from '../../../../shared/models/daemon.interface';
  26
  27 @Component({
  28   selector: 'cd-service-daemon-list',
  29   templateUrl: './service-daemon-list.component.html',
  30   styleUrls: ['./service-daemon-list.component.scss']
  31 })
  32 export class ServiceDaemonListComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
  33   @ViewChild('statusTpl', { static: true })
  34   statusTpl: TemplateRef<any>;
  35
  36   @ViewChildren('daemonsTable')
  37   daemonsTableTpls: QueryList<TemplateRef<TableComponent>>;
  38
  39   @Input()
  40   serviceName?: string;
  41
  42   @Input()
  43   hostname?: string;
  44
  45   daemons: Daemon[] = [];
  46   columns: CdTableColumn[] = [];
  47
  48   hasOrchestrator = false;
  49
  50   private daemonsTable: TableComponent;
  51   private daemonsTableTplsSub: Subscription;
  52
  53   constructor(
  54     private i18n: I18n,
  55     private hostService: HostService,
  56     private cephServiceService: CephServiceService,
  57     private orchService: OrchestratorService
  58   ) {}
  59
  60   ngOnInit() {
  61     this.columns = [
  62       {
  63         name: this.i18n('Hostname'),
  64         prop: 'hostname',
  65         flexGrow: 1,
  66         filterable: true
  67       },
  68       {
  69         name: this.i18n('Daemon type'),
  70         prop: 'daemon_type',
  71         flexGrow: 1,
  72         filterable: true
  73       },
  74       {
  75         name: this.i18n('Daemon ID'),
  76         prop: 'daemon_id',
  77         flexGrow: 1,
  78         filterable: true
  79       },
  80       {
  81         name: this.i18n('Container ID'),
  82         prop: 'container_id',
  83         flexGrow: 3,
  84         filterable: true,
  85         cellTransformation: CellTemplate.truncate,
  86         customTemplateConfig: {
  87           length: 12
  88         }
  89       },
  90       {
  91         name: this.i18n('Container Image name'),
  92         prop: 'container_image_name',
  93         flexGrow: 3,
  94         filterable: true
  95       },
  96       {
  97         name: this.i18n('Container Image ID'),
  98         prop: 'container_image_id',
  99         flexGrow: 3,
 100         filterable: true,
 101         cellTransformation: CellTemplate.truncate,
 102         customTemplateConfig: {
 103           length: 12
 104         }
 105       },
 106       {
 107         name: this.i18n('Version'),
 108         prop: 'version',
 109         flexGrow: 1,
 110         filterable: true
 111       },
 112       {
 113         name: this.i18n('Status'),
 114         prop: 'status_desc',
 115         flexGrow: 1,
 116         filterable: true,
 117         cellTemplate: this.statusTpl
 118       },
 119       {
 120         name: this.i18n('Last Refreshed'),
 121         prop: 'last_refresh',
 122         flexGrow: 2
 123       }
 124     ];
 125
 126     this.orchService.status().subscribe((data: { available: boolean }) => {
 127       this.hasOrchestrator = data.available;
 128     });
 129   }
 130
 131   ngOnChanges() {
 132     if (!_.isUndefined(this.daemonsTable)) {
 133       this.daemonsTable.reloadData();
 134     }
 135   }
 136
 137   ngAfterViewInit() {
 138     this.daemonsTableTplsSub = this.daemonsTableTpls.changes.subscribe(
 139       (tableRefs: QueryList<TableComponent>) => {
 140         this.daemonsTable = tableRefs.first;
 141       }
 142     );
 143   }
 144
 145   ngOnDestroy() {
 146     if (this.daemonsTableTplsSub) {
 147       this.daemonsTableTplsSub.unsubscribe();
 148     }
 149   }
 150
 151   getStatusClass(status: number) {
 152     return _.get(
 153       {
 154         '-1': 'badge-danger',
 155         '0': 'badge-warning',
 156         '1': 'badge-success'
 157       },
 158       status,
 159       'badge-dark'
 160     );
 161   }
 162
 163   getDaemons(context: CdTableFetchDataContext) {
 164     let observable: Observable<Daemon[]>;
 165     if (this.hostname) {
 166       observable = this.hostService.getDaemons(this.hostname);
 167     } else if (this.serviceName) {
 168       observable = this.cephServiceService.getDaemons(this.serviceName);
 169     } else {
 170       this.daemons = [];
 171       return;
 172     }
 173     observable.subscribe(
 174       (daemons: Daemon[]) => {
 175         this.daemons = daemons;
 176       },
 177       () => {
 178         this.daemons = [];
 179         context.error();
 180       }
 181     );
 182   }
 183 }