bfg-common 1.5.260 → 1.5.262

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