bfg-common 1.5.398 → 1.5.400

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 (137) hide show
  1. package/CODE_STYLE.md +109 -109
  2. package/assets/img/icons/icons-sprite-dark-3.svg +227 -227
  3. package/assets/img/icons/icons-sprite-dark-5.svg +488 -488
  4. package/assets/img/icons/icons-sprite-light-3.svg +227 -227
  5. package/assets/img/icons/icons-sprite-light-5.svg +488 -488
  6. package/assets/scss/common/icons/icons-6.scss +4 -4
  7. package/components/atoms/TheIcon3.vue +50 -50
  8. package/components/atoms/collapse/CollapseNav.vue +170 -170
  9. package/components/atoms/collapse/CollapseNavItem.vue +226 -226
  10. package/components/atoms/nav/NavBar.vue +159 -159
  11. package/components/atoms/perPage/PerPage.vue +58 -58
  12. package/components/atoms/table/dataGrid/DataGrid.vue +1717 -1717
  13. package/components/atoms/table/dataGrid/lib/config/settingsTable.ts +94 -94
  14. package/components/atoms/table/dataGrid/lib/utils/export.ts +16 -16
  15. package/components/atoms/tabs/VerticalTabs.vue +105 -105
  16. package/components/common/backup/storage/actions/add/lib/config/steps.ts +168 -168
  17. package/components/common/backup/storage/actions/add/steps/hostAccessibility/HostAccessibility.vue +52 -52
  18. package/components/common/backup/storage/actions/add/steps/readyComplete/ReadyComplete.vue +45 -45
  19. package/components/common/backup/storage/actions/delete/Delete.vue +65 -65
  20. package/components/common/browse/blocks/Container.vue +234 -234
  21. package/components/common/browse/blocks/contents/filesNew/Skeleton.vue +18 -18
  22. package/components/common/context/lib/models/interfaces.ts +33 -33
  23. package/components/common/diagramMain/modals/lib/config/networkModal.ts +398 -398
  24. package/components/common/diagramMain/network/Network.vue +141 -141
  25. package/components/common/layout/theHeader/helpMenu/About.vue +82 -82
  26. package/components/common/layout/theHeader/userMenu/modals/preferences/view/ViewOld.vue +112 -112
  27. package/components/common/monitor/overview/OverviewOld.vue +139 -139
  28. package/components/common/pages/home/headline/Headline.vue +45 -45
  29. package/components/common/pages/home/headline/HeadlineOld.vue +42 -42
  30. package/components/common/pages/home/lib/models/interfaces.ts +48 -48
  31. package/components/common/pages/home/widgets/Widgets.vue +49 -49
  32. package/components/common/pages/home/widgets/WidgetsNew.vue +88 -88
  33. package/components/common/pages/home/widgets/WidgetsOld.vue +36 -36
  34. package/components/common/pages/home/widgets/hosts/Hosts.vue +27 -27
  35. package/components/common/pages/home/widgets/hosts/lib/config/items.ts +23 -23
  36. package/components/common/pages/home/widgets/vms/Vms.vue +26 -26
  37. package/components/common/pages/home/widgets/vms/VmsOld.vue +35 -35
  38. package/components/common/pages/home/widgets/vms/lib/config/items.ts +19 -19
  39. package/components/common/pages/packages/Packages.vue +208 -208
  40. package/components/common/pages/shortcuts/block/BlockOld.vue +68 -68
  41. package/components/common/readyToComplete/ReadyToComplete.vue +17 -17
  42. package/components/common/recursionTree/RecursionTree.vue +223 -223
  43. package/components/common/select/button/ButtonDropdown.vue +112 -112
  44. package/components/common/select/radio/RadioGroup.vue +137 -137
  45. package/components/common/spiceConsole/Drawer.vue +381 -381
  46. package/components/common/spiceConsole/SpiceConsole.vue +127 -127
  47. package/components/common/spiceConsole/lib/models/interfaces.ts +5 -5
  48. package/components/common/tools/Actions.vue +207 -207
  49. package/components/common/vm/actions/add/Old.vue +388 -388
  50. package/components/common/vm/actions/add/folderTreeView/FolderTreeView.vue +72 -72
  51. package/components/common/vm/actions/add/folderTreeView/New.vue +40 -40
  52. package/components/common/vm/actions/add/folderTreeView/Old.vue +50 -50
  53. package/components/common/vm/actions/clone/Clone.vue +823 -823
  54. package/components/common/vm/actions/clone/lib/config/steps.ts +291 -291
  55. package/components/common/vm/actions/clone/toTemplate/lib/config/steps.ts +116 -116
  56. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareOld.vue +321 -321
  57. package/components/common/vm/actions/common/customizeHardware/virtualHardware/browseView/BrowseView.vue +227 -227
  58. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/Bus.vue +100 -100
  59. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDrive.vue +232 -232
  60. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveOld.vue +168 -168
  61. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/Media.vue +25 -25
  62. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaNew.vue +78 -78
  63. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaOld.vue +50 -50
  64. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/Shares.vue +140 -140
  65. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/lib/config/options.ts +28 -28
  66. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/tooltip/TooltipNew.vue +154 -154
  67. package/components/common/vm/actions/common/customizeHardware/virtualHardware/lib/config/dropdownItems.ts +155 -155
  68. package/components/common/vm/actions/common/customizeHardware/virtualHardware/limit/Limit.vue +220 -220
  69. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/Memory.vue +307 -307
  70. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDisk.vue +385 -385
  71. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/Location.vue +154 -154
  72. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/LocationOld.vue +85 -85
  73. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetwork.vue +288 -288
  74. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/table/lib/config/config.ts +94 -94
  75. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddress.vue +119 -119
  76. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +205 -205
  77. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoNew.vue +66 -66
  78. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoOld.vue +62 -62
  79. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue +31 -31
  80. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIoOld.vue +76 -76
  81. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/Note.vue +15 -15
  82. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteNew.vue +42 -42
  83. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteOld.vue +30 -30
  84. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGridOld.vue +84 -84
  85. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/Other.vue +16 -16
  86. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCard.vue +154 -154
  87. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/numberDisplays/NumberDisplays.vue +53 -53
  88. package/components/common/vm/actions/common/customizeHardware/vmoptions/Vmoptions.vue +155 -155
  89. package/components/common/vm/actions/common/customizeHardware/vmoptions/VmoptionsNew.vue +130 -130
  90. package/components/common/vm/actions/common/customizeHardware/vmoptions/VmoptionsOld.vue +113 -113
  91. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/delay/Delay.vue +32 -32
  92. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/firmware/Firmware.vue +60 -60
  93. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/Order.vue +174 -174
  94. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptions.vue +95 -95
  95. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptionsOld.vue +155 -155
  96. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/Keymap.vue +32 -32
  97. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/KeymapOld.vue +44 -44
  98. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/Password.vue +103 -103
  99. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirection.vue +28 -28
  100. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionOld.vue +44 -44
  101. package/components/common/vm/actions/common/select/compatibility/Old.vue +107 -107
  102. package/components/common/vm/actions/common/select/computeResource/ComputeResource.vue +143 -143
  103. package/components/common/vm/actions/common/select/computeResource/New.vue +184 -184
  104. package/components/common/vm/actions/common/select/computeResource/treeView/TreeView.vue +131 -131
  105. package/components/common/vm/actions/common/select/createType/CreateType.vue +38 -38
  106. package/components/common/vm/actions/common/select/createType/lib/config/items.ts +48 -48
  107. package/components/common/vm/actions/common/select/createType/lib/models/interfaces.ts +5 -5
  108. package/components/common/vm/actions/common/select/os/Old.vue +152 -152
  109. package/components/common/vm/actions/common/select/os/Os.vue +139 -139
  110. package/components/common/vm/actions/common/select/storage/Storage.vue +155 -155
  111. package/components/common/vm/actions/common/select/storage/new/New.vue +300 -300
  112. package/components/common/vm/actions/common/select/storage/new/lib/models/interfaces.ts +5 -5
  113. package/components/common/vm/actions/common/select/storage/new/lib/utils/utils.ts +21 -21
  114. package/components/common/vm/actions/editSettings/EditSettings.vue +242 -242
  115. package/components/common/vm/actions/editSettings/new/Skeleton.vue +88 -88
  116. package/components/common/vmt/actions/add/lib/models/interfaces.ts +23 -23
  117. package/components/common/wizards/datastore/add/steps/typeMode/lib/config/typeOptions.ts +43 -43
  118. package/components/common/wizards/network/add/steps/SelectConnectionType.vue +104 -104
  119. package/components/common/wizards/network/add/steps/SelectedTargetDevice.vue +467 -467
  120. package/components/common/wizards/vm/migrate/Migrate.vue +349 -349
  121. package/components/common/wizards/vm/migrate/lib/config/constructDataReady.ts +220 -220
  122. package/components/common/wizards/vm/migrate/lib/config/steps.ts +157 -157
  123. package/components/common/wizards/vm/migrate/lib/validations.ts +68 -68
  124. package/components/common/wizards/vm/migrate/select/network/Network.vue +103 -103
  125. package/components/common/wizards/vm/migrate/select/network/table/network/lib/config/advancedTable.ts +91 -91
  126. package/components/common/wizards/vm/migrate/select/type/lib/config/typeOptions.ts +45 -45
  127. package/composables/productNameLocal.ts +30 -30
  128. package/composables/useAppVersion.ts +21 -21
  129. package/package.json +1 -1
  130. package/plugins/date.ts +233 -233
  131. package/plugins/panelStates.ts +70 -70
  132. package/plugins/text.ts +59 -59
  133. package/public/spice-console/lib/images/bitmap.js +203 -203
  134. package/public/spice-console/network/spicechannel.js +390 -390
  135. package/store/main/mutations.ts +7 -7
  136. package/store/main/state.ts +7 -7
  137. package/store/tasks/mappers/recentTasks.ts +64 -64
