bfg-common 1.5.506 → 1.5.508

package/assets/localization/local_be.json

@@ -2168,6 +2168,10 @@
     "diskIsRequired": "Патрабуецца дыск",
     "datastoreIsRequired": "Патрабуецца сховішча даных",
     "noBackupAvailable": "Няма даступнай рэзервовай копіі",
+    "noBackupsAvailable": "Няма даступных рэзервовых копій",
+    "noBackupsAvailableDesc": "Стварыце рэзервовую копію, каб аднавіць сваю віртуальную машыну пры неабходнасці.",
+    "backupDetails": "Падрабязнасці рэзервовай копіі",
+    "backupHasNoDescriptionYet": "Гэтая рэзервовая копія яшчэ не мае апісання.",
     "unpinMenu": "Адмацаваць меню",
     "newBackupStorage": "Новае рэзервовае сховішча",
     "samba": "Samba",
@@ -2471,7 +2475,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "Вы ўпэўненыя, што хочаце працягнуць працу без якіх-небудзь актыўных фізічных сеткавых адаптараў для камутатара? Каб праглядзець унесеныя змены, націсніце кнопку Адмена.",
     "noConnectedPhysicalNetworkAdaptersTitle": "Усе прызначаныя фізічныя сеткавыя адаптары адключаныя!",
     "noConnectedPhysicalNetworkAdaptersMessage": "Вы ўпэўненыя, што хочаце працягнуць працу з адключанымі фізічнымі сеткавымі адаптарамі? Каб праглядзець унесеныя змены, націсніце Адмена.",
