@dative-gpi/foundation-core-components 1.0.164-card → 1.0.164-kiosk

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.
Files changed (4) hide show
  1. package/components/lists/dataCategories/FSBaseDataCategoriesList.vue +8 -10
  2. package/components/lists/dataDefinitions/FSBaseDataDefinitionsList.vue +7 -10
  3. package/components/lists/playlists/FSBasePlaylistsList.vue +173 -0
  4. package/package.json +7 -7
package/components/lists/dataCategories/FSBaseDataCategoriesList.vue CHANGED
@@ -41,17 +41,16 @@
41
41
  <template
42
42
  #item.tile="{ item }"
43
43
  >
44
- <FSCard
44
+ <FSClickable
45
45
  padding="12px"
46
46
  height="60px"
47
47
  width="233px"
48
- :variant="isSelected(item.id) ? CardVariants.Standard : CardVariants.Background"
49
- :color="ColorEnum.Primary"
48
+ :color="isSelected(item.id) ? ColorEnum.Primary : ColorEnum.Dark"
50
49
  @click="$emit('update:modelValue', [item.id])"
51
50
  v-bind="$attrs"
52
51
  >
53
52
  <template
54
- #default="{ contentVariant }"
53
+ #default
55
54
  >
56
55
  <FSRow
57
56
  align="center-center"
@@ -66,11 +65,11 @@
66
65
  <FSIcon
67
66
  :color="item.correlated ? ColorEnum.Primary : ColorEnum.Light"
68
67
  :icon="item.correlated ? 'mdi-link' : 'mdi-link-off'"
69
- :variant="contentVariant"
68
+ variant="dark"
70
69
  />
71
70
  </FSRow>
72
71
  </template>
73
- </FSCard>
72
+ </FSClickable>
74
73
  </template>
75
74
  </FSDataTable>
76
75
  </FSFadeOut>
@@ -81,7 +80,7 @@
81
80
  import { defineComponent, type PropType, ref, watch } from "vue";
82
81
  import _ from "lodash";
83
82
 
84
- import {CardVariants, ColorEnum} from "@dative-gpi/foundation-shared-components/models";
83
+ import {ColorEnum} from "@dative-gpi/foundation-shared-components/models";
85
84
 
86
85
  import { useDataCategories } from "@dative-gpi/foundation-core-services/composables";
87
86
  import type { DataCategoryFilters } from "@dative-gpi/foundation-core-domain/models";
@@ -89,10 +88,10 @@ import type { DataCategoryFilters } from "@dative-gpi/foundation-core-domain/mod
89
88
  import FSDataTable from "../FSDataTable.vue";
90
89
  import FSCol from "@dative-gpi/foundation-shared-components/components/FSCol.vue";
91
90
  import FSRow from "@dative-gpi/foundation-shared-components/components/FSRow.vue";
92
- import FSCard from "@dative-gpi/foundation-shared-components/components/FSCard.vue";
93
91
  import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
94
92
  import FSSpan from "@dative-gpi/foundation-shared-components/components/FSSpan.vue";
95
93
  import FSFadeOut from "@dative-gpi/foundation-shared-components/components/FSFadeOut.vue";
94
+ import FSClickable from "@dative-gpi/foundation-shared-components/components/FSClickable.vue";
96
95
  import FSSearchField from "@dative-gpi/foundation-shared-components/components/fields/FSSearchField.vue";
97
96
  import FSButtonCheckbox from "@dative-gpi/foundation-shared-components/components/buttons/FSButtonCheckbox.vue";
98
97
 
