bfg-common 1.5.771 → 1.5.774

package/assets/localization/local_be.json

@@ -655,6 +655,7 @@
     "haProtection": "Абарона HA",
     "hardDisk": "Жорсткі дыск",
     "hardStop": "Жорсткая прыпынак",
+    "hardStop1": "Жорсткае прыпынак",
     "hardware": "Абсталяванне",
     "hardwareAcceleration": "Апаратнае паскарэнне",
     "hardwareHealth": "Працаздольнасць абсталявання",
@@ -2046,6 +2047,7 @@
     "cPUUsageMHzDuringInterval": "Загрузка працэсара ў МГц на працягу інтэрвалу",
     "usageCoreCount": "Выкарыстанне для ядра {0}",
     "hardStopConfirmation": "Пацверджанне жорсткага прыпынку",
+    "hardStopVm": "Жорсткае спыненне віртуальнай машыны",
     "confirmHardStopVmOperation": "Пацвердзіце прымусовае спыненне працы віртуальнай машыны.",
     "confirmGroupHardStopVmOperation": "Пацвердзіце прымусовую спыненне працы {0} віртуальных машын.",
     "confirmHardStopVmOperationFirstDescription": "Аперацыя жорсткага спынення завяршае ўсе бягучыя працэсы і неадкладна выключае віртуальную машыну. Працяг гэтай аперацыі можа прывесці да страты незахаваных дадзеных або нечаканага прастою.",
@@ -2694,6 +2696,7 @@
     "selectAdvancedAction": "Выберыце пашыранае дзеянне",
     "migrateVm": "Перанос віртуальнай машыны",
     "powerOffVm": "Выключыце віртуальную машыну",
+    "powerOffVirtualMachine": "Выключыце віртуальную машыну",
     "powerOffConfirmation": "Пацверджанне адключэння",
     "powerOffConfirmationDesc": "Вы ўпэўненыя, што хочаце выключыць віртуальную машыну “{0}”?",
     "powerOnVm": "Ўключэнне харчавання віртуальнай машыны",

package/assets/localization/local_en.json

@@ -654,6 +654,7 @@
     "haProtection": "HA Protection",
     "hardDisk": "Hard Disk",
     "hardStop": "Hard Stop",
+    "hardStop1": "Hard Stop",
     "hardware": "Hardware",
     "hardwareAcceleration": "Hardware Acceleration",
     "hardwareHealth": "Hardware Health",
@@ -2049,6 +2050,7 @@
     "cPUUsageMHzDuringInterval": "CPU usage in MHz during the interval",
     "usageCoreCount": "Usage for core {0}",
     "hardStopConfirmation": "Hard Stop Confirmation",
+    "hardStopVm": "Hard Stop Virtual Machine",
     "confirmHardStopVmOperation": "Confirm the forced stop of the virtual machine.",
     "confirmGroupHardStopVmOperation": "Confirm the forced stop of {0} virtual machines.",
     "confirmHardStopVmOperationFirstDescription": "The hard stop operation terminates all currently running processes and immediately powers off the virtual machine. Continuing this operation may result in the loss of unsaved data or unexpected downtime.",
@@ -2698,6 +2700,7 @@
     "selectAdvancedAction": "Select an advanced action",
     "migrateVm": "Migrate VM",
     "powerOffVm": "Power off VM",
+    "powerOffVirtualMachine": "Power Off Virtual Machine",
     "powerOffConfirmation": "Power Off Confirmation",
     "powerOffConfirmationDesc": "Are you sure you want to power off the “{0}” virtual machine?",
     "powerOnVm": "Power on VM",

package/assets/localization/local_hy.json

@@ -654,6 +654,7 @@
     "haProtection": "Բարձր մատչելիության պաշտպանություն",
     "hardDisk": "Կոշտ սկավառակ",
     "hardStop": "Կոշտ կանգառ",
+    "hardStop1": "Կոշտ կանգառ",
     "hardware": "Սարքավորումների անվտանգություն",
     "hardwareAcceleration": "Սարքավորումների արագացում",
     "hardwareHealth": "Սարքավորումների գործունակությունը",
