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

   1 <cd-rgw-multisite-tabs></cd-rgw-multisite-tabs>
   2 <div>
   3   <!-- Show the alert only when the user has the permission to configure -->
   4   <cd-alert-panel *ngIf="permissions.configOpt.create && !rgwModuleStatus"
   5                   type="info"
   6                   spacingClass="mb-3"
   7                   i18n
   8                   class="align-items-center"
   9                   actionName="Enable"
  10                   (action)="enableRgwModule()">
  11       In order to access the import/export feature, the rgw module must be enabled.
  12   </cd-alert-panel>
  13   <cd-alert-panel   *ngIf="restartGatewayMessage"
  14                     type="warning"
  15                     spacingClass="mb-3"
  16                     i18n>Please restart all Ceph Object Gateway instances in all zones to ensure consistent multisite configuration updates.
  17     <a class="text-decoration-underline"
  18        routerLink="/services">
  19        Cluster->Services</a>
  20   </cd-alert-panel>
  21   <div [cdsStack]="'horizontal'"
  22        [gap]="4">
  23     <cd-table-actions class="btn-group"
  24                       [permission]="permissions.rgw"
  25                       [selection]="selection"
  26                       [tableActions]="multisiteReplicationActions">
  27     </cd-table-actions>
  28     <cd-table-actions *ngIf="showMigrateAndReplicationActions"
  29                       class="btn-group"
  30                       [permission]="permissions.rgw"
  31                       [selection]="selection"
  32                       [tableActions]="migrateTableAction">
  33     </cd-table-actions>
  34     <cd-table-actions class="btn-group multisite-actions"
  35                       [permission]="permissions.rgw"
  36                       [selection]="selection"
  37                       [tableActions]="createTableActions"
  38                       dropDownOnly="Actions"
  39                       [dropDownOnlyBtnColor]="'tertiary'"
  40                       [dropDownOnlyOffset]="{ x: 45, y: 0 }">
  41     </cd-table-actions>
  42   </div>
  43 </div>
  44 <div class="card">
  45   <div class="card-header"
  46        data-testid="rgw-multisite-details-header"
  47        i18n>Topology Viewer</div>
  48   <div class="row">
  49     <div class="col-sm-6 col-lg-6 tree-container">
  50       <i *ngIf="loadingIndicator"
  51          [ngClass]="[icons.large, icons.spinner, icons.spin]"></i>
  52       <cds-tree-view #tree
  53                      [isMultiSelect]="false"
  54                      (select)="onNodeSelected($event)">
  55         <ng-template #nodeTemplateRef
  56                      let-node="node"
  57                      let-depth="depth">
  58           <cds-tree-node [node]="node"
  59                          [depth]="depth">
  60             <ng-container *ngIf="node?.children && node?.children?.length">
  61               <ng-container *ngFor="let child of node.children; let i = index;">
  62                 <ng-container *ngTemplateOutlet="nodeTemplateRef; context: { node: child, depth: depth + 1 };">
  63                 </ng-container>
  64               </ng-container>
  65             </ng-container>
  66           </cds-tree-node>
  67         </ng-template>
  68         <ng-template #treeNodeTemplate
  69                      let-node>
  70           <div class="w-100 d-flex justify-content-between align-items-center pe-1">
  71             <div>
  72               <span *ngIf="node?.data?.name"
  73                     class="me-3">
  74                 <span *ngIf="(node?.data?.show_warning)">
  75                   <i  class="text-danger"
  76                       i18n-title
  77                       [title]="node?.data?.warning_message"
  78                       [ngClass]="icons.danger"></i>
  79                 </span>
  80                 <i [ngClass]="node?.data?.icon"></i>
  81                 {{ node?.data?.name }}
  82               </span>
  83               <span class="badge badge-success me-2"
  84                     *ngIf="node?.data?.is_default">
  85                   default
  86               </span>
  87               <span class="badge badge-warning me-2"
  88                     *ngIf="node?.data?.is_master"> master </span>
  89               <span class="badge badge-warning me-2"
  90                     *ngIf="node?.data?.secondary_zone">
  91                 secondary-zone
  92               </span>
  93             </div>
  94             <div class="btn-group align-inline-btns"
  95                  [ngStyle]="{'visibility': activeNodeId === node?.data?.id ? 'visible' : 'hidden'}"
  96                  role="group">
  97               <div [title]="editTitle"
  98                    i18n-title>
  99                 <button type="button"
 100                         class="btn btn-light dropdown-toggle-split ms-1"
 101                         (click)="openModal(node, true)"
 102                         [disabled]="getDisable() || node?.data?.secondary_zone">
 103                   <i [ngClass]="[icons.edit]"></i>
 104                 </button>
 105               </div>
 106               <ng-container *ngIf="isDeleteDisabled(node) as nodeDeleteData">
 107                 <div [title]="nodeDeleteData.deleteTitle"
 108                      i18n-title>
 109                   <button type="button"
 110                           class="btn btn-light ms-1"
 111                           [disabled]="nodeDeleteData.isDisabled || node?.data?.secondary_zone"
 112                           (click)="delete(node)">
 113                     <i [ngClass]="[icons.destroy]"></i>
 114                   </button>
 115                 </div>
 116               </ng-container>
 117             </div>
 118           </div>
 119         </ng-template>
 120         <ng-container *ngFor="let node of nodes">
 121           <ng-container *ngTemplateOutlet="nodeTemplateRef; context: { node: node, depth: 0 };">
 122           </ng-container>
 123         </ng-container>
 124       </cds-tree-view>
 125     </div>
 126     <div class="col-sm-6 col-lg-6 metadata"
 127          *ngIf="metadata">
 128       <legend>{{ metadataTitle }}</legend>
 129       <div>
 130         <cd-table-key-value [data]="metadata">
 131         </cd-table-key-value>
 132       </div>
 133     </div>
 134   </div>
 135 </div>
 136
 137 <router-outlet name="modal"></router-outlet>