bfg-common 1.3.471 → 1.3.474

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 (65) hide show
  1. package/assets/scss/common/normalize.scss +340 -340
  2. package/components/atoms/TheIcon.vue +78 -0
  3. package/components/atoms/TheIcon2.vue +1353 -1353
  4. package/components/atoms/loader/Loader.vue +30 -30
  5. package/components/atoms/loader/PreLoader.vue +38 -38
  6. package/components/atoms/switch/Switch.vue +111 -111
  7. package/components/atoms/table/compact/Compact.vue +526 -526
  8. package/components/common/adapterManager/ui/table/Header.vue +93 -93
  9. package/components/common/adapterManager/ui/table/Table.vue +162 -162
  10. package/components/common/context/Context.vue +99 -99
  11. package/components/common/countdownTimer/CountdownTimer.vue +50 -0
  12. package/components/common/lib/config/states.ts +160 -160
  13. package/components/common/mainNavigationPanel/MainNavigationPanel.vue +142 -142
  14. package/components/common/mainNavigationPanel/MainNavigationPanelNew.vue +248 -248
  15. package/components/common/mainNavigationPanel/MainNavigationPanelOld.vue +288 -288
  16. package/components/common/readyToComplete/ReadyToComplete.vue +15 -15
  17. package/components/common/resource/progressBlock/ProgressBlock.vue +142 -142
  18. package/components/common/split/horizontal/Horizontal.vue +70 -70
  19. package/components/common/vm/actions/clone/Clone.vue +511 -511
  20. package/components/common/vm/actions/common/customizeHardware/CustomizeHardware.vue +273 -273
  21. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardware.vue +697 -697
  22. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/Cpu.vue +400 -400
  23. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/Memory.vue +329 -329
  24. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetwork.vue +305 -305
  25. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +168 -168
  26. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newUsbController/NewUsbController.vue +82 -82
  27. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/Other.vue +32 -32
  28. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCard.vue +182 -182
  29. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/BootOptions.vue +114 -114
  30. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptions.vue +192 -192
  31. package/components/common/vm/actions/common/customizeHardware/vmoptions/tools/Tools.vue +72 -72
  32. package/components/common/vm/actions/common/select/computeResource/ComputeResource.vue +164 -164
  33. package/components/common/vm/actions/common/select/name/Name.vue +235 -235
  34. package/components/common/vm/actions/common/select/storage/Storage.vue +198 -198
  35. package/components/common/vm/actions/editSettings/EditSettings.vue +316 -316
  36. package/components/common/weekSelect/lib/config/options.ts +10 -10
  37. package/components/common/wizards/datastore/add/Add.vue +436 -436
  38. package/components/common/wizards/datastore/add/lib/config/stepItems.ts +191 -191
  39. package/components/common/wizards/datastore/add/lib/models/interfaces.ts +38 -38
  40. package/components/common/wizards/datastore/add/lib/utils.ts +70 -70
  41. package/components/common/wizards/datastore/add/local/createName/CreateName.vue +160 -160
  42. package/components/common/wizards/datastore/add/nfs/Nfs.vue +112 -112
  43. package/components/common/wizards/datastore/add/nfs/accessibility/Accessibility.vue +104 -104
  44. package/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/compatibleTable.ts +62 -62
  45. package/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/hostsTableItems.ts +53 -53
  46. package/components/common/wizards/datastore/add/readyComplete/ReadyComplete.vue +86 -86
  47. package/components/common/wizards/datastore/add/readyComplete/lib/config/propertiesDetails.ts +184 -184
  48. package/components/common/wizards/datastore/add/sharedStorm/deviceSelection/DeviceSelection.vue +459 -459
  49. package/components/common/wizards/datastore/add/types/Types.vue +80 -80
  50. package/components/common/wizards/datastore/add/types/lib/config/typeOptions.ts +49 -49
  51. package/composables/useAppVersion.ts +22 -22
  52. package/composables/useEnvLanguage.ts +20 -20
  53. package/lib/utils/sendTask.ts +73 -73
  54. package/minify.js +146 -146
  55. package/package.json +1 -1
  56. package/plugins/spice-console/spice.console.ts +147 -147
  57. package/public/spice-console/application/codec.js +263 -263
  58. package/public/spice-console/lib/rasterEngine.js +907 -907
  59. package/public/spice-console/network/spicechannel.js +375 -375
  60. package/store/main/lib/interfaces.ts +9 -9
  61. package/store/tasks/actions.ts +133 -133
  62. package/store/tasks/getters.ts +25 -25
  63. package/store/tasks/lib/models/interfaces.ts +18 -18
  64. package/store/tasks/mutations.ts +58 -58
  65. package/store/tasks/state.ts +16 -16