@@ -2049,6 +2050,7 @@
     "cPUUsageMHzDuringInterval": "Պրոցեսորի օգտագործումը ՄՀց միջակայքում",
     "usageCoreCount": "Օգտագործում միջուկի համար {0}",
     "hardStopConfirmation": "Հարկադիր կանգառի հաստատում",
+    "hardStopVm": "Վիրտուալ մեքենայի հարկադիր կանգառ",
     "confirmHardStopVmOperation": "Հաստատեք վիրտուալ մեքենայի հարկադիր կանգառը։",
     "confirmGroupHardStopVmOperation": "Հաստատեք {0} վիրտուալ մեքենաների հարկադրանքով դադարեցումը:",
     "confirmHardStopVmOperationFirstDescription": "Կոշտ կանգնեցման գործողությունը դադարեցնում է բոլոր ընթացիկ գործընթացները և անմիջապես անջատում վիրտուալ մեքենան: Այս գործողությունը շարունակելը կարող է հանգեցնել չպահպանված տվյալների կորստի կամ անսպասելի դադարի:",
@@ -2698,6 +2700,7 @@
     "selectAdvancedAction": "Ընտրեք Ընդլայնված գործողություն",
     "migrateVm": "Վիրտուալ մեքենայի փոխանցում",
     "powerOffVm": "Անջատեք վիրտուալ մեքենան",
+    "powerOffVirtualMachine": "Անջատել վիրտուալ մեքենան",
     "powerOffConfirmation": "Անջատման հաստատում",
     "powerOffConfirmationDesc": "Վստա՞հ եք, որ ուզում եք անջատել “{0}” վիրտուալ մեքենան։",
     "powerOnVm": "Վիրտուալ մեքենայի էլեկտրամատակարարում",

package/assets/localization/local_kk.json

@@ -654,6 +654,7 @@
     "haProtection": "Abarona жоғары қолжетімділігі",
     "hardDisk": "Цверды дискі",
     "hardStop": "Zhorstka prypynak",
+    "hardStop1": "Zhorstka prypynak",
     "hardware": "Аппараттық қауіпсіздік",
     "hardwareAcceleration": "Аппараттық жеделдету",
     "hardwareHealth": "Жабдықтың өнімділігі",
@@ -2048,6 +2049,7 @@
     "cPUUsageMHzDuringInterval": "Аралық кезінде Мгц ЖИІЛІКТЕГІ ПРОЦЕССОРДЫ пайдалану",
     "usageCoreCount": "Ядро үшін пайдалану {0}",
     "hardStopConfirmation": "Қатты аялдаманы растау",
+    "hardStopVm": "Қатты тоқтату виртуалды машинасы",
     "confirmHardStopVmOperation": "Виртуалды машинаның мәжбүрлі тоқтауын растаңыз.",
     "confirmGroupHardStopVmOperation": "{0} виртуалды машинаның жұмысын мәжбүрлеп тоқтатуды растаңыз.",
     "confirmHardStopVmOperationFirstDescription": "Қатты тоқтату әрекеті барлық ағымдағы жұмыс істеп тұрған процестерді тоқтатады және виртуалды машинаны дереу өшіреді. Бұл әрекетті жалғастыру сақталмаған деректердің жоғалуына немесе күтпеген тоқтап қалуға әкелуі мүмкін.",
@@ -2697,6 +2699,7 @@
     "selectAdvancedAction": "Кеңейтілген әрекетті таңдаңыз",
     "migrateVm": "VM тасымалдау",
     "powerOffVm": "VM өшіріңіз",
+    "powerOffVirtualMachine": "Виртуалды машинасын өшіріңіз",
     "powerOffConfirmation": "Қуатты өшіруді растау",
     "powerOffConfirmationDesc": "“{0}” виртуалды машинасын шынымен өшіргіңіз келе ме?",
     "powerOnVm": "VM қосыңыз",

package/assets/localization/local_ru.json

@@ -654,6 +654,7 @@
     "haProtection": "Защита высокой доступности",
     "hardDisk": "Жесткий диск",
     "hardStop": "Жесткая остановка",
+    "hardStop1": "Жестко остановить",
     "hardware": "Аппаратное обеспечение",
     "hardwareAcceleration": "Аппаратное ускорение",
     "hardwareHealth": "Работоспособность оборудования",
