打包地址
This commit is contained in:
zoujiandong
+335
@@ -0,0 +1,335 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
name: "u-upload",
|
||||
mixins: [common_vendor.mpMixin, common_vendor.mixin, common_vendor.mixinUpload, common_vendor.props$16],
|
||||
data() {
|
||||
return {
|
||||
lists: [],
|
||||
isInCount: true
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
// 监听文件列表的变化，重新整理内部数据
|
||||
fileList: {
|
||||
handler() {
|
||||
this.formatFileList();
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
deletable(newVal) {
|
||||
this.formatFileList();
|
||||
},
|
||||
maxCount(newVal) {
|
||||
this.formatFileList();
|
||||
},
|
||||
accept(newVal) {
|
||||
this.formatFileList();
|
||||
}
|
||||
},
|
||||
emits: ["error", "beforeRead", "oversize", "afterRead", "delete", "clickPreview"],
|
||||
methods: {
|
||||
addUnit: common_vendor.addUnit,
|
||||
addStyle: common_vendor.addStyle,
|
||||
formatFileList() {
|
||||
const {
|
||||
fileList = [],
|
||||
maxCount
|
||||
} = this;
|
||||
const lists = fileList.map(
|
||||
(item) => Object.assign(Object.assign({}, item), {
|
||||
// 如果item.url为本地选择的blob文件的话，无法判断其为video还是image，此处优先通过accept做判断处理
|
||||
isImage: this.accept === "image" || common_vendor.test.image(item.url || item.thumb),
|
||||
isVideo: this.accept === "video" || common_vendor.test.video(item.url || item.thumb),
|
||||
deletable: typeof item.deletable === "boolean" ? item.deletable : this.deletable
|
||||
})
|
||||
);
|
||||
this.lists = lists;
|
||||
this.isInCount = lists.length < maxCount;
|
||||
},
|
||||
chooseFile() {
|
||||
const {
|
||||
maxCount,
|
||||
multiple,
|
||||
lists,
|
||||
disabled
|
||||
} = this;
|
||||
if (disabled)
|
||||
return;
|
||||
let capture;
|
||||
try {
|
||||
capture = common_vendor.test.array(this.capture) ? this.capture : this.capture.split(",");
|
||||
} catch (e) {
|
||||
capture = [];
|
||||
}
|
||||
common_vendor.chooseFile(
|
||||
Object.assign({
|
||||
accept: this.accept,
|
||||
extension: this.extension,
|
||||
multiple: this.multiple,
|
||||
capture,
|
||||
compressed: this.compressed,
|
||||
maxDuration: this.maxDuration,
|
||||
sizeType: this.sizeType,
|
||||
camera: this.camera
|
||||
}, {
|
||||
maxCount: maxCount - lists.length
|
||||
})
|
||||
).then((res) => {
|
||||
this.onBeforeRead(multiple ? res : res[0]);
|
||||
}).catch((error) => {
|
||||
this.$emit("error", error);
|
||||
});
|
||||
},
|
||||
// 文件读取之前
|
||||
onBeforeRead(file) {
|
||||
const {
|
||||
beforeRead,
|
||||
useBeforeRead
|
||||
} = this;
|
||||
let res = true;
|
||||
if (common_vendor.test.func(beforeRead)) {
|
||||
res = beforeRead(file, this.getDetail());
|
||||
}
|
||||
if (useBeforeRead) {
|
||||
res = new Promise((resolve, reject) => {
|
||||
this.$emit(
|
||||
"beforeRead",
|
||||
Object.assign(Object.assign({
|
||||
file
|
||||
}, this.getDetail()), {
|
||||
callback: (ok) => {
|
||||
ok ? resolve() : reject();
|
||||
}
|
||||
})
|
||||
);
|
||||
});
|
||||
}
|
||||
if (!res) {
|
||||
return;
|
||||
}
|
||||
if (common_vendor.test.promise(res)) {
|
||||
res.then((data) => this.onAfterRead(data || file));
|
||||
} else {
|
||||
this.onAfterRead(file);
|
||||
}
|
||||
},
|
||||
getDetail(index) {
|
||||
return {
|
||||
name: this.name,
|
||||
index: index == null ? this.fileList.length : index
|
||||
};
|
||||
},
|
||||
onAfterRead(file) {
|
||||
const {
|
||||
maxSize,
|
||||
afterRead
|
||||
} = this;
|
||||
const oversize = Array.isArray(file) ? file.some((item) => item.size > maxSize) : file.size > maxSize;
|
||||
if (oversize) {
|
||||
this.$emit("oversize", Object.assign({
|
||||
file
|
||||
}, this.getDetail()));
|
||||
return;
|
||||
}
|
||||
if (typeof afterRead === "function") {
|
||||
afterRead(file, this.getDetail());
|
||||
}
|
||||
this.$emit("afterRead", Object.assign({
|
||||
file
|
||||
}, this.getDetail()));
|
||||
},
|
||||
deleteItem(index) {
|
||||
this.$emit(
|
||||
"delete",
|
||||
Object.assign(Object.assign({}, this.getDetail(index)), {
|
||||
file: this.fileList[index]
|
||||
})
|
||||
);
|
||||
},
|
||||
// 预览图片
|
||||
onPreviewImage(previewItem, index) {
|
||||
if (!previewItem.isImage || !this.previewFullImage)
|
||||
return;
|
||||
let current = 0;
|
||||
const urls = [];
|
||||
let imageIndex = 0;
|
||||
for (var i = 0; i < this.lists.length; i++) {
|
||||
const item = this.lists[i];
|
||||
if (item.isImage || item.type && item.type === "image") {
|
||||
urls.push(item.url || item.thumb);
|
||||
if (i === index) {
|
||||
current = imageIndex;
|
||||
}
|
||||
imageIndex += 1;
|
||||
}
|
||||
}
|
||||
if (urls.length < 1) {
|
||||
return;
|
||||
}
|
||||
common_vendor.index.previewImage({
|
||||
urls,
|
||||
current,
|
||||
fail() {
|
||||
common_vendor.toast("预览图片失败");
|
||||
}
|
||||
});
|
||||
},
|
||||
onPreviewVideo(index) {
|
||||
if (!this.previewFullImage)
|
||||
return;
|
||||
let current = 0;
|
||||
const sources = [];
|
||||
let videoIndex = 0;
|
||||
for (var i = 0; i < this.lists.length; i++) {
|
||||
const item = this.lists[i];
|
||||
if (item.isVideo || item.type && item.type === "video") {
|
||||
sources.push(Object.assign(Object.assign({}, item), {
|
||||
type: "video"
|
||||
}));
|
||||
if (i === index) {
|
||||
current = videoIndex;
|
||||
}
|
||||
videoIndex += 1;
|
||||
}
|
||||
}
|
||||
if (sources.length < 1) {
|
||||
return;
|
||||
}
|
||||
common_vendor.wx$1.previewMedia({
|
||||
sources,
|
||||
current,
|
||||
fail() {
|
||||
common_vendor.toast("预览视频失败");
|
||||
}
|
||||
});
|
||||
},
|
||||
onClickPreview(item, index) {
|
||||
if (!this.previewFullImage)
|
||||
return;
|
||||
switch (item.type) {
|
||||
case "video":
|
||||
this.onPreviewVideo(index);
|
||||
break;
|
||||
}
|
||||
this.$emit(
|
||||
"clickPreview",
|
||||
Object.assign(Object.assign({}, item), this.getDetail(index))
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
|
||||
const _easycom_u_loading_icon2 = common_vendor.resolveComponent("u-loading-icon");
|
||||
(_easycom_u_icon2 + _easycom_u_loading_icon2)();
|
||||
}
|
||||
const _easycom_u_icon = () => "../u-icon/u-icon.js";
|
||||
const _easycom_u_loading_icon = () => "../u-loading-icon/u-loading-icon.js";
|
||||
if (!Math) {
|
||||
(_easycom_u_icon + _easycom_u_loading_icon)();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: _ctx.previewImage
|
||||
}, _ctx.previewImage ? {
|
||||
b: common_vendor.f($data.lists, (item, index, i0) => {
|
||||
return common_vendor.e({
|
||||
a: item.isImage || item.type && item.type === "image"
|
||||
}, item.isImage || item.type && item.type === "image" ? {
|
||||
b: item.thumb || item.url,
|
||||
c: _ctx.imageMode,
|
||||
d: common_vendor.o(($event) => $options.onPreviewImage(item, index), index),
|
||||
e: common_vendor.s({
|
||||
width: $options.addUnit(_ctx.width),
|
||||
height: $options.addUnit(_ctx.height)
|
||||
})
|
||||
} : {
|
||||
f: "cafe0b2a-0-" + i0,
|
||||
g: common_vendor.p({
|
||||
color: "#80CBF9",
|
||||
size: "26",
|
||||
name: item.isVideo || item.type && item.type === "video" ? "movie" : "folder"
|
||||
}),
|
||||
h: common_vendor.t(item.isVideo || item.type && item.type === "video" ? "视频" : "文件"),
|
||||
i: common_vendor.o(($event) => $options.onClickPreview(item, index), index)
|
||||
}, {
|
||||
j: item.status === "uploading" || item.status === "failed"
|
||||
}, item.status === "uploading" || item.status === "failed" ? common_vendor.e({
|
||||
k: item.status === "failed"
|
||||
}, item.status === "failed" ? {
|
||||
l: "cafe0b2a-1-" + i0,
|
||||
m: common_vendor.p({
|
||||
name: "close-circle",
|
||||
color: "#ffffff",
|
||||
size: "25"
|
||||
})
|
||||
} : {
|
||||
n: "cafe0b2a-2-" + i0,
|
||||
o: common_vendor.p({
|
||||
size: "22",
|
||||
mode: "circle",
|
||||
color: "#ffffff"
|
||||
})
|
||||
}, {
|
||||
p: item.message
|
||||
}, item.message ? {
|
||||
q: common_vendor.t(item.message)
|
||||
} : {}) : {}, {
|
||||
r: item.status !== "uploading" && (_ctx.deletable || item.deletable)
|
||||
}, item.status !== "uploading" && (_ctx.deletable || item.deletable) ? {
|
||||
s: "cafe0b2a-3-" + i0,
|
||||
t: common_vendor.p({
|
||||
name: "close",
|
||||
color: "#ffffff",
|
||||
size: "10"
|
||||
}),
|
||||
v: common_vendor.o(($event) => $options.deleteItem(index), index)
|
||||
} : {}, {
|
||||
w: item.status === "success"
|
||||
}, item.status === "success" ? {
|
||||
x: "cafe0b2a-4-" + i0,
|
||||
y: common_vendor.p({
|
||||
name: "checkmark",
|
||||
color: "#ffffff",
|
||||
size: "12"
|
||||
})
|
||||
} : {}, {
|
||||
z: index
|
||||
});
|
||||
})
|
||||
} : {}, {
|
||||
c: $data.isInCount
|
||||
}, $data.isInCount ? common_vendor.e({
|
||||
d: _ctx.$slots.trigger
|
||||
}, _ctx.$slots.trigger ? {
|
||||
e: common_vendor.o((...args) => $options.chooseFile && $options.chooseFile(...args))
|
||||
} : !_ctx.$slots.trigger && (_ctx.$slots.default || _ctx.$slots.$default) ? {
|
||||
g: common_vendor.o((...args) => $options.chooseFile && $options.chooseFile(...args))
|
||||
} : common_vendor.e({
|
||||
h: common_vendor.p({
|
||||
name: _ctx.uploadIcon,
|
||||
size: "26",
|
||||
color: _ctx.uploadIconColor
|
||||
}),
|
||||
i: _ctx.uploadText
|
||||
}, _ctx.uploadText ? {
|
||||
j: common_vendor.t(_ctx.uploadText)
|
||||
} : {}, {
|
||||
k: !_ctx.disabled ? "u-upload__button--hover" : "",
|
||||
l: common_vendor.o((...args) => $options.chooseFile && $options.chooseFile(...args)),
|
||||
m: common_vendor.n(_ctx.disabled && "u-upload__button--disabled"),
|
||||
n: common_vendor.s({
|
||||
width: $options.addUnit(_ctx.width),
|
||||
height: $options.addUnit(_ctx.height)
|
||||
})
|
||||
}), {
|
||||
f: !_ctx.$slots.trigger && (_ctx.$slots.default || _ctx.$slots.$default)
|
||||
}) : {}, {
|
||||
o: common_vendor.s($options.addStyle(_ctx.customStyle))
|
||||
});
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-cafe0b2a"]]);
|
||||
wx.createComponent(Component);
|
||||
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/node-modules/uview-plus/components/u-upload/u-upload.js.map
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-icon": "../u-icon/u-icon",
|
||||
"u-loading-icon": "../u-loading-icon/u-loading-icon"
|
||||
}
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
<view class="u-upload data-v-cafe0b2a" style="{{o}}"><view class="u-upload__wrap data-v-cafe0b2a"><block wx:if="{{a}}"><view wx:for="{{b}}" wx:for-item="item" wx:key="z" class="u-upload__wrap__preview data-v-cafe0b2a"><image wx:if="{{item.a}}" src="{{item.b}}" mode="{{item.c}}" class="u-upload__wrap__preview__image data-v-cafe0b2a" bindtap="{{item.d}}" style="{{item.e}}"/><view wx:else class="u-upload__wrap__preview__other data-v-cafe0b2a" bindtap="{{item.i}}"><u-icon wx:if="{{item.g}}" class="data-v-cafe0b2a" u-i="{{item.f}}" bind:__l="__l" u-p="{{item.g}}"></u-icon><text class="u-upload__wrap__preview__other__text data-v-cafe0b2a">{{item.h}}</text></view><view wx:if="{{item.j}}" class="u-upload__status data-v-cafe0b2a"><view class="u-upload__status__icon data-v-cafe0b2a"><u-icon wx:if="{{item.k}}" class="data-v-cafe0b2a" u-i="{{item.l}}" bind:__l="__l" u-p="{{item.m}}"/><u-loading-icon wx:else class="data-v-cafe0b2a" u-i="{{item.n}}" bind:__l="__l" u-p="{{item.o||''}}"/></view><text wx:if="{{item.p}}" class="u-upload__status__message data-v-cafe0b2a">{{item.q}}</text></view><view wx:if="{{item.r}}" class="u-upload__deletable data-v-cafe0b2a" catchtap="{{item.v}}"><view class="u-upload__deletable__icon data-v-cafe0b2a"><u-icon wx:if="{{item.t}}" class="data-v-cafe0b2a" u-i="{{item.s}}" bind:__l="__l" u-p="{{item.t}}"></u-icon></view></view><view wx:if="{{item.w}}" class="u-upload__success data-v-cafe0b2a"><view class="u-upload__success__icon data-v-cafe0b2a"><u-icon wx:if="{{item.y}}" class="data-v-cafe0b2a" u-i="{{item.x}}" bind:__l="__l" u-p="{{item.y}}"></u-icon></view></view></view></block><block wx:if="{{c}}"><view wx:if="{{d}}" class="data-v-cafe0b2a" bindtap="{{e}}"><slot name="trigger"/></view><view wx:elif="{{f}}" class="data-v-cafe0b2a" bindtap="{{g}}"><slot/></view><view wx:else hover-class="{{k}}" hover-stay-time="150" bindtap="{{l}}" class="{{['u-upload__button', 'data-v-cafe0b2a', m]}}" style="{{n}}"><u-icon wx:if="{{h}}" class="data-v-cafe0b2a" u-i="cafe0b2a-5" bind:__l="__l" u-p="{{h}}"></u-icon><text wx:if="{{i}}" class="u-upload__button__text data-v-cafe0b2a">{{j}}</text></view></block></view></view>
|
||||
+172
@@ -0,0 +1,172 @@
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-empty.data-v-cafe0b2a,
|
||||
.u-empty__wrap.data-v-cafe0b2a,
|
||||
.u-tabs.data-v-cafe0b2a,
|
||||
.u-tabs__wrapper.data-v-cafe0b2a,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-cafe0b2a,
|
||||
.u-tabs__wrapper__scroll-view.data-v-cafe0b2a,
|
||||
.u-tabs__wrapper__nav.data-v-cafe0b2a,
|
||||
.u-tabs__wrapper__nav__line.data-v-cafe0b2a,
|
||||
.up-empty.data-v-cafe0b2a,
|
||||
.up-empty__wrap.data-v-cafe0b2a,
|
||||
.up-tabs.data-v-cafe0b2a,
|
||||
.up-tabs__wrapper.data-v-cafe0b2a,
|
||||
.up-tabs__wrapper__scroll-view-wrapper.data-v-cafe0b2a,
|
||||
.up-tabs__wrapper__scroll-view.data-v-cafe0b2a,
|
||||
.up-tabs__wrapper__nav.data-v-cafe0b2a,
|
||||
.up-tabs__wrapper__nav__line.data-v-cafe0b2a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
flex-basis: auto;
|
||||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.u-upload.data-v-cafe0b2a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
}
|
||||
.u-upload__wrap.data-v-cafe0b2a {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
flex: 1;
|
||||
}
|
||||
.u-upload__wrap__preview.data-v-cafe0b2a {
|
||||
border-radius: 2px;
|
||||
margin: 0 8px 8px 0;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.u-upload__wrap__preview__image.data-v-cafe0b2a {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
.u-upload__wrap__preview__other.data-v-cafe0b2a {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: #f2f2f2;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.u-upload__wrap__preview__other__text.data-v-cafe0b2a {
|
||||
font-size: 11px;
|
||||
color: #909193;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.u-upload__deletable.data-v-cafe0b2a {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
background-color: #373737;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-bottom-left-radius: 100px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 3;
|
||||
}
|
||||
.u-upload__deletable__icon.data-v-cafe0b2a {
|
||||
position: absolute;
|
||||
transform: scale(0.7);
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
.u-upload__success.data-v-cafe0b2a {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-style: solid;
|
||||
border-top-color: transparent;
|
||||
border-left-color: transparent;
|
||||
border-bottom-color: #5ac725;
|
||||
border-right-color: #5ac725;
|
||||
border-width: 9px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.u-upload__success__icon.data-v-cafe0b2a {
|
||||
position: absolute;
|
||||
transform: scale(0.7);
|
||||
bottom: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
.u-upload__status.data-v-cafe0b2a {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.u-upload__status__icon.data-v-cafe0b2a {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.u-upload__status__message.data-v-cafe0b2a {
|
||||
font-size: 12px;
|
||||
color: #FFFFFF;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.u-upload__button.data-v-cafe0b2a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: #f4f5f7;
|
||||
border-radius: 2px;
|
||||
margin: 0 8px 8px 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.u-upload__button__text.data-v-cafe0b2a {
|
||||
font-size: 11px;
|
||||
color: #909193;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.u-upload__button--hover.data-v-cafe0b2a {
|
||||
background-color: #e6e7e9;
|
||||
}
|
||||
.u-upload__button--disabled.data-v-cafe0b2a {
|
||||
opacity: 0.5;
|
||||
}
|
||||
Reference in New Issue
Block a user