@webitel/ui-sdk 24.12.13 → 24.12.14
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/CHANGELOG.md +9 -0
- package/dist/ui-sdk.js +2 -2
- package/dist/ui-sdk.umd.cjs +1 -1
- package/package.json +2 -2
- package/src/modules/ObjectPermissions/_internals/components/permissions-tab-role-popup.vue +3 -3
- package/src/modules/ObjectPermissions/components/permissions-tab.vue +78 -94
- package/src/modules/TableComponentModule/composables/useTableEmpty.js +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webitel/ui-sdk",
|
|
3
|
-
"version": "24.12.
|
|
3
|
+
"version": "24.12.14",
|
|
4
4
|
"private": false,
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "vite",
|
|
@@ -173,6 +173,6 @@
|
|
|
173
173
|
},
|
|
174
174
|
"engines": {
|
|
175
175
|
"npm": "10.9.0",
|
|
176
|
-
"node": "v22.
|
|
176
|
+
"node": "v22.12.0"
|
|
177
177
|
}
|
|
178
178
|
}
|
|
@@ -7,8 +7,8 @@
|
|
|
7
7
|
|
|
8
8
|
<wt-popup
|
|
9
9
|
:shown="shown"
|
|
10
|
-
size="sm"
|
|
11
10
|
overflow
|
|
11
|
+
size="sm"
|
|
12
12
|
@close="close"
|
|
13
13
|
>
|
|
14
14
|
<template #title>
|
|
@@ -24,13 +24,13 @@
|
|
|
24
24
|
</template>
|
|
25
25
|
<template #actions>
|
|
26
26
|
<wt-button @click="save(grantee)">
|
|
27
|
-
{{ t('
|
|
27
|
+
{{ t('reusable.add') }}
|
|
28
28
|
</wt-button>
|
|
29
29
|
<wt-button
|
|
30
30
|
color="secondary"
|
|
31
31
|
@click="close"
|
|
32
32
|
>
|
|
33
|
-
{{ t('
|
|
33
|
+
{{ t('reusable.close') }}
|
|
34
34
|
</wt-button>
|
|
35
35
|
</template>
|
|
36
36
|
</wt-popup>
|
|
@@ -1,19 +1,17 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<section
|
|
3
3
|
v-if="access.read"
|
|
4
|
-
class="
|
|
4
|
+
class="table-page"
|
|
5
5
|
>
|
|
6
|
-
<header class="
|
|
7
|
-
<h3 class="
|
|
8
|
-
{{
|
|
6
|
+
<header class="table-title">
|
|
7
|
+
<h3 class="table-title__title">
|
|
8
|
+
{{ t('access.operations') }}
|
|
9
9
|
</h3>
|
|
10
|
-
<div class="
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
<!-- >-->
|
|
16
|
-
<!-- </wt-table-actions>-->
|
|
10
|
+
<div class="table-title__actions-wrap">
|
|
11
|
+
<wt-action-bar
|
|
12
|
+
:include="[IconAction.REFRESH]"
|
|
13
|
+
@click:refresh="loadData"
|
|
14
|
+
/>
|
|
17
15
|
<role-popup
|
|
18
16
|
v-if="props.access.add"
|
|
19
17
|
:namespace="tableNamespace"
|
|
@@ -23,81 +21,67 @@
|
|
|
23
21
|
|
|
24
22
|
<wt-loader v-show="isLoading" />
|
|
25
23
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
:disabled="!access.edit"
|
|
88
|
-
:options="accessOptions"
|
|
89
|
-
:value="item.access.d"
|
|
90
|
-
@input="changeAccessMode({ item, ruleName: 'd', mode: $event })"
|
|
91
|
-
/>
|
|
92
|
-
</template>
|
|
93
|
-
<template #actions="{ item }">
|
|
94
|
-
<wt-icon-action
|
|
95
|
-
action="delete"
|
|
96
|
-
@click="changeAccessMode({ item, ruleName: 'r', mode: { id: AccessMode.FORBIDDEN }})"
|
|
97
|
-
/>
|
|
98
|
-
</template>
|
|
99
|
-
</wt-table>
|
|
100
|
-
<!-- </transition-slide>-->
|
|
24
|
+
<wt-empty
|
|
25
|
+
v-show="showEmpty"
|
|
26
|
+
:image="imageEmpty"
|
|
27
|
+
:text="textEmpty"
|
|
28
|
+
/>
|
|
29
|
+
|
|
30
|
+
<div class="table-section__table-wrapper">
|
|
31
|
+
<div>
|
|
32
|
+
<wt-table-transition
|
|
33
|
+
v-if="dataList.length && !isLoading">
|
|
34
|
+
<wt-table
|
|
35
|
+
:data="localizedDataList"
|
|
36
|
+
:grid-actions="access.edit"
|
|
37
|
+
:headers="headers"
|
|
38
|
+
:selectable="false"
|
|
39
|
+
sortable
|
|
40
|
+
@sort="sort"
|
|
41
|
+
>
|
|
42
|
+
<template #grantee="{ item }">
|
|
43
|
+
<role-column
|
|
44
|
+
:role="item.grantee"
|
|
45
|
+
/>
|
|
46
|
+
</template>
|
|
47
|
+
|
|
48
|
+
<template #read="{ item }">
|
|
49
|
+
<wt-select
|
|
50
|
+
:clearable="false"
|
|
51
|
+
:disabled="!access.edit"
|
|
52
|
+
:options="accessOptions"
|
|
53
|
+
:value="item.access.r"
|
|
54
|
+
@input="changeAccessMode({ item, ruleName: 'r', mode: $event })"
|
|
55
|
+
/>
|
|
56
|
+
</template>
|
|
57
|
+
|
|
58
|
+
<template #edit="{ item }">
|
|
59
|
+
<wt-select
|
|
60
|
+
:clearable="false"
|
|
61
|
+
:disabled="!access.edit"
|
|
62
|
+
:options="accessOptions"
|
|
63
|
+
:value="item.access.w"
|
|
64
|
+
@input="changeAccessMode({ item, ruleName: 'w', mode: $event })"
|
|
65
|
+
/>
|
|
66
|
+
</template>
|
|
67
|
+
|
|
68
|
+
<template #delete="{ item }">
|
|
69
|
+
<wt-select
|
|
70
|
+
:clearable="false"
|
|
71
|
+
:disabled="!access.edit"
|
|
72
|
+
:options="accessOptions"
|
|
73
|
+
:value="item.access.d"
|
|
74
|
+
@input="changeAccessMode({ item, ruleName: 'd', mode: $event })"
|
|
75
|
+
/>
|
|
76
|
+
</template>
|
|
77
|
+
<template #actions="{ item }">
|
|
78
|
+
<wt-icon-action
|
|
79
|
+
action="delete"
|
|
80
|
+
@click="changeAccessMode({ item, ruleName: 'r', mode: { id: AccessMode.FORBIDDEN }})"
|
|
81
|
+
/>
|
|
82
|
+
</template>
|
|
83
|
+
</wt-table>
|
|
84
|
+
</wt-table-transition>
|
|
101
85
|
</div>
|
|
102
86
|
<filter-pagination
|
|
103
87
|
:namespace="filtersNamespace"
|
|
@@ -108,8 +92,6 @@
|
|
|
108
92
|
</template>
|
|
109
93
|
|
|
110
94
|
<script setup>
|
|
111
|
-
// TODO: класи, даммі, транзішен таблички. WTEL-3392
|
|
112
|
-
|
|
113
95
|
import { computed, onUnmounted } from 'vue';
|
|
114
96
|
import { useI18n } from 'vue-i18n';
|
|
115
97
|
import { useStore } from 'vuex';
|
|
@@ -119,6 +101,8 @@ import { useTableFilters } from '../../Filters/composables/useTableFilters.js';
|
|
|
119
101
|
import RoleColumn from '../_internals/components/permissions-role-row.vue';
|
|
120
102
|
import RolePopup from '../_internals/components/permissions-tab-role-popup.vue';
|
|
121
103
|
import { AccessMode } from '../_internals/enums/AccessMode.enum.js';
|
|
104
|
+
import IconAction from '../../../enums/IconAction/IconAction.enum.js';
|
|
105
|
+
import { useTableEmpty } from '../../../modules/TableComponentModule/composables/useTableEmpty.js';
|
|
122
106
|
|
|
123
107
|
const props = defineProps({
|
|
124
108
|
/**
|
|
@@ -154,7 +138,7 @@ const {
|
|
|
154
138
|
isNext,
|
|
155
139
|
error,
|
|
156
140
|
|
|
157
|
-
loadData,
|
|
141
|
+
loadData,
|
|
158
142
|
sort,
|
|
159
143
|
onFilterEvent,
|
|
160
144
|
} = useTableStore(`${props.namespace}/permissions`);
|
|
@@ -197,11 +181,11 @@ onUnmounted(() => {
|
|
|
197
181
|
flushSubscribers();
|
|
198
182
|
});
|
|
199
183
|
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
184
|
+
const {
|
|
185
|
+
showEmpty,
|
|
186
|
+
image: imageEmpty,
|
|
187
|
+
text: textEmpty,
|
|
188
|
+
} = useTableEmpty({ dataList, error, isLoading });
|
|
205
189
|
|
|
206
190
|
const accessOptions = computed(() => {
|
|
207
191
|
return Object.values(AccessMode).map((mode) => ({
|
|
@@ -83,7 +83,7 @@ export const useTableEmpty = ({ dataList, filters, error, isLoading }, overrides
|
|
|
83
83
|
if (!emptyState?.value) return null;
|
|
84
84
|
|
|
85
85
|
if (error.value) return EmptyCause.ERROR;
|
|
86
|
-
if (filters
|
|
86
|
+
if (filters?.value) {
|
|
87
87
|
const uncheckedFilters = ['page', 'size', 'sort', 'fields'];
|
|
88
88
|
const filtersApplied = Object.entries(filters.value).some(
|
|
89
89
|
([filterValue, filterName]) =>
|