bfg-common 1.5.541 → 1.5.543

package/components/common/pages/backups/modals/Modals.vue

@@ -1,243 +1,243 @@
-<template>
-  <common-pages-backups-modals-create-backup
-    v-if="schedulerTask.isShow"
-    v-model="backupForm"
-    v-model:scheduler-form="schedulerTaskForm"
-    :is-scheduled-tasks="schedulerTask.scheduler.isSchedulerTask"
-    :is-edit-scheduled-tasks="schedulerTask.scheduler.editTask"
-    :target="props.target"
-    :selected-vm-name="props.selectedVmName"
-    :disks="props.disks"
-    :disks-loading="props.disksLoading"
-    :datastore-table="props.datastoreTable"
-    :datastore-table-loading="props.datastoreTableLoading"
-    @change-step-create-backup="onChangeStepCreateBackup"
-    @check-name="onCheckBackupName"
-    @finish="onCreateBackup"
-    @hide="onHide"
-  />
-
-  <common-pages-backups-modals-restore
-    v-if="isShowRestoreModal"
-    v-model="restoreForm"
-    :datastore="props.restoreDatastore"
-    :datastore-loading="props.isRestoreDatastoreLoading"
-    :networks="props.restoreNetworks"
-    @get-datastore="onGetRestoreDatastore"
-    @get-networks="onGetRestoreNetworks"
-    @check-name="onCheckRestoreName"
-    @finish="onRestore"
-    @hide="onHide"
-  />
-
-  <common-pages-backups-modals-delete-backup
-    v-if="isShowDeleteBackupModal || isShowDeleteAllBackupsModal"
-    :name="action?.name"
-    :is-loading="isLoadingDeleteBackup"
-    :is-all="isShowDeleteAllBackupsModal"
-    @remove="onDeleteBackup"
-    @hide="onHide"
-  />
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
-import type { UI_T_Project } from '~/lib/models/types'
-import type {
-  UI_I_SendTaskParams,
-  UI_I_ModalPayload,
-} from '~/lib/models/interfaces'
-import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
-import type {
-  UI_I_BackupDatastoreTable,
-  UI_I_CreateBackupForm,
-  UI_I_Pvm,
-  UI_I_RestoreForm,
-} from '~/components/common/pages/backups/modals/lib/models/interfaces'
-import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
-import type { UI_I_NetworkTableItem } from '~/lib/models/store/network/interfaces'
-import type { UI_I_BackupAction } from '~/components/common/pages/backups/lib/models/interfaces'
-import type { UI_I_NameCheck } from '~/components/common/pages/backups/modals/restore/name/lib/models/interfaces'
-import { sendTask } from '~/lib/utils/sendTask'
-import { scheduledTaskDefaultFormFunc } from '~/components/common/pages/scheduledTasks/modals/lib/config/createScheduledTask'
-import { backupDefaultFormFunc } from '~/components/common/pages/backups/modals/lib/config/createBackup'
-import { restoreDefaultFormFunc } from '~/components/common/pages/backups/modals/lib/config/restore'
-import { scheduledTasks } from '~/components/common/pages/scheduledTasks/lib/utils/utils'
-
-const action = defineModel<UI_I_BackupAction | null>('action', {
-  required: true,
-})
-
-const props = defineProps<{
-  project: UI_T_Project
-  target: string
-  selectedVmName: string
-  disks: UI_I_Pvm['disk_devices']
-  disksLoading: boolean
-  datastoreTable: UI_I_BackupDatastoreTable | null
-  datastoreTableLoading: boolean
-  restoreDatastore: UI_I_DatastoreTableItem[]
-  isRestoreDatastoreLoading: boolean
-  restoreNetworks: UI_I_NetworkTableItem[]
-}>()
-const emits = defineEmits<{
-  (event: 'change-step-create-backup', value: UI_I_WizardStep[]): void
-  (event: 'get-restore-datastore', value: string): void
-  (event: 'get-restore-networks', value: string): void
-  (event: 'check-restore-name', value: UI_I_NameCheck): void
-  (event: 'check-backup-name', value: UI_I_NameCheck): void
-  (event: 'delete-backup', value: boolean): void
-}>()
-
-const { $store }: any = useNuxtApp()
-
-const backupForm = ref<UI_I_CreateBackupForm>(
-  useDeepCopy(backupDefaultFormFunc())
-)
-
-const schedulerTaskForm = ref<UI_I_ScheduleNewTasksForm>(
-  useDeepCopy(scheduledTaskDefaultFormFunc())
-)
-
-const restoreForm = ref<UI_I_RestoreForm>(useDeepCopy(restoreDefaultFormFunc()))
-const deleteBackupId = ref<string>('')
-
-const schedulerTask = computed<UI_I_ModalPayload>(
-  () => $store.getters['backup/getCreateBackupModal']
-)
-watch(
-  schedulerTask,
-  (newValue: UI_I_ModalPayload) => {
-    const { scheduler } = newValue
-    if (!scheduler.isSchedulerTask) return
-    schedulerTaskForm.value = scheduler.data
-  },
-  { immediate: true, deep: true }
-)
-
-const isShowDeleteBackupModal = ref<boolean>(false)
-const isShowDeleteAllBackupsModal = ref<boolean>(false)
-const isLoadingDeleteBackup = ref<boolean>(false)
-const isShowRestoreModal = ref<boolean>(false)
-
-const onCreateBackup = (): void => {
-  // TODO
-  backupForm.value.target = props.target
-  const backupTask: UI_I_SendTaskParams = {
-    method:
-      props.project === 'sphere'
-        ? 'VirtualMachines.CreateBackup'
-        : 'backup.create_backup',
-    target: props.target,
-    args: backupForm.value,
-  }
-
-  const {
-    scheduler: { isSchedulerTask, editTask, data },
-  } = schedulerTask.value
-  const sendData = isSchedulerTask
-    ? scheduledTasks(
-        schedulerTaskForm.value,
-        backupTask,
-        props.target,
-        editTask,
-        data,
-        props.project
-      )
-    : backupTask
-
-  sendTask(sendData)
-  onHide()
-}
-
-const onDeleteBackup = async (isAll: boolean): Promise<void> => {
-  isLoadingDeleteBackup.value = true
-  emits('delete-backup', isAll)
-  isLoadingDeleteBackup.value = false
-  onHide()
-}
-
-const onRestore = (): void => {
-  sendTask({
-    args: restoreForm.value,
-    method:
-      props.project === 'sphere'
-        ? 'VirtualMachines.RestoreBackup'
-        : 'backup.restore_backup',
-    target: props.target,
-  })
-  onHide()
-}
-
-watch(
-  action,
-  (newValue) => {
-    switch (newValue?.action) {
-      case 'createBackup':
-        // TODO
-        $store.dispatch('backup/A_SHOW_CREATE_BACKUP_MODAL', {
-          isShow: true,
-          scheduler: {
-            isSchedulerTask: false,
-            editTask: false,
-            data: null,
-          },
-        })
-        break
-      case 'restoreBackup':
-        isShowRestoreModal.value = true
-        restoreForm.value.backup_storage = newValue.storageId || ''
-        restoreForm.value.bucket = newValue.bucketId || ''
-        restoreForm.value.backup = newValue.backupId || ''
-        break
-      case 'deleteBackup':
-        deleteBackupId.value = newValue.backupId || ''
-        isShowDeleteBackupModal.value = true
-        break
-      case 'deleteBackupAll':
-        isShowDeleteAllBackupsModal.value = true
-        break
-    }
-  },
-  { deep: true }
-)
-
-const onHide = (): void => {
-  // TODO
-  $store.dispatch('backup/A_SHOW_CREATE_BACKUP_MODAL', {
-    isShow: false,
-    scheduler: {
-      isSchedulerTask: false,
-      editTask: false,
-      data: null,
-    },
-  })
-  isShowRestoreModal.value = false
-  isShowDeleteBackupModal.value = false
-  isShowDeleteAllBackupsModal.value = false
-
-  action.value.action = ''
-  backupForm.value = useDeepCopy(backupDefaultFormFunc())
-  backupForm.value.target = props.target
-  restoreForm.value = useDeepCopy(restoreDefaultFormFunc())
-}
-
-const onChangeStepCreateBackup = (value: UI_I_WizardStep[]): void => {
-  emits('change-step-create-backup', value)
-}
-const onCheckBackupName = (data: UI_I_NameCheck): void => {
-  emits('check-backup-name', data)
-}
-
-const onGetRestoreDatastore = (bucket: string): void => {
-  emits('get-restore-datastore', bucket)
-}
-const onGetRestoreNetworks = (hostId: string): void => {
-  emits('get-restore-networks', hostId)
-}
-const onCheckRestoreName = (data: UI_I_NameCheck): void => {
-  emits('check-restore-name', data)
-}
-</script>
-
-<style lang="scss" scoped></style>
+<template>
+  <common-pages-backups-modals-create-backup
+    v-if="schedulerTask.isShow"
+    v-model="backupForm"
+    v-model:scheduler-form="schedulerTaskForm"
+    :is-scheduled-tasks="schedulerTask.scheduler.isSchedulerTask"
+    :is-edit-scheduled-tasks="schedulerTask.scheduler.editTask"
+    :target="props.target"
+    :selected-vm-name="props.selectedVmName"
+    :disks="props.disks"
+    :disks-loading="props.disksLoading"
+    :datastore-table="props.datastoreTable"
+    :datastore-table-loading="props.datastoreTableLoading"
+    @change-step-create-backup="onChangeStepCreateBackup"
+    @check-name="onCheckBackupName"
+    @finish="onCreateBackup"
+    @hide="onHide"
+  />
+
+  <common-pages-backups-modals-restore
+    v-if="isShowRestoreModal"
+    v-model="restoreForm"
+    :datastore="props.restoreDatastore"
+    :datastore-loading="props.isRestoreDatastoreLoading"
+    :networks="props.restoreNetworks"
+    @get-datastore="onGetRestoreDatastore"
+    @get-networks="onGetRestoreNetworks"
+    @check-name="onCheckRestoreName"
+    @finish="onRestore"
+    @hide="onHide"
+  />
+
+  <common-pages-backups-modals-delete-backup
+    v-if="isShowDeleteBackupModal || isShowDeleteAllBackupsModal"
+    :name="action?.name"
+    :is-loading="isLoadingDeleteBackup"
+    :is-all="isShowDeleteAllBackupsModal"
+    @remove="onDeleteBackup"
+    @hide="onHide"
+  />
+</template>
+
+<script lang="ts" setup>
+import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
+import type { UI_T_Project } from '~/lib/models/types'
+import type {
+  UI_I_SendTaskParams,
+  UI_I_ModalPayload,
+} from '~/lib/models/interfaces'
+import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
+import type {
+  UI_I_BackupDatastoreTable,
+  UI_I_CreateBackupForm,
+  UI_I_Pvm,
+  UI_I_RestoreForm,
+} from '~/components/common/pages/backups/modals/lib/models/interfaces'
+import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
+import type { UI_I_NetworkTableItem } from '~/lib/models/store/network/interfaces'
+import type { UI_I_BackupAction } from '~/components/common/pages/backups/lib/models/interfaces'
+import type { UI_I_NameCheck } from '~/components/common/pages/backups/modals/restore/name/lib/models/interfaces'
+import { sendTask } from '~/lib/utils/sendTask'
+import { scheduledTaskDefaultFormFunc } from '~/components/common/pages/scheduledTasks/modals/lib/config/createScheduledTask'
+import { backupDefaultFormFunc } from '~/components/common/pages/backups/modals/lib/config/createBackup'
+import { restoreDefaultFormFunc } from '~/components/common/pages/backups/modals/lib/config/restore'
+import { scheduledTasks } from '~/components/common/pages/scheduledTasks/lib/utils/utils'
+
+const action = defineModel<UI_I_BackupAction | null>('action', {
+  required: true,
+})
+
+const props = defineProps<{
+  project: UI_T_Project
+  target: string
+  selectedVmName: string
+  disks: UI_I_Pvm['disk_devices']
+  disksLoading: boolean
+  datastoreTable: UI_I_BackupDatastoreTable | null
+  datastoreTableLoading: boolean
+  restoreDatastore: UI_I_DatastoreTableItem[]
+  isRestoreDatastoreLoading: boolean
+  restoreNetworks: UI_I_NetworkTableItem[]
+}>()
+const emits = defineEmits<{
+  (event: 'change-step-create-backup', value: UI_I_WizardStep[]): void
+  (event: 'get-restore-datastore', value: string): void
+  (event: 'get-restore-networks', value: string): void
+  (event: 'check-restore-name', value: UI_I_NameCheck): void
+  (event: 'check-backup-name', value: UI_I_NameCheck): void
+  (event: 'delete-backup', value: boolean): void
+}>()
+
+const { $store }: any = useNuxtApp()
+
+const backupForm = ref<UI_I_CreateBackupForm>(
+  useDeepCopy(backupDefaultFormFunc())
+)
+
+const schedulerTaskForm = ref<UI_I_ScheduleNewTasksForm>(
+  useDeepCopy(scheduledTaskDefaultFormFunc())
+)
+
+const restoreForm = ref<UI_I_RestoreForm>(useDeepCopy(restoreDefaultFormFunc()))
+const deleteBackupId = ref<string>('')
+
+const schedulerTask = computed<UI_I_ModalPayload>(
+  () => $store.getters['backup/getCreateBackupModal']
+)
+watch(
+  schedulerTask,
+  (newValue: UI_I_ModalPayload) => {
+    const { scheduler } = newValue
+    if (!scheduler.isSchedulerTask) return
+    schedulerTaskForm.value = scheduler.data
+  },
+  { immediate: true, deep: true }
+)
+
+const isShowDeleteBackupModal = ref<boolean>(false)
+const isShowDeleteAllBackupsModal = ref<boolean>(false)
+const isLoadingDeleteBackup = ref<boolean>(false)
+const isShowRestoreModal = ref<boolean>(false)
+
+const onCreateBackup = (): void => {
+  // TODO
+  backupForm.value.target = props.target
+  const backupTask: UI_I_SendTaskParams = {
+    method:
+      props.project === 'sphere'
+        ? 'VirtualMachines.CreateBackup'
+        : 'backup.create_backup',
+    target: props.target,
+    args: backupForm.value,
+  }
+
+  const {
+    scheduler: { isSchedulerTask, editTask, data },
+  } = schedulerTask.value
+  const sendData = isSchedulerTask
+    ? scheduledTasks(
+        schedulerTaskForm.value,
+        backupTask,
+        props.target,
+        editTask,
+        data,
+        props.project
+      )
+    : backupTask
+
+  sendTask(sendData)
+  onHide()
+}
+
+const onDeleteBackup = async (isAll: boolean): Promise<void> => {
+  isLoadingDeleteBackup.value = true
+  emits('delete-backup', isAll)
+  isLoadingDeleteBackup.value = false
+  onHide()
+}
+
+const onRestore = (): void => {
+  sendTask({
+    args: restoreForm.value,
+    method:
+      props.project === 'sphere'
+        ? 'VirtualMachines.RestoreBackup'
+        : 'backup.restore_backup',
+    target: props.target,
+  })
+  onHide()
+}
+
+watch(
+  action,
+  (newValue) => {
+    switch (newValue?.action) {
+      case 'createBackup':
+        // TODO
+        $store.dispatch('backup/A_SHOW_CREATE_BACKUP_MODAL', {
+          isShow: true,
+          scheduler: {
+            isSchedulerTask: false,
+            editTask: false,
+            data: null,
+          },
+        })
+        break
+      case 'restoreBackup':
+        isShowRestoreModal.value = true
+        restoreForm.value.backup_storage = newValue.storageId || ''
+        restoreForm.value.bucket = newValue.bucketId || ''
+        restoreForm.value.backup = newValue.backupId || ''
+        break
+      case 'deleteBackup':
+        deleteBackupId.value = newValue.backupId || ''
+        isShowDeleteBackupModal.value = true
+        break
+      case 'deleteBackupAll':
+        isShowDeleteAllBackupsModal.value = true
+        break
+    }
+  },
+  { deep: true }
+)
+
+const onHide = (): void => {
+  // TODO
+  $store.dispatch('backup/A_SHOW_CREATE_BACKUP_MODAL', {
+    isShow: false,
+    scheduler: {
+      isSchedulerTask: false,
+      editTask: false,
+      data: null,
+    },
+  })
+  isShowRestoreModal.value = false
+  isShowDeleteBackupModal.value = false
+  isShowDeleteAllBackupsModal.value = false
+
+  action.value.action = ''
+  backupForm.value = useDeepCopy(backupDefaultFormFunc())
+  backupForm.value.target = props.target
+  restoreForm.value = useDeepCopy(restoreDefaultFormFunc())
+}
+
+const onChangeStepCreateBackup = (value: UI_I_WizardStep[]): void => {
+  emits('change-step-create-backup', value)
+}
+const onCheckBackupName = (data: UI_I_NameCheck): void => {
+  emits('check-backup-name', data)
+}
+
+const onGetRestoreDatastore = (bucket: string): void => {
+  emits('get-restore-datastore', bucket)
+}
+const onGetRestoreNetworks = (hostId: string): void => {
+  emits('get-restore-networks', hostId)
+}
+const onCheckRestoreName = (data: UI_I_NameCheck): void => {
+  emits('check-restore-name', data)
+}
+</script>
+
+<style lang="scss" scoped></style>

