yanzhen-design-vue
Version:
168 lines (167 loc) • 11.5 kB
JavaScript
import { defineComponent, useAttrs, openBlock, createElementBlock, Fragment, createVNode, unref, withCtx, normalizeClass, createElementVNode, renderList, createBlock, toDisplayString, createCommentVNode, h, withModifiers, mergeProps, isRef, renderSlot, normalizeProps, guardReactiveProps, normalizeStyle, createTextVNode } from "vue";
import { createReusableTemplate } from "@vueuse/core";
import { Spin, Flex, Image, Tooltip, Divider, Button, Drawer } from "ant-design-vue";
import { DownloadOutlined, PaperClipOutlined } from "@ant-design/icons-vue";
import { uploadFilePreviewName, uploadFilePreviewProps, uploadFilePreviewEmits, uploadFilePreviewOptions } from "./upload-file-preview.mjs";
import "./upload-image-preview.vue.mjs";
import { useUploadFilePreview } from "./use-upload-file-preview.mjs";
import _sfc_main$1 from "./upload-image-preview.vue2.mjs";
const _hoisted_1 = ["onClick"];
const _imageFallBackBase64 = "data:image/png;base64,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";
const _sfc_main = /* @__PURE__ */ defineComponent({
...{ name: uploadFilePreviewName },
__name: "upload-file-preview",
props: uploadFilePreviewProps,
emits: uploadFilePreviewEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const [DefineTemplate, ReusableTemplate] = createReusableTemplate();
const ns = uploadFilePreviewOptions.ns;
const props = __props;
const emit = __emit;
const attrs = useAttrs();
const {
loading,
useDrawer,
fileListRef,
visible,
drawerConfigRef,
exposeCtx,
handlePreviewFile,
handleDownloadFile,
handleOpenPreviewFile
} = useUploadFilePreview(props, emit);
__expose(exposeCtx);
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
createVNode(unref(DefineTemplate), null, {
default: withCtx(() => [
createVNode(unref(Spin), {
class: normalizeClass(unref(ns).e("loading")),
spinning: unref(loading)
}, {
default: withCtx(() => [
createElementVNode("div", {
class: normalizeClass([unref(ns).b(), unref(ns).b("content")])
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(fileListRef), (item) => {
return openBlock(), createBlock(unref(Flex), {
key: item.uid,
class: normalizeClass(unref(ns).e("item")),
gap: 10,
vertical: false,
align: "center"
}, {
default: withCtx(() => {
var _a, _b;
return [
createVNode(unref(Image), {
"native-tag": "a-image",
width: 40,
height: 40,
class: normalizeClass(unref(ns).e("file-icon")),
src: (_a = item.originInfo) == null ? void 0 : _a.fileIcon,
preview: false,
fallback: _imageFallBackBase64
}, null, 8, ["class", "src"]),
createElementVNode("div", {
class: normalizeClass(unref(ns).e("file-info")),
onClick: ($event) => unref(handlePreviewFile)(item)
}, [
createVNode(unref(Tooltip), {
title: ((_b = item.originInfo) == null ? void 0 : _b.fileName) ?? item.name
}, {
default: withCtx(() => {
var _a2;
return [
createElementVNode("div", {
class: normalizeClass([unref(ns).e("file-name"), unref(ns).e("ellipsis")])
}, toDisplayString(((_a2 = item.originInfo) == null ? void 0 : _a2.fileName) ?? item.name), 3)
];
}),
_: 2
}, 1032, ["title"]),
item.originInfo ? (openBlock(), createBlock(unref(Flex), {
key: 0,
gap: 4,
align: "center",
class: normalizeClass(unref(ns).e("file-detail"))
}, {
default: withCtx(() => {
var _a2, _b2;
return [
createElementVNode("span", {
style: { "max-width": "40%" },
class: normalizeClass([unref(ns).e("ellipsis")])
}, " 来自: " + toDisplayString(((_a2 = item.originInfo) == null ? void 0 : _a2.createUserName) || "--"), 3),
createVNode(unref(Divider), {
type: "vertical",
class: normalizeClass(unref(ns).e("divider"))
}, null, 8, ["class"]),
createElementVNode("span", {
style: { "max-width": "58%" },
class: normalizeClass([unref(ns).e("ellipsis")])
}, " 创建时间: " + toDisplayString((_b2 = item.originInfo) == null ? void 0 : _b2.insertTimeForHis), 3)
];
}),
_: 2
}, 1032, ["class"])) : createCommentVNode("", true)
], 10, _hoisted_1),
createElementVNode("div", {
class: normalizeClass(unref(ns).e("download"))
}, [
createVNode(unref(Button), {
type: "link",
icon: h(unref(DownloadOutlined)),
onClick: withModifiers(($event) => unref(handleDownloadFile)(item), ["stop"])
}, null, 8, ["icon", "onClick"])
], 2)
];
}),
_: 2
}, 1032, ["class"]);
}), 128))
], 2)
]),
_: 1
}, 8, ["class", "spinning"]),
createVNode(_sfc_main$1, {
ref: "imagePreviewRef",
style: { "display": "none" },
"file-list": unref(fileListRef)
}, null, 8, ["file-list"])
]),
_: 1
}),
unref(useDrawer) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
createVNode(unref(Drawer), mergeProps({
visible: unref(visible),
"onUpdate:visible": _cache[0] || (_cache[0] = ($event) => isRef(visible) ? visible.value = $event : null),
"root-class-name": unref(ns).b("drawer")
}, unref(drawerConfigRef)), {
default: withCtx(() => [
createVNode(unref(ReusableTemplate))
]),
_: 1
}, 16, ["visible", "root-class-name"]),
renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(exposeCtx))), () => [
createVNode(unref(Button), {
class: normalizeClass(unref(attrs).class),
style: normalizeStyle(unref(attrs).style),
icon: h(unref(PaperClipOutlined)),
type: "link",
onClick: _cache[1] || (_cache[1] = ($event) => unref(handleOpenPreviewFile)())
}, {
default: withCtx(() => [
createTextVNode(toDisplayString(unref(fileListRef).length), 1)
]),
_: 1
}, 8, ["class", "style", "icon"])
])
], 64)) : (openBlock(), createBlock(unref(ReusableTemplate), { key: 1 }))
], 64);
};
}
});
export {
_sfc_main as default
};