bfg-common 1.6.76 → 1.6.78

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 (138) hide show
  1. package/assets/localization/local_be.json +1 -14
  2. package/assets/localization/local_en.json +1 -14
  3. package/assets/localization/local_hy.json +1 -14
  4. package/assets/localization/local_kk.json +1 -14
  5. package/assets/localization/local_ru.json +1 -14
  6. package/assets/localization/local_zh.json +1 -14
  7. package/components/atoms/dropdown/dropdown/Dropdown.vue +170 -170
  8. package/components/atoms/dropdown/dropdown/lib/models/interfaces.ts +10 -10
  9. package/components/common/adapterManager/AdapterManager.vue +473 -473
  10. package/components/common/adapterManager/AdapterManagerOld.vue +498 -498
  11. package/components/common/adapterManager/addAdapterModal/AddAdapterModal.vue +70 -70
  12. package/components/common/adapterManager/addAdapterModal/AddAdapterModalNew.vue +110 -110
  13. package/components/common/adapterManager/addAdapterModal/AddAdapterModalOld.vue +531 -531
  14. package/components/common/adapterManager/addAdapterWarningModal/AddAdapterWarningModal.vue +32 -32
  15. package/components/common/adapterManager/addAdapterWarningModal/AddAdapterWarningModalNew.vue +37 -37
  16. package/components/common/adapterManager/addAdapterWarningModal/AddAdapterWarningModalOld.vue +73 -73
  17. package/components/common/adapterManager/lib/config/index.ts +19 -19
  18. package/components/common/adapterManager/noActiveAdaptersModal/NoActiveAdaptersModal.vue +31 -31
  19. package/components/common/adapterManager/noActiveAdaptersModal/NoActiveAdaptersModalNew.vue +34 -34
  20. package/components/common/adapterManager/noActiveAdaptersModal/NoActiveAdaptersModalOld.vue +57 -57
  21. package/components/common/adapterManager/noConnectedActiveAdaptersModal/NoConnectedActiveAdaptersModal.vue +31 -31
  22. package/components/common/adapterManager/noConnectedActiveAdaptersModal/NoConnectedActiveAdaptersModalNew.vue +34 -34
  23. package/components/common/adapterManager/noConnectedActiveAdaptersModal/NoConnectedActiveAdaptersModalOld.vue +57 -57
  24. package/components/common/adapterManager/ui/actions/AddAdapterButton.vue +34 -34
  25. package/components/common/adapterManager/ui/actions/RemoveAdapterButton.vue +41 -41
  26. package/components/common/adapterManager/ui/actions/VerticalSeparator.vue +10 -10
  27. package/components/common/adapterManager/ui/actions/bar/BarOld.vue +95 -95
  28. package/components/common/adapterManager/ui/actions/moveDownAdapterButton/MoveDownAdapterButton.vue +28 -28
  29. package/components/common/adapterManager/ui/actions/moveDownAdapterButton/MoveDownAdapterButtonNew.vue +76 -76
  30. package/components/common/adapterManager/ui/actions/moveDownAdapterButton/MoveDownAdapterButtonOld.vue +33 -33
  31. package/components/common/adapterManager/ui/actions/moveUpAdapterButton/MoveUpAdapterButton.vue +28 -28
  32. package/components/common/adapterManager/ui/actions/moveUpAdapterButton/MoveUpAdapterButtonNew.vue +77 -77
  33. package/components/common/adapterManager/ui/actions/moveUpAdapterButton/MoveUpAdapterButtonOld.vue +33 -33
  34. package/components/common/adapterManager/ui/noSelectedAdapter/NoSelectedAdapter.vue +24 -24
  35. package/components/common/adapterManager/ui/noSelectedAdapter/NoSelectedAdapterNew.vue +18 -18
  36. package/components/common/adapterManager/ui/noSelectedAdapter/NoSelectedAdapterOld.vue +38 -38
  37. package/components/common/adapterManager/ui/secondTitle/SecondTitle.vue +31 -31
  38. package/components/common/adapterManager/ui/secondTitle/SecondTitleNew.vue +51 -51
  39. package/components/common/adapterManager/ui/secondTitle/SecondTitleOld.vue +35 -35
  40. package/components/common/adapterManager/ui/table/Table.vue +88 -88
  41. package/components/common/adapterManager/ui/table/TableNew.vue +137 -137
  42. package/components/common/adapterManager/ui/table/TableOld.vue +141 -141
  43. package/components/common/adapterManager/ui/table/adapters/Adapters.vue +44 -44
  44. package/components/common/adapterManager/ui/table/adapters/AdaptersNew.vue +187 -187
  45. package/components/common/adapterManager/ui/table/adapters/AdaptersOld.vue +87 -87
  46. package/components/common/adapterManager/ui/table/header/Header.vue +57 -57
  47. package/components/common/adapterManager/ui/table/header/HeaderNew.vue +81 -81
  48. package/components/common/adapterManager/ui/table/header/HeaderOld.vue +79 -79
  49. package/components/common/adapterManager/ui/table/lib/models/types.ts +1 -1
  50. package/components/common/certificate/Certificate.vue +6 -16
  51. package/components/common/certificate/{Info/Old.vue → CertificateInfo.vue} +34 -6
  52. package/components/common/certificate/{tools/Tools.vue → Tools.vue} +23 -18
  53. package/components/common/certificate/lib/config/tabsPannel.ts +22 -0
  54. package/components/common/diagramMain/adapter/Adapter.vue +123 -123
  55. package/components/common/diagramMain/adapter/AdapterItem.vue +438 -438
  56. package/components/common/diagramMain/adapter/AdapterItems.vue +61 -61
  57. package/components/common/diagramMain/adapter/Contents.vue +212 -212
  58. package/components/common/diagramMain/adapter/Lines.vue +81 -81
  59. package/components/common/diagramMain/adapter/block/Block.vue +27 -27
  60. package/components/common/diagramMain/adapter/block/BlockNew.vue +58 -58
  61. package/components/common/diagramMain/adapter/block/BlockOld.vue +50 -50
  62. package/components/common/diagramMain/adapter/secondBlock/SecondBlock.vue +27 -27
  63. package/components/common/diagramMain/adapter/secondBlock/SecondBlockNew.vue +60 -60
  64. package/components/common/diagramMain/adapter/secondBlock/SecondBlockOld.vue +51 -51
  65. package/components/common/diagramMain/highlights/Highlights.vue +151 -151
  66. package/components/common/diagramMain/highlights/HighlightsNew.vue +124 -124
  67. package/components/common/diagramMain/highlights/HighlightsOld.vue +107 -107
  68. package/components/common/diagramMain/lib/config/index.ts +81 -81
  69. package/components/common/diagramMain/lib/config/initial.ts +50 -50
  70. package/components/common/diagramMain/lib/config/positions.ts +194 -194
  71. package/components/common/diagramMain/lib/models/enums.ts +44 -44
  72. package/components/common/diagramMain/lib/models/interfaces.ts +760 -760
  73. package/components/common/diagramMain/lib/models/types.ts +21 -21
  74. package/components/common/diagramMain/lib/utils/utils.ts +331 -331
  75. package/components/common/diagramMain/modals/ManagePhysicalAdaptersModal.vue +331 -331
  76. package/components/common/diagramMain/modals/Modals.vue +483 -483
  77. package/components/common/diagramMain/modals/lib/config/adapterModal.ts +147 -147
  78. package/components/common/diagramMain/modals/lib/config/initial.ts +180 -180
  79. package/components/common/diagramMain/modals/lib/config/networkModal.ts +405 -405
  80. package/components/common/diagramMain/modals/lib/config/portModal.ts +253 -253
  81. package/components/common/diagramMain/modals/lib/config/switchModal.ts +245 -245
  82. package/components/common/diagramMain/modals/lib/config/vCenterModal.ts +48 -48
  83. package/components/common/diagramMain/modals/lib/config/vmKernelAdapter.ts +90 -90
  84. package/components/common/diagramMain/modals/lib/mappers/mappers.ts +88 -88
  85. package/components/common/diagramMain/modals/migrateVmkernelAdapter/MigrateVmkernelAdapter.vue +541 -541
  86. package/components/common/diagramMain/modals/migrateVmkernelAdapter/lib/config/steps.ts +114 -114
  87. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/ConnectionSettings.vue +170 -170
  88. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/SelectVmkernelAdapter.vue +159 -159
  89. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/VmkernelAdapterReadyComplete.vue +49 -49
  90. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/common.ts +19 -19
  91. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/connectionSettings.ts +137 -137
  92. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/selectVmkernelAdapter.ts +52 -52
  93. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/validations.ts +19 -19
  94. package/components/common/diagramMain/modals/remove/RemoveModal.vue +82 -82
  95. package/components/common/diagramMain/modals/remove/RemoveModalNew.vue +106 -106
  96. package/components/common/diagramMain/modals/remove/RemoveModalOld.vue +241 -241
  97. package/components/common/diagramMain/modals/viewSettings/info/Info.vue +57 -57
  98. package/components/common/diagramMain/modals/viewSettings/info/InfoNew.vue +174 -174
  99. package/components/common/diagramMain/modals/viewSettings/info/InfoOld.vue +141 -141
  100. package/components/common/diagramMain/modals/viewSettings/viewSettings/ViewSettings.vue +45 -45
  101. package/components/common/diagramMain/modals/viewSettings/viewSettings/ViewSettingsNew.vue +323 -323
  102. package/components/common/diagramMain/modals/viewSettings/viewSettings/ViewSettingsOld.vue +203 -203
  103. package/components/common/diagramMain/modals/viewSettings/viewSettingsModal/ViewSettingsModal.vue +60 -60
  104. package/components/common/diagramMain/modals/viewSettings/viewSettingsModal/ViewSettingsModalNew.vue +50 -50
  105. package/components/common/diagramMain/modals/viewSettings/viewSettingsModal/ViewSettingsModalOld.vue +70 -70
  106. package/components/common/diagramMain/modals/viewSettings/viewSettingsModal/lib/models/interfaces.ts +48 -48
  107. package/components/common/diagramMain/network/Contents.vue +497 -497
  108. package/components/common/diagramMain/network/Lines.vue +107 -107
  109. package/components/common/diagramMain/network/Network.vue +141 -141
  110. package/components/common/diagramMain/network/block/Block.vue +37 -37
  111. package/components/common/diagramMain/network/block/BlockNew.vue +68 -68
  112. package/components/common/diagramMain/network/block/BlockOld.vue +64 -64
  113. package/components/common/diagramMain/network/noNetwork/NoNetwork.vue +12 -12
  114. package/components/common/diagramMain/network/noNetwork/NoNetworkNew.vue +89 -89
  115. package/components/common/diagramMain/network/noNetwork/NoNetworkOld.vue +61 -61
  116. package/components/common/diagramMain/network/secondBlock/SecondBlock.vue +41 -41
  117. package/components/common/diagramMain/network/secondBlock/SecondBlockNew.vue +64 -64
  118. package/components/common/diagramMain/network/secondBlock/SecondBlockOld.vue +60 -60
  119. package/components/common/diagramMain/port/Port.vue +580 -580
  120. package/components/common/diagramMain/port/Ports.vue +47 -47
  121. package/components/common/diagramMain/switch/Switch.vue +180 -180
  122. package/components/common/diagramMain/switch/SwitchSelected.vue +111 -111
  123. package/components/common/monitor/advanced/table/tableOld/TableOld.vue +93 -93
  124. package/components/common/monitor/utilization/lib/models/enums.ts +4 -4
  125. package/components/common/split/horizontal/New.vue +1 -1
  126. package/components/common/split/horizontal/Old.vue +1 -1
  127. package/package.json +2 -2
  128. package/components/common/certificate/Info/Info.vue +0 -61
  129. package/components/common/certificate/Info/new/New.vue +0 -285
  130. package/components/common/certificate/Info/new/lib/config/index.ts +0 -59
  131. package/components/common/certificate/Info/new/lib/models/interfaces.ts +0 -3
  132. package/components/common/certificate/Info/new/lib/utils/index.ts +0 -10
  133. package/components/common/certificate/Old.vue +0 -27
  134. package/components/common/certificate/new/New.vue +0 -30
  135. package/components/common/certificate/new/Skeleton.vue +0 -155
  136. package/components/common/certificate/tools/New.vue +0 -48
  137. package/components/common/certificate/tools/Old.vue +0 -39
  138. package/components/common/certificate/tools/lib/config/tabsPannel.ts +0 -20
