bfg-common 1.5.773 → 1.5.775

package/components/common/pages/backups/backupsNew/Skeleton.vue

@@ -1,136 +0,0 @@
-<template>
-  <div class="skeleton-page grid gap-3 p-4 h-inherit overflow-hidden">
-    <div class="left-content grid p-4">
-      <div class="flex justify-between gap-4 flex-wrap">
-        <ui-skeleton-item width="80" height="20" />
-        <ui-skeleton-item width="160" height="36" />
-      </div>
-      <div class="border-block flex flex-col py-3 px-4 my-4">
-        <ui-skeleton-item width="100%" height="20" />
-        <ui-skeleton-item width="50%" height="20" />
-        <ui-skeleton-item width="30%" height="20" />
-        <ui-skeleton-item width="70%" height="20" />
-        <ui-skeleton-item width="20%" height="20" />
-        <ui-skeleton-item width="50%" height="20" />
-        <ui-skeleton-item width="80%" height="20" />
-        <ui-skeleton-item width="70%" height="20" />
-        <ui-skeleton-item width="20%" height="20" />
-      </div>
-      <ui-skeleton-item width="96" height="20" class="ml-auto" />
-    </div>
-    <div class="right-content grid p-4">
-      <div class="flex justify-between gap-4 pr-4 flex-wrap top-container">
-        <ui-skeleton-item width="80" height="20" />
-        <div class="actions-block flex">
-          <ui-skeleton-item width="20" height="20" />
-          <div class="line-border"></div>
-          <ui-skeleton-item width="20" height="20" />
-          <div class="line-border"></div>
-          <ui-skeleton-item width="20" height="20" />
-        </div>
-      </div>
-      <div
-        ref="detailsScrollBlock"
-        :class="[
-          'details-block flex flex-col my-6',
-          { 'has-scroll': hasScroll },
-        ]"
-      >
-        <div
-          v-for="index in detailsItemsCount"
-          :key="index"
-          class="details-block-item flex p-3"
-        >
-          <ui-skeleton-item width="20" height="20" class="mr-[10px]" />
-          <ui-skeleton-item width="144" height="20" />
-          <ui-skeleton-item width="144" height="20" class="ml-auto" />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useElementSize } from '@vueuse/core'
-
-const detailsItemsCount = ref<number>(3)
-
-const detailsElement = useTemplateRef<HTMLDivElement>('detailsScrollBlock')
-const { height } = useElementSize(detailsElement)
-
-const hasScroll = computed<boolean>(
-  () =>
-    height.value &&
-    detailsElement.value?.scrollHeight > detailsElement.value?.clientHeight
-)
-</script>
-
-<style>
-:root {
-  --backups-left-skeleton-border-color: #e9ebed;
-  --backups-right-skeleton-action-line-border-color: #e9ebeda3;
-  --backups-right-skeleton-item-bg-color: #e9ebed66;
-}
-:root.dark-theme {
-  --backups-left-skeleton-border-color: #e9ebed1f;
-  --backups-right-skeleton-action-line-border-color: #e9ebed1f;
-  --backups-right-skeleton-item-bg-color: #e9ebed0f;
-}
-</style>
-
-<style scoped lang="scss">
-.skeleton-page {
-  grid-template-columns: repeat(2, calc(50% - 6px));
-
-  .left-content,
-  .right-content {
-    background-color: var(--backups-page-inner-block-bg);
-    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.0784313725);
-    border-radius: 8px;
-    grid-template-rows: max-content 1fr max-content;
-    overflow: hidden;
-  }
-  .border-block {
-    border: 1px solid var(--backups-left-skeleton-border-color);
-    border-radius: 8px;
-    grid-row-gap: 10px;
-    overflow: auto;
-
-    :deep(.skeleton-item) {
-      min-height: 20px;
-    }
-  }
-  .right-content {
-    padding-right: 0;
-
-    .top-container {
-      .actions-block {
-        grid-column-gap: 10px;
-
-        .line-border {
-          border: 1px solid
-            var(--backups-right-skeleton-action-line-border-color);
-        }
-      }
-    }
-    .details-block {
-      grid-row-gap: 10px;
-      overflow: auto;
-
-      &:not(.has-scroll) {
-        padding-right: 16px;
-      }
-
-      .details-block-item {
-        background-color: var(--backups-right-skeleton-item-bg-color);
-        border-radius: 6px;
-      }
-
-      :deep(.skeleton-item) {
-        min-height: 20px;
-      }
-    }
-  }
-}
-</style>

