1 files changed, 69 insertions, 0 deletions
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/form-modal/form-modal.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/form-modal/form-modal.component.html
new file mode 100755
index 000000000..47fca49c7
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/form-modal/form-modal.component.html
@@ -0,0 +1,69 @@
+<cd-modal [modalRef]="activeModal">
+  <ng-container *ngIf="titleText"
+                class="modal-title">
+    {{ titleText }}
+  </ng-container>
+  <ng-container class="modal-content">
+    <form [formGroup]="formGroup"
+          #formDir="ngForm"
+          novalidate>
+      <div class="modal-body">
+        <p *ngIf="message">{{ message }}</p>
+        <ng-container *ngFor="let field of fields">
+          <div class="form-group row cd-{{field.name}}-form-group">
+            <label *ngIf="field.label"
+                   class="cd-col-form-label"
+                   [ngClass]="{'required': field?.required === true}"
+                   [for]="field.name">
+              {{ field.label }}
+            </label>
+            <div [ngClass]="{'cd-col-form-input': field.label, 'col-sm-12': !field.label}">
+              <input *ngIf="['text', 'number'].includes(field.type)"
+                     [type]="field.type"
+                     class="form-control"
+                     [id]="field.name"
+                     [name]="field.name"
+                     [formControlName]="field.name">
+              <input *ngIf="field.type === 'binary'"
+                     type="text"
+                     class="form-control"
+                     [id]="field.name"
+                     [name]="field.name"
+                     [formControlName]="field.name"
+                     cdDimlessBinary>
+              <select *ngIf="field.type === 'select'"
+                      class="form-control"
+                      [id]="field.name"
+                      [formControlName]="field.name">
+                <option *ngIf="field?.typeConfig?.placeholder"
+                        [ngValue]="null">
+                  {{ field?.typeConfig?.placeholder }}
+                </option>
+                <option *ngFor="let option of field?.typeConfig?.options"
+                        [value]="option.value">
+                  {{ option.text }}
+                </option>
+              </select>
+              <cd-select-badges *ngIf="field.type === 'select-badges'"
+                                [id]="field.name"
+                                [data]="field.value"
+                                [customBadges]="field?.typeConfig?.customBadges"
+                                [options]="field?.typeConfig?.options"
+                                [messages]="field?.typeConfig?.messages">
+              </cd-select-badges>
+              <span *ngIf="formGroup.showError(field.name, formDir)"
+                    class="invalid-feedback">
+                {{ getError(field) }}
+              </span>
+            </div>
+          </div>
+        </ng-container>
+      </div>
+      <div class="modal-footer">
+        <cd-form-button-panel (submitActionEvent)="onSubmitForm(formGroup.value)"
+                              [form]="formGroup"
+                              [submitText]="submitButtonText"></cd-form-button-panel>
+      </div>
+    </form>
+  </ng-container>
+</cd-modal>