@@ -2813,20 +2813,7 @@
2813
2813
  "actionsSameInfoDesc": "Дзеянні такія ж, як і ў Правіле трывогі 1 з-за таго ж узроўню сур'ёзнасці",
2814
2814
  "systemStack": "Сістэмны стэк",
2815
2815
  "localSubnet": "Лакальная падсетка",
2816
- "renewCertificateConfirm": "Абнавіць сертыфікат",
2817
- "elapsed": "Прайшло",
2818
- "expiring": "Прайшло",
2819
- "expiringSoon": "Хутка скончыцца",
2820
- "certificateExpiration": "Да заканчэння тэрміну дзеяння засталося {0} дзён",
2821
- "locality": "Месцазнаходжанне",
2822
- "serialNumber": "Серыйны нумар",
2823
- "commonName": "Агульнае імя",
2824
- "organizationalUnit": "Арганізацыйнае падраздзяленне",
2825
- "organization": "Арганізацыя",
2826
- "state": "Дзяржава",
2827
- "country": "Краіна",
2828
- "validPeriod": "Тэрмін дзеяння",
2829
- "certificateActiveDates": "Даты дзеяння сертыфіката",
2816
+ "renewCertificateConfirm": "Пацверджанне абнаўлення сертыфіката",
2830
2817
  "renewCertificateConfirmDesc": "Вы ўпэўнены, што хочаце абнавіць сертыфікат для хоста «{0}»?",
