bfg-common 1.5.366 → 1.5.368

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 (165) 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/localization/local_be.json +43 -1
  7. package/assets/localization/local_en.json +43 -1
  8. package/assets/localization/local_hy.json +43 -1
  9. package/assets/localization/local_kk.json +43 -1
  10. package/assets/localization/local_ru.json +43 -1
  11. package/assets/localization/local_zh.json +43 -1
  12. package/components/atoms/TheIcon3.vue +50 -50
  13. package/components/atoms/collapse/CollapseNav.vue +170 -170
  14. package/components/atoms/collapse/CollapseNavItem.vue +226 -226
  15. package/components/atoms/nav/NavBar.vue +147 -147
  16. package/components/atoms/perPage/PerPage.vue +58 -58
  17. package/components/atoms/table/dataGrid/DataGrid.vue +1717 -1717
  18. package/components/atoms/table/dataGrid/lib/config/settingsTable.ts +94 -94
  19. package/components/atoms/table/dataGrid/lib/utils/export.ts +16 -16
  20. package/components/atoms/tabs/VerticalTabs.vue +105 -105
  21. package/components/common/backup/storage/actions/add/lib/config/steps.ts +168 -168
  22. package/components/common/backup/storage/actions/add/steps/hostAccessibility/HostAccessibility.vue +52 -52
  23. package/components/common/backup/storage/actions/add/steps/readyComplete/ReadyComplete.vue +45 -45
  24. package/components/common/backup/storage/actions/delete/Delete.vue +65 -65
  25. package/components/common/browse/blocks/contents/filesNew/Skeleton.vue +18 -18
  26. package/components/common/browse/blocks/lib/models/types.ts +1 -1
  27. package/components/common/browse/lib/models/interfaces.ts +5 -5
  28. package/components/common/context/lib/models/interfaces.ts +33 -33
  29. package/components/common/diagramMain/adapter/AdapterItems.vue +61 -61
  30. package/components/common/diagramMain/lib/config/initial.ts +50 -50
  31. package/components/common/diagramMain/lib/models/types.ts +21 -21
  32. package/components/common/diagramMain/lib/utils/utils.ts +331 -331
  33. package/components/common/diagramMain/modals/editSettings/ConfirmTeamingSettingsModal.vue +40 -40
  34. package/components/common/diagramMain/modals/editSettings/tabs/NetworkProperties.vue +214 -214
  35. package/components/common/diagramMain/modals/editSettings/tabs/Security.vue +189 -189
  36. package/components/common/diagramMain/modals/editSettings/tabs/SwitchProperties.vue +163 -163
  37. package/components/common/diagramMain/modals/editSettings/tabs/TeamingFailover.vue +175 -175
  38. package/components/common/diagramMain/modals/editSettings/tabs/port/IpvFourSettings.vue +346 -346
  39. package/components/common/diagramMain/modals/lib/config/initial.ts +180 -180
  40. package/components/common/diagramMain/modals/lib/config/networkModal.ts +398 -398
  41. package/components/common/diagramMain/modals/lib/config/vmKernelAdapter.ts +90 -90
  42. package/components/common/diagramMain/modals/lib/mappers/mappers.ts +87 -87
  43. package/components/common/diagramMain/modals/lib/utils/index.ts +24 -24
  44. package/components/common/diagramMain/modals/migrateVmkernelAdapter/lib/config/steps.ts +114 -114
  45. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/ConnectionSettings.vue +169 -169
  46. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/SelectVmkernelAdapter.vue +159 -159
  47. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/common.ts +14 -14
  48. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/connectionSettings.ts +137 -137
  49. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/selectVmkernelAdapter.ts +52 -52
  50. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/validations.ts +19 -19
  51. package/components/common/diagramMain/network/Network.vue +141 -141
  52. package/components/common/diagramMain/port/Ports.vue +47 -47
  53. package/components/common/layout/theHeader/helpMenu/About.vue +82 -82
  54. package/components/common/layout/theHeader/userMenu/modals/preferences/view/ViewOld.vue +112 -112
  55. package/components/common/monitor/overview/OverviewOld.vue +139 -139
  56. package/components/common/pages/home/headline/Headline.vue +45 -45
  57. package/components/common/pages/home/headline/HeadlineOld.vue +42 -42
  58. package/components/common/pages/home/lib/models/interfaces.ts +48 -48
  59. package/components/common/pages/home/widgets/Widgets.vue +49 -49
  60. package/components/common/pages/home/widgets/WidgetsNew.vue +88 -88
  61. package/components/common/pages/home/widgets/WidgetsOld.vue +36 -36
  62. package/components/common/pages/home/widgets/hosts/Hosts.vue +27 -27
  63. package/components/common/pages/home/widgets/hosts/lib/config/items.ts +23 -23
  64. package/components/common/pages/home/widgets/vms/Vms.vue +26 -26
  65. package/components/common/pages/home/widgets/vms/VmsOld.vue +35 -35
  66. package/components/common/pages/home/widgets/vms/lib/config/items.ts +19 -19
  67. package/components/common/pages/packages/Packages.vue +208 -208
  68. package/components/common/pages/shortcuts/block/BlockOld.vue +68 -68
  69. package/components/common/readyToComplete/New.vue +129 -81
  70. package/components/common/readyToComplete/ReadyToComplete.vue +17 -17
  71. package/components/common/recursionTree/RecursionTree.vue +223 -223
  72. package/components/common/select/button/ButtonDropdown.vue +112 -112
  73. package/components/common/spiceConsole/Drawer.vue +377 -377
  74. package/components/common/spiceConsole/SpiceConsole.vue +127 -127
  75. package/components/common/spiceConsole/lib/models/interfaces.ts +5 -5
  76. package/components/common/tools/Actions.vue +207 -207
  77. package/components/common/vm/actions/add/Old.vue +388 -388
  78. package/components/common/vm/actions/add/folderTreeView/FolderTreeView.vue +72 -72
  79. package/components/common/vm/actions/add/folderTreeView/New.vue +40 -40
  80. package/components/common/vm/actions/add/folderTreeView/Old.vue +50 -50
  81. package/components/common/vm/actions/clone/Clone.vue +823 -823
  82. package/components/common/vm/actions/clone/lib/config/steps.ts +291 -291
  83. package/components/common/vm/actions/clone/toTemplate/lib/config/steps.ts +116 -116
  84. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareOld.vue +321 -321
  85. package/components/common/vm/actions/common/customizeHardware/virtualHardware/browseView/BrowseView.vue +227 -227
  86. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/Bus.vue +100 -100
  87. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDrive.vue +232 -232
  88. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveOld.vue +168 -168
  89. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/Media.vue +25 -25
  90. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaNew.vue +78 -78
  91. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaOld.vue +50 -50
  92. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/Shares.vue +140 -140
  93. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/lib/config/options.ts +28 -28
  94. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/tooltip/TooltipNew.vue +154 -154
  95. package/components/common/vm/actions/common/customizeHardware/virtualHardware/lib/config/dropdownItems.ts +155 -155
  96. package/components/common/vm/actions/common/customizeHardware/virtualHardware/limit/Limit.vue +220 -220
  97. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/Memory.vue +307 -307
  98. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDisk.vue +385 -385
  99. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/Location.vue +154 -154
  100. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/LocationOld.vue +85 -85
  101. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetwork.vue +288 -288
  102. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/table/lib/config/config.ts +94 -94
  103. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddress.vue +119 -119
  104. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +205 -205
  105. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoNew.vue +66 -66
  106. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoOld.vue +62 -62
  107. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue +31 -31
  108. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIoOld.vue +76 -76
  109. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/Note.vue +15 -15
  110. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteNew.vue +42 -42
  111. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteOld.vue +30 -30
  112. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGridOld.vue +84 -84
  113. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/Other.vue +16 -16
  114. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCard.vue +154 -154
  115. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/numberDisplays/NumberDisplays.vue +53 -53
  116. package/components/common/vm/actions/common/customizeHardware/vmoptions/Vmoptions.vue +155 -155
  117. package/components/common/vm/actions/common/customizeHardware/vmoptions/VmoptionsNew.vue +130 -130
  118. package/components/common/vm/actions/common/customizeHardware/vmoptions/VmoptionsOld.vue +113 -113
  119. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/delay/Delay.vue +32 -32
  120. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/firmware/Firmware.vue +60 -60
  121. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/Order.vue +174 -174
  122. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptions.vue +95 -95
  123. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptionsOld.vue +155 -155
  124. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/Keymap.vue +32 -32
  125. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/KeymapOld.vue +44 -44
  126. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/Password.vue +103 -103
  127. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirection.vue +28 -28
  128. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionOld.vue +44 -44
  129. package/components/common/vm/actions/common/select/compatibility/Old.vue +107 -107
  130. package/components/common/vm/actions/common/select/computeResource/ComputeResource.vue +143 -143
  131. package/components/common/vm/actions/common/select/computeResource/New.vue +184 -184
  132. package/components/common/vm/actions/common/select/computeResource/treeView/TreeView.vue +131 -131
  133. package/components/common/vm/actions/common/select/createType/CreateType.vue +38 -38
  134. package/components/common/vm/actions/common/select/createType/lib/config/items.ts +48 -48
  135. package/components/common/vm/actions/common/select/createType/lib/models/interfaces.ts +5 -5
  136. package/components/common/vm/actions/common/select/name/Name.vue +174 -174
  137. package/components/common/vm/actions/common/select/os/Old.vue +152 -152
  138. package/components/common/vm/actions/common/select/os/Os.vue +139 -139
  139. package/components/common/vm/actions/common/select/storage/Storage.vue +155 -155
  140. package/components/common/vm/actions/common/select/storage/new/New.vue +300 -300
  141. package/components/common/vm/actions/common/select/storage/new/lib/models/interfaces.ts +5 -5
  142. package/components/common/vm/actions/common/select/storage/new/lib/utils/utils.ts +21 -21
  143. package/components/common/vm/actions/editSettings/EditSettings.vue +242 -242
  144. package/components/common/vm/actions/editSettings/new/Skeleton.vue +88 -88
  145. package/components/common/vmt/actions/add/lib/models/interfaces.ts +23 -23
  146. package/components/common/wizards/network/add/steps/SelectConnectionType.vue +104 -104
  147. package/components/common/wizards/network/add/steps/SelectedTargetDevice.vue +467 -467
  148. package/components/common/wizards/vm/migrate/Migrate.vue +349 -349
  149. package/components/common/wizards/vm/migrate/lib/config/constructDataReady.ts +220 -220
  150. package/components/common/wizards/vm/migrate/lib/config/steps.ts +157 -157
  151. package/components/common/wizards/vm/migrate/lib/validations.ts +68 -68
  152. package/components/common/wizards/vm/migrate/select/network/Network.vue +103 -103
  153. package/components/common/wizards/vm/migrate/select/network/table/network/lib/config/advancedTable.ts +91 -91
  154. package/components/common/wizards/vm/migrate/select/type/lib/config/typeOptions.ts +45 -45
  155. package/composables/productNameLocal.ts +30 -30
  156. package/composables/useAppVersion.ts +21 -21
  157. package/package.json +1 -1
  158. package/plugins/date.ts +233 -233
  159. package/plugins/panelStates.ts +70 -70
  160. package/plugins/text.ts +59 -59
  161. package/public/spice-console/lib/images/bitmap.js +203 -203
  162. package/public/spice-console/network/spicechannel.js +387 -387
  163. package/store/main/mutations.ts +7 -7
  164. package/store/main/state.ts +7 -7
  165. 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>