bfg-common 1.5.252 → 1.5.253

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/assets/img/icons/icons-sprite-dark-3.svg +227 -227
  2. package/assets/img/icons/icons-sprite-dark-5.svg +488 -488
  3. package/assets/img/icons/icons-sprite-light-3.svg +227 -227
  4. package/assets/img/icons/icons-sprite-light-5.svg +488 -488
  5. package/assets/localization/local_be.json +11 -1
  6. package/assets/localization/local_en.json +11 -1
  7. package/assets/localization/local_hy.json +11 -1
  8. package/assets/localization/local_kk.json +11 -1
  9. package/assets/localization/local_ru.json +11 -1
  10. package/assets/localization/local_zh.json +12 -2
  11. package/assets/scss/common/theme.scss +379 -355
  12. package/components/atoms/stack/StackBlock.vue +185 -185
  13. package/components/atoms/table/info/lib/models/interfaces.ts +10 -10
  14. package/components/common/browse/blocks/lib/models/types.ts +1 -1
  15. package/components/common/browse/lib/models/interfaces.ts +5 -5
  16. package/components/common/diagramMain/adapter/AdapterItems.vue +61 -61
  17. package/components/common/diagramMain/lib/config/initial.ts +50 -50
  18. package/components/common/diagramMain/lib/models/types.ts +21 -21
  19. package/components/common/diagramMain/lib/utils/utils.ts +331 -331
  20. package/components/common/diagramMain/modals/editSettings/ConfirmTeamingSettingsModal.vue +40 -40
  21. package/components/common/diagramMain/modals/editSettings/tabs/NetworkProperties.vue +214 -214
  22. package/components/common/diagramMain/modals/editSettings/tabs/Security.vue +189 -189
  23. package/components/common/diagramMain/modals/editSettings/tabs/SwitchProperties.vue +163 -163
  24. package/components/common/diagramMain/modals/editSettings/tabs/TeamingFailover.vue +175 -175
  25. package/components/common/diagramMain/modals/editSettings/tabs/port/IpvFourSettings.vue +346 -346
  26. package/components/common/diagramMain/modals/lib/config/initial.ts +180 -180
  27. package/components/common/diagramMain/modals/lib/config/vmKernelAdapter.ts +90 -90
  28. package/components/common/diagramMain/modals/lib/mappers/mappers.ts +87 -87
  29. package/components/common/diagramMain/modals/lib/utils/index.ts +24 -24
  30. package/components/common/diagramMain/modals/migrateVmkernelAdapter/lib/config/steps.ts +114 -114
  31. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/ConnectionSettings.vue +169 -169
  32. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/SelectVmkernelAdapter.vue +159 -159
  33. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/common.ts +14 -14
  34. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/connectionSettings.ts +137 -137
  35. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/selectVmkernelAdapter.ts +52 -52
  36. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/validations.ts +19 -19
  37. package/components/common/diagramMain/port/Ports.vue +47 -47
  38. package/lib/models/interfaces.ts +1 -0
  39. package/package.json +1 -1
