@aplus-frontend/ui
Version:
219 lines (218 loc) • 7.92 kB
JavaScript
import { defineComponent as h, computed as C, createBlock as b, openBlock as u, unref as e, mergeProps as G, withCtx as i, renderSlot as H, normalizeProps as J, guardReactiveProps as K, createElementVNode as s, normalizeClass as l, createElementBlock as v, createVNode as n, createTextVNode as m, toDisplayString as p, resolveDynamicComponent as N, h as S, Fragment as D } from "vue";
import { clearSingleFile as Q, clearAllFile as y } from "../utils/fileList.mjs";
import g from "../icon/file-icon.vue.mjs";
import k from "../icon/delete-icon.vue.mjs";
import { Form as W, UploadDragger as X, TypographyParagraph as x, Progress as Y, Tooltip as L } from "@aplus-frontend/antdv";
import { FormItemInputContext as Z } from "@aplus-frontend/antdv/es/form/FormItemContext";
import { useSingleProps as ee } from "../hook/useProps.mjs";
import { useInjectContext as te } from "../hook/useInjectContext.mjs";
import { omit as oe } from "lodash-unified";
import "../../../config-provider/index.mjs";
import { useGlobalConfig as w } from "../../../config-provider/hooks/use-global-config.mjs";
import { useLocale as le } from "../../../config-provider/hooks/use-locale.mjs";
import { useNamespace as se } from "../../../config-provider/hooks/use-namespace.mjs";
const be = /* @__PURE__ */ h({
__name: "ap-upload-single",
props: {
dirName: {},
getOssAccess: {},
fileList: {},
onChange: {},
maxSize: { default: 500 },
accept: { default: "*" },
beforeUpload: {},
customRequest: {},
maxSizeErrorMsg: {},
acceptErrorMsg: {},
title: { type: [Object, String, Number, Boolean, null, Array] },
subTitle: { type: [Object, String, Number, Boolean, null, Array] }
},
emits: ["update:fileList"],
setup(A, { emit: E }) {
const P = Z.useInject(), $ = C(() => P.status), d = A, q = E, B = W.useInjectFormItemContext(), r = C({
get() {
return d.fileList || [];
},
set(c) {
q("update:fileList", c), B?.onFieldChange();
}
}), o = C(() => r.value?.[0]), O = w("apUpload"), { t: T, lang: U } = le(), {
title: j,
subTitle: z,
beforeUpload: R,
customRequest: M
} = ee(d), V = M;
te(
T,
U,
d?.getOssAccess ?? O.value?.getOssAccess
);
const { b: F, e: t } = se("ap-upload-single"), I = w("uiMode");
function _(c) {
return oe(c, [
"dirName",
"needName",
"getOssAccess",
"fileList",
"title",
"subTitle"
]);
}
return (c, a) => (u(), b(e(X), G({
...c.$attrs,
..._(d)
}, {
"file-list": r.value,
"onUpdate:fileList": a[3] || (a[3] = (f) => r.value = f),
"max-count": 1,
"show-upload-list": !1,
disabled: !!o.value && [void 0, "uploading", "error", "success", "done"].includes(o.value.status),
class: [e(F)(), `${e(F)()}-affix-wrapper-status-${$.value}`],
"before-upload": e(R),
"custom-request": e(V)
}), {
default: i(() => [
H(c.$slots, "default", J(K({
file: o.value,
clear: () => o.value && e(Q)(o.value, r.value, { maxCount: 1 })
})), () => [
s("div", {
class: l([e(t)("content")])
}, [
o.value?.status && ["uploading"].includes(o.value.status) ? (u(), v("div", {
key: 0,
class: l([e(t)("content-file"), e(t)("content-ing")])
}, [
s("div", {
class: l([e(t)("content-file-icon")])
}, [
n(g)
], 2),
s("div", {
class: l([e(t)("content-file-name"), e(t)("content-ing-name")])
}, [
n(e(x), {
ellipsis: { rows: 2 },
tooltip: o.value.error
}, {
default: i(() => [
m(p(o.value.name), 1)
]),
_: 1
}, 8, ["tooltip"]),
n(e(Y), {
percent: o.value.percent || 0,
size: 4,
"show-info": !1,
"trail-color": e(I) === "admin" ? "#D9D9D9" : "#DEE4ED",
"stroke-color": e(I) === "admin" ? "#34B77C" : "#0070FF"
}, null, 8, ["percent", "trail-color", "stroke-color"])
], 2),
s("div", {
class: l([e(t)("content-file-delete")]),
onClick: a[0] || (a[0] = (f) => e(y)(r.value))
}, [
n(k)
], 2)
], 2)) : o.value?.status && ["error"].includes(o.value.status) ? (u(), v("div", {
key: 1,
class: l([e(t)("content-file"), e(t)("content-error")])
}, [
s("div", {
class: l([e(t)("content-file-icon")])
}, [
n(g)
], 2),
s("div", {
class: l([e(t)("content-file-name"), e(t)("content-error-name")])
}, [
n(e(L), null, {
title: i(() => [
m(p(o.value?.error || "--"), 1)
]),
default: i(() => [
n(e(x), {
ellipsis: { rows: 2 },
tooltip: o.value.error
}, {
default: i(() => [
m(p(o.value.name), 1)
]),
_: 1
}, 8, ["tooltip"])
]),
_: 1
})
], 2),
s("div", {
class: l([e(t)("content-file-delete")]),
onClick: a[1] || (a[1] = (f) => e(y)(r.value))
}, [
n(k)
], 2)
], 2)) : o.value && o.value?.status === void 0 || o.value?.status && ["success", "done"].includes(o.value.status) ? (u(), v("div", {
key: 2,
class: l([e(t)("content-file"), e(t)("content-done")])
}, [
s("div", {
class: l([e(t)("content-file-icon")])
}, [
n(g)
], 2),
s("div", {
class: l([e(t)("content-file-name"), e(t)("content-done-name")])
}, [
n(e(L), null, {
title: i(() => [
m(p(o.value?.name || "--"), 1)
]),
default: i(() => [
n(e(x), {
ellipsis: { rows: 2 },
tooltip: o.value.error
}, {
default: i(() => [
m(p(o.value.name), 1)
]),
_: 1
}, 8, ["tooltip"])
]),
_: 1
})
], 2),
s("div", {
class: l([e(t)("content-file-delete")]),
onClick: a[2] || (a[2] = (f) => e(y)(r.value))
}, [
n(k)
], 2)
], 2)) : (u(), v("div", {
key: 3,
class: l([e(t)("content-empty")])
}, [
s("div", {
class: l([e(t)("content-empty-icon")])
}, [
n(g)
], 2),
s("div", {
class: l([e(t)("content-empty-title")])
}, [
(u(), b(N(S(D, [e(j)]))))
], 2),
s("div", {
class: l([e(t)("content-empty-sub-title")])
}, [
(u(), b(N(S(D, [e(z)]))))
], 2)
], 2))
], 2)
])
]),
_: 3
}, 16, ["file-list", "disabled", "class", "before-upload", "custom-request"]));
}
});
export {
be as default
};