@dative-gpi/foundation-core-components 1.1.12 → 1.1.14-fix-last
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/entities/FSEntityField.vue +3 -5
- package/components/entities/FSSelectEntitiesList.vue +4 -8
- package/components/entities/FSSimpleEntitiesList.vue +1 -3
- package/components/entities/FSTileEntitiesList.vue +1 -3
- package/components/explorers/FSBaseDashboardsExplorer.vue +312 -0
- package/components/explorers/FSDashboardExplorerElementTypeChip.vue +37 -0
- package/components/lists/chartOrganisationTypes/FSBaseChartOrganisationTypesList.vue +7 -6
- package/components/lists/chartOrganisations/FSBaseChartOrganisationsList.vue +7 -6
- package/components/lists/charts/FSBaseChartsList.vue +7 -14
- package/components/lists/dashboards/FSBaseDashboardsList.vue +40 -224
- package/components/lists/dashboards/FSSimpleDashboardsList.vue +27 -53
- package/components/lists/dashboards/FSTileDashboardsList.vue +30 -62
- package/components/lists/folders/FSBaseFoldersList.vue +1 -5
- package/components/lists/userOrganisations/FSBaseUserOrganisationsList.vue +4 -6
- package/package.json +7 -7
- package/utils/dashboards.ts +10 -28
- package/utils/tables.ts +11 -7
- package/utils/users.ts +11 -1
- package/components/explorers/FSBaseFoldersExplorer.vue +0 -337
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
defaultMode="iterator"
|
|
4
|
-
:items="items"
|
|
5
|
-
:itemTo="$props.itemTo"
|
|
6
|
-
:headersOptions="headersOptions"
|
|
7
|
-
:loading="fetchingDashboardOrganisationTypes || fetchingDashboardOrganisations || fetchingDashboardShallows"
|
|
2
|
+
<FSBaseDashboardsExplorer
|
|
8
3
|
:tableCode="$props.tableCode"
|
|
4
|
+
:allowedTypes="$props.allowedTypes"
|
|
5
|
+
:dashboardExplorerElementsFilters="$props.dashboardExplorerElementsFilters"
|
|
6
|
+
:itemTo="$props.itemTo"
|
|
9
7
|
:selectable="$props.selectable"
|
|
10
8
|
:singleSelect="$props.singleSelect"
|
|
11
|
-
:modelValue="
|
|
12
|
-
@update:modelValue="
|
|
9
|
+
:modelValue="$props.modelValue"
|
|
10
|
+
@update:modelValue="$emit('update:modelValue', $event)"
|
|
11
|
+
@update:types="onUpdateTypes"
|
|
13
12
|
v-bind="$attrs"
|
|
14
13
|
>
|
|
15
14
|
<template
|
|
@@ -21,117 +20,22 @@
|
|
|
21
20
|
v-bind="slotData"
|
|
22
21
|
/>
|
|
23
22
|
</template>
|
|
24
|
-
|
|
25
|
-
#item.icon="{ item }"
|
|
26
|
-
>
|
|
27
|
-
<FSIcon>
|
|
28
|
-
{{ item.icon }}
|
|
29
|
-
</FSIcon>
|
|
30
|
-
</template>
|
|
31
|
-
<template
|
|
32
|
-
#item.dashboardType="{ item }"
|
|
33
|
-
>
|
|
34
|
-
<FSChip
|
|
35
|
-
:color="ColorEnum.Light"
|
|
36
|
-
:label="dashboardTypeLabel(item.dashboardType)"
|
|
37
|
-
/>
|
|
38
|
-
</template>
|
|
39
|
-
<template
|
|
40
|
-
#item.main="{ item }"
|
|
41
|
-
>
|
|
42
|
-
<FSIcon
|
|
43
|
-
v-if="item.id === mainOrganisationDashboardId"
|
|
44
|
-
>
|
|
45
|
-
mdi-account-group-outline
|
|
46
|
-
</FSIcon>
|
|
47
|
-
<FSIcon
|
|
48
|
-
v-if="item.id === mainUserDashboardId"
|
|
49
|
-
>
|
|
50
|
-
mdi-home
|
|
51
|
-
</FSIcon>
|
|
52
|
-
</template>
|
|
53
|
-
<template
|
|
54
|
-
#item.tags="{ item }"
|
|
55
|
-
>
|
|
56
|
-
<FSTagGroup
|
|
57
|
-
variant="slide"
|
|
58
|
-
:showRemove="false"
|
|
59
|
-
:tags="item.tags"
|
|
60
|
-
/>
|
|
61
|
-
</template>
|
|
62
|
-
<template
|
|
63
|
-
#item.tile="{ index, item, toggleSelect }"
|
|
64
|
-
>
|
|
65
|
-
<FSDashboardOrganisationTypeTileUI
|
|
66
|
-
v-if="item.dashboardType == DashboardType.OrganisationType"
|
|
67
|
-
:key="index"
|
|
68
|
-
:bottomColor="item.colors"
|
|
69
|
-
:selectable="$props.selectable"
|
|
70
|
-
:singleSelect="$props.singleSelect"
|
|
71
|
-
:to="$props.itemTo && $props.itemTo(item)"
|
|
72
|
-
:modelValue="isSelected(item.id)"
|
|
73
|
-
@update:modelValue="toggleSelect(item)"
|
|
74
|
-
v-bind="item"
|
|
75
|
-
/>
|
|
76
|
-
<FSDashboardOrganisationTileUI
|
|
77
|
-
v-if="item.dashboardType == DashboardType.Organisation"
|
|
78
|
-
:key="index"
|
|
79
|
-
:bottomColor="item.colors"
|
|
80
|
-
:selectable="$props.selectable"
|
|
81
|
-
:singleSelect="$props.singleSelect"
|
|
82
|
-
:to="$props.itemTo && $props.itemTo(item)"
|
|
83
|
-
:modelValue="isSelected(item.id)"
|
|
84
|
-
@update:modelValue="toggleSelect(item)"
|
|
85
|
-
v-bind="item"
|
|
86
|
-
/>
|
|
87
|
-
<FSDashboardShallowTileUI
|
|
88
|
-
v-if="item.dashboardType == DashboardType.Shallow"
|
|
89
|
-
:key="index"
|
|
90
|
-
:bottomColor="item.colors"
|
|
91
|
-
:selectable="$props.selectable"
|
|
92
|
-
:singleSelect="$props.singleSelect"
|
|
93
|
-
:modelValue="isSelected(item.id)"
|
|
94
|
-
@update:modelValue="toggleSelect(item)"
|
|
95
|
-
:to="$props.itemTo && $props.itemTo(item)"
|
|
96
|
-
v-bind="item"
|
|
97
|
-
/>
|
|
98
|
-
</template>
|
|
99
|
-
</FSDataTable>
|
|
23
|
+
</FSBaseDashboardsExplorer>
|
|
100
24
|
</template>
|
|
101
25
|
|
|
102
26
|
<script lang="ts">
|
|
103
|
-
import
|
|
27
|
+
import { defineComponent, type PropType } from "vue";
|
|
104
28
|
import type { RouteLocation } from "vue-router";
|
|
105
|
-
import { computed, defineComponent, onMounted, type PropType, ref, watch } from "vue";
|
|
106
|
-
|
|
107
|
-
import { useAppOrganisationId, useCurrentUserOrganisation, useDashboardOrganisations, useDashboardOrganisationTypes, useDashboardShallows } from "@dative-gpi/foundation-core-services/composables";
|
|
108
|
-
import type { DashboardOrganisationTypeFilters, DashboardOrganisationFilters, DashboardShallowFilters, DashboardInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
109
|
-
import { useOrganisation } from "@dative-gpi/foundation-shared-services/composables";
|
|
110
29
|
|
|
111
|
-
import {
|
|
112
|
-
import {
|
|
113
|
-
import { DashboardType } from "@dative-gpi/foundation-shared-domain/enums";
|
|
114
|
-
import { getEnumEntries } from '@dative-gpi/foundation-shared-domain';
|
|
30
|
+
import { DashboardExplorerElementType, DashboardType } from "@dative-gpi/foundation-shared-domain/enums";
|
|
31
|
+
import type { DashboardExplorerElementFilters, DashboardExplorerElementInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
115
32
|
|
|
116
|
-
import
|
|
117
|
-
import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
|
|
118
|
-
import FSDashboardShallowTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardShallowTileUI.vue";
|
|
119
|
-
import FSDashboardOrganisationTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardOrganisationTileUI.vue";
|
|
120
|
-
import FSDashboardOrganisationTypeTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardOrganisationTypeTileUI.vue";
|
|
121
|
-
|
|
122
|
-
import FSDataTable from "../FSDataTable.vue";
|
|
123
|
-
import FSChip from '@dative-gpi/foundation-shared-components/components/FSChip.vue';
|
|
33
|
+
import FSBaseDashboardsExplorer from "../../explorers/FSBaseDashboardsExplorer.vue";
|
|
124
34
|
|
|
125
35
|
export default defineComponent({
|
|
126
36
|
name: "FSBaseDashboardsList",
|
|
127
37
|
components: {
|
|
128
|
-
|
|
129
|
-
FSTagGroup,
|
|
130
|
-
FSChip,
|
|
131
|
-
FSIcon,
|
|
132
|
-
FSDashboardOrganisationTileUI,
|
|
133
|
-
FSDashboardOrganisationTypeTileUI,
|
|
134
|
-
FSDashboardShallowTileUI
|
|
38
|
+
FSBaseDashboardsExplorer
|
|
135
39
|
},
|
|
136
40
|
props: {
|
|
137
41
|
tableCode: {
|
|
@@ -139,23 +43,17 @@ export default defineComponent({
|
|
|
139
43
|
required: false,
|
|
140
44
|
default: null
|
|
141
45
|
},
|
|
142
|
-
|
|
143
|
-
type:
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
required: false
|
|
151
|
-
},
|
|
152
|
-
dashboardShallowsFilters: {
|
|
153
|
-
type: Object as PropType<DashboardShallowFilters>,
|
|
154
|
-
default: undefined,
|
|
155
|
-
required: false
|
|
46
|
+
allowedTypes: {
|
|
47
|
+
type: Array as PropType<DashboardExplorerElementType[]>,
|
|
48
|
+
required: false,
|
|
49
|
+
default: () => [
|
|
50
|
+
DashboardExplorerElementType.DashboardOrganisation,
|
|
51
|
+
DashboardExplorerElementType.DashboardShallow,
|
|
52
|
+
DashboardExplorerElementType.DashboardOrganisationType
|
|
53
|
+
]
|
|
156
54
|
},
|
|
157
55
|
itemTo: {
|
|
158
|
-
type: Function as PropType<(item:
|
|
56
|
+
type: Function as PropType<(item: DashboardExplorerElementInfos) => Partial<RouteLocation>>,
|
|
159
57
|
required: false
|
|
160
58
|
},
|
|
161
59
|
modelValue: {
|
|
@@ -173,109 +71,27 @@ export default defineComponent({
|
|
|
173
71
|
required: false,
|
|
174
72
|
default: false
|
|
175
73
|
},
|
|
74
|
+
dashboardExplorerElementsFilters: {
|
|
75
|
+
type: Object as PropType<DashboardExplorerElementFilters>,
|
|
76
|
+
required: false,
|
|
77
|
+
default: () => ({})
|
|
78
|
+
},
|
|
176
79
|
},
|
|
177
|
-
emits: ["update
|
|
178
|
-
setup(
|
|
179
|
-
const
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
const items = computed((): DashboardsListItem[] => {
|
|
189
|
-
return _.sortBy([
|
|
190
|
-
...dashboardOrganisationTypes.value.map(g => ({
|
|
191
|
-
...g,
|
|
192
|
-
dashboardType: DashboardType.OrganisationType
|
|
193
|
-
})) as DashboardsListItem[],
|
|
194
|
-
...dashboardOrganisations.value.map(d => ({
|
|
195
|
-
...d,
|
|
196
|
-
dashboardType: DashboardType.Organisation
|
|
197
|
-
})) as DashboardsListItem[],
|
|
198
|
-
...dashboardShallows.value.map(d => ({
|
|
199
|
-
...d,
|
|
200
|
-
dashboardType: DashboardType.Shallow
|
|
201
|
-
})) as DashboardsListItem[]
|
|
202
|
-
], d => d.label);
|
|
203
|
-
});
|
|
204
|
-
|
|
205
|
-
const headersOptions = computed(() => ({
|
|
206
|
-
dashboardType: {
|
|
207
|
-
fixedFilters: getEnumEntries(DashboardType).filter(e => e.value != DashboardType.None).map(e => ({
|
|
208
|
-
value: e.value,
|
|
209
|
-
text: dashboardTypeLabel(e.value)
|
|
210
|
-
})),
|
|
211
|
-
methodFilter: (value: DashboardType, item: DashboardType) => value == item
|
|
212
|
-
}
|
|
213
|
-
}));
|
|
214
|
-
|
|
215
|
-
const mainUserDashboardId = computed(() => {
|
|
216
|
-
return userOrganisation.value?.mainDashboardId;
|
|
217
|
-
});
|
|
218
|
-
|
|
219
|
-
const mainOrganisationDashboardId = computed(() => {
|
|
220
|
-
return organisation.value?.mainDashboardId;
|
|
221
|
-
});
|
|
222
|
-
|
|
223
|
-
const onSelect = (values: string[]) => {
|
|
224
|
-
selecteds.value = values;
|
|
225
|
-
const selectedItems = items.value.filter(i => selecteds.value!.includes(i.id));
|
|
226
|
-
const newModelValue = selectedItems.map(i => i.id);
|
|
227
|
-
const newType = selectedItems.map(i => i.dashboardType);
|
|
228
|
-
emit("update:modelValue", newModelValue);
|
|
229
|
-
emit("update:type", newType);
|
|
230
|
-
emit("update", { modelValue: newModelValue, type: newType });
|
|
231
|
-
};
|
|
232
|
-
|
|
233
|
-
const isSelected = (id: string) => {
|
|
234
|
-
return selecteds.value?.includes(id);
|
|
80
|
+
emits: ["update:modelValue", "update:types"],
|
|
81
|
+
setup(_, { emit }) {
|
|
82
|
+
const onUpdateTypes = (types: (DashboardExplorerElementType | undefined)[]): void => {
|
|
83
|
+
emit("update:types", types.map(t => {
|
|
84
|
+
switch (t) {
|
|
85
|
+
case DashboardExplorerElementType.DashboardOrganisation: return DashboardType.Organisation;
|
|
86
|
+
case DashboardExplorerElementType.DashboardShallow: return DashboardType.Shallow;
|
|
87
|
+
case DashboardExplorerElementType.DashboardOrganisationType: return DashboardType.OrganisationType;
|
|
88
|
+
default: return DashboardType.None;
|
|
89
|
+
}
|
|
90
|
+
}));
|
|
235
91
|
};
|
|
236
92
|
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
})
|
|
240
|
-
|
|
241
|
-
watch(() => organisationId.value, () => {
|
|
242
|
-
if (organisationId.value) {
|
|
243
|
-
getOrganisation(organisationId.value);
|
|
244
|
-
}
|
|
245
|
-
}, { immediate: true });
|
|
246
|
-
|
|
247
|
-
watch(() => props.dashboardOrganisationTypeFetchFilter, (next, previous) => {
|
|
248
|
-
if ((!next && !previous) || !_.isEqual(next, previous)) {
|
|
249
|
-
getManyDashboardOrganisationTypes(props.dashboardOrganisationTypeFetchFilter);
|
|
250
|
-
}
|
|
251
|
-
}, { immediate: true });
|
|
252
|
-
|
|
253
|
-
watch(() => props.dashboardOrganisationsFilters, (next, previous) => {
|
|
254
|
-
if ((!next && !previous) || !_.isEqual(next, previous)) {
|
|
255
|
-
getManyDashboardOrganisations(props.dashboardOrganisationsFilters);
|
|
256
|
-
}
|
|
257
|
-
}, { immediate: true });
|
|
258
|
-
|
|
259
|
-
watch(() => props.dashboardShallowsFilters, (next, previous) => {
|
|
260
|
-
if ((!next && !previous) || !_.isEqual(next, previous)) {
|
|
261
|
-
getManyDashboardShallows(props.dashboardShallowsFilters);
|
|
262
|
-
}
|
|
263
|
-
}, { immediate: true });
|
|
264
|
-
|
|
265
|
-
return {
|
|
266
|
-
fetchingDashboardOrganisationTypes,
|
|
267
|
-
fetchingDashboardOrganisations,
|
|
268
|
-
fetchingDashboardShallows,
|
|
269
|
-
headersOptions,
|
|
270
|
-
selecteds,
|
|
271
|
-
ColorEnum,
|
|
272
|
-
items,
|
|
273
|
-
mainUserDashboardId,
|
|
274
|
-
mainOrganisationDashboardId,
|
|
275
|
-
onSelect,
|
|
276
|
-
isSelected,
|
|
277
|
-
DashboardType,
|
|
278
|
-
dashboardTypeLabel
|
|
93
|
+
return {
|
|
94
|
+
onUpdateTypes
|
|
279
95
|
};
|
|
280
96
|
}
|
|
281
97
|
});
|
|
@@ -7,14 +7,11 @@
|
|
|
7
7
|
</template>
|
|
8
8
|
|
|
9
9
|
<script lang="ts">
|
|
10
|
-
import { defineComponent, type PropType,
|
|
11
|
-
import _ from "lodash";
|
|
10
|
+
import { defineComponent, type PropType, computed, watch } from "vue";
|
|
12
11
|
|
|
13
|
-
import
|
|
14
|
-
import {
|
|
15
|
-
|
|
16
|
-
import { DashboardType } from '@dative-gpi/foundation-shared-domain/enums';
|
|
17
|
-
import type { DashboardsListItem } from '@dative-gpi/foundation-core-components/utils';
|
|
12
|
+
import { DashboardExplorerElementType } from "@dative-gpi/foundation-shared-domain/enums";
|
|
13
|
+
import { useDashboardExplorerElements } from "@dative-gpi/foundation-core-services/composables";
|
|
14
|
+
import type { DashboardExplorerElementFilters, DashboardExplorerElementInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
18
15
|
|
|
19
16
|
import FSSimpleList from "@dative-gpi/foundation-shared-components/components/lists/FSSimpleList.vue";
|
|
20
17
|
|
|
@@ -24,66 +21,43 @@ export default defineComponent({
|
|
|
24
21
|
FSSimpleList,
|
|
25
22
|
},
|
|
26
23
|
props: {
|
|
27
|
-
|
|
28
|
-
type:
|
|
29
|
-
required: false,
|
|
30
|
-
default: () => ({})
|
|
31
|
-
},
|
|
32
|
-
dashboardOrganisationTypeFilters: {
|
|
33
|
-
type: Object as PropType<DashboardOrganisationTypeFilters>,
|
|
24
|
+
allowedTypes: {
|
|
25
|
+
type: Array as PropType<DashboardExplorerElementType[]>,
|
|
34
26
|
required: false,
|
|
35
|
-
default: () =>
|
|
27
|
+
default: () => [
|
|
28
|
+
DashboardExplorerElementType.DashboardOrganisation,
|
|
29
|
+
DashboardExplorerElementType.DashboardShallow,
|
|
30
|
+
DashboardExplorerElementType.DashboardOrganisationType
|
|
31
|
+
]
|
|
36
32
|
},
|
|
37
|
-
|
|
38
|
-
type: Object as PropType<
|
|
33
|
+
dashboardExplorerElementsFilters: {
|
|
34
|
+
type: Object as PropType<DashboardExplorerElementFilters>,
|
|
39
35
|
required: false,
|
|
40
|
-
default:
|
|
36
|
+
default: () => ({})
|
|
41
37
|
}
|
|
42
38
|
},
|
|
43
|
-
setup(props){
|
|
44
|
-
const { entities
|
|
45
|
-
getMany: getManyDashboardOrganisations,
|
|
46
|
-
fetching: fetchingDashboardOrganisations } = useDashboardOrganisations();
|
|
47
|
-
const { entities: dashboardOrganisationTypes,
|
|
48
|
-
getMany: getManyDashboardOrganisationTypes,
|
|
49
|
-
fetching: fetchingDashboardOrganisationTypes } = useDashboardOrganisationTypes();
|
|
50
|
-
const { entities: dashboardShallows,
|
|
51
|
-
getMany: getManyDashboardShallows,
|
|
52
|
-
fetching: fetchingDashboardShallows } = useDashboardShallows();
|
|
39
|
+
setup(props) {
|
|
40
|
+
const { entities, fetching, getMany } = useDashboardExplorerElements();
|
|
53
41
|
|
|
54
|
-
const
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
const dashboards = computed((): DashboardsListItem[] => {
|
|
59
|
-
return _.sortBy([
|
|
60
|
-
...dashboardOrganisationTypes.value.map(g => ({
|
|
61
|
-
...g,
|
|
62
|
-
dashboardType: DashboardType.OrganisationType
|
|
63
|
-
})) satisfies DashboardsListItem[],
|
|
64
|
-
...dashboardOrganisations.value.map(d => ({
|
|
65
|
-
...d,
|
|
66
|
-
dashboardType: DashboardType.Organisation
|
|
67
|
-
})) as DashboardsListItem[],
|
|
68
|
-
...dashboardShallows.value.map(d => ({
|
|
69
|
-
...d,
|
|
70
|
-
dashboardType: DashboardType.Shallow
|
|
71
|
-
})) as DashboardsListItem[]
|
|
72
|
-
], d => d.label);
|
|
42
|
+
const dashboards = computed((): DashboardExplorerElementInfos[] => {
|
|
43
|
+
return entities.value
|
|
44
|
+
.filter(e => props.allowedTypes.includes(e.type))
|
|
45
|
+
.sort((a, b) => a.label.localeCompare(b.label));
|
|
73
46
|
});
|
|
74
47
|
|
|
75
48
|
const fetch = () => {
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
49
|
+
getMany({
|
|
50
|
+
types: props.allowedTypes,
|
|
51
|
+
...props.dashboardExplorerElementsFilters
|
|
52
|
+
});
|
|
53
|
+
};
|
|
80
54
|
|
|
81
|
-
watch(() =>
|
|
55
|
+
watch(() => props.dashboardExplorerElementsFilters, fetch, { immediate: true });
|
|
82
56
|
|
|
83
57
|
return {
|
|
84
58
|
dashboards,
|
|
85
59
|
fetching
|
|
86
|
-
}
|
|
60
|
+
};
|
|
87
61
|
}
|
|
88
62
|
});
|
|
89
63
|
</script>
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
#item.tile="{ item, toggleSelect, direction }"
|
|
12
12
|
>
|
|
13
13
|
<FSDashboardOrganisationTileUI
|
|
14
|
-
v-if="item.
|
|
14
|
+
v-if="item.type === DashboardExplorerElementType.DashboardOrganisation"
|
|
15
15
|
:code="item.code"
|
|
16
16
|
:icon="item.icon"
|
|
17
17
|
:label="item.label"
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
@update:modelValue="toggleSelect(item)"
|
|
24
24
|
/>
|
|
25
25
|
<FSDashboardOrganisationTypeTileUI
|
|
26
|
-
v-else-if="item.
|
|
26
|
+
v-else-if="item.type === DashboardExplorerElementType.DashboardOrganisationType"
|
|
27
27
|
:code="item.code"
|
|
28
28
|
:icon="item.icon"
|
|
29
29
|
:label="item.label"
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
@update:modelValue="toggleSelect(item)"
|
|
36
36
|
/>
|
|
37
37
|
<FSDashboardShallowTileUI
|
|
38
|
-
v-else-if="item.
|
|
38
|
+
v-else-if="item.type === DashboardExplorerElementType.DashboardShallow"
|
|
39
39
|
:code="item.code"
|
|
40
40
|
:icon="item.icon"
|
|
41
41
|
:label="item.label"
|
|
@@ -51,23 +51,17 @@
|
|
|
51
51
|
</template>
|
|
52
52
|
|
|
53
53
|
<script lang="ts">
|
|
54
|
-
import { defineComponent, type PropType,
|
|
55
|
-
import _ from "lodash";
|
|
54
|
+
import { defineComponent, type PropType, computed, watch } from "vue";
|
|
56
55
|
|
|
57
|
-
import
|
|
58
|
-
import {
|
|
59
|
-
|
|
60
|
-
import { DashboardType } from '@dative-gpi/foundation-shared-domain/enums';
|
|
61
|
-
import type { DashboardsListItem } from '@dative-gpi/foundation-core-components/utils';
|
|
56
|
+
import { DashboardExplorerElementType, ListDirections } from "@dative-gpi/foundation-shared-domain/enums";
|
|
57
|
+
import { useDashboardExplorerElements } from "@dative-gpi/foundation-core-services/composables";
|
|
58
|
+
import type { DashboardExplorerElementFilters, DashboardExplorerElementInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
62
59
|
|
|
63
60
|
import FSDashboardOrganisationTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardOrganisationTileUI.vue";
|
|
64
61
|
import FSDashboardOrganisationTypeTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardOrganisationTypeTileUI.vue";
|
|
65
62
|
import FSDashboardShallowTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDashboardShallowTileUI.vue";
|
|
66
63
|
import FSTileList from "@dative-gpi/foundation-shared-components/components/lists/FSTileList.vue";
|
|
67
64
|
|
|
68
|
-
import { ListDirections } from "@dative-gpi/foundation-shared-domain/enums";
|
|
69
|
-
|
|
70
|
-
|
|
71
65
|
export default defineComponent({
|
|
72
66
|
name: "FSTileDashboardsList",
|
|
73
67
|
components: {
|
|
@@ -77,20 +71,14 @@ export default defineComponent({
|
|
|
77
71
|
FSDashboardShallowTileUI
|
|
78
72
|
},
|
|
79
73
|
props: {
|
|
80
|
-
|
|
81
|
-
type:
|
|
74
|
+
allowedTypes: {
|
|
75
|
+
type: Array as PropType<DashboardExplorerElementType[]>,
|
|
82
76
|
required: false,
|
|
83
|
-
default: () =>
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
default: () => ({})
|
|
89
|
-
},
|
|
90
|
-
dashboardShallowFilters: {
|
|
91
|
-
type: Object as PropType<DashboardShallowFilters>,
|
|
92
|
-
required: false,
|
|
93
|
-
default: () => ({})
|
|
77
|
+
default: () => [
|
|
78
|
+
DashboardExplorerElementType.DashboardOrganisation,
|
|
79
|
+
DashboardExplorerElementType.DashboardShallow,
|
|
80
|
+
DashboardExplorerElementType.DashboardOrganisationType
|
|
81
|
+
]
|
|
94
82
|
},
|
|
95
83
|
modelValue: {
|
|
96
84
|
type: Array as PropType<string[]>,
|
|
@@ -101,56 +89,36 @@ export default defineComponent({
|
|
|
101
89
|
type: Boolean,
|
|
102
90
|
required: false,
|
|
103
91
|
default: false
|
|
92
|
+
},
|
|
93
|
+
dashboardExplorerElementsFilters: {
|
|
94
|
+
type: Object as PropType<DashboardExplorerElementFilters>,
|
|
95
|
+
required: false,
|
|
96
|
+
default: () => ({})
|
|
104
97
|
}
|
|
105
98
|
},
|
|
106
99
|
emits: ["update:modelValue"],
|
|
107
100
|
setup(props) {
|
|
108
|
-
const { entities
|
|
109
|
-
getMany: getManyDashboardOrganisations,
|
|
110
|
-
fetching: fetchingDashboardOrganisations } = useDashboardOrganisations();
|
|
111
|
-
const { entities: dashboardOrganisationTypes,
|
|
112
|
-
getMany: getManyDashboardOrganisationTypes,
|
|
113
|
-
fetching: fetchingDashboardOrganisationTypes } = useDashboardOrganisationTypes();
|
|
114
|
-
const { entities: dashboardShallows,
|
|
115
|
-
getMany: getManyDashboardShallows,
|
|
116
|
-
fetching: fetchingDashboardShallows } = useDashboardShallows();
|
|
101
|
+
const { entities, fetching, getMany } = useDashboardExplorerElements();
|
|
117
102
|
|
|
118
|
-
const
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
const dashboards = computed((): DashboardsListItem[] => {
|
|
123
|
-
return _.sortBy([
|
|
124
|
-
...dashboardOrganisationTypes.value.map(g => ({
|
|
125
|
-
...g,
|
|
126
|
-
dashboardType: DashboardType.OrganisationType
|
|
127
|
-
})) satisfies DashboardsListItem[],
|
|
128
|
-
...dashboardOrganisations.value.map(d => ({
|
|
129
|
-
...d,
|
|
130
|
-
dashboardType: DashboardType.Organisation
|
|
131
|
-
})) as DashboardsListItem[],
|
|
132
|
-
...dashboardShallows.value.map(d => ({
|
|
133
|
-
...d,
|
|
134
|
-
dashboardType: DashboardType.Shallow
|
|
135
|
-
})) as DashboardsListItem[]
|
|
136
|
-
], d => d.label);
|
|
103
|
+
const dashboards = computed((): DashboardExplorerElementInfos[] => {
|
|
104
|
+
return entities.value
|
|
105
|
+
.filter(e => props.allowedTypes.includes(e.type))
|
|
106
|
+
.sort((a, b) => a.label.localeCompare(b.label));
|
|
137
107
|
});
|
|
138
108
|
|
|
139
109
|
const fetch = () => {
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
110
|
+
getMany({
|
|
111
|
+
types: props.allowedTypes,
|
|
112
|
+
...props.dashboardExplorerElementsFilters
|
|
113
|
+
});
|
|
143
114
|
};
|
|
144
115
|
|
|
145
|
-
watch(
|
|
146
|
-
[() => props.dashboardOrganisationFilters, () => props.dashboardOrganisationTypeFilters, () => props.dashboardShallowFilters],
|
|
147
|
-
fetch,
|
|
148
|
-
{ immediate: true });
|
|
116
|
+
watch(() => props.dashboardExplorerElementsFilters, fetch, { immediate: true });
|
|
149
117
|
|
|
150
118
|
return {
|
|
151
119
|
dashboards,
|
|
152
120
|
fetching,
|
|
153
|
-
|
|
121
|
+
DashboardExplorerElementType,
|
|
154
122
|
ListDirections
|
|
155
123
|
};
|
|
156
124
|
}
|
|
@@ -58,8 +58,6 @@ import { defineComponent, type PropType, watch } from "vue";
|
|
|
58
58
|
|
|
59
59
|
import { useFolders } from "@dative-gpi/foundation-core-services/composables";
|
|
60
60
|
|
|
61
|
-
import { DashboardType } from "@dative-gpi/foundation-shared-domain/enums";
|
|
62
|
-
import { FoldersListType } from "@dative-gpi/foundation-core-components/utils";
|
|
63
61
|
import type { FolderFilters, DashboardInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
64
62
|
|
|
65
63
|
import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
|
|
@@ -119,9 +117,7 @@ export default defineComponent({
|
|
|
119
117
|
fetchingFolders,
|
|
120
118
|
folders,
|
|
121
119
|
onSelect,
|
|
122
|
-
isSelected
|
|
123
|
-
FoldersListType,
|
|
124
|
-
DashboardType
|
|
120
|
+
isSelected
|
|
125
121
|
};
|
|
126
122
|
}
|
|
127
123
|
});
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
<FSSpan
|
|
91
91
|
font="text-overline"
|
|
92
92
|
>
|
|
93
|
-
{{
|
|
93
|
+
{{ formatLastActivity(item.lastActivity) }}
|
|
94
94
|
</FSSpan>
|
|
95
95
|
</template>
|
|
96
96
|
<template
|
|
@@ -114,9 +114,8 @@ import { type RouteLocation } from "vue-router";
|
|
|
114
114
|
import _ from "lodash";
|
|
115
115
|
|
|
116
116
|
import type { UserOrganisationFilters, UserOrganisationInfos } from "@dative-gpi/foundation-core-domain/models";
|
|
117
|
-
import { userTypeLabel, userValidityLabel } from "@dative-gpi/foundation-core-components/utils";
|
|
117
|
+
import { userTypeLabel, userValidityLabel,formatLastActivity } from "@dative-gpi/foundation-core-components/utils";
|
|
118
118
|
import { useUserOrganisations } from "@dative-gpi/foundation-core-services/composables";
|
|
119
|
-
import { useDateFormat } from "@dative-gpi/foundation-shared-services/composables";
|
|
120
119
|
|
|
121
120
|
import FSDataTable from "../FSDataTable.vue";
|
|
122
121
|
|
|
@@ -166,7 +165,6 @@ export default defineComponent({
|
|
|
166
165
|
emits: ["update:modelValue"],
|
|
167
166
|
setup(props) {
|
|
168
167
|
const { getMany: fetchUserOrganisations, entities: userOrganisations, fetching: fetchingUserOrganisations } = useUserOrganisations();
|
|
169
|
-
const { epochToShortTimeFormat } = useDateFormat();
|
|
170
168
|
|
|
171
169
|
const isSelected = (id: string): boolean => {
|
|
172
170
|
return props.modelValue.includes(id);
|
|
@@ -181,10 +179,10 @@ export default defineComponent({
|
|
|
181
179
|
return {
|
|
182
180
|
fetchingUserOrganisations,
|
|
183
181
|
userOrganisations,
|
|
184
|
-
epochToShortTimeFormat,
|
|
185
182
|
userValidityLabel,
|
|
186
183
|
userTypeLabel,
|
|
187
|
-
isSelected
|
|
184
|
+
isSelected,
|
|
185
|
+
formatLastActivity
|
|
188
186
|
};
|
|
189
187
|
}
|
|
190
188
|
});
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"url": "https://github.com/Dative-GPI/foundation-shared-ui.git"
|
|
5
5
|
},
|
|
6
6
|
"sideEffects": false,
|
|
7
|
-
"version": "1.1.
|
|
7
|
+
"version": "1.1.14-fix-last",
|
|
8
8
|
"description": "",
|
|
9
9
|
"publishConfig": {
|
|
10
10
|
"access": "public"
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
"author": "",
|
|
14
14
|
"license": "ISC",
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@dative-gpi/foundation-core-domain": "1.1.
|
|
17
|
-
"@dative-gpi/foundation-core-services": "1.1.
|
|
18
|
-
"@dative-gpi/foundation-shared-components": "1.1.
|
|
19
|
-
"@dative-gpi/foundation-shared-domain": "1.1.
|
|
20
|
-
"@dative-gpi/foundation-shared-services": "1.1.
|
|
16
|
+
"@dative-gpi/foundation-core-domain": "1.1.14-fix-last",
|
|
17
|
+
"@dative-gpi/foundation-core-services": "1.1.14-fix-last",
|
|
18
|
+
"@dative-gpi/foundation-shared-components": "1.1.14-fix-last",
|
|
19
|
+
"@dative-gpi/foundation-shared-domain": "1.1.14-fix-last",
|
|
20
|
+
"@dative-gpi/foundation-shared-services": "1.1.14-fix-last"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"@dative-gpi/bones-ui": "^1.0.0",
|
|
@@ -29,5 +29,5 @@
|
|
|
29
29
|
"sass": "1.71.1",
|
|
30
30
|
"sass-loader": "13.3.2"
|
|
31
31
|
},
|
|
32
|
-
"gitHead": "
|
|
32
|
+
"gitHead": "0e133d0134125e2b5981b29204dbe6627b221ea9"
|
|
33
33
|
}
|