naive-upload
Version:
<p align="left"> <a href="https://www.npmjs.org/package/naive-upload"> <img src="https://img.shields.io/npm/v/naive-upload.svg"> </a> <a href="https://bundlephobia.com/package/naive-upload@latest"> <img src="https://img.shields.io/bundl
1,543 lines (1,542 loc) • 120 kB
JavaScript
var he = Object.defineProperty;
var pe = (s, e, t) => e in s ? he(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
var c = (s, e, t) => (pe(s, typeof e != "symbol" ? e + "" : e, t), t);
import { defineComponent as S, reactive as ge, watch as W } from "vue-demi";
import fe from "spark-md5";
var T = /* @__PURE__ */ ((s) => (s.\u5168\u81EA\u52A8 = "AT", s.\u624B\u52A8\u6321 = "MT", s.\u534A\u81EA\u52A8 = "AMT", s))(T || {}), x = /* @__PURE__ */ ((s) => (s.\u5361\u7247 = "Card", s.\u6E05\u5355 = "Detailedly", s))(x || {});
class v {
constructor(e, t, n, o) {
c(this, "r");
c(this, "g");
c(this, "b");
c(this, "a");
c(this, "toString", () => `rgba(${this.r}, ${this.g}, ${this.b}, ${this.a})`);
this.r = e, this.g = t, this.b = n, this.a = o;
}
static convertFrom(e) {
return new v(e.r, e.g, e.b, e.a);
}
}
const z = class {
constructor() {
c(this, "build", (e) => (e(this), this));
c(this, "setup", (e) => (e(this), this));
c(this, "configCode", "default");
c(this, "concurrentFile", 3);
c(this, "concurrentChunkFile", 3);
c(this, "tip", "\u5355\u51FB\u6216\u62D6\u52A8\u6587\u4EF6\u5230\u6B64\u533A\u57DF\u5373\u53EF\u4E0A\u4F20");
c(this, "layout", x.\u5361\u7247);
c(this, "runMode", T.\u5168\u81EA\u52A8);
c(this, "enableChunk", !0);
c(this, "chunkSize", 2097152);
c(this, "retry", 3);
c(this, "enableWorker", !0);
c(this, "readonly", !1);
c(this, "debug", !1);
c(this, "alertErrorInfo", !1);
c(this, "enableDrag", !0);
c(this, "statusCheckingColor", new v(255, 235, 59, 0.5));
c(this, "statusUploadingColor", new v(144, 206, 255, 0.5));
c(this, "statusPausedColor", new v(158, 158, 158, 0.5));
c(this, "statusPausedSubColor", new v(244, 154, 3, 0.5));
c(this, "statusDoneColor", new v(76, 175, 80, 0.1));
c(this, "statusDoneSubColor", new v(3, 169, 244, 0.5));
c(this, "statusErrorColor", new v(255, 0, 30, 0.35));
c(this, "statusErrorSubColor", new v(232, 31, 31, 0.5));
c(this, "dragReadyColor", new v(255, 152, 0, 0.8));
c(this, "dragMovingColor", new v(255, 152, 0, 0.5));
c(this, "dragOverColor", new v(255, 87, 34, 0.8));
c(this, "dragPreparationTime", 800);
c(this, "dragChangePositionTime", 1e3);
c(this, "isMobile", /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(
navigator.userAgent
));
}
};
let M = z;
c(M, "default", () => new z()), c(M, "defaultWithConfigCode", (e) => new z().setup((t) => t.configCode = e));
const Fe = S({
name: "FileInput",
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Piece: File Input Component(vue2) \u5DF2\u52A0\u8F7D");
},
methods: {
fileInputRef() {
return this.$refs.fileInputRef;
},
chosingFile(s) {
this.uploadInstance.limited() || this.fileInputRef().click();
},
choseFile(s) {
const e = this.fileInputRef();
if (e && e.files)
for (let t = 0; t < e.files.length; t++)
this.uploadInstance.append(e.files[t]);
e && (e.value = "");
}
}
});
var me = function() {
var s, e = this, t = e.$createElement, n = e._self._c || t;
return n("div", {
staticClass: "upload-btn",
attrs: {
title: e.uploadInstance.getSettings().tip
},
on: {
click: e.chosingFile
}
}, [n("div", {
on: {
click: function(o) {
return o.stopPropagation(), function() {
}.apply(null, arguments);
}
}
}, [n("input", {
ref: "fileInputRef",
attrs: {
type: "file",
multiple: ((s = e.uploadInstance.getConfig().upperLimit) !== null && s !== void 0 ? s : 0) > 1,
accept: e.uploadInstance.getAllowedTypes()
},
on: {
change: e.choseFile
}
})]), n("div", {
staticClass: "upload-box-content"
}, [e._t("default")], 2)]);
}, be = [];
function k(s, e, t, n, o, u, a, p) {
var g = typeof s == "function" ? s.options : s;
e && (g.render = e, g.staticRenderFns = t, g._compiled = !0), n && (g.functional = !0), u && (g._scopeId = "data-v-" + u);
var F;
if (a ? (F = function(b) {
b = b || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !b && typeof __VUE_SSR_CONTEXT__ < "u" && (b = __VUE_SSR_CONTEXT__), o && o.call(this, b), b && b._registeredComponents && b._registeredComponents.add(a);
}, g._ssrRegister = F) : o && (F = p ? function() {
o.call(
this,
(g.functional ? this.parent : this).$root.$options.shadowRoot
);
} : o), F)
if (g.functional) {
g._injectStyles = F;
var y = g.render;
g.render = function(D, _) {
return F.call(_), y(D, _);
};
} else {
var m = g.beforeCreate;
g.beforeCreate = m ? [].concat(m, F) : [F];
}
return {
exports: s,
options: g
};
}
const K = {};
var ye = /* @__PURE__ */ k(
Fe,
me,
be,
!1,
De,
null,
null,
null
);
function De(s) {
for (let e in K)
this[e] = K[e];
}
const ue = /* @__PURE__ */ function() {
return ye.exports;
}();
var w = /* @__PURE__ */ ((s) => (s.\u7535\u5B50\u6587\u6863 = "\u7535\u5B50\u6587\u6863", s.\u7535\u5B50\u8868\u683C = "\u7535\u5B50\u8868\u683C", s.\u6587\u672C\u6587\u4EF6 = "\u6587\u672C\u6587\u4EF6", s.\u56FE\u7247 = "\u56FE\u7247", s.\u97F3\u9891 = "\u97F3\u9891", s.\u89C6\u9891 = "\u89C6\u9891", s.\u538B\u7F29\u5305 = "\u538B\u7F29\u5305", s.\u672A\u77E5 = "\u672A\u77E5", s.\u5916\u94FE\u8D44\u6E90 = "\u5916\u94FE\u8D44\u6E90", s))(w || {});
const we = S({
name: "SelectedFileInfo",
props: {
selectedFile: {
type: Object,
require: !0
},
readyDrag: {
type: Boolean,
require: !1
},
startDrag: {
type: Boolean,
require: !1
},
dragging: {
type: Boolean,
require: !1
},
dragover: {
type: Boolean,
require: !1
}
},
emits: [
"setContainerRef",
"mouseDown",
"mouseUp",
"mouseEnter",
"mouseLeave"
],
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
},
containerStyle() {
var s, e, t, n, o, u, a, p;
return `item-container ${((s = this.selectedFile) == null ? void 0 : s.done) && !this.uploadInstance.getSettings().readonly ? " item-done" : ""} ${(e = this.selectedFile) != null && e.error ? " item-error" : ""} ${this.renderData.hover && !this.renderData.rename.active && !((t = this.selectedFile) != null && t.checking) && !((n = this.selectedFile) != null && n.uploading) && !this.readyDrag && !this.startDrag ? " item-hover" : ""} ${(o = this.selectedFile) != null && o.checking ? " item-checking" : ""} ${(u = this.selectedFile) != null && u.uploading ? " item-uploading" : ""} ${(a = this.selectedFile) != null && a.canceled ? " item-canceled" : ""} ${(p = this.selectedFile) != null && p.paused ? " item-paused" : ""} ${this.readyDrag ? " item-ready-drag" : ""} ${this.dragging ? " item-dragging" : ""} ${this.dragover ? " item-drag-over" : ""}`;
},
containerStyleVar() {
return {
"--statusCheckingColor": this.uploadInstance.getSettings().statusCheckingColor.toString(),
"--statusUploadingColor": this.uploadInstance.getSettings().statusUploadingColor.toString(),
"--statusPausedColor": this.uploadInstance.getSettings().statusPausedColor.toString(),
"--statusPausedSubColor": this.uploadInstance.getSettings().statusPausedSubColor.toString(),
"--statusDoneColor": this.uploadInstance.getSettings().statusDoneColor.toString(),
"--statusDoneSubColor": this.uploadInstance.getSettings().statusDoneSubColor.toString(),
"--statusErrorColor": this.uploadInstance.getSettings().statusErrorColor.toString(),
"--statusErrorSubColor": this.uploadInstance.getSettings().statusErrorSubColor.toString(),
"--dragPreparationTime": `${(this.uploadInstance.getSettings().dragPreparationTime / 1e3).toFixed(2)}s`,
"--dragChangePositionTime": `${(this.uploadInstance.getSettings().dragChangePositionTime / 1e3).toFixed(2)}s`,
"--dragReadyColor": this.uploadInstance.getSettings().dragReadyColor.toString(),
"--dragMovingColor": this.uploadInstance.getSettings().dragMovingColor.toString(),
"--dragOverColor": this.uploadInstance.getSettings().dragOverColor.toString()
};
},
containerInfo() {
var s, e, t;
return `${(s = this.selectedFile) != null && s.done ? "\u4E0A\u4F20\u6210\u529F" : ""} ${(e = this.selectedFile) != null && e.error ? this.selectedFile.errorMessage : ""} ${(t = this.selectedFile) != null && t.paused ? "\u5DF2\u6682\u505C" : ""}`;
},
loadingShow() {
return !this.renderData.rename.active && (this.selectedFile.checking || this.selectedFile.uploading);
},
loadingInfo() {
var s, e;
return `${(s = this.selectedFile) != null && s.checking ? "\u626B\u63CF\u4E2D..." + this.selectedFile.percent + "%" : ""} ${(e = this.selectedFile) != null && e.uploading ? "\u4E0A\u4F20\u4E2D..." + this.selectedFile.percent + "%" : ""}`;
},
toolsShow() {
var s, e;
return this.renderData.hover && this.dragging === !1 && !this.renderData.rename.active && !((s = this.selectedFile) != null && s.checking) && !((e = this.selectedFile) != null && e.uploading);
},
renameEnable() {
var s;
return !((s = this.selectedFile) != null && s.uploading);
},
viewEnable() {
var s;
switch ((s = this.selectedFile) == null ? void 0 : s.fileType) {
case w.\u56FE\u7247:
case w.\u97F3\u9891:
return this.selectedFile.extensionLower !== ".flac";
case w.\u89C6\u9891:
return !0;
case w.\u6587\u672C\u6587\u4EF6:
return !0;
case w.\u7535\u5B50\u6587\u6863:
return this.selectedFile.extensionLower === ".pdf" || this.selectedFile.extensionLower === ".doc" || this.selectedFile.extensionLower === ".docx";
default:
return !1;
}
},
saveEnable() {
return !0;
}
},
data() {
return {
renderData: {
renameInputRef: null,
hover: !1,
rename: {
active: !1,
value: ""
}
}
};
},
created() {
this.$nextTick(() => {
this.$emit("setContainerRef", this.$refs.containerRef);
}), this.uploadInstance.getSettings().debug && console.debug("Piece: Selected File Info Component(vue2) \u5DF2\u52A0\u8F7D");
},
methods: {
setRenameInputRef(s) {
s && (this.renderData.renameInputRef = s);
},
mouseEnter(s) {
this.readyDrag || this.startDrag ? (this.$emit("mouseEnter", s), this.renderData.hover = !1) : this.renderData.hover = !0;
},
mouseLeave(s) {
(this.readyDrag || this.startDrag) && this.$emit("mouseLeave", s), this.renderData.hover = !1;
},
mouseDown(s) {
this.$emit("mouseDown", s);
},
mouseUp(s) {
this.$emit("mouseUp", s);
},
rename() {
this.renderData.rename.active = !0, this.$nextTick(() => {
this.renderData.renameInputRef && this.renderData.renameInputRef.focus();
});
},
renameKeydown(s) {
s.key == "Enter" && this.renameDone();
},
renameDone() {
this.uploadInstance.rename(
this.selectedFile.token,
this.renderData.rename.value
).then(() => {
this.renderData.rename.active = !1;
}).catch(() => {
this.renderData.rename.active = !1;
});
},
view() {
const s = this.uploadInstance.getRawFile(
this.selectedFile
), e = "margin:0px;text-align: center;display: flex;flex-direction: row;justify-content: center;align-items: center";
switch (this.selectedFile.fileType) {
case w.\u56FE\u7247:
let t = window.open();
t == null || t.document.write(
`<head><title>${this.selectedFile.fullname()}</title></head><body style="${e};background-color: black;"><img style="max-width: 100%;max-height: 100%;" src="${s.objectURL}" alt="${this.selectedFile.fullname()}"></body>`
);
break;
case w.\u97F3\u9891:
if (this.selectedFile.extensionLower === ".flac")
return;
let n = window.open();
n == null || n.document.write(
`<head><title>${this.selectedFile.fullname()}</title></head><body style="${e};background-color: black;"><audio style="max-width: 100%;max-height: 100%;" src="${s.objectURL}" controls="controls">\u62B1\u6B49, \u6682\u4E0D\u652F\u6301</audio></body>`
);
break;
case w.\u89C6\u9891:
let o = window.open();
o == null || o.document.write(
`<head><title>${this.selectedFile.fullname()}</title></head><body style="${e};background-color: black;"><video style="max-width: 100%;max-height: 100%;" src="${s.objectURL}" controls="controls">\u62B1\u6B49, \u6682\u4E0D\u652F\u6301</video></body>`
);
break;
default:
let u = window.open();
u == null || u.document.write(
`<head><title>${this.selectedFile.fullname()}</title></head><body style="${e};"><object style="max-width: 100%;max-height: 100%;" data="${s.objectURL}" type="${this.selectedFile.extensionLower === ".txt" ? "text/plain" : this.selectedFile.extensionLower === ".pdf" ? "application/pdf" : "application/octet-stream"}" width="100%" height="100%"><iframe src="${s.objectURL}" width="100%" height="100%" ></iframe></object></body>`
);
break;
}
},
save() {
const s = this.uploadInstance.getRawFile(
this.selectedFile
), e = document.createElement("a");
e.style.display = "none", e.href = this.uploadInstance.getDownloadUrl(
this.selectedFile
), s.file && (e.download = this.selectedFile.fullname()), document.body.appendChild(e), e.click(), document.body.removeChild(e);
},
remove() {
this.uploadInstance.remove(this.selectedFile.token);
}
}
});
var Ce = function() {
var s, e, t, n, o, u, a = this, p = a.$createElement, g = a._self._c || p;
return g("div", {
ref: "containerRef",
class: a.containerStyle,
style: a.containerStyleVar,
attrs: {
title: a.containerInfo
},
on: {
mouseenter: a.mouseEnter,
mouseleave: a.mouseLeave,
mousedown: a.mouseDown,
mouseup: a.mouseUp
}
}, [(s = a.selectedFile) !== null && s !== void 0 && s.canceled ? a._e() : g("div", {
staticClass: "item-body"
}, [g("div", {
staticClass: "item-image"
}, [g("img", {
attrs: {
src: (e = a.selectedFile) === null || e === void 0 ? void 0 : e.thumbnail,
loading: "lazy",
alt: (t = a.selectedFile) === null || t === void 0 ? void 0 : t.fullname()
}
})]), a.toolsShow ? g("span", {
staticClass: "item-tools"
}, [a.renameEnable && !a.uploadInstance.getSettings().readonly ? g("span", {
staticClass: "upload-icon icon-rename",
attrs: {
title: "\u91CD\u547D\u540D"
},
on: {
click: function(F) {
return a.rename();
}
}
}) : a._e(), a.viewEnable ? g("span", {
staticClass: "upload-icon icon-view",
attrs: {
title: "\u67E5\u770B"
},
on: {
click: function(F) {
return a.view();
}
}
}) : a._e(), a.saveEnable ? g("span", {
staticClass: "upload-icon icon-download",
attrs: {
title: "\u4FDD\u5B58"
},
on: {
click: function(F) {
return a.save();
}
}
}) : a._e(), a.uploadInstance.getSettings().readonly ? a._e() : g("span", {
staticClass: "upload-icon icon-remove",
attrs: {
title: "\u5220\u9664"
},
on: {
click: function(F) {
return a.remove();
}
}
})]) : a._e(), a._t("default", null, {
selectedFile: a.selectedFile,
rename: a.renderData.rename,
funs: {
setRenameInputRef: a.setRenameInputRef,
renameKeydown: a.renameKeydown,
renameDone: a.renameDone
},
loadingInfo: a.loadingInfo,
loadingShow: a.loadingShow
}), (n = a.selectedFile) !== null && n !== void 0 && n.paused ? g("div", {
staticClass: "item-sub sub-paused"
}, [a._v("\u6682\u505C")]) : a._e(), (o = a.selectedFile) !== null && o !== void 0 && o.done && !a.uploadInstance.getSettings().readonly ? g("div", {
staticClass: "item-sub sub-done"
}, [a._v(" \u5B8C\u6210 ")]) : a._e(), (u = a.selectedFile) !== null && u !== void 0 && u.error ? g("div", {
staticClass: "item-sub sub-error"
}, [a._v("\u9519\u8BEF")]) : a._e()], 2)]);
}, Ee = [];
const J = {};
var ve = /* @__PURE__ */ k(
we,
Ce,
Ee,
!1,
_e,
null,
null,
null
);
function _e(s) {
for (let e in J)
this[e] = J[e];
}
const oe = /* @__PURE__ */ function() {
return ve.exports;
}(), Se = S({
name: "CardIndex",
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Layout: Card Index Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var ke = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return t("div", {
staticClass: "upload-container independent"
}, [s._t("uploadContainer"), t("div", {
staticClass: "upload-list"
}, [s._t("listContainer")], 2)], 2);
}, $e = [];
const G = {};
var Ie = /* @__PURE__ */ k(
Se,
ke,
$e,
!1,
Ae,
"38de204e",
null,
null
);
function Ae(s) {
for (let e in G)
this[e] = G[e];
}
const Be = /* @__PURE__ */ function() {
return Ie.exports;
}(), Le = S({
name: "DetailedlyIndex",
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Layout: Detailedly Index Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var Pe = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return t("div", {
staticClass: "upload-container independent"
}, [s._t("uploadContainer"), t("div", {
staticClass: "upload-list"
}, [s._t("listContainer")], 2)], 2);
}, Ue = [];
const V = {};
var xe = /* @__PURE__ */ k(
Le,
Pe,
Ue,
!1,
Me,
"167ebfac",
null,
null
);
function Me(s) {
for (let e in V)
this[e] = V[e];
}
const Re = /* @__PURE__ */ function() {
return xe.exports;
}(), Te = S({
name: "LayoutIndex",
components: {
CardIndex: Be,
DetailedlyIndex: Re
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
data() {
return {
renderData: {
loading: !0,
currentThemeIndex: null
}
};
},
created() {
const s = (e) => {
switch (this.renderData.loading = !0, e) {
case x.\u5361\u7247:
this.renderData.currentThemeIndex = "CardIndex";
break;
case x.\u6E05\u5355:
this.renderData.currentThemeIndex = "DetailedlyIndex";
break;
}
this.renderData.loading = !1, this.uploadInstance.getSettings().debug && console.debug("Layout: Index Component(vue2) \u5DF2\u53D8\u66F4");
};
this.uploadInstance.registerLayoutChanged(s), s(this.uploadInstance.getSettings().layout), this.uploadInstance.getSettings().debug && console.debug("Layout: Index Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var He = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return s.renderData.loading ? s._e() : t("div", [t(s.renderData.currentThemeIndex, {
tag: "component",
scopedSlots: s._u([{
key: "uploadContainer",
fn: function() {
return [s._t("uploadContainer")];
},
proxy: !0
}, {
key: "listContainer",
fn: function() {
return [s._t("listContainer")];
},
proxy: !0
}], null, !0)
})], 1);
}, Oe = [];
const Z = {};
var je = /* @__PURE__ */ k(
Te,
He,
Oe,
!1,
ze,
null,
null,
null
);
function ze(s) {
for (let e in Z)
this[e] = Z[e];
}
const le = /* @__PURE__ */ function() {
return je.exports;
}(), We = S({
name: "CardInfo",
props: {
slotProps: {
type: Object,
require: !0
}
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
},
lodingStyle() {
var s, e, t;
return ((s = this.slotProps) != null && s.selectedFile.checking ? [
this.uploadInstance.getGradientStyleObject(
"conic",
"rgba(255, 236, 201, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []).concat(
(e = this.slotProps) != null && e.selectedFile.uploading ? [
this.uploadInstance.getGradientStyleObject(
"conic",
"rgba(144, 206, 255, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []
).concat(
(t = this.slotProps) != null && t.selectedFile.paused ? [
this.uploadInstance.getGradientStyleObject(
"conic",
"rgba(158, 158, 158, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []
);
}
},
created() {
this.$nextTick(() => {
var s;
(s = this.slotProps) == null || s.funs.setRenameInputRef(
this.$refs.renameInputRef
);
}), this.uploadInstance.getSettings().debug && console.debug("Layout: Card Info Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var Qe = function() {
var s, e, t, n, o, u, a, p = this, g = p.$createElement, F = p._self._c || g;
return F("div", [F("div", {
staticClass: "item-info"
}, [(s = p.slotProps) !== null && s !== void 0 && s.rename.active ? p._e() : F("span", {
staticClass: "single-text-omitted item-name",
attrs: {
title: ((e = p.slotProps) === null || e === void 0 ? void 0 : e.selectedFile.fileType) + `\r
` + ((t = p.slotProps) === null || t === void 0 ? void 0 : t.selectedFile.size) + `\r
` + ((n = p.slotProps) === null || n === void 0 ? void 0 : n.selectedFile.fullname())
},
domProps: {
innerHTML: p._s((o = p.slotProps) === null || o === void 0 ? void 0 : o.selectedFile.fullname())
}
}), (u = p.slotProps) !== null && u !== void 0 && u.rename.active ? F("input", {
directives: [{
name: "model",
rawName: "v-model",
value: p.slotProps.rename.value,
expression: "slotProps.rename.value"
}],
ref: "renameInputRef",
staticClass: "item-rename-input",
attrs: {
type: "text"
},
domProps: {
value: p.slotProps.rename.value
},
on: {
keydown: function(y) {
var m;
(m = p.slotProps) === null || m === void 0 || m.funs.renameKeydown(y);
},
blur: function(y) {
var m;
(m = p.slotProps) === null || m === void 0 || m.funs.renameDone();
},
input: function(y) {
y.target.composing || p.$set(p.slotProps.rename, "value", y.target.value);
}
}
}) : p._e()]), (a = p.slotProps) !== null && a !== void 0 && a.loadingShow ? F("div", {
staticClass: "item-loading",
style: p.lodingStyle,
attrs: {
title: p.slotProps.loadingInfo
}
}) : p._e()]);
}, Ne = [];
const ee = {};
var Xe = /* @__PURE__ */ k(
We,
Qe,
Ne,
!1,
Ye,
null,
null,
null
);
function Ye(s) {
for (let e in ee)
this[e] = ee[e];
}
const qe = /* @__PURE__ */ function() {
return Xe.exports;
}(), Ke = S({
name: "DetailedlyInfo",
props: {
slotProps: {
type: Object,
require: !0
}
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
},
lodingStyle() {
var s, e, t;
return ((s = this.slotProps) != null && s.selectedFile.checking ? [
this.uploadInstance.getGradientStyleObject(
"linear",
"rgba(255, 236, 201, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []).concat(
(e = this.slotProps) != null && e.selectedFile.uploading ? [
this.uploadInstance.getGradientStyleObject(
"linear",
"rgba(144, 206, 255, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []
).concat(
(t = this.slotProps) != null && t.selectedFile.paused ? [
this.uploadInstance.getGradientStyleObject(
"linear",
"rgba(158, 158, 158, 0.5)",
this.slotProps.selectedFile.percent,
this.slotProps.selectedFile.virtualPercent
)[0]
] : []
);
}
},
created() {
this.$nextTick(() => {
var s;
(s = this.slotProps) == null || s.funs.setRenameInputRef(
this.$refs.renameInputRef
);
}), this.uploadInstance.getSettings().debug && console.debug("Layout: Detailedly Info Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var Je = function() {
var s, e, t, n, o, u, a, p, g, F = this, y = F.$createElement, m = F._self._c || y;
return m("div", [m("div", {
staticClass: "item-info"
}, [m("span", {
staticClass: "single-text-omitted item-name"
}, [F._v(" \u540D\u79F0\uFF1A"), (s = F.slotProps) !== null && s !== void 0 && s.rename.active ? F._e() : m("span", {
attrs: {
title: (e = F.slotProps) === null || e === void 0 ? void 0 : e.selectedFile.fullname()
},
domProps: {
innerHTML: F._s((t = F.slotProps) === null || t === void 0 ? void 0 : t.selectedFile.fullname())
}
}), (n = F.slotProps) !== null && n !== void 0 && n.rename.value ? m("input", {
directives: [{
name: "model",
rawName: "v-model",
value: F.slotProps.selectedFile.newName,
expression: "slotProps.selectedFile.newName"
}],
ref: "renameInputRef",
staticClass: "item-rename-input",
attrs: {
type: "text"
},
domProps: {
value: F.slotProps.selectedFile.newName
},
on: {
keydown: function(b) {
var D;
(D = F.slotProps) === null || D === void 0 || D.funs.renameKeydown(b);
},
blur: function(b) {
var D;
(D = F.slotProps) === null || D === void 0 || D.funs.renameDone();
},
input: function(b) {
b.target.composing || F.$set(F.slotProps.selectedFile, "newName", b.target.value);
}
}
}) : F._e()]), m("span", {
staticClass: "single-text-omitted item-size"
}, [F._v(" \u5927\u5C0F\uFF1A"), m("span", {
attrs: {
title: (o = F.slotProps) === null || o === void 0 ? void 0 : o.selectedFile.size
},
domProps: {
innerHTML: F._s((u = F.slotProps) === null || u === void 0 ? void 0 : u.selectedFile.size)
}
})]), m("span", {
staticClass: "single-text-omitted item-filetype"
}, [F._v(" \u7C7B\u578B\uFF1A"), m("span", {
attrs: {
title: (a = F.slotProps) === null || a === void 0 ? void 0 : a.selectedFile.fileType
},
domProps: {
innerHTML: F._s((p = F.slotProps) === null || p === void 0 ? void 0 : p.selectedFile.fileType)
}
})])]), (g = F.slotProps) !== null && g !== void 0 && g.loadingShow ? m("div", {
staticClass: "item-loading",
style: F.lodingStyle,
attrs: {
title: F.slotProps.loadingInfo
}
}) : F._e()]);
}, Ge = [];
const te = {};
var Ve = /* @__PURE__ */ k(
Ke,
Je,
Ge,
!1,
Ze,
null,
null,
null
);
function Ze(s) {
for (let e in te)
this[e] = te[e];
}
const et = /* @__PURE__ */ function() {
return Ve.exports;
}(), tt = S({
name: "LayoutInfo",
components: {
CardInfo: qe,
DetailedlyInfo: et
},
props: {
slotProps: {
type: Object,
require: !0
}
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
data() {
return {
renderData: {
loading: !0,
currentThemeInfo: null
}
};
},
created() {
((e) => {
switch (this.renderData.loading = !0, this.uploadInstance.getSettings().layout) {
case x.\u5361\u7247:
this.renderData.currentThemeInfo = "CardInfo";
break;
case x.\u6E05\u5355:
this.renderData.currentThemeInfo = "DetailedlyInfo";
break;
}
this.renderData.loading = !1, this.uploadInstance.getSettings().debug && console.debug("Layout: Info Component(vue2) \u5DF2\u53D8\u66F4");
})(), this.uploadInstance.getSettings().debug && console.debug("Layout: Info Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var st = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return s.renderData.loading ? s._e() : t("div", [t(s.renderData.currentThemeInfo, {
tag: "component",
attrs: {
slotProps: s.slotProps
}
})], 1);
}, nt = [];
const se = {};
var it = /* @__PURE__ */ k(
tt,
st,
nt,
!1,
rt,
null,
null,
null
);
function rt(s) {
for (let e in se)
this[e] = se[e];
}
const ce = /* @__PURE__ */ function() {
return it.exports;
}(), at = S({
name: "SingleUpload",
components: {
FileInput: ue,
SelectedFileInfo: oe,
LayoutIndex: le,
LayoutInfo: ce
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Piece: Single Upload Component(vue2) \u5DF2\u52A0\u8F7D");
}
});
var ut = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return t("layout-index", {
scopedSlots: s._u([s.uploadInstance.getSettings().readonly ? null : {
key: "uploadContainer",
fn: function() {
return [s.uploadInstance.anyFile() ? s._e() : t("file-input", {
staticClass: "upload-box-container single",
attrs: {
title: s.uploadInstance.getConfig().explain
}
}, [t("p", {
staticClass: "upload-icon icon-select-file"
})])];
},
proxy: !0
}, {
key: "listContainer",
fn: function() {
return s._l(s.uploadInstance.getSelectedFileSortMap().size, function(n) {
return t("selected-file-info", {
key: n,
attrs: {
selectedFile: s.uploadInstance.getSelectedFile(n)
},
scopedSlots: s._u([{
key: "default",
fn: function(o) {
return [t("layout-info", {
staticClass: "item-info-container",
attrs: {
slotProps: o
}
})];
}
}], null, !0)
});
});
},
proxy: !0
}], null, !0)
});
}, ot = [];
const ne = {};
var lt = /* @__PURE__ */ k(
at,
ut,
ot,
!1,
ct,
null,
null,
null
);
function ct(s) {
for (let e in ne)
this[e] = ne[e];
}
const dt = /* @__PURE__ */ function() {
return lt.exports;
}(), ht = S({
name: "DropFileInput",
components: {
FileInput: ue
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Piece: Drop File Input Component(vue2) \u5DF2\u52A0\u8F7D");
},
methods: {
allowDrop(s) {
s.preventDefault();
},
dropFile(s) {
if (s.preventDefault(), s.dataTransfer)
for (let e = 0; e < s.dataTransfer.files.length; e++)
this.uploadInstance.append(s.dataTransfer.files[e]);
}
}
});
var pt = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return t("div", {
class: s.uploadInstance.getSelectCLass(),
attrs: {
title: s.uploadInstance.getSelectFileAlarmInfo()
},
on: {
drop: s.dropFile,
dragover: s.allowDrop
}
}, [t("file-input", [s._t("default")], 2)], 1);
}, gt = [];
const ie = {};
var ft = /* @__PURE__ */ k(
ht,
pt,
gt,
!1,
Ft,
null,
null,
null
);
function Ft(s) {
for (let e in ie)
this[e] = ie[e];
}
const mt = /* @__PURE__ */ function() {
return ft.exports;
}();
class j {
static getByExtension(e) {
switch (e) {
case ".webp":
case ".jpg":
case ".png":
case ".ioc":
case ".bmp":
case ".gif":
case ".tif":
case ".tga":
case ".jpeg":
return w.\u56FE\u7247;
case ".mp2":
case ".ac3":
case ".mp3":
case ".m4a":
case ".m4r":
case ".mmf":
case ".ogg":
case ".amr":
case ".aac":
case ".vqf":
case ".wma":
case ".ape":
case ".wav":
case ".flac":
case ".cda":
case ".dts":
return w.\u97F3\u9891;
case ".swf":
case ".3gp":
case ".3g2":
case ".mp4":
case ".mpeg":
case ".mpg":
case ".dat":
case ".mov":
case ".vob":
case ".qt":
case ".rm":
case ".asf":
case ".avi":
case ".navi":
case ".divx":
case ".flv":
case ".f4v":
case ".qsv":
case ".wmv":
case ".mkv":
case ".rmvb":
case ".webm":
return w.\u89C6\u9891;
case ".xls":
case ".xlsx":
case ".csv":
return w.\u7535\u5B50\u8868\u683C;
case ".pdf":
case ".doc":
case ".docx":
return w.\u7535\u5B50\u6587\u6863;
case ".txt":
case ".js":
case ".css":
case ".cs":
case ".html":
case ".vue":
case ".ts":
case ".xml":
case ".json":
return w.\u6587\u672C\u6587\u4EF6;
case ".zip":
case ".rar":
case ".7z":
return w.\u538B\u7F29\u5305;
default:
return w.\u672A\u77E5;
}
}
static getByMIME(e) {
const t = e.toLocaleLowerCase();
if (t.indexOf("image/", 0) != -1)
return w.\u56FE\u7247;
if (t.indexOf("audio/", 0) != -1)
return w.\u97F3\u9891;
if (t.indexOf("video/", 0) != -1)
return w.\u89C6\u9891;
if (t.indexOf("text/", 0) != -1)
return w.\u6587\u672C\u6587\u4EF6;
switch (e) {
case "application/ogg":
return w.\u97F3\u9891;
case "application/mp4":
return w.\u89C6\u9891;
case "application/vnd.ms-excel":
case "vnd.openxmlformats-officedocument.spreadsheetml.sheet":
return w.\u7535\u5B50\u8868\u683C;
case "application/pdf":
case "application/msword":
case "application/vnd.openxmlformats-officedocument.wordprocessingml.document":
return w.\u7535\u5B50\u6587\u6863;
case "application/json":
case "application/javascript":
return w.\u6587\u672C\u6587\u4EF6;
case "application/x-tar":
case "application/zip":
case "application/x-compressed":
case "application/x-zip-compressed":
return w.\u538B\u7F29\u5305;
default:
return w.\u672A\u77E5;
}
}
}
class Q {
constructor(e) {
c(this, "rawIndex");
c(this, "name");
c(this, "newName");
c(this, "extension");
c(this, "fullname", () => {
var e, t;
return `${(e = this.name) != null ? e : ""}${(t = this.extension) != null ? t : ""}`;
});
c(this, "extensionLower");
c(this, "size", "");
c(this, "fileType", w.\u672A\u77E5);
c(this, "thumbnail", "/filetypes/empty.png");
c(this, "class", []);
c(this, "checking", !1);
c(this, "checked", !1);
c(this, "uploading", !1);
c(this, "uploaded", !1);
c(this, "done", !1);
c(this, "reTry", 0);
c(this, "error", !1);
c(this, "errorMessage");
c(this, "percent", 0);
c(this, "virtualPercent", 0);
c(this, "percentBeforPaused", 0);
c(this, "virtualPercentBeforPaused", 0);
c(this, "paused", !1);
c(this, "canceled", !1);
c(this, "token");
c(this, "echo", !1);
var n;
const t = e.name.lastIndexOf(".");
this.name = e.name.substring(0, t), this.extension = e.name.substring(t), this.extensionLower = (n = this.extension) == null ? void 0 : n.toLowerCase(), this.fileType = e.type ? j.getByMIME(e.type) : j.getByExtension(this.extension);
}
}
class H {
constructor() {
c(this, "containerEl");
c(this, "el");
c(this, "key", -1);
c(this, "els");
c(this, "isMobile", !1);
c(this, "flag", !1);
c(this, "x", 0);
c(this, "y", 0);
c(this, "currentX", 0);
c(this, "currentY", 0);
c(this, "offsetX", 0);
c(this, "offsetY", 0);
c(this, "scrollX", 0);
c(this, "scrollY", 0);
c(this, "transX", 0);
c(this, "transY", 0);
c(this, "lastTransX", 0);
c(this, "lastTransY", 0);
c(this, "zIndex", "");
c(this, "position", "");
c(this, "transform", "");
c(this, "transLate", 1);
c(this, "restoreError", [20, 10]);
c(this, "mouseMove");
c(this, "scroll");
}
moving(e, t) {
this.currentX = e, this.currentY = t, this.checkRestore() ? (this.transX = 0, this.transY = 0, this.el.style.transform = this.transform) : (this.transX = this.currentX - this.x + this.scrollX + this.offsetX, this.transY = this.currentY - this.y + this.scrollY + this.offsetY, (Math.abs(this.transX - this.lastTransX) >= this.transLate || Math.abs(this.transY - this.lastTransY) >= this.transLate) && (this.el.style.transform = `translate(${this.transX}px, ${this.transY}px)`)), this.lastTransX = this.transX, this.lastTransY = this.transY;
}
checkRestore() {
return H.equalError(this.x, this.currentX, this.restoreError[0]) && H.equalError(this.y, this.currentY, this.restoreError[1]);
}
static equalError(e, t, n) {
return t + n >= e && t - n <= e;
}
static getInstance(e, t, n, o) {
let u = new H();
return u.els = t, u.el = t.get(n), u.key = n, u.containerEl = e, u.isMobile = o, u;
}
start(e, t, n) {
this.flag = !0, this.currentX = e, this.currentY = t, this.save(), this.el.style.zIndex = "999";
let o = !1;
this.mouseMove = (u) => {
if (!this.flag || o)
return;
const a = this.isMobile ? u.targetTouches[0].clientX : u.clientX, p = this.isMobile ? u.targetTouches[0].clientY : u.clientY;
if (u.preventDefault(), o = !0, this.moving(a, p), n && this.els) {
let g = !1;
this.els.forEach((F, y) => {
if (y == this.key)
return;
const m = this.el.offsetTop + this.transY, b = this.el.offsetLeft + this.transX;
m > F.offsetTop && m < F.offsetTop + F.offsetHeight && b > F.offsetLeft && b < F.offsetLeft + F.offsetWidth && (n(y, a, p), g = !0);
}), g || n(-1, a, p);
}
o = !1;
}, this.isMobile ? this.containerEl.addEventListener("touchmove", this.mouseMove) : this.containerEl.addEventListener("mousemove", this.mouseMove), this.scroll = (u) => {
this.scrollX = this.containerEl.scrollLeft, this.scrollY = this.containerEl.scrollTop;
}, this.containerEl.addEventListener("scroll", this.scroll);
}
offset(e, t) {
this.offsetX = e, this.offsetY = t;
}
save() {
this.x = this.currentX, this.y = this.currentY, this.zIndex = this.el.style.zIndex, this.position = this.el.style.position, this.transform = this.el.style.transform;
}
restore() {
this.flag = !1, this.x = this.currentX, this.y = this.currentY, this.el.style.zIndex = this.zIndex, this.el.style.position = this.position, this.el.style.transform = this.transform;
}
end(e) {
e && this.restore(), this.isMobile ? this.containerEl.removeEventListener("touchmove", this.mouseMove) : this.containerEl.removeEventListener("mousemove", this.mouseMove), this.containerEl.removeEventListener("scroll", this.scroll);
}
}
const bt = S({
name: "MultipleUpload",
components: {
DropFileInput: mt,
SelectedFileInfo: oe,
LayoutIndex: le,
LayoutInfo: ce,
SelectedFile: Q
},
inject: [
"upload"
],
computed: {
uploadInstance() {
return this.upload();
}
},
data() {
return {
renderData: {
scrollLock: !1,
readyDraggingSortKey: null,
currentDraggingSortKey: null,
lastDraggingSortKey: null,
errors: [],
containerRefMap: /* @__PURE__ */ new Map(),
drag4sort: {
startTick: null,
changeTick: null,
draggingHelper: null
},
selectedFileSortMapSize: 0
}
};
},
created() {
this.uploadInstance.getSettings().debug && console.debug("Piece: Multiple Upload Component(vue2) \u5DF2\u52A0\u8F7D");
},
mounted() {
this.uploadInstance.registerSelectedFileSortMapChanged(
(e) => {
this.renderData.selectedFileSortMapSize = e.size;
}
), this.uploadInstance.registerSelectedFileListChanged(this.scroll);
const s = (e) => {
this.renderData.errors.push(e.message), setTimeout(() => {
this.renderData.errors.shift();
}, 5e3);
};
this.uploadInstance.getSettings().alertErrorInfo && this.uploadInstance.registerAlertError(s);
},
methods: {
listContainerRef() {
return this.$refs.listContainerRef.$el;
},
scroll(s) {
const e = this.listContainerRef();
this.renderData.scrollLock || s.length == 0 || !e || this.$nextTick(() => {
let t = null, n = !1;
for (let u = 0; u < s.length; u++) {
let a = s[u];
if (!n && a.checking && (n = !0, t = this.renderData.containerRefMap.get(u + 1)), a.uploading) {
t = this.renderData.containerRefMap.get(u + 1);
break;
}
}
if (!t)
return;
const o = t.offsetTop - e.offsetTop - 20;
o < 0 || o == e.scrollTop || (e.scrollTop = o);
});
},
setContainerRef(s, e) {
!e || this.renderData.containerRefMap.set(s, e);
},
containerMouseDown(s, e, t) {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u6309\u4E0B\u9F20\u6807\u7684\u4E8B\u4EF6, sortKey: " + s
);
const n = t ? e.targetTouches[0].clientX : e.clientX, o = t ? e.targetTouches[0].clientY : e.clientY;
this.ready2start(s, n, o);
},
containerMouseUp(s, e, t) {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u677E\u5F00\u9F20\u6807\u7684\u4E8B\u4EF6, sortKey: " + s
), this.end();
},
containerMouseEnter(s) {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u8FDB\u5165\u76EE\u6807\u8303\u56F4\u7684\u4E8B\u4EF6, targetKey: " + s
), this.renderData.lastDraggingSortKey = s, this.renderData.currentDraggingSortKey !== this.renderData.lastDraggingSortKey && (this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u5EF6\u65F6\u91CD\u65B0\u6392\u5E8F, sortKey: " + s
), this.renderData.drag4sort.changeTick && clearTimeout(this.renderData.drag4sort.changeTick), this.renderData.drag4sort.changeTick = setTimeout(
this.changeSort,
this.uploadInstance.getSettings().dragChangePositionTime
));
},
changeSort() {
const s = this.renderData.currentDraggingSortKey, e = this.renderData.lastDraggingSortKey;
this.uploadInstance.changeSort(s, e);
const t = this.renderData.containerRefMap.get(s);
if (s > e)
for (let n = s; n > e; n--)
setInterval(() => {
}, 100), this.renderData.containerRefMap.set(
n,
this.renderData.containerRefMap.get(n - 1)
);
else
for (let n = s; n < e; n++)
this.renderData.containerRefMap.set(
n,
this.renderData.containerRefMap.get(n + 1)
);
this.renderData.containerRefMap.set(e, t), this.end();
},
containerMouseLeave() {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u79BB\u5F00\u76EE\u6807\u8303\u56F4\u7684\u4E8B\u4EF6"
), this.cancelChange();
},
ready2start(s, e, t) {
if (!this.uploadInstance.getSettings().enableDrag) {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u672A\u542F\u7528\u62D6\u52A8\u6392\u5E8F\u529F\u80FD"
);
return;
}
this.uploadInstance.getSelectedFileList(!1).length <= 1 || (this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u5EF6\u65F6\u5F00\u542F\u62D6\u52A8\u529F\u80FD, sortKey: " + s
), this.renderData.drag4sort.startTick && clearTimeout(this.renderData.drag4sort.startTick), this.renderData.drag4sort.startTick = setTimeout(() => {
this.renderData.readyDraggingSortKey = s, this.renderData.drag4sort.startTick = setTimeout(() => {
!this.listContainerRef() || (this.renderData.readyDraggingSortKey = null, this.renderData.currentDraggingSortKey = s, this.renderData.drag4sort.draggingHelper = H.getInstance(
this.listContainerRef(),
this.renderData.containerRefMap,
this.renderData.currentDraggingSortKey,
this.uploadInstance.getSettings().isMobile
), this.renderData.drag4sort.draggingHelper.start(
e,
t,
(n, o, u) => {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u9F20\u6807\u79FB\u52A8\u4E8B\u4EF6, sortKey: " + s + ", clientX: " + o + ", clientY: " + u + ", targetKey: " + n
), n == -1 ? this.containerMouseLeave() : this.containerMouseEnter(n);
}
));
}, this.uploadInstance.getSettings().dragPreparationTime);
}, 500));
},
cancelChange() {
this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u53D6\u6D88\u91CD\u65B0\u6392\u5E8F"
), this.renderData.drag4sort.changeTick && clearTimeout(this.renderData.drag4sort.changeTick), this.renderData.lastDraggingSortKey = null;
},
end() {
this.renderData.drag4sort.startTick && clearTimeout(this.renderData.drag4sort.startTick), this.renderData.drag4sort.changeTick && clearTimeout(this.renderData.drag4sort.changeTick), this.renderData.readyDraggingSortKey = null, this.renderData.drag4sort.draggingHelper && (this.uploadInstance.getSettings().debug && console.debug(
"Piece: Multiple Upload Component(vue2) \u7ED3\u675F\u62D6\u52A8\u5E76\u590D\u539F\u5BB9\u5668\u4F4D\u7F6E"
), this.renderData.drag4sort.draggingHelper.end(!0), this.renderData.drag4sort.draggingHelper = null, this.renderData.containerRefMap.forEach(
(s, e) => {
e !== this.renderData.lastDraggingSortKey && (s.style.zIndex = "");
}
), this.renderData.lastDraggingSortKey = null, this.renderData.currentDraggingSortKey = null);
}
}
});
var yt = function() {
var s = this, e = s.$createElement, t = s._self._c || e;
return t("layout-index", {
scopedSlots: s._u([s.uploadInstance.getSettings().readonly ? null : {
key: "uploadContainer",
fn: function() {
return [t("drop-file-input", {
staticClass: "upload-box-container"
}, [t("p", {
staticClass: "upload-icon icon-inbox"
}), t("p", {
staticClass: "upload-text",
domProps: {
innerHTML: s._s(s.uploadInstance.getConfig().explain)
}
}), t("p", {
staticClass: "upload-hint",
domProps: {
innerHTML: s._s(s.uploadInstance.getSettings().tip)
}
}), t("div", {
staticClass: "upload-error-list pretty-scrollbar"
}, s._l(s.renderData.errors, function(n, o) {
return t("p", {
key: o,
staticClass: "error-info"
}, [s._v(" " + s._s(n) + " ")]);
}), 0)])];
},
proxy: !0
}, {
key: "listContainer",
fn: function() {
return [t("TransitionGroup", {
ref: "listContainerRef",
staticClass: "scroll-container pretty-scrollbar",
attrs: {
tag: "div",
name: "fade"
},
on: {
mouseenter: function(n) {
s.renderData.scrollLock = !0;
},
mouseleave: function(n) {
s.renderData.scrollLock = !1;
}
}
}, s._l(s.renderData.selectedFileSortMapSize, function(n) {
return t("selected-file-info", {
key: s.uploadInstance.getSelectedFileSortMap().get(n),
attrs: {
selectedFile: s.uploadInstance.getSelectedFile(n),
readyDrag: s.renderData.readyDraggingSortKey === n,
startDrag: s.renderData.currentDraggingSortKey !== null,
dragging: s.renderData.currentDraggingSortKey === n,
dragover: s.renderData.lastDraggingSortKey === n && s.renderData.currentDraggingSortKey !== n
},
on: {
setContainerRef: function(o) {
return s.setContainerRef(n, o);
},
mouseDown: function(o) {
return s.containerMouseDown(n, o, !1);
},
mouseUp: function(o) {
return s.containerMouseUp(n, o, !1);
}
},
nativeOn: {
touchstart: function(o) {
return o.preventDefault(), function(u) {
return s.containerMouseDown(n, u, !0);
}.apply(null, arguments);
},
touchend: function(o) {