bfg-common 1.4.621 → 1.4.623

package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptions.vue

@@ -12,7 +12,7 @@
     :versions-options="versionsOptions"
     @change-os="onChangeOS"
     />
-  <common-vm-actions-common-customize-hardware-vmoptions-general-options-new
+  <common-vm-actions-common-customize-hardware-vmoptions-general-options-old
     v-else
     v-model:vm-name="vmName"
     v-model:guest-machine-type="guestMachineType"

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/Old.vue

@@ -9,7 +9,7 @@
         >
           <span>{{ localization.common.remoteConsoleOptions }}</span>
           <atoms-the-icon
-            v-show="remoteConsoleOptionsInvalid"
+            v-show="props.remoteConsoleOptionsInvalid"
             width="24px"
             height="24px"
             class="is-error tooltip-trigger"
@@ -23,17 +23,17 @@
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-type-->
         <!--          v-models:remote-console-type="remoteConsoleType"-->
         <!--          :error-validation-fields="props.errorValidationFields"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          @input="changeRemoteConsoleType"-->
         <!--          @remove-error-by-title="emits('remove-error-by-title', $event)"-->
         <!--        />-->
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-keymap
           v-model:keymap="keymap"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
         />
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-password
           v-model:password="password"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
           @valid="passwordIsValid = $event"
         />
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-power-control-->
@@ -49,39 +49,39 @@
         <!--          v-if="remoteConsoleType === 'spice'"-->
         <!--          v-models:img-compression="imgCompression"-->
         <!--          :error-validation-fields="props.errorValidationFields"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          @remove-error-by-title="emits('remove-error-by-title', $event)"-->
         <!--        />-->
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-jpeg-compression-->
         <!--          v-if="remoteConsoleType === 'spice'"-->
         <!--          v-models:jpeg-compression="jpegCompression"-->
         <!--          :error-validation-fields="props.errorValidationFields"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          @remove-error-by-title="emits('remove-error-by-title', $event)"-->
         <!--        />-->
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-zlib-compression-->
         <!--          v-if="remoteConsoleType === 'spice'"-->
         <!--          v-models:zlib-compression="zlibCompression"-->
         <!--          :error-validation-fields="props.errorValidationFields"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          @remove-error-by-title="emits('remove-error-by-title', $event)"-->
         <!--        />-->
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-playback-compression-->
         <!--          v-if="remoteConsoleType === 'spice'"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          v-models:playback-compression="playbackCompression"-->
         <!--        />-->
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-streaming-mode-->
         <!--          v-if="remoteConsoleType === 'spice'"-->
         <!--          v-models:streaming-mode="streamingMode"-->
         <!--          :error-validation-fields="props.errorValidationFields"-->
-        <!--          :disabled="isDisabled"-->
+        <!--          :disabled="props.isDisabled"-->
         <!--          @remove-error-by-title="emits('remove-error-by-title', $event)"-->
         <!--        />-->
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-copy-paste
           v-if="remoteConsoleType === 'spice'"
           v-model:copy-paste="copyPaste"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
         />
         <!--        TODO возможно вернем, НЕ УДАЛЯТЬ-->
         <!--        <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-mouse-mode-->
@@ -91,17 +91,17 @@
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-file-transfer
           v-if="remoteConsoleType === 'spice'"
           v-model:file-transfer="fileTransfer"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
         />
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-usb-redirection
           v-if="remoteConsoleType === 'spice'"
           v-model:usb-redirection="usbRedirection"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
         />
         <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-folder-sharing
           v-if="remoteConsoleType === 'spice'"
           v-model:folder-sharing="folderSharing"
-          :disabled="isDisabled"
+          :disabled="props.isDisabled"
         />
       </template>
     </atoms-stack-block>
@@ -109,146 +109,31 @@
 </template>
 
 <script setup lang="ts">
