bfg-common 1.4.732 → 1.4.734

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 (84) hide show
  1. package/assets/img/icons/icons-sprite-dark-3.svg +227 -227
  2. package/assets/img/icons/icons-sprite-dark-5.svg +488 -488
  3. package/assets/img/icons/icons-sprite-light-3.svg +227 -227
  4. package/assets/img/icons/icons-sprite-light-5.svg +488 -488
  5. package/assets/localization/local_be.json +16 -2
  6. package/assets/localization/local_en.json +16 -2
  7. package/assets/localization/local_hy.json +16 -2
  8. package/assets/localization/local_kk.json +16 -2
  9. package/assets/localization/local_ru.json +16 -2
  10. package/assets/localization/local_zh.json +16 -2
  11. package/components/atoms/select/TheSelect.vue +10 -1
  12. package/components/common/browse/blocks/lib/models/types.ts +1 -1
  13. package/components/common/browse/lib/models/interfaces.ts +5 -5
  14. package/components/common/diagramMain/Header.vue +211 -211
  15. package/components/common/diagramMain/adapter/AdapterItems.vue +61 -61
  16. package/components/common/diagramMain/lib/config/initial.ts +50 -50
  17. package/components/common/diagramMain/lib/models/types.ts +21 -21
  18. package/components/common/diagramMain/lib/utils/utils.ts +331 -331
  19. package/components/common/diagramMain/modals/ManagePhysicalAdaptersModal.vue +330 -330
  20. package/components/common/diagramMain/modals/editSettings/ConfirmTeamingSettingsModal.vue +40 -40
  21. package/components/common/diagramMain/modals/editSettings/EditSettings.vue +497 -497
  22. package/components/common/diagramMain/modals/editSettings/EditSettingsModal.vue +812 -812
  23. package/components/common/diagramMain/modals/editSettings/tabs/NetworkProperties.vue +214 -214
  24. package/components/common/diagramMain/modals/editSettings/tabs/Security.vue +189 -189
  25. package/components/common/diagramMain/modals/editSettings/tabs/SwitchProperties.vue +163 -163
  26. package/components/common/diagramMain/modals/editSettings/tabs/TeamingFailover.vue +175 -175
  27. package/components/common/diagramMain/modals/editSettings/tabs/TrafficShaping.vue +398 -398
  28. package/components/common/diagramMain/modals/editSettings/tabs/port/IpvFourSettings.vue +346 -346
  29. package/components/common/diagramMain/modals/editSettings/tabs/port/PortProperties.vue +205 -205
  30. package/components/common/diagramMain/modals/lib/config/diagramConfig.ts +23 -23
  31. package/components/common/diagramMain/modals/lib/config/initial.ts +180 -180
  32. package/components/common/diagramMain/modals/lib/config/vmKernelAdapter.ts +90 -90
  33. package/components/common/diagramMain/modals/lib/mappers/mappers.ts +87 -87
  34. package/components/common/diagramMain/modals/lib/utils/index.ts +24 -24
  35. package/components/common/diagramMain/modals/migrateVmkernelAdapter/lib/config/steps.ts +114 -114
  36. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/ConnectionSettings.vue +169 -169
  37. package/components/common/diagramMain/modals/migrateVmkernelAdapter/steps/SelectVmkernelAdapter.vue +159 -159
  38. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/common.ts +14 -14
  39. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/connectionSettings.ts +137 -137
  40. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/selectVmkernelAdapter.ts +52 -52
  41. package/components/common/diagramMain/modals/migrateVmkernelAdapter/validations/validations.ts +19 -19
  42. package/components/common/diagramMain/port/Ports.vue +47 -47
  43. package/components/common/monitor/advanced/Advanced.vue +0 -5
  44. package/components/common/monitor/advanced/tools/Tools.vue +2 -9
  45. package/components/common/monitor/advanced/tools/chartOptionsModal/ChartOptionsModal.vue +2 -9
  46. package/components/common/monitor/advanced/tools/chartOptionsModal/counters/Counters.vue +0 -2
  47. package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/Timespan.vue +93 -95
  48. package/components/common/{chartOptionsModal → monitor/advanced/tools/chartOptionsModal}/counters/timespan/form/Form.vue +539 -544
  49. package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/form/lib/config/dateForm.ts +114 -0
  50. package/components/common/monitor/overview/filters/Filters.vue +0 -3
  51. package/components/common/monitor/overview/filters/customIntervalModal/CustomIntervalModal.vue +5 -15
  52. package/components/common/monitor/overview/filters/customIntervalModal/lib/config/dateChecker.ts +14 -24
  53. package/components/common/pages/hardwareHealth/HardwareHealth.vue +5 -12
  54. package/components/common/pages/hardwareHealth/historyTestimony/Graph.vue +451 -456
  55. package/components/common/pages/hardwareHealth/historyTestimony/tools/Tools.vue +380 -387
  56. package/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/ChartOptionsModal.vue +6 -13
  57. package/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/counters/Counters.vue +94 -94
  58. package/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/counters/timespan/Timespan.vue +66 -66
  59. package/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/counters/timespan/form/Form.vue +539 -0
  60. package/components/common/{chartOptionsModal → pages/hardwareHealth/historyTestimony/tools/chartOptionsModal}/counters/timespan/form/lib/config/dateForm.ts +115 -116
  61. package/components/common/pages/tasks/Tasks.vue +9 -0
  62. package/components/common/pages/tasks/table/Table.vue +0 -1
  63. package/components/common/pages/tasks/table/errorInfo/ErrorInfo.vue +10 -6
  64. package/components/common/pages/tasks/table/expandDetails/ExpandDetails.vue +8 -8
  65. package/components/common/vm/actions/add/Add.vue +2 -0
  66. package/components/common/vm/actions/clone/Clone.vue +2 -0
  67. package/components/common/vm/actions/common/customizeHardware/CustomizeHardware.vue +3 -0
  68. package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareNew.vue +2 -0
  69. package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareOld.vue +2 -0
  70. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardware.vue +9 -1
  71. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareNew.vue +5 -2
  72. package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareOld.vue +3 -1
  73. package/components/common/vm/actions/common/customizeHardware/virtualHardware/lib/config/dropdownItems.ts +6 -4
  74. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue +52 -10
  75. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDeviceNew.vue +31 -5
  76. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDeviceOld.vue +31 -5
  77. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue +9 -2
  78. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/lib/config/options.ts +11 -4
  79. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/typeSelection/TypeSelectionNew.vue +1 -1
  80. package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/typeSelection/TypeSelectionOld.vue +1 -1
  81. package/components/common/vm/actions/editSettings/EditSettings.vue +3 -0
  82. package/components/common/vm/actions/editSettings/EditSettingsOld.vue +2 -0
  83. package/components/common/vm/actions/editSettings/new/New.vue +2 -0
  84. package/package.json +3 -3
