ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/iscsi-target-discovery-modal/iscsi-target-discovery-modal.component.html

   1 <cd-modal [modalRef]="bsModalRef">
   2   <ng-container class="modal-title"
   3                 i18n>Discovery Authentication</ng-container>
   4
   5   <ng-container class="modal-content">
   6     <form name="discoveryForm"
   7           #formDir="ngForm"
   8           [formGroup]="discoveryForm"
   9           novalidate>
  10       <div class="modal-body">
  11         <!-- User -->
  12         <div class="form-group row">
  13           <label class="cd-col-form-label"
  14                  for="user"
  15                  i18n>User</label>
  16           <div class="cd-col-form-input">
  17             <input id="user"
  18                    class="form-control"
  19                    formControlName="user"
  20                    type="text"
  21                    autocomplete="off">
  22             <span class="invalid-feedback"
  23                   *ngIf="discoveryForm.showError('user', formDir, 'required')"
  24                   i18n>This field is required.</span>
  25
  26             <span class="invalid-feedback"
  27                   *ngIf="discoveryForm.showError('user', formDir, 'pattern')"
  28                   i18n>User names must have a length of 8 to 64 characters and can contain
  29               alphanumeric characters, '.', '@', '-', '_' or ':'.</span>
  30           </div>
  31         </div>
  32
  33         <!-- Password -->
  34         <div class="form-group row">
  35           <label class="cd-col-form-label"
  36                  for="password"
  37                  i18n>Password</label>
  38           <div class="cd-col-form-input">
  39             <div class="input-group">
  40               <input id="password"
  41                      class="form-control"
  42                      formControlName="password"
  43                      type="password"
  44                      autocomplete="new-password">
  45
  46               <span class="input-group-append">
  47                 <button type="button"
  48                         class="btn btn-light"
  49                         cdPasswordButton="password">
  50                 </button>
  51                 <button type="button"
  52                         class="btn btn-light"
  53                         cdCopy2ClipboardButton="password">
  54                 </button>
  55               </span>
  56             </div>
  57             <span class="invalid-feedback"
  58                   *ngIf="discoveryForm.showError('password', formDir, 'required')"
  59                   i18n>This field is required.</span>
  60
  61             <span class="invalid-feedback"
  62                   *ngIf="discoveryForm.showError('password', formDir, 'pattern')"
  63                   i18n>Passwords must have a length of 12 to 16 characters and can contain
  64               alphanumeric characters, '@', '-', '_' or '/'.</span>
  65           </div>
  66         </div>
  67
  68         <!-- mutual_user -->
  69         <div class="form-group row">
  70           <label class="cd-col-form-label"
  71                  for="mutual_user">
  72             <ng-container i18n>Mutual User</ng-container>
  73           </label>
  74           <div class="cd-col-form-input">
  75             <input id="mutual_user"
  76                    class="form-control"
  77                    formControlName="mutual_user"
  78                    type="text"
  79                    autocomplete="off">
  80
  81             <span class="invalid-feedback"
  82                   *ngIf="discoveryForm.showError('mutual_user', formDir, 'required')"
  83                   i18n>This field is required.</span>
  84
  85             <span class="invalid-feedback"
  86                   *ngIf="discoveryForm.showError('mutual_user', formDir, 'pattern')"
  87                   i18n>User names must have a length of 8 to 64 characters and can contain
  88               alphanumeric characters, '.', '@', '-', '_' or ':'.</span>
  89           </div>
  90         </div>
  91
  92         <!-- mutual_password -->
  93         <div class="form-group row">
  94           <label class="cd-col-form-label"
  95                  for="mutual_password"
  96                  i18n>Mutual Password</label>
  97           <div class="cd-col-form-input">
  98             <div class="input-group">
  99               <input id="mutual_password"
 100                      class="form-control"
 101                      formControlName="mutual_password"
 102                      type="password"
 103                      autocomplete="new-password">
 104
 105               <span class="input-group-append">
 106                 <button type="button"
 107                         class="btn btn-light"
 108                         cdPasswordButton="mutual_password">
 109                 </button>
 110                 <button type="button"
 111                         class="btn btn-light"
 112                         cdCopy2ClipboardButton="mutual_password">
 113                 </button>
 114               </span>
 115             </div>
 116             <span class="invalid-feedback"
 117                   *ngIf="discoveryForm.showError('mutual_password', formDir, 'required')"
 118                   i18n>This field is required.</span>
 119
 120             <span class="invalid-feedback"
 121                   *ngIf="discoveryForm.showError('mutual_password', formDir, 'pattern')"
 122                   i18n>Passwords must have a length of 12 to 16 characters and can contain
 123               alphanumeric characters, '@', '-', '_' or '/'.</span>
 124           </div>
 125         </div>
 126       </div>
 127
 128       <div class="modal-footer">
 129         <div class="button-group text-right">
 130           <cd-submit-button (submitAction)="submitAction()"
 131                             [form]="discoveryForm"
 132                             *ngIf="hasPermission"
 133                             i18n>Submit</cd-submit-button>
 134           <cd-back-button [back]="bsModalRef.hide"
 135                           name="Cancel"
 136                           i18n-name>
 137           </cd-back-button>
 138         </div>
 139       </div>
 140     </form>
 141   </ng-container>
 142 </cd-modal>