-import type { UI_I_SendDataRemoteConsoleOptions } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-// import type { UI_I_ErrorValidationField } from '~/lib/models/store/interfaces'
+
+const keymap = defineModel<string>('keymap', { required: true })
+const password = defineModel<string>('password', { required: true })
+const passwordIsValid = defineModel<boolean>('passwordIsValid', {
+  required: true,
+})
+const remoteConsoleType = defineModel<string>('remoteConsoleType', {
+  required: true,
+})
+const copyPaste = defineModel<boolean>('copyPaste', { required: true })
+const fileTransfer = defineModel<boolean>('fileTransfer', { required: true })
+const usbRedirection = defineModel<number>('usbRedirection', {
+  required: true,
+})
+const folderSharing = defineModel<boolean>('folderSharing', { required: true })
 
 const props = defineProps<{
-  remoteConsoleOptions?: UI_I_SendDataRemoteConsoleOptions
   // TODO возможно вернем, НЕ УДАЛЯТЬ
   // errorValidationFields: UI_I_ErrorValidationField<string>[]
-  isEdit: boolean
-  state?: string | number
-}>()
-const emits = defineEmits<{
-  (event: 'send-data', value: UI_I_SendDataRemoteConsoleOptions): void
-  (event: 'invalid', value: boolean): void
-  // TODO возможно вернем, НЕ УДАЛЯТЬ
-  // (event: 'remove-error-by-title', value: string): void
+  remoteConsoleOptionsInvalid: boolean
+  isDisabled: boolean
 }>()
 
 const localization = computed<UI_I_Localization>(() => useLocal())
-
-const isDisabled = computed<boolean>(() => props.isEdit && props.state !== 1)
-
-const remoteConsoleType = ref<string>('spice')
-// TODO возможно вернем, НЕ УДАЛЯТЬ
-// const changeRemoteConsoleType = (): void => {
-//   // powerControl.value = false
-//   // sharePolicy.value = 'allow-exclusive'
-//   imgCompression.value = 'auto_glz'
-//   jpegCompression.value = 'auto'
-//   zlibCompression.value = 'auto'
-//   playbackCompression.value = true
-//   streamingMode.value = 'all'
-//   copyPaste.value = true
-//   mouseMode.value = 'client'
-//   fileTransfer.value = true
-//   usbRedirection.value = 3
-//   folderSharing.value = true
-// }
-
-const keymap = ref<string>('en_US')
-
-const password = ref<string>('')
-const passwordIsValid = ref<boolean>(true)
-
-// const powerControl = ref<boolean>(false)
-
-// const sharePolicy = ref<string>('allow-exclusive')
-
-const imgCompression = ref<string>('auto_glz')
-
-const jpegCompression = ref<string>('auto')
-
-const zlibCompression = ref<string>('auto')
-
-const playbackCompression = ref<boolean>(true)
-
-const streamingMode = ref<string>('all')
-
-const copyPaste = ref<boolean>(true)
-
-const mouseMode = ref<string>('client')
-
-const fileTransfer = ref<boolean>(true)
-
-const usbRedirection = ref<number>(3)
-
-const folderSharing = ref<boolean>(true)
-
-watch(
-  [
-    remoteConsoleType,
-    keymap,
-    password,
-    // powerControl,
-    // sharePolicy,
-    imgCompression,
-    jpegCompression,
-    zlibCompression,
-    playbackCompression,
-    streamingMode,
-    copyPaste,
-    mouseMode,
-    fileTransfer,
-    usbRedirection,
-    folderSharing,
-  ],
-  () => {
-    emits('send-data', {
-      type: remoteConsoleType.value,
-      port: 0,
-      keymap: keymap.value,
-      password: password.value,
-      guest_os_lock: false,
-      limit_sessions: 0,
-      spice: {
-        img_compression: imgCompression.value,
-        jpeg_compression: jpegCompression.value,
-        zlib_glz_compression: zlibCompression.value,
-        streaming_mode: streamingMode.value,
-        playback_compression: playbackCompression.value,
-        file_transfer: fileTransfer.value,
-        clipboard: copyPaste.value,
-      },
-    })
-  },
-  { immediate: true }
-)
-
-// Добавляем данные для редактирования
-watch(
-  () => props.remoteConsoleOptions,
-  (newValue) => {
-    if (!newValue || !props.remoteConsoleOptions) return
-
-    remoteConsoleType.value = props.remoteConsoleOptions.type
-    keymap.value = props.remoteConsoleOptions.keymap
-    password.value = props.remoteConsoleOptions.password
-    imgCompression.value = props.remoteConsoleOptions.spice.img_compression
-    jpegCompression.value = props.remoteConsoleOptions.spice.jpeg_compression
-    zlibCompression.value =
-      props.remoteConsoleOptions.spice.zlib_glz_compression
-    streamingMode.value = props.remoteConsoleOptions.spice.streaming_mode
-    playbackCompression.value =
-      props.remoteConsoleOptions.spice.playback_compression
-    fileTransfer.value = props.remoteConsoleOptions.spice.file_transfer
-    copyPaste.value = props.remoteConsoleOptions.spice.clipboard
-  },
-  { immediate: true }
-)
-
-const remoteConsoleOptionsInvalid = computed<boolean>(
-  () => !passwordIsValid.value
-)
-watch(
-  remoteConsoleOptionsInvalid,
-  (newValue) => {
-    emits('invalid', newValue)
-  },
-  { immediate: true }
-)
 </script>
 
 <style scoped lang="scss"></style>

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/Password.vue