@@ -2289,7 +2289,22 @@
2289
2289
  "searchHere": "Шукайце тут...",
2290
2290
  "columns": "Стоўбцы",
2291
2291
  "exportSelected": "Экспарт абранага",
2292
- "exportAll": "Экспарт усё"
2292
+ "exportAll": "Экспарт усё",
2293
+ "present": "Падарунак",
2294
+ "notPresent": "Не прысутнічае",
2295
+ "supported": "Які падтрымліваецца",
2296
+ "viewHost": "Прагляд хаста",
2297
+ "viewCluster": "Прагляд кластара",
2298
+ "viewDatacenter": "Прагляд цэнтра апрацоўкі дадзеных",
2299
+ "viewDatastore": "Прагляд сховішчы дадзеных",
2300
+ "viewFolder": "Прагляд тэчкі",
2301
+ "viewDatastoreCluster": "Прагляд кластара сховішчаў дадзеных",
2302
+ "viewHostProfile": "Прагляд профілю хаста",
2303
+ "viewNetwork": "Прагляд сеткі",
2304
+ "viewResourcePool": "Прагляд пула рэсурсаў",
2305
+ "viewVApps": "Прагляд прыкладанняў",
2306
+ "viewVirtualMachine": "Прагляд віртуальнай машыны",
2307
+ "viewVMTemplate": "Прагляд шаблону віртуальнай машыны"
2293
2308
  },