2831
2818
  "refreshCACertificatesConfirm": "Пацверджанне абнаўлення сертыфікатаў ЦС",
2832
2819
  "refreshCACertificatesConfirmDesc": "Вы ўпэўнены, што хочаце абнавіць сертыфікаты ЦС на хосце «{0}»?",
@@ -2817,20 +2817,7 @@
2817
2817
  "actionsSameInfoDesc": "Actions are same as Alarm Rule 1 due to same severity level",
2818
2818
  "systemStack": "System stack",
2819
2819
  "localSubnet": "Local Subnet",
2820
- "renewCertificateConfirm": "Renew Certificate",
2821
- "elapsed": "Elapsed",
2822
- "expiring": "Expiring",
2823
- "expiringSoon": "Expiring soon",
2824
- "certificateExpiration": "{0} days remaining until expiration",
2825
- "locality": "Locality",
2826
- "serialNumber": "Serial Number",
2827
- "commonName": "Common Name",
2828
- "organizationalUnit": "Organizational Unit",
2829
- "organization": "Organization",
2830
- "state": "State",
2831
- "country": "Country",
2832
- "validPeriod": "Valid Period",
2833
- "certificateActiveDates": "Certificate Active Dates",
2820
+ "renewCertificateConfirm": "Renew Certificate Confirmation",
2834
2821
  "renewCertificateConfirmDesc": "Are you sure you want to renew the certificate for the host “{0}”?",