@@ -102,7 +101,7 @@ export default defineComponent({
102
101
  FSDataTable,
103
102
  FSCol,
104
103
  FSFadeOut,
105
- FSCard,
104
+ FSClickable,
106
105
  FSRow,
107
106
  FSSpan,
108
107
  FSSearchField,
@@ -146,7 +145,6 @@ export default defineComponent({
146
145
  return {
147
146
  fetchingDataCategories,
148
147
  dataCategories,
149
- CardVariants,
150
148
  ColorEnum,
151
149
  search,
152
150
  correlated,
package/components/lists/dataDefinitions/FSBaseDataDefinitionsList.vue CHANGED
@@ -28,17 +28,16 @@
28
28
  <template
29
29
  #item.tile="{ item }"
30
30
  >
31
- <FSCard
31
+ <FSClickable
32
32
  padding="12px"
33
33
  height="60px"
34
34
  width="233px"
35
- :color="ColorEnum.Primary"
36
- :variant="isSelected(item.id) ? CardVariants.Standard : CardVariants.Background"
35
+ :color="isSelected(item.id) ? ColorEnum.Primary : ColorEnum.Light"
37
36
  @click="$emit('update:modelValue', [item.id])"
38
37
  v-bind="$attrs"
39
38
  >
40
39
  <template
41
- #default="{ contentVariant }"
40
+ #default
42
41
  >
43
42
  <FSRow
44
43
  align="center-center"
@@ -54,12 +53,11 @@
54
53
  <v-spacer/>
55
54
  <FSIcon
56
55
  :color="ColorEnum.Primary"
57
- :variant="contentVariant"
58
56
  icon="mdi-link"
59
57
  />
60
58
  </FSRow>
61
59
  </template>
62
- </FSCard>
60
+ </FSClickable>
63
61
  </template>
64
62
  </FSDataTable>
65
63
  </template>
@@ -68,7 +66,7 @@
68
66
  import { defineComponent, type PropType, watch } from "vue";
69
67
  import _ from "lodash";
70
68
 
71
- import { CardVariants, ColorEnum } from "@dative-gpi/foundation-shared-components/models";
69
+ import {ColorEnum} from "@dative-gpi/foundation-shared-components/models";
72
70
 
73
71
  import { useDataDefinitions } from "@dative-gpi/foundation-core-services/composables";
74
72
  import type { DataDefinitionFilters } from "@dative-gpi/foundation-core-domain/models";
@@ -77,7 +75,7 @@ import FSDataTable from "../FSDataTable.vue";
77
75
  import FSRow from "@dative-gpi/foundation-shared-components/components/FSRow.vue";
78
76
  import FSSpan from "@dative-gpi/foundation-shared-components/components/FSSpan.vue";
79
77
  import FSIcon from "@dative-gpi/foundation-shared-components/components/FSIcon.vue";
80
- import FSCard from "@dative-gpi/foundation-shared-components/components/FSCard.vue";
78
+ import FSClickable from "@dative-gpi/foundation-shared-components/components/FSClickable.vue";
81
79
  import FSButtonCheckbox from "@dative-gpi/foundation-shared-components/components/buttons/FSButtonCheckbox.vue";
82
80
 
83
81
  export default defineComponent({
@@ -85,7 +83,7 @@ export default defineComponent({
85
83
  components: {
86
84
  FSButtonCheckbox,
87
85
  FSDataTable,
88
- FSCard,
86
+ FSClickable,
89
87
  FSSpan,
90
88
  FSIcon,
91
89
  FSRow,
@@ -124,7 +122,6 @@ export default defineComponent({
124
122
  return {
125
123
  fetchingDataDefinitions,
126
124
  dataDefinitions,
127
- CardVariants,
128
125
  ColorEnum,
129
126
  isSelected
130
127
  };
package/components/lists/playlists/FSBasePlaylistsList.vue ADDED
@@ -0,0 +1,173 @@
1
+ <template>
2
+ <FSCol>
3
+ <FSSearchField
4
+ v-model="search"
5
+ />
6
+ <FSFadeOut
7
+ :maxHeight="$props.maxHeight"
8
+ >
9
+ <FSDataTable
10
+ defaultMode="iterator"
11
+ :loading="fetchingPlaylists"
12
+ :items="playlists"
13
+ :showSearch="false"
14
+ :modelValue="$props.modelValue"
15
+ :disableTable="true"
16
+ :search="search"
17
+ :tableCode="$props.tableCode"
18
+ @update:modelValue="$emit('update:modelValue', $event)"
19
+ v-bind="$attrs"
20
+ >
21
+ <template
22
+ v-for="(_, name) in $slots"
23
+ v-slot:[name]="slotData"
24
+ >
25
+ <slot
26
+ :name="name"
27
+ v-bind="slotData"
28
+ />
29
+ </template>
30
+ <template
31
+ #item.tile="{ item }"
32
+ >
33
+ <FSClickable
34
+ padding="12px"
35
+ height="60px"
36
+ width="216px"
37
+ :color="isSelected(item.id) ? ColorEnum.Primary : ColorEnum.Dark"
38
+ @click="$emit('update:modelValue', [item.id])"
39
+ v-bind="$attrs"
40
+ >
41
+ <template
42
+ #default
43
+ >
44
+ <FSRow
45
+ align="center-center"
46
+ gap="24px"
47
+ :wrap="false"
48
+ >
49
+ <FSSpan
50
+ font="text-overline"
51
+ :lineClamp="1"
52
+ >
53
+ {{ item.label }}
54
+ </FSSpan>
55
+ <FSButton
56
+ variant="icon"
57
+ icon="mdi-trash-can-outline"
58
+ :color="ColorEnum.Error"
59
+ @click="dialog = true"
60
+ />
61
+ </FSRow>
62
+ </template>
63
+ </FSClickable>
64
+ <FSDialogRemove
65
+ :removing="removingPlaylist"
66
+ :error="error"
67
+ :removeTotal="1"
68
+ :removeCurrent="0"
69
+ @click:submitButton="onRemove(item.id)"
70
+ v-model="dialog"
71
+ />
72
+ </template>
73
+ </FSDataTable>
74
+ </FSFadeOut>
75
+ </FSCol>
76
+ </template>
77
+
78
+ <script lang="ts">
79
+ import { defineComponent, type PropType, ref, watch } from "vue";
80
+
81
+ import type { PlaylistFilters } from "@dative-gpi/foundation-core-domain/models";
82
+
83
+ import { ColorEnum } from "@dative-gpi/foundation-shared-components/models";
84
+ import { usePlaylists, useRemovePlaylist } from "@dative-gpi/foundation-core-services/composables";
85
+
86
+ import FSSearchField from "@dative-gpi/foundation-shared-components/components/fields/FSSearchField.vue";
87
+ import FSDialogRemove from "@dative-gpi/foundation-shared-components/components/FSDialogRemove.vue";
88
+ import FSClickable from "@dative-gpi/foundation-shared-components/components/FSClickable.vue";
89
+ import FSFadeOut from "@dative-gpi/foundation-shared-components/components/FSFadeOut.vue";
90
+ import FSButton from "@dative-gpi/foundation-shared-components/components/FSButton.vue";
91
+ import FSSpan from "@dative-gpi/foundation-shared-components/components/FSSpan.vue";
92
+ import FSCol from "@dative-gpi/foundation-shared-components/components/FSCol.vue";
93
+ import FSRow from "@dative-gpi/foundation-shared-components/components/FSRow.vue";
94
+ import FSDataTable from "../FSDataTable.vue";
95
+
96
+ export default defineComponent({
97
+ name: "BasePlaylistsList",
98
+ components:{
99
+ FSDialogRemove,
100
+ FSSearchField,
101
+ FSDataTable,
102
+ FSClickable,
103
+ FSFadeOut,
104
+ FSButton,
105
+ FSSpan,
106
+ FSCol,
107
+ FSRow
108
+ },
109
+ props: {
110
+ playlistFilters: {
111
+ type: Object as PropType<PlaylistFilters>,
112
+ required: false,
113
+ default: null
114
+ },
115
+ modelValue: {
116
+ type: Array as PropType<string[]>,
117
+ default: () => [],
118
+ required: false
119
+ },
120
+ tableCode: {
121
+ type: String,
122
+ required: false
123
+ },
124
+ maxHeight: {
125
+ type: [Array, String, Number] as PropType<string[] | number[] | string | number | null | undefined>,
126
+ required: false,
127
+ default: undefined
128
+ }
129
+ },
130
+ emits: ["update:modelValue"],
131
+ setup(props) {
132
+ const { getMany: fetchPlaylists, fetching: fetchingPlaylists, entities: playlists } = usePlaylists();
133
+ const { removing: removingPlaylist, remove: removePlaylist } = useRemovePlaylist();
134
+ const search = ref<string | undefined>();
135
+ const error = ref<string | null>(null);
136
+ const dialog = ref(false);
137
+
138
+ const isSelected = (id: string): boolean => {
139
+ return props.modelValue.includes(id);
140
+ };
141
+
142
+ const onRemove = async (playlistId: string) => {
143
+ if(!playlistId){
144
+ return;
145
+ }
146
+ try {
147
+ error.value = null;
148
+ await removePlaylist(playlistId);
149
+ dialog.value = false;
150
+ }
151
+ catch (exception: any) {
152
+ error.value = exception.response.data;
153
+ }
154
+ };
155
+
156
+ watch([() => props.playlistFilters, search] , () => {
157
+ fetchPlaylists({...props.playlistFilters, search: search.value});
158
+ }, { immediate: true, deep: true });
159
+
160
+ return {
161
+ fetchingPlaylists,
162
+ removingPlaylist,
163
+ playlists,
164
+ ColorEnum,
165
+ search,
166
+ dialog,
167
+ error,
168
+ isSelected,
169
+ onRemove
170
+ }
171
+ }
172
+ });
173
+ </script>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dative-gpi/foundation-core-components",
3
3
  "sideEffects": false,
4
- "version": "1.0.164-card",
4
+ "version": "1.0.164-kiosk",
5
5
  "description": "",
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -10,11 +10,11 @@
10
10
  "author": "",
11
11
  "license": "ISC",
12
12
  "dependencies": {
13
- "@dative-gpi/foundation-core-domain": "1.0.164-card",
14
- "@dative-gpi/foundation-core-services": "1.0.164-card",
15
- "@dative-gpi/foundation-shared-components": "1.0.164-card",
16
- "@dative-gpi/foundation-shared-domain": "1.0.164-card",
17
- "@dative-gpi/foundation-shared-services": "1.0.164-card"
13
+ "@dative-gpi/foundation-core-domain": "1.0.164-kiosk",
14
+ "@dative-gpi/foundation-core-services": "1.0.164-kiosk",
15
+ "@dative-gpi/foundation-shared-components": "1.0.164-kiosk",
16
+ "@dative-gpi/foundation-shared-domain": "1.0.164-kiosk",
17
+ "@dative-gpi/foundation-shared-services": "1.0.164-kiosk"
18
18
  },
19
19
  "peerDependencies": {
20
20
  "@dative-gpi/bones-ui": "^1.0.0",
@@ -26,5 +26,5 @@
26
26
  "sass": "1.71.1",
27
27
  "sass-loader": "13.3.2"
28
28
  },
29
- "gitHead": "9201b00e2979e983f6c59a484f6319354c319f30"
29
+ "gitHead": "1745c9febf77261cef90485d6e8c31004a321559"
30
30
  }