2294
2309
  "auth": {
2295
2310
  "welcomeTo": "Сардэчна запрашаем у",
@@ -2704,7 +2719,6 @@
2704
2719
  "timeToShouldBeLaterTimeFrom": "Ўказаны дыяпазон часу недапушчальны. Дата \" да \"павінна быць пазней даты\"ад\".",
2705
2720
  "timeRangeShouldNotBeSmallerThanHour": "Ўказаны дыяпазон часу недапушчальны. Ён не павінен быць менш 1 гадзіны.",
2706
2721
  "timeRangeShouldNotBeMoreThanMonth": "Указаны дыяпазон часу несапраўдны. Яно не павінна быць больш за 1 месяца.",
2707
- "timeRangeShouldNotBeMoreThanValidTo": "Указаны дыяпазон часу несапраўдны. Яно не павінна перавышаць {0}.",
2708
2722
  "overview": "Агляд",
2709
2723
  "spaceUtilization": "Выкарыстанне прасторы",
2710
2724
  "changeCustomInterval": "Зменіце карыстацкі інтэрвал",
@@ -2293,7 +2293,22 @@
2293
2293
  "searchHere": "Search here...",
2294
2294
  "columns": "Columns",
2295
2295
  "exportSelected": "Export Selected",
2296
- "exportAll": "Export All"
2296
+ "exportAll": "Export All",
2297
+ "present": "Present",
2298
+ "notPresent": "Not Present",
2299
+ "supported": "Supported",
2300
+ "viewHost": "View Host",
2301
+ "viewCluster": "View Cluster",
2302
+ "viewDatacenter": "View Datacenter",
2303
+ "viewDatastore": "View Datastore",
2304
+ "viewFolder": "View Folder",
2305
+ "viewDatastoreCluster": "View Datastore Cluster",
2306
+ "viewHostProfile": "View Host Profile",
2307
+ "viewNetwork": "View Network",
2308
+ "viewResourcePool": "View Resource Pool",
2309
+ "viewVApps": "View VApps",
2310
+ "viewVirtualMachine": "View Virtual Machine",
2311
+ "viewVMTemplate": "View VM Template"
2297
2312
  },
2298
2313
  "auth": {
2299
2314
  "welcomeTo": "Welcome to",
@@ -2708,7 +2723,6 @@
2708
2723
  "timeToShouldBeLaterTimeFrom": "The specified time range is not valid. The \"to\" date should be later than the \"from\" date.",
2709
2724
  "timeRangeShouldNotBeSmallerThanHour": "The specified time range is not valid. It should not be smaller than 1 hour.",
2710
2725
  "timeRangeShouldNotBeMoreThanMonth": "The specified time range is not valid. It should not be more than 1 month.",
2711
- "timeRangeShouldNotBeMoreThanValidTo": "The specified time range is not valid. It should not be more than {0}.",
2712
2726
  "overview": "Overview",
2713
2727
  "spaceUtilization": "Space Utilization",
2714
2728
  "changeCustomInterval": "Change custom interval",
@@ -2293,7 +2293,22 @@
2293
2293
  "searchHere": "Փնտրել այստեղ...",
2294
2294
  "columns": "Սյունակներ",
2295
2295
  "exportSelected": "Արտահանել ընտրվածը",
2296
- "exportAll": "Արտահանել բոլորը"
2296
+ "exportAll": "Արտահանել բոլորը",
2297
+ "present": "Ներկա",
2298
+ "notPresent": "Ոչ ներկա",
2299
+ "supported": "Աջակցվում է",
2300
+ "viewHost": "Դիտել հոսթը",
2301
+ "viewCluster": "Դիտել կլաստերը",
2302
+ "viewDatacenter": "Դիտել տվյալների կենտրոնը",
2303
+ "viewDatastore": "Դիտել տվյալների պահեստը",
2304
+ "viewFolder": "Դիտել թղթապանակը",
2305
+ "viewDatastoreCluster": "Դիտել տվյալների պահեստի կլաստերը",
2306
+ "viewHostProfile": "Դիտել հոսթի պրոֆիլը",
2307
+ "viewNetwork": "Դիտել ցանցը",
2308
+ "viewResourcePool": "Դիտել ռեսուրսների փուլը",
2309
+ "viewVApps": "Դիտել հավելվածները",
2310
+ "viewVirtualMachine": "Դիտել վիրտուալ մեքենան",
2311
+ "viewVMTemplate": "Դիտել վիրտուալ մեքենայի ձևանմուշը"
2297
2312
  },
