bfg-common 1.1.58 → 1.1.60
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.
- package/assets/localization/local_be.json +2 -2
- package/assets/localization/local_en.json +1 -1
- package/assets/localization/local_hy.json +2 -2
- package/assets/localization/local_kk.json +2 -2
- package/assets/localization/local_ru.json +2 -2
- package/components/atoms/alert/Notification.vue +167 -167
- package/components/atoms/autocomplete/Autocomplete.vue +236 -236
- package/components/atoms/datepicker/Datepicker.vue +612 -612
- package/components/atoms/list/SelectList.vue +62 -62
- package/components/atoms/nav/NavBar.vue +116 -116
- package/components/atoms/nav/VerticalNavBar.vue +89 -89
- package/components/atoms/notificationBar/NotificationBar.vue +175 -175
- package/components/atoms/perPage/PerPage.vue +52 -52
- package/components/atoms/popup/SimplePopup.vue +90 -90
- package/components/atoms/step/VerticalStep.vue +104 -104
- package/components/atoms/switch/Switch.vue +107 -107
- package/components/atoms/table/dataGrid/DataGrid.vue +1471 -1476
- package/components/atoms/table/dataGrid/DataGridColumnSwitch.vue +206 -206
- package/components/atoms/table/dataGrid/DataGridPage.vue +189 -189
- package/components/atoms/tabs/Tabs.vue +189 -189
- package/components/atoms/tooltip/Signpost.vue +224 -224
- package/components/common/adapterManager/AddAdapterWarningModal.vue +82 -82
- package/components/common/adapterManager/NoActiveAdaptersModal.vue +62 -62
- package/components/common/adapterManager/NoConnectedActiveAdaptersModal.vue +62 -62
- package/components/common/browse/Browse.vue +182 -182
- package/components/common/browse/blocks/Title.vue +66 -66
- package/components/common/diagramMain/Diagram.vue +186 -186
- package/components/common/diagramMain/DiagramMain.vue +986 -986
- package/components/common/diagramMain/adapter/AdapterItem.vue +227 -227
- package/components/common/diagramMain/adapter/AdapterItems.vue +57 -57
- package/components/common/diagramMain/modals/editSettings/tabs/port/IpvFourSettings.vue +339 -339
- package/components/common/diagramMain/modals/editSettings/tabs/port/PortProperties.vue +202 -202
- package/components/common/diagramMain/modals/remove/RemoveModal.vue +226 -226
- package/components/common/diagramMain/network/Contents.vue +238 -238
- package/components/common/feedback/Buttons.vue +232 -232
- package/components/common/feedback/Message.vue +468 -468
- package/components/common/feedback/VisitPortal.vue +54 -54
- package/components/common/graph/Graph.vue +20 -18
- package/components/common/help/navbar/left/Left.vue +159 -159
- package/components/common/help/navbar/left/utils/constructAccordion.ts +27 -27
- package/components/common/mainNavigationPanel/MainNavigationPanel.vue +359 -359
- package/components/common/modals/Rename.vue +165 -165
- package/components/common/monitor/advanced/Advanced.vue +33 -3
- package/components/common/monitor/advanced/GraphView.vue +4 -4
- package/components/common/monitor/advanced/table/Table.vue +5 -5
- package/components/common/monitor/advanced/tools/Tools.vue +91 -27
- package/components/common/monitor/advanced/tools/chartOptionsModal/ChartOptionsModal.vue +101 -17
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/Counters.vue +25 -7
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/table/config/utils.ts +32 -0
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/table/models/interfaces.ts +1 -1
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/Timespan.vue +32 -3
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/form/Form.vue +25 -8
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/object/Object.vue +41 -19
- package/components/common/monitor/advanced/tools/chartOptionsModal/counters/timespan/object/models/interfaces.ts +1 -1
- package/components/common/monitor/advanced/tools/config/advancedToolbar.ts +50 -38
- package/components/common/monitor/advanced/tools/utils/countCores.ts +7 -0
- package/components/common/monitor/config/getValidDateByOption.ts +39 -1
- package/components/common/monitor/overview/filters/Filters.vue +6 -6
- package/components/common/monitor/overview/filters/customIntervalModal/CustomIntervalModal.vue +8 -8
- package/components/common/monitor/overview/filters/customIntervalModal/config/dateChecker.ts +1 -1
- package/components/common/perPage/PerPage.vue +51 -51
- package/components/common/recursionTree/RecursionTree.vue +201 -201
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/VirtualHardware.vue +642 -642
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDrive.vue +274 -274
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/cpu/Cpu.vue +375 -375
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/limit/Limit.vue +234 -234
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/limit/config/options.ts +28 -28
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/memory/Memory.vue +316 -316
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/memory/config/memoryOptions.ts +35 -35
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/newHardDisk/NewHardDisk.vue +447 -447
- package/components/common/vm/actions/add/customizeHardware/virtualHardware/reservation/Reservation.vue +235 -235
- package/components/common/vm/actions/add/select/storage/config/config.ts +154 -154
- package/components/common/wizards/datastore/add/nfs/configuration/Configuration.vue +373 -373
- package/components/common/wizards/datastore/add/nfs/configuration/serversList/ServersList.vue +123 -123
- package/components/common/wizards/datastore/add/nfs/kerberosAuthentication/KerberosAuthentication.vue +54 -54
- package/components/common/wizards/datastore/add/sharedStorm/deviceSelection/hostTable/HostTable.vue +131 -131
- package/components/common/wizards/datastore/add/sharedStorm/partitionConfiguration/PartitionConfiguration.vue +230 -230
- package/models/store/interfaces.ts +37 -37
- package/models/store/storage/interfaces.ts +32 -32
- package/models/store/types.ts +32 -32
- package/modules/fixContentBuild/utils/methods.ts +114 -114
- package/package.json +1 -1
- package/public/spice-console/application/codec.js +257 -257
- package/public/spice-console/lib/rasterEngine.js +907 -907
- package/public/spice-console/network/spicechannel.js +369 -369
- package/public/spice-console-minify/lib/decoder/dixie.min.js +4 -4
- package/public/spice-console-minify/lib/jgestures.min.js +24 -24
- package/public/spice-console-minify/lib/jquery-2.0.3.min.js +24 -24
- package/public/spice-console-minify/lib/jquery-mousewheel.min.js +11 -11
- package/public/spice-console-minify/lib/jquery-visibility.min.js +1 -1
- package/public/spice-console-minify/lib/lodash.4.0.0.min.js +5 -5
- package/utils/contentBuild.ts +34 -34
|
@@ -820,7 +820,7 @@
|
|
|
820
820
|
"launchConsole": "Запуск кансолі",
|
|
821
821
|
"launchRemoteConsole": "ЗАПУСК ВЫДАЛЕНАЙ КАНСОЛІ",
|
|
822
822
|
"launchWebConsole": "ЗАПУСК ВЭБ-КАНСОЛЬ",
|
|
823
|
-
"launchWebTerminal": "
|
|
823
|
+
"launchWebTerminal": "Запусціце вэб-тэрмінал",
|
|
824
824
|
"learnMore": "Даведайцеся больш",
|
|
825
825
|
"leaveAd": "Пакінуць рэкламу",
|
|
826
826
|
"leaveLockdownDefault": "Калі вы не ўпэўненыя, што рабіць, пакіньце рэжым блакавання адключаным. Вы можаце наладзіць рэжым блакавання пазней, адрэдагаваўшы профіль бяспекі ў наладах хаста",
|
|
@@ -1117,7 +1117,7 @@
|
|
|
1117
1117
|
"offlineOps": "Пазасеткавыя аперацыі.",
|
|
1118
1118
|
"ok": "добра",
|
|
1119
1119
|
"okOrCancelToReviewYourChanges": "Націсніце ОК, каб працягнуць, або Адмена, каб праглядзець унесеныя змены.",
|
|
1120
|
-
"oneOfSelectedDatesIsInTheFuture": "
|
|
1120
|
+
"oneOfSelectedDatesIsInTheFuture": "Ўказаны часовай дыяпазон недапушчальны. Адна з выбраных дат знаходзіцца ў будучыні.",
|
|
1121
1121
|
"opaqueNetwork": "Непразрыстая сетка",
|
|
1122
1122
|
"openId": "OpenID",
|
|
1123
1123
|
"openidAddress": "Адрас OpenID",
|
|
@@ -820,7 +820,7 @@
|
|
|
820
820
|
"launchConsole": "Launch Console",
|
|
821
821
|
"launchRemoteConsole": "LAUNCH REMOTE CONSOLE",
|
|
822
822
|
"launchWebConsole": "LAUNCH WEB CONSOLE",
|
|
823
|
-
"launchWebTerminal": "
|
|
823
|
+
"launchWebTerminal": "Launch web terminal",
|
|
824
824
|
"learnMore": "Learn more",
|
|
825
825
|
"leaveAd": "Leave Ad",
|
|
826
826
|
"leaveLockdownDefault": "If you are unsure what to do, leave lockdown mode disabled. You can configure lockdown mode later by editing Security Profile in host settings",
|
|
@@ -820,7 +820,7 @@
|
|
|
820
820
|
"launchConsole": "Գործարկել կոնսոլը",
|
|
821
821
|
"launchRemoteConsole": "ՍԿՍԵԼ ՀԵՌԱԿԱ ԿՈՆՍՈԼԸ",
|
|
822
822
|
"launchWebConsole": "ՍԿՍԵԼ ՎԵԲ ԿՈՆՍՈԼԸ",
|
|
823
|
-
"launchWebTerminal": "
|
|
823
|
+
"launchWebTerminal": "Գործարկել վեբ տերմինալը",
|
|
824
824
|
"learnMore": "Իմացեք ավելին",
|
|
825
825
|
"leaveAd": "Թողնել գովազդը",
|
|
826
826
|
"leaveLockdownDefault": "Եթե վստահ չեք, թե ինչ անել, թողեք արգելափակման ռեժիմն անջատված: Դուք կարող եք ավելի ուշ Կարգավորել արգելափակման ռեժիմը ՝ խմբագրելով անվտանգության պրոֆիլը հյուրընկալողի կարգավորումներում",
|
|
@@ -1117,7 +1117,7 @@
|
|
|
1117
1117
|
"offlineOps": "Անցանց գործողություններ",
|
|
1118
1118
|
"ok": "Լավ",
|
|
1119
1119
|
"okOrCancelToReviewYourChanges": "Կտտացրեք OK՝ շարունակելու համար կամ չեղարկել՝ ձեր կատարած փոփոխությունները դիտելու համար:",
|
|
1120
|
-
"oneOfSelectedDatesIsInTheFuture": "
|
|
1120
|
+
"oneOfSelectedDatesIsInTheFuture": "Նշված ժամանակային միջակայքն անընդունելի է: Ընտրված ամսաթվերից մեկը ապագայում է:",
|
|
1121
1121
|
"opaqueNetwork": "Անթափանց ցանց",
|
|
1122
1122
|
"openId": "OpenID",
|
|
1123
1123
|
"openidAddress": "OpenID հասցե",
|
|
@@ -820,7 +820,7 @@
|
|
|
820
820
|
"launchConsole": "Консольді іске қосыңыз",
|
|
821
821
|
"launchRemoteConsole": "ҚАШЫҚТАН ҚҰРЫЛҒАН ПОНСОЛЬДЫ БАСТАУ",
|
|
822
822
|
"launchWebConsole": "ВЕБ-КОНСОЛДЫ БАСТАУ",
|
|
823
|
-
"launchWebTerminal": "
|
|
823
|
+
"launchWebTerminal": "Веб терминалды іске қосыңыз",
|
|
824
824
|
"learnMore": "Даведазза үлкен",
|
|
825
825
|
"leaveAd": "Жарнаманы қалдырыңыз",
|
|
826
826
|
"leaveLockdownDefault": "Егер сіз не істеу керектігін білмесеңіз, құлыптау режимін өшіріңіз. Хост параметрлеріндегі қауіпсіздік профилін өңдеу арқылы құлыптау режимін кейінірек реттеуге болады",
|
|
@@ -1117,7 +1117,7 @@
|
|
|
1117
1117
|
"offlineOps": "Офлайн операциялар",
|
|
1118
1118
|
"ok": "ЖАРАЙДЫ МА",
|
|
1119
1119
|
"okOrCancelToReviewYourChanges": "Жалғастыру үшін OK немесе енгізілген өзгерістерді көру үшін Болдырмау түймесін басыңыз.",
|
|
1120
|
-
"oneOfSelectedDatesIsInTheFuture": "
|
|
1120
|
+
"oneOfSelectedDatesIsInTheFuture": "Көрсетілген уақыт диапазонына жол берілмейді. Таңдалған күндердің бірі болашақта.",
|
|
1121
1121
|
"opaqueNetwork": "Мөлдір емес желі",
|
|
1122
1122
|
"openId": "OpenID",
|
|
1123
1123
|
"openidAddress": "OpenID мекенжайы",
|
|
@@ -820,7 +820,7 @@
|
|
|
820
820
|
"launchConsole": "Запустить консоль",
|
|
821
821
|
"launchRemoteConsole": "ЗАПУСК УДАЛЕННОЙ КОНСОЛИ",
|
|
822
822
|
"launchWebConsole": "ЗАПУСК ВЕБ-КОНСОЛИ",
|
|
823
|
-
"launchWebTerminal": "
|
|
823
|
+
"launchWebTerminal": "Запустить веб-терминал",
|
|
824
824
|
"learnMore": "Узнать больше",
|
|
825
825
|
"leaveAd": "Оставить объявление",
|
|
826
826
|
"leaveLockdownDefault": "Если вы не уверены, что делать, оставьте режим блокировки отключенным. Вы можете настроить режим блокировки позже, отредактировав профиль безопасности в настройках хоста",
|
|
@@ -1117,7 +1117,7 @@
|
|
|
1117
1117
|
"offlineOps": "Оффлайн операции",
|
|
1118
1118
|
"ok": "ОК",
|
|
1119
1119
|
"okOrCancelToReviewYourChanges": "Нажмите \"ОК\", чтобы продолжить, или \"Отмена\", чтобы просмотреть внесенные изменения.",
|
|
1120
|
-
"oneOfSelectedDatesIsInTheFuture": "
|
|
1120
|
+
"oneOfSelectedDatesIsInTheFuture": "Указанный временной диапазон недопустим. Одна из выбранных дат находится в будущем.",
|
|
1121
1121
|
"opaqueNetwork": "Непрозрачная сеть",
|
|
1122
1122
|
"openId": "OpenID",
|
|
1123
1123
|
"openidAddress": "OpenID-адрес",
|
|
@@ -1,167 +1,167 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="notification">
|
|
3
|
-
<div
|
|
4
|
-
class="notification-container-wrap animation"
|
|
5
|
-
:class="{ active: isActive }"
|
|
6
|
-
>
|
|
7
|
-
<div class="notification-container">
|
|
8
|
-
<div v-show="props.show" class="toast">
|
|
9
|
-
<atoms-the-icon
|
|
10
|
-
class="toast-icon"
|
|
11
|
-
:class="iconName !== 'info' && 'with'"
|
|
12
|
-
:name="iconName"
|
|
13
|
-
/>
|
|
14
|
-
<div class="toast-content">
|
|
15
|
-
<div class="flex-align-center flex-space-between">
|
|
16
|
-
<h4>{{ props.title }}</h4>
|
|
17
|
-
<button
|
|
18
|
-
:id="`${props.testId}-close-button`"
|
|
19
|
-
:title="localization.closeNotification"
|
|
20
|
-
@click="hide"
|
|
21
|
-
>
|
|
22
|
-
<atoms-the-icon name="close" />
|
|
23
|
-
</button>
|
|
24
|
-
</div>
|
|
25
|
-
<div class="description">
|
|
26
|
-
<slot>
|
|
27
|
-
<p class="pre-line">{{ props.description }}</p>
|
|
28
|
-
</slot>
|
|
29
|
-
</div>
|
|
30
|
-
</div>
|
|
31
|
-
</div>
|
|
32
|
-
</div>
|
|
33
|
-
</div>
|
|
34
|
-
</div>
|
|
35
|
-
</template>
|
|
36
|
-
|
|
37
|
-
<script setup lang="ts">
|
|
38
|
-
import { UI_I_Localization } from '~/models/interfaces'
|
|
39
|
-
import { UI_E_IconsByStatusNotification } from '~/components/atoms/alert/models/enums'
|
|
40
|
-
import { UI_T_Status } from '~/components/atoms/alert/models/types'
|
|
41
|
-
|
|
42
|
-
const props = withDefaults(
|
|
43
|
-
defineProps<{
|
|
44
|
-
testId?: string
|
|
45
|
-
status: UI_T_Status
|
|
46
|
-
id: number
|
|
47
|
-
show: boolean
|
|
48
|
-
title: string
|
|
49
|
-
description: string
|
|
50
|
-
}>(),
|
|
51
|
-
{ testId: 'ui-notification' }
|
|
52
|
-
)
|
|
53
|
-
const emits = defineEmits<{
|
|
54
|
-
(event: 'hide', value: number): void
|
|
55
|
-
}>()
|
|
56
|
-
|
|
57
|
-
const localization = computed<UI_I_Localization>(() => useLocal())
|
|
58
|
-
const hide = () => {
|
|
59
|
-
isActive.value = false
|
|
60
|
-
|
|
61
|
-
setTimeout(() => {
|
|
62
|
-
emits('hide', props.id)
|
|
63
|
-
}, 200)
|
|
64
|
-
}
|
|
65
|
-
const isActive = ref<boolean>(false)
|
|
66
|
-
|
|
67
|
-
const iconName = computed<string>(
|
|
68
|
-
() => UI_E_IconsByStatusNotification[props.status]
|
|
69
|
-
)
|
|
70
|
-
|
|
71
|
-
setTimeout(() => {
|
|
72
|
-
isActive.value = true
|
|
73
|
-
}, 1000)
|
|
74
|
-
</script>
|
|
75
|
-
|
|
76
|
-
<style scoped lang="scss">
|
|
77
|
-
@import '~/assets/scss/common/mixins.scss';
|
|
78
|
-
|
|
79
|
-
.notification {
|
|
80
|
-
.notification-container-wrap {
|
|
81
|
-
display: block;
|
|
82
|
-
margin-top: 10px;
|
|
83
|
-
width: 414px;
|
|
84
|
-
position: relative;
|
|
85
|
-
right: -600px;
|
|
86
|
-
opacity: 0;
|
|
87
|
-
|
|
88
|
-
&.active {
|
|
89
|
-
right: 0;
|
|
90
|
-
opacity: 1;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
.notification-container {
|
|
94
|
-
@include flex($dir: column, $just: flex-end);
|
|
95
|
-
margin-right: 0;
|
|
96
|
-
|
|
97
|
-
.toast {
|
|
98
|
-
@include flex($dir: row);
|
|
99
|
-
background-color: #25333d;
|
|
100
|
-
border-radius: 3px;
|
|
101
|
-
box-shadow: 0 2px 10px rgb(0 0 0 / 40%);
|
|
102
|
-
margin: 0;
|
|
103
|
-
padding: 12px;
|
|
104
|
-
transform: scale(1);
|
|
105
|
-
transform-origin: 100% 0;
|
|
106
|
-
width: 100%;
|
|
107
|
-
|
|
108
|
-
.toast-icon {
|
|
109
|
-
width: 36px;
|
|
110
|
-
height: 36px;
|
|
111
|
-
&.with {
|
|
112
|
-
width: 26px;
|
|
113
|
-
height: 26px;
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
.toast-content {
|
|
118
|
-
padding-left: 12px;
|
|
119
|
-
width: 100%;
|
|
120
|
-
|
|
121
|
-
h4 {
|
|
122
|
-
color: #e9ecef;
|
|
123
|
-
font-size: 14px;
|
|
124
|
-
font-weight: 500;
|
|
125
|
-
line-height: 24px;
|
|
126
|
-
margin-top: 0;
|
|
127
|
-
max-width: 240px;
|
|
128
|
-
overflow: hidden;
|
|
129
|
-
text-overflow: ellipsis;
|
|
130
|
-
white-space: nowrap;
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
button {
|
|
134
|
-
background: transparent;
|
|
135
|
-
border: none;
|
|
136
|
-
border-radius: 100%;
|
|
137
|
-
cursor: pointer;
|
|
138
|
-
display: inline-block;
|
|
139
|
-
height: 30px;
|
|
140
|
-
position: absolute;
|
|
141
|
-
right: 8px;
|
|
142
|
-
top: 8px;
|
|
143
|
-
width: 30px;
|
|
144
|
-
|
|
145
|
-
svg {
|
|
146
|
-
width: 16px;
|
|
147
|
-
height: 16px;
|
|
148
|
-
fill: #adbbc4;
|
|
149
|
-
margin-left: 1px;
|
|
150
|
-
margin-top: -8px;
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
.description {
|
|
155
|
-
max-height: 60vh;
|
|
156
|
-
overflow: auto;
|
|
157
|
-
|
|
158
|
-
p {
|
|
159
|
-
color: var(--global-font-color6);
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
</style>
|
|
1
|
+
<template>
|
|
2
|
+
<div class="notification">
|
|
3
|
+
<div
|
|
4
|
+
class="notification-container-wrap animation"
|
|
5
|
+
:class="{ active: isActive }"
|
|
6
|
+
>
|
|
7
|
+
<div class="notification-container">
|
|
8
|
+
<div v-show="props.show" class="toast">
|
|
9
|
+
<atoms-the-icon
|
|
10
|
+
class="toast-icon"
|
|
11
|
+
:class="iconName !== 'info' && 'with'"
|
|
12
|
+
:name="iconName"
|
|
13
|
+
/>
|
|
14
|
+
<div class="toast-content">
|
|
15
|
+
<div class="flex-align-center flex-space-between">
|
|
16
|
+
<h4>{{ props.title }}</h4>
|
|
17
|
+
<button
|
|
18
|
+
:id="`${props.testId}-close-button`"
|
|
19
|
+
:title="localization.closeNotification"
|
|
20
|
+
@click="hide"
|
|
21
|
+
>
|
|
22
|
+
<atoms-the-icon name="close" />
|
|
23
|
+
</button>
|
|
24
|
+
</div>
|
|
25
|
+
<div class="description">
|
|
26
|
+
<slot>
|
|
27
|
+
<p class="pre-line">{{ props.description }}</p>
|
|
28
|
+
</slot>
|
|
29
|
+
</div>
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
</div>
|
|
35
|
+
</template>
|
|
36
|
+
|
|
37
|
+
<script setup lang="ts">
|
|
38
|
+
import { UI_I_Localization } from '~/models/interfaces'
|
|
39
|
+
import { UI_E_IconsByStatusNotification } from '~/components/atoms/alert/models/enums'
|
|
40
|
+
import { UI_T_Status } from '~/components/atoms/alert/models/types'
|
|
41
|
+
|
|
42
|
+
const props = withDefaults(
|
|
43
|
+
defineProps<{
|
|
44
|
+
testId?: string
|
|
45
|
+
status: UI_T_Status
|
|
46
|
+
id: number
|
|
47
|
+
show: boolean
|
|
48
|
+
title: string
|
|
49
|
+
description: string
|
|
50
|
+
}>(),
|
|
51
|
+
{ testId: 'ui-notification' }
|
|
52
|
+
)
|
|
53
|
+
const emits = defineEmits<{
|
|
54
|
+
(event: 'hide', value: number): void
|
|
55
|
+
}>()
|
|
56
|
+
|
|
57
|
+
const localization = computed<UI_I_Localization>(() => useLocal())
|
|
58
|
+
const hide = () => {
|
|
59
|
+
isActive.value = false
|
|
60
|
+
|
|
61
|
+
setTimeout(() => {
|
|
62
|
+
emits('hide', props.id)
|
|
63
|
+
}, 200)
|
|
64
|
+
}
|
|
65
|
+
const isActive = ref<boolean>(false)
|
|
66
|
+
|
|
67
|
+
const iconName = computed<string>(
|
|
68
|
+
() => UI_E_IconsByStatusNotification[props.status]
|
|
69
|
+
)
|
|
70
|
+
|
|
71
|
+
setTimeout(() => {
|
|
72
|
+
isActive.value = true
|
|
73
|
+
}, 1000)
|
|
74
|
+
</script>
|
|
75
|
+
|
|
76
|
+
<style scoped lang="scss">
|
|
77
|
+
@import '~/assets/scss/common/mixins.scss';
|
|
78
|
+
|
|
79
|
+
.notification {
|
|
80
|
+
.notification-container-wrap {
|
|
81
|
+
display: block;
|
|
82
|
+
margin-top: 10px;
|
|
83
|
+
width: 414px;
|
|
84
|
+
position: relative;
|
|
85
|
+
right: -600px;
|
|
86
|
+
opacity: 0;
|
|
87
|
+
|
|
88
|
+
&.active {
|
|
89
|
+
right: 0;
|
|
90
|
+
opacity: 1;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.notification-container {
|
|
94
|
+
@include flex($dir: column, $just: flex-end);
|
|
95
|
+
margin-right: 0;
|
|
96
|
+
|
|
97
|
+
.toast {
|
|
98
|
+
@include flex($dir: row);
|
|
99
|
+
background-color: #25333d;
|
|
100
|
+
border-radius: 3px;
|
|
101
|
+
box-shadow: 0 2px 10px rgb(0 0 0 / 40%);
|
|
102
|
+
margin: 0;
|
|
103
|
+
padding: 12px;
|
|
104
|
+
transform: scale(1);
|
|
105
|
+
transform-origin: 100% 0;
|
|
106
|
+
width: 100%;
|
|
107
|
+
|
|
108
|
+
.toast-icon {
|
|
109
|
+
width: 36px;
|
|
110
|
+
height: 36px;
|
|
111
|
+
&.with {
|
|
112
|
+
width: 26px;
|
|
113
|
+
height: 26px;
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.toast-content {
|
|
118
|
+
padding-left: 12px;
|
|
119
|
+
width: 100%;
|
|
120
|
+
|
|
121
|
+
h4 {
|
|
122
|
+
color: #e9ecef;
|
|
123
|
+
font-size: 14px;
|
|
124
|
+
font-weight: 500;
|
|
125
|
+
line-height: 24px;
|
|
126
|
+
margin-top: 0;
|
|
127
|
+
max-width: 240px;
|
|
128
|
+
overflow: hidden;
|
|
129
|
+
text-overflow: ellipsis;
|
|
130
|
+
white-space: nowrap;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
button {
|
|
134
|
+
background: transparent;
|
|
135
|
+
border: none;
|
|
136
|
+
border-radius: 100%;
|
|
137
|
+
cursor: pointer;
|
|
138
|
+
display: inline-block;
|
|
139
|
+
height: 30px;
|
|
140
|
+
position: absolute;
|
|
141
|
+
right: 8px;
|
|
142
|
+
top: 8px;
|
|
143
|
+
width: 30px;
|
|
144
|
+
|
|
145
|
+
svg {
|
|
146
|
+
width: 16px;
|
|
147
|
+
height: 16px;
|
|
148
|
+
fill: #adbbc4;
|
|
149
|
+
margin-left: 1px;
|
|
150
|
+
margin-top: -8px;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.description {
|
|
155
|
+
max-height: 60vh;
|
|
156
|
+
overflow: auto;
|
|
157
|
+
|
|
158
|
+
p {
|
|
159
|
+
color: var(--global-font-color6);
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
</style>
|