bfg-common 1.5.239 → 1.5.240

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 (151) hide show
  1. package/CODE_STYLE.md +109 -109
  2. package/assets/scss/common/theme.scss +6 -0
  3. package/components/atoms/TheIcon3.vue +50 -50
  4. package/components/atoms/perPage/PerPage.vue +58 -58
  5. package/components/atoms/stack/StackBlock.vue +185 -185
  6. package/components/atoms/table/dataGrid/DataGrid.vue +1717 -1717
  7. package/components/atoms/table/dataGrid/lib/config/settingsTable.ts +94 -94
  8. package/components/atoms/table/dataGrid/lib/utils/export.ts +16 -16
  9. package/components/atoms/table/info/lib/models/interfaces.ts +10 -10
  10. package/components/atoms/tabs/VerticalTabs.vue +105 -105
  11. package/components/common/backup/storage/actions/add/Add.vue +247 -247
  12. package/components/common/backup/storage/actions/add/New.vue +281 -281
  13. package/components/common/backup/storage/actions/add/Old.vue +114 -114
  14. package/components/common/backup/storage/actions/add/lib/config/steps.ts +168 -168
  15. package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigure.vue +41 -41
  16. package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureNew.vue +294 -294
  17. package/components/common/backup/storage/actions/add/steps/readyComplete/ReadyComplete.vue +45 -45
  18. package/components/common/backup/storage/actions/add/steps/readyComplete/lib/config/propertiesDetails.ts +242 -242
  19. package/components/common/backup/storage/actions/delete/Delete.vue +65 -65
  20. package/components/common/browse/BrowseNew.vue +8 -2
  21. package/components/common/browse/blocks/contents/filesNew/Skeleton.vue +18 -18
  22. package/components/common/context/lib/models/interfaces.ts +31 -31
  23. package/components/common/diagramMain/DiagramMain.vue +897 -897
  24. package/components/common/diagramMain/Header.vue +214 -214
  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 +86 -86
  33. package/components/common/pages/home/widgets/WidgetsOld.vue +34 -34
  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 +108 -108
  44. package/components/common/spiceConsole/Drawer.vue +377 -377
  45. package/components/common/spiceConsole/lib/models/interfaces.ts +5 -5
  46. package/components/common/vm/actions/add/folderTreeView/FolderTreeView.vue +72 -72
  47. package/components/common/vm/actions/add/folderTreeView/New.vue +40 -40
  48. package/components/common/vm/actions/add/folderTreeView/Old.vue +50 -50
  49. package/components/common/vm/actions/clone/lib/config/steps.ts +291 -291
  50. package/components/common/vm/actions/clone/toTemplate/lib/config/steps.ts +116 -116
  51. package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareNew.vue +5 -2
  52. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareNew.vue +7 -7
  53. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareOld.vue +319 -319
  54. package/components/common/vm/actions/common/customizeHardware/virtualHardware/browseView/BrowseView.vue +219 -219
  55. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/Bus.vue +100 -100
  56. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/BusNew.vue +2 -2
  57. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDrive.vue +232 -232
  58. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveNew.vue +4 -0
  59. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveOld.vue +168 -168
  60. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/Media.vue +25 -25
  61. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaNew.vue +78 -78
  62. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaOld.vue +50 -50
  63. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/CpuNew.vue +194 -190
  64. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/model/ModelNew.vue +246 -237
  65. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/Shares.vue +140 -140
  66. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/SharesNew.vue +6 -1
  67. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/lib/config/options.ts +28 -28
  68. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/tooltip/TooltipNew.vue +154 -154
  69. package/components/common/vm/actions/common/customizeHardware/virtualHardware/limit/Limit.vue +220 -220
  70. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/Memory.vue +307 -307
  71. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/MemoryNew.vue +158 -154
  72. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/hotPlug/HotPlugNew.vue +8 -2
  73. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDisk.vue +382 -382
  74. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDiskNew.vue +4 -0
  75. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/file/FileNew.vue +8 -3
  76. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/Location.vue +151 -151
  77. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/LocationNew.vue +73 -73
  78. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/LocationOld.vue +83 -83
  79. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/location/StorageModalNew.vue +1 -0
  80. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/maximumSize/MaximumSizeNew.vue +8 -4
  81. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/provisioning/ProvisioningNew.vue +6 -1
  82. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/sharing/SharingNew.vue +6 -1
  83. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetwork.vue +288 -288
  84. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetworkNew.vue +1 -1
  85. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/New.vue +4 -3
  86. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/table/Table.vue +1 -0
  87. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/table/lib/config/config.ts +94 -94
  88. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddress.vue +119 -119
  89. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +205 -205
  90. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoNew.vue +66 -66
  91. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoOld.vue +62 -62
  92. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue +31 -31
  93. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIoOld.vue +76 -76
  94. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/Note.vue +15 -15
  95. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteNew.vue +42 -42
  96. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteOld.vue +30 -30
  97. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGridOld.vue +84 -84
  98. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newUsbController/NewUsbControllerNew.vue +1 -0
  99. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/Other.vue +16 -16
  100. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/OtherNew.vue +36 -30
  101. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/inputDevices/InputDevicesNew.vue +40 -40
  102. package/components/common/vm/actions/common/customizeHardware/virtualHardware/reservation/ReservationNew.vue +5 -2
  103. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCardNew.vue +5 -2
  104. package/components/common/vm/actions/common/customizeHardware/vmoptions/Vmoptions.vue +145 -145
  105. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/BootOptionsNew.vue +85 -81
  106. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/delay/Delay.vue +32 -32
  107. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/firmware/Firmware.vue +60 -60
  108. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/Order.vue +174 -174
  109. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/OrderNew.vue +71 -67
  110. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptionsNew.vue +150 -149
  111. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/New.vue +146 -140
  112. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/copyPaste/CopyPasteNew.vue +31 -31
  113. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/fileTransfer/FileTransferNew.vue +31 -31
  114. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/Keymap.vue +32 -32
  115. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/Password.vue +103 -103
  116. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/PasswordNew.vue +128 -128
  117. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirection.vue +28 -28
  118. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionNew.vue +39 -39
  119. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionOld.vue +44 -44
  120. package/components/common/vm/actions/common/customizeHardware/vmoptions/tools/ToolsNew.vue +5 -1
  121. package/components/common/vm/actions/common/lib/utils/capabilities.ts +52 -52
  122. package/components/common/vm/actions/common/select/compatibility/Old.vue +107 -107
  123. package/components/common/vm/actions/common/select/computeResource/treeView/New.vue +44 -44
  124. package/components/common/vm/actions/common/select/computeResource/treeView/TreeView.vue +118 -118
  125. package/components/common/vm/actions/common/select/createType/CreateType.vue +38 -38
  126. package/components/common/vm/actions/common/select/createType/lib/models/interfaces.ts +5 -5
  127. package/components/common/vm/actions/common/select/os/Old.vue +152 -152
  128. package/components/common/vm/actions/common/select/os/Os.vue +139 -139
  129. package/components/common/vm/actions/common/select/storage/Storage.vue +2 -0
  130. package/components/common/vm/actions/common/select/storage/new/New.vue +6 -1
  131. package/components/common/vm/actions/common/select/storage/new/lib/config/table.ts +2 -1
  132. package/components/common/vm/actions/common/select/storage/new/lib/models/interfaces.ts +5 -5
  133. package/components/common/vm/actions/common/select/storage/new/lib/utils/utils.ts +21 -21
  134. package/components/common/vm/actions/editSettings/new/Skeleton.vue +88 -88
  135. package/components/common/wizards/vm/migrate/lib/config/constructDataReady.ts +220 -220
  136. package/components/common/wizards/vm/migrate/lib/config/steps.ts +157 -157
  137. package/components/common/wizards/vm/migrate/lib/validations.ts +68 -68
  138. package/components/common/wizards/vm/migrate/select/computeResource/tableView/TableView.vue +135 -135
  139. package/components/common/wizards/vm/migrate/select/network/Network.vue +103 -103
  140. package/components/common/wizards/vm/migrate/select/network/table/network/lib/config/advancedTable.ts +91 -91
  141. package/composables/productNameLocal.ts +30 -30
  142. package/composables/useAppVersion.ts +21 -21
  143. package/package.json +2 -2
  144. package/plugins/date.ts +233 -233
  145. package/plugins/panelStates.ts +70 -70
  146. package/plugins/text.ts +59 -59
  147. package/public/spice-console/lib/images/bitmap.js +203 -203
  148. package/public/spice-console/network/spicechannel.js +387 -387
  149. package/store/main/mutations.ts +7 -7
  150. package/store/main/state.ts +7 -7
  151. 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,10 +1,10 @@
1
- export interface UI_I_TableInfoItem {
2
- label: string
3
- value: any
4
- isProperty?: boolean
5
- key?: string
6
- localization?: string
7
- localizationTemplate?: string
8
- isCapital?: boolean
9
- iconName?: string
10
- }
1
+ export interface UI_I_TableInfoItem {
2
+ label: string
3
+ value: any
4
+ isProperty?: boolean
5
+ key?: string
6
+ localization?: string
7
+ localizationTemplate?: string
8
+ isCapital?: boolean
9
+ iconName?: string
10
+ }
@@ -1,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>