bfg-common 1.5.23 → 1.5.24

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 (161) hide show
  1. package/CODE_STYLE.md +109 -109
  2. package/assets/scss/common/normalize.scss +339 -339
  3. package/components/atoms/TheIcon3.vue +50 -50
  4. package/components/atoms/collapse/CollapseNav.vue +165 -165
  5. package/components/atoms/dropdown/dropdown/Dropdown.vue +168 -168
  6. package/components/atoms/modal/bySteps/BySteps.vue +253 -253
  7. package/components/atoms/perPage/PerPage.vue +58 -58
  8. package/components/atoms/stack/StackBlock.vue +185 -185
  9. package/components/atoms/table/dataGrid/DataGridColumnSwitch.vue +222 -222
  10. package/components/atoms/table/dataGrid/lib/config/settingsTable.ts +94 -94
  11. package/components/atoms/table/dataGrid/lib/utils/export.ts +16 -16
  12. package/components/atoms/tabs/VerticalTabs.vue +105 -105
  13. package/components/common/accordion/Recursion.vue +222 -222
  14. package/components/common/browse/BrowseNew.vue +237 -237
  15. package/components/common/browse/BrowseOld.vue +217 -217
  16. package/components/common/browse/blocks/contents/Files.vue +37 -37
  17. package/components/common/browse/blocks/contents/FilesOld.vue +72 -72
  18. package/components/common/browse/blocks/contents/filesNew/FilesNew.vue +96 -96
  19. package/components/common/browse/blocks/contents/filesNew/Skeleton.vue +18 -18
  20. package/components/common/context/Context.vue +111 -111
  21. package/components/common/context/lib/models/interfaces.ts +31 -31
  22. package/components/common/context/recursion/Recursion.vue +87 -87
  23. package/components/common/context/recursion/RecursionNew.vue +238 -238
  24. package/components/common/context/recursion/RecursionOld.vue +228 -228
  25. package/components/common/details/DetailsItem.vue +109 -109
  26. package/components/common/diagramMain/DiagramMain.vue +897 -897
  27. package/components/common/diagramMain/Header.vue +214 -214
  28. package/components/common/graph/Graph.vue +104 -104
  29. package/components/common/layout/theHeader/helpMenu/About.vue +82 -82
  30. package/components/common/layout/theHeader/helpMenu/aboutNew/AboutNew.vue +103 -103
  31. package/components/common/layout/theHeader/userMenu/modals/preferences/view/ViewOld.vue +112 -112
  32. package/components/common/mainNavigationPanel/MainNavigationPanelNew.vue +336 -336
  33. package/components/common/mainNavigationPanel/MainNavigationPanelOld.vue +311 -311
  34. package/components/common/modals/unsavedChanges/UnsavedChanges.vue +56 -56
  35. package/components/common/monitor/advanced/tools/chartOptionsModal/counters/table/lib/config/utils.ts +1040 -1040
  36. package/components/common/monitor/overview/Overview.vue +1 -0
  37. package/components/common/monitor/overview/Overview.vue~ +132 -0
  38. package/components/common/monitor/overview/OverviewOld.vue +139 -139
  39. package/components/common/pages/home/StatusContent.vue +49 -49
  40. package/components/common/pages/home/headline/Headline.vue +45 -45
  41. package/components/common/pages/home/headline/HeadlineOld.vue +42 -42
  42. package/components/common/pages/home/lib/models/interfaces.ts +48 -48
  43. package/components/common/pages/home/widgets/Widgets.vue +49 -49
  44. package/components/common/pages/home/widgets/WidgetsNew.vue +86 -86
  45. package/components/common/pages/home/widgets/WidgetsOld.vue +34 -34
  46. package/components/common/pages/home/widgets/hosts/Hosts.vue +27 -27
  47. package/components/common/pages/home/widgets/hosts/lib/config/items.ts +23 -23
  48. package/components/common/pages/home/widgets/vms/Vms.vue +26 -26
  49. package/components/common/pages/home/widgets/vms/VmsOld.vue +35 -35
  50. package/components/common/pages/home/widgets/vms/lib/config/items.ts +19 -19
  51. package/components/common/pages/packages/Packages.vue +208 -208
  52. package/components/common/pages/shortcuts/block/BlockNew.vue +96 -96
  53. package/components/common/pages/shortcuts/block/BlockOld.vue +68 -68
  54. package/components/common/portlets/customAttributes/Portlet.vue +667 -667
  55. package/components/common/portlets/tag/Portlet.vue +433 -433
  56. package/components/common/recursionTree/RecursionTree.vue +223 -223
  57. package/components/common/select/button/ButtonDropdown.vue +108 -108
  58. package/components/common/spiceConsole/Drawer.vue +370 -370
  59. package/components/common/spiceConsole/lib/models/interfaces.ts +5 -5
  60. package/components/common/split/horizontal/HorizontalNew.vue +376 -376
  61. package/components/common/split/horizontal/HorizontalOld.vue +337 -337
  62. package/components/common/split/vertical/Vertical.vue +160 -160
  63. package/components/common/tools/Actions.vue +188 -188
  64. package/components/common/vm/actions/add/Add.vue +622 -622
  65. package/components/common/vm/actions/clone/Clone.vue +639 -639
  66. package/components/common/vm/actions/clone/lib/config/steps.ts +129 -129
  67. package/components/common/vm/actions/clone/toTemplate/ToTemplate.vue +634 -634
  68. package/components/common/vm/actions/clone/toTemplate/lib/config/steps.ts +116 -116
  69. package/components/common/vm/actions/common/customizeHardware/CustomizeHardware.vue +275 -275
  70. package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareNew.vue +274 -274
  71. package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareOld.vue +177 -177
  72. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardware.vue +698 -698
  73. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareNew.vue +410 -410
  74. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareOld.vue +319 -319
  75. package/components/common/vm/actions/common/customizeHardware/virtualHardware/browseView/BrowseView.vue +219 -219
  76. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/Bus.vue +99 -99
  77. package/components/common/vm/actions/common/customizeHardware/virtualHardware/bus/BusNew.vue +117 -117
  78. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDrive.vue +232 -232
  79. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveNew.vue +164 -164
  80. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveOld.vue +168 -168
  81. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/Media.vue +25 -25
  82. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaNew.vue +70 -70
  83. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/media/MediaOld.vue +50 -50
  84. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/Cpu.vue +338 -338
  85. package/components/common/vm/actions/common/customizeHardware/virtualHardware/limit/Limit.vue +220 -220
  86. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDisk.vue +368 -368
  87. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDiskNew.vue +232 -232
  88. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDiskOld.vue +250 -250
  89. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/mode/ModeOld.vue +56 -56
  90. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/sharing/SharingNew.vue +44 -44
  91. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetwork.vue +286 -286
  92. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetworkNew.vue +124 -124
  93. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/LocationOld.vue +134 -134
  94. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/New.vue +63 -63
  95. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/location/new/table/lib/config/config.ts +95 -95
  96. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddress.vue +119 -119
  97. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddressNew.vue +69 -69
  98. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/macAddress/MacAddressOld.vue +83 -83
  99. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +205 -205
  100. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoNew.vue +66 -66
  101. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIoOld.vue +62 -62
  102. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue +31 -31
  103. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIoNew.vue +84 -84
  104. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIoOld.vue +76 -76
  105. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/Note.vue +15 -15
  106. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteNew.vue +42 -42
  107. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/note/NoteOld.vue +30 -30
  108. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGrid.vue +41 -41
  109. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGridNew.vue +81 -81
  110. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGridOld.vue +84 -84
  111. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newUsbController/NewUsbControllerNew.vue +56 -56
  112. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/Other.vue +16 -16
  113. package/components/common/vm/actions/common/customizeHardware/virtualHardware/other/OtherNew.vue +30 -30
  114. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCardNew.vue +104 -104
  115. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCardOld.vue +112 -112
  116. package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/totalVideoMemory/TotalVideoMemoryNew.vue +54 -54
  117. package/components/common/vm/actions/common/customizeHardware/vmoptions/Vmoptions.vue +145 -145
  118. package/components/common/vm/actions/common/customizeHardware/vmoptions/VmoptionsNew.vue +102 -102
  119. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/BootOptionsNew.vue +75 -75
  120. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/delay/Delay.vue +26 -26
  121. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/firmware/Firmware.vue +57 -57
  122. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/firmware/FirmwareNew.vue +42 -42
  123. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/menu/MenuNew.vue +25 -25
  124. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/Order.vue +171 -171
  125. package/components/common/vm/actions/common/customizeHardware/vmoptions/bootOptions/order/OrderNew.vue +50 -50
  126. package/components/common/vm/actions/common/customizeHardware/vmoptions/generalOptions/GeneralOptionsNew.vue +141 -141
  127. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/New.vue +140 -140
  128. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/copyPaste/CopyPasteNew.vue +30 -30
  129. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/fileTransfer/FileTransferNew.vue +30 -30
  130. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/folderSharing/FolderSharingNew.vue +30 -30
  131. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/Keymap.vue +32 -32
  132. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/keymap/KeymapNew.vue +39 -39
  133. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/Password.vue +103 -103
  134. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/PasswordNew.vue +102 -102
  135. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/password/PasswordOld.vue +94 -94
  136. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirection.vue +28 -28
  137. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionNew.vue +38 -38
  138. package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/usbRedirection/UsbRedirectionOld.vue +44 -44
  139. package/components/common/vm/actions/common/select/storage/Storage.vue +130 -130
  140. package/components/common/vm/actions/common/select/storage/StorageOld.vue +129 -129
  141. package/components/common/vm/actions/editSettings/new/Skeleton.vue +88 -88
  142. package/components/common/wizards/datastore/add/lib/config/steps.ts +138 -138
  143. package/components/common/wizards/datastore/add/nfs/accessibility/Accessibility.vue +60 -60
  144. package/components/common/wizards/datastore/add/readyComplete/ReadyComplete.vue +92 -92
  145. package/components/common/wizards/network/add/steps/SelectConnectionType.vue +105 -105
  146. package/components/common/wizards/vm/migrate/Migrate.vue +302 -302
  147. package/components/common/wizards/vm/migrate/lib/config/constructDataReady.ts +220 -220
  148. package/components/common/wizards/vm/migrate/select/network/Network.vue +103 -103
  149. package/components/common/wizards/vm/migrate/select/network/table/network/Network.vue +150 -150
  150. package/components/common/wizards/vm/migrate/select/network/table/network/lib/config/advancedTable.ts +91 -91
  151. package/components/common/wizards/vm/migrate/select/priority/Priority.vue +43 -43
  152. package/composables/productNameLocal.ts +30 -30
  153. package/composables/useAppVersion.ts +21 -21
  154. package/package.json +1 -1
  155. package/plugins/date.ts +233 -233
  156. package/plugins/directives.ts +24 -24
  157. package/public/spice-console/lib/images/bitmap.js +203 -203
  158. package/public/spice-console/network/spicechannel.js +383 -383
  159. package/store/main/mutations.ts +7 -7
  160. package/store/main/state.ts +7 -7
  161. package/store/tasks/mappers/recentTasks.ts +64 -64
