bfg-common 1.6.9 → 1.6.11

package/assets/localization/local_be.json

@@ -3492,7 +3492,8 @@
     "takeSnapshot": "Зрабіце здымак",
     "newSnapshot": "Новы здымак",
     "editSnapshot": "Рэдагаваць здымак",
-    "revertLatestSnapshot": "Вярнуцца да апошняга здымка"
+    "revertLatestSnapshot": "Вярнуцца да апошняга здымка",
+    "consolidateSnapshots": "Кансолідаваць здымкі"
   },
   "importVms": {
     "selectSourceTooltipDesc": "Правы карыстальніка esxi павінны адпавядаць ролях Administrator, крэдыт прымаюцца ад esxi і vSphere",

package/assets/localization/local_en.json

@@ -3496,7 +3496,8 @@
     "takeSnapshot": "Take Snapshot",
     "newSnapshot": "New Snapshot",
     "editSnapshot": "Edit snapshot",
-    "revertLatestSnapshot": "Revert to Latest Snapshot"
+    "revertLatestSnapshot": "Revert to Latest Snapshot",
+    "consolidateSnapshots": "Consolidate Snapshots"
   },
   "importVms": {
     "selectSourceTooltipDesc": "No Trusted infrastructure Administrator, credits are accepted from esxi and vSphere",

package/assets/localization/local_hy.json

@@ -3496,7 +3496,8 @@
     "takeSnapshot": "Ակնթարթ նկար",
     "newSnapshot": "Նոր սքրինշոթ",
     "editSnapshot": "Խմբագրել սքրինշոթը",
-    "revertLatestSnapshot": "Վերադառնալ վերջին նկարին"
+    "revertLatestSnapshot": "Վերադառնալ վերջին նկարին",
+    "consolidateSnapshots": "Միավորել լուսանկարները"
   },
   "importVms": {
     "selectSourceTooltipDesc": "Esxi օգտագործողի իրավունքները պետք է համապատասխանեն Administrator-ի դերերին, կրեդիտներն ընդունվում են esxi-ից և vSphere-ից",

package/assets/localization/local_kk.json

@@ -3495,7 +3495,8 @@
     "takeSnapshot": "сурет",
     "newSnapshot": "Жаңа снимок",
     "editSnapshot": "Снимокты өңдеу",
-    "revertLatestSnapshot": "Варнузза және түтіннің тұманы"
+    "revertLatestSnapshot": "Варнузза және түтіннің тұманы",
+    "consolidateSnapshots": "Суреттерді біріктіру"
   },
   "importVms": {
     "selectSourceTooltipDesc": "Esxi пайдаланушы құқықтары әкімші рөлдеріне сәйкес келуі керек, несиелер esxi және vSphere - ден алынады",

package/assets/localization/local_ru.json

@@ -3495,7 +3495,8 @@
     "takeSnapshot": "Сделать снимок",
     "newSnapshot": "Новый снимок",
     "editSnapshot": "Редактировать снимок",
-    "revertLatestSnapshot": "Вернуться к последнему снимку"
+    "revertLatestSnapshot": "Вернуться к последнему снимку",
+    "consolidateSnapshots": "Консолидация снимков"
   },
   "importVms": {
     "selectSourceTooltipDesc": "Права пользователя vmware дожны соответствовать ролям Administrator, креды принимаются от esxi и vSphere",
@@ -4087,7 +4088,7 @@
     "makeSureSelectHeartbeatDatastoreSeeDetails": "Убедитесь, что выбрали datastore для heartbeat, чтобы увидеть подробности."
   },
   "registerVm": {
-    "register": "Зарегистрироваться",
+    "register": "Зарегистрировать",
     "lastCreateSubtitle": "Проверьте данные перед регистрацией виртуальной машины.",
     "registerVmSelectFile": "Зарегистрировать ВМ — Выбор файла",
     "nameAlreadyExistsDescription": "Запись с таким именем уже существует."

package/assets/localization/local_zh.json

@@ -3493,7 +3493,8 @@
     "takeSnapshot": "快照",
     "newSnapshot": "新快照",
     "editSnapshot": "编辑快照",
-    "revertLatestSnapshot": "回到上一张照片"
+    "revertLatestSnapshot": "回到上一张照片",
+    "consolidateSnapshots": "合并快照"
   },
   "importVms": {
     "selectSourceTooltipDesc": "Esxi用户权限必须对应于管理员角色. esxi和vSphere接受积分",

package/components/common/vm/actions/consolidate/New.vue

@@ -1,6 +1,6 @@
 <template>
   <common-modals-confirmation
-    :headline="localization.common.consolidateConfirmation"
+    :headline="localization.snapshots.consolidateSnapshots"
     :description="localization.common.consolidateConfirmationDesc"
     :modal-texts="modalTexts"
     @hide-modal="emits('hide-modal')"

package/components/common/vm/actions/consolidate/Old.vue

@@ -1,7 +1,7 @@
 <template>
   <common-modals-confirmation
-    :headline="localization.common.consolidate"
-    :description="localization.common.consolidateConfirmationDescOld"
+    :headline="localization.snapshots.consolidateSnapshots"
+    :description="localization.common.consolidateConfirmationDesc"
     @hide-modal="emits('hide-modal')"
     @confirm="emits('confirm')"
   />

package/components/common/vm/actions/register/New.vue

@@ -21,12 +21,14 @@
         :sub-title-height="heightName"
       >
         <template #subTitle>
-          <div ref="subTitleBlockName" class="subtitle-block">
-            <div
-              id="name-alert-wrapper"
-              :class="[{ 'mb-4': !isNameAlertWrapperEmpty }]"
-            ></div>
-            <ui-wizard-subtitle :sub-title="currentSubtitleSelectNameBlock" />
+          <div ref="subTitleBlockName">
+            <div class="subtitle-block">
+              <div
+                id="name-alert-wrapper"
+                :class="[{ 'mb-4': !isNameAlertWrapperEmpty }]"
+              ></div>
+              <ui-wizard-subtitle :sub-title="currentSubtitleSelectNameBlock" />
+            </div>
           </div>
         </template>
         <template #content>
@@ -51,7 +53,7 @@
             "
             :test-ids="props.nameTestIds"
             :has-location="props.isSphere"
-            :location-nodes="props.locationNodes"
+            :location-nodes="localLocationNodes"
             :allowed-location-kinds="props.allowedLocationKinds"
             :location-description="props.locationDescription"
             @submit="emits('change-name', $event)"
@@ -68,21 +70,23 @@
         :sub-title-height="heightComputeResource"
       >
         <template #subTitle>
-          <div ref="computeResource" class="subtitle-block">
-            <ui-alert
-              v-if="props.computeResourceAlert.length"
-              :messages="props.computeResourceAlert"
-              test-id="computed-resource-alert"
-              type="error"
-              size="md"
-              class="subtitle-block__alert mb-4"
-            />
-            <ui-wizard-subtitle
-              :sub-title="
-                localization.vmWizard
-                  .selectDestinationComputeResourceForThisOperation
-              "
-            />
+          <div ref="computeResource">
+            <div class="subtitle-block">
+              <ui-alert
+                v-if="props.computeResourceAlert.length"
+                :messages="props.computeResourceAlert"
+                test-id="computed-resource-alert"
+                type="error"
+                size="md"
+                class="subtitle-block__alert mb-4"
+              />
+              <ui-wizard-subtitle
+                :sub-title="
+                  localization.vmWizard
+                    .selectDestinationComputeResourceForThisOperation
+                "
+              />
+            </div>
           </div>
         </template>
         <template #content>
@@ -115,10 +119,12 @@
           </div>
         </template>
         <template #content>
-          <common-ready-to-complete
-            v-if="selectedStep.id === props.dynamicSteps.readyComplete"
-            :data="props.readyCompleteTableInfo"
-          />
+          <div class="register-vm-ready-to-complete-container">
+            <common-ready-to-complete
+              v-if="selectedStep.id === props.dynamicSteps.readyComplete"
+              :data="props.readyCompleteTableInfo"
+            />
+          </div>
         </template>
       </ui-wizard-block>
     </template>
@@ -213,6 +219,15 @@ const currentSubtitleSelectNameBlock = ref<string>(
 
 const initialCompare = compare(vmForm)
 const hasChanges = computed<boolean>(() => initialCompare.getDiff(vmForm.value))
+
+const localLocationNodes = computed<UI_I_TreeNode[]>(() => {
+  const copyData = useDeepCopy(props.locationNodes)
+  if (copyData[0] && !copyData[0]?.nodes.length) {
+    copyData[0].hasNodes = true
+  }
+
+  return copyData
+})
 </script>
 
 <style>
@@ -234,10 +249,23 @@ const hasChanges = computed<boolean>(() => initialCompare.getDiff(vmForm.value))
   border-color: var(--select-name-border-color);
 }
 .compute-resource-container {
-  padding-bottom: 40px;
+  padding-bottom: 16px;
 
+  :deep(.tree-content) {
+    padding: 8px !important;
+  }
   :deep(.compatibility-wrap) {
     margin-top: 24px;
   }
 }
+.register-vm-ready-to-complete-container {
+  padding-bottom: 16px;
+
+  :deep(.details-list__col-right) {
+    align-items: flex-start;
+  }
+  :deep(.details-item-value) {
+    white-space: normal;
+  }
+}
 </style>

package/components/common/vm/actions/register/lib/config/steps.ts

@@ -72,7 +72,7 @@ export const stepsFunc = (
     {
       id: dynamicSteps.readyComplete,
       stepName: '',
-      title: localization.vmWizard.readyComplete,
+      title: localization.common.readyComplete,
       subTitle: localization.vmWizard.lastCreateSubtitle,
       status: UI_E_WIZARD_STATUS.INACTIVE,
       isValid: true,

package/components/common/vm/actions/rename/New.vue

@@ -11,12 +11,21 @@
     @hide="emits('hide')"
   >
     <template #content>
+      <ui-alert
+          v-if="props.errors.length"
+          :messages="props.errors.length && !isEmptyName ? props.errors : []"
+          test-id="vm-rename-error-alert"
+          type="error"
+          class="mb-2 mx-8"
+          size="md"
+          hide-close-button
+      />
       <div class="content">
         <form @submit.prevent="onRename">
           <ui-input
             id="name"
             v-model="nameLocal"
-            :error="props.errors[0]"
+            :error="props.isEmptyName ? localization.common.fieldRequired : ''"
             :label="localization.common.name"
             test-id="rename-vm-name-input"
             type="text"
@@ -37,6 +46,7 @@ const props = defineProps<{
   vmName: string
   isLoading: boolean
   errors: string[]
+  isEmptyName: boolean
 }>()
 const emits = defineEmits<{
   (event: 'hide'): void

package/components/common/vm/actions/rename/Rename.vue

@@ -4,6 +4,7 @@
     :vm-name="props.vmName"
     :is-loading="isLoading"
     :errors="errors"
+    :is-empty-name="isEmptyName"
     @hide="onHide"
     @change-name="onChangeName"
     @remove-validation-errors="onRemoveValidationErrors"
@@ -64,6 +65,7 @@ const onChangeName = async (name: string): Promise<void> => {
   onHide()
 }
 
+const isEmptyName = ref<boolean>(false)
 const errors = ref<string[]>([])
 const showValidationErrors = (data: string[]): void => {
   errors.value = data
@@ -74,6 +76,8 @@ const onRemoveValidationErrors = (): void => {
 
 const onCheckName = async (name: string): Promise<boolean> => {
   let result = true
+  isEmptyName.value = false
+  errors.value = []
 
   const url = props.nameRequestUrl.replace('{name}', encodeURIComponent(name))
   const { error } = await useMyFetch<null, API_UI_I_Error>(url, {
@@ -83,9 +87,11 @@ const onCheckName = async (name: string): Promise<boolean> => {
   const status = error.value?.statusCode || 200
   switch (status) {
     case 400: // Empty name
+    case 404: // 404 получаем в Сфере
       showValidationErrors([
         localization.value.common.emptyNameValidationDescription,
       ])
+      isEmptyName.value = true
       result = false
       break
     case 405: // Invalid kind

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

@@ -2,6 +2,7 @@ export type UI_T_SnapshotActionType =
   | 'take'
   | 'edit'
   | 'revert'
+  | 'revertLast'
   | 'delete'
   | 'delete_all'
   | 'group_take'

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

@@ -10,7 +10,7 @@
     @hide-modal="emits('hide')"
     @confirm="emits('submit')"
   >
-    <template v-if="props.type === 'revert'" #otherContent>
+    <template v-if="props.type === 'revert' || props.type === 'revertLast'" #otherContent>
       <div class="confirm-modal-checkbox-content mt-4 p-3">
         <ui-checkbox
           v-model="suspendOnRevert"
@@ -79,6 +79,7 @@ const descriptionText = computed<string>(() => {
       break
 
     case 'revert':
+    case 'revertLast':
       description =
         localization.value.snapshots.revertToSnapshotDescription.replace(
           '{0}',

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

@@ -8,7 +8,7 @@
     @submit="onConfirm"
   >
     <template #modalBody>
-      <div v-if="props.type === 'revert'">
+      <div v-if="props.type === 'revert' || props.type === 'revertLast'">
         <p class="description-text" data-id="description-revert-content">
           {{ descriptionRevertContent }}
         </p>

package/components/common/vm/snapshots/modals/confirm/lib/models/enums.ts

@@ -2,6 +2,7 @@ export enum UI_E_TitleConfirmModal {
   'take' = '',
   'edit' = 'edit',
   'revert' = 'revert',
+  'revertLast' = 'revert',
   'delete' = 'delete',
   'delete_all' = 'deleteAll',
   'group_delete_all' = 'deleteAll',
@@ -12,6 +13,7 @@ export enum UI_E_TitleModal {
   'take' = '',
   'edit' = '',
   'revert' = 'revertToSnapshot',
+  'revertLast' = 'revertLatestSnapshot',
   'delete' = 'deleteSnapshot',
   'delete_all' = 'deleteAllSnapshots',
   'group_delete_all' = 'deleteAllSnapshots',

package/components/common/vm/snapshots/modals/lib/config/modalTexts.ts

@@ -18,6 +18,7 @@ export const modalTexts = (
     groupTake: localization.common.create,
     edit: localization.common.save,
     revert: localization.common.revert,
+    revertLast: localization.common.revert,
     delete: localization.common.delete,
     delete_all: localization.common.deleteAll,
     group_delete_all: localization.common.deleteAll,

package/components/common/wizards/common/steps/name/New.vue

@@ -16,7 +16,7 @@
 
     <div class="name-field">
       <div class="flex-1 flex-align-center">
-        <ui-skeleton-item v-if="isLoading" width="112px" height="20px"/>
+        <ui-skeleton-item v-if="isLoading" width="112px" height="20px" />
         <label v-else :for="`${props.testIds.name}-name`" class="name-label">{{
           localization.common.name
         }}</label>
@@ -33,33 +33,42 @@
       </div>
 
       <div class="flex-2">
-        <ui-skeleton-item v-if="isLoading" width="480px" height="36px" border-radius="8px"/>
+        <ui-skeleton-item
+          v-if="isLoading"
+          width="480px"
+          height="36px"
+          border-radius="8px"
+        />
 
         <!--        ToDo при возможности придумать способ выделить тултип в компонент инпута-->
         <ui-tooltip
-            v-else
-            id="vm-name-tooltip"
-            test-id="vm-name-tooltip"
-            size="md"
-            width="240"
-            position="bottom"
-            show-type="variant-1"
-            timing="500"
+          v-else
+          id="vm-name-tooltip"
+          test-id="vm-name-tooltip"
+          size="md"
+          width="240"
+          position="bottom"
+          show-type="variant-1"
+          timing="500"
         >
           <template #target>
             <ui-input
-                v-model="name"
-                id="vm-name-tooltip"
-                :placeholder="`${localization.common.name} (${localization.common.optional})`"
-                type="text"
-                maxlength="54"
-                :error="props.nameErrorText"
-                :test-id="props.testIds.name"
-                :disabled="props.isDisabledField"
+              v-model="name"
+              id="vm-name-tooltip"
+              :placeholder="`${localization.common.name} (${localization.common.optional})`"
+              type="text"
+              maxlength="54"
+              :error="props.nameErrorText"
+              :test-id="props.testIds.name"
+              :disabled="props.isDisabledField"
             />
           </template>
-          <template v-if="props.errors.length" #content >
-            <p v-for="(error, index) in props.errors" :key="index" class="name-tooltip-text">
+          <template v-if="props.errors.length" #content>
+            <p
+              v-for="(error, index) in props.errors"
+              :key="index"
+              class="name-tooltip-text"
+            >
               {{ error }}
             </p>
           </template>
@@ -70,11 +79,19 @@
     <template v-if="props.hasLocation">
       <div class="location">
         <div class="flex-1">
-          <span v-if="location" class="location-label">{{ localization.common.location }}</span>
-          <ui-skeleton-item v-else width="144px" height="20px"/>
+          <span v-if="location" class="location-label">{{
+            localization.common.location
+          }}</span>
+          <ui-skeleton-item v-else width="144px" height="20px" />
         </div>
 
-        <div v-if="location" :class="['selected-location flex-2', { disabled: props.isDisabledField }]">
+        <div
+          v-if="location"
+          :class="[
+            'selected-location flex-2',
+            { disabled: props.isDisabledField },
+          ]"
+        >
           <span :class="['node-icon', location.iconClassName]" />
           <span :class="['text', isShowAlert && 'error']">
             {{ location.name }}
@@ -82,10 +99,10 @@
         </div>
         <ui-skeleton-item v-else width="160px" height="20px" />
       </div>
-      <div :class="['tree-view-wrap', { 'disabled': props.isDisabledField }]">
+      <div :class="['tree-view-wrap', { disabled: props.isDisabledField }]">
         <common-wizards-common-steps-name-location
-            v-model:location="location"
-            :nodes="props.locationNodes"
+          v-model:location="location"
+          :nodes="props.locationNodes"
         />
       </div>
     </template>
@@ -123,7 +140,7 @@ const isShowAlert = computed<boolean>(() =>
 const isLoading = ref(true)
 
 onMounted(() => {
-  setTimeout(() => isLoading.value = false, 0)
+  setTimeout(() => (isLoading.value = false), 0)
 })
 </script>
 
@@ -134,9 +151,10 @@ onMounted(() => {
   --select-name-help-icon-active-color: #008fd6;
   --select-name-help-hide-icon-color: #213444;
   --select-name-border-color: #e9ebeda3;
+  --select-wizard-step-name-top-border-color: #e9ebeda3;
   --select-name-location-node-color: #182531;
   --select-name-location-bg-color: #ffffff;
-  --select-name-tooltip-bg: #EA3223E0;
+  --select-name-tooltip-bg: #ea3223e0;
 }
 :root.dark-theme {
   --select-name-text-color: #e9eaec;
@@ -144,9 +162,10 @@ onMounted(() => {
   --select-name-help-icon-active-color: #2ba2de;
   --select-name-help-hide-icon-color: #e9eaec;
   --select-name-border-color: #e9ebed1f;
+  --select-wizard-step-name-top-border-color: #e9ebed1f;
   --select-name-location-node-color: #e9eaec;
   --select-name-location-bg-color: #1b2a371f;
-  --select-name-tooltip-bg: #EA3223B8;
+  --select-name-tooltip-bg: #ea3223b8;
 }
 </style>
 <style scoped lang="scss">
@@ -170,7 +189,7 @@ onMounted(() => {
 
     .name-tooltip-text {
       font-size: 12px;
-      color: #E9EAEC;
+      color: #e9eaec;
     }
 
     .name-label {
@@ -200,7 +219,7 @@ onMounted(() => {
     display: flex;
     margin-top: 16px;
     padding: 22px 0;
-    border-top: 1px solid var(--select-name-border-color);
+    border-top: 1px solid var(--select-wizard-step-name-top-border-color);
     column-gap: 16px;
     align-items: flex-start;
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bfg-common",
   "private": false,
-  "version": "1.6.9",
+  "version": "1.6.11",
   "scripts": {
     "build": "nuxt build",
     "dev": "nuxt dev --port=3002",