2298
2313
  "auth": {
2299
2314
  "welcomeTo": "Բարի գալուստ",
@@ -2708,7 +2723,6 @@
2708
2723
  "timeToShouldBeLaterTimeFrom": "Նշված ժամանակային միջակայքն անընդունելի է: \"Նախքան\" ամսաթիվը պետք է լինի ավելի ուշ, քան \"from\"ամսաթիվը:",
2709
2724
  "timeRangeShouldNotBeSmallerThanHour": "The specified time range is not valid. It should not be smaller than 1 hour.",
2710
2725
  "timeRangeShouldNotBeMoreThanMonth": "Նշված ժամանակային միջակայքը վավեր չէ: Այն չպետք է լինի 1 ամսից ավելի։",
2711
- "timeRangeShouldNotBeMoreThanValidTo": "Նշված ժամանակային միջակայքը վավեր չէ: Այն չպետք է լինի {0}-ից ավելի:",
2712
2726
  "overview": "Ակնարկ",
2713
2727
  "spaceUtilization": "Օգտագործելով տարածություն",
2714
2728
  "changeCustomInterval": "Փոխեք օգտագործողի միջակայքը",
@@ -2292,7 +2292,22 @@
2292
2292
  "searchHere": "Мұнда іздеңіз...",
2293
2293
  "columns": "Бағандар",
2294
2294
  "exportSelected": "Таңдалған Экспорттау",
2295
- "exportAll": "Барлығын Экспорттау"
2295
+ "exportAll": "Барлығын Экспорттау",
2296
+ "present": "Қазіргі",
2297
+ "notPresent": "Жоқ",
2298
+ "supported": "Қолдау көрсетіледі",
2299
+ "viewHost": "Хостты Қарау",
2300
+ "viewCluster": "Кластерді Қарау",
2301
+ "viewDatacenter": "Деректер Орталығын Қарау",
2302
+ "viewDatastore": "Деректер Қоймасын Қарау",
2303
+ "viewFolder": "Қалтаны Қарау",
2304
+ "viewDatastoreCluster": "Деректер Қоймасының Кластерін Қарау",
2305
+ "viewHostProfile": "Хост Профилін Қарау",
2306
+ "viewNetwork": "Желіні Қарау",
2307
+ "viewResourcePool": "Ресурстар Пулын Қарау",
2308
+ "viewVApps": "VApps Көру",
2309
+ "viewVirtualMachine": "Виртуалды Машинаны Қарау",
2310
+ "viewVMTemplate": "Виртуалды машина Үлгісін көру"
2296
2311
  },
2297
2312
  "auth": {
2298
2313
  "welcomeTo": "Қош келдіңіз",
@@ -2707,7 +2722,6 @@
2707
2722
  "timeToShouldBeLaterTimeFrom": "The specified time range is not valid. The \"to\" date should be later than the \"from\" date.",
2708
2723
  "timeRangeShouldNotBeSmallerThanHour": "The specified time range is not valid. It should not be smaller than 1 hour.",
2709
2724
  "timeRangeShouldNotBeMoreThanMonth": "Көрсетілген уақыт аралығы жарамсыз. 1 айдан аспауы керек.",
2710
- "timeRangeShouldNotBeMoreThanValidTo": "Көрсетілген уақыт аралығы жарамсыз. Ол {0} аспауы керек.",
2711
2725
  "overview": "Шолу",
2712
2726
  "spaceUtilization": "Кеңістікті пайдалану",
2713
2727
  "changeCustomInterval": "Пайдаланушы аралығын өзгертіңіз",
@@ -2294,7 +2294,22 @@
2294
2294
  "searchHere": "Искать здесь...",
2295
2295
  "columns": "Столбцы",
2296
2296
  "exportSelected": "Экспортировать выбранные",
2297
- "exportAll": "Экспортировать все"
2297
+ "exportAll": "Экспортировать все",
2298
+ "present": "Присутствует",
2299
+ "notPresent": "Не присутствует",
2300
+ "supported": "Поддерживаемый",
2301
+ "viewHost": "Просмотр хоста",
2302
+ "viewCluster": "Просмотр кластера",
2303
+ "viewDatacenter": "Просмотр центра обработки данных",
2304
+ "viewDatastore": "Просмотр хранилища данных",
2305
+ "viewFolder": "Просмотр папки",
2306
+ "viewDatastoreCluster": "Просмотр кластера хранилищ данных",
2307
+ "viewHostProfile": "Просмотр профиля хоста",
2308
+ "viewNetwork": "Просмотр сети",
2309
+ "viewResourcePool": "Просмотр пула ресурсов",
2310
+ "viewVApps": "Просмотр приложений",
2311
+ "viewVirtualMachine": "Просмотр виртуальной машины",
2312
+ "viewVMTemplate": "Просмотр шаблона вм"
2298
2313
  },
