qidian-vue-ui 2.5.1 → 2.6.1
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/components/form/index.css +25 -20
- package/dist/components/form/index.vue.mjs +1 -1
- package/dist/components/image/index.css +18 -0
- package/dist/components/image/index.vue.d.ts +2 -0
- package/dist/components/image/index.vue.mjs +6 -139
- package/dist/components/image/index.vue2.mjs +198 -1
- package/dist/components/image/types.d.ts +1 -0
- package/dist/index.mjs +42 -42
- package/package.json +1 -1
|
@@ -1,80 +1,85 @@
|
|
|
1
|
-
.qd-form--small[data-v-
|
|
1
|
+
.qd-form--small[data-v-f856f3a8] {
|
|
2
2
|
font: var(--td-font-body-small);
|
|
3
3
|
}
|
|
4
|
-
.qd-form--small[data-v-
|
|
4
|
+
.qd-form--small[data-v-f856f3a8] .t-form__label--top {
|
|
5
5
|
min-height: var(--td-comp-margin-xxl);
|
|
6
6
|
line-height: var(--td-comp-margin-xxl);
|
|
7
7
|
}
|
|
8
|
-
.qd-form--small[data-v-
|
|
9
|
-
.qd-form--small[data-v-
|
|
8
|
+
.qd-form--small[data-v-f856f3a8] .t-form__controls,
|
|
9
|
+
.qd-form--small[data-v-f856f3a8] .t-form__controls-content {
|
|
10
10
|
min-height: var(--td-comp-margin-xxl);
|
|
11
11
|
}
|
|
12
|
-
.qd-form--descriptions[data-v-
|
|
12
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-grid {
|
|
13
13
|
border-top: 1px solid var(--td-component-border);
|
|
14
14
|
border-left: 1px solid var(--td-component-border);
|
|
15
15
|
}
|
|
16
|
-
.qd-form--descriptions[data-v-
|
|
16
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-grid-item {
|
|
17
17
|
border-right: 1px solid var(--td-component-border);
|
|
18
18
|
border-bottom: 1px solid var(--td-component-border);
|
|
19
19
|
}
|
|
20
|
-
.qd-form--descriptions[data-v-
|
|
20
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__item {
|
|
21
21
|
display: flex;
|
|
22
22
|
align-items: stretch;
|
|
23
23
|
height: 100%;
|
|
24
24
|
}
|
|
25
|
-
.qd-form--descriptions[data-v-
|
|
25
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__label {
|
|
26
26
|
display: flex;
|
|
27
27
|
flex-direction: column;
|
|
28
28
|
justify-content: center;
|
|
29
29
|
background-color: var(--td-bg-color-secondarycontainer);
|
|
30
30
|
padding: var(--td-comp-paddingLR-m) var(--td-comp-paddingLR-l);
|
|
31
31
|
height: 100%;
|
|
32
|
+
min-height: var(--td-comp-margin-xxl);
|
|
32
33
|
}
|
|
33
|
-
.qd-form--descriptions[data-v-
|
|
34
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__label--top {
|
|
34
35
|
border-bottom: 1px solid var(--td-component-border);
|
|
35
36
|
align-items: center;
|
|
36
37
|
height: var(--qd-form-description-label-height, auto);
|
|
37
38
|
white-space: normal;
|
|
38
39
|
}
|
|
39
|
-
.qd-form--descriptions[data-v-
|
|
40
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__label--top + .t-form__controls > .t-form__controls-content {
|
|
40
41
|
justify-content: center;
|
|
41
42
|
text-align: center;
|
|
42
43
|
}
|
|
43
|
-
.qd-form--descriptions[data-v-
|
|
44
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__controls {
|
|
44
45
|
flex: 1 1 0;
|
|
45
46
|
overflow: hidden;
|
|
46
47
|
display: flex;
|
|
47
48
|
flex-direction: column;
|
|
48
|
-
justify-content:
|
|
49
|
+
justify-content: flex-start;
|
|
49
50
|
padding: var(--td-comp-paddingLR-m) var(--td-comp-paddingLR-l);
|
|
50
51
|
margin-left: 0 !important;
|
|
51
52
|
height: 100%;
|
|
53
|
+
min-height: var(--td-comp-margin-xxl);
|
|
54
|
+
}
|
|
55
|
+
.qd-form--descriptions[data-v-f856f3a8] .t-form__controls-content {
|
|
56
|
+
min-height: auto;
|
|
52
57
|
}
|
|
53
|
-
.qd-form--descriptions[data-v-
|
|
58
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item--label-top {
|
|
54
59
|
display: grid;
|
|
55
60
|
grid-template-rows: auto minmax(min-content, 1fr);
|
|
56
61
|
grid-row: span 2 !important;
|
|
57
62
|
}
|
|
58
|
-
.qd-form--descriptions[data-v-
|
|
63
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item--label-top > .t-form__item {
|
|
59
64
|
display: contents;
|
|
60
65
|
}
|
|
61
|
-
.qd-form--descriptions[data-v-
|
|
66
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item--label-top .t-form__controls-content {
|
|
62
67
|
white-space: normal;
|
|
63
68
|
}
|
|
64
|
-
.qd-form--descriptions[data-v-
|
|
69
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item--empty-content .t-form__controls {
|
|
65
70
|
padding: 0 !important;
|
|
66
71
|
min-height: 0;
|
|
67
72
|
height: 0;
|
|
68
73
|
overflow: hidden;
|
|
69
74
|
}
|
|
70
|
-
.qd-form--descriptions[data-v-
|
|
75
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item:not(.qd-form-item--label-top):not(.qd-form-item--label-width-full) .t-form__label {
|
|
71
76
|
border-right: 1px solid var(--td-component-border);
|
|
72
77
|
}
|
|
73
|
-
.qd-form--descriptions[data-v-
|
|
78
|
+
.qd-form--descriptions[data-v-f856f3a8] .qd-form-item--filler {
|
|
74
79
|
background-color: var(--td-bg-color-secondarycontainer);
|
|
75
80
|
}
|
|
76
|
-
.qd-form--descriptions-mini[data-v-
|
|
77
|
-
.qd-form--descriptions-mini[data-v-
|
|
81
|
+
.qd-form--descriptions-mini[data-v-f856f3a8] .t-form__label,
|
|
82
|
+
.qd-form--descriptions-mini[data-v-f856f3a8] .t-form__controls {
|
|
78
83
|
padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
|
|
79
84
|
font: var(--td-font-body-small);
|
|
80
85
|
}
|
|
@@ -2,7 +2,7 @@ import './index.css'
|
|
|
2
2
|
import _sfc_main from "./index.vue2.mjs";
|
|
3
3
|
/* empty css */
|
|
4
4
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
5
|
-
const QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
5
|
+
const QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f856f3a8"]]);
|
|
6
6
|
export {
|
|
7
7
|
QdForm as default
|
|
8
8
|
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
.qd-image[data-v-62f69bf0] .t-image__overlay-content {
|
|
2
|
+
border-radius: inherit;
|
|
3
|
+
}
|
|
4
|
+
.qd-image__viewer-trigger[data-v-62f69bf0] {
|
|
5
|
+
display: none;
|
|
6
|
+
}
|
|
7
|
+
.qd-image__preview-mask[data-v-62f69bf0] {
|
|
8
|
+
display: flex;
|
|
9
|
+
align-items: center;
|
|
10
|
+
justify-content: center;
|
|
11
|
+
width: 100%;
|
|
12
|
+
height: 100%;
|
|
13
|
+
border-radius: inherit;
|
|
14
|
+
font-size: calc(var(--td-font-size-body-medium) + 2px);
|
|
15
|
+
color: var(--td-text-color-anti);
|
|
16
|
+
background-color: var(--td-mask-active);
|
|
17
|
+
cursor: pointer;
|
|
18
|
+
}
|
|
@@ -1,141 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
import { qdImageProps } from "./props.mjs";
|
|
7
|
-
import merge from "../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/merge.mjs";
|
|
8
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
9
|
-
...{
|
|
10
|
-
name: "QdImage"
|
|
11
|
-
},
|
|
12
|
-
__name: "index",
|
|
13
|
-
props: /* @__PURE__ */ mergeDefaults({
|
|
14
|
-
src: {},
|
|
15
|
-
mode: {},
|
|
16
|
-
alt: {},
|
|
17
|
-
error: {},
|
|
18
|
-
fallback: {},
|
|
19
|
-
fit: {},
|
|
20
|
-
gallery: { type: Boolean },
|
|
21
|
-
lazy: { type: Boolean },
|
|
22
|
-
loading: {},
|
|
23
|
-
overlayContent: {},
|
|
24
|
-
overlayTrigger: {},
|
|
25
|
-
placeholder: {},
|
|
26
|
-
position: {},
|
|
27
|
-
referrerpolicy: {},
|
|
28
|
-
shape: {},
|
|
29
|
-
srcset: {},
|
|
30
|
-
onError: { type: Function },
|
|
31
|
-
onLoad: { type: Function },
|
|
32
|
-
listOssByIds: {}
|
|
33
|
-
}, qdImageProps),
|
|
34
|
-
setup(__props) {
|
|
35
|
-
const props = __props;
|
|
36
|
-
const vLoading = LoadingDirective;
|
|
37
|
-
const globalUploadProps = inject(
|
|
38
|
-
PROVIDE_UPLOAD,
|
|
39
|
-
computed(() => void 0)
|
|
40
|
-
);
|
|
41
|
-
const reSrc = ref();
|
|
42
|
-
const reProps = computed(() => {
|
|
43
|
-
const { src, mode, listOssByIds, ...imageOptions } = props;
|
|
44
|
-
const reListOssByIds = merge({}, globalUploadProps.value?.listOssByIds, listOssByIds);
|
|
45
|
-
return {
|
|
46
|
-
src,
|
|
47
|
-
mode,
|
|
48
|
-
listOssByIds: reListOssByIds,
|
|
49
|
-
imageOptions
|
|
50
|
-
};
|
|
51
|
-
});
|
|
52
|
-
const serviceLoad = ref(false);
|
|
53
|
-
const serviceAbortReason = /* @__PURE__ */ Symbol("abort");
|
|
54
|
-
let serviceAbort;
|
|
55
|
-
async function requestSrc(currentParams, listOssByIds) {
|
|
56
|
-
const { service, transformParams, transformRes } = listOssByIds;
|
|
57
|
-
if (!service) return;
|
|
58
|
-
let serviceParams = currentParams;
|
|
59
|
-
if (transformParams) {
|
|
60
|
-
const [trErr, trRes] = await suspectedWrapperPromise(transformParams(currentParams));
|
|
61
|
-
if (trErr) throw trErr;
|
|
62
|
-
serviceParams = trRes;
|
|
63
|
-
}
|
|
64
|
-
const [serviceErr, serviceRes] = await to(service(serviceParams));
|
|
65
|
-
if (serviceErr) throw serviceErr;
|
|
66
|
-
let res;
|
|
67
|
-
if (transformRes) {
|
|
68
|
-
const [trErr, trRes] = await suspectedWrapperPromise(transformRes(serviceRes));
|
|
69
|
-
if (trErr) throw trErr;
|
|
70
|
-
res = trRes;
|
|
71
|
-
} else {
|
|
72
|
-
res = serviceRes;
|
|
73
|
-
}
|
|
74
|
-
return res[0]?.url;
|
|
75
|
-
}
|
|
76
|
-
watch(
|
|
77
|
-
() => reProps.value.src,
|
|
78
|
-
async (newVal, oldVal) => {
|
|
79
|
-
if (newVal === oldVal) return;
|
|
80
|
-
serviceAbort?.abort?.(serviceAbortReason);
|
|
81
|
-
serviceAbort = void 0;
|
|
82
|
-
const { mode, listOssByIds } = reProps.value;
|
|
83
|
-
if (mode === "ossId") {
|
|
84
|
-
if (!listOssByIds || !listOssByIds.service || isEmpty(newVal) || newVal instanceof File || validator(newVal, "url")) {
|
|
85
|
-
serviceLoad.value = false;
|
|
86
|
-
reSrc.value = newVal;
|
|
87
|
-
return;
|
|
88
|
-
}
|
|
89
|
-
serviceLoad.value = true;
|
|
90
|
-
const currentRequest = abortWrapper(requestSrc(newVal, listOssByIds));
|
|
91
|
-
serviceAbort = currentRequest;
|
|
92
|
-
const [error, src] = await to(currentRequest);
|
|
93
|
-
if (serviceAbort !== currentRequest) return;
|
|
94
|
-
serviceAbort = void 0;
|
|
95
|
-
serviceLoad.value = false;
|
|
96
|
-
if (error) throw error;
|
|
97
|
-
reSrc.value = src;
|
|
98
|
-
return;
|
|
99
|
-
}
|
|
100
|
-
serviceLoad.value = false;
|
|
101
|
-
reSrc.value = newVal;
|
|
102
|
-
},
|
|
103
|
-
{ immediate: true }
|
|
104
|
-
);
|
|
105
|
-
onUnmounted(() => {
|
|
106
|
-
serviceAbort?.abort?.(serviceAbortReason);
|
|
107
|
-
serviceAbort = void 0;
|
|
108
|
-
});
|
|
109
|
-
return (_ctx, _cache) => {
|
|
110
|
-
return withDirectives((openBlock(), createBlock(unref(Image), mergeProps(reProps.value.imageOptions, {
|
|
111
|
-
src: typeof reSrc.value === "number" ? reSrc.value + "" : reSrc.value
|
|
112
|
-
}), createSlots({
|
|
113
|
-
loading: withCtx(() => [
|
|
114
|
-
renderSlot(_ctx.$slots, "loading", {}, () => [
|
|
115
|
-
createVNode(unref(LoadingIcon))
|
|
116
|
-
])
|
|
117
|
-
]),
|
|
118
|
-
error: withCtx(() => [
|
|
119
|
-
renderSlot(_ctx.$slots, "error", {}, () => [
|
|
120
|
-
createVNode(unref(ImageErrorIcon))
|
|
121
|
-
])
|
|
122
|
-
]),
|
|
123
|
-
_: 2
|
|
124
|
-
}, [
|
|
125
|
-
renderList(unref(filterSlots)(_ctx.$slots, ["loading", "error"]), (name) => {
|
|
126
|
-
return {
|
|
127
|
-
name,
|
|
128
|
-
fn: withCtx((slotProps) => [
|
|
129
|
-
renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps)))
|
|
130
|
-
])
|
|
131
|
-
};
|
|
132
|
-
})
|
|
133
|
-
]), 1040, ["src"])), [
|
|
134
|
-
[unref(vLoading), { loading: serviceLoad.value, size: "small" }]
|
|
135
|
-
]);
|
|
136
|
-
};
|
|
137
|
-
}
|
|
138
|
-
});
|
|
1
|
+
import './index.css'
|
|
2
|
+
import _sfc_main from "./index.vue2.mjs";
|
|
3
|
+
/* empty css */
|
|
4
|
+
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
5
|
+
const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-62f69bf0"]]);
|
|
139
6
|
export {
|
|
140
|
-
|
|
7
|
+
index as default
|
|
141
8
|
};
|
|
@@ -1,4 +1,201 @@
|
|
|
1
|
-
import
|
|
1
|
+
import './index.css'
|
|
2
|
+
import { defineComponent, mergeDefaults, inject, computed, ref, watch, onUnmounted, createElementBlock, openBlock, Fragment, withDirectives, createBlock, createCommentVNode, unref, mergeProps, createSlots, withCtx, renderSlot, createVNode, renderList, createElementVNode, normalizeProps, guardReactiveProps } from "vue";
|
|
3
|
+
import { isEmpty, validator, abortWrapper, to, filterSlots, suspectedWrapperPromise } from "qidian-shared";
|
|
4
|
+
import { ImageErrorIcon, LoadingIcon, BrowseIcon } from "tdesign-icons-vue-next";
|
|
5
|
+
import { Image, LoadingDirective, ImageViewer } from "tdesign-vue-next";
|
|
6
|
+
import { PROVIDE_UPLOAD } from "../config-provider/config.mjs";
|
|
7
|
+
import { qdImageProps } from "./props.mjs";
|
|
8
|
+
import merge from "../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/merge.mjs";
|
|
9
|
+
const _hoisted_1 = { class: "qd-image__preview-mask" };
|
|
10
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
11
|
+
...{
|
|
12
|
+
name: "QdImage",
|
|
13
|
+
inheritAttrs: false
|
|
14
|
+
},
|
|
15
|
+
__name: "index",
|
|
16
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
17
|
+
src: {},
|
|
18
|
+
mode: {},
|
|
19
|
+
preview: { type: Boolean },
|
|
20
|
+
alt: {},
|
|
21
|
+
error: {},
|
|
22
|
+
fallback: {},
|
|
23
|
+
fit: {},
|
|
24
|
+
gallery: { type: Boolean },
|
|
25
|
+
lazy: { type: Boolean },
|
|
26
|
+
loading: {},
|
|
27
|
+
overlayContent: {},
|
|
28
|
+
overlayTrigger: {},
|
|
29
|
+
placeholder: {},
|
|
30
|
+
position: {},
|
|
31
|
+
referrerpolicy: {},
|
|
32
|
+
shape: {},
|
|
33
|
+
srcset: {},
|
|
34
|
+
onError: { type: Function },
|
|
35
|
+
onLoad: { type: Function },
|
|
36
|
+
listOssByIds: {}
|
|
37
|
+
}, qdImageProps),
|
|
38
|
+
setup(__props) {
|
|
39
|
+
const props = __props;
|
|
40
|
+
const vLoading = LoadingDirective;
|
|
41
|
+
const globalUploadProps = inject(
|
|
42
|
+
PROVIDE_UPLOAD,
|
|
43
|
+
computed(() => void 0)
|
|
44
|
+
);
|
|
45
|
+
const reSrc = ref();
|
|
46
|
+
const reProps = computed(() => {
|
|
47
|
+
const { src, mode, listOssByIds, preview, onError, onLoad, ...imageOptions } = props;
|
|
48
|
+
const reListOssByIds = merge({}, globalUploadProps.value?.listOssByIds, listOssByIds);
|
|
49
|
+
return {
|
|
50
|
+
src,
|
|
51
|
+
mode,
|
|
52
|
+
listOssByIds: reListOssByIds,
|
|
53
|
+
preview,
|
|
54
|
+
imageOptions
|
|
55
|
+
};
|
|
56
|
+
});
|
|
57
|
+
const serviceLoad = ref(false);
|
|
58
|
+
const serviceAbortReason = /* @__PURE__ */ Symbol("abort");
|
|
59
|
+
let serviceAbort;
|
|
60
|
+
const viewerVisible = ref(false);
|
|
61
|
+
const imageError = ref(false);
|
|
62
|
+
const viewerImages = computed(() => {
|
|
63
|
+
const src = reSrc.value;
|
|
64
|
+
if (src === void 0 || src === "") return [];
|
|
65
|
+
return [typeof src === "number" ? src + "" : src];
|
|
66
|
+
});
|
|
67
|
+
function openViewer() {
|
|
68
|
+
if (!props.preview) return;
|
|
69
|
+
if (!viewerImages.value.length) return;
|
|
70
|
+
viewerVisible.value = true;
|
|
71
|
+
}
|
|
72
|
+
function handleImageError(context) {
|
|
73
|
+
imageError.value = true;
|
|
74
|
+
props.onError?.(context);
|
|
75
|
+
}
|
|
76
|
+
function handleImageLoad(context) {
|
|
77
|
+
imageError.value = false;
|
|
78
|
+
props.onLoad?.(context);
|
|
79
|
+
}
|
|
80
|
+
async function requestSrc(currentParams, listOssByIds) {
|
|
81
|
+
const { service, transformParams, transformRes } = listOssByIds;
|
|
82
|
+
if (!service) return;
|
|
83
|
+
let serviceParams = currentParams;
|
|
84
|
+
if (transformParams) {
|
|
85
|
+
const [trErr, trRes] = await suspectedWrapperPromise(transformParams(currentParams));
|
|
86
|
+
if (trErr) throw trErr;
|
|
87
|
+
serviceParams = trRes;
|
|
88
|
+
}
|
|
89
|
+
const [serviceErr, serviceRes] = await to(service(serviceParams));
|
|
90
|
+
if (serviceErr) throw serviceErr;
|
|
91
|
+
let res;
|
|
92
|
+
if (transformRes) {
|
|
93
|
+
const [trErr, trRes] = await suspectedWrapperPromise(transformRes(serviceRes));
|
|
94
|
+
if (trErr) throw trErr;
|
|
95
|
+
res = trRes;
|
|
96
|
+
} else {
|
|
97
|
+
res = serviceRes;
|
|
98
|
+
}
|
|
99
|
+
return res?.[0]?.url;
|
|
100
|
+
}
|
|
101
|
+
watch(reSrc, () => {
|
|
102
|
+
imageError.value = false;
|
|
103
|
+
});
|
|
104
|
+
watch(
|
|
105
|
+
() => reProps.value.src,
|
|
106
|
+
async (newVal, oldVal) => {
|
|
107
|
+
if (newVal === oldVal) return;
|
|
108
|
+
serviceAbort?.abort?.(serviceAbortReason);
|
|
109
|
+
serviceAbort = void 0;
|
|
110
|
+
const { mode, listOssByIds } = reProps.value;
|
|
111
|
+
if (mode === "ossId") {
|
|
112
|
+
if (!listOssByIds || !listOssByIds.service || isEmpty(newVal) || newVal instanceof File || validator(newVal, "url")) {
|
|
113
|
+
serviceLoad.value = false;
|
|
114
|
+
reSrc.value = newVal;
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
117
|
+
serviceLoad.value = true;
|
|
118
|
+
const currentRequest = abortWrapper(requestSrc(newVal, listOssByIds));
|
|
119
|
+
serviceAbort = currentRequest;
|
|
120
|
+
const [error, src] = await to(currentRequest);
|
|
121
|
+
if (serviceAbort !== currentRequest) return;
|
|
122
|
+
serviceAbort = void 0;
|
|
123
|
+
serviceLoad.value = false;
|
|
124
|
+
if (error) throw error;
|
|
125
|
+
reSrc.value = src;
|
|
126
|
+
return;
|
|
127
|
+
}
|
|
128
|
+
serviceLoad.value = false;
|
|
129
|
+
reSrc.value = newVal;
|
|
130
|
+
},
|
|
131
|
+
{ immediate: true }
|
|
132
|
+
);
|
|
133
|
+
onUnmounted(() => {
|
|
134
|
+
serviceAbort?.abort?.(serviceAbortReason);
|
|
135
|
+
serviceAbort = void 0;
|
|
136
|
+
});
|
|
137
|
+
return (_ctx, _cache) => {
|
|
138
|
+
return openBlock(), createElementBlock(Fragment, null, [
|
|
139
|
+
withDirectives((openBlock(), createBlock(unref(Image), mergeProps({ class: "qd-image" }, { ..._ctx.$attrs, ...reProps.value.imageOptions }, {
|
|
140
|
+
src: typeof reSrc.value === "number" ? reSrc.value + "" : reSrc.value,
|
|
141
|
+
"overlay-trigger": __props.preview && !imageError.value ? "hover" : void 0,
|
|
142
|
+
onError: handleImageError,
|
|
143
|
+
onLoad: handleImageLoad,
|
|
144
|
+
onClick: openViewer
|
|
145
|
+
}), createSlots({
|
|
146
|
+
loading: withCtx(() => [
|
|
147
|
+
renderSlot(_ctx.$slots, "loading", {}, () => [
|
|
148
|
+
createVNode(unref(LoadingIcon))
|
|
149
|
+
], true)
|
|
150
|
+
]),
|
|
151
|
+
error: withCtx(() => [
|
|
152
|
+
renderSlot(_ctx.$slots, "error", {}, () => [
|
|
153
|
+
createVNode(unref(ImageErrorIcon))
|
|
154
|
+
], true)
|
|
155
|
+
]),
|
|
156
|
+
_: 2
|
|
157
|
+
}, [
|
|
158
|
+
__props.preview && !imageError.value && !_ctx.$slots["overlay-content"] ? {
|
|
159
|
+
name: "overlay-content",
|
|
160
|
+
fn: withCtx(() => [
|
|
161
|
+
createElementVNode("div", _hoisted_1, [
|
|
162
|
+
createVNode(unref(BrowseIcon))
|
|
163
|
+
])
|
|
164
|
+
]),
|
|
165
|
+
key: "0"
|
|
166
|
+
} : {
|
|
167
|
+
name: "overlay-content",
|
|
168
|
+
fn: withCtx(() => [
|
|
169
|
+
renderSlot(_ctx.$slots, "overlay-content", {}, void 0, true)
|
|
170
|
+
]),
|
|
171
|
+
key: "1"
|
|
172
|
+
},
|
|
173
|
+
renderList(unref(filterSlots)(_ctx.$slots, ["loading", "error", "overlay-content"]), (name) => {
|
|
174
|
+
return {
|
|
175
|
+
name,
|
|
176
|
+
fn: withCtx((slotProps) => [
|
|
177
|
+
renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps)), void 0, true)
|
|
178
|
+
])
|
|
179
|
+
};
|
|
180
|
+
})
|
|
181
|
+
]), 1040, ["src", "overlay-trigger"])), [
|
|
182
|
+
[unref(vLoading), { loading: serviceLoad.value, size: "small" }]
|
|
183
|
+
]),
|
|
184
|
+
__props.preview ? (openBlock(), createBlock(unref(ImageViewer), {
|
|
185
|
+
key: 0,
|
|
186
|
+
images: viewerImages.value,
|
|
187
|
+
visible: viewerVisible.value,
|
|
188
|
+
"onUpdate:visible": _cache[0] || (_cache[0] = ($event) => viewerVisible.value = $event)
|
|
189
|
+
}, {
|
|
190
|
+
trigger: withCtx(() => [..._cache[1] || (_cache[1] = [
|
|
191
|
+
createElementVNode("span", { class: "qd-image__viewer-trigger" }, null, -1)
|
|
192
|
+
])]),
|
|
193
|
+
_: 1
|
|
194
|
+
}, 8, ["images", "visible"])) : createCommentVNode("", true)
|
|
195
|
+
], 64);
|
|
196
|
+
};
|
|
197
|
+
}
|
|
198
|
+
});
|
|
2
199
|
export {
|
|
3
200
|
_sfc_main as default
|
|
4
201
|
};
|
|
@@ -3,4 +3,5 @@ import type { QdUploadProps } from '../upload';
|
|
|
3
3
|
export interface QdImageProps<OR = unknown, OP extends string | number | (string | number)[] = string | number | (string | number)[], TOP = OP> extends Omit<TdImageProps, 'src'>, Pick<QdUploadProps<UploadFile, OR, OP, TOP>, 'listOssByIds'> {
|
|
4
4
|
src?: string | number | File;
|
|
5
5
|
mode?: 'ossId' | 'url';
|
|
6
|
+
preview?: boolean;
|
|
6
7
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -6,38 +6,38 @@ import { default as default4 } from "./components/dialog/index.vue.mjs";
|
|
|
6
6
|
import { default as default5 } from "./components/dict/select/index.vue.mjs";
|
|
7
7
|
import { default as default6 } from "./components/drawer/index.vue.mjs";
|
|
8
8
|
/* empty css */
|
|
9
|
-
import { default as default7 } from "./components/
|
|
10
|
-
import { default as default8 } from "./components/
|
|
11
|
-
import { default as default9 } from "./components/
|
|
12
|
-
import { default as default10 } from "./components/org/select/index.vue.mjs";
|
|
9
|
+
import { default as default7 } from "./components/import-dialog/index.vue.mjs";
|
|
10
|
+
import { default as default8 } from "./components/input-number/index.vue.mjs";
|
|
11
|
+
import { default as default9 } from "./components/org/select/index.vue.mjs";
|
|
13
12
|
/* empty css */
|
|
14
|
-
import { default as
|
|
13
|
+
import { default as default10 } from "./components/service-tree-select/index.vue.mjs";
|
|
15
14
|
/* empty css */
|
|
16
|
-
import { default as
|
|
17
|
-
import { default as
|
|
18
|
-
import { default as
|
|
19
|
-
import { default as
|
|
15
|
+
import { default as default11 } from "./components/auto-tooltip/index.vue.mjs";
|
|
16
|
+
import { default as default12 } from "./components/avatar/index.vue.mjs";
|
|
17
|
+
import { default as default13 } from "./components/card/index.vue.mjs";
|
|
18
|
+
import { default as default14 } from "./components/columns-controller/index.vue.mjs";
|
|
20
19
|
import { useConfig } from "./components/config-provider/useConfig.mjs";
|
|
21
20
|
import { QdConfigProvider } from "./components/config-provider/index.mjs";
|
|
22
21
|
import { qdAsyncCompute, qdCompute, qdUseComputeValue } from "./components/config-renderer/compute.mjs";
|
|
23
22
|
import { getValueByPath, parseVModelPath, resolveVModelBinding, setValueByPath } from "./components/config-renderer/utils.mjs";
|
|
24
23
|
import { defineQdCrudList, defineQdCrudTable, defineQdCrudTabsTable } from "./components/crud/define.mjs";
|
|
25
|
-
import { default as
|
|
26
|
-
import { default as
|
|
27
|
-
import { default as
|
|
28
|
-
import { default as
|
|
29
|
-
import { default as
|
|
30
|
-
import { default as
|
|
31
|
-
import { default as
|
|
32
|
-
import { default as
|
|
24
|
+
import { default as default15 } from "./components/crud/list/index.vue.mjs";
|
|
25
|
+
import { default as default16 } from "./components/crud/search/index.vue.mjs";
|
|
26
|
+
import { default as default17 } from "./components/crud/table/index.vue.mjs";
|
|
27
|
+
import { default as default18 } from "./components/crud/tabs-table/index.vue.mjs";
|
|
28
|
+
import { default as default19 } from "./components/dict/checkbox-group/index.vue.mjs";
|
|
29
|
+
import { default as default20 } from "./components/dict/radio-group/index.vue.mjs";
|
|
30
|
+
import { default as default21 } from "./components/dict/tag/index.vue.mjs";
|
|
31
|
+
import { default as default22 } from "./components/file-icon/index.vue.mjs";
|
|
33
32
|
import { PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE, PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUEUE, PROVIDE_FORM_RESET_QUEUE } from "./components/form/config.mjs";
|
|
34
|
-
import { default as
|
|
35
|
-
import { default as
|
|
33
|
+
import { default as default23 } from "./components/form/index.vue.mjs";
|
|
34
|
+
import { default as default24 } from "./components/form/item.vue.mjs";
|
|
36
35
|
import { qdFormGrid, qdFormGutter } from "./components/form/props.mjs";
|
|
37
36
|
import { DEFAULT_GRID_WIDTH, PROVIDE_GRID_ITEM_PROPS_KEY, PROVIDE_GRID_WIDTH_KEY } from "./components/grid/config.mjs";
|
|
38
|
-
import { default as
|
|
39
|
-
import { default as
|
|
37
|
+
import { default as default25 } from "./components/grid/index.vue.mjs";
|
|
38
|
+
import { default as default26 } from "./components/grid/item.vue.mjs";
|
|
40
39
|
import { mergeGridValue, resolveGridSpan } from "./components/grid/utils.mjs";
|
|
40
|
+
import { default as default27 } from "./components/image/index.vue.mjs";
|
|
41
41
|
import { default as default28 } from "./components/left-ribbon-tag/index.vue.mjs";
|
|
42
42
|
import { default as default29 } from "./components/org/tag/index.vue.mjs";
|
|
43
43
|
import { default as default30 } from "./components/read-write/index.vue.mjs";
|
|
@@ -76,33 +76,33 @@ export {
|
|
|
76
76
|
PROVIDE_GRID_ITEM_PROPS_KEY,
|
|
77
77
|
PROVIDE_GRID_WIDTH_KEY,
|
|
78
78
|
QD_TABLE_BLANK_FILTER_VALUE,
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
79
|
+
default11 as QdAutoTooltip,
|
|
80
|
+
default12 as QdAvatar,
|
|
81
|
+
default13 as QdCard,
|
|
82
|
+
default14 as QdColumnsController,
|
|
83
83
|
QdConfigProvider,
|
|
84
84
|
default2 as QdConfigRenderer,
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
85
|
+
default15 as QdCrudList,
|
|
86
|
+
default16 as QdCrudSearch,
|
|
87
|
+
default17 as QdCrudTable,
|
|
88
|
+
default18 as QdCrudTabsTable,
|
|
89
89
|
default4 as QdDialog,
|
|
90
90
|
default3 as QdDialogForm,
|
|
91
|
-
|
|
92
|
-
|
|
91
|
+
default19 as QdDictCheckboxGroup,
|
|
92
|
+
default20 as QdDictRadioGroup,
|
|
93
93
|
default5 as QdDictSelect,
|
|
94
|
-
|
|
94
|
+
default21 as QdDictTag,
|
|
95
95
|
default6 as QdDrawer,
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
96
|
+
default22 as QdFileIcon,
|
|
97
|
+
default23 as QdForm,
|
|
98
|
+
default24 as QdFormItem,
|
|
99
|
+
default25 as QdGrid,
|
|
100
|
+
default26 as QdGridItem,
|
|
101
|
+
default27 as QdImage,
|
|
102
|
+
default7 as QdImportDialog,
|
|
103
|
+
default8 as QdInputNumber,
|
|
104
104
|
default28 as QdLeftRibbonTag,
|
|
105
|
-
|
|
105
|
+
default9 as QdOrgSelect,
|
|
106
106
|
default29 as QdOrgTag,
|
|
107
107
|
default30 as QdReadWrite,
|
|
108
108
|
default33 as QdServiceDialogTableSelect,
|
|
@@ -111,7 +111,7 @@ export {
|
|
|
111
111
|
default35 as QdServicePopupTableSelect,
|
|
112
112
|
default36 as QdServiceSelect,
|
|
113
113
|
default32 as QdServiceTable,
|
|
114
|
-
|
|
114
|
+
default10 as QdServiceTreeSelect,
|
|
115
115
|
default37 as QdSteps,
|
|
116
116
|
default38 as QdUpload,
|
|
117
117
|
auth,
|