package/components/common/pages/files/lib/models/enums.ts

@@ -1,36 +0,0 @@
-export enum UI_E_DatastoreFileType {
-  FOLDER = 1,
-  FILE,
-  VIRTUAL_DISK,
-  VM_LOG_FILE,
-  NON_MEMORY_FILE,
-  ISO_IMAGE,
-  VIRTUAL_MACHINE,
-}
-
-export enum UI_E_FileNameOfType {
-  'Folder' = 1,
-  'File',
-  'Virtual Disk',
-  'VM Log File',
-  'Non-volatile Memory File',
-  'ISO Image',
-  'Virtual Machine',
-}
-
-export enum UI_E_FileIconsOfType {
-  'vsphere-icon-datastore',
-  'vsphere-icon-folder',
-  'icon-vSphere-dsFile',
-  'icon-vSphere-dsVmDisk',
-  'icon-vSphere-dsVmLog',
-  'icon-vSphere-dsVmNvram',
-  'icon-vSphere-dsIsoImage',
-  'vsphere-icon-vm',
-}
-
-export enum UI_E_FileProvisioningType {
-  thinProvision = 1,
-  thickProvisionLazyZeroed = 2,
-  thickProvisionEagerZeroed = 3,
-}

package/components/common/pages/tasks/table/lib/models/interfaces.ts

@@ -1,9 +0,0 @@
-import type { UI_T_AllTypeNodes } from '~/lib/models/types'
-import type { UI_I_TaskItem } from '~/lib/models/store/tasks/interfaces'
-
-export interface UI_I_TaskConfig {
-  iconFunc: (type: UI_T_AllTypeNodes) => string
-  idFunc: (task: UI_I_TaskItem<UI_T_AllTypeNodes>) => string
-  navFunc: (type: UI_T_AllTypeNodes) => string
-  typeFunc: (type: UI_T_AllTypeNodes) => string
-}

package/components/common/qr/Qr.vue

@@ -1,69 +0,0 @@
-<template>
-  <div class="qrcode">
-    <!--    <img v-if="qrDataUrl" :src="qrDataUrl" alt="QR Code" class="qr-image" />-->
-    <Qrcode
-      :value="props.qrCodeUrl"
-      :width="props.width"
-      :height="props.height"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-// import QRCode from 'qrcode'
-
-const props = withDefaults(
-  defineProps<{
-    qrCodeUrl: string
-    width?: string
-    height?: string
-  }>(),
-  {
-    width: '130',
-    height: '130',
-  }
-)
-
-// const qrDataUrl = ref<string>('')
-// const generateQRCode = async (): Promise<void> => {
-//   try {
-//     qrDataUrl.value = await QRCode.toDataURL(props.qrCodeUrl, {
-//       width: 150,
-//       margin: 2,
-//     })
-//   } catch (error) {
-//     console.error('Error generating QR code:', error)
-//   }
-// }
-//
-// watch(
-//   () => props.qrCodeUrl,
-//   (newValue) => {
-//     newValue && generateQRCode()
-//   },
-//   { immediate: true }
-// )
-</script>
-
-<style scoped lang="scss">
-//.qr-code-display {
-//  text-align: center;
-//  max-width: 400px;
-//  margin: 0 auto;
-//}
-//
-//.qr-wrapper {
-//  margin: 20px 0;
-//  padding: 20px;
-//  background: white;
-//  border-radius: 12px;
-//  border: 1px solid #e0e0e0;
-//  display: inline-block;
-//}
-//
-//.qr-canvas,
-//.qr-image {
-//  width: 150px;
-//  height: 150px;
-//}
-</style>

package/components/common/vm/snapshots/DetailView.vue