@@ -1,101 +1,103 @@
-<template>
-  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-password-new
-    v-if="isNewView"
-    v-model:is-enabled-password="isEnabledPassword"
-    v-model:form="form"
-    :disabled="props.disabled"
-    :error-text="passwordErrorText"
-    @set-password-disable="setPasswordDisable"
-    @change-password="changePassword"
-    @generate-password="onGeneratePassword"
-  />
-  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-password-old
-    v-else
-    v-model:is-enabled-password="isEnabledPassword"
-    v-model:form="form"
-    :disabled="props.disabled"
-    :error-text="passwordErrorText"
-    @set-password-disable="setPasswordDisable"
-    @change-password="changePassword"
-    @generate-password="onGeneratePassword"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_DefaultForm } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/models/interfaces'
-import type {
-  UI_I_Localization,
-  UI_I_HTMLSelectElement,
-} from '~/lib/models/interfaces'
-import { generatePassword } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/utils'
-
-const password = defineModel<string>('password', {required: true})
-
-const props = defineProps<{
-  disabled: boolean
-}>()
-const emits = defineEmits<{
-  (event: 'valid', value: boolean): void
-}>()
-
-const { $store, $validation }: any = useNuxtApp()
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const validation = $validation.call({})
-const defaultForm: UI_I_DefaultForm = {
-  password: {
-    value: password.value,
-    validations: [
-      { value: 'password', errorText: localization.value.common.changePasswordError },
-    ],
-  },
-}
-const form = ref<UI_I_DefaultForm>(useDeepCopy(defaultForm))
-const setForm = (): void => {
-  form.value = useDeepCopy(defaultForm)
-  validation.setForm(form)
-}
-setForm()
-
-const showValidationErrors = (): void => {
-  const valid = validation.touch()
-  passwordErrorText.value = !valid.isValid ? valid.errors.password[0] : ''
-  emits('valid', valid.isValid)
-}
-const removeValidationErrors = (): void => {
-  passwordErrorText.value = ''
-  emits('valid', true)
-}
-
-const setPasswordDisable = (): void => {
-  if (isEnabledPassword.value) {
-    return
-  }
-
-  removeValidationErrors()
-  setForm()
-  password.value = ''
-}
-
-const passwordErrorText = ref<string>('')
-
-const changePassword = (event: UI_I_HTMLSelectElement): void => {
-  showValidationErrors()
-
-  password.value = event.target.value
-}
-
-const isEnabledPassword = ref<boolean>(false)
-
-const onGeneratePassword = (): void => {
-  const generatedPassword = generatePassword()
-
-  form.value.password.value = generatedPassword
-  password.value = generatedPassword
-}
-</script>
-
-<style scoped>
-</style>
+<template>
+  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-password-new
+    v-if="isNewView"
+    v-model:is-enabled-password="isEnabledPassword"
+    v-model:form="form"
+    :disabled="props.disabled"
+    :error-text="passwordErrorText"
+    @set-password-disable="setPasswordDisable"
+    @change-password="changePassword"
+    @generate-password="onGeneratePassword"
+  />
+  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-password-old
+    v-else
+    v-model:is-enabled-password="isEnabledPassword"
+    v-model:form="form"
+    :disabled="props.disabled"
+    :error-text="passwordErrorText"
+    @set-password-disable="setPasswordDisable"
+    @change-password="changePassword"
+    @generate-password="onGeneratePassword"
+  />
+</template>
+
+<script setup lang="ts">
+import type { UI_I_DefaultForm } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/models/interfaces'
+import type {
+  UI_I_Localization,
+  UI_I_HTMLSelectElement,
+} from '~/lib/models/interfaces'
+import { generatePassword } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/utils'
+
+const password = defineModel<string>('password', { required: true })
+
+const props = defineProps<{
+  disabled: boolean
+}>()
+const emits = defineEmits<{
+  (event: 'valid', value: boolean): void
+}>()
+
+const { $store, $validation }: any = useNuxtApp()
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const validation = $validation.call({})
+const defaultForm: UI_I_DefaultForm = {
+  password: {
+    value: password.value,
+    validations: [
+      {
+        value: 'password',
+        errorText: localization.value.common.changePasswordError,
+      },
+    ],
+  },
+}
+const form = ref<UI_I_DefaultForm>(useDeepCopy(defaultForm))
+const setForm = (): void => {
+  form.value = useDeepCopy(defaultForm)
+  validation.setForm(form)
+}
+setForm()
+
+const showValidationErrors = (): void => {
+  const valid = validation.touch()
+  passwordErrorText.value = !valid.isValid ? valid.errors.password[0] : ''
+  emits('valid', valid.isValid)
+}
+const removeValidationErrors = (): void => {
+  passwordErrorText.value = ''
+  emits('valid', true)
+}
+
+const setPasswordDisable = (): void => {
+  if (isEnabledPassword.value) {
+    return
+  }
+
+  removeValidationErrors()
+  setForm()
+  password.value = ''
+}
+
+const passwordErrorText = ref<string>('')
+
+const changePassword = (value: string): void => {
+  showValidationErrors()
+
+  password.value = value
+}
+
+const isEnabledPassword = ref<boolean>(!!password.value)
+
+const onGeneratePassword = (): void => {
+  const generatedPassword = generatePassword()
+
+  form.value.password.value = generatedPassword
+  password.value = generatedPassword
+}
+</script>
+
+<style scoped></style>

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/PasswordNew.vue