2835
2822
  "refreshCACertificatesConfirm": "Refresh CA Certificates Confirmation",
2836
2823
  "refreshCACertificatesConfirmDesc": "Are you sure you want to refresh the CA certificates on the host “{0}”?",
@@ -2817,20 +2817,7 @@
2817
2817
  "actionsSameInfoDesc": "Գործողությունները նույնն են, ինչ Տագնապային կանոն 1-ը՝ նույն խստության մակարդակի պատճառով",
2818
2818
  "systemStack": "Համակարգի կույտ",
2819
2819
  "localSubnet": "Տեղային ենթացանց",
2820
- "renewCertificateConfirm": "Թարմացնել վկայականը",
2821
- "elapsed": "Անցել է",
2822
- "expiring": "Անցել է",
2823
- "expiringSoon": "Շուտով կլրանա",
2824
- "certificateExpiration": "Գործողության ժամկետի ավարտին մնացել է {0} օր",
2825
- "locality": "Տեղանք",
2826
- "serialNumber": "Սերիական համար",
2827
- "commonName": "Ընդհանուր անուն",
2828
- "organizationalUnit": "Կազմակերպական ստորաբաժանում",
2829
- "organization": "Կազմակերպություն",
2830
- "state": "Պետություն",
2831
- "country": "Երկիր",
2832
- "validPeriod": "Գործողության ժամկետ",
2833
- "certificateActiveDates": "Վկայականի գործողության ժամկետները",
2820
+ "renewCertificateConfirm": "Վկայագրի թարմացման հաստատում",
2834
2821
  "renewCertificateConfirmDesc": "Վստա՞հ եք, որ ցանկանում եք թարմացնել «{0}» հոսթի վկայագիրը։",
