yanzhen-design-vue
Version:
200 lines (199 loc) • 9.88 kB
JavaScript
import { normalizeClass, defineComponent, openBlock, createElementBlock, Fragment, createVNode, unref, withCtx, createElementVNode, createBlock, mergeProps, isRef, createSlots, renderSlot, toDisplayString, normalizeProps, guardReactiveProps, createCommentVNode, h, createTextVNode } from "vue";
import { UploadDragger, Upload, Button, Tooltip } from "ant-design-vue";
import { InboxOutlined, UploadOutlined, PlusOutlined, QuestionCircleOutlined } from "@ant-design/icons-vue";
import "../../image-viewer/src/image-viewer.vue.mjs";
import "./upload-file-preview.vue.mjs";
import { uploadName, uploadProps, uploadEmits, uploadOptions } from "./upload.mjs";
import { useUpload } from "./use-upload.mjs";
import _sfc_main$1 from "../../image-viewer/src/image-viewer.vue2.mjs";
import _sfc_main$2 from "./upload-file-preview.vue2.mjs";
const _hoisted_1 = { style: { "display": "none" } };
const _hoisted_2 = { class: "ant-upload-drag-icon" };
const _hoisted_3 = { key: 0 };
const _hoisted_4 = { key: 3 };
const _hoisted_5 = {
key: 0,
class: /* @__PURE__ */ normalizeClass(["anticon", "anticon-uploading"])
};
const _sfc_main = /* @__PURE__ */ defineComponent({
...{ name: uploadName },
__name: "upload",
props: uploadProps,
emits: uploadEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const { ns } = uploadOptions;
const props = __props;
const emit = __emit;
const {
_ref,
slots,
acceptRef,
multipleRef,
fileListRef,
description,
progressProps,
propsRef,
maxCountRef,
handleCustomRequest,
handleBeforeUpload,
UploadIconRender,
DefineUploadIconRender,
ReusableUploadIconRender,
DefineUploadPreview,
ReusableUploadPreview,
exposeCtx,
// Preview
imagePreviewRef,
filePreviewRef,
isImageType,
handleOpenPreview
} = useUpload(props, emit);
__expose(exposeCtx);
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
createVNode(unref(DefineUploadPreview), null, {
default: withCtx(() => [
createElementVNode("div", _hoisted_1, [
unref(isImageType) ? (openBlock(), createBlock(_sfc_main$1, {
key: 0,
ref_key: "imagePreviewRef",
ref: imagePreviewRef,
"is-upload-viewer": true,
"file-list": unref(fileListRef)
}, null, 8, ["file-list"])) : (openBlock(), createBlock(_sfc_main$2, {
key: 1,
ref_key: "filePreviewRef",
ref: filePreviewRef,
"file-list": unref(fileListRef)
}, null, 8, ["file-list"]))
])
]),
_: 1
}),
props.styleType === "box" ? (openBlock(), createBlock(unref(UploadDragger), mergeProps({
key: 0,
ref_key: "_ref",
ref: _ref,
"file-list": unref(fileListRef),
"onUpdate:fileList": _cache[0] || (_cache[0] = ($event) => isRef(fileListRef) ? fileListRef.value = $event : null),
class: [unref(ns).b(), unref(ns).b("drop")]
}, unref(propsRef), {
multiple: unref(multipleRef),
accept: unref(acceptRef),
progress: unref(progressProps),
"before-upload": unref(handleBeforeUpload),
"custom-request": unref(handleCustomRequest),
onPreview: unref(handleOpenPreview)
}), createSlots({
default: withCtx(() => [
renderSlot(_ctx.$slots, "default", {}, () => [
createElementVNode("p", _hoisted_2, [
createVNode(unref(InboxOutlined))
]),
createElementVNode("p", {
class: normalizeClass(unref(ns).e("txt"))
}, "点击或拖拽文件到此区域上传", 2),
createElementVNode("p", {
class: normalizeClass(unref(ns).e("hint"))
}, "支持扩展名：" + toDisplayString(unref(description)), 3)
])
]),
_: 2
}, [
unref(slots).itemRender ? {
name: "itemRender",
fn: withCtx((item) => [
renderSlot(_ctx.$slots, "itemRender", normalizeProps(guardReactiveProps(item)))
]),
key: "0"
} : void 0
]), 1040, ["file-list", "class", "multiple", "accept", "progress", "before-upload", "custom-request", "onPreview"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
createVNode(unref(DefineUploadIconRender), null, {
default: withCtx(() => _cache[2] || (_cache[2] = [
createElementVNode("svg", {
focusable: "false",
"aria-hidden": "true",
width: "1em",
height: "1em",
fill: "currentColor",
viewBox: "0 0 1316 1024"
}, [
createElementVNode("path", { d: "M1050.233905 735.183238h-104.984381v52.516572h104.984381v105.033142h52.516571v-105.033142h105.033143v-52.516572h-105.033143v-105.033143h-52.516571v105.033143z m0-261.363809a286.96381 286.96381 0 0 0-102.4 28.964571c-0.195048-119.125333-0.195048-227.279238-0.195048-227.035429-44.958476-96.548571-121.61219-11.459048-136.045714 6.631619l-305.200762 345.526858-170.325333-126.098286a41.837714 41.837714 0 0 0-56.807619 6.339048l-193.097143 290.133333a42.081524 42.081524 0 0 0 31.987809 69.241905c0.24381 0 453.046857-0.195048 689.590857-0.146286 15.311238 38.863238 38.863238 73.630476 68.412953 102.107428H83.870476c-46.128762 0-83.870476-37.936762-83.870476-83.870476V80.408381C0 34.182095 37.741714 0 83.870476 0h879.079619c46.08 0 87.28381 34.182095 87.28381 80.164571v393.606096zM338.407619 119.174095a128.487619 128.487619 0 0 0-128.828952 128.097524A128.487619 128.487619 0 0 0 338.407619 375.417905a128.341333 128.341333 0 0 0 128.828952-128.097524A128.487619 128.487619 0 0 0 338.407619 119.222857z m738.157714 878.543238a236.30019 236.30019 0 1 1 0-472.649143 236.30019 236.30019 0 0 1 0 472.649143z" })
], -1)
])),
_: 1
}),
createVNode(unref(Upload), mergeProps({
ref_key: "_ref",
ref: _ref,
"file-list": unref(fileListRef),
"onUpdate:fileList": _cache[1] || (_cache[1] = ($event) => isRef(fileListRef) ? fileListRef.value = $event : null),
class: [unref(ns).b()]
}, unref(propsRef), {
multiple: unref(multipleRef),
accept: unref(acceptRef),
progress: unref(progressProps),
"before-upload": unref(handleBeforeUpload),
"custom-request": unref(handleCustomRequest),
onPreview: unref(handleOpenPreview)
}), createSlots({
default: withCtx(() => [
renderSlot(_ctx.$slots, "default", {}, () => [
props.listType === "picture-card" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
unref(fileListRef).length < unref(maxCountRef) ? (openBlock(), createElementBlock("div", _hoisted_3, [
createElementVNode("span", {
class: normalizeClass(unref(ns).e("picture-card-icon"))
}, [
createVNode(unref(ReusableUploadIconRender))
], 2)
])) : createCommentVNode("", true)
], 64)) : props.listType === "text" ? (openBlock(), createBlock(unref(Button), {
key: 1,
icon: h(unref(UploadOutlined)),
disabled: props.disabled
}, {
default: withCtx(() => _cache[3] || (_cache[3] = [
createTextVNode("传文件 ")
])),
_: 1
}, 8, ["icon", "disabled"])) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
createVNode(unref(PlusOutlined)),
_cache[4] || (_cache[4] = createElementVNode("div", { class: "ant-upload-text" }, " 上传文件 ", -1))
], 64)),
unref(description) && props.styleType === "image" ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(unref(description)), 1)) : unref(description) ? (openBlock(), createBlock(unref(Tooltip), {
key: 4,
title: unref(description)
}, {
default: withCtx(() => [
createVNode(unref(QuestionCircleOutlined), { style: { fontSize: "18px", paddingLeft: "10px", color: "#108ee9" } })
]),
_: 1
}, 8, ["title"])) : createCommentVNode("", true)
])
]),
iconRender: withCtx((item) => [
renderSlot(_ctx.$slots, "iconRender", normalizeProps(guardReactiveProps(item)), () => [
item.file.status === "uploading" && item.listType === "picture-card" ? (openBlock(), createElementBlock("span", _hoisted_5, [
createVNode(unref(ReusableUploadIconRender))
])) : (openBlock(), createBlock(unref(UploadIconRender), normalizeProps(mergeProps({ key: 1 }, item)), null, 16))
])
]),
_: 2
}, [
unref(slots).itemRender ? {
name: "itemRender",
fn: withCtx((item) => [
renderSlot(_ctx.$slots, "itemRender", normalizeProps(guardReactiveProps(item)))
]),
key: "0"
} : void 0
]), 1040, ["file-list", "class", "multiple", "accept", "progress", "before-upload", "custom-request", "onPreview"])
], 64)),
createVNode(unref(ReusableUploadPreview))
], 64);
};
}
});
export {
_sfc_main as default
};