bfg-common 1.4.512 → 1.4.514
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/components/common/pages/shortcuts/Shortcuts.vue +11 -9
- package/components/common/pages/shortcuts/block/Block.vue +25 -0
- package/components/common/pages/shortcuts/block/BlockNew.vue +98 -0
- package/components/common/pages/shortcuts/category/Category.vue +42 -0
- package/components/common/pages/shortcuts/category/CategoryNew.vue +41 -0
- package/components/common/pages/shortcuts/{Category.vue → category/CategoryOld.vue} +1 -1
- package/package.json +1 -1
- /package/components/common/pages/shortcuts/{Block.vue → block/BlockOld.vue} +0 -0
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<h1>{{ localization.mainNavigation.shortcuts }}</h1>
|
|
4
4
|
<template v-for="item in props.shortcutsItems">
|
|
5
5
|
<div class="shortcut-category">
|
|
6
|
-
<common-shortcuts-category
|
|
6
|
+
<common-pages-shortcuts-category
|
|
7
7
|
:title="item.title"
|
|
8
8
|
:block-items="item.blockItems"
|
|
9
9
|
/>
|
|
@@ -35,7 +35,16 @@ const localization = computed<UI_I_Localization>(() => useLocal())
|
|
|
35
35
|
overflow-y: scroll;
|
|
36
36
|
|
|
37
37
|
&.new {
|
|
38
|
-
|
|
38
|
+
background: var(--bottom-pannel-bg-color);
|
|
39
|
+
padding: 16px;
|
|
40
|
+
margin: 0;
|
|
41
|
+
|
|
42
|
+
& > h1 {
|
|
43
|
+
color: var(--home-title-color);
|
|
44
|
+
font-size: 22px;
|
|
45
|
+
font-weight: 400;
|
|
46
|
+
line-height: 26.63px;
|
|
47
|
+
}
|
|
39
48
|
}
|
|
40
49
|
|
|
41
50
|
& > h1 {
|
|
@@ -43,13 +52,6 @@ const localization = computed<UI_I_Localization>(() => useLocal())
|
|
|
43
52
|
font-size: 22px;
|
|
44
53
|
font-weight: 200;
|
|
45
54
|
letter-spacing: normal;
|
|
46
|
-
|
|
47
|
-
.new & {
|
|
48
|
-
color: var(--home-title-color);
|
|
49
|
-
font-size: 22px;
|
|
50
|
-
font-weight: 400;
|
|
51
|
-
line-height: 26.63px;
|
|
52
|
-
}
|
|
53
55
|
}
|
|
54
56
|
|
|
55
57
|
&-category {
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<common-pages-shortcuts-block-new
|
|
3
|
+
v-if="isNewView"
|
|
4
|
+
:item="props.item"
|
|
5
|
+
:test-id="props.testId"
|
|
6
|
+
/>
|
|
7
|
+
<common-pages-shortcuts-block-old
|
|
8
|
+
v-else
|
|
9
|
+
:item="props.item"
|
|
10
|
+
:test-id="props.testId"
|
|
11
|
+
/>
|
|
12
|
+
</template>
|
|
13
|
+
<script setup lang="ts">
|
|
14
|
+
import type { UI_I_BlockItem } from '~/components/common/pages/shortcuts/lib/models/interfaces'
|
|
15
|
+
|
|
16
|
+
const props = defineProps<{
|
|
17
|
+
item: UI_I_BlockItem
|
|
18
|
+
testId?: string
|
|
19
|
+
}>()
|
|
20
|
+
|
|
21
|
+
const { $store }: any = useNuxtApp()
|
|
22
|
+
|
|
23
|
+
const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
|
|
24
|
+
</script>
|
|
25
|
+
<style lang="scss" scoped></style>
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<ui-widget>
|
|
3
|
+
<div>
|
|
4
|
+
<nuxt-link
|
|
5
|
+
class="unit"
|
|
6
|
+
:to="navigate"
|
|
7
|
+
:title="props.item.navigateTo"
|
|
8
|
+
:data-id="props.testId"
|
|
9
|
+
@click="changeLastNavigation"
|
|
10
|
+
@contextmenu="changeLastNavigation"
|
|
11
|
+
>
|
|
12
|
+
<span
|
|
13
|
+
v-if="props.item.iconClassName"
|
|
14
|
+
:class="['unit-icon', props.item.iconClassName]"
|
|
15
|
+
/>
|
|
16
|
+
<span v-else-if="props.item.iconName" class="icon-2">
|
|
17
|
+
<atoms-the-icon2 :name="props.item.iconName" width="34" height="34" />
|
|
18
|
+
</span>
|
|
19
|
+
<div class="unit-text" :title="props.item.text">
|
|
20
|
+
{{ props.item.text }}
|
|
21
|
+
</div>
|
|
22
|
+
</nuxt-link>
|
|
23
|
+
</div>
|
|
24
|
+
</ui-widget>
|
|
25
|
+
</template>
|
|
26
|
+
<script setup lang="ts">
|
|
27
|
+
import type { UI_I_BlockItem } from '~/components/common/pages/shortcuts/lib/models/interfaces'
|
|
28
|
+
|
|
29
|
+
const props = defineProps<{
|
|
30
|
+
item: UI_I_BlockItem
|
|
31
|
+
testId?: string
|
|
32
|
+
}>()
|
|
33
|
+
|
|
34
|
+
const navigate = computed<string>(() => '/' + props.item.navigateTo)
|
|
35
|
+
|
|
36
|
+
const changeLastNavigation = (): void => {
|
|
37
|
+
if (!props.item.nav) return
|
|
38
|
+
|
|
39
|
+
const lastSelectedInventory = 'lastSelectedInventoryTreeIdStorageKey'
|
|
40
|
+
useLocalStorage(lastSelectedInventory, props.item.nav)
|
|
41
|
+
}
|
|
42
|
+
</script>
|
|
43
|
+
<style lang="scss" scoped>
|
|
44
|
+
.unit {
|
|
45
|
+
display: flex;
|
|
46
|
+
flex-direction: column;
|
|
47
|
+
justify-content: center;
|
|
48
|
+
align-items: center;
|
|
49
|
+
width: 95px;
|
|
50
|
+
margin: 21px 10px;
|
|
51
|
+
text-decoration-line: none;
|
|
52
|
+
&-icon {
|
|
53
|
+
margin: 0px 10px 15px 10px;
|
|
54
|
+
min-width: 34px;
|
|
55
|
+
min-height: 34px;
|
|
56
|
+
display: inline-block;
|
|
57
|
+
color: var(--global-font-color3);
|
|
58
|
+
|
|
59
|
+
&.icon-lifecycle-manager,
|
|
60
|
+
&.icon-cloud-provider-services {
|
|
61
|
+
background-size: contain;
|
|
62
|
+
background-repeat: no-repeat;
|
|
63
|
+
}
|
|
64
|
+
&.icon-lifecycle-manager {
|
|
65
|
+
background-image: url('assets/img/icons/icon-life-m-light.svg');
|
|
66
|
+
html.dark-theme & {
|
|
67
|
+
background-image: url('assets/img/icons/icon-life-m-dark.svg');
|
|
68
|
+
color: var(--global-font-color3);
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
&.icon-cloud-provider-services {
|
|
72
|
+
background-image: url('assets/img/icons/icon-cps.png');
|
|
73
|
+
html.dark-theme & {
|
|
74
|
+
background-image: url('assets/img/icons/icon-cps-dark-mode.png');
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
&.icon-vm-customizationManager-32x,
|
|
78
|
+
&.icon-storage-profile-32x,
|
|
79
|
+
&.icon-Host_Policy-32x,
|
|
80
|
+
&.icon-certificate-32x {
|
|
81
|
+
width: 34px;
|
|
82
|
+
height: 34px;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
.icon-2 {
|
|
86
|
+
margin: 0 10px 15px 10px;
|
|
87
|
+
color: var(--global-font-color3);
|
|
88
|
+
}
|
|
89
|
+
&-text {
|
|
90
|
+
color: var(--global-font-color3);
|
|
91
|
+
font-size: 13px;
|
|
92
|
+
line-height: 13px;
|
|
93
|
+
font-weight: 400;
|
|
94
|
+
padding-bottom: 2px;
|
|
95
|
+
text-align: center;
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
</style>
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<common-pages-shortcuts-category-new
|
|
3
|
+
v-if="isNewView"
|
|
4
|
+
:title="props.title"
|
|
5
|
+
:block-items="props.blockItems"
|
|
6
|
+
/>
|
|
7
|
+
<common-pages-shortcuts-category-old
|
|
8
|
+
v-else
|
|
9
|
+
:title="props.title"
|
|
10
|
+
:block-items="props.blockItems"
|
|
11
|
+
/>
|
|
12
|
+
</template>
|
|
13
|
+
|
|
14
|
+
<script setup lang="ts">
|
|
15
|
+
import type { UI_I_BlockItem } from '~/components/common/pages/shortcuts/lib/models/interfaces'
|
|
16
|
+
|
|
17
|
+
const props = defineProps<{
|
|
18
|
+
title: string
|
|
19
|
+
blockItems: UI_I_BlockItem[]
|
|
20
|
+
}>()
|
|
21
|
+
|
|
22
|
+
const { $store }: any = useNuxtApp()
|
|
23
|
+
|
|
24
|
+
const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
|
|
25
|
+
</script>
|
|
26
|
+
<style lang="scss" scoped>
|
|
27
|
+
//.category {
|
|
28
|
+
// &-text {
|
|
29
|
+
// color: var(--light-white-100);
|
|
30
|
+
// font-size: 18px;
|
|
31
|
+
// line-height: 21px;
|
|
32
|
+
// font-weight: 400;
|
|
33
|
+
// }
|
|
34
|
+
// &-block {
|
|
35
|
+
// display: flex;
|
|
36
|
+
// flex-direction: row;
|
|
37
|
+
// justify-content: flex-start;
|
|
38
|
+
// border-top: 1px solid var(--global-border-color);
|
|
39
|
+
// margin-top: -4px;
|
|
40
|
+
// }
|
|
41
|
+
//}
|
|
42
|
+
</style>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="category">
|
|
3
|
+
<span class="category__headline">
|
|
4
|
+
{{ props.title }}
|
|
5
|
+
</span>
|
|
6
|
+
<div class="category-block">
|
|
7
|
+
<common-pages-shortcuts-block
|
|
8
|
+
v-for="(item, key) in props.blockItems"
|
|
9
|
+
:key="key"
|
|
10
|
+
:item="item"
|
|
11
|
+
:test-id="item.testId"
|
|
12
|
+
/>
|
|
13
|
+
</div>
|
|
14
|
+
</div>
|
|
15
|
+
</template>
|
|
16
|
+
|
|
17
|
+
<script setup lang="ts">
|
|
18
|
+
import type { UI_I_BlockItem } from '~/components/common/pages/shortcuts/lib/models/interfaces'
|
|
19
|
+
|
|
20
|
+
const props = defineProps<{
|
|
21
|
+
title: string
|
|
22
|
+
blockItems: UI_I_BlockItem[]
|
|
23
|
+
}>()
|
|
24
|
+
</script>
|
|
25
|
+
<style lang="scss" scoped>
|
|
26
|
+
.category {
|
|
27
|
+
&__headline {
|
|
28
|
+
color: #9da6ad;
|
|
29
|
+
font-size: 16px;
|
|
30
|
+
font-weight: 400;
|
|
31
|
+
line-height: 19.36px;
|
|
32
|
+
}
|
|
33
|
+
&-block {
|
|
34
|
+
display: flex;
|
|
35
|
+
flex-direction: row;
|
|
36
|
+
justify-content: flex-start;
|
|
37
|
+
border-top: 1px solid var(--global-border-color);
|
|
38
|
+
margin-top: -4px;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
</style>
|
package/package.json
CHANGED
|
File without changes
|