atom-nuxt 1.3.0 → 1.3.3
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.d.mts +3 -1
- package/dist/module.json +3 -3
- package/dist/module.mjs +2 -1
- package/dist/runtime/components/AlertDisplay.vue +11 -18
- package/dist/runtime/components/AlertDisplay.vue.d.ts +2 -0
- package/dist/runtime/components/CrudAddressSearchField.vue +22 -35
- package/dist/runtime/components/CrudAddressSearchField.vue.d.ts +8 -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 +25 -46
- 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 +82 -24
- package/dist/runtime/components/CrudFormDialog.vue.d.ts +39 -0
- package/dist/runtime/components/CrudFormLoader.vue +127 -120
- package/dist/runtime/components/CrudFormLoader.vue.d.ts +46 -0
- package/dist/runtime/components/CrudListLoader.vue +17 -28
- package/dist/runtime/components/CrudListLoader.vue.d.ts +37 -0
- package/dist/runtime/components/CrudPaginatedLoader.vue +118 -104
- package/dist/runtime/components/CrudPaginatedLoader.vue.d.ts +83 -0
- package/dist/runtime/components/CrudUploadField.vue +6 -28
- package/dist/runtime/components/CrudUploadField.vue.d.ts +23 -0
- package/dist/runtime/components/CrudUploadFieldSelection.vue +19 -27
- package/dist/runtime/components/CrudUploadFieldSelection.vue.d.ts +18 -0
- package/dist/types.d.mts +4 -2
- package/package.json +1 -1
- package/dist/module.cjs +0 -5
- package/dist/module.d.ts +0 -22
- package/dist/types.d.ts +0 -7
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { ref, computed, watch } from
|
|
3
|
-
|
|
2
|
+
import { ref, computed, watch } from "vue";
|
|
4
3
|
import { useCrudApi } from "../composables/useCrudApi";
|
|
5
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
8
|
const { toBase64, getFileType } = useCrudConverters();
|
|
11
|
-
|
|
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,37 +49,29 @@ 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
|
-
// Temporary selection used within the dialog
|
|
64
57
|
const tempModel = ref(null);
|
|
65
|
-
|
|
66
|
-
const cloneModel = () => props.multiple ? [...(model.value || [])] : model.value;
|
|
67
|
-
|
|
58
|
+
const cloneModel = () => props.multiple ? [...model.value || []] : model.value;
|
|
68
59
|
const finish = () => {
|
|
69
60
|
model.value = props.multiple ? [...tempModel.value] : tempModel.value;
|
|
70
61
|
dialog.value = false;
|
|
71
62
|
};
|
|
72
|
-
|
|
73
63
|
const onSelectImage = (item) => {
|
|
74
64
|
if (props.multiple) {
|
|
75
65
|
if (!tempModel.value) tempModel.value = [];
|
|
76
66
|
if (!tempModel.value.includes(item)) {
|
|
77
67
|
tempModel.value.push(item);
|
|
78
68
|
} else {
|
|
79
|
-
tempModel.value = tempModel.value.filter(i => i !== item);
|
|
69
|
+
tempModel.value = tempModel.value.filter((i) => i !== item);
|
|
80
70
|
}
|
|
81
71
|
} else {
|
|
82
72
|
tempModel.value = tempModel.value === item ? null : item;
|
|
83
73
|
}
|
|
84
74
|
};
|
|
85
|
-
|
|
86
75
|
const {
|
|
87
76
|
createItem: createUpload,
|
|
88
77
|
item: completedUpload,
|
|
@@ -92,7 +81,6 @@ const {
|
|
|
92
81
|
hasFormErrors: hasUploadErrors,
|
|
93
82
|
formErrors: uploadErrors
|
|
94
83
|
} = useCrudApi(props.path);
|
|
95
|
-
|
|
96
84
|
const processUploads = async () => {
|
|
97
85
|
uploadsLoading.value = true;
|
|
98
86
|
if (props.multiple) {
|
|
@@ -122,14 +110,12 @@ const processUploads = async () => {
|
|
|
122
110
|
}
|
|
123
111
|
}
|
|
124
112
|
uploadsLoading.value = false;
|
|
125
|
-
|
|
126
113
|
if (props.multiple) {
|
|
127
114
|
filesToUpload.value = [];
|
|
128
115
|
} else {
|
|
129
116
|
fileToUpload.value = null;
|
|
130
117
|
}
|
|
131
118
|
};
|
|
132
|
-
|
|
133
119
|
const selectionFilters = computed(() => {
|
|
134
120
|
let filters = {};
|
|
135
121
|
if (hasSelection.value) {
|
|
@@ -137,21 +123,18 @@ const selectionFilters = computed(() => {
|
|
|
137
123
|
}
|
|
138
124
|
return filters;
|
|
139
125
|
});
|
|
140
|
-
|
|
141
126
|
const hasSelection = computed(() => {
|
|
142
127
|
if (props.multiple) {
|
|
143
128
|
return model.value && model.value.length > 0;
|
|
144
129
|
} else {
|
|
145
|
-
return model.value && model.value !==
|
|
130
|
+
return model.value && model.value !== "" && (model.value.length > 0 || model.value > 0);
|
|
146
131
|
}
|
|
147
132
|
});
|
|
148
|
-
|
|
149
133
|
watch(() => dialog.value, (val) => {
|
|
150
134
|
if (val) {
|
|
151
135
|
tempModel.value = cloneModel();
|
|
152
136
|
}
|
|
153
137
|
});
|
|
154
|
-
|
|
155
138
|
watch(() => filesToUpload.value, () => {
|
|
156
139
|
if (filesToUpload.value.length > 0) {
|
|
157
140
|
processUploads();
|
|
@@ -326,8 +309,3 @@ watch(() => fileToUpload.value, () => {
|
|
|
326
309
|
</v-dialog>
|
|
327
310
|
</div>
|
|
328
311
|
</template>
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
<style scoped>
|
|
332
|
-
|
|
333
|
-
</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,58 +42,55 @@ 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
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
}
|
|
83
|
+
"pa-1": true,
|
|
84
|
+
"position-relative": true,
|
|
85
|
+
"cursor": true,
|
|
86
|
+
"d-flex": true,
|
|
87
|
+
"border": selected.value,
|
|
88
|
+
"border-primary": selected.value,
|
|
89
|
+
"shadow": selected.value
|
|
90
|
+
};
|
|
99
91
|
});
|
|
100
|
-
|
|
101
92
|
</script>
|
|
93
|
+
|
|
102
94
|
<template>
|
|
103
95
|
<div :class="containerClasses">
|
|
104
96
|
<div class="d-flex justify-center flex-fill align-center" v-bind="props">
|
|
@@ -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 {
|
|
7
|
+
export { default } from './module.mjs'
|
|
8
|
+
|
|
9
|
+
export { type AtomCrudModuleOptions, type azureAdB2COptions } from './module.mjs'
|
package/package.json
CHANGED
package/dist/module.cjs
DELETED
package/dist/module.d.ts
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import * as _nuxt_schema from '@nuxt/schema';
|
|
2
|
-
|
|
3
|
-
interface azureAdB2COptions {
|
|
4
|
-
clientId: string;
|
|
5
|
-
authority: string;
|
|
6
|
-
knownAuthorities?: Array<string>;
|
|
7
|
-
redirectUri: string;
|
|
8
|
-
postLogoutRedirectUri?: string;
|
|
9
|
-
navigateToLoginRequestUrl: boolean;
|
|
10
|
-
scopes?: string[];
|
|
11
|
-
}
|
|
12
|
-
interface AtomCrudModuleOptions {
|
|
13
|
-
apiBaseUrl?: string;
|
|
14
|
-
storageBaseUrl?: string;
|
|
15
|
-
additionalHeaders?: Record<string, string>;
|
|
16
|
-
azureAdB2C?: azureAdB2COptions;
|
|
17
|
-
googleMapsApiKey?: string;
|
|
18
|
-
debug?: boolean;
|
|
19
|
-
}
|
|
20
|
-
declare const _default: _nuxt_schema.NuxtModule<AtomCrudModuleOptions, AtomCrudModuleOptions, false>;
|
|
21
|
-
|
|
22
|
-
export { type AtomCrudModuleOptions, type azureAdB2COptions, _default as default };
|
package/dist/types.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import type { NuxtModule } from '@nuxt/schema'
|
|
2
|
-
|
|
3
|
-
import type { default as Module } from './module'
|
|
4
|
-
|
|
5
|
-
export type ModuleOptions = typeof Module extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
|
|
6
|
-
|
|
7
|
-
export { type AtomCrudModuleOptions, type azureAdB2COptions, default } from './module'
|