ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form-client/nfs-form-client.component.ts

   1 import { Component, ContentChild, Input, OnInit, TemplateRef } from '@angular/core';
   2 import { UntypedFormArray, UntypedFormControl, NgForm, Validators } from '@angular/forms';
   3
   4 import _ from 'lodash';
   5
   6 import { NfsService } from '~/app/shared/api/nfs.service';
   7 import { Icons } from '~/app/shared/enum/icons.enum';
   8 import { CdFormGroup } from '~/app/shared/forms/cd-form-group';
   9
  10 @Component({
  11   selector: 'cd-nfs-form-client',
  12   templateUrl: './nfs-form-client.component.html',
  13   styleUrls: ['./nfs-form-client.component.scss']
  14 })
  15 export class NfsFormClientComponent implements OnInit {
  16   @Input()
  17   form: CdFormGroup;
  18
  19   @Input()
  20   clients: any[];
  21
  22   @ContentChild('squashHelper', { static: true }) squashHelperTpl: TemplateRef<any>;
  23
  24   nfsSquash: any[] = [];
  25   nfsAccessType: any[] = [];
  26   icons = Icons;
  27   clientsFormArray: UntypedFormArray;
  28
  29   constructor(private nfsService: NfsService) {}
  30
  31   ngOnInit() {
  32     this.nfsSquash = Object.keys(this.nfsService.nfsSquash);
  33     this.nfsAccessType = this.nfsService.nfsAccessType;
  34     _.forEach(this.clients, (client) => {
  35       const fg = this.addClient();
  36       fg.patchValue(client);
  37     });
  38     this.clientsFormArray = this.form.get('clients') as UntypedFormArray;
  39   }
  40
  41   getNoAccessTypeDescr() {
  42     if (this.form.getValue('access_type')) {
  43       return `${this.form.getValue('access_type')} ${$localize`(inherited from global config)`}`;
  44     }
  45     return $localize`-- Select the access type --`;
  46   }
  47
  48   getAccessTypeHelp(index: number) {
  49     const accessTypeItem = this.nfsAccessType.find((currentAccessTypeItem) => {
  50       return this.getValue(index, 'access_type') === currentAccessTypeItem.value;
  51     });
  52     return _.isObjectLike(accessTypeItem) ? accessTypeItem.help : '';
  53   }
  54
  55   getNoSquashDescr() {
  56     if (this.form.getValue('squash')) {
  57       return `${this.form.getValue('squash')} (${$localize`inherited from global config`})`;
  58     }
  59     return $localize`-- Select what kind of user id squashing is performed --`;
  60   }
  61
  62   addClient() {
  63     this.clientsFormArray = this.form.get('clients') as UntypedFormArray;
  64
  65     const REGEX_IP = `(([0-9]{1,3})\\.([0-9]{1,3})\\.([0-9]{1,3})\.([0-9]{1,3})([/](\\d|[1-2]\\d|3[0-2]))?)`;
  66     const REGEX_LIST_IP = `${REGEX_IP}([ ,]{1,2}${REGEX_IP})*`;
  67     const fg = new CdFormGroup({
  68       addresses: new UntypedFormControl('', {
  69         validators: [Validators.required, Validators.pattern(REGEX_LIST_IP)]
  70       }),
  71       access_type: new UntypedFormControl(''),
  72       squash: new UntypedFormControl('')
  73     });
  74
  75     this.clientsFormArray.push(fg);
  76     return fg;
  77   }
  78
  79   removeClient(index: number) {
  80     this.clientsFormArray = this.form.get('clients') as UntypedFormArray;
  81     this.clientsFormArray.removeAt(index);
  82   }
  83
  84   showError(index: number, control: string, formDir: NgForm, x: string) {
  85     return (<any>this.form.controls.clients).controls[index].showError(control, formDir, x);
  86   }
  87
  88   getValue(index: number, control: string) {
  89     this.clientsFormArray = this.form.get('clients') as UntypedFormArray;
  90     const client = this.clientsFormArray.at(index) as CdFormGroup;
  91     return client.getValue(control);
  92   }
  93
  94   trackByFn(index: number) {
  95     return index;
  96   }
  97 }