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

   1 <div class="modal-header">
   2   <h4 i18n="form title|Example: Create Pool@@formTitle"
   3       class="modal-title float-left">{{ action | titlecase }} {{ resource | upperFirst }}</h4>
   4   <button type="button"
   5           class="close float-right"
   6           aria-label="Close"
   7           (click)="bsModalRef.hide()">
   8     <span aria-hidden="true">&times;</span>
   9   </button>
  10 </div>
  11 <form #frm="ngForm"
  12       [formGroup]="formGroup"
  13       novalidate>
  14   <div class="modal-body">
  15
  16     <!-- Username -->
  17     <div class="form-group row"
  18          [ngClass]="{':invalid': formGroup.showError('uid', frm)}">
  19       <label class="col-form-label col-sm-3"
  20              for="uid"
  21              i18n>Username</label>
  22       <div class="col-sm-9">
  23         <input id="uid"
  24                class="form-control"
  25                type="text"
  26                formControlName="uid"
  27                [readonly]="true">
  28       </div>
  29     </div>
  30
  31     <!-- Subuser -->
  32     <div class="form-group row"
  33          [ngClass]="{':invalid': formGroup.showError('subuid', frm)}">
  34       <label class="col-form-label col-sm-3"
  35              for="subuid">
  36         <ng-container i18n>Subuser</ng-container>
  37         <span class="required"
  38               *ngIf="!editing">
  39         </span>
  40       </label>
  41       <div class="col-sm-9">
  42         <input id="subuid"
  43                class="form-control"
  44                type="text"
  45                formControlName="subuid"
  46                [readonly]="editing"
  47                autofocus>
  48         <span class="form-text text-muted"
  49               *ngIf="formGroup.showError('subuid', frm, 'required')"
  50               i18n>This field is required.</span>
  51         <span class="form-text text-muted"
  52               *ngIf="formGroup.showError('subuid', frm, 'subuserIdExists')"
  53               i18n>The chosen subuser ID is already in use.</span>
  54       </div>
  55     </div>
  56
  57     <!-- Permission -->
  58     <div class="form-group row"
  59          [ngClass]="{':invalid': formGroup.showError('perm', frm)}">
  60       <label class="col-form-label col-sm-3"
  61              for="perm">
  62         <ng-container i18n>Permission</ng-container>
  63         <span class="required"></span>
  64       </label>
  65       <div class="col-sm-9">
  66         <select id="perm"
  67                 class="form-control"
  68                 formControlName="perm">
  69           <option i18n
  70                   [ngValue]="null">-- Select a permission --</option>
  71           <option *ngFor="let perm of ['read', 'write']"
  72                   [value]="perm">
  73             {{ perm }}
  74           </option>
  75           <option i18n
  76                   value="read-write">read, write</option>
  77           <option i18n
  78                   value="full-control">full</option>
  79         </select>
  80         <span class="form-text text-muted"
  81               *ngIf="formGroup.showError('perm', frm, 'required')"
  82               i18n>This field is required.</span>
  83       </div>
  84     </div>
  85
  86     <!-- Swift key -->
  87     <fieldset *ngIf="!editing">
  88       <legend i18n>Swift key</legend>
  89
  90       <!-- Auto-generate key -->
  91       <div class="form-group row">
  92         <div class="offset-sm-3 col-sm-9">
  93           <div class="custom-control custom-checkbox">
  94             <input class="custom-control-input"
  95                    id="generate_secret"
  96                    type="checkbox"
  97                    formControlName="generate_secret">
  98             <label class="custom-control-label"
  99                    for="generate_secret"
 100                    i18n>Auto-generate secret</label>
 101           </div>
 102         </div>
 103       </div>
 104
 105       <!-- Secret key -->
 106       <div class="form-group row"
 107            [ngClass]="{':invalid': formGroup.showError('secret_key', frm)}"
 108            *ngIf="!editing && !formGroup.getValue('generate_secret')">
 109         <label class="col-form-label col-sm-3"
 110                for="secret_key">
 111           <ng-container i18n>Secret key</ng-container>
 112           <span class="required"></span>
 113         </label>
 114         <div class="col-sm-9">
 115           <div class="input-group">
 116             <input id="secret_key"
 117                    class="form-control"
 118                    type="password"
 119                    formControlName="secret_key">
 120             <span class="input-group-append">
 121               <button type="button"
 122                       class="btn btn-light"
 123                       cdPasswordButton="secret_key">
 124               </button>
 125               <button type="button"
 126                       class="btn btn-light"
 127                       cdCopy2ClipboardButton="secret_key">
 128               </button>
 129             </span>
 130           </div>
 131           <span class="form-text text-muted"
 132                 *ngIf="formGroup.showError('secret_key', frm, 'required')"
 133                 i18n>This field is required.</span>
 134         </div>
 135       </div>
 136
 137     </fieldset>
 138
 139   </div>
 140   <div class="modal-footer">
 141     <cd-submit-button (submitAction)="onSubmit()"
 142                       i18n="form action button|Example: Create Pool@@formActionButton"
 143                       [form]="formGroup">{{ action | titlecase }} {{ resource | upperFirst }}</cd-submit-button>
 144     <cd-back-button [back]="bsModalRef.hide"></cd-back-button>
 145   </div>
 146 </form>