bfg-common 1.5.442 → 1.5.443

package/components/common/wizards/datastore/add/steps/nameAndConfigure/NameAndConfigureNew.vue

@@ -93,8 +93,8 @@
 </template>
 
 <script setup lang="ts">
+import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/wizards/datastore/add/lib/models/interfaces'
 import type { UI_I_InitialValidationFields } from '~/components/common/wizards/vm/migrate/select/targetServer/new/lib/models/interfaces'
 

package/components/common/wizards/datastore/add/steps/nameAndConfigure/NameAndConfigureOld.vue

@@ -108,8 +108,8 @@
 </template>
 
 <script lang="ts" setup>
+import type { UI_I_WizardStep } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_InitialValidationFields } from '~/components/common/wizards/datastore/add/steps/nameAndConfigure/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/wizards/datastore/add/lib/models/interfaces'
 import { dynamicSteps } from '~/components/common/wizards/datastore/add/lib/config/steps'

package/components/common/wizards/datastore/add/steps/nameAndDevice/NameAndDevice.vue

@@ -36,6 +36,7 @@
 </template>
 
 <script lang="ts" setup>
+import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
 import type { UI_I_ArbitraryObject } from '~/lib/models/interfaces'
 import type {
@@ -46,7 +47,6 @@ import type {
   UI_I_LunDiskSpherePayload,
   UI_I_SelectHostOptions,
 } from '~/components/common/wizards/datastore/add/steps/nameAndDevice/lib/models/interfaces'
-import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
 import type { UI_I_CompatibleHosts } from '~/components/common/wizards/datastore/add/steps/hostAccessibility/table/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/wizards/datastore/add/lib/models/interfaces'

package/components/common/wizards/datastore/add/steps/nameAndDevice/NameAndDeviceNew.vue

@@ -80,13 +80,13 @@
 </template>
 
 <script lang="ts" setup>
+import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type {
   UI_I_Localization,
   UI_I_ArbitraryObject,
 } from '~/lib/models/interfaces'
 import type { UI_I_Pagination } from '~/lib/models/table/interfaces'
 import type { UI_I_SelectHostOptions } from '~/components/common/wizards/datastore/add/steps/nameAndDevice/lib/models/interfaces'
-import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/wizards/datastore/add/lib/models/interfaces'
 import type { UI_I_CreateStorageLunDisks } from '~/components/common/wizards/datastore/add/steps/nameAndDevice/table/lib/models/interfaces'
 

package/components/common/wizards/datastore/add/steps/nameAndDevice/NameAndDeviceOld.vue

@@ -94,13 +94,13 @@
 </template>
 
 <script lang="ts" setup>
+import type { UI_I_ErrorFields } from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
 import type {
   UI_I_Localization,
   UI_I_ArbitraryObject,
 } from '~/lib/models/interfaces'
 import type { UI_I_Pagination } from '~/lib/models/table/interfaces'
 import type { UI_I_SelectHostOptions } from '~/components/common/wizards/datastore/add/steps/nameAndDevice/lib/models/interfaces'
-import type { UI_I_ErrorFields } from '~/components/atoms/wizard/lib/models/interfaces'
 import type { UI_I_CreateDatastoreForm } from '~/components/common/wizards/datastore/add/lib/models/interfaces'
 import type { UI_I_CreateStorageLunDisks } from '~/components/common/wizards/datastore/add/steps/nameAndDevice/table/lib/models/interfaces'
 import { validateNameAndGenerateDataId } from '~/components/common/wizards/datastore/add/lib/utils'

package/components/common/wizards/network/add/Add.vue

@@ -1,109 +1,109 @@
 <template>
-  <atoms-wizard
-    v-model:show="props.show"
+  <common-wizards-network-add-new
+    v-if="isNewView"
+    v-model:connection-type="connectionTypeLocal"
+    :show="props.show"
+    :wizard="wizard"
+    :selected-scheme="selectedScheme"
+    :host-name="hostNameLocal"
+    :project="props.project"
+    :target-device="targetDevice"
+    :standard-switches-initial="props.standardSwitchesInitial"
+    :alert-messages="alertMessages"
+    :selected-standard-switch-id="props.selectedStandardSwitchId"
+    :selected-switch-id="props.selectedSwitchId"
+    :free-adapters="props.freeAdapters"
+    :added-adapters="addedAdapters"
+    :core-adapters="coreAdapters"
+    :adapter-status="adapterStatus"
+    :adapters="props.adapters"
+    :is-show-no-connected-active-adapters-modal="
+      isShowNoConnectedActiveAdaptersModal
+    "
+    :is-show-no-active-adapters-modal="isShowNoActiveAdaptersModal"
+    :is-dark-mode="props.isDarkMode"
+    :port-properties="portProperties"
+    :mtu-from-switch="mtuFromSwitch"
+    :tcp-stacks="props.tcpStacks"
+    :ip-four-settings="ipFourSettings"
+    :gateway-flag="gatewayFlag"
+    :connection-settings="connectionSettings"
+    :ready-complete-fields="readyCompleteFields"
+    @change-connection-settings="onChangeConnectionSettings"
+    @change-gateway-flag="onChangeGatewayFlag"
+    @change-ip-four-settings="onChangeIpFourSettings"
+    @change-port-properties="onChangePortProperties"
+    @get-free-adapters="onGetFreeAdapters"
+    @change-added-adapters="onChangeAddedAdapters"
+    @change-adapter-status="onChangeAdapterStatus"
+    @confirm-no-active-adapters-modal="onConfirmNoActiveAdaptersModal"
+    @hide-no-connected-active-adapters-modal="
+      onHideNoConnectedActiveAdaptersModal
+    "
+    @hide-no-active-adapters-modal="onHideNoActiveAdaptersModal"
+    @hide-alert="onHideAlert"
+    @change-target-device="onChangeTargetDevice"
+    @change-steps="onChangeSteps"
+    @hide="onHideAddNetworkingModal"
+    @submit="onSubmit"
+  />
+  <common-wizards-network-add-old
+    v-else
+    v-model:connection-type="connectionTypeLocal"
+    :show="props.show"
     :wizard="wizard"
     :selected-scheme="selectedScheme"
     :title="title"
-    :localization="localization"
-    :class="[
-      'add-networking-wizard',
-      {
-        'is-dark': props.isDarkMode,
-      },
-    ]"
-    max-height="551px"
-    test-id="add-networking-wizard"
+    :project="props.project"
+    :target-device="targetDevice"
+    :standard-switches-initial="props.standardSwitchesInitial"
+    :alert-messages="alertMessages"
+    :selected-standard-switch-id="props.selectedStandardSwitchId"
+    :selected-switch-id="props.selectedSwitchId"
+    :free-adapters="props.freeAdapters"
+    :added-adapters="addedAdapters"
+    :core-adapters="coreAdapters"
+    :adapter-status="adapterStatus"
+    :adapters="props.adapters"
+    :is-show-no-connected-active-adapters-modal="
+      isShowNoConnectedActiveAdaptersModal
+    "
+    :is-show-no-active-adapters-modal="isShowNoActiveAdaptersModal"
+    :is-dark-mode="props.isDarkMode"
+    :port-properties="portProperties"
+    :mtu-from-switch="mtuFromSwitch"
+    :tcp-stacks="props.tcpStacks"
+    :ip-four-settings="ipFourSettings"
+    :gateway-flag="gatewayFlag"
+    :connection-settings="connectionSettings"
+    :ready-complete-fields="readyCompleteFields"
+    @change-connection-settings="onChangeConnectionSettings"
+    @change-gateway-flag="onChangeGatewayFlag"
+    @change-ip-four-settings="onChangeIpFourSettings"
+    @change-port-properties="onChangePortProperties"
+    @get-free-adapters="onGetFreeAdapters"
+    @change-added-adapters="onChangeAddedAdapters"
+    @change-adapter-status="onChangeAdapterStatus"
+    @confirm-no-active-adapters-modal="onConfirmNoActiveAdaptersModal"
+    @hide-no-connected-active-adapters-modal="
+      onHideNoConnectedActiveAdaptersModal
+    "
+    @hide-no-active-adapters-modal="onHideNoActiveAdaptersModal"
+    @hide-alert="onHideAlert"
+    @change-target-device="onChangeTargetDevice"
     @change-steps="onChangeSteps"
     @hide="onHideAddNetworkingModal"
     @submit="onSubmit"