2835
2822
  "refreshCACertificatesConfirm": "ՎԿ կենտրոնի վկայագրերի թարմացման հաստատում",
2836
2823
  "refreshCACertificatesConfirmDesc": "Վստա՞հ եք, որ ցանկանում եք թարմացնել ՎԿ կենտրոնի վկայագրերը «{0}» հոսթում։",
@@ -2816,20 +2816,7 @@
2816
2816
  "actionsSameInfoDesc": "Бірдей ауырлық деңгейіне байланысты әрекеттер 1-ші Дабыл ережесімен бірдей",
2817
2817
  "systemStack": "Жүйелік стек",
2818
2818
  "localSubnet": "Жергілікті ішкі желі",
2819
- "renewCertificateConfirm": "Сертификатты жаңарту",
2820
- "elapsed": "Өтті",
2821
- "expiring": "Өткен",
2822
- "expiringSoon": "Жақын арада аяқталады",
2823
- "certificateExpiration": "Қолданылу мерзімі аяқталғанша {0} күн қалды",
2824
- "locality": "Орналасқан жері",
2825
- "serialNumber": "Сериялық нөмір",
2826
- "commonName": "Жалпы атау",
2827
- "organizationalUnit": "Ұйымдық бөлімше",
2828
- "organization": "Ұйым",
2829
- "state": "Мемлекет",
2830
- "country": "Ел",
2831
- "validPeriod": "Қолданылу мерзімі",
2832
- "certificateActiveDates": "Сертификаттың қолданылу күндері",
2819
+ "renewCertificateConfirm": "Сертификатты жаңартуды растау",
2833
2820
  "renewCertificateConfirmDesc": "Сіз «{0}» хостының сертификатын жаңартқыңыз келетініне сенімдісіз бе?",
2834
2821
  "refreshCACertificatesConfirm": "CA сертификаттарын жаңартуды растау",
2835
2822
  "refreshCACertificatesConfirmDesc": "Сіз «{0}» хостындағы CA сертификаттарын жаңартқыңыз келетініне сенімдісіз бе?",
@@ -2816,20 +2816,7 @@
2816
2816
  "actionsSameInfoDesc": "Действия такие же, как и в правиле тревоги 1, из-за того же уровня серьезности.",
2817
2817
  "systemStack": "Системный стек",
2818
2818
  "localSubnet": "Локальная подсеть",
2819
- "renewCertificateConfirm": "Продлить сертификат",
2820
- "elapsed": "Прошло",
2821
- "expiring": "Прошло",
2822
- "expiringSoon": "Скоро истекает",
2823
- "certificateExpiration": "До истечения срока действия осталось {0} дней",
2824
- "locality": "Местоположение",
2825
- "serialNumber": "Серийный номер",
2826
- "commonName": "Общее имя",
2827
- "organizationalUnit": "Организационное подразделение",
2828
- "organization": "Организация",
2829
- "state": "Государство",
2830
- "country": "Страна",
2831
- "validPeriod": "Срок действия",
2832
- "certificateActiveDates": "Даты действия сертификата",
2819
+ "renewCertificateConfirm": "Подтверждение продления сертификата",
2833
2820
  "renewCertificateConfirmDesc": "Вы уверены, что хотите продлить сертификат для хоста “{0}”?",
2834
2821
  "refreshCACertificatesConfirm": "Подтверждение обновления сертификатов CA",
2835
2822
  "refreshCACertificatesConfirmDesc": "Вы уверены, что хотите обновить сертификаты CA на хосте “{0}”?",
