bfg-common 1.2.107 → 1.2.108

package/components/common/wizards/vm/migrate/select/storage/Storage.vue

@@ -1,131 +0,0 @@
-<template>
-  <div class="select-storage">
-    <common-wizards-vm-migrate-select-storage-selected-per-disk
-      v-if="isShowSelectedPerDisks"
-      v-model="isShowSelectedPerDisks"
-      v-model:active-tab="activeTab"
-      :data="selectedPerDisks"
-    />
-
-    <atoms-tabs
-      v-else
-      v-model="activeTab"
-      test-id="migrate-select-storage-tabs"
-      :items="selectStorageTabs"
-      size="small"
-      class="select-storage__tabs"
-    />
-
-    <common-wizards-vm-migrate-select-storage-configure-batch
-      v-show="activeTab === 'batch-configure'"
-      v-model:vm-disk-format="dataLocal.vmDiskFormat"
-      :get-datastore-table-func="props.getDatastoreTableFunc"
-      :datastore="props.datastore"
-      :connected-storage-id="props.connectedStorageId"
-      @update-selected-datastore="dataLocal.storage = $event"
-    />
-
-    <common-wizards-vm-migrate-select-storage-configure-disk
-      v-show="activeTab === 'configure-disk'"
-      v-model="isShowSelectedPerDisks"
-      v-model:active-tab="activeTab"
-      :configure-per-disks="props.configurePerDisks"
-      @update-selected-per-disks="selectedPerDisks = $event"
-    />
-
-    <div class="compatibility-wrap">
-      <p class="compatibility">
-        {{ localization.compatibility }}
-      </p>
-      <div class="compatibility-message flex-align-center">
-        <template v-if="dataLocal.storage">
-          <div class="icon-status-ok" />
-          <span>{{ localization.compatibilityChecksSucceeded }}</span>
-        </template>
-        <div v-else>
-          <br />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_I_TablePayload } from '~/models/store/interfaces'
-import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/models/interfaces'
-import type { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
-import type { UI_T_VmMigrateSelectStorageTab } from '~/components/common/wizards/vm/migrate/select/storage/models/types'
-import { vmMigrateSelectStorageTabsFunc } from '~/components/common/wizards/vm/migrate/select/storage/config/tabsPannel'
-
-const props = defineProps<{
-  submit: number
-  getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
-  datastore: UI_I_DatastoreTableItem[]
-  connectedStorageId: string | null
-  configurePerDisks: any
-}>()
-const emits = defineEmits<{
-  (event: 'next-step', value: any): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const activeTab = ref<UI_T_VmMigrateSelectStorageTab>('batch-configure')
-const selectStorageTabs = computed<UI_I_CollapseNavItem[]>(() =>
-  vmMigrateSelectStorageTabsFunc(localization.value)
-)
-
-// const selectedStorage = ref<UI_I_DatastoreTableItem | null>(null)
-const isShowSelectedPerDisks = ref<boolean>(false)
-const selectedPerDisks = ref<any[]>([])
-
-const dataLocal = ref<any>({
-  vmDiskFormat: 'same-format-source',
-  storage: null,
-})
-
-const checkValidityBlock = (): boolean => {
-  if (!dataLocal.value.storage) {
-    // const errorText = localization.value.nameCannotBeBlank
-    //
-    // showValidationErrors(errorText)
-    return false
-  }
-  const isActivePerDiskTab = activeTab.value === 'configure-disk'
-  emits('next-step', {
-    ...dataLocal.value,
-    tab: activeTab.value,
-    ...(isActivePerDiskTab && { configureDisks: props.configurePerDisks }),
-  })
-  return true
-}
-watch(
-  () => props.submit,
-  () => {
-    checkValidityBlock()
-  }
-)
-</script>
-
-<style lang="scss" scoped>
-.select-storage {
-  &__tabs {
-    width: 100%;
-    :deep(.nav) {
-      margin-top: 0;
-    }
-  }
-}
-
-.compatibility-wrap {
-  padding-top: 10px;
-
-  .compatibility-message {
-    border: 1px solid #000;
-    padding-top: 5px;
-    padding-left: 5px;
-    overflow: auto;
-  }
-}
-</style>

package/components/common/wizards/vm/migrate/select/storage/config/tabsPannel.ts

@@ -1,18 +0,0 @@
-import type { UI_I_Localization } from 'bfg-common/models/interfaces'
-import type { UI_I_CollapseNavItem } from 'bfg-common/components/atoms/collapse/models/interfaces'
-export const vmMigrateSelectStorageTabsFunc = (
-  localization: UI_I_Localization
-): UI_I_CollapseNavItem[] => {
-  return [
-    {
-      text: localization.batchConfigure,
-      value: 'batch-configure',
-      disabled: false,
-    },
-    {
-      text: localization.configurePerDisk,
-      value: 'configure-disk',
-      disabled: false,
-    },
-  ]
-}

package/components/common/wizards/vm/migrate/select/storage/configure/batch/Batch.vue

@@ -1,63 +0,0 @@
-<template>
-  <div>
-    <common-wizards-vm-migrate-select-storage-disk-format
-      v-model:vm-disk-format="selectedVmDiskFormat"
-    />
-
-    <common-wizards-vm-migrate-select-storage-policy />
-
-    <div class="clr-checkbox-wrapper flex-align-center w-100">
-      <input
-        id="suspend-on-revert"
-        v-model="isDisableStorageDrs"
-        type="checkbox"
-        class="checkbox-btn"
-      />
-      <label for="suspend-on-revert" class="clr-control-label">
-        {{ localization.disableStorageDRSVirtualMachine }}
-      </label>
-    </div>
-
-    <common-wizards-vm-migrate-select-storage-table-datastore
-      :get-datastore-table-func="props.getDatastoreTableFunc"
-      :datastore="props.datastore"
-      :connected-storage-id="props.connectedStorageId"
-      @update-selected-datastore="(e) => emits('update-selected-datastore', e)"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from 'bfg-common/models/interfaces'
-import type { UI_I_TablePayload } from 'bfg-common/models/store/interfaces'
-import type { UI_I_DatastoreTableItem } from 'bfg-common/models/store/storage/interfaces'
-
-const props = defineProps<{
-  vmDiskFormat: string
-  getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
-  datastore: UI_I_DatastoreTableItem[]
-  connectedStorageId: string | null
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const isDisableStorageDrs = ref<boolean>(false)
-
-const emits = defineEmits<{
-  (event: 'update-selected-datastore', value: UI_I_TablePayload): void
-  (event: 'update:vm-disk-format', value: string): void
-}>()
-
-
-
-const selectedVmDiskFormat = computed<string>({
-  get() {
-    return props.vmDiskFormat
-  },
-  set(newValue: string) {
-    emits('update:vm-disk-format', newValue)
-  },
-})
-</script>
-
-<style lang="scss" scoped></style>

package/components/common/wizards/vm/migrate/select/storage/configure/disk/Disk.vue

@@ -1,68 +0,0 @@
-<template>
-  <div class="migrate-configure-disk">
-    <div class="btn-group">
-      <button
-        id="vm-migrate-configure"
-        class="btn btn-link btn-sm"
-        :disabled="!selectedDisksFromTable.length"
-        @click="onConfigure"
-      >
-        {{ localization.configure }}
-      </button>
-    </div>
-
-    <common-wizards-vm-migrate-select-storage-table-disk
-      v-model:selected-per-disk="selectedPerDiskKeys"
-      :configure-per-disks="props.configurePerDisks"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/select/storage/table/disk/models/interfaces'
-import type { UI_T_VmMigrateSelectStorageTab } from '~/components/common/wizards/vm/migrate/select/storage/models/types'
-
-const props = defineProps<{
-  modelValue: boolean
-  configurePerDisks: UI_I_StorageConfigurePerDiskItem[]
-  activeTab: UI_T_VmMigrateSelectStorageTab
-}>()
-const emits = defineEmits<{
-  (event: 'update:model-value', value: boolean): void
-  (event: 'update-selected-per-disks', value: any[]): void
-  (event: 'update:active-tab', value: string): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedPerDiskKeys = ref<number[]>([])
-const selectedDisksFromTable = computed<any[]>(() => {
-  if (!props.configurePerDisks) return []
-
-  return props.configurePerDisks.filter((_: never, key: number) =>
-    selectedPerDiskKeys.value.includes(key)
-  )
-})
-
-const onConfigure = (): void => {
-  emits('update-selected-per-disks', selectedDisksFromTable.value)
-  emits('update:model-value', true)
-  activeTabValue.value = 'batch-configure'
-}
-
-const activeTabValue = computed<UI_T_VmMigrateSelectStorageTab>({
-  get() {
-    return props.activeTab
-  },
-  set(newValue: string) {
-    emits('update:active-tab', newValue)
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-.migrate-configure-disk {
-  margin-top: 10px;
-}
-</style>

package/components/common/wizards/vm/migrate/select/storage/diskFormat/DiskFormat.vue

@@ -1,66 +0,0 @@
-<template>
-  <section class="disk-format clr-flex-row">
-    <label
-      for="storage-locator-disk-format-label"
-      class="clr-col-3 clr-control-label"
-    >
-      {{ localization.selectVirtualDiskFormat }}
-    </label>
-    <div class="select select-lang mt-0 clr-form-control">
-      <select
-        id="storage-locator-disk-format-label"
-        v-model="selectedVirtualDiskFormat"
-        class="storage-locator-disk-format-label"
-      >
-        <option
-          v-for="option in configuredSpeedOptions"
-          :key="option.value"
-          :value="option.value"
-          :label="option.label"
-        >
-          {{ option.text }}
-        </option>
-      </select>
-    </div>
-  </section>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/models/interfaces'
-import { vmDiskFormatOptions } from '~/components/common/wizards/vm/migrate/select/storage/diskFormat/config/formatOptions'
-
-const props = defineProps<{
-  vmDiskFormat: string
-}>()
-const emits = defineEmits<{
-  (event: 'update:vm-disk-format', value: string): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const configuredSpeedOptions = computed<any[]>(() => vmDiskFormatOptions())
-
-const selectedVirtualDiskFormat = computed<string>({
-  get() {
-    return props.vmDiskFormat
-  },
-  set(newValue: string) {
-    emits('update:vm-disk-format', newValue)
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-@import 'assets/scss/common/mixins.scss';
-.disk-format {
-  @include flex($align: center);
-}
-.select-lang {
-  margin-left: 25px;
-  height: 24px;
-  min-width: 210px;
-  & > select {
-    height: 100%;
-  }
-}
-</style>

package/components/common/wizards/vm/migrate/select/storage/diskFormat/config/formatOptions.ts

@@ -1,24 +0,0 @@
-export const vmDiskFormatOptions = (): any[] => {
-  return [
-    {
-      text: 'Same Format as source',
-      label: 'Same Format as source',
-      value: 'same-format-source',
-    },
-    {
-      text: 'Thick Provision Lazy Zeroed',
-      label: 'Thick Provision Lazy Zeroed',
-      value: 'thick-provision-lazy-zeroed',
-    },
-    {
-      text: 'Thick Provision Eager Zeroed',
-      label: 'Thick Provision Eager Zeroed',
-      value: 'thick-provision-eager-zeroed',
-    },
-    {
-      text: 'Thin Provision',
-      label: 'Thin Provision',
-      value: 'thin-provision',
-    },
-  ]
-}

package/components/common/wizards/vm/migrate/select/storage/models/types.ts

@@ -1,3 +0,0 @@
-export type UI_T_VmMigrateSelectStorageTab =
-  | 'batch-configure'
-  | 'configure-disk'

package/components/common/wizards/vm/migrate/select/storage/policy/Policy.vue

@@ -1,88 +0,0 @@
-<template>
-  <section class="storage-policy clr-flex-row">
-    <label
-      for="storage-locator-disk-policy-label"
-      class="clr-col-3 clr-control-label"
-    >
-      {{ localization.vmStoragePolicy }}
-    </label>
-    <div
-      class="mt-0 clr-form-control btn btn-outline-primary dropdown-toggle storage-policy__select-wrapper"
-    >
-      <select
-        id="storage-locator-disk-policy-label"
-        v-model="selectedVmStoragePolicy"
-        class="storage-locator-disk-format-label"
-      >
-        <option
-          v-for="option in configuredSpeedOptions"
-          :key="option.value"
-          :value="option.value"
-          :label="option.label"
-        >
-          {{ option.text }}
-        </option>
-      </select>
-    </div>
-  </section>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/models/interfaces'
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedVmStoragePolicy = ref<string>('keep-existing-storage-policies')
-
-const configuredSpeedOptions = computed(() => {
-  return [
-    {
-      text: 'Keep existing VM storage policies',
-      label: 'Keep existing VM storage policies',
-      value: 'keep-existing-storage-policies',
-    },
-    {
-      text: 'Datastore Default',
-      label: 'Datastore Default',
-      value: 'datastore-default',
-    },
-    {
-      text: 'Management Storage Policy - Large',
-      label: 'Management Storage Policy - Large',
-      value: 'management-storage-policy-large',
-    },
-    {
-      text: 'Management Storage Policy - Regular',
-      label: 'Management Storage Policy - Regular',
-      value: 'management-storage-policy-regular',
-    },
-    {
-      text: 'vSAN Default Storage Policy',
-      label: 'vSAN Default Storage Policy',
-      value: 'vsan-default-storage-policy',
-    },
-  ]
-})
-</script>
-
-<style lang="scss" scoped>
-@import 'assets/scss/common/mixins.scss';
-.storage-policy {
-  @include flex($align: center);
-  margin-top: 2px;
-  &__select-wrapper {
-    margin-left: 25px;
-    height: 24px;
-    min-width: 420px;
-    & > select {
-      width: 100%;
-      height: 100%;
-      text-align: center;
-      border: none;
-      &:focus-visible {
-        outline: none;
-      }
-    }
-  }
-}
-</style>

package/components/common/wizards/vm/migrate/select/storage/selectedPerDisk/SelectedPerDisk.vue

@@ -1,84 +0,0 @@
-<template>
-  <div class="selected-per-disk">
-    <atoms-the-icon
-      class="icon-arrow"
-      name="arrow"
-      @click="onGoBack"
-    ></atoms-the-icon>
-
-    <div>
-      <span class="icon vsphere-icon-vm"></span>
-    </div>
-
-    <span v-if="normalizedData.length === 1">{{ normalizedData[0] }}</span>
-
-    <div v-else class="selected-per-disk__all-objects">
-      <span>
-        {{ localization.allSelectedObjects }}
-      </span>
-      <common-wizards-vm-common-tooltip>
-        <template #content>
-          <div v-for="(item, key) in normalizedData" :key="key">
-            {{ item }}
-          </div>
-        </template>
-      </common-wizards-vm-common-tooltip>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_T_VmMigrateSelectStorageTab } from '~/components/common/wizards/vm/migrate/select/storage/models/types'
-
-const props = defineProps<{
-  modelValue: boolean
-  activeTab: UI_T_VmMigrateSelectStorageTab
-  data: any[]
-}>()
-const emits = defineEmits<{
-  (event: 'update:model-value', value: boolean): void
-  (event: 'update:active-tab', value: UI_T_VmMigrateSelectStorageTab): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const normalizedData = computed<string[]>(() =>
-  props.data.map((item) => `${item.name} | ${item.file}`)
-)
-
-const onGoBack = (): void => {
-  emits('update:model-value', false)
-  activeTabValue.value = 'configure-disk'
-}
-
-const activeTabValue = computed<UI_T_VmMigrateSelectStorageTab>({
-  get() {
-    return props.activeTab
-  },
-  set(newValue: string) {
-    emits('update:active-tab', newValue)
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-@import 'assets/scss/common/mixins.scss';
-.selected-per-disk {
-  @include flex($align: center);
-  .icon {
-    display: block;
-  }
-  .icon-arrow {
-    width: 16px;
-    height: 16px;
-    margin: 0 20px 0 15px;
-    transform: rotate(270deg);
-    fill: #0079b8;
-    cursor: pointer;
-  }
-  &__all-objects {
-    @include flex($align: center);
-  }
-}
-</style>

package/components/common/wizards/vm/migrate/select/storage/table/datastore/Datastore.vue

@@ -1,105 +0,0 @@
-<template>
-  <div class="table-wrap">
-    <atoms-table-data-grid
-      v-model:selected-row="selectedStorageKey"
-      v-model:column-keys="columnKeys"
-      v-model:page-size="pagination.pageSize"
-      v-model:page="pagination.page"
-      type="radio"
-      :head-items="headItems"
-      :body-items="bodyItems"
-      :total-items="bodyItems.length"
-      :total-pages="1"
-      server-off
-      hide-page-size
-      @sorting="sorting"
-      @change="changeStorage"
-    >
-      <template #icon="{ item }">
-        <span :class="['datagrid-cell-icon', item.data]" />
-        <span class="text-ellipsis">
-          {{ item.text }}
-        </span>
-      </template>
-    </atoms-table-data-grid>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Pagination, UI_I_Localization } from '~/models/interfaces'
-import type { UI_I_TablePayload } from '~/models/store/interfaces'
-import type { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
-import type {
-  UI_I_ColumnKey,
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/models/interfaces'
-import * as table from '~/components/common/wizards/vm/migrate/select/storage/table/datastore/config/config'
-
-const props = defineProps<{
-  getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
-  datastore: UI_I_DatastoreTableItem[]
-  connectedStorageId: string | null
-}>()
-
-const emits = defineEmits<{
-  (event: 'update-selected-datastore', value: UI_I_TablePayload): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const headItems = ref<UI_I_HeadItem[]>(table.headItems(localization.value))
-const columnKeys = ref<UI_I_ColumnKey[]>(table.columnKeys(localization.value))
-watch(localization, () => {
-  columnKeys.value = table.columnKeys(localization.value)
-})
-
-const bodyItems = computed<UI_I_BodyItem[][]>(() => {
-  return table.bodyItems(props.datastore || [], localization.value)
-})
-
-const sort = ref<string | null>(null)
-const pagination = ref<UI_I_Pagination>({
-  page: 1,
-  pageSize: 100,
-})
-
-const sorting = (data: [string, boolean]): void => {
-  const [column, status] = data
-  const direction = status ? 'asc' : 'desc'
-  sort.value = `${column}.${direction}`
-
-  getStorage()
-}
-
-const getStorage = async (): Promise<void> => {
-  const payload: UI_I_TablePayload = {
-    pagination: pagination.value,
-    sortBy: sort.value,
-    type: 'datastore',
-    schema: 'full',
-  }
-
-  props.getDatastoreTableFunc(payload).then(() => {
-    selectedStorageKey.value = null
-    setStorageFromProps()
-  })
-}
-getStorage()
-
-const selectedStorageKey = ref<number | null>(null)
-const changeStorage = (index: number): void => {
-  if (!props.datastore) return
-  emits('update-selected-datastore', props.datastore[index])
-  selectedStorageKey.value = index
-}
-
-const setStorageFromProps = (): void => {
-  if (!props.connectedStorageId) return
-  props.datastore.forEach((item, index) => {
-    if (item.id === props.connectedStorageId) changeStorage(index)
-  })
-}
-</script>
-
-<style lang="scss" scoped></style>