@@ -1,185 +1,185 @@
1
- <template>
2
- <div
3
- :class="[
4
- 'stack-block',
5
- open ? 'stack-block-expanded' : 'stack-block-expandable',
6
- { 'not-children': !props.hasChildren },
7
- ]"
8
- >
9
- <div
10
- :id="`${props.testId}-toggle`"
11
- :data-id="`${props.testId}-toggle`"
12
- class="stack-block-label"
13
- @click="onToggle"
14
- >
15
- <atoms-the-icon name="angle" class="angle-icon" fill="#565656" />
16
-
17
- <div class="stack-view-key">
18
- <slot name="stackBlockKey" />
19
- </div>
20
- <div class="stack-block-content">
21
- <slot name="stackBlockContent" />
22
- </div>
23
-
24
- <span
25
- v-if="props.removable && props.isRollBack"
26
- :data-id="`${props.testId}-roll-back`"
27
- class="icon-roll-back"
28
- @mousedown="onRollBack"
29
- @click.stop
30
- />
31
- <atoms-the-icon
32
- v-else-if="props.removable"
33
- :data-id="`${props.testId}-remove`"
34
- class="remove-icon"
35
- name="close-circle"
36
- @mousedown="onRemove"
37
- @click.stop
38
- />
39
- <span v-else class="empty-icon"></span>
40
- </div>
41
-
42
- <div v-show="open" class="stack-children">
43
- <div style="height: auto">
44
- <slot name="stackChildren" />
45
- </div>
46
- </div>
47
- </div>
48
- </template>
49
-
50
- <script setup lang="ts">
51
- const props = withDefaults(
52
- defineProps<{
53
- hasChildren: boolean
54
- removable?: boolean
55
- testId?: string
56
- openByDefault?: boolean
57
- isRollBack?: boolean
58
- }>(),
59
- { testId: 'ui-stack-block', openByDefault: false }
60
- )
61
- const emits = defineEmits<{
62
- (event: 'toggle', value: boolean): void
63
- (event: 'remove'): void
64
- (event: 'roll-back'): void
65
- }>()
66
-
67
- const open = ref<boolean>(props.openByDefault || false)
68
- const onToggle = (): void => {
69
- if (!props.hasChildren) return
70
- setTimeout(() => {
71
- open.value = !open.value
72
- emits('toggle', open.value)
73
- }, 0)
74
- }
75
-
76
- const onRemove = (): void => {
77
- emits('remove')
78
- }
79
- const onRollBack = (): void => {
80
- emits('roll-back')
81
- }
82
- </script>
83
-
84
- <style scoped lang="scss">
85
- .stack-block {
86
- cursor: pointer;
87
- background-color: var(--block-view-bg-color);
88
- border-color: var(--global-border-color);
89
-
90
- &.stack-block-expandable:hover {
91
- border-bottom: 1px solid #666;
92
-
93
- .stack-block-label {
94
- background-color: var(--block-view-bg-color);
95
- border-color: var(--global-border-color);
96
- }
97
- }
98
-
99
- .stack-block-label {
100
- padding: 6px 12px;
101
- flex: 1 1 auto;
102
- max-width: unset;
103
- display: flex;
104
- background-color: var(--block-view-bg-color);
105
- border-color: var(--global-border-color);
106
-
107
- &:hover {
108
- .remove-icon {
109
- opacity: 1;
110
- }
111
- }
112
-
113
- &::before {
114
- display: none;
115
- }
116
-
117
- .angle-icon {
118
- width: 14px;
119
- height: 14px;
120
- margin-right: 4px;
121
- transform: rotate(90deg);
122
- align-self: center;
123
- }
124
-
125
- .remove-icon {
126
- width: 18px;
127
- height: 18px;
128
- opacity: 0;
129
- cursor: pointer;
130
- }
131
-
132
- .stack-view-key {
133
- flex: 0 0 40%;
134
- max-width: 40%;
135
- }
136
-
137
- .stack-block-content {
138
- padding: 0;
139
- flex: 1 1 auto;
140
- width: 60%;
141
- background-color: transparent;
142
- word-break: break-all;
143
- }
144
-
145
- .empty-icon {
146
- width: 18px;
147
- height: 18px;
148
- }
149
- }
150
-
151
- &.stack-block-expanded {
152
- .stack-block-label {
153
- color: #ffffff;
154
- background-color: #29414e;
155
-
156
- .angle-icon {
157
- fill: #ffffff;
158
- transform: rotate(180deg);
159
- }
160
-
161
- .remove-icon {
162
- fill: #ffffff;
163
- }
164
- }
165
- }
166
-
167
- &.not-children {
168
- cursor: default;
169
- .stack-block-label {
170
- background-color: transparent;
171
- color: #333333;
172
-
173
- &:hover {
174
- cursor: default;
175
- background-color: transparent;
176
- border-bottom: none;
177
- }
178
-
179
- .angle-icon {
180
- opacity: 0;
181
- }
182
- }
183
- }
184
- }
185
- </style>
1
+ <template>
2
+ <div
3
+ :class="[
4
+ 'stack-block',
5
+ open ? 'stack-block-expanded' : 'stack-block-expandable',
6
+ { 'not-children': !props.hasChildren },
7
+ ]"
8
+ >
9
+ <div
10
+ :id="`${props.testId}-toggle`"
11
+ :data-id="`${props.testId}-toggle`"
12
+ class="stack-block-label"
13
+ @click="onToggle"
14
+ >
15
+ <atoms-the-icon name="angle" class="angle-icon" fill="#565656" />
16
+
17
+ <div class="stack-view-key">
18
+ <slot name="stackBlockKey" />
19
+ </div>
20
+ <div class="stack-block-content">
21
+ <slot name="stackBlockContent" />
22
+ </div>
23
+
24
+ <span
25
+ v-if="props.removable && props.isRollBack"
26
+ :data-id="`${props.testId}-roll-back`"
27
+ class="icon-roll-back"
28
+ @mousedown="onRollBack"
29
+ @click.stop
30
+ />
31
+ <atoms-the-icon
32
+ v-else-if="props.removable"
33
+ :data-id="`${props.testId}-remove`"
34
+ class="remove-icon"
35
+ name="close-circle"
36
+ @mousedown="onRemove"
37
+ @click.stop
38
+ />
39
+ <span v-else class="empty-icon"></span>
40
+ </div>
41
+
42
+ <div v-show="open" class="stack-children">
43
+ <div style="height: auto">
44
+ <slot name="stackChildren" />
45
+ </div>
46
+ </div>
47
+ </div>
48
+ </template>
49
+
50
+ <script setup lang="ts">
51
+ const props = withDefaults(
52
+ defineProps<{
53
+ hasChildren: boolean
54
+ removable?: boolean
55
+ testId?: string
56
+ openByDefault?: boolean
57
+ isRollBack?: boolean
58
+ }>(),
59
+ { testId: 'ui-stack-block', openByDefault: false }
60
+ )
61
+ const emits = defineEmits<{
62
+ (event: 'toggle', value: boolean): void
63
+ (event: 'remove'): void
64
+ (event: 'roll-back'): void
65
+ }>()
66
+
67
+ const open = ref<boolean>(props.openByDefault || false)
68
+ const onToggle = (): void => {
69
+ if (!props.hasChildren) return
70
+ setTimeout(() => {
71
+ open.value = !open.value
72
+ emits('toggle', open.value)
73
+ }, 0)
74
+ }
75
+
76
+ const onRemove = (): void => {
77
+ emits('remove')
78
+ }
79
+ const onRollBack = (): void => {
80
+ emits('roll-back')
81
+ }
82
+ </script>
83
+
84
+ <style scoped lang="scss">
85
+ .stack-block {
86
+ cursor: pointer;
87
+ background-color: var(--block-view-bg-color);
88
+ border-color: var(--global-border-color);
89
+
90
+ &.stack-block-expandable:hover {
91
+ border-bottom: 1px solid #666;
92
+
93
+ .stack-block-label {
94
+ background-color: var(--block-view-bg-color);
95
+ border-color: var(--global-border-color);
96
+ }
97
+ }
98
+
99
+ .stack-block-label {
100
+ padding: 6px 12px;
101
+ flex: 1 1 auto;
102
+ max-width: unset;
103
+ display: flex;
104
+ background-color: var(--block-view-bg-color);
105
+ border-color: var(--global-border-color);
106
+
107
+ &:hover {
108
+ .remove-icon {
109
+ opacity: 1;
110
+ }
111
+ }
112
+
113
+ &::before {
114
+ display: none;
115
+ }
116
+
117
+ .angle-icon {
118
+ width: 14px;
119
+ height: 14px;
120
+ margin-right: 4px;
121
+ transform: rotate(90deg);
122
+ align-self: center;
123
+ }
124
+
125
+ .remove-icon {
126
+ width: 18px;
127
+ height: 18px;
128
+ opacity: 0;
129
+ cursor: pointer;
130
+ }
131
+
132
+ .stack-view-key {
133
+ flex: 0 0 40%;
134
+ max-width: 40%;
135
+ }
136
+
137
+ .stack-block-content {
138
+ padding: 0;
139
+ flex: 1 1 auto;
140
+ width: 60%;
141
+ background-color: transparent;
142
+ word-break: break-all;
143
+ }
144
+
145
+ .empty-icon {
146
+ width: 18px;
147
+ height: 18px;
148
+ }
149
+ }
150
+
151
+ &.stack-block-expanded {
152
+ .stack-block-label {
153
+ color: #ffffff;
154
+ background-color: #29414e;
155
+
156
+ .angle-icon {
157
+ fill: #ffffff;
158
+ transform: rotate(180deg);
159
+ }
160
+
161
+ .remove-icon {
162
+ fill: #ffffff;
163
+ }
164
+ }
165
+ }
166
+
167
+ &.not-children {
168
+ cursor: default;
169
+ .stack-block-label {
170
+ background-color: transparent;
171
+ color: #333333;
172
+
173
+ &:hover {
174
+ cursor: default;
175
+ background-color: transparent;
176
+ border-bottom: none;
177
+ }
178
+
179
+ .angle-icon {
180
+ opacity: 0;
181
+ }
182
+ }
183
+ }
184
+ }
185
+ </style>
@@ -1,10 +1,10 @@
1
- export interface UI_I_TableInfoItem {
2
- label: string
3
- value: any
4
- isProperty?: boolean
5
- key?: string
6
- localization?: string
7
- localizationTemplate?: string
8
- isCapital?: boolean
9
- iconName?: string
10
- }
1
+ export interface UI_I_TableInfoItem {
2
+ label: string
3
+ value: any
4
+ isProperty?: boolean
5
+ key?: string
6
+ localization?: string
7
+ localizationTemplate?: string
8
+ isCapital?: boolean
9
+ iconName?: string
10
+ }
@@ -1 +1 @@
1
- export type UI_T_BlocksWidth = [number, number, number]
1
+ export type UI_T_BlocksWidth = [number, number, number]
@@ -1,5 +1,5 @@
1
- export interface UI_I_FileInfo {
2
- type: string
3
- title: string
4
- value: string | number
5
- }
1
+ export interface UI_I_FileInfo {
2
+ type: string
3
+ title: string
4
+ value: string | number
5
+ }
@@ -1,61 +1,61 @@
1
- <template>
2
- <g data-title="adapter-items-group">
3
- <template v-if="props.adaptersWithPositions.toggle">
4
- <template
5
- v-for="(adapter, key) in props.adaptersWithPositions.adapters"
6
- :key="adapter.id"
7
- >
8
- <common-diagram-main-adapter-item
9
- :adapter="adapter"
10
- :selected-port="props.selectedPort"
11
- :selected-adapter="props.selectedAdapter"
12
- :networks-count="props.networksCount"
13
- :is-dark-mode="props.isDarkMode"
14
- :networks-with-positions="props.networksWithPositions"
15
- @select-adapter="onSelectAdapter"
16
- @show-modal="onShowModal"
17
- />
18
- </template>
19
- </template>
20
- </g>
21
- </template>
22
-
23
- <script setup lang="ts">
24
- import {
25
- UI_I_AdaptersWithPositions,
26
- UI_I_ModalsInitialData,
27
- UI_I_SelectedAdapter,
28
- UI_I_SelectedPort,
29
- UI_I_NetworksWithPositions,
30
- } from '~/components/common/diagramMain/lib/models/interfaces'
31
-
32
- const props = defineProps<{
33
- adaptersWithPositions: UI_I_AdaptersWithPositions
34
- networksWithPositions: UI_I_NetworksWithPositions[]
35
- selectedPort: UI_I_SelectedPort
36
- selectedAdapter: UI_I_SelectedAdapter
37
- networksCount: number
38
- isDarkMode: boolean
39
- }>()
40
-
41
- const emits = defineEmits<{
42
- (event: 'select-adapter', adapterId: string): void
43
- (
44
- event: 'show-modal',
45
- value: string,
46
- properties?: UI_I_ModalsInitialData
47
- ): void
48
- }>()
49
-
50
- const onSelectAdapter = (adapterId: string): void => {
51
- emits('select-adapter', adapterId)
52
- }
53
- const onShowModal = (
54
- value: string,
55
- properties?: UI_I_ModalsInitialData
56
- ): void => {
57
- emits('show-modal', value, properties)
58
- }
59
- </script>
60
-
61
- <style scoped lang="scss"></style>
1
+ <template>
2
+ <g data-title="adapter-items-group">
3
+ <template v-if="props.adaptersWithPositions.toggle">
4
+ <template
5
+ v-for="(adapter, key) in props.adaptersWithPositions.adapters"
6
+ :key="adapter.id"
7
+ >
8
+ <common-diagram-main-adapter-item
9
+ :adapter="adapter"
10
+ :selected-port="props.selectedPort"
11
+ :selected-adapter="props.selectedAdapter"
12
+ :networks-count="props.networksCount"
13
+ :is-dark-mode="props.isDarkMode"
14
+ :networks-with-positions="props.networksWithPositions"
15
+ @select-adapter="onSelectAdapter"
16
+ @show-modal="onShowModal"
17
+ />
18
+ </template>
19
+ </template>
20
+ </g>
21
+ </template>
22
+
23
+ <script setup lang="ts">
24
+ import {
25
+ UI_I_AdaptersWithPositions,
26
+ UI_I_ModalsInitialData,
27
+ UI_I_SelectedAdapter,
28
+ UI_I_SelectedPort,
29
+ UI_I_NetworksWithPositions,
30
+ } from '~/components/common/diagramMain/lib/models/interfaces'
31
+
32
+ const props = defineProps<{
33
+ adaptersWithPositions: UI_I_AdaptersWithPositions
34
+ networksWithPositions: UI_I_NetworksWithPositions[]
35
+ selectedPort: UI_I_SelectedPort
36
+ selectedAdapter: UI_I_SelectedAdapter
37
+ networksCount: number
38
+ isDarkMode: boolean
39
+ }>()
40
+
41
+ const emits = defineEmits<{
42
+ (event: 'select-adapter', adapterId: string): void
43
+ (
44
+ event: 'show-modal',
45
+ value: string,
46
+ properties?: UI_I_ModalsInitialData
47
+ ): void
48
+ }>()
49
+
50
+ const onSelectAdapter = (adapterId: string): void => {
51
+ emits('select-adapter', adapterId)
52
+ }
53
+ const onShowModal = (
54
+ value: string,
55
+ properties?: UI_I_ModalsInitialData
56
+ ): void => {
57
+ emits('show-modal', value, properties)
58
+ }
59
+ </script>
60
+
61
+ <style scoped lang="scss"></style>
@@ -1,50 +1,50 @@
1
- import type {
2
- UI_I_AdapterStatus,
3
- UI_I_MainRectHeights,
4
- UI_I_SelectedAdapter,
5
- UI_I_SelectedPort,
6
- UI_I_SwitchLine,
7
- UI_I_NetworkPositionsConst,
8
- } from '~/components/common/diagramMain/lib/models/interfaces'
9
-
10
- export const managePhysicalAdapterStatusInitial: UI_I_AdapterStatus = {
11
- active: [],
12
- standby: [],
13
- unused: [],
14
- }
15
-
16
- export const mainRectHeightsInitial: UI_I_MainRectHeights = {
17
- networksHeight: 0,
18
- adaptersHeight: 0,
19
- }
20
-
21
- export const switchLineInitial: UI_I_SwitchLine = {
22
- y1: 0,
23
- y2: 0,
24
- ay: 0,
25
- }
26
-
27
- export const selectedPortInitial: UI_I_SelectedPort = {
28
- networkId: '-1',
29
- portId: '-1',
30
- activeAdapters: [],
31
- }
32
-
33
- export const selectedAdapterInitial: UI_I_SelectedAdapter = {
34
- adapterId: '-1',
35
- connectedPorts: [],
36
- }
37
-
38
- export const selectedSwitchLineYInitial: UI_I_SwitchLine = {
39
- y1: 0,
40
- y2: 0,
41
- }
42
-
43
- export const NETWORK_POSITIONS: UI_I_NetworkPositionsConst = {
44
- EMPTY_PORTS_PADDING_BOTTOM: 7.5,
45
- FROM_VLAN_ID_TO_GROUP_NAME: 22,
46
- VMS_AND_PORTS_HEIGHT: 22,
47
- V_CENTER_HEIGHT: 32,
48
- BETWEEN_VMS_AND_PORTS: 7.5,
49
- BETWEEN_V_CENTERS: 12.5,
50
- } as const
1
+ import type {
2
+ UI_I_AdapterStatus,
3
+ UI_I_MainRectHeights,
4
+ UI_I_SelectedAdapter,
5
+ UI_I_SelectedPort,
6
+ UI_I_SwitchLine,
7
+ UI_I_NetworkPositionsConst,
8
+ } from '~/components/common/diagramMain/lib/models/interfaces'
9
+
10
+ export const managePhysicalAdapterStatusInitial: UI_I_AdapterStatus = {
11
+ active: [],
12
+ standby: [],
13
+ unused: [],
14
+ }
15
+
16
+ export const mainRectHeightsInitial: UI_I_MainRectHeights = {
17
+ networksHeight: 0,
18
+ adaptersHeight: 0,
19
+ }
20
+
21
+ export const switchLineInitial: UI_I_SwitchLine = {
22
+ y1: 0,
23
+ y2: 0,
24
+ ay: 0,
25
+ }
26
+
27
+ export const selectedPortInitial: UI_I_SelectedPort = {
28
+ networkId: '-1',
29
+ portId: '-1',
30
+ activeAdapters: [],
31
+ }
32
+
33
+ export const selectedAdapterInitial: UI_I_SelectedAdapter = {
34
+ adapterId: '-1',
35
+ connectedPorts: [],
36
+ }
37
+
38
+ export const selectedSwitchLineYInitial: UI_I_SwitchLine = {
39
+ y1: 0,
40
+ y2: 0,
41
+ }
42
+
43
+ export const NETWORK_POSITIONS: UI_I_NetworkPositionsConst = {
44
+ EMPTY_PORTS_PADDING_BOTTOM: 7.5,
45
+ FROM_VLAN_ID_TO_GROUP_NAME: 22,
46
+ VMS_AND_PORTS_HEIGHT: 22,
47
+ V_CENTER_HEIGHT: 32,
48
+ BETWEEN_VMS_AND_PORTS: 7.5,
49
+ BETWEEN_V_CENTERS: 12.5,
50
+ } as const
@@ -1,21 +1,21 @@
1
- import type {
2
- UI_I_Adapter,
3
- UI_I_AdapterWithError,
4
- } from '~/components/common/diagramMain/lib/models/interfaces'
5
-
6
- export type UI_T_AdapterStatusNames = 'active' | 'standby' | 'unused'
7
- export type UI_T_PropertiesFieldName = 'vlanId' | 'networkLabel'
8
- export type UI_T_TrafficShapingFieldName = 'average' | 'peak' | 'burstSize'
9
- export type UI_T_PortPropertiesFieldName = 'mtu'
10
-
11
- export type UI_T_LoadBalancingMode =
12
- | 'inherit'
13
- | 'active-backup'
14
- | 'balance-slb'
15
- | 'balance-tcp'
16
- export type UI_T_IYN = 'inherit' | 'yes' | 'no'
17
- export type UI_T_Carier = 'inherit' | 'carier' | 'beakon'
18
-
19
- export type UI_T_Adapters = (UI_I_Adapter | UI_I_AdapterWithError) & {
20
- adapterPosition: number
21
- }
1
+ import type {
2
+ UI_I_Adapter,
3
+ UI_I_AdapterWithError,
4
+ } from '~/components/common/diagramMain/lib/models/interfaces'
5
+
6
+ export type UI_T_AdapterStatusNames = 'active' | 'standby' | 'unused'
7
+ export type UI_T_PropertiesFieldName = 'vlanId' | 'networkLabel'
8
+ export type UI_T_TrafficShapingFieldName = 'average' | 'peak' | 'burstSize'
9
+ export type UI_T_PortPropertiesFieldName = 'mtu'
10
+
11
+ export type UI_T_LoadBalancingMode =
12
+ | 'inherit'
13
+ | 'active-backup'
14
+ | 'balance-slb'
15
+ | 'balance-tcp'
16
+ export type UI_T_IYN = 'inherit' | 'yes' | 'no'
17
+ export type UI_T_Carier = 'inherit' | 'carier' | 'beakon'
18
+
19
+ export type UI_T_Adapters = (UI_I_Adapter | UI_I_AdapterWithError) & {
20
+ adapterPosition: number
21
+ }