bfg-common 1.4.571 → 1.4.572
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.
|
@@ -20,7 +20,10 @@
|
|
|
20
20
|
size="sm"
|
|
21
21
|
>
|
|
22
22
|
<template #notFound>
|
|
23
|
-
<div
|
|
23
|
+
<div
|
|
24
|
+
v-if="!allRowsCount"
|
|
25
|
+
class="add-new-attribute-button-container"
|
|
26
|
+
>
|
|
24
27
|
<ui-button
|
|
25
28
|
test-id="add-new-attribute-button"
|
|
26
29
|
variant="text"
|
|
@@ -35,16 +38,13 @@
|
|
|
35
38
|
</template>
|
|
36
39
|
<!-- :loading="loading"-->
|
|
37
40
|
<template #icon="{ item }">
|
|
38
|
-
<div
|
|
39
|
-
v-if="item.data.type === 'options'"
|
|
40
|
-
style="display: flex; justify-content: flex-end; width: 100%"
|
|
41
|
-
>
|
|
41
|
+
<div v-if="item.data.type === 'options'" class="actions-container">
|
|
42
42
|
<span
|
|
43
|
-
:id="`actions-${item.data.row}`"
|
|
43
|
+
:id="`actions-attributes-${item.data.row}`"
|
|
44
44
|
:class="[
|
|
45
45
|
'icon-container',
|
|
46
46
|
{
|
|
47
|
-
selected: isShow[`action-${item.data.row}`],
|
|
47
|
+
selected: isShow[`action-attributes-${item.data.row}`],
|
|
48
48
|
},
|
|
49
49
|
]"
|
|
50
50
|
@click="onShowActions(item.data.row)"
|
|
@@ -52,11 +52,11 @@
|
|
|
52
52
|
<ui-icon :name="item.data.icon" width="16" height="16" />
|
|
53
53
|
</span>
|
|
54
54
|
<ui-popup-window
|
|
55
|
-
v-model="isShow[`action-${item.data.row}`]"
|
|
56
|
-
:elem-id="`actions-${item.data.row}`"
|
|
55
|
+
v-model="isShow[`action-attributes-${item.data.row}`]"
|
|
56
|
+
:elem-id="`actions-attributes-${item.data.row}`"
|
|
57
57
|
width="fit-content"
|
|
58
58
|
>
|
|
59
|
-
<div
|
|
59
|
+
<div class="actions-dropdown-container">
|
|
60
60
|
<div
|
|
61
61
|
:class="['action', { disabled: hasEditRow }]"
|
|
62
62
|
data-id="edit-attribute-action"
|
|
@@ -127,7 +127,7 @@
|
|
|
127
127
|
</div>
|
|
128
128
|
</template>
|
|
129
129
|
<template v-else-if="item.data.type === 'actions'">
|
|
130
|
-
<div
|
|
130
|
+
<div class="edit-actions-container">
|
|
131
131
|
<span
|
|
132
132
|
class="hide-row"
|
|
133
133
|
data-id="hide-create-attribute-row"
|
|
@@ -220,7 +220,8 @@ const portletTitle = computed<string>(() => {
|
|
|
220
220
|
const isShow = ref<UI_I_ArbitraryObject<boolean>>({})
|
|
221
221
|
|
|
222
222
|
const onShowActions = (id: number): void => {
|
|
223
|
-
isShow.value[`action-${id}`] =
|
|
223
|
+
isShow.value[`action-attributes-${id}`] =
|
|
224
|
+
!isShow.value[`action-attributes-${id}`]
|
|
224
225
|
}
|
|
225
226
|
|
|
226
227
|
const attributesHeadItems = computed<UI_I_DataTableHeader[]>(() =>
|
|
@@ -300,7 +301,7 @@ const onAddAttribute = (): void => {
|
|
|
300
301
|
)
|
|
301
302
|
|
|
302
303
|
emits('edit-attribute', editedRowData)
|
|
303
|
-
isShow.value[`action-${editRowData.value?.row}`] = false
|
|
304
|
+
isShow.value[`action-attributes-${editRowData.value?.row}`] = false
|
|
304
305
|
editRowData.value = undefined
|
|
305
306
|
isEditRow.value = false
|
|
306
307
|
} else {
|
|
@@ -329,7 +330,7 @@ const onHideEditRow = (): void => {
|
|
|
329
330
|
attributesBodyItems.value = attributesBodyItems.value.map((row) =>
|
|
330
331
|
row.row === editRowData.value?.row ? editRowData.value : row
|
|
331
332
|
)
|
|
332
|
-
isShow.value[`action-${editRowData.value?.row}`] = false
|
|
333
|
+
isShow.value[`action-attributes-${editRowData.value?.row}`] = false
|
|
333
334
|
editRowData.value = undefined
|
|
334
335
|
isEditRow.value = false
|
|
335
336
|
} else {
|
|
@@ -631,4 +632,24 @@ const onTogglePortlet = (id: string): void => {
|
|
|
631
632
|
color: var(--create-row-icon-hover);
|
|
632
633
|
}
|
|
633
634
|
}
|
|
635
|
+
|
|
636
|
+
.add-new-attribute-button-container {
|
|
637
|
+
margin-top: 12px;
|
|
638
|
+
}
|
|
639
|
+
|
|
640
|
+
.actions-container {
|
|
641
|
+
display: flex;
|
|
642
|
+
justify-content: flex-end;
|
|
643
|
+
width: 100%;
|
|
644
|
+
}
|
|
645
|
+
|
|
646
|
+
.actions-dropdown-container {
|
|
647
|
+
padding: 8px;
|
|
648
|
+
}
|
|
649
|
+
|
|
650
|
+
.edit-actions-container {
|
|
651
|
+
display: flex;
|
|
652
|
+
align-items: center;
|
|
653
|
+
column-gap: 12px;
|
|
654
|
+
}
|
|
634
655
|
</style>
|
|
@@ -21,13 +21,13 @@
|
|
|
21
21
|
>
|
|
22
22
|
<!-- :loading="loading"-->
|
|
23
23
|
<template #icon="{ item }">
|
|
24
|
-
<div
|
|
24
|
+
<div class="actions-dropdown-button-container">
|
|
25
25
|
<span
|
|
26
|
-
:id="`actions-${item.data.row}`"
|
|
26
|
+
:id="`actions-tags-${item.data.row}`"
|
|
27
27
|
:class="[
|
|
28
28
|
'icon-container',
|
|
29
29
|
{
|
|
30
|
-
selected: isShow[`action-${item.data.row}`],
|
|
30
|
+
selected: isShow[`action-tags-${item.data.row}`],
|
|
31
31
|
},
|
|
32
32
|
]"
|
|
33
33
|
@click="onShowActions(item.data.row)"
|
|
@@ -35,11 +35,11 @@
|
|
|
35
35
|
<ui-icon :name="item.data.icon" width="16" height="16" />
|
|
36
36
|
</span>
|
|
37
37
|
<ui-popup-window
|
|
38
|
-
v-model="isShow[`action-${item.data.row}`]"
|
|
39
|
-
:elem-id="`actions-${item.data.row}`"
|
|
38
|
+
v-model="isShow[`action-tags-${item.data.row}`]"
|
|
39
|
+
:elem-id="`actions-tags-${item.data.row}`"
|
|
40
40
|
width="fit-content"
|
|
41
41
|
>
|
|
42
|
-
<div
|
|
42
|
+
<div class="edit-actions-container">
|
|
43
43
|
<div
|
|
44
44
|
class="action"
|
|
45
45
|
data-id="view-tag-details-action"
|
|
@@ -141,7 +141,7 @@ const onHideAssignModal = (): void => {
|
|
|
141
141
|
isShowModal.value = false
|
|
142
142
|
}
|
|
143
143
|
const onShowActions = (id: number): void => {
|
|
144
|
-
isShow.value[`action-${id}`] = !isShow.value[`action-${id}`]
|
|
144
|
+
isShow.value[`action-tags-${id}`] = !isShow.value[`action-tags-${id}`]
|
|
145
145
|
}
|
|
146
146
|
const onShowDetails = (_id: number): void => {
|
|
147
147
|
navigateTo('/tags-attributes/tags')
|
|
@@ -409,4 +409,14 @@ const onTogglePortlet = (id: string): void => {
|
|
|
409
409
|
width: fit-content;
|
|
410
410
|
}
|
|
411
411
|
}
|
|
412
|
+
|
|
413
|
+
.actions-dropdown-button-container {
|
|
414
|
+
display: flex;
|
|
415
|
+
justify-content: flex-end;
|
|
416
|
+
width: 100%;
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
.edit-actions-container {
|
|
420
|
+
padding: 8px;
|
|
421
|
+
}
|
|
412
422
|
</style>
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
>
|
|
14
14
|
<template #header></template>
|
|
15
15
|
<template #content>
|
|
16
|
-
<div
|
|
17
|
-
<div v-if="isShowRequiredFieldsError"
|
|
16
|
+
<div class="content-container">
|
|
17
|
+
<div v-if="isShowRequiredFieldsError" class="alert-container">
|
|
18
18
|
<ui-alert
|
|
19
19
|
:messages="[localization.common.pleaseFillAllRequiredFields]"
|
|
20
20
|
test-id="required-alert"
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
</div>
|
|
25
25
|
<div
|
|
26
26
|
v-if="!isShowRequiredFieldsError && selectedRowsCount > 1"
|
|
27
|
-
|
|
27
|
+
class="alert-container"
|
|
28
28
|
>
|
|
29
29
|
<ui-alert
|
|
30
30
|
:messages="[localization.common.multipleTagsSelectedAlert]"
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
@select-row="onGetSelected"
|
|
49
49
|
>
|
|
50
50
|
<template #notFound>
|
|
51
|
-
<div v-if="!allRowsCount"
|
|
51
|
+
<div v-if="!allRowsCount" class="new-tag-button-container">
|
|
52
52
|
<ui-button
|
|
53
53
|
variant="text"
|
|
54
54
|
test-id="create-new-tag"
|
|
@@ -101,13 +101,7 @@
|
|
|
101
101
|
test-id="create-new-tag-category"
|
|
102
102
|
@click="onShowCreateCategoryModal"
|
|
103
103
|
>
|
|
104
|
-
<div
|
|
105
|
-
style="
|
|
106
|
-
display: flex;
|
|
107
|
-
align-items: center;
|
|
108
|
-
height: 28px;
|
|
109
|
-
"
|
|
110
|
-
>
|
|
104
|
+
<div class="select-button-container">
|
|
111
105
|
<ui-icon name="plus" width="16" height="16" />
|
|
112
106
|
<span>{{ localization.common.createNew }}</span>
|
|
113
107
|
</div>
|
|
@@ -129,12 +123,9 @@
|
|
|
129
123
|
/>
|
|
130
124
|
</template>
|
|
131
125
|
<template v-else-if="item.data.type === 'actions'">
|
|
132
|
-
<div
|
|
133
|
-
style="display: flex; align-items: center; column-gap: 12px"
|
|
134
|
-
>
|
|
126
|
+
<div class="actions-container">
|
|
135
127
|
<span
|
|
136
128
|
class="hide-row"
|
|
137
|
-
style="cursor: pointer; line-height: 16px"
|
|
138
129
|
data-id="hide-create-new-tag-row"
|
|
139
130
|
@click.prevent.stop="onHideEditRow"
|
|
140
131
|
>
|
|
@@ -142,7 +133,6 @@
|
|
|
142
133
|
</span>
|
|
143
134
|
<span
|
|
144
135
|
class="create-row"
|
|
145
|
-
style="cursor: pointer; line-height: 16px"
|
|
146
136
|
data-id="create-new-tag-accept"
|
|
147
137
|
@click.prevent.stop="onAddTag"
|
|
148
138
|
>
|
|
@@ -607,4 +597,28 @@ const onCreateCategory = (data: UI_I_CreateCategoryData): void => {
|
|
|
607
597
|
color: var(--create-row-icon-hover);
|
|
608
598
|
}
|
|
609
599
|
}
|
|
600
|
+
|
|
601
|
+
.content-container {
|
|
602
|
+
padding: 8px 32px 0;
|
|
603
|
+
}
|
|
604
|
+
|
|
605
|
+
.alert-container {
|
|
606
|
+
margin: 8px 0;
|
|
607
|
+
}
|
|
608
|
+
|
|
609
|
+
.new-tag-button-container {
|
|
610
|
+
margin-top: 12px;
|
|
611
|
+
}
|
|
612
|
+
|
|
613
|
+
.select-button-container {
|
|
614
|
+
display: flex;
|
|
615
|
+
align-items: center;
|
|
616
|
+
height: 28px;
|
|
617
|
+
}
|
|
618
|
+
|
|
619
|
+
.actions-container {
|
|
620
|
+
display: flex;
|
|
621
|
+
align-items: center;
|
|
622
|
+
column-gap: 12px;
|
|
623
|
+
}
|
|
610
624
|
</style>
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
align-items: center;
|
|
55
55
|
gap: 56px;
|
|
56
56
|
padding-bottom: 12px;
|
|
57
|
-
border-bottom: 1px solid
|
|
57
|
+
border-bottom: 1px solid var(--divider-color);
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
.actions {
|
|
@@ -71,6 +71,7 @@
|
|
|
71
71
|
.stack-block {
|
|
72
72
|
display: flex;
|
|
73
73
|
align-items: center;
|
|
74
|
+
gap: 8px;
|
|
74
75
|
padding: 8px 12px;
|
|
75
76
|
background: var(--stack-block-bg-color);
|
|
76
77
|
border-radius: 6px;
|