bfg-common 1.5.774 → 1.5.775

package/components/common/configure/advancedSystemSettings/tableView/TableView.vue

@@ -1,30 +0,0 @@
-<template>
-  <component
-    :is="currentComponent"
-    v-model:settings="settings"
-    :data-table="props.data?.items || []"
-    :total-items="props.data?.total_items || 0"
-    :total-pages="props.data?.total_pages || 1"
-    :is-edit="props.isEdit"
-  />
-</template>
-
-<script lang="ts" setup>
-const settings = defineModel<any>('settings', {required: true})
-const props = withDefaults(
-  defineProps<{
-    data: any
-    isEdit?: boolean
-  }>(),
-  { isEdit: false }
-)
-
-const { $store }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-const currentComponent = computed(() =>
-  isNewView.value
-    ? defineAsyncComponent(() => import('./new/New.vue'))
-    : defineAsyncComponent(() => import('./old/Old.vue'))
-)
-</script>

package/components/common/configure/advancedSystemSettings/tableView/new/New.vue

@@ -1,193 +0,0 @@
-<template>
-  <div class="device-table-container">
-    <ui-data-table
-      :data="data"
-      :options="options"
-      :total-pages="props.totalPages"
-      :total-items="props.totalItems"
-      :texts="texts"
-      :default-layout="false"
-      :skeleton="tableSkeleton"
-      test-id="compute-resource-table"
-      class="device-table"
-      size="sm"
-      @select-row="onSelectRow"
-    >
-      <template #icon="{ item }">
-        <span :class="['device-table__icon', item.data.iconClassName]" />
-        <span class="device-table__text text-ellipsis">
-          {{ item.text }}
-        </span>
-      </template>
-
-      <template #progress="{ item }">
-        <div class="progress flex items-center justify-between w-full">
-          <div class="progress-line">
-            <div
-              v-if="item.data"
-              :style="`width: ${item.data}%`"
-              class="progress-line-fill"
-            ></div>
-          </div>
-          <div
-            :class="[
-              'progress-text',
-              {
-                'progress-full': item.data === 100,
-              },
-            ]"
-          >
-            {{ item.text }}
-          </div>
-        </div>
-      </template>
-
-      <template #status="{ item }">
-        <ui-chip
-          :test-id="item.data.testId"
-          :color="item.data.chipColor"
-          size="sm"
-          rounded
-        >
-          <ui-icon
-            :name="item.data.icon"
-            width="14px"
-            height="14px"
-            class="chip-icon"
-          ></ui-icon>
-          {{ item.text }}
-        </ui-chip>
-      </template>
-
-      <template #skeleton-header>
-        <div class="flex justify-between items-center">
-          <ui-skeleton-item width="80" height="20" />
-          <ui-skeleton-item width="88" height="28" border-radius="6" />
-        </div>
-      </template>
-    </ui-data-table>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type {
-  UI_I_DataTable,
-  UI_I_DataTableHeader,
-  UI_I_DataTableBody,
-  UI_I_TableTexts,
-} from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
-import type { UI_I_DataTableSkeleton } from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
-import {
-  options,
-  getHeaderDataFunc,
-  getBodyDataFunc,
-} from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/config/hostTable'
-
-const selectedDataLocal = defineModel<number | null>({ required: true })
-const props = defineProps<{
-  dataTable: any[]
-  totalItems: number
-  totalPages: number
-  isEdit: boolean
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const texts = computed<UI_I_TableTexts>(() => ({
-  searchHere: localization.value.common.searchHere,
-  rowsPerPage: localization.value.common.rowsPerPage,
-  of: localization.value.common.of,
-  selected: localization.value.common.selected2,
-  columns: localization.value.common.columns,
-  previous: localization.value.common.previous,
-  next: localization.value.common.next,
-  noItemsFound: localization.value.common.noItemsFound,
-  exportAll: localization.value.common.exportAll,
-  exportSelected: localization.value.common.exportSelected,
-  all: localization.value.common.all,
-  filter: localization.value.common.filter,
-}))
-
-const tableSkeleton = ref<UI_I_DataTableSkeleton>({
-  columnsCount: 4,
-  headColumns: [],
-  bodyColumns: [],
-  withoutPagination: true,
-})
-
-const data = computed<UI_I_DataTable>(() => ({
-  id: 'compute-resource-host-table',
-  title: `${localization.value.common.hosts} (${props.totalItems})`,
-  header: deviceHeadItems.value,
-  body: deviceBodyItems.value,
-}))
-
-const deviceHeadItems = computed<UI_I_DataTableHeader[]>(() =>
-  getHeaderDataFunc(localization.value)
-)
-
-const deviceBodyItems = ref<UI_I_DataTableBody[]>([])
-watch(
-  () => props.dataTable,
-  (newValue: UI_T_ComputeResourceTableItem[]) => {
-    if (!newValue?.length) {
-      deviceBodyItems.value = []
-      return
-    }
-
-    deviceBodyItems.value = getBodyDataFunc(newValue, localization.value)
-  },
-  { deep: true, immediate: true }
-)
-
-const onSelectRow = (value: UI_I_DataTableBody[]): void => {
-  selectedDataLocal.value = value?.[0].row
-}
-</script>
-
-<style lang="scss" scoped>
-.device-table-container {
-  margin: 20px 0 24px;
-  :deep(.column-manager-button.sm span) {
-    font-weight: 500;
-  }
-  :deep(.table-title .title-container h6) {
-    font-size: 12px;
-  }
-  .device-table {
-    &__icon {
-      margin-right: 4px;
-    }
-    &__text {
-      font-size: 12px;
-    }
-  }
-  .progress {
-    &-line {
-      height: 12px;
-      width: 100%;
-      background: #e9ebed8f;
-      border-radius: 6px;
-
-      &-fill {
-        height: 12px;
-        min-width: 12px;
-        background: #008fd6;
-        border-radius: 6px;
-      }
-    }
-
-    &-text {
-      width: 53px;
-      min-width: 53px;
-      margin-left: 8px;
-      text-align: right;
-
-      &.progress-full {
-        color: #ea3223;
-      }
-    }
-  }
-}
-</style>

package/components/common/configure/advancedSystemSettings/tableView/new/lib/config/hostTable.ts

@@ -1,308 +0,0 @@
-import type {
-  UI_I_DataTableBody,
-  UI_I_DataTableOptions,
-  UI_I_DataTableHeader,
-} from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_HostTableItem } from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/lib/models/interfaces'
-import {
-  UI_E_DeviceStatus,
-  UI_E_DeviceStatusChipColor,
-  UI_E_DeviceStatusIcon,
-} from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/models/enums'
-import {
-  hostIconByState,
-  hostLocalizationByState,
-} from '~/components/common/lib/config/states'
-
-// Маппинг для статусов
-const STATUS_MAPPING = {
-  [UI_E_DeviceStatus.Unknown]: {
-    icon: UI_E_DeviceStatusIcon.HelpIcon,
-    chipColor: UI_E_DeviceStatusChipColor.Primary,
-  },
-  [UI_E_DeviceStatus.Supported]: {
-    icon: UI_E_DeviceStatusIcon.StatusCheck,
-    chipColor: UI_E_DeviceStatusChipColor.Green,
-  },
-  [UI_E_DeviceStatus.NotSupported]: {
-    icon: UI_E_DeviceStatusIcon.Close,
-    chipColor: UI_E_DeviceStatusChipColor.Red,
-  },
-}
-
-export const getHeaderDataFunc = (
-  localization: UI_I_Localization
-): UI_I_DataTableHeader[] => [
-  {
-    col: 'col0',
-    colName: 'name',
-    text: localization.common.name,
-    isSortable: true,
-    sort: 'asc',
-    width: '180px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col1',
-    colName: 'state',
-    text: localization.inventorySummary.state,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col2',
-    colName: 'cluster',
-    text: localization.common.cluster,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col3',
-    colName: 'fault_domain',
-    text: localization.common.faultDomain,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col4',
-    colName: 'consumed_cpu',
-    text: `${localization.common.consumedCpu} %`,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col5',
-    colName: 'consumed_mem',
-    text: `${localization.common.consumedMemory} %`,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col6',
-    colName: 'ha_state',
-    text: localization.common.haState,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col7',
-    colName: 'uptime',
-    text: localization.inventorySummary.uptime,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col8',
-    colName: 'cert_valid_to',
-    text: localization.common.certificateValidTo,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col9',
-    colName: 'mem_size',
-    text: `${localization.common.memorySize} (${localization.common.mb})`,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col10',
-    colName: 'cpus',
-    text: localization.common.cpus,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col11',
-    colName: 'nics',
-    text: localization.inventorySummary.nics,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col12',
-    colName: 'version',
-    text: localization.common.version,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-  {
-    col: 'col13',
-    colName: 'alarm_action',
-    text: localization.common.alarmActions,
-    isSortable: true,
-    sort: 'asc',
-    width: '96px',
-    show: true,
-    filter: false,
-  },
-]
-export const options: UI_I_DataTableOptions = {
-  perPageOptions: [{ text: '10', value: 100, default: true }],
-  isSelectable: true,
-  selectType: 'radio',
-  showPagination: false,
-  showPageInfo: false,
-  isSortable: true,
-  server: true,
-  isResizable: true,
-  showSelectedRows: false,
-  showColumnManager: true,
-  inModal: true,
-  inBlock: false,
-  // isFocusable: false,
-  // showPaginationOnTop: false,
-  // showSearch: false,
-  // withActions: false,
-  // showExport: false,
-  // withCollapse: false,
-}
-
-export const getBodyDataFunc = (
-  bodyData: UI_I_HostTableItem[],
-  localization: UI_I_Localization
-): UI_I_DataTableBody[] => {
-  const { $number } = useNuxtApp() as any
-
-  return bodyData.map((host, index: number) => {
-    const statusKey = host.state
-      ? UI_E_DeviceStatus.Unknown
-      : UI_E_DeviceStatus.Supported
-    const statusData = {
-      ...STATUS_MAPPING[statusKey],
-      testId: `${host.name}-${index}-status`,
-    }
-
-    return {
-      row: index,
-      collapse: false,
-      isHiddenCollapse: false,
-      collapseToggle: false,
-
-      data: [
-        {
-          key: 'icon',
-          col: 'col0',
-          text: host.name,
-          data: `vsphere-icon-${hostIconByState[host.state]}`,
-          testId: `migrate-host-table-item-${index}`,
-        },
-
-        {
-          key: 'status',
-          col: 'col1',
-          text: localization.common[hostLocalizationByState[host.state]],
-          testId: `migrate-host-table-item-${index}`,
-          data: statusData,
-        },
-        {
-          col: 'col2',
-          text: host.cluster,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col3',
-          text: host.fault_domain,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          key: 'progress',
-          col: 'col4',
-          text: `${host.consumed_cpu.toFixed(2)}%`,
-          data: host.consumed_cpu,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          key: 'progress',
-          col: 'col5',
-          text: `${host.consumed_mem.toFixed(2)}%`,
-          data: host.consumed_mem,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col6',
-          text: host.ha_state,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col7',
-          text: host.uptime + '',
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col8',
-          text: host.cert_valid_to,
-          testId: `migrate-host-table-item-${index}`,
-        },
-
-        {
-          col: 'col9',
-          text: `${$number.format(host.mem_size, 'en')} ${
-            localization.common.mb
-          }`,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col10',
-          text: host.cpus + '',
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col11',
-          text: host.nics + '',
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          col: 'col12',
-          text: host.version,
-          testId: `migrate-host-table-item-${index}`,
-        },
-        {
-          key: 'status',
-          col: 'col13',
-          text: host.alarm_action,
-          data: statusData,
-          testId: `migrate-host-table-item-${index}`,
-        },
-      ],
-    }
-  })
-}

package/components/common/configure/advancedSystemSettings/tableView/old/Old.vue

@@ -1,128 +0,0 @@
-<template>
-  <div class="data-table-view">
-    <atoms-table-data-grid
-      v-model:column-keys="columnKeys"
-      v-model:page-size="paginationLocal.pageSize"
-      v-model:page="paginationLocal.page"
-      :head-items="headItems"
-      :body-items="bodyItems"
-      :total-items="props.totalItems"
-      :total-pages="props.totalPages"
-      class="data-table"
-      test-id="any-table"
-      server-off
-      hide-page-size
-      hide-pagination
-    >
-      <template #value="{ item }">
-        <div v-if="item.data.type === 'int'">
-          <input
-            type="number"
-            :value="item.data.value"
-            @change="onChangeSetting($event, item.data.key)"
-          />
-        </div>
-        <div v-if="item.data.type === 'string'">
-          <input
-            type="text"
-            :value="item.data.value"
-            @change="onChangeSetting($event, item.data.key)"
-          />
-        </div>
-        <div v-if="item.data.type === 'boolean'">
-          <select
-            @change="onChangeSetting($event, item.data.key)"
-            :value="item.data.value"
-          >
-            <option value="false">false</option>
-            <option value="true">true</option>
-          </select>
-        </div>
-        <div v-if="item.data.type === 'select'">
-          <select
-            @change="onChangeSetting($event, item.data.key)"
-            :value="item.data.value"
-          >
-            <option
-              v-for="item2 in item.data.options"
-              :key="item2.key"
-              :value="item2.key"
-            >
-              {{ item2.value }}
-            </option>
-          </select>
-        </div>
-      </template>
-    </atoms-table-data-grid>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type {
-  UI_I_ColumnKey,
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/lib/models/interfaces'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_Pagination } from '~/lib/models/table/interfaces'
-import * as table from '~/components/common/configure/advancedSystemSettings/tableView/old/lib/config/table'
-
-const settings = defineModel<any>('settings', { required: true })
-
-const props = defineProps<{
-  dataTable: any[]
-  totalItems: number
-  totalPages: number
-  isEdit: boolean
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const onChangeSetting = (event: any, key: string): void => {
-  let value = event.target.value
-  settings.value.items = settings.value.items.map((item) => {
-    if (item.key === key) {
-      if (item.type === 'boolean') value = !!value
-      if (item.type === 'int') value = +value
-      item.value = value
-    }
-    return item
-  })
-}
-
-const paginationLocal = ref<UI_I_Pagination>({
-  page: 1,
-  pageSize: 100,
-})
-
-const headItems = computed<UI_I_HeadItem[]>(() =>
-  table.headItems(localization.value, props.isEdit)
-)
-
-const columnKeys = computed<UI_I_ColumnKey[]>(() =>
-  table.columnKeys(localization.value, props.isEdit)
-)
-
-const bodyItems = computed<UI_I_BodyItem[][]>(() => {
-  return table.bodyItems(props.dataTable, localization.value, props.isEdit)
-})
-</script>
-
-<style lang="scss" scoped>
-@import 'assets/scss/common/mixins.scss';
-.data-table-view {
-  @include flex($dir: column);
-  overflow: hidden;
-  height: inherit;
-  max-height: 250px;
-  .data-table {
-    @include flex($dir: column);
-    flex-direction: column;
-    overflow: hidden;
-    height: inherit;
-    :deep(.datagrid-outer-wrapper) {
-      height: inherit;
-    }
-  }
-}
-</style>