webapp/src/app/pages/confirm/confirm-modal/confirm-modal.component.ts

   1 /**
   2 * @license
   3 * Copyright (C) 2017-2018 "IoT.bzh"
   4 * Author Sebastien Douheret <sebastien@iot.bzh>
   5 *
   6 * Licensed under the Apache License, Version 2.0 (the "License");
   7 * you may not use this file except in compliance with the License.
   8 * You may obtain a copy of the License at
   9 *
  10 *   http://www.apache.org/licenses/LICENSE-2.0
  11 *
  12 * Unless required by applicable law or agreed to in writing, software
  13 * distributed under the License is distributed on an "AS IS" BASIS,
  14 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15 * See the License for the specific language governing permissions and
  16 * limitations under the License.
  17 */
  18
  19 import { Component, OnInit, Input } from '@angular/core';
  20 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
  21
  22 export enum EType {
  23   YesNo = 1,
  24   OKCancel,
  25   OK,
  26   Cancel,
  27 }
  28
  29 @Component({
  30   selector: 'xds-confirm-modal',
  31   template: `
  32   <div tabindex="-1">
  33     <div class="modal-header">
  34       {{ title }}
  35     </div>
  36
  37     <div class="modal-body row">
  38       <div class="col-12 text-center">
  39         <div [innerHtml]="question"></div>
  40       </div>
  41       <div class="col-12 text-center" style="margin-top: 2em;">
  42         <button *ngIf="textBtn[0] != ''"
  43                 type="button"
  44                 class="btn btn-md btn-primary"
  45                 tabindex="2"
  46                 (click)="onClick(textBtn[0])"> {{textBtn[0]}}
  47         </button>
  48
  49         <button *ngIf="textBtn[1] != ''"
  50                 type="button"
  51                 class="btn btn-md btn-secondary"
  52                 tabindex="1"
  53                 (click)="onClick(textBtn[1])"> {{textBtn[1]}}
  54         </button>
  55       </div>
  56     </div>
  57
  58     <div *ngIf="footer!=''" class="modal-footer">
  59       <div class="col-12 text-center">
  60         <div [innerHtml]="footer"></div>
  61       </div>
  62     </div>
  63   </div>
  64   `,
  65 })
  66
  67 export class ConfirmModalComponent implements OnInit {
  68   @Input() title;
  69   @Input() footer = '';
  70   @Input() type;
  71   @Input() question;
  72
  73   bodyQuestion = '';
  74   textBtn: Array<string> = ['', ''];
  75
  76   constructor(
  77     private modalRef: NgbActiveModal,
  78   ) { }
  79
  80
  81   ngOnInit() {
  82     switch (this.type) {
  83       case EType.OK:
  84         this.textBtn = [ 'OK', '' ];
  85         break;
  86
  87       case EType.Cancel:
  88         this.textBtn = [ '', 'Cancel' ];
  89       break;
  90
  91       case EType.OKCancel:
  92         this.textBtn = [ 'OK', 'Cancel' ];
  93       break;
  94
  95       default:
  96       case EType.YesNo:
  97         this.textBtn = [ 'Yes', 'No' ];
  98         break;
  99     }
 100   }
 101
 102   onClick(txt: string): void {
 103     this.modalRef.close(txt.toLowerCase());
 104   }
 105 }