git.apps.os.sepia.ceph.com Git - ceph.git/blob

   1 import {
   2   Component, EventEmitter, Input, OnInit, Output, TemplateRef, ViewChild
   3 } from '@angular/core';
   4 import { FormControl, FormGroup, FormGroupDirective, Validators } from '@angular/forms';
   5
   6 import { BsModalRef, BsModalService } from 'ngx-bootstrap';
   7 import { Observable } from 'rxjs/Observable';
   8
   9 import { SubmitButtonComponent } from '../submit-button/submit-button.component';
  10
  11 @Component({
  12   selector: 'cd-deletion-link',
  13   templateUrl: './deletion-link.component.html',
  14   styleUrls: ['./deletion-link.component.scss']
  15 })
  16 export class DeletionLinkComponent implements OnInit {
  17   @ViewChild(SubmitButtonComponent) submitButton: SubmitButtonComponent;
  18   @Input() metaType: string;
  19   @Input() pattern = 'yes';
  20   @Input() deletionObserver: () => Observable<any>;
  21   @Output() toggleDeletion = new EventEmitter();
  22   bsModalRef: BsModalRef;
  23   deletionForm: FormGroup;
  24   confirmation: FormControl;
  25   delete: Function;
  26
  27   constructor(public modalService: BsModalService) {}
  28
  29   ngOnInit() {
  30     this.confirmation = new FormControl('', {
  31       validators: [
  32         Validators.required,
  33         Validators.pattern(this.pattern)
  34       ],
  35       updateOn: 'blur'
  36     });
  37     this.deletionForm = new FormGroup({
  38       confirmation: this.confirmation
  39     });
  40   }
  41
  42   showModal(template: TemplateRef<any>) {
  43     this.deletionForm.reset();
  44     this.bsModalRef = this.modalService.show(template);
  45     this.delete = () => {
  46       this.submitButton.submit();
  47     };
  48   }
  49
  50   invalidControl(submitted: boolean, error?: string): boolean {
  51     const control = this.confirmation;
  52     return !!(
  53       (submitted || control.dirty) &&
  54       control.invalid &&
  55       (error ? control.errors[error] : true)
  56     );
  57   }
  58
  59   updateConfirmation($e) {
  60     if ($e.key !== 'Enter') {
  61       return;
  62     }
  63     this.confirmation.setValue($e.target.value);
  64     this.confirmation.markAsDirty();
  65     this.confirmation.updateValueAndValidity();
  66   }
  67
  68   deletionCall() {
  69     if (this.deletionObserver) {
  70       this.deletionObserver().subscribe(
  71         undefined,
  72         () => this.stopLoadingSpinner(),
  73         () => this.hideModal()
  74       );
  75     } else {
  76       this.toggleDeletion.emit();
  77     }
  78   }
  79
  80   hideModal() {
  81     this.bsModalRef.hide();
  82   }
  83
  84   stopLoadingSpinner() {
  85     this.submitButton.loading = false;
  86   }
  87 }