@@ -1,94 +1,94 @@
1
- import type { UI_ColumnSettingsStrategy } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
2
- import type {
3
- UI_I_ColumnKey,
4
- UI_I_HeadItem,
5
- } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
6
- import type { UI_I_DropdownButtonItem } from '~/components/common/select/button/lib/models/interfaces'
7
- import type { UI_I_Localization } from '~/lib/models/interfaces'
8
- import {
9
- constructColumnKey,
10
- constructHeadItem,
11
- } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
12
-
13
- export const defaultColumnKeys = (
14
- items: [string, boolean, string, string][],
15
- strategy?: UI_ColumnSettingsStrategy
16
- ): UI_I_ColumnKey[] => {
17
- const result: UI_I_ColumnKey[] = []
18
- items.forEach((item, i) => {
19
- let col: string = `col${i}` // Стандартное значение по умолчанию
20
-
21
- if (strategy) {
22
- // Проходим по ключам объекта и ищем соответствие индекса i в значениях
23
- for (const key in strategy) {
24
- if (strategy[key].includes(i)) {
25
- col = key
26
- break
27
- }
28
- }
29
- }
30
-
31
- result.push(
32
- constructColumnKey(col, item[0], item[1], `show-column-${item[3]}`)
33
- )
34
- })
35
- return result
36
- }
37
-
38
- export const defaultHeadItems = (
39
- items: [string, boolean, string, string][],
40
- strategy?: UI_ColumnSettingsStrategy
41
- ): UI_I_HeadItem[] => {
42
- const result: UI_I_HeadItem[] = []
43
- items.forEach((item, i) => {
44
- let col: string = `col${i}` // Стандартное значение по умолчанию
45
-
46
- if (strategy) {
47
- // Проходим по ключам объекта и ищем соответствие индекса i в значениях
48
- for (const key in strategy) {
49
- if (strategy[key].includes(i)) {
50
- col = key
51
- break
52
- }
53
- }
54
- }
55
-
56
- result.push(
57
- constructHeadItem(
58
- col,
59
- item[0],
60
- item[3],
61
- false,
62
- item[2],
63
- undefined,
64
- item[3]
65
- )
66
- )
67
- })
68
- return result
69
- }
70
-
71
- export const exportItemsFunc = (
72
- localization: UI_I_Localization,
73
- rows: number,
74
- selectedRows: number,
75
- testId: string
76
- ): UI_I_DropdownButtonItem[] => {
77
- return [
78
- {
79
- text: localization.common.allRowsCount.replace('{0}', '' + rows),
80
- type: '0',
81
- disabled: false,
82
- testId: `${testId}-export-all`,
83
- },
84
- {
85
- text: localization.common.selectedRowsCount.replace(
86
- '{0}',
87
- '' + selectedRows
88
- ),
89
- type: '1',
90
- disabled: false,
91
- testId: `${testId}-export-selected`,
92
- },
93
- ]
94
- }
1
+ import type { UI_ColumnSettingsStrategy } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
2
+ import type {
3
+ UI_I_ColumnKey,
4
+ UI_I_HeadItem,
5
+ } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
6
+ import type { UI_I_DropdownButtonItem } from '~/components/common/select/button/lib/models/interfaces'
7
+ import type { UI_I_Localization } from '~/lib/models/interfaces'
8
+ import {
9
+ constructColumnKey,
10
+ constructHeadItem,
11
+ } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
12
+
13
+ export const defaultColumnKeys = (
14
+ items: [string, boolean, string, string][],
15
+ strategy?: UI_ColumnSettingsStrategy
16
+ ): UI_I_ColumnKey[] => {
17
+ const result: UI_I_ColumnKey[] = []
18
+ items.forEach((item, i) => {
19
+ let col: string = `col${i}` // Стандартное значение по умолчанию
20
+
21
+ if (strategy) {
22
+ // Проходим по ключам объекта и ищем соответствие индекса i в значениях
23
+ for (const key in strategy) {
24
+ if (strategy[key].includes(i)) {
25
+ col = key
26
+ break
27
+ }
28
+ }
29
+ }
30
+
31
+ result.push(
32
+ constructColumnKey(col, item[0], item[1], `show-column-${item[3]}`)
33
+ )
34
+ })
35
+ return result
36
+ }
37
+
38
+ export const defaultHeadItems = (
39
+ items: [string, boolean, string, string][],
40
+ strategy?: UI_ColumnSettingsStrategy
41
+ ): UI_I_HeadItem[] => {
42
+ const result: UI_I_HeadItem[] = []
43
+ items.forEach((item, i) => {
44
+ let col: string = `col${i}` // Стандартное значение по умолчанию
45
+
46
+ if (strategy) {
47
+ // Проходим по ключам объекта и ищем соответствие индекса i в значениях
48
+ for (const key in strategy) {
49
+ if (strategy[key].includes(i)) {
50
+ col = key
51
+ break
52
+ }
53
+ }
54
+ }
55
+
56
+ result.push(
57
+ constructHeadItem(
58
+ col,
59
+ item[0],
60
+ item[3],
61
+ false,
62
+ item[2],
63
+ undefined,
64
+ item[3]
65
+ )
66
+ )
67
+ })
68
+ return result
69
+ }
70
+
71
+ export const exportItemsFunc = (
72
+ localization: UI_I_Localization,
73
+ rows: number,
74
+ selectedRows: number,
75
+ testId: string
76
+ ): UI_I_DropdownButtonItem[] => {
77
+ return [
78
+ {
79
+ text: localization.common.allRowsCount.replace('{0}', '' + rows),
80
+ type: '0',
81
+ disabled: false,
82
+ testId: `${testId}-export-all`,
83
+ },
84
+ {
85
+ text: localization.common.selectedRowsCount.replace(
86
+ '{0}',
87
+ '' + selectedRows
88
+ ),
89
+ type: '1',
90
+ disabled: false,
91
+ testId: `${testId}-export-selected`,
92
+ },
93
+ ]
94
+ }
@@ -1,16 +1,16 @@
1
- export const generateCsvAndDownload = (rows: HTMLElement[]): void => {
2
- const content: string[] = []
3
- rows.forEach((row: HTMLElement) => {
4
- content.push(row.innerText.replaceAll(';', ',').replaceAll('\n', ';'))
5
- })
6
-
7
- const csvContent = 'data:text/csv;charset=utf-8,' + content.join('\n')
8
-
9
- const encodedUri = encodeURI(csvContent)
10
- const link = document.createElement('a')
11
- link.setAttribute('href', encodedUri)
12
- link.setAttribute('download', 'my_data.csv')
13
- document.body.appendChild(link)
14
-
15
- link.click()
16
- }
1
+ export const generateCsvAndDownload = (rows: HTMLElement[]): void => {
2
+ const content: string[] = []
3
+ rows.forEach((row: HTMLElement) => {
4
+ content.push(row.innerText.replaceAll(';', ',').replaceAll('\n', ';'))
5
+ })
6
+
7
+ const csvContent = 'data:text/csv;charset=utf-8,' + content.join('\n')
8
+
9
+ const encodedUri = encodeURI(csvContent)
10
+ const link = document.createElement('a')
11
+ link.setAttribute('href', encodedUri)
12
+ link.setAttribute('download', 'my_data.csv')
13
+ document.body.appendChild(link)
14
+
15
+ link.click()
16
+ }
@@ -1,105 +1,105 @@
1
- <template>
2
- <nav class="sidenav vertical-groups-sidenav">
3
- <ul class="sidenav-content">
4
- <li
5
- v-for="(item, key) in props.items"
6
- :id="`${props.testId}-item-${key}`"
7
- :data-id="item.testId"
8
- :key="item.value"
9
- :class="[
10
- 'vertical-nav-link group-nav-link',
11
- { active: item.value === props.modelValue },
12
- { disabled: item.disabled },
13
- ]"
14
- :title="item.title || item.text"
15
- @click="selectItem(item)"
16
- >
17
- {{ item.text }}
18
- </li>
19
- </ul>
20
- </nav>
21
- </template>
22
- <script setup lang="ts">
23
- import type { UI_I_VerticalTabs } from '~/components/atoms/tabs/lib/models/interfaces'
24
-
25
- const props = withDefaults(
26
- defineProps<{
27
- modelValue: string | number
28
- items: UI_I_VerticalTabs[]
29
- hasErrorMessages?: number | boolean
30
- testId?: string
31
- }>(),
32
- { testId: 'ui-vertical-tabs' }
33
- )
34
-
35
- const emits = defineEmits<{
36
- (event: 'update:model-value', value: string): void
37
- (event: 'set-alert'): void
38
- }>()
39
-
40
- const selectItem = ({
41
- value,
42
- disabled,
43
- }: {
44
- value: string
45
- disabled: boolean
46
- }): void => {
47
- if (disabled) return
48
- if (
49
- props.hasErrorMessages === undefined ||
50
- props.hasErrorMessages === 0 ||
51
- props.hasErrorMessages === false
52
- ) {
53
- emits('update:model-value', value)
54
- return
55
- }
56
- emits('set-alert')
57
- }
58
- </script>
59
-
60
- <style>
61
- :root {
62
- --vertical-tabs-nav-link: --grey-100;
63
- --vertical-tabs-bg-color: #fafafa;
64
- }
65
- :root.dark-theme {
66
- --vertical-tabs-nav-link: #ffffff;
67
- --vertical-tabs-bg-color: transparent;
68
- }
69
- </style>
70
- <style lang="scss" scoped>
71
- .vertical-groups-sidenav {
72
- min-height: 94%;
73
- background-color: var(--vertical-tabs-bg-color);
74
-
75
- .vertical-nav-link {
76
- display: inline-block;
77
- width: 100%;
78
- margin-top: 5px;
79
- padding-left: 12px;
80
- color: var(--vertical-tabs-nav-link);
81
- border-bottom: 1px solid transparent;
82
- text-decoration: none;
83
- font-size: 14px;
84
- cursor: pointer;
85
- border-radius: 2.5px 0 0 2.5px;
86
-
87
- &.active {
88
- color: var(--vertical-nav-active-item-color);
89
- background: var(--vertical-nav-active-bg-color);
90
- border-bottom: 1px solid transparent;
91
- }
92
-
93
- &.disabled {
94
- cursor: not-allowed;
95
- opacity: 0.6;
96
- }
97
-
98
- &:hover:not(.active) {
99
- background: var(--vertical-nav-hover-bg-color);
100
- color: var(--blue-950);
101
- border-bottom: 1px solid #666;
102
- }
103
- }
104
- }
105
- </style>
1
+ <template>
2
+ <nav class="sidenav vertical-groups-sidenav">
3
+ <ul class="sidenav-content">
4
+ <li
5
+ v-for="(item, key) in props.items"
6
+ :id="`${props.testId}-item-${key}`"
7
+ :data-id="item.testId"
8
+ :key="item.value"
9
+ :class="[
10
+ 'vertical-nav-link group-nav-link',
11
+ { active: item.value === props.modelValue },
12
+ { disabled: item.disabled },
13
+ ]"
14
+ :title="item.title || item.text"
15
+ @click="selectItem(item)"
16
+ >
17
+ {{ item.text }}
18
+ </li>
19
+ </ul>
20
+ </nav>
21
+ </template>
22
+ <script setup lang="ts">
23
+ import type { UI_I_VerticalTabs } from '~/components/atoms/tabs/lib/models/interfaces'
24
+
25
+ const props = withDefaults(
26
+ defineProps<{
27
+ modelValue: string | number
28
+ items: UI_I_VerticalTabs[]
29
+ hasErrorMessages?: number | boolean
30
+ testId?: string
31
+ }>(),
32
+ { testId: 'ui-vertical-tabs' }
33
+ )
34
+
35
+ const emits = defineEmits<{
36
+ (event: 'update:model-value', value: string): void
37
+ (event: 'set-alert'): void
38
+ }>()
39
+
40
+ const selectItem = ({
41
+ value,
42
+ disabled,
43
+ }: {
44
+ value: string
45
+ disabled: boolean
46
+ }): void => {
47
+ if (disabled) return
48
+ if (
49
+ props.hasErrorMessages === undefined ||
50
+ props.hasErrorMessages === 0 ||
51
+ props.hasErrorMessages === false
52
+ ) {
53
+ emits('update:model-value', value)
54
+ return
55
+ }
56
+ emits('set-alert')
57
+ }
58
+ </script>
59
+
60
+ <style>
61
+ :root {
62
+ --vertical-tabs-nav-link: --grey-100;
63
+ --vertical-tabs-bg-color: #fafafa;
64
+ }
65
+ :root.dark-theme {
66
+ --vertical-tabs-nav-link: #ffffff;
67
+ --vertical-tabs-bg-color: transparent;
68
+ }
69
+ </style>
70
+ <style lang="scss" scoped>
71
+ .vertical-groups-sidenav {
72
+ min-height: 94%;
73
+ background-color: var(--vertical-tabs-bg-color);
74
+
75
+ .vertical-nav-link {
76
+ display: inline-block;
77
+ width: 100%;
78
+ margin-top: 5px;
79
+ padding-left: 12px;
80
+ color: var(--vertical-tabs-nav-link);
81
+ border-bottom: 1px solid transparent;
82
+ text-decoration: none;
83
+ font-size: 14px;
84
+ cursor: pointer;
85
+ border-radius: 2.5px 0 0 2.5px;
86
+
87
+ &.active {
88
+ color: var(--vertical-nav-active-item-color);
89
+ background: var(--vertical-nav-active-bg-color);
90
+ border-bottom: 1px solid transparent;
91
+ }
92
+
93
+ &.disabled {
94
+ cursor: not-allowed;
95
+ opacity: 0.6;
96
+ }
97
+
98
+ &:hover:not(.active) {
99
+ background: var(--vertical-nav-hover-bg-color);
100
+ color: var(--blue-950);
101
+ border-bottom: 1px solid #666;
102
+ }
103
+ }
104
+ }
105
+ </style>