]> git.apps.os.sepia.ceph.com Git - ceph-ci.git/blob
50e17b41b1ada5d599d7e99a152a36f44ed286ff
[ceph-ci.git] /
1 <div class="row">
2   <div class="col-sm-12 col-lg-12">
3     <div>
4       <cd-table-actions class="btn-group mb-4"
5                         [permission]="permission"
6                         [selection]="selection"
7                         [tableActions]="createTableActions">
8       </cd-table-actions>
9     </div>
10     <div class="card">
11       <div class="card-header"
12            i18n>Multi-site Topology viewer</div>
13       <div class="card-body">
14         <div class="row">
15           <div class="col-sm-6 col-lg-6 tree-container">
16             <i *ngIf="loadingIndicator"
17                [ngClass]="[icons.large, icons.spinner, icons.spin]"></i>
18             <tree-root #tree
19                        [nodes]="nodes"
20                        [options]="treeOptions"
21                        (updateData)="onUpdateData()">
22               <ng-template #treeNodeTemplate
23                            let-node>
24                 <span *ngIf="node.data.name"
25                       class="me-3">
26                   <i [ngClass]="node.data.icon"></i>
27                     {{ node.data.name }}
28                 </span>
29                 <span *ngIf="node.data.type"
30                       class="badge badge-info me-3">
31                     {{ node.data.type }}
32                 </span>
33                 <span class="badge badge-success me-2"
34                       *ngIf="node.data.is_default">
35                   default
36                 </span>
37                 <span class="badge badge-info me-2"
38                       *ngIf="node.data.is_master">
39                   master
40                 </span>
41                 <div class="btn-group align-inline-btns"
42                      *ngIf="node.isFocused && node.data.type === 'realm'"
43                      role="group">
44                   <button type="button"
45                           title="Edit realm"
46                           class="btn btn-light dropdown-toggle-split ms-1"
47                           (click)="openModal(node, true)"
48                           ngbDropdownToggle>
49                     <i [ngClass]="[icons.edit]"></i>
50                   </button>
51                 </div>
52               </ng-template>
53             </tree-root>
54           </div>
55           <div class="col-sm-6 col-lg-6 metadata"
56                *ngIf="metadata">
57             <legend>{{ metadataTitle }}</legend>
58             <cd-table-key-value [data]="metadata"></cd-table-key-value>
59           </div>
60         </div>
61       </div>
62     </div>
63   </div>
64 </div>