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

   1 <cd-modal [pageURL]="pageURL"
   2           [modalRef]="activeModal">
   3   <span class="modal-title"
   4         i18n>{{ action | titlecase }} {{ resource | upperFirst }}</span>
   5   <ng-container class="modal-content">
   6     <form #frm="ngForm"
   7           [formGroup]="serviceForm"
   8           novalidate>
   9       <div class="modal-body">
  10
  11         <!-- Service type -->
  12         <div class="form-group row">
  13           <label class="cd-col-form-label required"
  14                  for="service_type"
  15                  i18n>Type</label>
  16           <div class="cd-col-form-input">
  17             <select id="service_type"
  18                     name="service_type"
  19                     class="form-control custom-select"
  20                     formControlName="service_type">
  21               <option i18n
  22                       [ngValue]="null">-- Select a service type --</option>
  23               <option *ngFor="let serviceType of serviceTypes"
  24                       [value]="serviceType">
  25                 {{ serviceType }}
  26               </option>
  27             </select>
  28             <span class="invalid-feedback"
  29                   *ngIf="serviceForm.showError('service_type', frm, 'required')"
  30                   i18n>This field is required.</span>
  31           </div>
  32         </div>
  33
  34         <!-- backend_service -->
  35           <div *ngIf="serviceForm.controls.service_type.value === 'ingress'"
  36                class="form-group row">
  37             <label i18n
  38                    class="cd-col-form-label"
  39                    [ngClass]="{'required': ['ingress'].includes(serviceForm.controls.service_type.value)}"
  40                    for="backend_service">Backend Service</label>
  41             <div class="cd-col-form-input">
  42               <select id="backend_service"
  43                       name="backend_service"
  44                       class="form-control custom-select"
  45                       formControlName="backend_service"
  46                       (change)="prePopulateId()">
  47                 <option *ngIf="services === null"
  48                         [ngValue]="null"
  49                         i18n>Loading...</option>
  50                 <option *ngIf="services !== null && services.length === 0"
  51                         [ngValue]="null"
  52                         i18n>-- No service available --</option>
  53                 <option *ngIf="services !== null && services.length > 0"
  54                         [ngValue]="null"
  55                         i18n>-- Select an existing RGW service --</option>
  56                 <option *ngFor="let service of services"
  57                         [value]="service.service_name">{{ service.service_name }}</option>
  58               </select>
  59               <span class="invalid-feedback"
  60                     *ngIf="serviceForm.showError('backend_service', frm, 'required')"
  61                     i18n>This field is required.</span>
  62             </div>
  63           </div>
  64
  65         <!-- Service id -->
  66         <div class="form-group row">
  67           <label i18n
  68                  class="cd-col-form-label"
  69                  [ngClass]="{'required': ['mds', 'rgw', 'nfs', 'iscsi', 'ingress'].includes(serviceForm.controls.service_type.value)}"
  70                  for="service_id">Id</label>
  71           <div class="cd-col-form-input">
  72             <input id="service_id"
  73                    class="form-control"
  74                    type="text"
  75                    formControlName="service_id">
  76             <span class="invalid-feedback"
  77                   *ngIf="serviceForm.showError('service_id', frm, 'required')"
  78                   i18n>This field is required.</span>
  79             <span class="invalid-feedback"
  80                   *ngIf="serviceForm.showError('service_id', frm, 'rgwPattern')"
  81                   i18n>The value does not match the pattern <strong>&lt;service_id&gt;[.&lt;realm_name&gt;.&lt;zone_name&gt;]</strong>.</span>
  82           </div>
  83         </div>
  84
  85         <!-- unmanaged -->
  86         <div class="form-group row">
  87           <div class="cd-col-form-offset">
  88             <div class="custom-control custom-checkbox">
  89               <input class="custom-control-input"
  90                      id="unmanaged"
  91                      type="checkbox"
  92                      formControlName="unmanaged">
  93               <label class="custom-control-label"
  94                      for="unmanaged"
  95                      i18n>Unmanaged</label>
  96             </div>
  97           </div>
  98         </div>
  99
 100         <!-- Placement -->
 101         <div *ngIf="!serviceForm.controls.unmanaged.value"
 102              class="form-group row">
 103           <label class="cd-col-form-label"
 104                  for="placement"
 105                  i18n>Placement</label>
 106           <div class="cd-col-form-input">
 107             <select id="placement"
 108                     class="form-control custom-select"
 109                     formControlName="placement">
 110               <option i18n
 111                       value="hosts">Hosts</option>
 112               <option i18n
 113                       value="label">Label</option>
 114             </select>
 115           </div>
 116         </div>
 117
 118         <!-- Label -->
 119         <div *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.placement.value === 'label'"
 120              class="form-group row">
 121           <label i18n
 122                  class="cd-col-form-label"
 123                  for="label">Label</label>
 124           <div class="cd-col-form-input">
 125             <input id="label"
 126                    class="form-control"
 127                    type="text"
 128                    formControlName="label"
 129                    [ngbTypeahead]="searchLabels"
 130                    (focus)="labelFocus.next($any($event).target.value)"
 131                    (click)="labelClick.next($any($event).target.value)">
 132             <span class="invalid-feedback"
 133                   *ngIf="serviceForm.showError('label', frm, 'required')"
 134                   i18n>This field is required.</span>
 135           </div>
 136         </div>
 137
 138         <!-- Hosts -->
 139         <div *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.placement.value === 'hosts'"
 140              class="form-group row">
 141           <label class="cd-col-form-label"
 142                  for="hosts"
 143                  i18n>Hosts</label>
 144           <div class="cd-col-form-input">
 145             <cd-select-badges id="hosts"
 146                               [data]="serviceForm.controls.hosts.value"
 147                               [options]="hosts.options"
 148                               [messages]="hosts.messages">
 149             </cd-select-badges>
 150           </div>
 151         </div>
 152
 153         <!-- count -->
 154         <div *ngIf="!serviceForm.controls.unmanaged.value"
 155              class="form-group row">
 156           <label class="cd-col-form-label"
 157                  for="count">
 158             <span i18n>Count</span>
 159             <cd-helper i18n>Only that number of daemons will be created.</cd-helper>
 160           </label>
 161           <div class="cd-col-form-input">
 162             <input id="count"
 163                    class="form-control"
 164                    type="number"
 165                    formControlName="count"
 166                    min="1">
 167             <span class="invalid-feedback"
 168                   *ngIf="serviceForm.showError('count', frm, 'min')"
 169                   i18n>The value must be at least 1.</span>
 170             <span class="invalid-feedback"
 171                   *ngIf="serviceForm.showError('count', frm, 'pattern')"
 172                   i18n>The entered value needs to be a number.</span>
 173           </div>
 174         </div>
 175
 176         <!-- RGW -->
 177         <ng-container *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.service_type.value === 'rgw'">
 178           <!-- rgw_frontend_port -->
 179           <div class="form-group row">
 180             <label i18n
 181                    class="cd-col-form-label"
 182                    for="rgw_frontend_port">Port</label>
 183             <div class="cd-col-form-input">
 184               <input id="rgw_frontend_port"
 185                      class="form-control"
 186                      type="number"
 187                      formControlName="rgw_frontend_port"
 188                      min="1"
 189                      max="65535">
 190               <span class="invalid-feedback"
 191                     *ngIf="serviceForm.showError('rgw_frontend_port', frm, 'pattern')"
 192                     i18n>The entered value needs to be a number.</span>
 193               <span class="invalid-feedback"
 194                     *ngIf="serviceForm.showError('rgw_frontend_port', frm, 'min')"
 195                     i18n>The value must be at least 1.</span>
 196               <span class="invalid-feedback"
 197                     *ngIf="serviceForm.showError('rgw_frontend_port', frm, 'max')"
 198                     i18n>The value cannot exceed 65535.</span>
 199             </div>
 200           </div>
 201         </ng-container>
 202
 203         <!-- iSCSI -->
 204         <ng-container *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.service_type.value === 'iscsi'">
 205           <!-- pool -->
 206           <div class="form-group row">
 207             <label i18n
 208                    class="cd-col-form-label required"
 209                    for="pool">Pool</label>
 210             <div class="cd-col-form-input">
 211               <select id="pool"
 212                       name="pool"
 213                       class="form-control custom-select"
 214                       formControlName="pool">
 215                 <option *ngIf="pools === null"
 216                         [ngValue]="null"
 217                         i18n>Loading...</option>
 218                 <option *ngIf="pools && pools.length === 0"
 219                         [ngValue]="null"
 220                         i18n>-- No pools available --</option>
 221                 <option *ngIf="pools && pools.length > 0"
 222                         [ngValue]="null"
 223                         i18n>-- Select a pool --</option>
 224                 <option *ngFor="let pool of pools"
 225                         [value]="pool.pool_name">{{ pool.pool_name }}</option>
 226               </select>
 227               <span class="invalid-feedback"
 228                     *ngIf="serviceForm.showError('pool', frm, 'required')"
 229                     i18n>This field is required.</span>
 230             </div>
 231           </div>
 232
 233           <!-- trusted_ip_list -->
 234           <div class="form-group row">
 235             <label class="cd-col-form-label"
 236                    for="trusted_ip_list">
 237               <span i18n>Trusted IPs</span>
 238               <cd-helper>
 239                 <span i18n>Comma separated list of IP addresses.</span>
 240                 <br>
 241                 <span i18n>Please add the <b>Ceph Manager</b> IP addresses here, otherwise the iSCSI gateways can't be reached.</span>
 242               </cd-helper>
 243             </label>
 244             <div class="cd-col-form-input">
 245               <input id="trusted_ip_list"
 246                      class="form-control"
 247                      type="text"
 248                      formControlName="trusted_ip_list">
 249             </div>
 250           </div>
 251
 252           <!-- api_port -->
 253           <div class="form-group row">
 254             <label i18n
 255                    class="cd-col-form-label"
 256                    for="api_port">Port</label>
 257             <div class="cd-col-form-input">
 258               <input id="api_port"
 259                      class="form-control"
 260                      type="number"
 261                      formControlName="api_port"
 262                      min="1"
 263                      max="65535">
 264               <span class="invalid-feedback"
 265                     *ngIf="serviceForm.showError('api_port', frm, 'pattern')"
 266                     i18n>The entered value needs to be a number.</span>
 267               <span class="invalid-feedback"
 268                     *ngIf="serviceForm.showError('api_port', frm, 'min')"
 269                     i18n>The value must be at least 1.</span>
 270               <span class="invalid-feedback"
 271                     *ngIf="serviceForm.showError('api_port', frm, 'max')"
 272                     i18n>The value cannot exceed 65535.</span>
 273             </div>
 274           </div>
 275
 276           <!-- api_user -->
 277           <div class="form-group row">
 278             <label i18n
 279                    class="cd-col-form-label"
 280                    [ngClass]="{'required': ['iscsi'].includes(serviceForm.controls.service_type.value)}"
 281                    for="api_user">User</label>
 282             <div class="cd-col-form-input">
 283               <input id="api_user"
 284                      class="form-control"
 285                      type="text"
 286                      formControlName="api_user">
 287               <span class="invalid-feedback"
 288                     *ngIf="serviceForm.showError('api_user', frm, 'required')"
 289                     i18n>This field is required.</span>
 290             </div>
 291           </div>
 292
 293           <!-- api_password -->
 294           <div class="form-group row">
 295             <label i18n
 296                    class="cd-col-form-label"
 297                    [ngClass]="{'required': ['iscsi'].includes(serviceForm.controls.service_type.value)}"
 298                    for="api_password">Password</label>
 299             <div class="cd-col-form-input">
 300               <div class="input-group">
 301                 <input id="api_password"
 302                        class="form-control"
 303                        type="password"
 304                        autocomplete="new-password"
 305                        formControlName="api_password">
 306                 <span class="input-group-append">
 307                   <button type="button"
 308                           class="btn btn-light"
 309                           cdPasswordButton="api_password">
 310                   </button>
 311                   <cd-copy-2-clipboard-button source="api_password">
 312                   </cd-copy-2-clipboard-button>
 313                 </span>
 314                 <span class="invalid-feedback"
 315                       *ngIf="serviceForm.showError('api_password', frm, 'required')"
 316                       i18n>This field is required.</span>
 317               </div>
 318             </div>
 319           </div>
 320         </ng-container>
 321
 322         <!-- Ingress -->
 323         <ng-container *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.service_type.value === 'ingress'">
 324           <!-- virtual_ip -->
 325           <div class="form-group row">
 326             <label class="cd-col-form-label"
 327                    [ngClass]="{'required': ['ingress'].includes(serviceForm.controls.service_type.value)}"
 328                    for="virtual_ip">
 329               <span i18n>Virtual IP</span>
 330               <cd-helper>
 331                 <span i18n>The virtual IP address and subnet (in CIDR notation) where the ingress service will be available.</span>
 332               </cd-helper>
 333             </label>
 334             <div class="cd-col-form-input">
 335               <input id="virtual_ip"
 336                      class="form-control"
 337                      type="text"
 338                      formControlName="virtual_ip">
 339               <span class="invalid-feedback"
 340                     *ngIf="serviceForm.showError('virtual_ip', frm, 'required')"
 341                     i18n>This field is required.</span>
 342             </div>
 343           </div>
 344
 345           <!-- frontend_port -->
 346           <div class="form-group row">
 347             <label class="cd-col-form-label"
 348                    [ngClass]="{'required': ['ingress'].includes(serviceForm.controls.service_type.value)}"
 349                    for="frontend_port">
 350               <span i18n>Frontend Port</span>
 351               <cd-helper>
 352                 <span i18n>The port used to access the ingress service.</span>
 353               </cd-helper>
 354             </label>
 355             <div class="cd-col-form-input">
 356               <input id="frontend_port"
 357                      class="form-control"
 358                      type="number"
 359                      formControlName="frontend_port"
 360                      min="1"
 361                      max="65535">
 362               <span class="invalid-feedback"
 363                     *ngIf="serviceForm.showError('frontend_port', frm, 'pattern')"
 364                     i18n>The entered value needs to be a number.</span>
 365               <span class="invalid-feedback"
 366                     *ngIf="serviceForm.showError('frontend_port', frm, 'min')"
 367                     i18n>The value must be at least 1.</span>
 368               <span class="invalid-feedback"
 369                     *ngIf="serviceForm.showError('frontend_port', frm, 'max')"
 370                     i18n>The value cannot exceed 65535.</span>
 371               <span class="invalid-feedback"
 372                     *ngIf="serviceForm.showError('frontend_port', frm, 'required')"
 373                     i18n>This field is required.</span>
 374             </div>
 375           </div>
 376
 377           <!-- monitor_port -->
 378           <div class="form-group row">
 379             <label class="cd-col-form-label"
 380                    [ngClass]="{'required': ['ingress'].includes(serviceForm.controls.service_type.value)}"
 381                    for="monitor_port">
 382               <span i18n>Monitor Port</span>
 383               <cd-helper>
 384                 <span i18n>The port used by haproxy for load balancer status.</span>
 385               </cd-helper>
 386             </label>
 387             <div class="cd-col-form-input">
 388               <input id="monitor_port"
 389                      class="form-control"
 390                      type="number"
 391                      formControlName="monitor_port"
 392                      min="1"
 393                      max="65535">
 394               <span class="invalid-feedback"
 395                     *ngIf="serviceForm.showError('monitor_port', frm, 'pattern')"
 396                     i18n>The entered value needs to be a number.</span>
 397               <span class="invalid-feedback"
 398                     *ngIf="serviceForm.showError('monitor_port', frm, 'min')"
 399                     i18n>The value must be at least 1.</span>
 400               <span class="invalid-feedback"
 401                     *ngIf="serviceForm.showError('monitor_port', frm, 'max')"
 402                     i18n>The value cannot exceed 65535.</span>
 403               <span class="invalid-feedback"
 404                     *ngIf="serviceForm.showError('monitor_port', frm, 'required')"
 405                     i18n>This field is required.</span>
 406             </div>
 407           </div>
 408           <!-- virtual_interface_networks -->
 409           <div class="form-group row">
 410             <label class="cd-col-form-label"
 411                    for="virtual_interface_networks">
 412               <span i18n>CIDR Networks</span>
 413               <cd-helper>
 414                 <span i18n>A list of networks to identify which network interface to use for the virtual IP address.</span>
 415               </cd-helper>
 416             </label>
 417             <div class="cd-col-form-input">
 418               <input id="virtual_interface_networks"
 419                      class="form-control"
 420                      type="text"
 421                      formControlName="virtual_interface_networks">
 422             </div>
 423           </div>
 424         </ng-container>
 425
 426         <!-- SNMP-Gateway -->
 427         <ng-container *ngIf="!serviceForm.controls.unmanaged.value && serviceForm.controls.service_type.value === 'snmp-gateway'">
 428           <!-- snmp-version -->
 429           <div class="form-group row">
 430             <label class="cd-col-form-label required"
 431                    for="snmp_version"
 432                    i18n>Version</label>
 433             <div class="cd-col-form-input">
 434               <select id="snmp_version"
 435                       name="snmp_version"
 436                       class="form-control custom-select"
 437                       formControlName="snmp_version"
 438                       (change)="clearValidations()">
 439                 <option i18n
 440                         [ngValue]="null">-- Select SNMP version --</option>
 441                 <option *ngFor="let snmpVersion of ['V2c', 'V3']"
 442                         [value]="snmpVersion">{{ snmpVersion }}</option>
 443               </select>
 444               <span class="invalid-feedback"
 445                     *ngIf="serviceForm.showError('snmp_version', frm, 'required')"
 446                     i18n>This field is required.</span>
 447             </div>
 448           </div>
 449           <!-- Destination -->
 450           <div class="form-group row">
 451             <label class="cd-col-form-label required"
 452                    [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 453                    for="snmp_destination">
 454               <span i18n>Destination</span>
 455               <cd-helper>
 456                 <span i18n>Must be of the format hostname:port.</span>
 457               </cd-helper>
 458             </label>
 459             <div class="cd-col-form-input">
 460               <input id="snmp_destination"
 461                      class="form-control"
 462                      type="text"
 463                      formControlName="snmp_destination">
 464               <span class="invalid-feedback"
 465                     *ngIf="serviceForm.showError('snmp_destination', frm, 'required')"
 466                     i18n>This field is required.</span>
 467               <span class="invalid-feedback"
 468                     *ngIf="serviceForm.showError('snmp_destination', frm, 'snmpDestinationPattern')"
 469                     i18n>The value does not match the pattern: <strong>hostname:port</strong></span>
 470             </div>
 471           </div>
 472           <!-- Engine id for snmp V3 -->
 473           <div class="form-group row"
 474                *ngIf="serviceForm.controls.snmp_version.value === 'V3'">
 475             <label class="cd-col-form-label required"
 476                    [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 477                    for="engine_id">
 478               <span i18n>Engine Id</span>
 479               <cd-helper>
 480                 <span i18n>Unique identifier for the device (in hex).</span>
 481               </cd-helper>
 482             </label>
 483             <div class="cd-col-form-input">
 484               <input id="engine_id"
 485                      class="form-control"
 486                      type="text"
 487                      formControlName="engine_id">
 488               <span class="invalid-feedback"
 489                     *ngIf="serviceForm.showError('engine_id', frm, 'required')"
 490                     i18n>This field is required.</span>
 491             </div>
 492           </div>
 493           <!-- Auth protocol for snmp V3 -->
 494           <div class="form-group row"
 495                *ngIf="serviceForm.controls.snmp_version.value === 'V3'">
 496             <label class="cd-col-form-label required"
 497                    for="auth_protocol"
 498                    i18n>Auth Protocol</label>
 499             <div class="cd-col-form-input">
 500               <select id="auth_protocol"
 501                       name="auth_protocol"
 502                       class="form-control custom-select"
 503                       formControlName="auth_protocol">
 504                 <option i18n
 505                         [ngValue]="null">-- Select auth protocol --</option>
 506                 <option *ngFor="let authProtocol of ['SHA', 'MD5']"
 507                         [value]="authProtocol">
 508                   {{ authProtocol }}
 509                 </option>
 510               </select>
 511               <span class="invalid-feedback"
 512                     *ngIf="serviceForm.showError('auth_protocol', frm, 'required')"
 513                     i18n>This field is required.</span>
 514             </div>
 515           </div>
 516           <!-- Privacy protocol for snmp V3 -->
 517           <div class="form-group row"
 518                *ngIf="serviceForm.controls.snmp_version.value === 'V3'">
 519             <label class="cd-col-form-label"
 520                    for="privacy_protocol"
 521                    i18n>Privacy Protocol</label>
 522             <div class="cd-col-form-input">
 523               <select id="privacy_protocol"
 524                       name="privacy_protocol"
 525                       class="form-control custom-select"
 526                       formControlName="privacy_protocol">
 527                 <option i18n
 528                         [ngValue]="null">-- Select privacy protocol --</option>
 529                 <option *ngFor="let privacyProtocol of ['DES', 'AES']"
 530                         [value]="privacyProtocol">
 531                   {{ privacyProtocol }}
 532                 </option>
 533               </select>
 534             </div>
 535           </div>
 536           <!-- Credentials -->
 537           <fieldset>
 538             <legend i18n>Credentials</legend>
 539             <!-- snmp v2c snmp_community -->
 540             <div class="form-group row"
 541                  *ngIf="serviceForm.controls.snmp_version.value === 'V2c'">
 542               <label class="cd-col-form-label required"
 543                      [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 544                      for="snmp_community">
 545                 <span i18n>SNMP Community</span>
 546               </label>
 547               <div class="cd-col-form-input">
 548                 <input id="snmp_community"
 549                        class="form-control"
 550                        type="text"
 551                        formControlName="snmp_community">
 552                 <span class="invalid-feedback"
 553                       *ngIf="serviceForm.showError('snmp_community', frm, 'required')"
 554                       i18n>This field is required.</span>
 555               </div>
 556             </div>
 557             <!-- snmp v3 auth username -->
 558             <div class="form-group row"
 559                  *ngIf="serviceForm.controls.snmp_version.value === 'V3'">
 560               <label class="cd-col-form-label required"
 561                      [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 562                      for="snmp_v3_auth_username">
 563                 <span i18n>Username</span>
 564               </label>
 565               <div class="cd-col-form-input">
 566                 <input id="snmp_v3_auth_username"
 567                        class="form-control"
 568                        type="text"
 569                        formControlName="snmp_v3_auth_username">
 570                 <span class="invalid-feedback"
 571                       *ngIf="serviceForm.showError('snmp_v3_auth_username', frm, 'required')"
 572                       i18n>This field is required.</span>
 573               </div>
 574             </div>
 575             <!-- snmp v3 auth password -->
 576             <div class="form-group row"
 577                  *ngIf="serviceForm.controls.snmp_version.value === 'V3'">
 578               <label class="cd-col-form-label required"
 579                      [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 580                      for="snmp_v3_auth_password">
 581                 <span i18n>Password</span>
 582               </label>
 583               <div class="cd-col-form-input">
 584                 <input id="snmp_v3_auth_password"
 585                        class="form-control"
 586                        type="password"
 587                        formControlName="snmp_v3_auth_password">
 588                 <span class="invalid-feedback"
 589                       *ngIf="serviceForm.showError('snmp_v3_auth_password', frm, 'required')"
 590                       i18n>This field is required.</span>
 591               </div>
 592             </div>
 593             <!-- snmp v3 priv password -->
 594             <div class="form-group row"
 595                  *ngIf="serviceForm.controls.snmp_version.value === 'V3' && serviceForm.controls.privacy_protocol.value !== null && serviceForm.controls.privacy_protocol.value !== undefined">
 596               <label class="cd-col-form-label required"
 597                      [ngClass]="{'required': ['snmp-gateway'].includes(serviceForm.controls.service_type.value)}"
 598                      for="snmp_v3_priv_password">
 599                 <span i18n>Encryption</span>
 600               </label>
 601               <div class="cd-col-form-input">
 602                 <input id="snmp_v3_priv_password"
 603                        class="form-control"
 604                        type="password"
 605                        formControlName="snmp_v3_priv_password">
 606                 <span class="invalid-feedback"
 607                       *ngIf="serviceForm.showError('snmp_v3_priv_password', frm, 'required')"
 608                       i18n>This field is required.</span>
 609               </div>
 610             </div>
 611           </fieldset>
 612         </ng-container>
 613         <!-- RGW, Ingress & iSCSI -->
 614         <ng-container *ngIf="!serviceForm.controls.unmanaged.value && ['rgw', 'iscsi', 'ingress'].includes(serviceForm.controls.service_type.value)">
 615           <!-- ssl -->
 616           <div class="form-group row">
 617             <div class="cd-col-form-offset">
 618               <div class="custom-control custom-checkbox">
 619                 <input class="custom-control-input"
 620                        id="ssl"
 621                        type="checkbox"
 622                        formControlName="ssl">
 623                 <label class="custom-control-label"
 624                        for="ssl"
 625                        i18n>SSL</label>
 626               </div>
 627             </div>
 628           </div>
 629
 630           <!-- ssl_cert -->
 631           <div *ngIf="serviceForm.controls.ssl.value"
 632                class="form-group row">
 633             <label class="cd-col-form-label"
 634                    for="ssl_cert">
 635               <span i18n>Certificate</span>
 636               <cd-helper i18n>The SSL certificate in PEM format.</cd-helper>
 637             </label>
 638             <div class="cd-col-form-input">
 639               <textarea id="ssl_cert"
 640                         class="form-control resize-vertical text-monospace text-pre"
 641                         formControlName="ssl_cert"
 642                         rows="5">
 643               </textarea>
 644               <input type="file"
 645                      (change)="fileUpload($event.target.files, 'ssl_cert')">
 646               <span class="invalid-feedback"
 647                     *ngIf="serviceForm.showError('ssl_cert', frm, 'required')"
 648                     i18n>This field is required.</span>
 649               <span class="invalid-feedback"
 650                     *ngIf="serviceForm.showError('ssl_cert', frm, 'pattern')"
 651                     i18n>Invalid SSL certificate.</span>
 652             </div>
 653           </div>
 654
 655           <!-- ssl_key -->
 656           <div *ngIf="serviceForm.controls.ssl.value && serviceForm.controls.service_type.value !== 'rgw'"
 657                class="form-group row">
 658             <label class="cd-col-form-label"
 659                    for="ssl_key">
 660               <span i18n>Private key</span>
 661               <cd-helper i18n>The SSL private key in PEM format.</cd-helper>
 662             </label>
 663             <div class="cd-col-form-input">
 664               <textarea id="ssl_key"
 665                         class="form-control resize-vertical text-monospace text-pre"
 666                         formControlName="ssl_key"
 667                         rows="5">
 668               </textarea>
 669               <input type="file"
 670                      (change)="fileUpload($event.target.files,'ssl_key')">
 671               <span class="invalid-feedback"
 672                     *ngIf="serviceForm.showError('ssl_key', frm, 'required')"
 673                     i18n>This field is required.</span>
 674               <span class="invalid-feedback"
 675                     *ngIf="serviceForm.showError('ssl_key', frm, 'pattern')"
 676                     i18n>Invalid SSL private key.</span>
 677             </div>
 678           </div>
 679         </ng-container>
 680       </div>
 681
 682       <div class="modal-footer">
 683         <div class="text-right">
 684           <cd-form-button-panel (submitActionEvent)="onSubmit()"
 685                                 [form]="serviceForm"
 686                                 [submitText]="(action | titlecase) + ' ' + (resource | upperFirst)"></cd-form-button-panel>
 687         </div>
 688       </div>
 689     </form>
 690   </ng-container>
 691 </cd-modal>