quasar-ui-danx 0.4.7 → 0.4.9
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/danx.es.js +4775 -4796
- package/dist/danx.es.js.map +1 -1
- package/dist/danx.umd.js +6 -6
- package/dist/danx.umd.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/ActionTable/Form/Fields/FieldLabel.vue +3 -3
- package/src/components/ActionTable/Form/Fields/MultiFileField.vue +1 -3
- package/src/components/ActionTable/Form/Fields/SelectField.vue +0 -1
- package/src/components/ActionTable/Form/Fields/TextField.vue +0 -1
- package/src/components/ActionTable/Form/Fields/WysiwygField.vue +12 -13
- package/src/components/Utility/Dialogs/FullscreenCarouselDialog.vue +1 -1
- package/src/components/Utility/Files/FilePreview.vue +4 -4
- package/src/styles/quasar-reset.scss +2 -1
- package/src/styles/themes/danx/carousels.scss +5 -0
- package/src/styles/themes/danx/forms.scss +8 -0
- package/src/styles/themes/danx/index.scss +1 -0
- package/src/types/files.d.ts +3 -0
- package/src/types/requests.d.ts +1 -1
package/package.json
CHANGED
@@ -1,19 +1,19 @@
|
|
1
1
|
<template>
|
2
|
-
<span>
|
2
|
+
<span class="dx-field-label">
|
3
3
|
<slot>
|
4
4
|
{{ labelText }}
|
5
5
|
<template v-if="showName">({{ field?.name }})</template>
|
6
6
|
</slot>
|
7
7
|
<span
|
8
8
|
v-if="requiredLabel"
|
9
|
-
class="
|
9
|
+
class="dx-field-required"
|
10
10
|
>{{ requiredLabel }}</span>
|
11
11
|
</span>
|
12
12
|
</template>
|
13
13
|
|
14
14
|
<script setup lang="ts">
|
15
|
-
import { FormField } from "src/types";
|
16
15
|
import { computed } from "vue";
|
16
|
+
import { FormField } from "../../../../types";
|
17
17
|
|
18
18
|
const props = defineProps<{
|
19
19
|
field?: FormField;
|
@@ -9,7 +9,6 @@
|
|
9
9
|
:field="field"
|
10
10
|
:label="label"
|
11
11
|
:show-name="showName"
|
12
|
-
class="text-sm font-semibold"
|
13
12
|
/>
|
14
13
|
|
15
14
|
<input
|
@@ -26,9 +25,8 @@
|
|
26
25
|
v-for="file in uploadedFiles"
|
27
26
|
:key="'file-upload-' + file.id"
|
28
27
|
class="w-32 h-32 m-2 cursor-pointer bg-gray-200"
|
29
|
-
:class="{'border border-dashed border-blue-600': !uploadedFiles.length}"
|
30
28
|
:file="file"
|
31
|
-
:related-files="uploadedFiles"
|
29
|
+
:related-files="file.transcodes || uploadedFiles"
|
32
30
|
downloadable
|
33
31
|
:removable="!readonly && !disable"
|
34
32
|
@remove="onRemove(file)"
|
@@ -4,7 +4,6 @@
|
|
4
4
|
v-if="!noLabel"
|
5
5
|
:field="field"
|
6
6
|
:show-name="showName"
|
7
|
-
class="text-sm font-semibold text-gray-700 block mb-2"
|
8
7
|
/>
|
9
8
|
<template v-if="readonly">
|
10
9
|
<div
|
@@ -30,17 +29,17 @@ import FieldLabel from "./FieldLabel";
|
|
30
29
|
|
31
30
|
defineEmits(["update:model-value"]);
|
32
31
|
defineProps({
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
32
|
+
modelValue: {
|
33
|
+
type: [String, Number],
|
34
|
+
default: null
|
35
|
+
},
|
36
|
+
field: {
|
37
|
+
type: Object,
|
38
|
+
required: true
|
39
|
+
},
|
40
|
+
noLabel: Boolean,
|
41
|
+
showName: Boolean,
|
42
|
+
disable: Boolean,
|
43
|
+
readonly: Boolean
|
45
44
|
});
|
46
45
|
</script>
|
@@ -107,7 +107,7 @@
|
|
107
107
|
<FullScreenCarouselDialog
|
108
108
|
v-if="showPreview && !disabled"
|
109
109
|
:files="relatedFiles || [computedImage]"
|
110
|
-
:default-slide="computedImage?.id || ''"
|
110
|
+
:default-slide="relatedFiles ? relatedFiles[0].id : (computedImage?.id || '')"
|
111
111
|
@close="showPreview = false"
|
112
112
|
/>
|
113
113
|
</div>
|
@@ -115,10 +115,10 @@
|
|
115
115
|
|
116
116
|
<script setup lang="ts">
|
117
117
|
import { DocumentTextIcon as TextFileIcon, DownloadIcon, PlayIcon } from "@heroicons/vue/outline";
|
118
|
-
import { UploadedFile } from "src/types";
|
119
118
|
import { computed, ComputedRef, ref } from "vue";
|
120
119
|
import { download } from "../../../helpers";
|
121
120
|
import { ImageIcon, PdfIcon, TrashIcon as RemoveIcon } from "../../../svg";
|
121
|
+
import { UploadedFile } from "../../../types";
|
122
122
|
import { FullScreenCarouselDialog } from "../Dialogs";
|
123
123
|
|
124
124
|
export interface FilePreviewProps {
|
@@ -171,10 +171,10 @@ const isImage = computed(() => !!mimeType.value.match(/^image\//));
|
|
171
171
|
const isVideo = computed(() => !!mimeType.value.match(/^video\//));
|
172
172
|
const isPdf = computed(() => !!mimeType.value.match(/^application\/pdf/));
|
173
173
|
const previewUrl = computed(
|
174
|
-
() => computedImage.value?.
|
174
|
+
() => computedImage.value?.optimized?.url || computedImage.value?.blobUrl || computedImage.value?.url
|
175
175
|
);
|
176
176
|
const thumbUrl = computed(() => {
|
177
|
-
return computedImage.value?.
|
177
|
+
return computedImage.value?.thumb?.url;
|
178
178
|
});
|
179
179
|
const isPreviewable = computed(() => {
|
180
180
|
return !!thumbUrl.value || isVideo.value || isImage.value;
|
package/src/types/files.d.ts
CHANGED
package/src/types/requests.d.ts
CHANGED