-  >
-    <template #modalBody="{ selectedStep }">
-      <common-wizards-network-add-steps-select-connection-type
-        v-if="selectedStep.id === 0"
-        v-model="connectionTypeLocal"
-        :project="props.project"
-      />
-      <common-wizards-network-add-steps-selected-target-device
-        v-if="selectedStep.id === 1"
-        :wizard="wizard"
-        :target-device="targetDevice"
-        :connection-type="connectionTypeLocal"
-        :standard-switches-initial="props.standardSwitchesInitial"
-        :messages-fields="selectedStep.fields"
-        :alert-messages="alertMessages[1]"
-        :selected-standard-switch-id="props.selectedStandardSwitchId"
-        :selected-switch-id="props.selectedSwitchId"
-        @hide-alert="onHideAlert"
-        @change-target-device="onChangeTargetDevice"
-      />
-      <common-wizards-network-add-steps-create-standard-switch
-        v-if="selectedStep.id === 2 || selectedStep.id === 6"
-        :free-adapters="props.freeAdapters"
-        :added-adapters="addedAdapters"
-        :core-adapters="coreAdapters"
-        :adapter-status="adapterStatus"
-        :adapters="props.adapters"
-        :is-show-no-connected-active-adapters-modal="
-          isShowNoConnectedActiveAdaptersModal
-        "
-        :is-show-no-active-adapters-modal="isShowNoActiveAdaptersModal"
-        :is-dark-mode="props.isDarkMode"
-        @get-free-adapters="onGetFreeAdapters"
-        @change-added-adapters="onChangeAddedAdapters"
-        @change-adapter-status="onChangeAdapterStatus"
-        @confirm-no-active-adapters-modal="onConfirmNoActiveAdaptersModal"
-        @hide-no-connected-active-adapters-modal="
-          onHideNoConnectedActiveAdaptersModal
-        "
-        @hide-no-active-adapters-modal="onHideNoActiveAdaptersModal"
-      />
-      <common-wizards-network-add-steps-port-properties
-        v-if="selectedStep.id === 3"
-        :wizard="wizard"
-        :port-properties="portProperties"
-        :mtu-from-switch="mtuFromSwitch"
-        :project="props.project"
-        :messages-fields="selectedStep.fields"
-        :alert-messages="alertMessages[3]"
-        :tcp-stacks="props.tcpStacks"
-        @change-gateway-flag="onChangeGatewayFlag"
-        @change-port-properties="onChangePortProperties"
-        @hide-alert="onHideAlert"
-      />
-      <common-wizards-network-add-steps-ip-four-settings
-        v-if="selectedStep.id === 4"
-        :wizard="wizard"
-        :ip-four-settings="ipFourSettings"
-        :messages-fields="selectedStep.fields"
-        :alert-messages="alertMessages[4]"
-        :tcp-stacks="props.tcpStacks"
-        :tcp="portProperties.tcp"
-        :gateway-flag="gatewayFlag"
-        @change-gateway-flag="onChangeGatewayFlag"
-        @change-ip-four-settings="onChangeIpFourSettings"
-        @hide-alert="onHideAlert"
-      />
-      <common-wizards-network-add-steps-connection-settings
-        v-if="selectedStep.id === 5"
-        :wizard="wizard"
-        :connection-settings="connectionSettings"
-        :messages-fields="selectedStep.fields"
-        :alert-messages="alertMessages[5]"
-        @change-connection-settings="onChangeConnectionSettings"
-        @hide-alert="onHideAlert"
-      />
-      <!--      <common-wizards-network-add-steps-physical-adapter-->
-      <!--        v-if="selectedStep.id === 6"-->
-      <!--      />-->
-      <common-wizards-network-add-steps-ready-complete
-        v-if="selectedStep.id === 7"
-        :ready-complete-fields="readyCompleteFields"
-      />
-    </template>
-  </atoms-wizard>
+  />
 </template>
 
 <script setup lang="ts">
