atom-nuxt 1.0.138 → 1.0.139
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/dist/module.json +3 -3
- package/dist/runtime/components/AlertDisplay.vue +11 -18
- package/dist/runtime/components/AlertDisplay.vue.d.ts +2 -0
- package/dist/runtime/components/CrudAddressSearchField.vue +16 -63
- package/dist/runtime/components/CrudAddressSearchField.vue.d.ts +2 -0
- package/dist/runtime/components/CrudApiSelectorField.vue +11 -24
- package/dist/runtime/components/CrudApiSelectorField.vue.d.ts +30 -0
- package/dist/runtime/components/CrudConfirmDialog.vue +11 -17
- package/dist/runtime/components/CrudConfirmDialog.vue.d.ts +18 -0
- package/dist/runtime/components/CrudErrorDisplay.vue +3 -4
- package/dist/runtime/components/CrudErrorDisplay.vue.d.ts +6 -0
- package/dist/runtime/components/CrudFilter.vue +27 -45
- package/dist/runtime/components/CrudFilter.vue.d.ts +8 -0
- package/dist/runtime/components/CrudFilterList.vue +0 -6
- package/dist/runtime/components/CrudFilterList.vue.d.ts +5 -0
- package/dist/runtime/components/CrudFormDialog.vue +4 -12
- package/dist/runtime/components/CrudFormDialog.vue.d.ts +28 -0
- package/dist/runtime/components/CrudFormLoader.vue +98 -121
- package/dist/runtime/components/CrudFormLoader.vue.d.ts +41 -0
- package/dist/runtime/components/CrudListLoader.vue +15 -26
- package/dist/runtime/components/CrudListLoader.vue.d.ts +36 -0
- package/dist/runtime/components/CrudPaginatedLoader.vue +53 -83
- package/dist/runtime/components/CrudPaginatedLoader.vue.d.ts +70 -0
- package/dist/runtime/components/CrudUploadField.vue +9 -26
- package/dist/runtime/components/CrudUploadField.vue.d.ts +23 -0
- package/dist/runtime/components/CrudUploadFieldSelection.vue +16 -24
- package/dist/runtime/components/CrudUploadFieldSelection.vue.d.ts +18 -0
- package/dist/types.d.mts +4 -2
- package/package.json +17 -18
- package/dist/module.cjs +0 -5
- package/dist/module.d.ts +0 -23
- package/dist/types.d.ts +0 -7
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
<script setup async>
|
|
2
|
-
import {useCrudApi} from "../composables/useCrudApi";
|
|
3
|
-
import {useCrudConverters} from "../composables/useCrudConverters";
|
|
4
|
-
import {usePreviousRoute} from "../composables/usePreviousRoute";
|
|
5
|
-
import {useRoute, useRouter} from
|
|
2
|
+
import { useCrudApi } from "../composables/useCrudApi";
|
|
3
|
+
import { useCrudConverters } from "../composables/useCrudConverters";
|
|
4
|
+
import { usePreviousRoute } from "../composables/usePreviousRoute";
|
|
5
|
+
import { useRoute, useRouter } from "#app";
|
|
6
6
|
import CrudFilterList from "./CrudFilterList.vue";
|
|
7
|
-
import {computed, ref, watch, onMounted, onBeforeUnmount} from "vue";
|
|
8
|
-
import {useDebounceFn} from
|
|
9
|
-
import {useListenerService} from "../composables/useListenerService";
|
|
7
|
+
import { computed, ref, watch, onMounted, onBeforeUnmount } from "vue";
|
|
8
|
+
import { useDebounceFn } from "@vueuse/core";
|
|
9
|
+
import { useListenerService } from "../composables/useListenerService";
|
|
10
10
|
import CrudFormDialog from "./CrudFormDialog.vue";
|
|
11
11
|
import CrudErrorDisplay from "./CrudErrorDisplay.vue";
|
|
12
|
-
|
|
13
|
-
const {parseQuery, stringifyQuery, cloneDeep} = useCrudConverters();
|
|
12
|
+
const { parseQuery, stringifyQuery, cloneDeep } = useCrudConverters();
|
|
14
13
|
const props = defineProps({
|
|
15
14
|
fullScreenDialog: {
|
|
16
15
|
type: Boolean,
|
|
@@ -145,40 +144,29 @@ const {
|
|
|
145
144
|
hasExportErrors,
|
|
146
145
|
hasListErrors
|
|
147
146
|
} = useCrudApi(props.path, false, props.transformItem, props.transformItems);
|
|
148
|
-
|
|
149
147
|
perPage.value = props.perPage;
|
|
150
|
-
|
|
151
148
|
const route = useRoute();
|
|
152
149
|
const router = useRouter();
|
|
153
150
|
const previousRoute = usePreviousRoute();
|
|
154
|
-
|
|
155
|
-
const
|
|
156
|
-
const actionId = computed(() => route.query[(props.loaderKey ?? '') + 'actionId']);
|
|
157
|
-
|
|
151
|
+
const action = computed(() => route.query[(props.loaderKey ?? "") + "action"]);
|
|
152
|
+
const actionId = computed(() => route.query[(props.loaderKey ?? "") + "actionId"]);
|
|
158
153
|
const dialogOpen = computed({
|
|
159
|
-
get: () => !!(action.value === "create" ||
|
|
154
|
+
get: () => !!(action.value === "create" || action.value === "update" && actionId.value || action.value === "delete" && actionId.value),
|
|
160
155
|
set: (value) => {
|
|
161
156
|
if (!value) {
|
|
162
|
-
const hasBackState = router.options.history.state.back
|
|
163
|
-
|
|
164
|
-
console.log(
|
|
165
|
-
console.log(
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
console.log('currentRouteName', currentRouteName)
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
if (hasBackState && previousRouteName === currentRouteName) { // Only go back if there's a back state AND the previous route is the same
|
|
176
|
-
console.log('going back')
|
|
157
|
+
const hasBackState = router.options.history.state.back;
|
|
158
|
+
console.log("hasBackState", hasBackState);
|
|
159
|
+
console.log("previousRoute", previousRoute.value);
|
|
160
|
+
console.log("route", route);
|
|
161
|
+
const previousRouteName = previousRoute.value?.name;
|
|
162
|
+
const currentRouteName = route.name;
|
|
163
|
+
console.log("previousRouteName", previousRouteName);
|
|
164
|
+
console.log("currentRouteName", currentRouteName);
|
|
165
|
+
if (hasBackState && previousRouteName === currentRouteName) {
|
|
166
|
+
console.log("going back");
|
|
177
167
|
router.back();
|
|
178
168
|
} else {
|
|
179
|
-
|
|
180
|
-
const currentQuery = {...route.query};
|
|
181
|
-
|
|
169
|
+
const currentQuery = { ...route.query };
|
|
182
170
|
if (props.loaderKey) {
|
|
183
171
|
delete currentQuery[`${props.loaderKey}action`];
|
|
184
172
|
delete currentQuery[`${props.loaderKey}actionId`];
|
|
@@ -186,99 +174,89 @@ const dialogOpen = computed({
|
|
|
186
174
|
delete currentQuery.action;
|
|
187
175
|
delete currentQuery.actionId;
|
|
188
176
|
}
|
|
189
|
-
|
|
190
177
|
const finalRoute = {
|
|
191
178
|
path: route.path,
|
|
192
|
-
query: currentQuery
|
|
179
|
+
query: currentQuery
|
|
193
180
|
};
|
|
194
181
|
router.replace(finalRoute);
|
|
195
182
|
}
|
|
196
183
|
}
|
|
197
184
|
}
|
|
198
185
|
});
|
|
199
|
-
|
|
200
|
-
|
|
201
186
|
const page = computed(() => props.loaderKey ? parseQuery(route.query[props.loaderKey])?.page ?? 1 : route.query.page ?? 1);
|
|
202
|
-
const filterValues = props.loaderKey ? ref({...props.customFilters, ...parseQuery(route.query[props.loaderKey])}
|
|
203
|
-
const onQueryChange = (
|
|
187
|
+
const filterValues = props.loaderKey ? ref({ ...props.customFilters, ...parseQuery(route.query[props.loaderKey]) }) : ref({ ...props.customFilters, ...route.query });
|
|
188
|
+
const onQueryChange = (page2) => {
|
|
204
189
|
console.error("QUERY CHANGED");
|
|
205
|
-
let newQuery = {}
|
|
190
|
+
let newQuery = {};
|
|
206
191
|
let existingQuery = parseQuery(route.query);
|
|
207
|
-
|
|
208
192
|
for (let key in filterValues.value) {
|
|
209
193
|
if (filterValues.value[key] !== null && filterValues.value[key] !== "") {
|
|
210
194
|
newQuery[key] = filterValues.value[key];
|
|
211
195
|
}
|
|
212
196
|
}
|
|
213
|
-
newQuery.page =
|
|
197
|
+
newQuery.page = page2;
|
|
214
198
|
let finalQuery = {
|
|
215
|
-
...existingQuery
|
|
216
|
-
}
|
|
199
|
+
...existingQuery
|
|
200
|
+
};
|
|
217
201
|
if (props.loaderKey) {
|
|
218
202
|
finalQuery[props.loaderKey] = stringifyQuery(newQuery);
|
|
219
203
|
} else {
|
|
220
204
|
finalQuery = newQuery;
|
|
221
205
|
}
|
|
222
206
|
console.error("Setting query", finalQuery);
|
|
223
|
-
router.replace({path: route.path, query: finalQuery, force: true})
|
|
224
|
-
}
|
|
207
|
+
router.replace({ path: route.path, query: finalQuery, force: true });
|
|
208
|
+
};
|
|
225
209
|
watch(currentPage, (newVal, oldValue) => {
|
|
226
210
|
onQueryChange(currentPage.value);
|
|
227
211
|
});
|
|
228
212
|
watch(filterValues, (newVal, oldValue) => {
|
|
229
213
|
console.error("FILTERS CHANGED");
|
|
230
214
|
onQueryChange(1);
|
|
231
|
-
}, {deep: true});
|
|
232
|
-
|
|
233
|
-
|
|
215
|
+
}, { deep: true });
|
|
234
216
|
watch(() => page, () => {
|
|
235
217
|
console.error("ROUTE CHANGED");
|
|
236
218
|
debouncedGet();
|
|
237
|
-
}, {deep: true});
|
|
219
|
+
}, { deep: true });
|
|
238
220
|
watch(() => filterValues, () => {
|
|
239
221
|
console.error("ROUTE CHANGED");
|
|
240
222
|
debouncedGet();
|
|
241
|
-
}, {deep: true});
|
|
242
|
-
|
|
223
|
+
}, { deep: true });
|
|
243
224
|
const debouncedGet = useDebounceFn(() => {
|
|
244
225
|
console.error("DEBOUNCED GET");
|
|
245
226
|
getItems(parseInt(page.value) ?? null, null, filterValues.value);
|
|
246
|
-
}, 200)
|
|
247
|
-
|
|
227
|
+
}, 200);
|
|
248
228
|
const updateForm = async (id) => {
|
|
249
|
-
var newQuery = {query: {...route.query}};
|
|
229
|
+
var newQuery = { query: { ...route.query } };
|
|
250
230
|
if (props.loaderKey) {
|
|
251
|
-
newQuery.query[(props.loaderKey ??
|
|
252
|
-
newQuery.query[(props.loaderKey ??
|
|
231
|
+
newQuery.query[(props.loaderKey ?? "") + "action"] = "update";
|
|
232
|
+
newQuery.query[(props.loaderKey ?? "") + "actionId"] = id;
|
|
253
233
|
} else {
|
|
254
234
|
newQuery.query.action = "update";
|
|
255
235
|
newQuery.query.actionId = id;
|
|
256
236
|
}
|
|
257
237
|
await router.push(newQuery);
|
|
258
|
-
}
|
|
238
|
+
};
|
|
259
239
|
const deleteForm = async (id) => {
|
|
260
|
-
|
|
261
|
-
var newQuery = {query: {...route.query}};
|
|
240
|
+
var newQuery = { query: { ...route.query } };
|
|
262
241
|
if (props.loaderKey) {
|
|
263
|
-
newQuery.query[(props.loaderKey ??
|
|
264
|
-
newQuery.query[(props.loaderKey ??
|
|
242
|
+
newQuery.query[(props.loaderKey ?? "") + "action"] = "delete";
|
|
243
|
+
newQuery.query[(props.loaderKey ?? "") + "actionId"] = id;
|
|
265
244
|
} else {
|
|
266
245
|
newQuery.query.action = "delete";
|
|
267
246
|
newQuery.query.actionId = id;
|
|
268
247
|
}
|
|
269
248
|
await router.push(newQuery);
|
|
270
|
-
}
|
|
249
|
+
};
|
|
271
250
|
const createForm = () => {
|
|
272
251
|
item.value = props.initialItem ? cloneDeep(props.initialItem) : {};
|
|
273
|
-
var newQuery = {query: {...route.query}};
|
|
252
|
+
var newQuery = { query: { ...route.query } };
|
|
274
253
|
if (props.loaderKey) {
|
|
275
|
-
newQuery.query[(props.loaderKey ??
|
|
254
|
+
newQuery.query[(props.loaderKey ?? "") + "action"] = "create";
|
|
276
255
|
} else {
|
|
277
256
|
newQuery.query.action = "create";
|
|
278
257
|
}
|
|
279
258
|
router.push(newQuery);
|
|
280
|
-
}
|
|
281
|
-
|
|
259
|
+
};
|
|
282
260
|
const saveAction = async () => {
|
|
283
261
|
formPending.value = true;
|
|
284
262
|
let itemToSave = JSON.parse(JSON.stringify(item.value));
|
|
@@ -309,14 +287,12 @@ const saveAction = async () => {
|
|
|
309
287
|
await getItems(parseInt(page.value) ?? null, null, filterValues.value);
|
|
310
288
|
notify(savedPath + ":" + savedAction, savedItem);
|
|
311
289
|
}
|
|
312
|
-
}
|
|
313
|
-
|
|
290
|
+
};
|
|
314
291
|
if (props.await) {
|
|
315
292
|
await getItems(page.value ?? null, null, filterValues.value);
|
|
316
293
|
} else {
|
|
317
294
|
getItems(page.value ?? null, null, filterValues.value);
|
|
318
295
|
}
|
|
319
|
-
|
|
320
296
|
watch(action, (newVal, oldValue) => {
|
|
321
297
|
try {
|
|
322
298
|
if (action.value === "update" && actionId.value) {
|
|
@@ -329,28 +305,26 @@ watch(action, (newVal, oldValue) => {
|
|
|
329
305
|
} catch (error) {
|
|
330
306
|
console.error("Error in actionId watcher:", error);
|
|
331
307
|
}
|
|
332
|
-
}, {immediate: true});
|
|
333
|
-
|
|
334
|
-
const {addListener, removeLocalListenersWithEvent, notify} = useListenerService();
|
|
308
|
+
}, { immediate: true });
|
|
309
|
+
const { addListener, removeLocalListenersWithEvent, notify } = useListenerService();
|
|
335
310
|
onMounted(() => {
|
|
336
311
|
props.listeners.forEach((listener) => {
|
|
337
312
|
addListener(listener, (data) => {
|
|
338
313
|
getItems(parseInt(page.value) ?? null, null, filterValues.value);
|
|
339
314
|
});
|
|
340
315
|
});
|
|
341
|
-
})
|
|
316
|
+
});
|
|
342
317
|
onBeforeUnmount(() => {
|
|
343
318
|
props.listeners.forEach((listener) => {
|
|
344
319
|
removeLocalListenersWithEvent(listener);
|
|
345
320
|
});
|
|
346
|
-
})
|
|
321
|
+
});
|
|
347
322
|
const exportAction = async () => {
|
|
348
323
|
await exportItems(filterValues.value);
|
|
349
324
|
if (!hasExportErrors.value) {
|
|
350
|
-
window.open(exportUrl.value,
|
|
325
|
+
window.open(exportUrl.value, "_blank");
|
|
351
326
|
}
|
|
352
|
-
}
|
|
353
|
-
|
|
327
|
+
};
|
|
354
328
|
</script>
|
|
355
329
|
|
|
356
330
|
<template>
|
|
@@ -434,7 +408,3 @@ const exportAction = async () => {
|
|
|
434
408
|
|
|
435
409
|
</div>
|
|
436
410
|
</template>
|
|
437
|
-
|
|
438
|
-
<style scoped>
|
|
439
|
-
|
|
440
|
-
</style>
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
2
|
+
export default _default;
|
|
3
|
+
type __VLS_WithSlots<T, S> = T & (new () => {
|
|
4
|
+
$slots: S;
|
|
5
|
+
});
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<{}, {
|
|
7
|
+
path: string;
|
|
8
|
+
customFilters: Record<string, any>;
|
|
9
|
+
perPage: number;
|
|
10
|
+
await: boolean;
|
|
11
|
+
listeners: unknown[];
|
|
12
|
+
noResultsText: string;
|
|
13
|
+
createTitle: string;
|
|
14
|
+
updateTitle: string;
|
|
15
|
+
deleteTitle: string;
|
|
16
|
+
allowCreate: boolean;
|
|
17
|
+
hideFilters: boolean;
|
|
18
|
+
fullScreenDialog: boolean;
|
|
19
|
+
contentClasses: string;
|
|
20
|
+
title?: string | undefined;
|
|
21
|
+
loaderKey?: string | undefined;
|
|
22
|
+
initialItem?: Record<string, any> | undefined;
|
|
23
|
+
transformItem?: Function | undefined;
|
|
24
|
+
transformItems?: Function | undefined;
|
|
25
|
+
beforeSave?: Function | undefined;
|
|
26
|
+
beforeCreate?: Function | undefined;
|
|
27
|
+
beforeUpdate?: Function | undefined;
|
|
28
|
+
beforeDelete?: Function | undefined;
|
|
29
|
+
$props: any;
|
|
30
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
31
|
+
type __VLS_Slots = {
|
|
32
|
+
before?: ((props: {
|
|
33
|
+
items: any;
|
|
34
|
+
pending: any;
|
|
35
|
+
createAction: any;
|
|
36
|
+
updateAction: any;
|
|
37
|
+
deleteAction: any;
|
|
38
|
+
formPending: any;
|
|
39
|
+
exportAction: any;
|
|
40
|
+
exportPending: any;
|
|
41
|
+
exportErrors: any;
|
|
42
|
+
}) => any) | undefined;
|
|
43
|
+
} & {
|
|
44
|
+
filters?: ((props: {
|
|
45
|
+
filters: any;
|
|
46
|
+
}) => any) | undefined;
|
|
47
|
+
} & {
|
|
48
|
+
empty?: ((props: {
|
|
49
|
+
createAction: any;
|
|
50
|
+
}) => any) | undefined;
|
|
51
|
+
} & {
|
|
52
|
+
error?: ((props: {
|
|
53
|
+
errors: any;
|
|
54
|
+
}) => any) | undefined;
|
|
55
|
+
} & {
|
|
56
|
+
default?: ((props: {
|
|
57
|
+
items: any;
|
|
58
|
+
pending: any;
|
|
59
|
+
updateAction: any;
|
|
60
|
+
deleteAction: any;
|
|
61
|
+
formPending: any;
|
|
62
|
+
}) => any) | undefined;
|
|
63
|
+
} & {
|
|
64
|
+
form?: ((props: {
|
|
65
|
+
action: any;
|
|
66
|
+
item: any;
|
|
67
|
+
originalItem: any;
|
|
68
|
+
errors: any;
|
|
69
|
+
}) => any) | undefined;
|
|
70
|
+
};
|
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import {ref, computed, watch} from
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import {useCrudConverters} from "../composables/useCrudConverters";
|
|
2
|
+
import { ref, computed, watch } from "vue";
|
|
3
|
+
import { useCrudApi } from "../composables/useCrudApi";
|
|
4
|
+
import { useCrudConverters } from "../composables/useCrudConverters";
|
|
6
5
|
import CrudErrorDisplay from "../components/CrudErrorDisplay.vue";
|
|
7
6
|
import CrudListLoader from "./CrudListLoader.vue";
|
|
8
7
|
import CrudUploadFieldSelection from "./CrudUploadFieldSelection.vue";
|
|
9
|
-
|
|
10
|
-
const {toBase64, getFileType} = useCrudConverters();
|
|
11
|
-
|
|
8
|
+
const { toBase64, getFileType } = useCrudConverters();
|
|
12
9
|
const props = defineProps({
|
|
13
10
|
replaceable: {
|
|
14
11
|
type: Boolean,
|
|
@@ -33,11 +30,11 @@ const props = defineProps({
|
|
|
33
30
|
},
|
|
34
31
|
mimeKey: {
|
|
35
32
|
type: String,
|
|
36
|
-
default:
|
|
33
|
+
default: "mimeType"
|
|
37
34
|
},
|
|
38
35
|
fileNameKey: {
|
|
39
36
|
type: String,
|
|
40
|
-
default:
|
|
37
|
+
default: "fileName"
|
|
41
38
|
},
|
|
42
39
|
customFilters: {
|
|
43
40
|
type: Object,
|
|
@@ -52,31 +49,26 @@ const props = defineProps({
|
|
|
52
49
|
}
|
|
53
50
|
}
|
|
54
51
|
});
|
|
55
|
-
|
|
56
52
|
const model = defineModel();
|
|
57
|
-
|
|
58
53
|
const dialog = ref(false);
|
|
59
54
|
const filesToUpload = ref([]);
|
|
60
55
|
const fileToUpload = ref(null);
|
|
61
56
|
const searchValue = ref(null);
|
|
62
|
-
|
|
63
57
|
const finish = () => {
|
|
64
58
|
dialog.value = false;
|
|
65
59
|
};
|
|
66
|
-
|
|
67
60
|
const onSelectImage = (item) => {
|
|
68
61
|
if (props.multiple) {
|
|
69
62
|
if (model.value === null) model.value = [];
|
|
70
63
|
if (!model.value.includes(item)) {
|
|
71
64
|
model.value.push(item);
|
|
72
65
|
} else {
|
|
73
|
-
model.value = model.value.filter(i => i !== item);
|
|
66
|
+
model.value = model.value.filter((i) => i !== item);
|
|
74
67
|
}
|
|
75
68
|
} else {
|
|
76
69
|
model.value = model.value === item ? null : item;
|
|
77
70
|
}
|
|
78
71
|
};
|
|
79
|
-
|
|
80
72
|
const {
|
|
81
73
|
createItem: createUpload,
|
|
82
74
|
item: completedUpload,
|
|
@@ -86,7 +78,6 @@ const {
|
|
|
86
78
|
hasFormErrors: hasUploadErrors,
|
|
87
79
|
formErrors: uploadErrors
|
|
88
80
|
} = useCrudApi(props.path);
|
|
89
|
-
|
|
90
81
|
const processUploads = async () => {
|
|
91
82
|
uploadsLoading.value = true;
|
|
92
83
|
if (props.multiple) {
|
|
@@ -120,7 +111,6 @@ const processUploads = async () => {
|
|
|
120
111
|
dialog.value = false;
|
|
121
112
|
}
|
|
122
113
|
};
|
|
123
|
-
|
|
124
114
|
const selectionFilters = computed(() => {
|
|
125
115
|
let filters = {};
|
|
126
116
|
if (hasSelection.value) {
|
|
@@ -128,15 +118,13 @@ const selectionFilters = computed(() => {
|
|
|
128
118
|
}
|
|
129
119
|
return filters;
|
|
130
120
|
});
|
|
131
|
-
|
|
132
121
|
const hasSelection = computed(() => {
|
|
133
122
|
if (props.multiple) {
|
|
134
123
|
return model.value && model.value.length > 0;
|
|
135
124
|
} else {
|
|
136
|
-
return model.value && model.value !==
|
|
125
|
+
return model.value && model.value !== "" && (model.value.length > 0 || model.value > 0);
|
|
137
126
|
}
|
|
138
127
|
});
|
|
139
|
-
|
|
140
128
|
watch(() => filesToUpload.value, () => {
|
|
141
129
|
if (filesToUpload.value.length > 0) {
|
|
142
130
|
processUploads();
|
|
@@ -147,9 +135,8 @@ watch(() => fileToUpload.value, () => {
|
|
|
147
135
|
processUploads();
|
|
148
136
|
}
|
|
149
137
|
});
|
|
150
|
-
|
|
151
|
-
|
|
152
138
|
</script>
|
|
139
|
+
|
|
153
140
|
<template>
|
|
154
141
|
<div>
|
|
155
142
|
<div v-if="title" style="font-size: 12px;" class="text-grey-darken-2 mb-1">{{ title }}</div>
|
|
@@ -290,7 +277,3 @@ watch(() => fileToUpload.value, () => {
|
|
|
290
277
|
</v-dialog>
|
|
291
278
|
</div>
|
|
292
279
|
</template>
|
|
293
|
-
|
|
294
|
-
<style scoped>
|
|
295
|
-
|
|
296
|
-
</style>
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
2
|
+
export default _default;
|
|
3
|
+
type __VLS_WithSlots<T, S> = T & (new () => {
|
|
4
|
+
$slots: S;
|
|
5
|
+
});
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<{}, {
|
|
7
|
+
path: string;
|
|
8
|
+
customFilters: Record<string, any>;
|
|
9
|
+
multiple: boolean;
|
|
10
|
+
disabled: boolean;
|
|
11
|
+
mimeKey: string;
|
|
12
|
+
fileNameKey: string;
|
|
13
|
+
replaceable: boolean;
|
|
14
|
+
isPublic: boolean;
|
|
15
|
+
additionalPostData: Record<string, any>;
|
|
16
|
+
title?: any;
|
|
17
|
+
$props: any;
|
|
18
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
19
|
+
type __VLS_Slots = {
|
|
20
|
+
additionalActions?: ((props: {
|
|
21
|
+
item: any;
|
|
22
|
+
}) => any) | undefined;
|
|
23
|
+
};
|
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import {computed, defineModel} from
|
|
3
|
-
import {useCrudConverters} from
|
|
4
|
-
|
|
2
|
+
import { computed, defineModel } from "vue";
|
|
3
|
+
import { useCrudConverters } from "../composables/useCrudConverters";
|
|
5
4
|
const {
|
|
6
5
|
formatStringDate,
|
|
7
6
|
uploadToUrl,
|
|
8
7
|
mimeTypeToMdiIcon
|
|
9
8
|
} = useCrudConverters();
|
|
10
|
-
|
|
11
9
|
const props = defineProps({
|
|
12
10
|
item: {
|
|
13
11
|
type: Object,
|
|
@@ -15,11 +13,11 @@ const props = defineProps({
|
|
|
15
13
|
},
|
|
16
14
|
mimeKey: {
|
|
17
15
|
type: String,
|
|
18
|
-
default:
|
|
16
|
+
default: "mimeType"
|
|
19
17
|
},
|
|
20
18
|
fileNameKey: {
|
|
21
19
|
type: String,
|
|
22
|
-
default:
|
|
20
|
+
default: "fileName"
|
|
23
21
|
},
|
|
24
22
|
hideTitle: {
|
|
25
23
|
type: Boolean,
|
|
@@ -31,13 +29,10 @@ const props = defineProps({
|
|
|
31
29
|
}
|
|
32
30
|
}
|
|
33
31
|
});
|
|
34
|
-
|
|
35
32
|
const copyUrl = () => {
|
|
36
33
|
navigator.clipboard.writeText(displayUrl.value);
|
|
37
34
|
};
|
|
38
|
-
|
|
39
35
|
const model = defineModel();
|
|
40
|
-
|
|
41
36
|
const selected = computed(() => {
|
|
42
37
|
if (props.item === null) {
|
|
43
38
|
return false;
|
|
@@ -47,55 +42,52 @@ const selected = computed(() => {
|
|
|
47
42
|
}
|
|
48
43
|
return model.value === props.item.id;
|
|
49
44
|
});
|
|
50
|
-
|
|
51
45
|
const isVideo = computed(() => {
|
|
52
46
|
if (props.item) {
|
|
53
|
-
return props.item[props.mimeKey].includes(
|
|
47
|
+
return props.item[props.mimeKey].includes("video");
|
|
54
48
|
}
|
|
55
49
|
return false;
|
|
56
50
|
});
|
|
57
51
|
const isImage = computed(() => {
|
|
58
52
|
if (props.item) {
|
|
59
|
-
return props.item[props.mimeKey].includes(
|
|
53
|
+
return props.item[props.mimeKey].includes("image");
|
|
60
54
|
}
|
|
61
55
|
return false;
|
|
62
56
|
});
|
|
63
|
-
|
|
64
57
|
const url = computed(() => {
|
|
65
58
|
if (props.item) {
|
|
66
|
-
return uploadToUrl(props.item, isImage.value ?
|
|
59
|
+
return uploadToUrl(props.item, isImage.value ? "thumbnail" : "original");
|
|
67
60
|
}
|
|
68
61
|
return null;
|
|
69
62
|
});
|
|
70
63
|
const displayUrl = computed(() => {
|
|
71
64
|
if (props.item) {
|
|
72
|
-
return uploadToUrl(props.item, isImage.value ?
|
|
65
|
+
return uploadToUrl(props.item, isImage.value ? "thumbnail" : "original");
|
|
73
66
|
}
|
|
74
67
|
return null;
|
|
75
68
|
});
|
|
76
69
|
const downloadUrl = computed(() => {
|
|
77
70
|
if (props.item) {
|
|
78
|
-
return uploadToUrl(props.item,
|
|
71
|
+
return uploadToUrl(props.item, "original");
|
|
79
72
|
}
|
|
80
73
|
return null;
|
|
81
74
|
});
|
|
82
75
|
const largeUrl = computed(() => {
|
|
83
76
|
if (props.item) {
|
|
84
|
-
return uploadToUrl(props.item,
|
|
77
|
+
return uploadToUrl(props.item, "large");
|
|
85
78
|
}
|
|
86
79
|
return null;
|
|
87
80
|
});
|
|
88
|
-
|
|
89
81
|
const containerClasses = computed(() => {
|
|
90
82
|
return {
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
}
|
|
83
|
+
"pa-1": true,
|
|
84
|
+
"position-relative": true,
|
|
85
|
+
"cursor": true,
|
|
86
|
+
"d-flex": true
|
|
87
|
+
};
|
|
96
88
|
});
|
|
97
|
-
|
|
98
89
|
</script>
|
|
90
|
+
|
|
99
91
|
<template>
|
|
100
92
|
<div :class="containerClasses">
|
|
101
93
|
<v-tooltip>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
2
|
+
export default _default;
|
|
3
|
+
type __VLS_WithSlots<T, S> = T & (new () => {
|
|
4
|
+
$slots: S;
|
|
5
|
+
});
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<{}, {
|
|
7
|
+
item: Record<string, any>;
|
|
8
|
+
mimeKey: string;
|
|
9
|
+
fileNameKey: string;
|
|
10
|
+
hideTitle: boolean;
|
|
11
|
+
imageClickAction: Function;
|
|
12
|
+
$props: any;
|
|
13
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
14
|
+
type __VLS_Slots = {
|
|
15
|
+
additionalActions?: ((props: {
|
|
16
|
+
item: any;
|
|
17
|
+
}) => any) | undefined;
|
|
18
|
+
};
|
package/dist/types.d.mts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import type { NuxtModule } from '@nuxt/schema'
|
|
2
2
|
|
|
3
|
-
import type { default as Module } from './module.
|
|
3
|
+
import type { default as Module } from './module.mjs'
|
|
4
4
|
|
|
5
5
|
export type ModuleOptions = typeof Module extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
|
|
6
6
|
|
|
7
|
-
export { default } from './module.
|
|
7
|
+
export { default } from './module.mjs'
|
|
8
|
+
|
|
9
|
+
export { type AtomCrudModuleOptions, type azureAdB2COptions } from './module.mjs'
|