@@ -2048,6 +2049,7 @@
     "cPUUsageMHzDuringInterval": "Загрузка процессора в МГц в течение интервала",
     "usageCoreCount": "Использование для ядра {0}",
     "hardStopConfirmation": "Подтвердите принудительную остановку",
+    "hardStopVm": "Жестко остановить виртуальную машину",
     "confirmHardStopVmOperation": "Подтвердите принудительную остановку работы виртуальной машины.",
     "confirmGroupHardStopVmOperation": "Подтвердите принудительную остановку работы {0} виртуальных машин.",
     "confirmHardStopVmOperationFirstDescription": "Операция жёсткой остановки завершает все текущие процессы и немедленно отключает виртуальную машину. Продолжение этой операции может привести к потере несохранённых данных или непредвиденному простою.",
@@ -2697,6 +2699,7 @@
     "selectAdvancedAction": "Выберите расширенное действие",
     "migrateVm": "Перенос ВМ",
     "powerOffVm": "Выключите ВМ",
+    "powerOffVirtualMachine": "Выключить виртуальную машину",
     "powerOffConfirmation": "Подтверждение выключения",
     "powerOffConfirmationDesc": "Вы уверены, что хотите выключить виртуальную машину “{0}”?",
     "powerOnVm": "Включение питания ВМ",

package/assets/localization/local_zh.json

@@ -654,6 +654,7 @@
     "haProtection": "高可用性保护",
     "hardDisk": "硬盘",
     "hardStop": "急停",
+    "hardStop1": "急停",
     "hardware": "硬件",
     "hardwareAcceleration": "硬件加速",
     "hardwareHealth": "硬件健康",
@@ -2047,6 +2048,7 @@
     "cPUUsageMHzDuringInterval": "时间间隔内的 CPU 使用情况（以 MHz 为单位）",
     "usageCoreCount": "核心 {0} 的用法",
     "hardStopConfirmation": "硬停止确认",
+    "hardStopVm": "硬停止虚拟机",
     "confirmHardStopVmOperation": "确认强制停止虚拟机。",
     "confirmGroupHardStopVmOperation": "请确认强制停止 {0} 台虚拟机的运行。",
     "confirmHardStopVmOperationFirstDescription": "强制停止操作会终止所有当前正在运行的进程并立即关闭虚拟机。继续执行此操作可能会导致未保存的数据丢失或意外停机。",
@@ -2695,6 +2697,7 @@
     "selectAdvancedAction": "选择高级操作",
     "migrateVm": "迁移虚拟机",
     "powerOffVm": "关闭虚拟机",
+    "powerOffVirtualMachine": "关闭虚拟机",
     "powerOffConfirmation": "断电确认",
     "powerOffConfirmationDesc": "您确定要关闭 “{0}” 虚拟机吗？",
     "powerOnVm": "启动虚拟机",

package/components/atoms/TheIcon3.vue