@@ -1,90 +0,0 @@
-<template>
-  <div class="detail-view overflow-auto py-0 px-6">
-    <table
-      v-if="detailData"
-      class="table table-noborder"
-      data-id="detail-view-table"
-    >
-      <tbody>
-        <tr>
-          <td class="left">{{ localization.common.name }}</td>
-          <td class="left snapshot-name-label" data-id="vm-snapshot-name">
-            {{ detailData.name }}
-          </td>
-        </tr>
-        <tr>
-          <td class="left">{{ localization.common.description }}</td>
-          <td
-            class="left snapshot-name-label"
-            data-id="vm-snapshot-description"
-          >
-            {{ detailData.description }}
-          </td>
-        </tr>
-        <tr>
-          <td class="left">{{ localization.snapshots.timestamp }}</td>
-          <td class="left snapshot-name-label" data-id="vm-snapshot-timestamp">
-            {{ detailData.timestamp }}
-          </td>
-        </tr>
-        <tr>
-          <td class="left">{{ localization.common.size }}</td>
-          <td class="left snapshot-name-label">{{ detailData.size }}</td>
-        </tr>
-        <tr>
-          <td class="left">
-            {{ localization.common.snapshotTheVirtualMachinesMemory }}
-          </td>
-          <td class="left snapshot-name-label" data-id="vm-snapshot-of-memory">
-            {{ detailData.snapshot_the_virtual_machines_memory }}
-          </td>
-        </tr>
-        <tr>
-          <td class="left">
-            {{ localization.common.quiesceGuestFileSystem }}
-          </td>
-          <td
-            class="left snapshot-name-label"
-            data-id="vm-snapshot-file-system"
-          >
-            {{ detailData.quiesce_guest_file_system }}
-          </td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_SnapshotsDetails } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-
-const props = defineProps<{
-  detail: UI_I_SnapshotsDetails | null
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const detailData = ref<any | null>(null)
-watch(
-  () => props.detail,
-  (newValue) => {
-    if (!newValue) return
-
-    detailData.value = newValue
-  },
-  { immediate: true, deep: true }
-)
-</script>
-
-<style scoped lang="scss">
-.detail-view {
-  width: 50%;
-
-  .table {
-    .left:not(.snapshot-name-label) {
-      width: 320px;
-    }
-  }
-}
-</style>

package/components/common/vm/snapshots/Old.vue

@@ -1,71 +0,0 @@
-<template>
-  <div class="main-content-snapshots h-full overflow-hidden">
-    <common-vm-snapshots-tools
-      :snapshots-count="props.snapshotsTree.length"
-      :snapshots-loading="props.snapshotsLoading"
-      @select="emits('show-modal', $event)"
-    />
-
-    <atoms-loader-pre-loader
-      v-show="props.snapshotsLoading"
-      id="loader"
-      class="snapshots-loading w-full h-full flex items-center justify-center"
-      test-id="snapshots-tree-spinner"
-      show
-    />
-    <div class="fill-parent w-full h-full">
-      <div
-        v-if="props.snapshotsTree.length"
-        class="snapshot-view mt-1 flex w-full"
-      >
-        <common-tree-view
-          :loading="props.snapshotsLoading"
-          :nodes="props.snapshotsTree"
-          @select-node="emits('select-node', $event)"
-          @show-nodes="emits('show-nodes', $event)"
-        />
-        <common-vm-snapshots-detail-view :detail="props.detailData" />
-      </div>
-      <div v-else class="empty-block flex items-center justify-center w-full">
-        {{ localization.common.noSnapshotAvailable }}
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type {
-  UI_I_SnapshotsDetails,
-  UI_I_SnapshotsTreeNode,
-} from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-
-const props = defineProps<{
-  snapshotsTree: UI_I_SnapshotsTreeNode[]
-  snapshotsLoading: boolean
-  detailData: UI_I_SnapshotsDetails | null
-}>()
-
-const emits = defineEmits<{
-  (event: 'show-modal', value: UI_T_SnapshotActionType): void
-  (event: 'select-node', value: UI_I_SnapshotsTreeNode): void
-  (event: 'show-nodes', value: string): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-
-<style scoped lang="scss">
-.main-content-snapshots {
-  padding: 10px 5px 10px 0;
-
-  .fill-parent {
-    overflow: visible;
-
-    .snapshot-view {
-      height: 90%;
-    }
-  }
-}
-</style>

package/components/common/vm/snapshots/Snapshots.vue

@@ -1,82 +0,0 @@
-<template>
-  <component
-    :is="currentComponent"
-    :snapshots-tree="props.snapshotsTree"
-    :snapshots-loading="props.snapshotsLoading"
-    :detail-data="detailData"
-    @show-modal="onShowModal"
-    @select-node="onSelectNode"
-    @show-nodes="onShowNodes"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-import type {
-  UI_I_SnapshotsDetails,
-  UI_I_SnapshotsTreeNode,
-} from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-
-const props = defineProps<{
-  snapshotsTree: UI_I_SnapshotsTreeNode
-  snapshotsLoading: boolean
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-node', value: UI_I_SnapshotsTreeNode): void
-  (event: 'show-nodes', value: string): void
-  (event: 'show-modal', value: UI_T_SnapshotActionType): void
-}>()
-
-const { $recursion, $store }: any = useNuxtApp()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-const currentComponent = computed(() =>
-  isNewView.value
-    ? defineAsyncComponent(() => import('./new/New.vue'))
-    : defineAsyncComponent(() => import('./Old.vue'))
-)
-
-const detailData = computed<UI_I_SnapshotsDetails | null>(() => {
-  const node: UI_I_SnapshotsTreeNode =
-    $recursion.find(props.snapshotsTree, true, 'isActive', 'nodes') || null
-
-  if (!node) return null
-
-  let snapshot_the_virtual_machines_memory = ''
-  let quiesce_guest_file_system = ''
-
-  if (isNewView.value) {
-    snapshot_the_virtual_machines_memory = node.memory?.enabled ? 'yes' : 'no'
-    quiesce_guest_file_system = node.quiesce_fs ? 'yes' : 'no'
-  } else {
-    snapshot_the_virtual_machines_memory = node.memory?.enabled
-      ? localization.value.common.yes
-      : localization.value.common.no
-    quiesce_guest_file_system = node.quiesce_fs
-      ? localization.value.common.yes
-      : localization.value.common.no
-  }
-
-  return {
-    ...node,
-    snapshot_the_virtual_machines_memory,
-    quiesce_guest_file_system,
-  }
-})
-const onSelectNode = (item: UI_I_SnapshotsTreeNode): void => {
-  emits('select-node', item.type === 'location' ? item.parent_id : item.id)
-}
-const onShowNodes = (id: string): void => {
-  emits('show-nodes', id)
-}
-
-const onShowModal = (action: UI_T_SnapshotActionType): void => {
-  emits('show-modal', action)
-}
-</script>
-
-<style scoped lang="scss"></style>

package/components/common/vm/snapshots/lib/models/interfaces.ts

@@ -1,5 +0,0 @@
-export interface UI_I_TakeEditSnapshot {
-  snapshot_id: number
-  name: string
-  description: string
-}

package/components/common/vm/snapshots/lib/models/types.ts

@@ -1,11 +0,0 @@
-export type UI_T_SnapshotActionType =
-  | 'take'
-  | 'edit'
-  | 'revert'
-  | 'delete'
-  | 'delete_all'
-  | 'group_take'
-  | 'group_delete_all'
-
-export type UI_T_TakeOrEdit = 'take' | 'edit' | 'groupTake'
-

package/components/common/vm/snapshots/modals/confirm/Confirm.vue

@@ -1,48 +0,0 @@
-<template>
-  <component
-    :is="currentComponent"
-    v-model:suspend-on-revert="suspendOnRevert"
-    :type="props.type"
-    :snapshot="props.snapshot"
-    :snapshots-count="props.snapshotsCount"
-    :vm-state="props.vmState"
-    @hide="emits('hide')"
-    @submit="emits('submit', suspendOnRevert)"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_SnapshotsTreeNode } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-
-const props = withDefaults(
-  defineProps<{
-    type: UI_T_SnapshotActionType
-    snapshot: UI_I_SnapshotsTreeNode | null
-    snapshotsCount: number
-    targets: string[]
-    vmState?: number | null
-  }>(),
-  {
-    vmState: null,
-  }
-)
-
-const emits = defineEmits<{
-  (event: 'hide'): void
-  (event: 'submit', value: boolean): void
-}>()
-
-const { $store }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-const currentComponent = computed(() =>
-  isNewView.value
-    ? defineAsyncComponent(() => import('./New.vue'))
-    : defineAsyncComponent(() => import('./Old.vue'))
-)
-
-const suspendOnRevert = ref<boolean>(false)
-</script>
-
-<style scoped lang="scss"></style>

package/components/common/vm/snapshots/modals/confirm/New.vue

@@ -1,128 +0,0 @@
-<template>
-  <common-modals-confirmation
-    :headline="title"
-    :description="descriptionText"
-    :modal-texts="modalTextsLocal"
-    :loading="false"
-    :icon-name="modalIcon"
-    test-id="vm-snapshots-modal"
-    is-new-view
-    @hide-modal="emits('hide')"
-    @confirm="emits('submit')"
-  >
-    <template v-if="props.type === 'revert'" #otherContent>
-      <div class="confirm-modal-checkbox-content mt-4 p-3">
-        <ui-checkbox
-          v-model="suspendOnRevert"
-          :label-text="
-            localization.common
-              .suspendThisVirtualMachineWhenRevertingToSelectedSnapshot
-          "
-          :disabled="props.vmState === 2"
-          test-id="vm-snapshots-modal-revert-checkbox"
-          class="confirm-modal-checkbox flex items-start"
-          size="md"
-        />
-      </div>
-    </template>
-  </common-modals-confirmation>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_ModalTexts } from '~/node_modules/bfg-uikit/components/ui/modal/models/interfaces'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_SnapshotsTreeNode } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-import { UI_E_TitleModal } from '~/components/common/vm/snapshots/modals/confirm/lib/models/enums'
-import { modalTexts } from '~/components/common/vm/snapshots/modals/lib/config/modalTexts'
-
-const suspendOnRevert = defineModel<boolean>('suspendOnRevert', {
-  required: true,
-})
-const props = defineProps<{
-  type: UI_T_SnapshotActionType
-  snapshot: UI_I_SnapshotsTreeNode | null
-  snapshotsCount: number
-  vmState: number | null
-}>()
-
-const emits = defineEmits<{
-  (event: 'hide'): void
-  (event: 'submit'): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const modalTextsLocal = computed<UI_I_ModalTexts>(() =>
-  modalTexts(localization.value, props.type)
-)
-
-const title = computed<string>(() =>
-  props.snapshotsCount === 1 && props.type === 'delete'
-    ? localization.value.snapshots.deleteTheLastSnapshot
-    : localization.value.snapshots[UI_E_TitleModal[props.type]] || ''
-)
-
-const modalIcon = computed<string>(() =>
-  props.type === 'delete_all' ||
-  (props.snapshotsCount === 1 && props.type === 'delete')
-    ? 'circle-warning'
-    : 'info-status'
-)
-
-const descriptionText = computed<string>(() => {
-  let description: string
-
-  switch (props.type) {
-    case 'delete_all':
-      description = localization.value.snapshots.deleteAllSnapshotsDescription
-      break
-
-    case 'revert':
-      description =
-        localization.value.snapshots.revertToSnapshotDescription.replace(
-          '{0}',
-          props.snapshot?.name || ''
-        )
-      break
-
-    default:
-      description =
-        props.snapshotsCount === 1
-          ? localization.value.snapshots.deleteLastSnapshotsDescription
-          : localization.value.snapshots.deleteSnapshotConfirmationDescription.replace(
-              '{0}',
-              props.snapshot?.name || ''
-            )
-      break
-  }
-
-  return description
-})
-
-// TODO Удалить если не надо
-// const descriptionDeleteContent = computed<string>(() =>
-//   props.snapshotsCount === 1
-//     ? localization.value.snapshots.deleteLastSnapshotsDescription
-//     : localization.value.snapshots.deleteSnapshotConfirmationDescription.replace(
-//         '{0}',
-//         props.snapshot?.name || ''
-//       )
-// )
-</script>
-
-<style scoped lang="scss">
-.confirm-modal-checkbox-content {
-  background-color: #e9ebed66;
-  border-radius: 8px;
-
-  .confirm-modal-checkbox {
-    height: max-content;
-
-    :deep(.ui-checkbox-label-text) {
-      line-height: 18px;
-      margin-top: 1px;
-    }
-  }
-}
-</style>