ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-s3-key-modal/rgw-user-s3-key-modal.component.html

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