@@ -1,50 +1,50 @@
-<template>
-  <template v-if="props.name === 'zabbix'">
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="80"
-      height="22"
-      viewBox="0 0 80 22"
-      fill="none"
-    >
-      <g clip-path="url(#clip0_2691_29714)">
-        <path d="M0 0.522461H80V21.477H0V0.522461Z" fill="#D40000" />
-        <path
-          d="M3.42089 3.71582H14.9889V5.2187L5.6782 16.625H15.2164V18.2836H3.19336V16.7807L12.504 5.37438H3.42089V3.71582ZM23.0402 5.65779L20.3378 12.9087H25.7526L23.0402 5.65779ZM21.9145 3.71582H24.1738L29.7862 18.2836H27.7145L26.3753 14.5473H19.735L18.3938 18.2836H16.2922L21.9145 3.71582ZM33.9176 11.326V16.663H37.113C38.1848 16.663 38.9791 16.4434 39.496 16.0043C40.013 15.5652 40.2704 14.8926 40.2704 13.9905C40.2704 13.0804 40.013 12.4078 39.496 11.9747C38.9791 11.5436 38.1848 11.326 37.113 11.326H33.9176ZM33.9176 5.33446V9.72535H36.8675C37.8415 9.72535 38.566 9.54373 39.043 9.18447C39.52 8.82322 39.7575 8.27237 39.7575 7.5319C39.7575 6.79743 39.518 6.24657 39.043 5.88332C38.566 5.52008 37.8415 5.33646 36.8675 5.33646H33.9176V5.33446ZM31.9257 3.71582H37.0152C38.534 3.71582 39.7056 4.02717 40.5259 4.65188C41.3482 5.27658 41.7573 6.16474 41.7573 7.31635C41.7573 8.2065 41.5478 8.91703 41.1266 9.44393C40.7055 9.97084 40.0868 10.3002 39.2725 10.4299C40.2525 10.6375 41.0129 11.0706 41.5558 11.7312C42.0986 12.3918 42.3701 13.2161 42.3701 14.2041C42.3701 15.5054 41.923 16.5093 41.0289 17.2198C40.1347 17.9283 38.8614 18.2836 37.2128 18.2836H31.9257V3.71582ZM47.5573 11.326V16.663H50.7547C51.8265 16.663 52.6208 16.4434 53.1357 16.0043C53.6527 15.5652 53.9101 14.8926 53.9101 13.9905C53.9101 13.0804 53.6527 12.4078 53.1357 11.9747C52.6188 11.5436 51.8245 11.326 50.7547 11.326H47.5573ZM47.5573 5.33446V9.72535H50.5072C51.4812 9.72535 52.2057 9.54373 52.6827 9.18447C53.1597 8.82322 53.3972 8.27237 53.3972 7.5319C53.3972 6.79743 53.1597 6.24657 52.6827 5.88332C52.2057 5.52008 51.4812 5.33646 50.5072 5.33646H47.5573V5.33446ZM45.5654 3.71582H50.6549C52.1737 3.71582 53.3453 4.02717 54.1656 4.65188C54.9879 5.27658 55.399 6.16474 55.399 7.31635C55.399 8.2065 55.1895 8.91703 54.7683 9.44393C54.3472 9.97084 53.7285 10.3002 52.9142 10.4299C53.8942 10.6375 54.6546 11.0706 55.1975 11.7312C55.7403 12.3918 56.0118 13.2161 56.0118 14.2041C56.0118 15.5054 55.5647 16.5093 54.6706 17.2198C53.7764 17.9283 52.503 18.2836 50.8545 18.2836H45.5654V3.71582ZM64.9732 3.71582H67.1646L70.6274 8.94697L74.1242 3.71582H76.2418L71.6833 10.5397L76.8086 18.2836H74.6172L70.5835 12.1882L66.51 18.2836H64.3924L69.5297 10.5955L64.9732 3.71582ZM59.2031 3.71582H61.195V18.2836H59.2031V3.71582Z"
-          fill="white"
-        />
-      </g>
-      <defs>
-        <clipPath id="clip0_2691_29714">
-          <rect
-            width="80"
-            height="20.96"
-            fill="white"
-            transform="translate(0 0.519531)"
-          />
-        </clipPath>
-      </defs>
-    </svg>
-  </template>
-  <template v-else><span></span></template>
-</template>
-
-<script setup lang="ts">
-const props = withDefaults(
-  defineProps<{
-    name: string
-    type?: string
-    color?: string
-    width?: string
-    height?: string
-  }>(),
-  {
-    type: '',
-    color: 'currentColor',
-    width: '24',
-    height: '24',
-  }
-)
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+  <template v-if="props.name === 'zabbix'">
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="80"
+      height="22"
+      viewBox="0 0 80 22"
+      fill="none"
+    >
+      <g clip-path="url(#clip0_2691_29714)">
+        <path d="M0 0.522461H80V21.477H0V0.522461Z" fill="#D40000" />
+        <path
+          d="M3.42089 3.71582H14.9889V5.2187L5.6782 16.625H15.2164V18.2836H3.19336V16.7807L12.504 5.37438H3.42089V3.71582ZM23.0402 5.65779L20.3378 12.9087H25.7526L23.0402 5.65779ZM21.9145 3.71582H24.1738L29.7862 18.2836H27.7145L26.3753 14.5473H19.735L18.3938 18.2836H16.2922L21.9145 3.71582ZM33.9176 11.326V16.663H37.113C38.1848 16.663 38.9791 16.4434 39.496 16.0043C40.013 15.5652 40.2704 14.8926 40.2704 13.9905C40.2704 13.0804 40.013 12.4078 39.496 11.9747C38.9791 11.5436 38.1848 11.326 37.113 11.326H33.9176ZM33.9176 5.33446V9.72535H36.8675C37.8415 9.72535 38.566 9.54373 39.043 9.18447C39.52 8.82322 39.7575 8.27237 39.7575 7.5319C39.7575 6.79743 39.518 6.24657 39.043 5.88332C38.566 5.52008 37.8415 5.33646 36.8675 5.33646H33.9176V5.33446ZM31.9257 3.71582H37.0152C38.534 3.71582 39.7056 4.02717 40.5259 4.65188C41.3482 5.27658 41.7573 6.16474 41.7573 7.31635C41.7573 8.2065 41.5478 8.91703 41.1266 9.44393C40.7055 9.97084 40.0868 10.3002 39.2725 10.4299C40.2525 10.6375 41.0129 11.0706 41.5558 11.7312C42.0986 12.3918 42.3701 13.2161 42.3701 14.2041C42.3701 15.5054 41.923 16.5093 41.0289 17.2198C40.1347 17.9283 38.8614 18.2836 37.2128 18.2836H31.9257V3.71582ZM47.5573 11.326V16.663H50.7547C51.8265 16.663 52.6208 16.4434 53.1357 16.0043C53.6527 15.5652 53.9101 14.8926 53.9101 13.9905C53.9101 13.0804 53.6527 12.4078 53.1357 11.9747C52.6188 11.5436 51.8245 11.326 50.7547 11.326H47.5573ZM47.5573 5.33446V9.72535H50.5072C51.4812 9.72535 52.2057 9.54373 52.6827 9.18447C53.1597 8.82322 53.3972 8.27237 53.3972 7.5319C53.3972 6.79743 53.1597 6.24657 52.6827 5.88332C52.2057 5.52008 51.4812 5.33646 50.5072 5.33646H47.5573V5.33446ZM45.5654 3.71582H50.6549C52.1737 3.71582 53.3453 4.02717 54.1656 4.65188C54.9879 5.27658 55.399 6.16474 55.399 7.31635C55.399 8.2065 55.1895 8.91703 54.7683 9.44393C54.3472 9.97084 53.7285 10.3002 52.9142 10.4299C53.8942 10.6375 54.6546 11.0706 55.1975 11.7312C55.7403 12.3918 56.0118 13.2161 56.0118 14.2041C56.0118 15.5054 55.5647 16.5093 54.6706 17.2198C53.7764 17.9283 52.503 18.2836 50.8545 18.2836H45.5654V3.71582ZM64.9732 3.71582H67.1646L70.6274 8.94697L74.1242 3.71582H76.2418L71.6833 10.5397L76.8086 18.2836H74.6172L70.5835 12.1882L66.51 18.2836H64.3924L69.5297 10.5955L64.9732 3.71582ZM59.2031 3.71582H61.195V18.2836H59.2031V3.71582Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_2691_29714">
+          <rect
+            width="80"
+            height="20.96"
+            fill="white"
+            transform="translate(0 0.519531)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  </template>
+  <template v-else><span></span></template>
+</template>
+
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    name: string
+    type?: string
+    color?: string
+    width?: string
+    height?: string
+  }>(),
+  {
+    type: '',
+    color: 'currentColor',
+    width: '24',
+    height: '24',
+  }
+)
+</script>
+
+<style scoped lang="scss"></style>