2299
2314
  "auth": {
2300
2315
  "welcomeTo": "Добро пожаловать в",
@@ -2709,7 +2724,6 @@
2709
2724
  "timeToShouldBeLaterTimeFrom": "Указанный диапазон времени недопустим. Дата \"до\" должна быть позже даты \"от\".",
2710
2725
  "timeRangeShouldNotBeSmallerThanHour": "Указанный диапазон времени недопустим. Он не должен быть меньше 1 часа.",
2711
2726
  "timeRangeShouldNotBeMoreThanMonth": "Указанный диапазон времени недействителен. Он не должен быть больше 1 месяца.",
2712
- "timeRangeShouldNotBeMoreThanValidTo": "Указанный временной диапазон недействителен. Он не должен быть больше {0}.",
2713
2727
  "overview": "Обзор",
2714
2728
  "spaceUtilization": "Использование пространства",
2715
2729
  "changeCustomInterval": "Измените пользовательский интервал",
@@ -2291,7 +2291,22 @@
2291
2291
  "searchHere": "在这里搜索。。。",
2292
2292
  "columns": "列",
2293
2293
  "exportSelected": "选择导出",
2294
- "exportAll": "全部出口"
2294
+ "exportAll": "全部出口",
2295
+ "present": "现在",
2296
+ "notPresent": "不在场",
2297
+ "supported": "支持",
2298
+ "viewHost": "查看主机",
2299
+ "viewCluster": "视图集群",
2300
+ "viewDatacenter": "查看数据中心",
2301
+ "viewDatastore": "查看数据存储",
2302
+ "viewFolder": "查看文件夹",
2303
+ "viewDatastoreCluster": "查看数据存储集群",
2304
+ "viewHostProfile": "查看主机配置文件",
2305
+ "viewNetwork": "查看网络",
2306
+ "viewResourcePool": "查看资源池",
2307
+ "viewVApps": "查看Vapp",
2308
+ "viewVirtualMachine": "查看虚拟机",
2309
+ "viewVMTemplate": "查看VM模板"
2295
2310
  },