-    "generalSettings": "Агульныя налады"
+    "generalSettings": "Агульныя налады",
+    "specifyValidHostDestinationComputeResource": "Укажыце сапраўдны хост як мэтавы вылічальны рэсурс.",
+    "selectValidHostDestinationComputeResource": "Выберыце сапраўдны хост як мэтавы вылічальны рэсурс."
   },
   "auth": {
     "welcomeTo": "Сардэчна запрашаем у",
@@ -3406,7 +3412,11 @@
     "specifyServerAddressExample": "Укажыце адрас сервера, напрыклад: nas, nas.it.com або 192.168.0.1.",
     "serverPlaceholder": "Напрыклад: nas, nas.it.com або 192.168.0.1",
     "storageReview": "Перагледзьце падрабязнасці перад стварэннем рэзервовага сховішча.",
-    "backupStorageName": "Назва рэзервовага сховішча"
+    "backupStorageName": "Назва рэзервовага сховішча",
+    "deleteBackupConfirmation": "Пацверджанне выдалення рэзервовай копіі",
+    "deleteBackupConfirmationDesc": "Вы ўпэўненыя, што хочаце выдаліць рэзервовую копію «{0}»?",
+    "deleteAllBackupsConfirmation": "Пацверджанне выдалення ўсіх рэзервовых копій",
+    "deleteAllBackupsConfirmationDesc": "Вы ўпэўненыя, што хочаце выдаліць усе рэзервовыя копіі?"
   },
   "ssoUsers": {
     "passwordRequirements": "Патрабаванні да пароля",

package/assets/localization/local_en.json

@@ -2171,6 +2171,10 @@
     "diskIsRequired": "Disk is required",
     "datastoreIsRequired": "Datastore is required",
     "noBackupAvailable": "No backup available",
+    "noBackupsAvailable": "No backups available",
+    "noBackupsAvailableDesc": "Create a backup to restore your virtual machine from it whenever needed.",
+    "backupDetails": "Backup Details",
+    "backupHasNoDescriptionYet": "This backup has no description yet.",
     "unpinMenu": "Unpin Menu",
     "newBackupStorage": "New Backup Storage",
     "samba": "Samba",
@@ -2475,7 +2479,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "Are you sure you want to continue without any active physical network adapters for the switch? To review your changes, click Cancel.",
     "noConnectedPhysicalNetworkAdaptersTitle": "All Assigned Physical Network Adapters are Disconnected!",
     "noConnectedPhysicalNetworkAdaptersMessage": "Are you sure you want to continue with all assigned physical network adapters disconnected? To review your changes, click Cancel.",
-    "generalSettings": "General Settings"
+    "generalSettings": "General Settings",
+    "specifyValidHostDestinationComputeResource": "Specify a valid host as destination compute resource.",
+    "selectValidHostDestinationComputeResource": "Select a valid host as destination compute resource."
   },
   "auth": {
     "welcomeTo": "Welcome to",
@@ -3410,7 +3416,11 @@
     "specifyServerAddressExample": "Specify the server address - for example, nas, nas.it.com or 192.168.0.1.",
     "serverPlaceholder": "E.g: nas, nas.it.com or 192.168.0.1",
     "storageReview": "Review the details before the backup storage is created.",
-    "backupStorageName": "Backup Storage Name"
+    "backupStorageName": "Backup Storage Name",
+    "deleteBackupConfirmation": "Delete Backup Confirmation",
+    "deleteBackupConfirmationDesc": "Are you sure you want to delete backup “{0}”?",
+    "deleteAllBackupsConfirmation": "Delete All Backups Confirmation",
+    "deleteAllBackupsConfirmationDesc": "Are you sure you want to delete all backups?"
   },
   "ssoUsers": {
     "passwordRequirements": "Password requirements",

package/assets/localization/local_hy.json

@@ -2171,6 +2171,10 @@
     "diskIsRequired": "Պահանջվում է սկավառակ",
     "datastoreIsRequired": "Պահանջվում է տվյալների պահեստ",
     "noBackupAvailable": "Պահուստավորում չկա",
+    "noBackupsAvailable": "Առկա չեն պահուստային պատճեններ",
+    "noBackupsAvailableDesc": "Ստեղծեք պահուստային պատճեն, որպեսզի կարողանաք վերականգնել ձեր վիրտուալ մեքենան անհրաժեշտության դեպքում։",
+    "backupDetails": "Պահուստային պատճենի մանրամասներ",
+    "backupHasNoDescriptionYet": "Այս պահուստային պատճենը դեռևս չունի նկարագրություն։",
     "unpinMenu": "Ապամրացնել ընտրացանկը",
     "newBackupStorage": "Կրկնօրինակման նոր պահեստ",
     "samba": "Samba",
@@ -2475,7 +2479,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "Համոզվա՞ծ եք, որ ցանկանում եք շարունակել աշխատել առանց անջատիչի համար ակտիվ ֆիզիկական ցանցային ադապտերների: Կատարված փոփոխությունները դիտելու համար սեղմեք Չեղարկել կոճակը:",
     "noConnectedPhysicalNetworkAdaptersTitle": "Բոլոր նշանակված ֆիզիկական ցանցային ադապտերներն անջատված են:",
     "noConnectedPhysicalNetworkAdaptersMessage": "Համոզվա՞ծ եք, որ ցանկանում եք շարունակել աշխատել անջատված ֆիզիկական ցանցային ադապտերների հետ: Կատարված փոփոխությունները դիտելու համար սեղմեք Չեղարկել կոճակը:",
-    "generalSettings": "Ընդհանուր պարամետրեր"
+    "generalSettings": "Ընդհանուր պարամետրեր",
+    "specifyValidHostDestinationComputeResource": "Նշեք վավեր հոստ՝ որպես նպատակային հաշվարկային ռեսուրս։",
+    "selectValidHostDestinationComputeResource": "Ընտրեք վավեր հոստ՝ որպես նպատակային հաշվարկային ռեսուրս։"
   },
   "auth": {
     "welcomeTo": "Բարի գալուստ",
@@ -3410,7 +3416,11 @@
     "specifyServerAddressExample": "Նշեք սերվերի հասցեն, օրինակ՝ nas, nas.it.com կամ 192.168.0.1։",
     "serverPlaceholder": "Օրինակ՝ nas, nas.it.com կամ 192.168.0.1",
     "storageReview": "Մինչ պահուստային պահեստի ստեղծումը, վերանայեք մանրամասները։",
-    "backupStorageName": "Պահուստային պահեստի անունը"
+    "backupStorageName": "Պահուստային պահեստի անունը",
+    "deleteBackupConfirmation": "Ջնջել պահուստային պատճենի հաստատումը",
+    "deleteBackupConfirmationDesc": "Համոզվա՞ծ եք, որ ուզում եք ջնջել «{0}» պահուստային պատճենը?",
+    "deleteAllBackupsConfirmation": "Ջնջել բոլոր պահուստային պատճենների հաստատումը",
+    "deleteAllBackupsConfirmationDesc": "Համոզվա՞ծ եք, որ ուզում եք ջնջել բոլոր պահուստային պատճենները?"
   },
   "ssoUsers": {
     "passwordRequirements": "Գաղտնաբառի պահանջներ",

package/assets/localization/local_kk.json

@@ -2170,6 +2170,10 @@
     "diskIsRequired": "Диск қажет",
     "datastoreIsRequired": "Деректер қоймасы қажет",
     "noBackupAvailable": "Сақтық көшірме жоқ",
+    "noBackupsAvailable": "Қолжетімді сақтық көшірмелер жоқ",
+    "noBackupsAvailableDesc": "Қажет болған жағдайда виртуалды машинаңызды қалпына келтіру үшін сақтық көшірме жасаңыз.",
+    "backupDetails": "Сақтық көшірменің егжей-тегжейі",
+    "backupHasNoDescriptionYet": "Бұл сақтық көшірмеге әлі сипаттама қосылмаған.",
     "unpinMenu": "Мәзірді босату",
     "newBackupStorage": "Жаңа сақтық көшірме қоймасы",
     "samba": "Samba",
@@ -2474,7 +2478,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "Коммутатор үшін белсенді физикалық желілік адаптерлерсіз жалғастырғыңыз келетініне сенімдісіз бе? Өзгерістерді көру үшін \"Болдырмау\" түймесін басыңыз.",
     "noConnectedPhysicalNetworkAdaptersTitle": "Барлық Тағайындалған Физикалық Желілік Адаптерлер Ажыратылған!",
     "noConnectedPhysicalNetworkAdaptersMessage": "Барлық тағайындалған физикалық желілік адаптерлерді ажыратуды жалғастырғыңыз келетініне сенімдісіз бе? Өзгерістерді көру үшін \"Болдырмау\" түймесін басыңыз.",
-    "generalSettings": "Жалпы Параметрлер"
+    "generalSettings": "Жалпы Параметрлер",
+    "specifyValidHostDestinationComputeResource": "Мақсатты есептеу ресурсы ретінде жарамды хостты көрсетіңіз.",
+    "selectValidHostDestinationComputeResource": "Мақсатты есептеу ресурсы ретінде жарамды хостты таңдаңыз."
   },
   "auth": {
     "welcomeTo": "Қош келдіңіз",
@@ -3409,7 +3415,11 @@
     "specifyServerAddressExample": "Сервердің мекенжайын көрсетіңіз, мысалы: nas, nas.it.com немесе 192.168.0.1.",
     "serverPlaceholder": "Мысалы: nas, nas.it.com немесе 192.168.0.1",
     "storageReview": "Резервтік сақтау орнын жасамас бұрын мәліметтерді қарап шығыңыз.",
-    "backupStorageName": "Резервтік сақтау атауы"
+    "backupStorageName": "Резервтік сақтау атауы",
+    "deleteBackupConfirmation": "Сақтық көшірмені растауды жою",
+    "deleteBackupConfirmationDesc": "{0}» сақтық көшірмесін шынымен жойғыңыз келе ме?",
+    "deleteAllBackupsConfirmation": "Барлық сақтық көшірмелерді жою растауы",
+    "deleteAllBackupsConfirmationDesc": "Барлық сақтық көшірмелерді жойғыңыз келетініне сенімдісіз бе?"
   },
   "ssoUsers": {
     "passwordRequirements": "Парольге қойылатын талаптар",

package/assets/localization/local_ru.json

@@ -2170,6 +2170,10 @@
     "diskIsRequired": "Требуется диск",
     "datastoreIsRequired": "Требуется хранилище данных",
     "noBackupAvailable": "Резервная копия недоступна",
+    "noBackupsAvailable": "Нет доступных резервных копий",
+    "noBackupsAvailableDesc": "Создайте резервную копию, чтобы при необходимости восстановить свою виртуальную машину.",
+    "backupDetails": "Подробности резервной копии",
+    "backupHasNoDescriptionYet": "У этой резервной копии пока нет описания.",
     "unpinMenu": "Открепить меню",
     "newBackupStorage": "Новое хранилище резервных копий",
     "samba": "Samba",
@@ -2474,7 +2478,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "Вы уверены, что хотите продолжить работу без каких-либо активных физических сетевых адаптеров для коммутатора? Чтобы просмотреть внесенные изменения, нажмите кнопку Отмена.",
     "noConnectedPhysicalNetworkAdaptersTitle": "Все назначенные физические сетевые адаптеры отключены!",
     "noConnectedPhysicalNetworkAdaptersMessage": "Вы уверены, что хотите продолжить работу с отключенными физическими сетевыми адаптерами? Чтобы просмотреть внесенные изменения, нажмите кнопку Отмена.",
-    "generalSettings": "Общие настройки"
+    "generalSettings": "Общие настройки",
+    "specifyValidHostDestinationComputeResource": "Укажите допустимый хост в качестве целевого вычислительного ресурса.",
+    "selectValidHostDestinationComputeResource": "Выберите допустимый хост в качестве целевого вычислительного ресурса."
   },
   "auth": {
     "welcomeTo": "Добро пожаловать в",
@@ -3409,7 +3415,11 @@
     "specifyServerAddressExample": "Укажите адрес сервера, например: nas, nas.it.com или 192.168.0.1.",
     "serverPlaceholder": "Например: nas, nas.it.com или 192.168.0.1",
     "storageReview": "Просмотрите информацию перед созданием хранилища резервных копий.",
-    "backupStorageName": "Имя хранилища резервных копий"
+    "backupStorageName": "Имя хранилища резервных копий",
+    "deleteBackupConfirmation": "Подтверждение удаления резервной копии",
+    "deleteBackupConfirmationDesc": "Вы уверены, что хотите удалить резервную копию “{0}”?",
+    "deleteAllBackupsConfirmation": "Подтверждение удаления всех резервных копий",
+    "deleteAllBackupsConfirmationDesc": "Вы уверены, что хотите удалить все резервные копии?"
   },
   "ssoUsers": {
     "passwordRequirements": "Требования к паролю",

package/assets/localization/local_zh.json

@@ -2169,6 +2169,10 @@
     "diskIsRequired": "需要磁盘",
     "datastoreIsRequired": "需要数据存储",
     "noBackupAvailable": "没有可用的备份",
+    "noBackupsAvailable": "没有可用的备份",
+    "noBackupsAvailableDesc": "创建备份，以便在需要时恢复您的虚拟机。",
+    "backupDetails": "备份详情",
+    "backupHasNoDescriptionYet": "此备份尚无描述。",
     "unpinMenu": "取消固定菜单",
     "newBackupStorage": "新的备份存储",
     "samba": "Samba",
@@ -2472,7 +2476,9 @@
     "noActivePhysicalNetworkAdaptersMessage": "您确定要在没有任何用于交换机的活动物理网络适配器的情况下继续吗？ 要查看更改，请单击\"取消\"。",
     "noConnectedPhysicalNetworkAdaptersTitle": "所有分配的物理网络适配器都断开连接!",
     "noConnectedPhysicalNetworkAdaptersMessage": "您确定要继续断开所有已分配的物理网络适配器的连接吗？ 要查看更改，请单击\"取消\"。",
-    "generalSettings": "常规设置"
+    "generalSettings": "常规设置",
+    "specifyValidHostDestinationComputeResource": "请指定一个有效的主机作为目标计算资源。",
+    "selectValidHostDestinationComputeResource": "请选择一个有效的主机作为目标计算资源。"
   },
   "auth": {
     "welcomeTo": "欢迎来到",
@@ -3407,7 +3413,11 @@
     "specifyServerAddressExample": "指定服务器地址，例如：nas、nas.it.com 或 192.168.0.1。",
     "serverPlaceholder": "例如：nas、nas.it.com 或 192.168.0.1",
     "storageReview": "在创建备份存储之前，请查看详细信息。",
-    "backupStorageName": "备份存储名称"
+    "backupStorageName": "备份存储名称",
+    "deleteBackupConfirmation": "删除备份确认",
+    "deleteBackupConfirmationDesc": "您确定要删除备份“{0}”吗？",
+    "deleteAllBackupsConfirmation": "删除所有备份确认",
+    "deleteAllBackupsConfirmationDesc": "您确定要删除所有备份吗？"
   },
   "ssoUsers": {
     "passwordRequirements": "密码要求",

package/components/common/pages/backups/Backups.vue

@@ -1,53 +1,45 @@
 <template>
-  <div class="main-content-backups h-full overflow-hidden">
-    <common-pages-backups-tools
-      :project="props.project"
-      :backups-count="backupsTree.length"
-      :backups-loading="backupsLoading"
-      :selected-node="selectedNode"
-      :target-type="typeFromRoute"
-      @select="onShowModal"
-    />
-
-    <atoms-loader-pre-loader
-      v-show="backupsLoading"
-      id="loader"
-      :show="true"
-      class="backups-loading w-full h-full flex items-center justify-center"
-      test-id="backups-tree-spinner"
-    />
-    <div class="fill-parent w-full h-full">
-      <div v-if="backupsTree.length" class="backup-view mt-1 flex w-full">
-        <common-tree-view
-          :loading="backupsLoading"
-          :nodes="backupsTree"
-          @select-node="onSelectNode"
-          @show-nodes="onShowNodes"
-        />
-        <common-pages-backups-detail-view :detail="detailData" />
-      </div>
-      <div v-else class="empty-block flex justify-center items-center w-full">
-        {{ localization.common.noBackupAvailable }}
-      </div>
-    </div>
-  </div>
+  <common-pages-backups-backups-new
+    v-if="isNewView"
+    :backups-tree="props.backupsTree"
+    :backups-loading="props.backupsLoading"
+    :type-from-route="typeFromRoute"
+    :detail-data="detailData"
+    :create-backup-permission="createBackupPermission"
+    :restore-backup-permission="restoreBackupPermission"
+    :delete-backup-permission="deleteBackupPermission"
+    :delete-all-permission="deleteAllPermission"
+    @set-action="emits('set-action', $event)"
+    @select-node="onSelectNode"
+    @show-nodes="onShowNodes"
+  />
+  <common-pages-backups-old
+    v-else
+    :backups-tree="props.backupsTree"
+    :backups-loading="props.backupsLoading"
+    :selected-node="props.selectedNode"
+    :type-from-route="typeFromRoute"
+    :detail-data="detailData"
+    :create-backup-permission="createBackupPermission"
+    :restore-backup-permission="restoreBackupPermission"
+    :delete-backup-permission="deleteBackupPermission"
+    :delete-all-permission="deleteAllPermission"
+    @set-action="emits('set-action', $event)"
+    @select-node="onSelectNode"
+    @show-nodes="onShowNodes"
+  />
 </template>
 
 <script setup lang="ts">
 import type { UI_T_Project } from '~/lib/models/types'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type {
   UI_T_TargetType,
   UI_T_BackupActionType,
 } from '~/components/common/pages/backups/lib/models/types'
-import type {
-  UI_I_Backup,
-  UI_I_BackupsTreeNode,
-} from '~/components/common/pages/backups/lib/models/interfaces'
+import type { UI_I_BackupsTreeNode } from '~/components/common/pages/backups/lib/models/interfaces'
 
 const props = defineProps<{
   project: UI_T_Project
-  backups: UI_I_Backup[]
   backupsTree: UI_I_BackupsTreeNode[]
   backupsLoading: boolean
   selectedNode: UI_I_BackupsTreeNode | null
@@ -58,45 +50,46 @@ const emits = defineEmits<{
   (event: 'set-action', value: UI_T_BackupActionType): void
 }>()
 
-const localization = computed<UI_I_Localization>(() => useLocal())
-const { $recursion }: any = useNuxtApp()
+const { $recursion, $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
 
 const typeFromRoute = computed<UI_T_TargetType>(
   () => useRoute().params.type.toString() as UI_T_TargetType
 )
 
+const createBackupPermission = computed<string>(() =>
+  props.project === 'sphere' ? 'VirtualMachines.CreateBackup' : ''
+)
+
+const restoreBackupPermission = computed<string>(() =>
+  props.project === 'sphere' ? 'VirtualMachines.RestoreBackup' : ''
+)
+
+const deleteBackupPermission = computed<string>(() =>
+  props.project === 'sphere' ? 'VirtualMachines.DeleteBackup' : ''
+)
+
+const deleteAllPermission = computed<string>(() =>
+  props.project === 'sphere' ? 'VirtualMachines.DeleteBackups' : ''
+)
+
 const detailData = computed<UI_I_BackupsTreeNode | null>(() => {
   const node =
     $recursion.find(props.backupsTree, true, 'isActive', 'nodes') || null
   return node?.type === 'backup' ? node : null
 })
 
+const onShowNodes = (id: string | number): void => {
+  emits('show-nodes', id)
+}
+
 const onSelectNode = (item: UI_I_BackupsTreeNode): void => {
   emits('select-node', item.id)
   if (item.type === 'group') {
     onShowNodes(item.id.toString())
   }
 }
-const onShowNodes = (id: string | number): void => {
-  emits('show-nodes', id)
-}
-
-const onShowModal = (action: UI_T_BackupActionType): void => {
-  emits('set-action', action)
-}
 </script>
 
-<style scoped lang="scss">
-.main-content-backups {
-  padding: 10px 5px 10px 0;
-
-  .fill-parent {
-    overflow: visible;
-
-    .backup-view {
-      // TODO fix
-      height: calc(90% - 24px);
-    }
-  }
-}
-</style>
+<style scoped lang="scss"></style>

package/components/common/pages/backups/BackupsOld.vue

@@ -0,0 +1,80 @@
+<template>
+  <div class="main-content-backups h-full overflow-hidden">
+    <common-pages-backups-tools
+      :backups-count="props.backupsTree.length"
+      :backups-loading="props.backupsLoading"
+      :selected-node="props.selectedNode"
+      :target-type="props.typeFromRoute"
+      :create-backup-permission="props.createBackupPermission"
+      :restore-backup-permission="props.restoreBackupPermission"
+      :delete-backup-permission="props.deleteBackupPermission"
+      :delete-all-permission="props.deleteAllPermission"
+      @select="emits('set-action', $event)"
+    />
+
+    <atoms-loader-pre-loader
+      v-show="props.backupsLoading"
+      id="loader"
+      class="backups-loading w-full h-full flex items-center justify-center"
+      test-id="backups-tree-spinner"
+      show
+    />
+    <div class="fill-parent w-full h-full">
+      <div v-if="props.backupsTree.length" class="backup-view mt-1 flex w-full">
+        <common-tree-view
+          :loading="props.backupsLoading"
+          :nodes="props.backupsTree"
+          @select-node="emits('select-node', $event)"
+          @show-nodes="emits('show-nodes', $event)"
+        />
+        <common-pages-backups-detail-view :detail="props.detailData" />
+      </div>
+      <div v-else class="empty-block flex justify-center items-center w-full">
+        {{ localization.common.noBackupAvailable }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_BackupsTreeNode } from '~/components/common/pages/backups/lib/models/interfaces'
+import type {
+  UI_T_TargetType,
+  UI_T_BackupActionType,
+} from '~/components/common/pages/backups/lib/models/types'
+
+const props = defineProps<{
+  backupsTree: UI_I_BackupsTreeNode[]
+  backupsLoading: boolean
+  selectedNode: UI_I_BackupsTreeNode | null
+  typeFromRoute: UI_T_TargetType
+  detailData: UI_I_BackupsTreeNode | null
+  createBackupPermission: string
+  restoreBackupPermission: string
+  deleteBackupPermission: string
+  deleteAllPermission: string
+}>()
+const emits = defineEmits<{
+  (event: 'show-nodes', value: string | number): void
+  (event: 'set-action', value: UI_T_BackupActionType): void
+  (event: 'select-node', value: UI_I_BackupsTreeNode): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+</script>
+
+<style scoped lang="scss">
+.main-content-backups {
+  padding: 10px 5px 10px 0;
+
+  .fill-parent {
+    overflow: visible;
+
+    .backup-view {
+      // TODO fix
+      height: calc(90% - 24px);
+    }
+  }
+}
+</style>