@@ -23,7 +23,7 @@
           :class="[{ 'has-error': !!props.errorText }]"
           :disabled="!isEnabledPassword || props.disabled"
           :error-text="props.errorText"
-          @change="emits('change-password')"
+          @change="onChangePassword"
         >
           <template #icon>
             <div class="pointer" @click="onCopyToClipboard">
@@ -54,9 +54,7 @@
 
 <script setup lang="ts">
 import type { UI_I_DefaultForm } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/models/interfaces'
-import type {
-  UI_I_Localization,
-} from '~/lib/models/interfaces'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
 
 const isEnabledPassword = defineModel<boolean>('isEnabledPassword', {
   required: true,
@@ -69,12 +67,16 @@ const props = defineProps<{
 }>()
 const emits = defineEmits<{
   (event: 'set-password-disable'): void
-  (event: 'change-password'): void
+  (event: 'change-password', value: string): void
   (event: 'generate-password'): void
 }>()
 
 const localization = computed<UI_I_Localization>(() => useLocal())
 
+const onChangePassword = (): void => {
+  emits('change-password', form.value.password.value)
+}
+
 const onCopyToClipboard = (): void => {
   navigator.clipboard.writeText(form.value.password.value)
 }

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/PasswordOld.vue

@@ -1,92 +1,94 @@
-<template>
-  <div class="">
-    <atoms-stack-block :has-children="false">
-      <template #stackBlockKey>
-        {{ localization.auth.password }}
-      </template>
-      <template #stackBlockContent>
-        <div class="flex-align-center">
-          <input
-            id="enable-password"
-            v-model="isEnabledPassword"
-            data-id="enable-password-input"
-            :disabled="props.disabled"
-            type="checkbox"
-            @change="emits('set-password-disable')"
-          />
-          <label for="enable-password" class="label-text-normal mr-1">{{
-              localization.common.enable
-            }}</label>
-
-          <atoms-tooltip-error :has-error="!!props.errorText">
-            <template #elem>
-              <input
-                id="password-input"
-                v-model="form.password.value"
-                data-id="password-input"
-                type="text"
-                :class="[{ 'has-error': !!props.errorText }]"
-                :disabled="!isEnabledPassword || props.disabled"
-                @input="emits('change-password')"
-              />
-            </template>
-            <template #content>
-              {{ props.errorText }}
-            </template>
-          </atoms-tooltip-error>
-
-          <button
-            id="generate-password-button"
-            data-id="generate-password-button"
-            class="generate-password-btn btn btn-primary"
-            :disabled="!isEnabledPassword || props.disabled"
-            :title="localization.common.generatePassword"
-            @click="emits('generate-password')"
-          >
-            <atoms-the-icon name="lock" width="16px" height="16px" />
-          </button>
-        </div>
-      </template>
-    </atoms-stack-block>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type {
-  UI_I_Localization,
-} from '~/lib/models/interfaces'
-
-const isEnabledPassword = defineModel<boolean>('isEnabledPassword', {required: true})
-const form = defineModel<any>('form', {required: true})
-
-const props = defineProps<{
-  password: string
-  disabled: boolean
-  errorText: string
-}>()
-const emits = defineEmits<{
-  (event: 'update:password', value: string): void
-  (event: 'valid', value: boolean): void
-  (event: 'set-password-disable'): void
-  (event: 'change-password'): void
-  (event: 'generate-password'): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-
-<style scoped>
-#enable-password {
-  margin: 4px 4px 0 0;
-}
-.has-error {
-  border: 1px solid #db2100;
-}
-.generate-password-btn {
-  min-width: unset;
-  margin: 0;
-  padding: 3px;
-  height: unset;
-  display: flex;
-}
-</style>
+<template>
+  <div class="">
+    <atoms-stack-block :has-children="false">
+      <template #stackBlockKey>
+        {{ localization.auth.password }}
+      </template>
+      <template #stackBlockContent>
+        <div class="flex-align-center">
+          <input
+            id="enable-password"
+            v-model="isEnabledPassword"
+            data-id="enable-password-input"
+            :disabled="props.disabled"
+            type="checkbox"
+            @change="emits('set-password-disable')"
+          />
+          <label for="enable-password" class="label-text-normal mr-1">{{
+            localization.common.enable
+          }}</label>
+
+          <atoms-tooltip-error :has-error="!!props.errorText">
+            <template #elem>
+              <input
+                id="password-input"
+                v-model="form.password.value"
+                data-id="password-input"
+                type="text"
+                :class="[{ 'has-error': !!props.errorText }]"
+                :disabled="!isEnabledPassword || props.disabled"
+                @input="onChangePassword"
+              />
+            </template>
+            <template #content>
+              {{ props.errorText }}
+            </template>
+          </atoms-tooltip-error>
+
+          <button
+            id="generate-password-button"
+            data-id="generate-password-button"
+            class="generate-password-btn btn btn-primary"
+            :disabled="!isEnabledPassword || props.disabled"
+            :title="localization.common.generatePassword"
+            @click="emits('generate-password')"
+          >
+            <atoms-the-icon name="lock" width="16px" height="16px" />
+          </button>
+        </div>
+      </template>
+    </atoms-stack-block>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_DefaultForm } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/lib/models/interfaces'
+
+const isEnabledPassword = defineModel<boolean>('isEnabledPassword', {
+  required: true,
+})
+const form = defineModel<UI_I_DefaultForm>('form', { required: true })
+
+const props = defineProps<{
+  disabled: boolean
+  errorText: string
+}>()
+const emits = defineEmits<{
+  (event: 'set-password-disable'): void
+  (event: 'change-password', value: string): void
+  (event: 'generate-password'): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const onChangePassword = (): void => {
+  emits('change-password', form.value.password.value)
+}
+</script>
+
+<style scoped>
+#enable-password {
+  margin: 4px 4px 0 0;
+}
+.has-error {
+  border: 1px solid #db2100;
+}
+.generate-password-btn {
+  min-width: unset;
+  margin: 0;
+  padding: 3px;
+  height: unset;
+  display: flex;
+}
+</style>

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirection.vue

@@ -1,28 +1,28 @@
-<template>
-  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-usb-redirection-new
-    v-if="isNewView"
-    v-model:usb-redirection="usbRedirection"
-    :usb-redirection-options="usbRedirectionOptions"
-  />
-  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-usb-redirection-old
-    v-else
-    v-model:usb-redirection="usbRedirection"
-    :usb-redirection-options="usbRedirectionOptions"
-  />
-</template>
-
-<script setup lang="ts">
-import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
-import { usbRedirectionOptionsConfig } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/lib/config/config'
-
-const usbRedirection = defineModel<number>('usbRedirection', {required: true})
-
-const { $store }: any = useNuxtApp()
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const usbRedirectionOptions = ref<UI_I_OptionItem[]>(
-  usbRedirectionOptionsConfig
-)
-</script>
-
-<style scoped></style>
+<template>
+  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-usb-redirection-new
+    v-if="isNewView"
+    v-model:usb-redirection="usbRedirection"
+    :usb-redirection-options="usbRedirectionOptions"
+  />
+  <common-vm-actions-common-customize-hardware-vmoptions-remote-console-options-usb-redirection-old
+    v-else
+    v-model:usb-redirection="usbRedirection"
+    :usb-redirection-options="usbRedirectionOptions"
+  />
+</template>
+
+<script setup lang="ts">
+import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
+import { usbRedirectionOptionsConfig } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/lib/config/config'
+
+const usbRedirection = defineModel<number>('usbRedirection', { required: true })
+
+const { $store }: any = useNuxtApp()
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
+const usbRedirectionOptions = ref<UI_I_OptionItem[]>(
+  usbRedirectionOptionsConfig
+)
+</script>
+
+<style scoped></style>

package/package.json

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