@@ -1,96 +1,96 @@
1
- <template>
2
- <common-browse-blocks-contents-files-new-skeleton v-if="props.browseLoading" />
3
-
4
- <ul
5
- v-else-if="props.selectedFolderFiles.length"
6
- class="file-view__container"
7
- >
8
- <template v-for="file in props.selectedFolderFiles" :key="file.name">
9
- <li
10
- :data-id="file.testId"
11
- :class="[
12
- 'file-view',
13
- { active: file.name === props.selectedFile?.name },
14
- ]"
15
- @click="onSelectFile(file)"
16
- >
17
- <span class="file-view__icon" :class="file.iconClassName"></span>
18
- <span class="file-view__text">{{ file.name }}</span>
19
- </li>
20
- </template>
21
- </ul>
22
-
23
- <div v-else class="not-found-wrap">
24
- <ui-not-found :text="localization.common.noItemsFound" />
25
- </div>
26
- </template>
27
-
28
- <script setup lang="ts">
29
- import type { UI_I_Localization } from '~/lib/models/interfaces'
30
-
31
- const props = defineProps<{
32
- selectedFolderFiles: any[]
33
- selectedFile: any
34
- browseLoading: boolean
35
- }>()
36
-
37
- const emits = defineEmits<{
38
- (event: 'select-file', file: any): void
39
- }>()
40
-
41
- const localization = computed<UI_I_Localization>(() => useLocal())
42
-
43
- const onSelectFile = (file: any): void => {
44
- emits('select-file', file)
45
- }
46
- </script>
47
-
48
- <style scoped lang="scss">
49
- .file-view__container {
50
- list-style-position: inside;
51
- list-style-type: none;
52
- padding: 0;
53
- margin: 0;
54
-
55
- .file-view {
56
- display: flex;
57
- align-items: center;
58
- padding: 4px 8px;
59
- cursor: pointer;
60
- border-radius: 4px;
61
- height: 26px;
62
- margin-bottom: 2px;
63
- color: var(--select-file-text-color);
64
-
65
- &:hover {
66
- background-color: var(--select-file-hover-bg);
67
- }
68
- &.active {
69
- background-color: var(--select-file-selected-bg);
70
- color: var(--select-file-selected-text-color);
71
- }
72
- span {
73
- font-size: 12px;
74
- font-weight: 400;
75
- line-height: 14.52px;
76
-
77
- overflow: hidden;
78
- white-space: nowrap;
79
- text-overflow: ellipsis;
80
- }
81
- span:first-of-type {
82
- width: 16px;
83
- height: 16px;
84
- margin-right: 8px;
85
- }
86
- }
87
- }
88
- .not-found-wrap {
89
- display: flex;
90
- align-items: center;
91
- justify-content: center;
92
- flex-direction: column;
93
- height: 100%;
94
- width: 100%;
95
- }
96
- </style>
1
+ <template>
2
+ <common-browse-blocks-contents-files-new-skeleton v-if="props.browseLoading" />
3
+
4
+ <ul
5
+ v-else-if="props.selectedFolderFiles.length"
6
+ class="file-view__container"
7
+ >
8
+ <template v-for="file in props.selectedFolderFiles" :key="file.name">
9
+ <li
10
+ :data-id="file.testId"
11
+ :class="[
12
+ 'file-view',
13
+ { active: file.name === props.selectedFile?.name },
14
+ ]"
15
+ @click="onSelectFile(file)"
16
+ >
17
+ <span class="file-view__icon" :class="file.iconClassName"></span>
18
+ <span class="file-view__text">{{ file.name }}</span>
19
+ </li>
20
+ </template>
21
+ </ul>
22
+
23
+ <div v-else class="not-found-wrap">
24
+ <ui-not-found :text="localization.common.noItemsFound" />
25
+ </div>
26
+ </template>
27
+
28
+ <script setup lang="ts">
29
+ import type { UI_I_Localization } from '~/lib/models/interfaces'
30
+
31
+ const props = defineProps<{
32
+ selectedFolderFiles: any[]
33
+ selectedFile: any
34
+ browseLoading: boolean
35
+ }>()
36
+
37
+ const emits = defineEmits<{
38
+ (event: 'select-file', file: any): void
39
+ }>()
40
+
41
+ const localization = computed<UI_I_Localization>(() => useLocal())
42
+
43
+ const onSelectFile = (file: any): void => {
44
+ emits('select-file', file)
45
+ }
46
+ </script>
47
+
48
+ <style scoped lang="scss">
49
+ .file-view__container {
50
+ list-style-position: inside;
51
+ list-style-type: none;
52
+ padding: 0;
53
+ margin: 0;
54
+
55
+ .file-view {
56
+ display: flex;
57
+ align-items: center;
58
+ padding: 4px 8px;
59
+ cursor: pointer;
60
+ border-radius: 4px;
61
+ height: 26px;
62
+ margin-bottom: 2px;
63
+ color: var(--select-file-text-color);
64
+
65
+ &:hover {
66
+ background-color: var(--select-file-hover-bg);
67
+ }
68
+ &.active {
69
+ background-color: var(--select-file-selected-bg);
70
+ color: var(--select-file-selected-text-color);
71
+ }
72
+ span {
73
+ font-size: 12px;
74
+ font-weight: 400;
75
+ line-height: 14.52px;
76
+
77
+ overflow: hidden;
78
+ white-space: nowrap;
79
+ text-overflow: ellipsis;
80
+ }
81
+ span:first-of-type {
82
+ width: 16px;
83
+ height: 16px;
84
+ margin-right: 8px;
85
+ }
86
+ }
87
+ }
88
+ .not-found-wrap {
89
+ display: flex;
90
+ align-items: center;
91
+ justify-content: center;
92
+ flex-direction: column;
93
+ height: 100%;
94
+ width: 100%;
95
+ }
96
+ </style>
@@ -1,18 +1,18 @@
1
- <template>
2
- <div class="skeleton-wrap">
3
- <ui-skeleton-item height="18px" />
4
- <ui-skeleton-item height="18px" />
5
- <ui-skeleton-item height="18px" />
6
- <ui-skeleton-item height="18px" />
7
- <ui-skeleton-item height="18px" />
8
- </div>
9
- </template>
10
-
11
- <script setup lang="ts"></script>
12
-
13
- <style scoped lang="scss">
14
- .skeleton-wrap {
15
- display: grid;
16
- grid-gap: 12px;
17
- }
18
- </style>
1
+ <template>
2
+ <div class="skeleton-wrap">
3
+ <ui-skeleton-item height="18px" />
4
+ <ui-skeleton-item height="18px" />
5
+ <ui-skeleton-item height="18px" />
6
+ <ui-skeleton-item height="18px" />
7
+ <ui-skeleton-item height="18px" />
8
+ </div>
9
+ </template>
10
+
11
+ <script setup lang="ts"></script>
12
+
13
+ <style scoped lang="scss">
14
+ .skeleton-wrap {
15
+ display: grid;
16
+ grid-gap: 12px;
17
+ }
18
+ </style>
@@ -1,111 +1,111 @@
1
- <template>
2
- <div
3
- :id="elementId"
4
- class="context-popup"
5
- :style="{
6
- top: currentContextMenuY,
7
- left: currentContextMenuX,
8
- }"
9
- >
10
- <common-context-recursion
11
- :action-loading="props.actionLoading"
12
- :items="props.contextMenu.items"
13
- @select-item="selectItem"
14
- />
15
- </div>
16
- </template>
17
-
18
- <script setup lang="ts">
19
- import type {
20
- UI_I_ContextMenuItem,
21
- UI_I_ContextMenu,
22
- } from '~/components/common/context/lib/models/interfaces'
23
-
24
- const props = defineProps<{
25
- contextMenu: UI_I_ContextMenu
26
- actionLoading: string | null
27
- }>()
28
- const emits = defineEmits<{
29
- (event: 'select-item', value: UI_I_ContextMenuItem): void
30
- (event: 'hide'): void
31
- }>()
32
-
33
- const { $store }: any = useNuxtApp()
34
- const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
35
-
36
- const selectItem = (item: UI_I_ContextMenuItem): void => {
37
- emits('select-item', item)
38
- }
39
-
40
- const elementId = ref<string>(`context-${useUniqueId()}`)
41
-
42
- const currentContextMenuY = ref<string>('')
43
- const currentContextMenuX = ref<string>('')
44
- const setCurrentPositionsPopup = (): void => {
45
- let contextMenuY = props.contextMenu.y
46
- const contextMenuX = props.contextMenu.x
47
-
48
- const contextWrap: HTMLElement | null = document.querySelector(
49
- `#${elementId.value} .context-wrap`
50
- )
51
- const contextW = contextWrap?.offsetWidth || 0
52
- const contextH = contextWrap?.offsetHeight || 0
53
-
54
- const windowW = window.innerWidth
55
- const windowH = window.innerHeight
56
-
57
- if (contextMenuY + contextH >= windowH) {
58
- currentContextMenuY.value = 'auto'
59
- } else {
60
- if (isNewView.value) contextMenuY += 8
61
- currentContextMenuY.value = `${contextMenuY}px`
62
- }
63
-
64
- if (contextMenuX + contextW >= windowW) {
65
- let divisionW = windowW - contextW
66
- if (isNewView.value) divisionW -= 16
67
- currentContextMenuX.value = `${divisionW}px`
68
- } else {
69
- currentContextMenuX.value = `${contextMenuX}px`
70
- }
71
- }
72
-
73
- const windowMousedown = (): void => {
74
- emits('hide')
75
- }
76
- const windowResize = (): void => {
77
- emits('hide')
78
- }
79
- watch(
80
- () => props.contextMenu.y,
81
- (newValue: number) => {
82
- if (!newValue) return
83
-
84
- if (newValue < 0) {
85
- window.removeEventListener('mousedown', windowMousedown)
86
- window.removeEventListener('resize', windowResize)
87
- } else {
88
- window.addEventListener('mousedown', windowMousedown)
89
- window.addEventListener('resize', windowResize)
90
- }
91
-
92
- setTimeout(() => {
93
- setCurrentPositionsPopup()
94
- }, 0)
95
- }
96
- )
97
- </script>
98
-
99
- <style scoped lang="scss">
100
- .context-popup {
101
- top: -9999px;
102
- left: -9999px;
103
- bottom: 0;
104
- border: none;
105
- box-sizing: content-box;
106
- overflow: visible;
107
- display: block;
108
- position: fixed;
109
- z-index: var(--z-popover);
110
- }
111
- </style>
1
+ <template>
2
+ <div
3
+ :id="elementId"
4
+ class="context-popup"
5
+ :style="{
6
+ top: currentContextMenuY,
7
+ left: currentContextMenuX,
8
+ }"
9
+ >
10
+ <common-context-recursion
11
+ :action-loading="props.actionLoading"
12
+ :items="props.contextMenu.items"
13
+ @select-item="selectItem"
14
+ />
15
+ </div>
16
+ </template>
17
+
18
+ <script setup lang="ts">
19
+ import type {
20
+ UI_I_ContextMenuItem,
21
+ UI_I_ContextMenu,
22
+ } from '~/components/common/context/lib/models/interfaces'
23
+
24
+ const props = defineProps<{
25
+ contextMenu: UI_I_ContextMenu
26
+ actionLoading: string | null
27
+ }>()
28
+ const emits = defineEmits<{
29
+ (event: 'select-item', value: UI_I_ContextMenuItem): void
30
+ (event: 'hide'): void
31
+ }>()
32
+
33
+ const { $store }: any = useNuxtApp()
34
+ const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
35
+
36
+ const selectItem = (item: UI_I_ContextMenuItem): void => {
37
+ emits('select-item', item)
38
+ }
39
+
40
+ const elementId = ref<string>(`context-${useUniqueId()}`)
41
+
42
+ const currentContextMenuY = ref<string>('')
43
+ const currentContextMenuX = ref<string>('')
44
+ const setCurrentPositionsPopup = (): void => {
45
+ let contextMenuY = props.contextMenu.y
46
+ const contextMenuX = props.contextMenu.x
47
+
48
+ const contextWrap: HTMLElement | null = document.querySelector(
49
+ `#${elementId.value} .context-wrap`
50
+ )
51
+ const contextW = contextWrap?.offsetWidth || 0
52
+ const contextH = contextWrap?.offsetHeight || 0
53
+
54
+ const windowW = window.innerWidth
55
+ const windowH = window.innerHeight
56
+
57
+ if (contextMenuY + contextH >= windowH) {
58
+ currentContextMenuY.value = 'auto'
59
+ } else {
60
+ if (isNewView.value) contextMenuY += 8
61
+ currentContextMenuY.value = `${contextMenuY}px`
62
+ }
63
+
64
+ if (contextMenuX + contextW >= windowW) {
65
+ let divisionW = windowW - contextW
66
+ if (isNewView.value) divisionW -= 16
67
+ currentContextMenuX.value = `${divisionW}px`
68
+ } else {
69
+ currentContextMenuX.value = `${contextMenuX}px`
70
+ }
71
+ }
72
+
73
+ const windowMousedown = (): void => {
74
+ emits('hide')
75
+ }
76
+ const windowResize = (): void => {
77
+ emits('hide')
78
+ }
79
+ watch(
80
+ () => props.contextMenu.y,
81
+ (newValue: number) => {
82
+ if (!newValue) return
83
+
84
+ if (newValue < 0) {
85
+ window.removeEventListener('mousedown', windowMousedown)
86
+ window.removeEventListener('resize', windowResize)
87
+ } else {
88
+ window.addEventListener('mousedown', windowMousedown)
89
+ window.addEventListener('resize', windowResize)
90
+ }
91
+
92
+ setTimeout(() => {
93
+ setCurrentPositionsPopup()
94
+ }, 0)
95
+ }
96
+ )
97
+ </script>
98
+
99
+ <style scoped lang="scss">
100
+ .context-popup {
101
+ top: -9999px;
102
+ left: -9999px;
103
+ bottom: 0;
104
+ border: none;
105
+ box-sizing: content-box;
106
+ overflow: visible;
107
+ display: block;
108
+ position: fixed;
109
+ z-index: var(--z-popover);
110
+ }
111
+ </style>
@@ -1,31 +1,31 @@
1
- import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
2
-
3
- export interface UI_I_ContextMenuByEvent {
4
- event: any
5
- node: UI_I_TreeNode
6
- }
7
- export interface UI_I_ContextMenu<T = string> {
8
- x: number
9
- y: number
10
- id: string | number
11
- type: T
12
- titleText: string
13
- titleIconClassName: string
14
- items: UI_I_ContextMenuItem[]
15
- }
16
- export interface UI_I_ContextMenuItem<T = string> {
17
- name: string
18
- actionType: T | ''
19
- iconClassName: string
20
- items: UI_I_ContextMenuItem<T>[]
21
- shortcut?: string
22
- hasBorderTop?: boolean
23
- isHeader?: boolean
24
- disabled?: boolean
25
- development?: boolean
26
- isShowItems?: boolean
27
- testId?: string
28
- style?: {
29
- color: string
30
- }
31
- }
1
+ import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
2
+
3
+ export interface UI_I_ContextMenuByEvent {
4
+ event: any
5
+ node: UI_I_TreeNode
6
+ }
7
+ export interface UI_I_ContextMenu<T = string> {
8
+ x: number
9
+ y: number
10
+ id: string | number
11
+ type: T
12
+ titleText: string
13
+ titleIconClassName: string
14
+ items: UI_I_ContextMenuItem[]
15
+ }
16
+ export interface UI_I_ContextMenuItem<T = string> {
17
+ name: string
18
+ actionType: T | ''
19
+ iconClassName: string
20
+ items: UI_I_ContextMenuItem<T>[]
21
+ shortcut?: string
22
+ hasBorderTop?: boolean
23
+ isHeader?: boolean
24
+ disabled?: boolean
25
+ development?: boolean
26
+ isShowItems?: boolean
27
+ testId?: string
28
+ style?: {
29
+ color: string
30
+ }
31
+ }