@@ -2814,20 +2814,7 @@
2814
2814
  "actionsSameInfoDesc": "由于严重程度相同,操作与警报规则 1 相同",
2815
2815
  "systemStack": "系统堆栈",
2816
2816
  "localSubnet": "本地子网",
2817
- "renewCertificateConfirm": "续订证书",
2818
- "elapsed": "已过",
2819
- "expiring": "已过去",
2820
- "expiringSoon": "即将过期",
2821
- "certificateExpiration": "到期前还剩 {0} 天",
2822
- "locality": "地点",
2823
- "serialNumber": "序列号",
2824
- "commonName": "通用名称",
2825
- "organizationalUnit": "组织单位",
2826
- "organization": "组织",
2827
- "state": "州",
2828
- "country": "国家",
2829
- "validPeriod": "有效期",
2830
- "certificateActiveDates": "证书有效日期",
2817
+ "renewCertificateConfirm": "更新证书确认",
2831
2818
  "renewCertificateConfirmDesc": "您确定要为主机“{0}”更新证书吗?",
2832
2819
  "refreshCACertificatesConfirm": "刷新 CA 证书确认",
2833
2820
  "refreshCACertificatesConfirmDesc": "您确定要刷新主机“{0}”上的 CA 证书吗?",
@@ -1,170 +1,170 @@
1
- <template>
2
- <div :class="['dropdown', { open }]">
3
- <div
4
- v-on-click-outside="onClickOutsideHandler"
5
- :data-id="`${props.testId}-show-dropdown-menu`"
6
- class="dropdown-toggle-container"
7
- @click="showDropMenu"
8
- >
9
- <span class="nav-link">
10
- <span class="nav-icon user-menu-large">
11
- <slot name="icon">
12
- <atoms-the-icon class="user-icon" name="user" />
13
- </slot>
14
- <span v-if="props.title">{{ title }}</span>
15
- <atoms-the-icon class="angle-icon down" name="angle" />
16
- </span>
17
- </span>
18
- </div>
19
- <div
20
- v-show="open && dropMenu?.length"
21
- ref="ignoreElRef"
22
- class="dropdown-menu position-right"
23
- >
24
- <div v-for="(item, key) in dropMenu" :key="key">
25
- <button
26
- :id="`${props.testId}-item`"
27
- :class="item.disabled && 'disabled'"
28
- :data-id="item.testId"
29
- class="dropdown-item"
30
- @click="onSelect(key)"
31
- >
32
- <slot name="item" :item="item">
33
- <a
34
- v-if="item.href"
35
- :id="`${props.testId}-link`"
36
- :href="item.href"
37
- :data-id="`${item.testId}-link`"
38
- >{{ item.text }}</a
39
- >
40
- <a v-else>{{ item.text }} </a>
41
- </slot>
42
- </button>
43
- <div v-if="item.divider" class="dropdown-divider" />
44
- </div>
45
- </div>
46
- </div>
47
- </template>
48
-
49
- <script setup lang="ts">
50
- import { vOnClickOutside } from '@vueuse/components'
51
- import type { UI_I_DropMenu } from '~/components/atoms/dropdown/dropdown/lib/models/interfaces'
52
-
53
- const props = withDefaults(
54
- defineProps<{
55
- dropMenu: UI_I_DropMenu<string>[]
56
- testId?: string
57
- title?: string
58
- }>(),
59
- { testId: 'ui-dropdown', title: undefined }
60
- )
61
- const emits = defineEmits(['select'])
62
-
63
- const open = ref<boolean>(false)
64
- const showDropMenu = (): void => {
65
- open.value = !open.value
66
- }
67
- const onSelect = (key: number): void => {
68
- const { dropMenu } = props
69
-
70
- if (dropMenu[key].disabled) return
71
-
72
- if (dropMenu[key].closeAfterClick) open.value = false
73
- emits('select', props.dropMenu[key])
74
- }
75
- const hide = (): void => {
76
- open.value = false
77
- }
78
-
79
- const ignoreElRef = ref<Event | null>(null)
80
- const onClickOutsideHandler = [hide, { ignore: [ignoreElRef] }]
81
- </script>
82
-
83
- <style>
84
- :root {
85
- --dropdown-position-left: auto;
86
- --dropdown-position-right: 0;
87
- }
88
- :root[dir='rtl'] {
89
- --dropdown-position-left: 0;
90
- --dropdown-position-right: auto;
91
- }
92
- </style>
93
- <style scoped lang="scss">
94
- .dropdown {
95
- height: 100%;
96
-
97
- .dropdown-toggle-container {
98
- height: 100%;
99
- cursor: pointer;
100
-
101
- .nav-link {
102
- height: 100%;
103
- padding: 0;
104
-
105
- .user-menu-large {
106
- width: auto;
107
- display: flex;
108
- align-items: center;
109
- padding: 0 9px;
110
- font-size: inherit;
111
- line-height: 3rem;
112
- &.nav-icon {
113
- line-height: 3rem;
114
- }
115
-
116
- .user-icon {
117
- width: 24px;
118
- height: 24px;
119
- fill: #fafafa;
120
- }
121
- .angle-icon {
122
- width: 16px;
123
- height: 16px;
124
- fill: #fafafa;
125
-
126
- &.down {
127
- transform: rotate(-180deg);
128
- }
129
- }
130
- span {
131
- margin-right: 4px;
132
- margin-left: 4px;
133
- font-size: 13px;
134
- }
135
- }
136
- }
137
- }
138
- .dropdown-menu {
139
- background-color: var(--dropdown-bg-color);
140
- border-color: var(--block-border-color);
141
- z-index: var(--z-dropdown);
142
- left: var(--dropdown-position-left);
143
- right: var(--dropdown-position-right);
144
-
145
- .dropdown-item {
146
- font-size: 0.7rem;
147
- border-bottom: 1px solid transparent;
148
- &:hover {
149
- background-color: var(--row-hover-bg-color);
150
- border-color: var(--row-hover-border-color);
151
- }
152
- & > a {
153
- color: var(--dropdown-item-color);
154
- &:active {
155
- color: #004a70;
156
- }
157
- }
158
- &.disabled {
159
- border-bottom: none;
160
- > a {
161
- text-decoration: none;
162
- }
163
- }
164
- }
165
- .dropdown-divider {
166
- border-color: var(--block-border-color);
167
- }
168
- }
169
- }
170
- </style>
1
+ <template>
2
+ <div :class="['dropdown', { open }]">
3
+ <div
4
+ v-on-click-outside="onClickOutsideHandler"
5
+ :data-id="`${props.testId}-show-dropdown-menu`"
6
+ class="dropdown-toggle-container"
7
+ @click="showDropMenu"
8
+ >
9
+ <span class="nav-link">
10
+ <span class="nav-icon user-menu-large">
11
+ <slot name="icon">
12
+ <atoms-the-icon class="user-icon" name="user" />
13
+ </slot>
14
+ <span v-if="props.title">{{ title }}</span>
15
+ <atoms-the-icon class="angle-icon down" name="angle" />
16
+ </span>
17
+ </span>
18
+ </div>
19
+ <div
20
+ v-show="open && dropMenu?.length"
21
+ ref="ignoreElRef"
22
+ class="dropdown-menu position-right"
23
+ >
24
+ <div v-for="(item, key) in dropMenu" :key="key">
25
+ <button
26
+ :id="`${props.testId}-item`"
27
+ :class="item.disabled && 'disabled'"
28
+ :data-id="item.testId"
29
+ class="dropdown-item"
30
+ @click="onSelect(key)"
31
+ >
32
+ <slot name="item" :item="item">
33
+ <a
34
+ v-if="item.href"
35
+ :id="`${props.testId}-link`"
36
+ :href="item.href"
37
+ :data-id="`${item.testId}-link`"
38
+ >{{ item.text }}</a
39
+ >
40
+ <a v-else>{{ item.text }} </a>
41
+ </slot>
42
+ </button>
43
+ <div v-if="item.divider" class="dropdown-divider" />
44
+ </div>
45
+ </div>
46
+ </div>
47
+ </template>
48
+
49
+ <script setup lang="ts">
50
+ import { vOnClickOutside } from '@vueuse/components'
51
+ import type { UI_I_DropMenu } from '~/components/atoms/dropdown/dropdown/lib/models/interfaces'
52
+
53
+ const props = withDefaults(
54
+ defineProps<{
55
+ dropMenu: UI_I_DropMenu<string>[]
56
+ testId?: string
57
+ title?: string
58
+ }>(),
59
+ { testId: 'ui-dropdown', title: undefined }
60
+ )
61
+ const emits = defineEmits(['select'])
62
+
63
+ const open = ref<boolean>(false)
64
+ const showDropMenu = (): void => {
65
+ open.value = !open.value
66
+ }
67
+ const onSelect = (key: number): void => {
68
+ const { dropMenu } = props
69
+
70
+ if (dropMenu[key].disabled) return
71
+
72
+ if (dropMenu[key].closeAfterClick) open.value = false
73
+ emits('select', props.dropMenu[key])
74
+ }
75
+ const hide = (): void => {
76
+ open.value = false
77
+ }
78
+
79
+ const ignoreElRef = ref<Event | null>(null)
80
+ const onClickOutsideHandler = [hide, { ignore: [ignoreElRef] }]
81
+ </script>
82
+
83
+ <style>
84
+ :root {
85
+ --dropdown-position-left: auto;
86
+ --dropdown-position-right: 0;
87
+ }
88
+ :root[dir='rtl'] {
89
+ --dropdown-position-left: 0;
90
+ --dropdown-position-right: auto;
91
+ }
92
+ </style>
93
+ <style scoped lang="scss">
94
+ .dropdown {
95
+ height: 100%;
96
+
97
+ .dropdown-toggle-container {
98
+ height: 100%;
99
+ cursor: pointer;
100
+
101
+ .nav-link {
102
+ height: 100%;
103
+ padding: 0;
104
+
105
+ .user-menu-large {
106
+ width: auto;
107
+ display: flex;
108
+ align-items: center;
109
+ padding: 0 9px;
110
+ font-size: inherit;
111
+ line-height: 3rem;
112
+ &.nav-icon {
113
+ line-height: 3rem;
114
+ }
115
+
116
+ .user-icon {
117
+ width: 24px;
118
+ height: 24px;
119
+ fill: #fafafa;
120
+ }
121
+ .angle-icon {
122
+ width: 16px;
123
+ height: 16px;
124
+ fill: #fafafa;
125
+
126
+ &.down {
127
+ transform: rotate(-180deg);
128
+ }
129
+ }
130
+ span {
131
+ margin-right: 4px;
132
+ margin-left: 4px;
133
+ font-size: 13px;
134
+ }
135
+ }
136
+ }
137
+ }
138
+ .dropdown-menu {
139
+ background-color: var(--dropdown-bg-color);
140
+ border-color: var(--block-border-color);
141
+ z-index: var(--z-dropdown);
142
+ left: var(--dropdown-position-left);
143
+ right: var(--dropdown-position-right);
144
+
145
+ .dropdown-item {
146
+ font-size: 0.7rem;
147
+ border-bottom: 1px solid transparent;
148
+ &:hover {
149
+ background-color: var(--row-hover-bg-color);
150
+ border-color: var(--row-hover-border-color);
151
+ }
152
+ & > a {
153
+ color: var(--dropdown-item-color);
154
+ &:active {
155
+ color: #004a70;
156
+ }
157
+ }
158
+ &.disabled {
159
+ border-bottom: none;
160
+ > a {
161
+ text-decoration: none;
162
+ }
163
+ }
164
+ }
165
+ .dropdown-divider {
166
+ border-color: var(--block-border-color);
167
+ }
168
+ }
169
+ }
170
+ </style>
@@ -1,10 +1,10 @@
1
- export interface UI_I_DropMenu<Action> {
2
- text: string
3
- action: Action
4
- href?: string
5
- disabled?: boolean
6
- divider?: boolean
7
- closeAfterClick?: boolean
8
- testId?: string
9
- data?: any
10
- }
1
+ export interface UI_I_DropMenu<Action> {
2
+ text: string
3
+ action: Action
4
+ href?: string
5
+ disabled?: boolean
6
+ divider?: boolean
7
+ closeAfterClick?: boolean
8
+ testId?: string
9
+ data?: any
10
+ }