@@ -1,104 +1,104 @@
1
- <template>
2
- <div>
3
- <atoms-alert
4
- v-show="errors.length"
5
- test-id="accessibility"
6
- status="alert-danger"
7
- :items="errors"
8
- @remove="removeValidationErrors"
9
- />
10
-
11
- <div>
12
- <atoms-tabs
13
- v-model="activeTab"
14
- test-id="accessibility"
15
- :items="tabs"
16
- size="small"
17
- />
18
- </div>
19
- <div>
20
- <common-wizards-datastore-add-nfs-accessibility-tables-view
21
- v-model:selected-row="selectedHosts"
22
- :data-table="dataTable?.items || []"
23
- :total-items="dataTable?.total_items || 0"
24
- :total-pages="dataTable?.total_pages || 1"
25
- :pagination="pagination"
26
- :table-type="activeTab"
27
- @pagination="updatePagination"
28
- @sort="sortTable"
29
- />
30
- </div>
31
- </div>
32
- </template>
33
-
34
- <script lang="ts" setup>
35
- import { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
36
- import { UI_I_Localization } from '~/lib/models/interfaces'
37
- import { UI_I_Pagination } from '~/lib/models/table/interfaces'
38
- import { T_HostsAccessibilityTab } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/types'
39
- import { hostAccessibilityTabsFunc } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/config/tabsPannel'
40
- // import { hostsAccessibilityTablesFunc } from '~/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/hostsTableItems'
41
-
42
- const props = defineProps<{
43
- hostAccessibilitySubmit: number
44
- hosts?: any
45
- }>()
46
- const localization = computed<UI_I_Localization>(() => useLocal())
47
- const emits = defineEmits<{
48
- (event: 'next', value: string[]): void
49
- }>()
50
-
51
- const activeTab = ref<T_HostsAccessibilityTab>('compatible-hosts')
52
- const tabs = computed<UI_I_CollapseNavItem[]>(() =>
53
- hostAccessibilityTabsFunc(localization.value, [
54
- (props.hosts?.items?.length || 0) + '',
55
- '0',
56
- ])
57
- )
58
-
59
- // const dataTable = computed(() => hostsAccessibilityTablesFunc(activeTab.value))
60
- // TODO refactoring
61
- const dataTable = computed<any>(() => props.hosts)
62
-
63
- const pagination = ref<UI_I_Pagination>({
64
- page: 1,
65
- pageSize: 35,
66
- })
67
- const sort = ref<string | null>(null)
68
-
69
- const selectedHosts = ref<string[]>([])
70
-
71
- const updatePagination = (event: UI_I_Pagination): void => {
72
- pagination.value = event
73
- }
74
- const sortTable = (event: string): void => {
75
- sort.value = event
76
- }
77
-
78
- const errors = ref<string[]>([])
79
-
80
- const showValidationErrors = (text: string): void => {
81
- errors.value = [text]
82
- }
83
- const removeValidationErrors = (): void => {
84
- errors.value = []
85
- }
86
- const submit = async () => {
87
- if (!selectedHosts.value.length) {
88
- const text = localization.value.selectLeastEntityContinue
89
- showValidationErrors(text)
90
- return
91
- }
92
-
93
- removeValidationErrors()
94
- emits('next', selectedHosts.value)
95
- }
96
- watch(
97
- () => props.hostAccessibilitySubmit,
98
- () => {
99
- submit()
100
- }
101
- )
102
- </script>
103
-
104
- <style lang="scss" scoped></style>
1
+ <template>
2
+ <div>
3
+ <atoms-alert
4
+ v-show="errors.length"
5
+ test-id="accessibility"
6
+ status="alert-danger"
7
+ :items="errors"
8
+ @remove="removeValidationErrors"
9
+ />
10
+
11
+ <div>
12
+ <atoms-tabs
13
+ v-model="activeTab"
14
+ test-id="accessibility"
15
+ :items="tabs"
16
+ size="small"
17
+ />
18
+ </div>
19
+ <div>
20
+ <common-wizards-datastore-add-nfs-accessibility-tables-view
21
+ v-model:selected-row="selectedHosts"
22
+ :data-table="dataTable?.items || []"
23
+ :total-items="dataTable?.total_items || 0"
24
+ :total-pages="dataTable?.total_pages || 1"
25
+ :pagination="pagination"
26
+ :table-type="activeTab"
27
+ @pagination="updatePagination"
28
+ @sort="sortTable"
29
+ />
30
+ </div>
31
+ </div>
32
+ </template>
33
+
34
+ <script lang="ts" setup>
35
+ import { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
36
+ import { UI_I_Localization } from '~/lib/models/interfaces'
37
+ import { UI_I_Pagination } from '~/lib/models/table/interfaces'
38
+ import { T_HostsAccessibilityTab } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/types'
39
+ import { hostAccessibilityTabsFunc } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/config/tabsPannel'
40
+ // import { hostsAccessibilityTablesFunc } from '~/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/hostsTableItems'
41
+
42
+ const props = defineProps<{
43
+ hostAccessibilitySubmit: number
44
+ hosts?: any
45
+ }>()
46
+ const localization = computed<UI_I_Localization>(() => useLocal())
47
+ const emits = defineEmits<{
48
+ (event: 'next', value: string[]): void
49
+ }>()
50
+
51
+ const activeTab = ref<T_HostsAccessibilityTab>('compatible-hosts')
52
+ const tabs = computed<UI_I_CollapseNavItem[]>(() =>
53
+ hostAccessibilityTabsFunc(localization.value, [
54
+ (props.hosts?.items?.length || 0) + '',
55
+ '0',
56
+ ])
57
+ )
58
+
59
+ // const dataTable = computed(() => hostsAccessibilityTablesFunc(activeTab.value))
60
+ // TODO refactoring
61
+ const dataTable = computed<any>(() => props.hosts)
62
+
63
+ const pagination = ref<UI_I_Pagination>({
64
+ page: 1,
65
+ pageSize: 35,
66
+ })
67
+ const sort = ref<string | null>(null)
68
+
69
+ const selectedHosts = ref<string[]>([])
70
+
71
+ const updatePagination = (event: UI_I_Pagination): void => {
72
+ pagination.value = event
73
+ }
74
+ const sortTable = (event: string): void => {
75
+ sort.value = event
76
+ }
77
+
78
+ const errors = ref<string[]>([])
79
+
80
+ const showValidationErrors = (text: string): void => {
81
+ errors.value = [text]
82
+ }
83
+ const removeValidationErrors = (): void => {
84
+ errors.value = []
85
+ }
86
+ const submit = async () => {
87
+ if (!selectedHosts.value.length) {
88
+ const text = localization.value.selectLeastEntityContinue
89
+ showValidationErrors(text)
90
+ return
91
+ }
92
+
93
+ removeValidationErrors()
94
+ emits('next', selectedHosts.value)
95
+ }
96
+ watch(
97
+ () => props.hostAccessibilitySubmit,
98
+ () => {
99
+ submit()
100
+ }
101
+ )
102
+ </script>
103
+
104
+ <style lang="scss" scoped></style>
@@ -1,62 +1,62 @@
1
- import {
2
- UI_I_HeadItem,
3
- UI_I_BodyItem,
4
- } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
5
- import { UI_I_Localization } from '~/lib/models/interfaces'
6
- import { constructHeadItem } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
7
- import { I_CompatibleHostsTable } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/interfaces'
8
- import { compatibleHostsTableKeys } from '~/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/tableKeys'
9
- import {
10
- hostIconByState,
11
- clusterIconByState,
12
- } from '~/components/common/lib/config/states'
13
-
14
- const getItems = (
15
- localization: UI_I_Localization
16
- ): [string, boolean, string, string][] => {
17
- return [
18
- [localization.host, true, '300px', compatibleHostsTableKeys[0]],
19
- [localization.cluster, true, '300px', compatibleHostsTableKeys[1]],
20
- ]
21
- }
22
-
23
- export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
24
- const result: UI_I_HeadItem[] = []
25
- getItems(localization).forEach((item) => {
26
- result.push(constructHeadItem('icon', item[0], item[3], false, item[2]))
27
- })
28
- return result
29
- }
30
-
31
- export const bodyItems = (
32
- data: I_CompatibleHostsTable[]
33
- ): UI_I_BodyItem[][] => {
34
- const bodyItems: UI_I_BodyItem[][] = []
35
- data.forEach((item: I_CompatibleHostsTable, key) => {
36
- const hostData = {
37
- // @ts-ignore
38
- iconClassName: `vsphere-icon-${hostIconByState[item.state]}`,
39
- }
40
- const clusterData = {
41
- iconClassName: `vsphere-icon-${clusterIconByState[1]}`,
42
- }
43
-
44
- bodyItems.push([
45
- {
46
- key: 'icon',
47
- text: item[compatibleHostsTableKeys[0]],
48
- data: hostData,
49
- id: item.id,
50
- testId: `host-table-item-${item.host}`,
51
- },
52
- {
53
- key: 'icon',
54
- text: item[compatibleHostsTableKeys[1]],
55
- data: clusterData,
56
- id: item.id,
57
- testId: `host-table-item-${item.host}`,
58
- },
59
- ])
60
- })
61
- return bodyItems
62
- }
1
+ import {
2
+ UI_I_HeadItem,
3
+ UI_I_BodyItem,
4
+ } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
5
+ import { UI_I_Localization } from '~/lib/models/interfaces'
6
+ import { constructHeadItem } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
7
+ import { I_CompatibleHostsTable } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/interfaces'
8
+ import { compatibleHostsTableKeys } from '~/components/common/wizards/datastore/add/nfs/accessibility/tablesView/lib/config/tableKeys'
9
+ import {
10
+ hostIconByState,
11
+ clusterIconByState,
12
+ } from '~/components/common/lib/config/states'
13
+
14
+ const getItems = (
15
+ localization: UI_I_Localization
16
+ ): [string, boolean, string, string][] => {
17
+ return [
18
+ [localization.host, true, '300px', compatibleHostsTableKeys[0]],
19
+ [localization.cluster, true, '300px', compatibleHostsTableKeys[1]],
20
+ ]
21
+ }
22
+
23
+ export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
24
+ const result: UI_I_HeadItem[] = []
25
+ getItems(localization).forEach((item) => {
26
+ result.push(constructHeadItem('icon', item[0], item[3], false, item[2]))
27
+ })
28
+ return result
29
+ }
30
+
31
+ export const bodyItems = (
32
+ data: I_CompatibleHostsTable[]
33
+ ): UI_I_BodyItem[][] => {
34
+ const bodyItems: UI_I_BodyItem[][] = []
35
+ data.forEach((item: I_CompatibleHostsTable, key) => {
36
+ const hostData = {
37
+ // @ts-ignore
38
+ iconClassName: `vsphere-icon-${hostIconByState[item.state]}`,
39
+ }
40
+ const clusterData = {
41
+ iconClassName: `vsphere-icon-${clusterIconByState[1]}`,
42
+ }
43
+
44
+ bodyItems.push([
45
+ {
46
+ key: 'icon',
47
+ text: item[compatibleHostsTableKeys[0]],
48
+ data: hostData,
49
+ id: item.id,
50
+ testId: `host-table-item-${item.host}`,
51
+ },
52
+ {
53
+ key: 'icon',
54
+ text: item[compatibleHostsTableKeys[1]],
55
+ data: clusterData,
56
+ id: item.id,
57
+ testId: `host-table-item-${item.host}`,
58
+ },
59
+ ])
60
+ })
61
+ return bodyItems
62
+ }
@@ -1,53 +1,53 @@
1
- import {
2
- I_CompatibleHostsTable,
3
- I_IncompatibleHostsTable,
4
- } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/interfaces'
5
- import { T_HostsAccessibilityTab } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/types'
6
- import { API_UI_I_DataTable } from '~/lib/models/table/interfaces'
7
-
8
- const compatibleHostsTable: API_UI_I_DataTable<I_CompatibleHostsTable[]> = {
9
- items: [
10
- {
11
- id: 1,
12
- host: 'esxi0.иридиум',
13
- cluster: 'Cluster00',
14
- },
15
- {
16
- id: 2,
17
- host: ' esxi0.иридиум',
18
- cluster: 'Cluster00',
19
- },
20
- {
21
- id: 3,
22
- host: 'esxi3.иридиум',
23
- cluster: 'Cluster00',
24
- },
25
- {
26
- id: 4,
27
- host: 'esxi4.иридиум',
28
- cluster: 'Cluster00',
29
- },
30
- {
31
- id: 5,
32
- host: 'esxi1.иридиум',
33
- cluster: 'Cluster01',
34
- },
35
- ],
36
- total_items: 5,
37
- total_pages: 1,
38
- }
39
- const incompatibleHostsTable: API_UI_I_DataTable<I_IncompatibleHostsTable[]> = {
40
- items: [],
41
- total_items: 0,
42
- total_pages: 1,
43
- }
44
-
45
- export { incompatibleHostsTable, compatibleHostsTable }
46
- export const hostsAccessibilityTablesFunc = (type: T_HostsAccessibilityTab) => {
47
- const hostItems = {
48
- 'compatible-hosts': compatibleHostsTable,
49
- 'incompatible-hosts': incompatibleHostsTable,
50
- }
51
-
52
- return hostItems[type]
53
- }
1
+ import {
2
+ I_CompatibleHostsTable,
3
+ I_IncompatibleHostsTable,
4
+ } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/interfaces'
5
+ import { T_HostsAccessibilityTab } from '~/components/common/wizards/datastore/add/nfs/accessibility/lib/models/types'
6
+ import { API_UI_I_DataTable } from '~/lib/models/table/interfaces'
7
+
8
+ const compatibleHostsTable: API_UI_I_DataTable<I_CompatibleHostsTable[]> = {
9
+ items: [
10
+ {
11
+ id: 1,
12
+ host: 'esxi0.иридиум',
13
+ cluster: 'Cluster00',
14
+ },
15
+ {
16
+ id: 2,
17
+ host: ' esxi0.иридиум',
18
+ cluster: 'Cluster00',
19
+ },
20
+ {
21
+ id: 3,
22
+ host: 'esxi3.иридиум',
23
+ cluster: 'Cluster00',
24
+ },
25
+ {
26
+ id: 4,
27
+ host: 'esxi4.иридиум',
28
+ cluster: 'Cluster00',
29
+ },
30
+ {
31
+ id: 5,
32
+ host: 'esxi1.иридиум',
33
+ cluster: 'Cluster01',
34
+ },
35
+ ],
36
+ total_items: 5,
37
+ total_pages: 1,
38
+ }
39
+ const incompatibleHostsTable: API_UI_I_DataTable<I_IncompatibleHostsTable[]> = {
40
+ items: [],
41
+ total_items: 0,
42
+ total_pages: 1,
43
+ }
44
+
45
+ export { incompatibleHostsTable, compatibleHostsTable }
46
+ export const hostsAccessibilityTablesFunc = (type: T_HostsAccessibilityTab) => {
47
+ const hostItems = {
48
+ 'compatible-hosts': compatibleHostsTable,
49
+ 'incompatible-hosts': incompatibleHostsTable,
50
+ }
51
+
52
+ return hostItems[type]
53
+ }
@@ -1,86 +1,86 @@
1
- <template>
2
- <div class="ready-complete">
3
- <div class="ready-complete__desc">{{ localization.readyCompleteDesc }}</div>
4
-
5
- <common-details-list :items="properties" class="ready-complete__list list">
6
- <template #default="{ item }">
7
- <common-details-item :has-children="true" open-by-default>
8
- <template #stackBlockKey>
9
- <span class="list__labels">{{
10
- localization.chosenDatastoreName
11
- }}</span>
12
- </template>
13
-
14
- <template #stackChildren>
15
- <template
16
- v-for="(item2, key2) in item.items"
17
- :key="`${item2}_${key2}`"
18
- >
19
- <common-details-item
20
- :has-children="false"
21
- class="list__default-style"
22
- >
23
- <template #stackBlockKey>
24
- <div>
25
- {{ item2.label }}
26
- </div>
27
- </template>
28
- <template #stackBlockContent>
29
- <div v-if="item2.data">
30
- <div v-for="item3 in item2.data" :key="item3" class="flex-align-center">
31
- <div class="vsphere-icon-host"></div>
32
- <span>{{ item3 }}</span>
33
- </div>
34
- </div>
35
- <span v-else>
36
- {{ item2.value }}
37
- </span>
38
- </template>
39
- </common-details-item>
40
- </template>
41
- </template>
42
- </common-details-item>
43
- </template>
44
- </common-details-list>
45
- </div>
46
- </template>
47
-
48
- <script lang="ts" setup>
49
- import { UI_I_DetailsItem } from '~/components/common/details/lib/models/interfaces'
50
- import { UI_I_Localization } from '~/lib/models/interfaces'
51
-
52
- const props = defineProps<{
53
- dataReadyView: UI_I_DetailsItem[]
54
- }>()
55
- // console.log(props)
56
-
57
- const localization = computed<UI_I_Localization>(() => useLocal())
58
-
59
- const properties = computed<UI_I_DetailsItem[]>(() => props.dataReadyView)
60
- </script>
61
-
62
- <style lang="scss" scoped>
63
- @import '~/assets/scss/common/mixins.scss';
64
- .ready-complete {
65
- &__list {
66
- @include flex($dir: column);
67
- padding: 12px 0;
68
- row-gap: 15px;
69
- }
70
- }
71
- .list {
72
- &__labels {
73
- @include text($fs: 13px, $fw: 700);
74
- }
75
- :deep(.list__default-style) {
76
- .stack-block {
77
- &__label {
78
- align-items: flex-start;
79
- }
80
- &-content {
81
- white-space: pre-line;
82
- }
83
- }
84
- }
85
- }
86
- </style>
1
+ <template>
2
+ <div class="ready-complete">
3
+ <div class="ready-complete__desc">{{ localization.readyCompleteDesc }}</div>
4
+
5
+ <common-details-list :items="properties" class="ready-complete__list list">
6
+ <template #default="{ item }">
7
+ <common-details-item :has-children="true" open-by-default>
8
+ <template #stackBlockKey>
9
+ <span class="list__labels">{{
10
+ localization.chosenDatastoreName
11
+ }}</span>
12
+ </template>
13
+
14
+ <template #stackChildren>
15
+ <template
16
+ v-for="(item2, key2) in item.items"
17
+ :key="`${item2}_${key2}`"
18
+ >
19
+ <common-details-item
20
+ :has-children="false"
21
+ class="list__default-style"
22
+ >
23
+ <template #stackBlockKey>
24
+ <div>
25
+ {{ item2.label }}
26
+ </div>
27
+ </template>
28
+ <template #stackBlockContent>
29
+ <div v-if="item2.data">
30
+ <div v-for="item3 in item2.data" :key="item3" class="flex-align-center">
31
+ <div class="vsphere-icon-host"></div>
32
+ <span>{{ item3 }}</span>
33
+ </div>
34
+ </div>
35
+ <span v-else>
36
+ {{ item2.value }}
37
+ </span>
38
+ </template>
39
+ </common-details-item>
40
+ </template>
41
+ </template>
42
+ </common-details-item>
43
+ </template>
44
+ </common-details-list>
45
+ </div>
46
+ </template>
47
+
48
+ <script lang="ts" setup>
49
+ import { UI_I_DetailsItem } from '~/components/common/details/lib/models/interfaces'
50
+ import { UI_I_Localization } from '~/lib/models/interfaces'
51
+
52
+ const props = defineProps<{
53
+ dataReadyView: UI_I_DetailsItem[]
54
+ }>()
55
+ // console.log(props)
56
+
57
+ const localization = computed<UI_I_Localization>(() => useLocal())
58
+
59
+ const properties = computed<UI_I_DetailsItem[]>(() => props.dataReadyView)
60
+ </script>
61
+
62
+ <style lang="scss" scoped>
63
+ @import '~/assets/scss/common/mixins.scss';
64
+ .ready-complete {
65
+ &__list {
66
+ @include flex($dir: column);
67
+ padding: 12px 0;
68
+ row-gap: 15px;
69
+ }
70
+ }
71
+ .list {
72
+ &__labels {
73
+ @include text($fs: 13px, $fw: 700);
74
+ }
75
+ :deep(.list__default-style) {
76
+ .stack-block {
77
+ &__label {
78
+ align-items: flex-start;
79
+ }
80
+ &-content {
81
+ white-space: pre-line;
82
+ }
83
+ }
84
+ }
85
+ }
86
+ </style>