]> git.proxmox.com Git - ceph.git/blobdiff - ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-subvolume-list/cephfs-subvolume-list.component.html
update ceph source to reef 18.2.1
[ceph.git] / ceph / src / pybind / mgr / dashboard / frontend / src / app / ceph / cephfs / cephfs-subvolume-list / cephfs-subvolume-list.component.html
diff --git a/ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-subvolume-list/cephfs-subvolume-list.component.html b/ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-subvolume-list/cephfs-subvolume-list.component.html
new file mode 100644 (file)
index 0000000..29731bb
--- /dev/null
@@ -0,0 +1,123 @@
+<div class="row">
+  <div class="col-sm-1">
+    <h3 i18n>Groups</h3>
+    <ng-container *ngIf="subVolumeGroups$ | async as subVolumeGroups">
+      <ul class="nav flex-column nav-pills">
+        <li class="nav-item">
+          <a class="nav-link"
+             [class.active]="!activeGroupName"
+             (click)="selectSubVolumeGroup()">Default</a>
+        </li>
+        <li class="nav-item"
+            *ngFor="let subVolumeGroup of subVolumeGroups">
+          <a class="nav-link text-decoration-none text-break"
+             [class.active]="subVolumeGroup.name === activeGroupName"
+             (click)="selectSubVolumeGroup(subVolumeGroup.name)">{{subVolumeGroup.name}}</a>
+        </li>
+      </ul>
+    </ng-container>
+  </div>
+  <div class="col-11 vertical-line">
+    <cd-table [data]="subVolumes$ | async"
+              columnMode="flex"
+              [columns]="columns"
+              selectionType="single"
+              [hasDetails]="false"
+              (fetchData)="fetchData()"
+              (updateSelection)="updateSelection($event)">
+
+      <div class="table-actions btn-toolbar">
+        <cd-table-actions [permission]="permissions.cephfs"
+                          [selection]="selection"
+                          class="btn-group"
+                          id="cephfs-subvolume-actions"
+                          [tableActions]="tableActions">
+        </cd-table-actions>
+      </div>
+    </cd-table>
+  </div>
+</div>
+
+<ng-template #quotaUsageTpl
+             let-row="row">
+  <cd-usage-bar *ngIf="row.info.bytes_pcent && row.info.bytes_pcent !== 'undefined'; else noLimitTpl"
+                [total]="row.info.bytes_quota"
+                [used]="row.info.bytes_used"
+                [title]="row.name"
+                [showFreeToolTip]="false"
+                customLegend="Quota"
+                [customLegendValue]="row.info.bytes_quota"
+                decimals="2"></cd-usage-bar>
+
+  <ng-template #noLimitTpl>
+    <span ngbTooltip="Quota limit is not set"
+          *ngIf="row.info.bytes_pcent === 'undefined'"
+          i18n-ngbTooltip>
+      {{row.info.bytes_used | dimlessBinary}}</span>
+  </ng-template>
+</ng-template>
+
+<ng-template #typeTpl
+             let-value="value">
+  <cd-label [value]="value"></cd-label>
+</ng-template>
+
+<ng-template #modeToHumanReadableTpl
+             let-value="value">
+  <span *ngFor="let result of (value | octalToHumanReadable)"
+        [ngClass]="result.class"
+        [ngbTooltip]="result.toolTip">
+    {{ result.content }}
+  </span>
+</ng-template>
+
+<ng-template #nameTpl
+             let-row="row">
+  <span class="fw-bold">{{row.name}}</span>
+
+  <span *ngIf="row.info.state === 'complete'; else snapshotRetainedTpl">
+    <i [ngClass]="[icons.success, icons.large]"
+       ngbTooltip="{{row.name}} is ready to use"
+       class="text-success"></i>
+  </span>
+
+  <ng-template #snapshotRetainedTpl>
+    <i [ngClass]="[icons.warning, icons.large]"
+       class="text-warning"
+       ngbTooltip="{{row.name}} is removed after retaining the snapshots"></i>
+  </ng-template>
+
+  <cd-label [value]="row.info.type"
+            *ngIf="row.info.type !== 'subvolume'"></cd-label>
+
+  <cd-label value="namespaced"
+            *ngIf="row.info.pool_namespace"
+            [tooltipText]="row.info.pool_namespace"></cd-label>
+</ng-template>
+
+<ng-template #removeTmpl
+             let-form="form">
+  <ng-container [formGroup]="form">
+    <ng-container formGroupName="child">
+      <cd-alert-panel *ngIf="errorMessage.length > 1"
+                      type="error">
+              {{errorMessage}}
+      </cd-alert-panel>
+      <div class="form-group">
+        <div class="custom-control custom-checkbox">
+          <input type="checkbox"
+                 class="custom-control-input"
+                 name="retainSnapshots"
+                 id="retainSnapshots"
+                 formControlName="retainSnapshots">
+          <label class="custom-control-label"
+                 for="retainSnapshots"
+                 i18n>Retain snapshots <cd-helper>The subvolume can be removed retaining
+                  existing snapshots using this option.
+                   If snapshots are retained, the subvolume is considered empty for all
+                    operations not involving the retained snapshots.</cd-helper></label>
+        </div>
+      </div>
+    </ng-container>
+  </ng-container>
+</ng-template>