+import type {
+  UI_I_ValidationReturn,
+  UI_I_WizardStep,
+  UI_I_WizardStepNavigation,
+} from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
+import Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
 import type {
   UI_I_ArbitraryObject,
   UI_I_Localization,
@@ -131,15 +131,9 @@ import type {
   API_UI_I_SwitchItem,
   UI_I_AvailableAdapters,
 } from '~/components/common/diagramMain/lib/models/interfaces'
-import type {
-  UI_I_ValidationReturn,
-  UI_I_WizardStep,
-  UI_I_WizardStepNavigation,
-} from '~/components/atoms/wizard/lib/models/interfaces'
+import { getAvailableAdapters } from '~/components/common/diagramMain/lib/utils/utils'
 import { UI_E_ValidationFields } from '~/components/common/wizards/network/add/lib/models/enums'
-import Wizard from '~/components/atoms/wizard/lib/utils/utils'
 import { getVlanId } from '~/components/common/wizards/network/add/lib/utils/utils'
-import { getAvailableAdapters } from '~/components/common/diagramMain/lib/utils/utils'
 import {
   createZeroSchemeReadyCompleteFunc,
   createFirstSchemeReadyCompleteFunc,
@@ -226,11 +220,19 @@ const emits = defineEmits<{
   (event: 'get-tcp-stacks'): void
 }>()
 
+const { $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
 const localization = computed<UI_I_Localization>(() => useLocal())
 
 const localHostName = ref<string>('')
+const hostNameLocal = computed<string>(
+  () => props.hostName || localHostName.value
+)
+
 const title = computed<string>(
-  () => `${props.hostName || localHostName.value} - ${localization.value.common.addNetworking}`
+  () => `${hostNameLocal.value} - ${localization.value.common.addNetworking}`
 )
 
 const wizard: Wizard = new Wizard(
@@ -647,7 +649,8 @@ const validationFunc = async (
       localization.value,
       targetDevice.value,
       wizard,
-      value
+      value,
+      isNewView.value
     )
 
     value = targetDeviceValidation.newValue
@@ -858,231 +861,4 @@ watch(
 )
 </script>
 
-<style scoped lang="scss">
-:deep(.modal) {
-  & > .modal-dialog > .modal-content > .modal-body {
-    height: calc(100% - 110px);
-    .disabled-on-time {
-      opacity: 0.4;
-      pointer-events: none;
-    }
-  }
-}
-:deep(.disabled-on-time) {
-  opacity: 0.4;
-  pointer-events: none;
-}
-:deep(.wizard-content-container.add-networking-step) {
-  padding: 0px 15px 10px 10px;
-
-  .danger-not-valid {
-    border: 2px solid red;
-    border-bottom: 1px solid #db2100;
-  }
-  .tooltip-field {
-    margin-right: 12px;
-  }
-
-  .horizontal-flex-container {
-    margin-bottom: 5px;
-    min-height: 36px;
-    display: flex;
-    flex-direction: row;
-  }
-  .property-label-group {
-    width: 140px;
-  }
-  .disabled {
-    opacity: 0.4;
-    pointer-events: none;
-  }
-  .wizard-content-port {
-    .margin-left-property-value-group {
-      margin-left: 10px;
-    }
-
-    .property-value-group {
-      padding-left: 23px;
-    }
-    .horizontal-flex-container {
-      min-height: 24px;
-      margin-bottom: 0;
-    }
-    .radio {
-      min-height: 39px;
-      margin: 10px 0;
-    }
-    .form-block {
-      margin: 12px 0 24px 0;
-      padding-left: 23px;
-
-      &.form-block-ipv {
-        input[type='text'] {
-          width: 143px;
-        }
-        .horizontal-flex-container > label {
-          margin-right: 50px;
-        }
-      }
-    }
-    .edit-vmkernel-adapter-section {
-      padding-top: 12px;
-
-      label {
-        input[type='checkbox'] {
-          margin-right: 4px;
-          transform: translateY(1px);
-        }
-      }
-      .horizontal-flex-container {
-        margin-bottom: 5px;
-      }
-    }
-    .port-properties-network-label {
-      width: 280px;
-    }
-    .port-properties-padding {
-      padding-top: 8px;
-    }
-    .port-properties-mtu-selector {
-      margin-right: 12px;
-    }
-    .port-properties-mtu-container {
-      display: flex;
-    }
-    select {
-      height: 24px;
-    }
-  }
-  .nw-property-value-group {
-    display: inline;
-  }
-}
-
-:deep(.modal-body-content.modal-body-content__confirmation) {
-  display: flex;
-  .confirm-icon-container {
-    margin-right: 20px;
-  }
-  .preserve-newlines {
-    white-space: pre-line;
-    font-size: 15px;
-  }
-}
-
-.add-networking-wizard.is-dark {
-  :deep(.wizard-content-container.add-networking-step) {
-    .ready-complete-container {
-      background-color: var(--pannel-bg-color);
-      margin-top: 12px;
-
-      span {
-        color: var(--description-color);
-      }
-    }
-
-    .add-networking-radio-button-description {
-      color: var(--description-color);
-    }
-
-    .property-label-group {
-      color: var(--main-color-mode2);
-    }
-    .flex-property-label-group {
-      color: var(--main-color-mode2);
-    }
-    .flex-property-value-group {
-      select {
-        color: #fff;
-      }
-    }
-    .failover-order-master {
-      .secondary-title label {
-        color: #fff;
-      }
-    }
-    .k-grid-content {
-      background-color: var(--modal-bg-color);
-    }
-    .vui-action-bar {
-      background-color: var(--pannel-bg-color);
-      color: var(--title-color);
-      padding: 8px 0 3px;
-
-      .action-link-container:not(.disabled) {
-        &:hover {
-          background-color: #29414e;
-          border: 1px solid #c7e9ff;
-        }
-      }
-
-      svg {
-        fill: #fff;
-      }
-    }
-
-    .k-grid.k-widget .k-grid-content {
-      border-left: 1px solid #485764;
-      border-right: 1px solid #485764;
-      border-top: 1px solid #ddd;
-      border-bottom: 1px solid #ddd;
-
-      tbody tr {
-        background-color: var(--modal-bg-color);
-
-        td {
-          border-bottom: 1px solid #666666;
-          border-color: #666666;
-        }
-
-        &:hover {
-          background-color: #324f61;
-          color: var(--title-color);
-
-          td {
-            border-bottom: 1px solid #ffffff;
-          }
-        }
-
-        &.k-state-selected {
-          background-color: #d8e3e9;
-          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
-
-          td span {
-            color: #000;
-          }
-        }
-      }
-    }
-
-    .failover-order-details {
-      &.relative-container .absolute-container {
-        background-color: var(--pannel-bg-color);
-        color: var(--main-color-mode2);
-
-        &:has(.no-items-selected-container) {
-          background-color: transparent;
-        }
-      }
-
-      td span {
-        color: var(--main-color-mode2);
-      }
-      button span {
-        color: var(--main-color-mode2);
-
-        &:hover:not(.disabled) {
-          background-color: transparent;
-        }
-      }
-      button.active span {
-        color: #fff;
-      }
-    }
-  }
-
-  .select-adapter-info span {
-    color: var(--main-color-mode2);
-  }
-}
-</style>
+<style scoped lang="scss"></style>