package/components/atoms/collapse/CollapseNav.vue

@@ -1,170 +1,170 @@
-<template>
-  <div class="tabs-overflow bottom-right">
-    <button
-      :id="collapsedBtnId"
-      :class="[
-        'btn btn-link nav-link dropdown-toggle',
-        { active: collapsedBtnActive },
-      ]"
-      :data-id="`${props.testId}-toggle-button`"
-      @mouseenter="hover = true"
-      @mouseleave="hover = false"
-      @mousedown="showMenu"
-    >
-      <atoms-the-icon
-        :class="['collapse-icon', { active: open }]"
-        name="ellipsis-horizontal"
-        width="16px"
-        height="16px"
-      />
-    </button>
-
-    <Teleport to="body">
-      <ul
-        v-show="open"
-        :class="['navbar-dropdown-menu', props.popupClass]"
-        :style="dropdownMenuStyles"
-      >
-        <li
-          v-for="(item, key) in props.items"
-          :key="key"
-          v-permission="item.permission"
-          :title="item.title"
-          class="navbar-dropdown-menu-item"
-          @mousedown.stop
-        >
-          <div
-            v-if="item.separate"
-            class="navbar-dropdown-menu-separator"
-          ></div>
-          <atoms-collapse-nav-item
-            v-else
-            :is-link="props.isLink"
-            :item="item"
-            :value="value"
-            btn-class="btn"
-            @change="change"
-            @select-file="onSelectFile($event, key)"
-          />
-        </li>
-      </ul>
-    </Teleport>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
-
-const props = withDefaults(
-  defineProps<{
-    items: UI_I_CollapseNavItem[]
-    isLink?: boolean
-    value?: number | string
-    popupClass?: string
-    closeAfterClick?: boolean
-    testId?: string
-  }>(),
-  {
-    isLink: undefined,
-    value: undefined,
-    popupClass: undefined,
-    closeAfterClick: undefined,
-    testId: '',
-  }
-)
-const emits = defineEmits<{
-  (event: 'change', value: number): void
-  (event: 'select-file', value1: Event, value2: string, value3: number): void
-}>()
-
-const change = (value: number): void => {
-  emits('change', value)
-  props.closeAfterClick && (open.value = false)
-}
-const onSelectFile = (event: Event, type: string, key: number): void => {
-  emits('select-file', event, type, key)
-}
-
-const collapsedBtnId = ref<string>('')
-
-const route = useRoute()
-const collapsedBtnActive = computed<boolean>(() => {
-  if (props.isLink)
-    return props.items.some((item) => route.path.includes(item.path || ''))
-
-  return props.items.some((item) => item.value === props.value)
-})
-
-const open = ref<boolean>(false)
-const hover = ref<boolean>(false)
-const dropdownMenuStyles = ref<any>({})
-const showMenu = (): void => {
-  if (open.value) {
-    hideMenu(true)
-    return
-  }
-
-  open.value = true
-
-  const btn = document.querySelector(`#${collapsedBtnId.value}`)
-  const { top, height, right } = btn!.getBoundingClientRect()
-  dropdownMenuStyles.value = {
-    top: `${top + height}px`,
-    left: `${right}px`,
-  }
-}
-const hideMenu = (force?: boolean): void => {
-  if (hover.value && !force) return
-
-  open.value = false
-}
-
-const windowClick = (): void => {
-  hideMenu()
-}
-const windowResize = (): void => {
-  hideMenu(true)
-}
-onMounted(() => {
-  collapsedBtnId.value = `collapsed-btn${useUniqueId()}`
-  window.addEventListener('mousedown', windowClick)
-  window.addEventListener('resize', windowResize)
-})
-onUnmounted(() => {
-  window.removeEventListener('mousedown', windowClick)
-  window.removeEventListener('resize', windowResize)
-})
-</script>
-
-<style scoped lang="scss">
-.tabs-overflow {
-  position: absolute;
-  top: 0;
-  right: 24px;
-
-  .dropdown-toggle {
-    .collapse-icon {
-      fill: var(--main-color-mode);
-
-      &.active {
-        fill: #0077b8;
-      }
-    }
-  }
-}
-
-.navbar-dropdown-menu {
-  position: fixed;
-  z-index: var(--z-dropdown);
-  transform: translateX(-100%);
-  border: 1px solid var(--global-border-color);
-  border-radius: 3px;
-  margin-top: 2px;
-  background-color: var(--global-bg-color);
-  padding: 12px 0;
-}
-.navbar-dropdown-menu-separator {
-  margin: 6px 0;
-  border-bottom: 0.8px solid #e8e8e8;
-}
-</style>
+<template>
+  <div class="tabs-overflow bottom-right">
+    <button
+      :id="collapsedBtnId"
+      :class="[
+        'btn btn-link nav-link dropdown-toggle',
+        { active: collapsedBtnActive },
+      ]"
+      :data-id="`${props.testId}-toggle-button`"
+      @mouseenter="hover = true"
+      @mouseleave="hover = false"
+      @mousedown="showMenu"
+    >
+      <atoms-the-icon
+        :class="['collapse-icon', { active: open }]"
+        name="ellipsis-horizontal"
+        width="16px"
+        height="16px"
+      />
+    </button>
+
+    <Teleport to="body">
+      <ul
+        v-show="open"
+        :class="['navbar-dropdown-menu', props.popupClass]"
+        :style="dropdownMenuStyles"
+      >
+        <li
+          v-for="(item, key) in props.items"
+          :key="key"
+          v-permission="item.permission"
+          :title="item.title"
+          class="navbar-dropdown-menu-item"
+          @mousedown.stop
+        >
+          <div
+            v-if="item.separate"
+            class="navbar-dropdown-menu-separator"
+          ></div>
+          <atoms-collapse-nav-item
+            v-else
+            :is-link="props.isLink"
+            :item="item"
+            :value="value"
+            btn-class="btn"
+            @change="change"
+            @select-file="onSelectFile($event, key)"
+          />
+        </li>
+      </ul>
+    </Teleport>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
+
+const props = withDefaults(
+  defineProps<{
+    items: UI_I_CollapseNavItem[]
+    isLink?: boolean
+    value?: number | string
+    popupClass?: string
+    closeAfterClick?: boolean
+    testId?: string
+  }>(),
+  {
+    isLink: undefined,
+    value: undefined,
+    popupClass: undefined,
+    closeAfterClick: undefined,
+    testId: '',
+  }
+)
+const emits = defineEmits<{
+  (event: 'change', value: number): void
+  (event: 'select-file', value1: Event, value2: string, value3: number): void
+}>()
+
+const change = (value: number): void => {
+  emits('change', value)
+  props.closeAfterClick && (open.value = false)
+}
+const onSelectFile = (event: Event, type: string, key: number): void => {
+  emits('select-file', event, type, key)
+}
+
+const collapsedBtnId = ref<string>('')
+
+const route = useRoute()
+const collapsedBtnActive = computed<boolean>(() => {
+  if (props.isLink)
+    return props.items.some((item) => route.path.includes(item.path || ''))
+
+  return props.items.some((item) => item.value === props.value)
+})
+
+const open = ref<boolean>(false)
+const hover = ref<boolean>(false)
+const dropdownMenuStyles = ref<any>({})
+const showMenu = (): void => {
+  if (open.value) {
+    hideMenu(true)
+    return
+  }
+
+  open.value = true
+
+  const btn = document.querySelector(`#${collapsedBtnId.value}`)
+  const { top, height, right } = btn!.getBoundingClientRect()
+  dropdownMenuStyles.value = {
+    top: `${top + height}px`,
+    left: `${right}px`,
+  }
+}
+const hideMenu = (force?: boolean): void => {
+  if (hover.value && !force) return
+
+  open.value = false
+}
+
+const windowClick = (): void => {
+  hideMenu()
+}
+const windowResize = (): void => {
+  hideMenu(true)
+}
+onMounted(() => {
+  collapsedBtnId.value = `collapsed-btn${useUniqueId()}`
+  window.addEventListener('mousedown', windowClick)
+  window.addEventListener('resize', windowResize)
+})
+onUnmounted(() => {
+  window.removeEventListener('mousedown', windowClick)
+  window.removeEventListener('resize', windowResize)
+})
+</script>
+
+<style scoped lang="scss">
+.tabs-overflow {
+  position: absolute;
+  top: 0;
+  right: 24px;
+
+  .dropdown-toggle {
+    .collapse-icon {
+      fill: var(--main-color-mode);
+
+      &.active {
+        fill: #0077b8;
+      }
+    }
+  }
+}
+
+.navbar-dropdown-menu {
+  position: fixed;
+  z-index: var(--z-dropdown);
+  transform: translateX(-100%);
+  border: 1px solid var(--global-border-color);
+  border-radius: 3px;
+  margin-top: 2px;
+  background-color: var(--global-bg-color);
+  padding: 12px 0;
+}
+.navbar-dropdown-menu-separator {
+  margin: 6px 0;
+  border-bottom: 0.8px solid #e8e8e8;
+}
+</style>