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

   1 import { Component, OnInit, ViewChild } from '@angular/core';
   2 import { AbstractControl, Validators } from '@angular/forms';
   3 import { Router } from '@angular/router';
   4
   5 import { NgbTypeahead } from '@ng-bootstrap/ng-bootstrap';
   6 import _ from 'lodash';
   7 import { merge, Observable, Subject } from 'rxjs';
   8 import { debounceTime, distinctUntilChanged, filter, map } from 'rxjs/operators';
   9
  10 import { CephServiceService } from '~/app/shared/api/ceph-service.service';
  11 import { HostService } from '~/app/shared/api/host.service';
  12 import { PoolService } from '~/app/shared/api/pool.service';
  13 import { SelectMessages } from '~/app/shared/components/select/select-messages.model';
  14 import { SelectOption } from '~/app/shared/components/select/select-option.model';
  15 import { ActionLabelsI18n, URLVerbs } from '~/app/shared/constants/app.constants';
  16 import { CdForm } from '~/app/shared/forms/cd-form';
  17 import { CdFormBuilder } from '~/app/shared/forms/cd-form-builder';
  18 import { CdFormGroup } from '~/app/shared/forms/cd-form-group';
  19 import { CdValidators } from '~/app/shared/forms/cd-validators';
  20 import { FinishedTask } from '~/app/shared/models/finished-task';
  21 import { TaskWrapperService } from '~/app/shared/services/task-wrapper.service';
  22
  23 @Component({
  24   selector: 'cd-service-form',
  25   templateUrl: './service-form.component.html',
  26   styleUrls: ['./service-form.component.scss']
  27 })
  28 export class ServiceFormComponent extends CdForm implements OnInit {
  29   @ViewChild(NgbTypeahead, { static: false })
  30   typeahead: NgbTypeahead;
  31
  32   serviceForm: CdFormGroup;
  33   action: string;
  34   resource: string;
  35   serviceTypes: string[] = [];
  36   hosts: any;
  37   labels: string[];
  38   labelClick = new Subject<string>();
  39   labelFocus = new Subject<string>();
  40   pools: Array<object>;
  41
  42   constructor(
  43     public actionLabels: ActionLabelsI18n,
  44     private cephServiceService: CephServiceService,
  45     private formBuilder: CdFormBuilder,
  46     private hostService: HostService,
  47     private poolService: PoolService,
  48     private router: Router,
  49     private taskWrapperService: TaskWrapperService
  50   ) {
  51     super();
  52     this.resource = $localize`service`;
  53     this.hosts = {
  54       options: [],
  55       messages: new SelectMessages({
  56         empty: $localize`There are no hosts.`,
  57         filter: $localize`Filter hosts`
  58       })
  59     };
  60     this.createForm();
  61   }
  62
  63   createForm() {
  64     this.serviceForm = this.formBuilder.group({
  65       // Global
  66       service_type: [null, [Validators.required]],
  67       service_id: [
  68         null,
  69         [
  70           CdValidators.requiredIf({
  71             service_type: 'mds'
  72           }),
  73           CdValidators.requiredIf({
  74             service_type: 'nfs'
  75           }),
  76           CdValidators.requiredIf({
  77             service_type: 'iscsi'
  78           }),
  79           CdValidators.composeIf(
  80             {
  81               service_type: 'rgw'
  82             },
  83             [
  84               Validators.required,
  85               CdValidators.custom('rgwPattern', (value: string) => {
  86                 if (_.isEmpty(value)) {
  87                   return false;
  88                 }
  89                 return !/^[^.]+\.[^.]+(\.[^.]+)?$/.test(value);
  90               })
  91             ]
  92           )
  93         ]
  94       ],
  95       placement: ['hosts'],
  96       label: [
  97         null,
  98         [
  99           CdValidators.requiredIf({
 100             placement: 'label',
 101             unmanaged: false
 102           })
 103         ]
 104       ],
 105       hosts: [[]],
 106       count: [null, [CdValidators.number(false), Validators.min(1)]],
 107       unmanaged: [false],
 108       // NFS & iSCSI
 109       pool: [
 110         null,
 111         [
 112           CdValidators.requiredIf({
 113             service_type: 'nfs',
 114             unmanaged: false
 115           }),
 116           CdValidators.requiredIf({
 117             service_type: 'iscsi',
 118             unmanaged: false
 119           })
 120         ]
 121       ],
 122       // NFS
 123       namespace: [null],
 124       // RGW
 125       rgw_frontend_port: [
 126         null,
 127         [CdValidators.number(false), Validators.min(1), Validators.max(65535)]
 128       ],
 129       // iSCSI
 130       trusted_ip_list: [null],
 131       api_port: [null, [CdValidators.number(false), Validators.min(1), Validators.max(65535)]],
 132       api_user: [
 133         null,
 134         [
 135           CdValidators.requiredIf({
 136             service_type: 'iscsi',
 137             unmanaged: false
 138           })
 139         ]
 140       ],
 141       api_password: [
 142         null,
 143         [
 144           CdValidators.requiredIf({
 145             service_type: 'iscsi',
 146             unmanaged: false
 147           })
 148         ]
 149       ],
 150       // RGW & iSCSI
 151       ssl: [false],
 152       ssl_cert: [
 153         '',
 154         [
 155           CdValidators.composeIf(
 156             {
 157               service_type: 'rgw',
 158               unmanaged: false,
 159               ssl: true
 160             },
 161             [Validators.required, CdValidators.sslCert()]
 162           ),
 163           CdValidators.composeIf(
 164             {
 165               service_type: 'iscsi',
 166               unmanaged: false,
 167               ssl: true
 168             },
 169             [Validators.required, CdValidators.sslCert()]
 170           )
 171         ]
 172       ],
 173       ssl_key: [
 174         '',
 175         [
 176           CdValidators.composeIf(
 177             {
 178               service_type: 'rgw',
 179               unmanaged: false,
 180               ssl: true
 181             },
 182             [Validators.required, CdValidators.sslPrivKey()]
 183           ),
 184           CdValidators.composeIf(
 185             {
 186               service_type: 'iscsi',
 187               unmanaged: false,
 188               ssl: true
 189             },
 190             [Validators.required, CdValidators.sslPrivKey()]
 191           )
 192         ]
 193       ]
 194     });
 195   }
 196
 197   ngOnInit(): void {
 198     this.action = this.actionLabels.CREATE;
 199     this.cephServiceService.getKnownTypes().subscribe((resp: Array<string>) => {
 200       // Remove service types:
 201       // osd       - This is deployed a different way.
 202       // container - This should only be used in the CLI.
 203       this.serviceTypes = _.difference(resp, ['container', 'osd']).sort();
 204     });
 205     this.hostService.list().subscribe((resp: object[]) => {
 206       const options: SelectOption[] = [];
 207       _.forEach(resp, (host: object) => {
 208         if (_.get(host, 'sources.orchestrator', false)) {
 209           const option = new SelectOption(false, _.get(host, 'hostname'), '');
 210           options.push(option);
 211         }
 212       });
 213       this.hosts.options = [...options];
 214     });
 215     this.hostService.getLabels().subscribe((resp: string[]) => {
 216       this.labels = resp;
 217     });
 218     this.poolService.getList().subscribe((resp: Array<object>) => {
 219       this.pools = resp;
 220     });
 221   }
 222
 223   goToListView() {
 224     this.router.navigate(['/services']);
 225   }
 226
 227   searchLabels = (text$: Observable<string>) => {
 228     return merge(
 229       text$.pipe(debounceTime(200), distinctUntilChanged()),
 230       this.labelFocus,
 231       this.labelClick.pipe(filter(() => !this.typeahead.isPopupOpen()))
 232     ).pipe(
 233       map((value) =>
 234         this.labels
 235           .filter((label: string) => label.toLowerCase().indexOf(value.toLowerCase()) > -1)
 236           .slice(0, 10)
 237       )
 238     );
 239   };
 240
 241   fileUpload(files: FileList, controlName: string) {
 242     const file: File = files[0];
 243     const reader = new FileReader();
 244     reader.addEventListener('load', (event: ProgressEvent<FileReader>) => {
 245       const control: AbstractControl = this.serviceForm.get(controlName);
 246       control.setValue(event.target.result);
 247       control.markAsDirty();
 248       control.markAsTouched();
 249       control.updateValueAndValidity();
 250     });
 251     reader.readAsText(file, 'utf8');
 252   }
 253
 254   onSubmit() {
 255     const self = this;
 256     const values: object = this.serviceForm.value;
 257     const serviceId: string = values['service_id'];
 258     const serviceType: string = values['service_type'];
 259     const serviceSpec: object = {
 260       service_type: serviceType,
 261       placement: {},
 262       unmanaged: values['unmanaged']
 263     };
 264     let serviceName: string = serviceType;
 265     if (_.isString(serviceId) && !_.isEmpty(serviceId)) {
 266       serviceName = `${serviceType}.${serviceId}`;
 267       serviceSpec['service_id'] = serviceId;
 268     }
 269     if (!values['unmanaged']) {
 270       switch (values['placement']) {
 271         case 'hosts':
 272           if (values['hosts'].length > 0) {
 273             serviceSpec['placement']['hosts'] = values['hosts'];
 274           }
 275           break;
 276         case 'label':
 277           serviceSpec['placement']['label'] = values['label'];
 278           break;
 279       }
 280       if (_.isNumber(values['count']) && values['count'] > 0) {
 281         serviceSpec['placement']['count'] = values['count'];
 282       }
 283       switch (serviceType) {
 284         case 'nfs':
 285           serviceSpec['pool'] = values['pool'];
 286           if (_.isString(values['namespace']) && !_.isEmpty(values['namespace'])) {
 287             serviceSpec['namespace'] = values['namespace'];
 288           }
 289           break;
 290         case 'rgw':
 291           if (_.isNumber(values['rgw_frontend_port']) && values['rgw_frontend_port'] > 0) {
 292             serviceSpec['rgw_frontend_port'] = values['rgw_frontend_port'];
 293           }
 294           serviceSpec['ssl'] = values['ssl'];
 295           if (values['ssl']) {
 296             serviceSpec['rgw_frontend_ssl_certificate'] = values['ssl_cert'].trim();
 297             serviceSpec['rgw_frontend_ssl_key'] = values['ssl_key'].trim();
 298           }
 299           break;
 300         case 'iscsi':
 301           serviceSpec['pool'] = values['pool'];
 302           if (_.isString(values['trusted_ip_list']) && !_.isEmpty(values['trusted_ip_list'])) {
 303             serviceSpec['trusted_ip_list'] = values['trusted_ip_list'].trim();
 304           }
 305           if (_.isNumber(values['api_port']) && values['api_port'] > 0) {
 306             serviceSpec['api_port'] = values['api_port'];
 307           }
 308           serviceSpec['api_user'] = values['api_user'];
 309           serviceSpec['api_password'] = values['api_password'];
 310           serviceSpec['api_secure'] = values['ssl'];
 311           if (values['ssl']) {
 312             serviceSpec['ssl_cert'] = values['ssl_cert'].trim();
 313             serviceSpec['ssl_key'] = values['ssl_key'].trim();
 314           }
 315           break;
 316       }
 317     }
 318     this.taskWrapperService
 319       .wrapTaskAroundCall({
 320         task: new FinishedTask(`service/${URLVerbs.CREATE}`, {
 321           service_name: serviceName
 322         }),
 323         call: this.cephServiceService.create(serviceSpec)
 324       })
 325       .subscribe({
 326         error() {
 327           self.serviceForm.setErrors({ cdSubmitButton: true });
 328         },
 329         complete() {
 330           self.goToListView();
 331         }
 332       });
 333   }
 334 }