2296
2311
  "auth": {
2297
2312
  "welcomeTo": "欢迎来到",
@@ -2706,7 +2721,6 @@
2706
2721
  "timeToShouldBeLaterTimeFrom": "指定的时间范围无效。 “结束”日期应晚于“开始”日期。",
2707
2722
  "timeRangeShouldNotBeSmallerThanHour": "指定的时间范围无效。 不应小于1小时。",
2708
2723
  "timeRangeShouldNotBeMoreThanMonth": "指定的时间范围无效。它不应超过 1 个月。",
2709
- "timeRangeShouldNotBeMoreThanValidTo": "指定的时间范围无效。它不应超过 {0}。",
2710
2724
  "overview": "概述",
2711
2725
  "spaceUtilization": "空间利用",
2712
2726
  "changeCustomInterval": "更改自定义间隔",
@@ -16,7 +16,13 @@
16
16
  />
17
17
  </button>
18
18
  <Teleport to="body">
19
- <ul v-show="open" class="select-menu" :style="selectMenuStyles">
19
+ <ul
20
+ v-show="open"
21
+ @mouseenter="hover = true"
22
+ @mouseleave="hover = false"
23
+ class="select-menu"
24
+ :style="selectMenuStyles"
25
+ >
20
26
  <li
21
27
  v-for="item in props.options"
22
28
  :id="`${props.testId}-item`"
@@ -61,6 +67,7 @@ const select = (value: number | string): void => {
61
67
  if (!selectedItem) return
62
68
 
63
69
  emits('update:model-value', selectedItem.value)
70
+ hideMenu(true)
64
71
  }
65
72
  const showMenu = (): void => {
66
73
  if (open.value) {
@@ -159,6 +166,8 @@ onUnmounted(() => {
159
166
  margin-top: 2px;
160
167
  background-color: var(--global-bg-color);
161
168
  padding: 12px 0;
169
+ max-height: 200px;
170
+ overflow: auto;
162
171
 
163
172
  .select-item {
164
173
  color: var(--global-font-color3);
@@ -1 +1 @@
1
- export type UI_T_BlocksWidth = [number, number, number]
1
+ export type UI_T_BlocksWidth = [number, number, number]
@@ -1,5 +1,5 @@
1
- export interface UI_I_FileInfo {
2
- type: string
3
- title: string
4
- value: string | number
5
- }
1
+ export interface UI_I_FileInfo {
2
+ type: string
3
+ title: string
4
+ value: string | number
5
+ }
@@ -1,211 +1,211 @@
1
- <template>
2
- <template v-if="!props.inPortlet">
3
- <div class="diagram-header">
4
- <div class="diagram-header-left">
5
- <atoms-the-icon
6
- name="angle"
7
- :class="[
8
- 'diagram-header__arrow-icon',
9
- {
10
- open: props.isShowDiagram,
11
- },
12
- ]"
13
- :data-id="`${props.testId}-toggle-icon`"
14
- @click="onToggleDiagram"
15
- />
16
- <a>
17
- <span>
18
- {{ localization.common.standardSwitch }}:
19
- {{ props.diagramName }}
20
- </span>
21
- </a>
22
- </div>
23
- <div v-if="props.isShowDiagram" class="diagram-header__btn-container">
24
- <span class="vertical-separator"></span>
25
- <button
26
- id="add-networking-button"
27
- :data-id="`${props.testId}-add-networking-button`"
28
- type="button"
29
- @click="onShowModal('add-networking', props.diagramName)"
30
- >
31
- {{ localization.common.addNetworking }}
32
- </button>
33
- <button
34
- id="switch-edit-button"
35
- :data-id="`${props.testId}-edit-button`"
36
- type="button"
37
- @click="onShowModal('switch-edit')"
38
- >
39
- {{ localization.common.edit }}
40
- </button>
41
- <button
42
- id="switch-manage-physical-adapters-button"
43
- :data-id="`${props.testId}-manage-physical-adapters-button`"
44
- type="button"
45
- @click="onShowModal('switch-manage-physical-adapters')"
46
- >
47
- {{ localization.common.managePhysicalAdapters }}
48
- </button>
49
- <div class="diagram-main-actions-dots">
50
- <atoms-collapse-nav
51
- popup-class="diagram-main-actions__popup"
52
- :close-after-click="true"
53
- :items="switchMainNavigation"
54
- :test-id="`${props.testId}-actions`"
55
- @change="onShowModal"
56
- />
57
- </div>
58
- </div>
59
- </div>
60
- <hr class="horizontal-separator" />
61
- </template>
62
- </template>
63
-
64
- <script setup lang="ts">
65
- import type { UI_I_Localization } from '~/lib/models/interfaces'
66
- import type {
67
- UI_I_NavigationItem,
68
- UI_I_ModalsInitialData,
69
- } from '~/components/common/diagramMain/lib/models/interfaces'
70
- import { switchMainNavigationFunc } from '~/components/common/diagramMain/modals/lib/config'
71
-
72
- const props = defineProps<{
73
- inPortlet: boolean
74
- isShowDiagram: boolean
75
- diagramName: string
76
- testId: string
77
- }>()
78
-
79
- const emits = defineEmits<{
80
- (event: 'toggle-diagram'): void
81
- (
82
- event: 'show-modal',
83
- modalName: string,
84
- properties?: UI_I_ModalsInitialData
85
- ): void
86
- }>()
87
-
88
- const localization = computed<UI_I_Localization>(() => useLocal())
89
-
90
- const switchMainNavigation = computed<UI_I_NavigationItem[]>(() =>
91
- switchMainNavigationFunc(localization.value, props.testId)
92
- )
93
-
94
- const onToggleDiagram = () => emits('toggle-diagram')
95
-
96
- const onShowModal = (modalName: string, diagramName?: string) =>
97
- diagramName
98
- ? emits('show-modal', modalName, { switch_name: diagramName })
99
- : emits('show-modal', modalName)
100
- </script>
101
-
102
- <style scoped lang="scss">
103
- :root.dark-theme {
104
- .diagram-header {
105
- &-left {
106
- a {
107
- span {
108
- color: #79c6e6;
109
-
110
- &:hover {
111
- color: #49afd9;
112
- }
113
- }
114
- }
115
- }
116
-
117
- &__btn-container {
118
- button {
119
- color: #89cbdf;
120
-
121
- &:hover {
122
- color: #57c8ea;
123
- }
124
- }
125
- }
126
- }
127
- }
128
-
129
- .diagram-header {
130
- display: flex;
131
- padding-left: 8px;
132
- a {
133
- color: #0072a3;
134
- cursor: pointer;
135
- font-weight: 700;
136
- user-select: none;
137
- line-height: 20px;
138
- span {
139
- font-weight: 700;
140
- }
141
- }
142
-
143
- &-left {
144
- display: flex;
145
- flex-wrap: nowrap;
146
- color: #49afd9;
147
- }
148
-
149
- &__arrow-icon {
150
- width: 16px;
151
- height: 16px;
152
- margin-right: 4px;
153
- transform: rotate(90deg);
154
- align-self: center;
155
- fill: var(--triger-icon-color);
156
- cursor: pointer;
157
- &.open {
158
- transform: rotate(180deg);
159
- }
160
- }
161
-
162
- &__btn-container {
163
- display: flex;
164
-
165
- button {
166
- font-size: 11px;
167
- height: 24px;
168
- border: none;
169
- background: none;
170
- margin-right: 0;
171
- cursor: pointer;
172
- display: inline-block;
173
- white-space: nowrap;
174
- text-align: center;
175
- text-transform: uppercase;
176
- color: #49afd9;
177
- line-height: 20px;
178
- max-height: 16.8px;
179
- padding: 0 14px;
180
- font-weight: 500;
181
- letter-spacing: 1px;
182
-
183
- &:hover {
184
- color: #004d8a;
185
- }
186
- }
187
- }
188
- }
189
-
190
- .diagram-main-actions-dots {
191
- position: relative;
192
- transform: translate(62px, -11px);
193
- }
194
-
195
- .horizontal-separator {
196
- margin: 5px 10px 10px;
197
- border-left: 0;
198
- border-right: 0;
199
- border-color: #ddd;
200
- box-sizing: content-box;
201
- height: 0;
202
- overflow: visible;
203
- border-top: 0px solid #eee;
204
- }
205
-
206
- .vertical-separator {
207
- border: 1px solid #ddd;
208
- border-left: none;
209
- margin: 0 3px 0 14px;
210
- }
211
- </style>
1
+ <template>
2
+ <template v-if="!props.inPortlet">
3
+ <div class="diagram-header">
4
+ <div class="diagram-header-left">
5
+ <atoms-the-icon
6
+ name="angle"
7
+ :class="[
8
+ 'diagram-header__arrow-icon',
9
+ {
10
+ open: props.isShowDiagram,
11
+ },
12
+ ]"
13
+ :data-id="`${props.testId}-toggle-icon`"
14
+ @click="onToggleDiagram"
15
+ />
16
+ <a>
17
+ <span>
18
+ {{ localization.common.standardSwitch }}:
19
+ {{ props.diagramName }}
20
+ </span>
21
+ </a>
22
+ </div>
23
+ <div v-if="props.isShowDiagram" class="diagram-header__btn-container">
24
+ <span class="vertical-separator"></span>
25
+ <button
26
+ id="add-networking-button"
27
+ :data-id="`${props.testId}-add-networking-button`"
28
+ type="button"
29
+ @click="onShowModal('add-networking', props.diagramName)"
30
+ >
31
+ {{ localization.common.addNetworking }}
32
+ </button>
33
+ <button
34
+ id="switch-edit-button"
35
+ :data-id="`${props.testId}-edit-button`"
36
+ type="button"
37
+ @click="onShowModal('switch-edit')"
38
+ >
39
+ {{ localization.common.edit }}
40
+ </button>
41
+ <button
42
+ id="switch-manage-physical-adapters-button"
43
+ :data-id="`${props.testId}-manage-physical-adapters-button`"
44
+ type="button"
45
+ @click="onShowModal('switch-manage-physical-adapters')"
46
+ >
47
+ {{ localization.common.managePhysicalAdapters }}
48
+ </button>
49
+ <div class="diagram-main-actions-dots">
50
+ <atoms-collapse-nav
51
+ popup-class="diagram-main-actions__popup"
52
+ :close-after-click="true"
53
+ :items="switchMainNavigation"
54
+ :test-id="`${props.testId}-actions`"
55
+ @change="onShowModal"
56
+ />
57
+ </div>
58
+ </div>
59
+ </div>
60
+ <hr class="horizontal-separator" />
61
+ </template>
62
+ </template>
63
+
64
+ <script setup lang="ts">
65
+ import type { UI_I_Localization } from '~/lib/models/interfaces'
66
+ import type {
67
+ UI_I_NavigationItem,
68
+ UI_I_ModalsInitialData,
69
+ } from '~/components/common/diagramMain/lib/models/interfaces'
70
+ import { switchMainNavigationFunc } from '~/components/common/diagramMain/modals/lib/config'
71
+
72
+ const props = defineProps<{
73
+ inPortlet: boolean
74
+ isShowDiagram: boolean
75
+ diagramName: string
76
+ testId: string
77
+ }>()
78
+
79
+ const emits = defineEmits<{
80
+ (event: 'toggle-diagram'): void
81
+ (
82
+ event: 'show-modal',
83
+ modalName: string,
84
+ properties?: UI_I_ModalsInitialData
85
+ ): void
86
+ }>()
87
+
88
+ const localization = computed<UI_I_Localization>(() => useLocal())
89
+
90
+ const switchMainNavigation = computed<UI_I_NavigationItem[]>(() =>
91
+ switchMainNavigationFunc(localization.value, props.testId)
92
+ )
93
+
94
+ const onToggleDiagram = () => emits('toggle-diagram')
95
+
96
+ const onShowModal = (modalName: string, diagramName?: string) =>
97
+ diagramName
98
+ ? emits('show-modal', modalName, { switch_name: diagramName })
99
+ : emits('show-modal', modalName)
100
+ </script>
101
+
102
+ <style scoped lang="scss">
103
+ :root.dark-theme {
104
+ .diagram-header {
105
+ &-left {
106
+ a {
107
+ span {
108
+ color: #79c6e6;
109
+
110
+ &:hover {
111
+ color: #49afd9;
112
+ }
113
+ }
114
+ }
115
+ }
116
+
117
+ &__btn-container {
118
+ button {
119
+ color: #89cbdf;
120
+
121
+ &:hover {
122
+ color: #57c8ea;
123
+ }
124
+ }
125
+ }
126
+ }
127
+ }
128
+
129
+ .diagram-header {
130
+ display: flex;
131
+ padding-left: 8px;
132
+ a {
133
+ color: #0072a3;
134
+ cursor: pointer;
135
+ font-weight: 700;
136
+ user-select: none;
137
+ line-height: 20px;
138
+ span {
139
+ font-weight: 700;
140
+ }
141
+ }
142
+
143
+ &-left {
144
+ display: flex;
145
+ flex-wrap: nowrap;
146
+ color: #49afd9;
147
+ }
148
+
149
+ &__arrow-icon {
150
+ width: 16px;
151
+ height: 16px;
152
+ margin-right: 4px;
153
+ transform: rotate(90deg);
154
+ align-self: center;
155
+ fill: var(--triger-icon-color);
156
+ cursor: pointer;
157
+ &.open {
158
+ transform: rotate(180deg);
159
+ }
160
+ }
161
+
162
+ &__btn-container {
163
+ display: flex;
164
+
165
+ button {
166
+ font-size: 11px;
167
+ height: 24px;
168
+ border: none;
169
+ background: none;
170
+ margin-right: 0;
171
+ cursor: pointer;
172
+ display: inline-block;
173
+ white-space: nowrap;
174
+ text-align: center;
175
+ text-transform: uppercase;
176
+ color: #49afd9;
177
+ line-height: 20px;
178
+ max-height: 16.8px;
179
+ padding: 0 14px;
180
+ font-weight: 500;
181
+ letter-spacing: 1px;
182
+
183
+ &:hover {
184
+ color: #004d8a;
185
+ }
186
+ }
187
+ }
188
+ }
189
+
190
+ .diagram-main-actions-dots {
191
+ position: relative;
192
+ transform: translate(62px, -11px);
193
+ }
194
+
195
+ .horizontal-separator {
196
+ margin: 5px 10px 10px;
197
+ border-left: 0;
198
+ border-right: 0;
199
+ border-color: #ddd;
200
+ box-sizing: content-box;
201
+ height: 0;
202
+ overflow: visible;
203
+ border-top: 0px solid #eee;
204
+ }
205
+
206
+ .vertical-separator {
207
+ border: 1px solid #ddd;
208
+ border-left: none;
209
+ margin: 0 3px 0 14px;
210
+ }
211
+ </style>