]> git.apps.os.sepia.ceph.com Git - ceph.git/blob
070d338670e9c5ae6e853fbc5129e2463f713e42
[ceph.git] /
1 import { AfterViewInit, Component, EventEmitter, Output, ViewChild } from '@angular/core';
2
3 import * as _ from 'lodash';
4 import { BsModalRef } from 'ngx-bootstrap/modal';
5
6 import { TableColumnProp } from '@swimlane/ngx-datatable';
7 import { ActionLabelsI18n } from '../../../../shared/constants/app.constants';
8 import { Icons } from '../../../../shared/enum/icons.enum';
9 import { CdFormBuilder } from '../../../../shared/forms/cd-form-builder';
10 import { CdFormGroup } from '../../../../shared/forms/cd-form-group';
11 import { CdTableColumnFiltersChange } from '../../../../shared/models/cd-table-column-filters-change';
12 import { InventoryDevice } from '../../inventory/inventory-devices/inventory-device.model';
13 import { InventoryDevicesComponent } from '../../inventory/inventory-devices/inventory-devices.component';
14
15 @Component({
16   selector: 'cd-osd-devices-selection-modal',
17   templateUrl: './osd-devices-selection-modal.component.html',
18   styleUrls: ['./osd-devices-selection-modal.component.scss']
19 })
20 export class OsdDevicesSelectionModalComponent implements AfterViewInit {
21   @ViewChild('inventoryDevices', { static: false })
22   inventoryDevices: InventoryDevicesComponent;
23
24   @Output()
25   submitAction = new EventEmitter<CdTableColumnFiltersChange>();
26
27   icons = Icons;
28   filterColumns: TableColumnProp[] = [];
29
30   hostname: string;
31   deviceType: string;
32   formGroup: CdFormGroup;
33   action: string;
34
35   devices: InventoryDevice[] = [];
36   filteredDevices: InventoryDevice[] = [];
37   capacity = 0;
38   event: CdTableColumnFiltersChange;
39   canSubmit = false;
40   requiredFilters: string[] = [];
41
42   constructor(
43     private formBuilder: CdFormBuilder,
44     public bsModalRef: BsModalRef,
45     public actionLabels: ActionLabelsI18n
46   ) {
47     this.action = actionLabels.ADD;
48     this.createForm();
49   }
50
51   ngAfterViewInit() {
52     // At least one filter other than hostname is required
53     // Extract the name from table columns for i18n strings
54     const cols = _.filter(this.inventoryDevices.columns, (col) => {
55       return this.filterColumns.includes(col.prop) && col.prop !== 'hostname';
56     });
57     this.requiredFilters = _.map(cols, 'name');
58   }
59
60   createForm() {
61     this.formGroup = this.formBuilder.group({});
62   }
63
64   onFilterChange(event: CdTableColumnFiltersChange) {
65     this.capacity = 0;
66     this.canSubmit = false;
67     if (_.isEmpty(event.filters)) {
68       // filters are cleared
69       this.filteredDevices = [];
70       this.event = undefined;
71     } else {
72       // at least one filter is required (except hostname)
73       const filters = event.filters.filter((filter) => {
74         return filter.prop !== 'hostname';
75       });
76       this.canSubmit = !_.isEmpty(filters);
77       this.filteredDevices = event.data;
78       this.capacity = _.sumBy(this.filteredDevices, 'sys_api.size');
79       this.event = event;
80     }
81   }
82
83   onSubmit() {
84     this.submitAction.emit(this.event);
85     this.bsModalRef.hide();
86   }
87 }