package/components/common/pages/backups/modals/createBackup/New.vue

@@ -149,8 +149,9 @@
         </template>
         <template #content>
           <div class="mt-4">
-            <div class="ready-to-complete"></div>
-            <common-ready-to-complete :data="props.readyToCompleteData" />
+            <div class="ready-to-complete">
+              <common-ready-to-complete :data="props.readyToCompleteData" />
+            </div>
           </div>
         </template>
       </ui-wizard-block>
@@ -257,6 +258,11 @@ const onCreateDatastore = (): void => emits('submit')
 }
 
 .ready-to-complete {
+  :deep(.details-list__col-right) {
+    display: grid;
+    grid-template-columns: auto 1fr;
+    align-items: flex-start;
+  }
   :deep(.details-list):nth-child(1) {
     .details-item-value {
       white-space: break-spaces;

package/components/common/pages/backups/modals/createBackup/configuration/maxBandwidth/lib/config/options.ts

@@ -1,6 +1,6 @@
-import type {UI_I_SelectInputItem} from "~/components/common/select/input/lib/models/interfaces";
-
-export const maxBandwidthOptions: UI_I_SelectInputItem[] = [
-  { label: 'Mbps', value: 0 },
-  { label: 'Gbps', value: 1 },
-]
+import type {UI_I_SelectInputItem} from "~/components/common/select/input/lib/models/interfaces";
+
+export const maxBandwidthOptions: UI_I_SelectInputItem[] = [
+  { label: 'Mbps', value: 0 },
+  { label: 'Gbps', value: 1 },
+]

package/components/common/pages/backups/modals/createBackup/lib/config/readyToCompleteOptions.ts

@@ -1,69 +1,69 @@
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type {
-  UI_I_BackupDatastoreTable,
-  UI_I_CreateBackupForm,
-} from '~/components/common/pages/backups/modals/lib/models/interfaces'
-import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/lib/models/interfaces'
-import type { UI_I_SelectInputItem } from '~/components/common/select/input/lib/models/interfaces'
-
-export const readyToCompleteOptions = (
-  backupForm: UI_I_CreateBackupForm,
-  localization: UI_I_Localization,
-  strategyOptions: UI_I_SelectInputItem[],
-  datastoreTable: UI_I_BackupDatastoreTable | null
-): UI_I_TableInfoItem[] => {
-  const { $binary } = useNuxtApp()
-
-  const result = [
-    // General
-    {
-      label: localization.common.name,
-      value: backupForm.name,
-      iconClassName: 'icon-backup',
-    },
-    {
-      label: localization.common.description,
-      value: backupForm.description,
-    },
-  ]
-
-  // Disks
-  backupForm.disk_devices.forEach((disk_device, i) => {
-    result.push({
-      label: `${localization.common.disk} ${i + 1}`,
-      value: disk_device.location,
-      iconClassName: 'icon-vSphere-dsVmDisk',
-    })
-  })
-
-  // Datastores
-  const datastore = datastoreTable?.items.find(
-    (item) => item.id === backupForm.backup_storage
-  )
-  result.push({
-    label: localization.common.datastore,
-    value: datastore?.name || '',
-    iconClassName: 'vsphere-icon-datastore',
-  })
-
-  // Configuration
-  result.push({
-    label: localization.common.strategy,
-    value:
-      strategyOptions.find((option) => option.value === backupForm.strategy)
-        ?.label || '',
-  })
-
-  const gbSizeByB = 1_073_741_824
-  const maxBandwidth =
-    backupForm.bandwidth_limit >= gbSizeByB
-      ? $binary.bToGb(backupForm.bandwidth_limit) + ' Gbps'
-      : $binary.bToMb(backupForm.bandwidth_limit) + ' Mbps'
-
-  result.push({
-    label: localization.common.maxBandwidth,
-    value: maxBandwidth,
-  })
-
-  return result
-}
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type {
+  UI_I_BackupDatastoreTable,
+  UI_I_CreateBackupForm,
+} from '~/components/common/pages/backups/modals/lib/models/interfaces'
+import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/lib/models/interfaces'
+import type { UI_I_SelectInputItem } from '~/components/common/select/input/lib/models/interfaces'
+
+export const readyToCompleteOptions = (
+  backupForm: UI_I_CreateBackupForm,
+  localization: UI_I_Localization,
+  strategyOptions: UI_I_SelectInputItem[],
+  datastoreTable: UI_I_BackupDatastoreTable | null
+): UI_I_TableInfoItem[] => {
+  const { $binary } = useNuxtApp()
+
+  const result = [
+    // General
+    {
+      label: localization.common.name,
+      value: backupForm.name,
+      iconClassName: 'icon-backup',
+    },
+    {
+      label: localization.common.description,
+      value: backupForm.description,
+    },
+  ]
+
+  // Disks
+  backupForm.disk_devices.forEach((disk_device, i) => {
+    result.push({
+      label: `${localization.common.disk} ${i + 1}`,
+      value: disk_device.location,
+      iconClassName: 'icon-vSphere-dsVmDisk',
+    })
+  })
+
+  // Datastores
+  const datastore = datastoreTable?.items.find(
+    (item) => item.id === backupForm.backup_storage
+  )
+  result.push({
+    label: localization.common.datastore,
+    value: datastore?.name || '',
+    iconClassName: 'vsphere-icon-datastore',
+  })
+
+  // Configuration
+  result.push({
+    label: localization.common.strategy,
+    value:
+      strategyOptions.find((option) => option.value === backupForm.strategy)
+        ?.label || '',
+  })
+
+  const gbSizeByB = 1_073_741_824
+  const maxBandwidth =
+    backupForm.bandwidth_limit >= gbSizeByB
+      ? $binary.bToGb(backupForm.bandwidth_limit) + ' Gbps'
+      : $binary.bToMb(backupForm.bandwidth_limit) + ' Mbps'
+
+  result.push({
+    label: localization.common.maxBandwidth,
+    value: maxBandwidth,
+  })
+
+  return result
+}