File

src/app/ceph/block/mirroring/pool-edit-mode-modal/pool-edit-mode-modal.component.ts

Implements

OnInit OnDestroy

Metadata

selector cd-pool-edit-mode-modal
styleUrls ./pool-edit-mode-modal.component.scss
templateUrl ./pool-edit-mode-modal.component.html

Index

Properties
Methods

Constructor

constructor(modalRef: BsModalRef, i18n: I18n, rbdMirroringService: RbdMirroringService, taskWrapper: TaskWrapperService)
Parameters :
Name Type Optional
modalRef BsModalRef No
i18n I18n No
rbdMirroringService RbdMirroringService No
taskWrapper TaskWrapperService No

Methods

createForm
createForm()
Returns : void
ngOnDestroy
ngOnDestroy()
Returns : void
ngOnInit
ngOnInit()
Returns : void
setResponse
setResponse(response: PoolEditModeResponseModel)
Parameters :
Name Type Optional
response PoolEditModeResponseModel No
Returns : void
update
update()
Returns : void
validateMode
validateMode(control: AbstractControl)
Parameters :
Name Type Optional
control AbstractControl No
Returns : { cannotDisable: { value: any; }; }

Properties

bsConfig
Type : object
Default value : { containerClass: 'theme-default' }
editModeForm
Type : CdFormGroup
mirrorModes
Type : Array<literal type>
Default value : [ { id: 'disabled', name: this.i18n('Disabled') }, { id: 'pool', name: this.i18n('Pool') }, { id: 'image', name: this.i18n('Image') } ]
Public modalRef
Type : BsModalRef
pattern
Type : string
peerExists
Default value : false
poolName
Type : string
response
Type : PoolEditModeResponseModel
subs
Type : Subscription
import { Component, OnDestroy, OnInit } from '@angular/core';
import { AbstractControl, FormControl, Validators } from '@angular/forms';

import { I18n } from '@ngx-translate/i18n-polyfill';
import { BsModalRef } from 'ngx-bootstrap/modal';
import { Subscription } from 'rxjs';

import { RbdMirroringService } from '../../../../shared/api/rbd-mirroring.service';
import { CdFormGroup } from '../../../../shared/forms/cd-form-group';
import { FinishedTask } from '../../../../shared/models/finished-task';
import { TaskWrapperService } from '../../../../shared/services/task-wrapper.service';
import { PoolEditModeResponseModel } from './pool-edit-mode-response.model';

@Component({
  selector: 'cd-pool-edit-mode-modal',
  templateUrl: './pool-edit-mode-modal.component.html',
  styleUrls: ['./pool-edit-mode-modal.component.scss']
})
export class PoolEditModeModalComponent implements OnInit, OnDestroy {
  poolName: string;

  subs: Subscription;

  editModeForm: CdFormGroup;
  bsConfig = {
    containerClass: 'theme-default'
  };
  pattern: string;

  response: PoolEditModeResponseModel;
  peerExists = false;

  mirrorModes: Array<{ id: string; name: string }> = [
    { id: 'disabled', name: this.i18n('Disabled') },
    { id: 'pool', name: this.i18n('Pool') },
    { id: 'image', name: this.i18n('Image') }
  ];

  constructor(
    public modalRef: BsModalRef,
    private i18n: I18n,
    private rbdMirroringService: RbdMirroringService,
    private taskWrapper: TaskWrapperService
  ) {
    this.createForm();
  }

  createForm() {
    this.editModeForm = new CdFormGroup({
      mirrorMode: new FormControl('', {
        validators: [Validators.required, this.validateMode.bind(this)]
      })
    });
  }

  ngOnInit() {
    this.pattern = `${this.poolName}`;
    this.rbdMirroringService.getPool(this.poolName).subscribe((resp: PoolEditModeResponseModel) => {
      this.setResponse(resp);
    });

    this.subs = this.rbdMirroringService.subscribeSummary((data: any) => {
      this.peerExists = false;
      if (!data) {
        return;
      }

      const poolData = data.content_data.pools;
      const pool = poolData.find((o) => this.poolName === o['name']);
      this.peerExists = pool && pool['peer_uuids'].length;
    });
  }

  ngOnDestroy(): void {
    this.subs.unsubscribe();
  }

  validateMode(control: AbstractControl) {
    if (control.value === 'disabled' && this.peerExists) {
      return { cannotDisable: { value: control.value } };
    }
    return null;
  }

  setResponse(response: PoolEditModeResponseModel) {
    this.editModeForm.get('mirrorMode').setValue(response.mirror_mode);
  }

  update() {
    const request = new PoolEditModeResponseModel();
    request.mirror_mode = this.editModeForm.getValue('mirrorMode');

    const action = this.taskWrapper.wrapTaskAroundCall({
      task: new FinishedTask('rbd/mirroring/pool/edit', {
        pool_name: this.poolName
      }),
      call: this.rbdMirroringService.updatePool(this.poolName, request)
    });

    action.subscribe(
      undefined,
      () => this.editModeForm.setErrors({ cdSubmitButton: true }),
      () => {
        this.rbdMirroringService.refresh();
        this.modalRef.hide();
      }
    );
  }
}
<cd-modal>
  <ng-container i18n
                class="modal-title">Edit pool mirror mode</ng-container>

  <ng-container class="modal-content">
    <form name="editModeForm"
          class="form"
          #formDir="ngForm"
          [formGroup]="editModeForm"
          novalidate>
      <div class="modal-body">
        <p>
          <ng-container i18n>To edit the mirror mode for pool&nbsp;
          <kbd>{{ poolName }}</kbd>, select a new mode from the list and click&nbsp;
          <kbd>Update</kbd>.</ng-container>
        </p>

        <div class="form-group"
             [ngClass]="{'has-error': editModeForm.showError('mirrorMode', formDir)}">
          <label class="control-label"
                 for="mirrorMode">
            <span i18n>Mode</span>
          </label>
          <select id="mirrorMode"
                  name="mirrorMode"
                  class="form-control"
                  formControlName="mirrorMode">
            <option *ngFor="let mirrorMode of mirrorModes"
                    [value]="mirrorMode.id">{{ mirrorMode.name }}</option>
          </select>
          <span class="help-block"
                *ngIf="editModeForm.showError('mirrorMode', formDir, 'cannotDisable')"
                i18n>Peer clusters must be removed prior to disabling mirror.</span>
        </div>
      </div>

      <div class="modal-footer">
        <div class="button-group text-right">
          <cd-submit-button i18n
                            [form]="editModeForm"
                            (submitAction)="update()">Update</cd-submit-button>
          <cd-back-button [back]="modalRef.hide"
                          name="Cancel"
                          i18n-name>
          </cd-back-button>
        </div>
      </div>
    </form>
  </ng-container>
</cd-modal>

./pool-edit-mode-modal.component.scss

Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""