微信登录版

This commit is contained in:
qianlile
2021-08-28 11:30:34 +08:00
parent 7af68fee6b
commit 33aecb6bda
432 changed files with 13362 additions and 0 deletions

View File

@@ -0,0 +1,246 @@
'use strict';
var __assign =
(this && this.__assign) ||
function () {
__assign =
Object.assign ||
function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, '__esModule', { value: true });
var component_1 = require('../common/component');
var utils_1 = require('./utils');
var shared_1 = require('./shared');
var validator_1 = require('../common/validator');
component_1.VantComponent({
props: __assign(
__assign(
{
disabled: Boolean,
multiple: Boolean,
uploadText: String,
useBeforeRead: Boolean,
afterRead: null,
beforeRead: null,
previewSize: {
type: null,
value: 80,
},
name: {
type: null,
value: '',
},
accept: {
type: String,
value: 'image',
},
fileList: {
type: Array,
value: [],
observer: 'formatFileList',
},
maxSize: {
type: Number,
value: Number.MAX_VALUE,
},
maxCount: {
type: Number,
value: 100,
},
deletable: {
type: Boolean,
value: true,
},
showUpload: {
type: Boolean,
value: true,
},
previewImage: {
type: Boolean,
value: true,
},
previewFullImage: {
type: Boolean,
value: true,
},
imageFit: {
type: String,
value: 'scaleToFill',
},
uploadIcon: {
type: String,
value: 'photograph',
},
},
shared_1.chooseImageProps
),
shared_1.chooseVideoProps
),
data: {
lists: [],
isInCount: true,
},
methods: {
formatFileList: function () {
var _a = this.data,
_b = _a.fileList,
fileList = _b === void 0 ? [] : _b,
maxCount = _a.maxCount;
var lists = fileList.map(function (item) {
return __assign(__assign({}, item), {
isImage: utils_1.isImageFile(item),
isVideo: utils_1.isVideoFile(item),
deletable: validator_1.isBoolean(item.deletable)
? item.deletable
: true,
});
});
this.setData({ lists: lists, isInCount: lists.length < maxCount });
},
getDetail: function (index) {
return {
name: this.data.name,
index: index == null ? this.data.fileList.length : index,
};
},
startUpload: function () {
var _this = this;
var _a = this.data,
maxCount = _a.maxCount,
multiple = _a.multiple,
lists = _a.lists,
disabled = _a.disabled;
if (disabled) return;
utils_1
.chooseFile(
__assign(__assign({}, this.data), {
maxCount: maxCount - lists.length,
})
)
.then(function (res) {
_this.onBeforeRead(multiple ? res : res[0]);
})
.catch(function (error) {
_this.$emit('error', error);
});
},
onBeforeRead: function (file) {
var _this = this;
var _a = this.data,
beforeRead = _a.beforeRead,
useBeforeRead = _a.useBeforeRead;
var res = true;
if (typeof beforeRead === 'function') {
res = beforeRead(file, this.getDetail());
}
if (useBeforeRead) {
res = new Promise(function (resolve, reject) {
_this.$emit(
'before-read',
__assign(__assign({ file: file }, _this.getDetail()), {
callback: function (ok) {
ok ? resolve() : reject();
},
})
);
});
}
if (!res) {
return;
}
if (validator_1.isPromise(res)) {
res.then(function (data) {
return _this.onAfterRead(data || file);
});
} else {
this.onAfterRead(file);
}
},
onAfterRead: function (file) {
var _a = this.data,
maxSize = _a.maxSize,
afterRead = _a.afterRead;
var oversize = Array.isArray(file)
? file.some(function (item) {
return item.size > maxSize;
})
: file.size > maxSize;
if (oversize) {
this.$emit('oversize', __assign({ file: file }, this.getDetail()));
return;
}
if (typeof afterRead === 'function') {
afterRead(file, this.getDetail());
}
this.$emit('after-read', __assign({ file: file }, this.getDetail()));
},
deleteItem: function (event) {
var index = event.currentTarget.dataset.index;
this.$emit(
'delete',
__assign(__assign({}, this.getDetail(index)), {
file: this.data.fileList[index],
})
);
},
onPreviewImage: function (event) {
if (!this.data.previewFullImage) return;
var index = event.currentTarget.dataset.index;
var lists = this.data.lists;
var item = lists[index];
wx.previewImage({
urls: lists
.filter(function (item) {
return utils_1.isImageFile(item);
})
.map(function (item) {
return item.url;
}),
current: item.url,
fail: function () {
wx.showToast({ title: '预览图片失败', icon: 'none' });
},
});
},
onPreviewVideo: function (event) {
if (!this.data.previewFullImage) return;
var index = event.currentTarget.dataset.index;
var lists = this.data.lists;
wx.previewMedia({
sources: lists
.filter(function (item) {
return utils_1.isVideoFile(item);
})
.map(function (item) {
return __assign(__assign({}, item), { type: 'video' });
}),
current: index,
fail: function () {
wx.showToast({ title: '预览视频失败', icon: 'none' });
},
});
},
onPreviewFile: function (event) {
var index = event.currentTarget.dataset.index;
wx.openDocument({
filePath: this.data.lists[index].url,
showMenu: true,
});
},
onClickPreview: function (event) {
var index = event.currentTarget.dataset.index;
var item = this.data.lists[index];
this.$emit(
'click-preview',
__assign(__assign({}, item), this.getDetail(index))
);
},
},
});

View File

@@ -0,0 +1,7 @@
{
"component": true,
"usingComponents": {
"van-icon": "../icon/index",
"van-loading": "../loading/index"
}
}

View File

@@ -0,0 +1,83 @@
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<view class="van-uploader">
<view class="van-uploader__wrapper">
<!-- 预览样式 -->
<view
wx:if="{{ previewImage }}"
wx:for="{{ lists }}"
wx:key="index"
class="van-uploader__preview"
data-index="{{ index }}"
bindtap="onClickPreview"
>
<image
wx:if="{{ item.isImage }}"
mode="{{ imageFit }}"
src="{{ item.thumb || item.url }}"
alt="{{ item.name || ('图片' + index) }}"
class="van-uploader__preview-image"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
bindtap="onPreviewImage"
/>
<video
wx:elif="{{ item.isVideo }}"
src="{{ item.url }}"
title="{{ item.name || ('视频' + index) }}"
poster="{{ item.thumb }}"
autoplay="{{ item.autoplay }}"
class="van-uploader__preview-image"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
bindtap="onPreviewVideo"
>
</video>
<view
wx:else
class="van-uploader__file"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
bindtap="onPreviewFile"
>
<van-icon name="description" class="van-uploader__file-icon" />
<view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url }}</view>
</view>
<view
wx:if="{{ item.status === 'uploading' || item.status === 'failed' }}"
class="van-uploader__mask"
>
<van-icon wx:if="{{ item.status === 'failed' }}" name="close" class="van-uploader__mask-icon" />
<van-loading wx:else custom-class="van-uploader__loading" />
<text wx:if="{{ item.message }}" class="van-uploader__mask-message">{{ item.message }}</text>
</view>
<view
wx:if="{{ deletable && item.deletable }}"
data-index="{{ index }}"
class="van-uploader__preview-delete"
catch:tap="deleteItem"
>
<van-icon name="cross" class="van-uploader__preview-delete-icon" />
</view>
</view>
<!-- 上传样式 -->
<block wx:if="{{ isInCount }}">
<view class="van-uploader__slot" bindtap="startUpload">
<slot />
</view>
<!-- 默认上传样式 -->
<view
wx:if="{{ showUpload }}"
class="van-uploader__upload {{ disabled ? 'van-uploader__upload--disabled': ''}}"
style="{{ computed.sizeStyle({ previewSize }) }}"
bindtap="startUpload"
>
<van-icon name="{{ uploadIcon }}" class="van-uploader__upload-icon" />
<text wx:if="{{ uploadText }}" class="van-uploader__upload-text">{{ uploadText }}</text>
</view>
</block>
</view>
</view>

View File

@@ -0,0 +1,14 @@
/* eslint-disable */
var style = require('../wxs/style.wxs');
var addUnit = require('../wxs/add-unit.wxs');
function sizeStyle(data) {
return style({
width: addUnit(data.previewSize),
height: addUnit(data.previewSize),
});
}
module.exports = {
sizeStyle: sizeStyle,
};

View File

@@ -0,0 +1 @@
@import '../common/index.wxss';.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:flex;flex-wrap:wrap}.van-uploader__slot:empty{display:none}.van-uploader__slot:not(:empty)+.van-uploader__upload{display:none!important}.van-uploader__upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px);margin:0 8px 8px 0;margin:0 var(--padding-xs,8px) var(--padding-xs,8px) 0;background-color:#f7f8fa;background-color:var(--uploader-upload-background-color,#f7f8fa)}.van-uploader__upload:active{background-color:#f2f3f5;background-color:var(--uploader-upload-active-color,#f2f3f5)}.van-uploader__upload-icon{color:#dcdee0;color:var(--uploader-icon-color,#dcdee0);font-size:24px;font-size:var(--uploader-icon-size,24px)}.van-uploader__upload-text{margin-top:8px;margin-top:var(--padding-xs,8px);color:#969799;color:var(--uploader-text-color,#969799);font-size:12px;font-size:var(--uploader-text-font-size,12px)}.van-uploader__upload--disabled{opacity:.5;opacity:var(--uploader-disabled-opacity,.5)}.van-uploader__preview{position:relative;cursor:pointer;margin:0 8px 8px 0;margin:0 var(--padding-xs,8px) var(--padding-xs,8px) 0}.van-uploader__preview-image{display:block;overflow:hidden;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px)}.van-uploader__preview-delete{padding:0 0 8px 8px;padding:0 0 var(--padding-xs,8px) var(--padding-xs,8px)}.van-uploader__preview-delete,.van-uploader__preview-delete:after{position:absolute;top:0;right:0;width:14px;width:var(--uploader-delete-icon-size,14px);height:14px;height:var(--uploader-delete-icon-size,14px)}.van-uploader__preview-delete:after{content:"";background-color:rgba(0,0,0,.7);background-color:var(--uploader-delete-background-color,rgba(0,0,0,.7));border-radius:0 0 0 12px;border-radius:0 0 0 calc(var(--uploader-delete-icon-size, 14px) - 2px)}.van-uploader__preview-delete-icon{position:absolute;top:-2px;right:-2px;z-index:1;transform:scale(.5);font-size:16px;font-size:calc(var(--uploader-delete-icon-size, 14px) + 2px);color:#fff;color:var(--uploader-delete-color,#fff)}.van-uploader__file{display:flex;flex-direction:column;align-items:center;justify-content:center;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px);background-color:#f7f8fa;background-color:var(--uploader-file-background-color,#f7f8fa)}.van-uploader__file-icon{color:#646566;color:var(--uploader-file-icon-color,#646566);font-size:20px;font-size:var(--uploader-file-icon-size,20px)}.van-uploader__file-name{box-sizing:border-box;width:100%;text-align:center;margin-top:8px;margin-top:var(--uploader-file-name-margin-top,8px);padding:0 4px;padding:var(--uploader-file-name-padding,0 4px);color:#646566;color:var(--uploader-file-name-text-color,#646566);font-size:12px;font-size:var(--uploader-file-name-font-size,12px)}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;color:var(--white,#fff);background-color:rgba(50,50,51,.88);background-color:var(--uploader-mask-background-color,rgba(50,50,51,.88))}.van-uploader__mask-icon{font-size:22px;font-size:var(--uploader-mask-icon-size,22px)}.van-uploader__mask-message{margin-top:6px;padding:0 4px;padding:0 var(--padding-base,4px);font-size:12px;font-size:var(--uploader-mask-message-font-size,12px);line-height:14px;line-height:var(--uploader-mask-message-line-height,14px)}.van-uploader__loading{width:22px;width:var(--uploader-loading-icon-size,22px);height:22px;height:var(--uploader-loading-icon-size,22px);color:#fff!important;color:var(--uploader-loading-icon-color,#fff)!important}

View File

@@ -0,0 +1,33 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
exports.chooseVideoProps = exports.chooseImageProps = void 0;
// props for choose image
exports.chooseImageProps = {
sizeType: {
type: Array,
value: ['original', 'compressed'],
},
capture: {
type: Array,
value: ['album', 'camera'],
},
};
// props for choose video
exports.chooseVideoProps = {
capture: {
type: Array,
value: ['album', 'camera'],
},
compressed: {
type: Boolean,
value: true,
},
maxDuration: {
type: Number,
value: 60,
},
camera: {
type: String,
value: 'back',
},
};

View File

@@ -0,0 +1,158 @@
'use strict';
var __assign =
(this && this.__assign) ||
function () {
__assign =
Object.assign ||
function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, '__esModule', { value: true });
exports.chooseFile = exports.isVideoFile = exports.isImageFile = void 0;
var utils_1 = require('../common/utils');
var validator_1 = require('../common/validator');
function isImageFile(item) {
if (item.isImage != null) {
return item.isImage;
}
if (item.type) {
return item.type === 'image';
}
if (item.url) {
return validator_1.isImageUrl(item.url);
}
return false;
}
exports.isImageFile = isImageFile;
function isVideoFile(item) {
if (item.isVideo != null) {
return item.isVideo;
}
if (item.type) {
return item.type === 'video';
}
if (item.url) {
return validator_1.isVideoUrl(item.url);
}
return false;
}
exports.isVideoFile = isVideoFile;
function formatImage(res) {
return res.tempFiles.map(function (item) {
return __assign(__assign({}, utils_1.pickExclude(item, ['path'])), {
type: 'image',
url: item.path,
thumb: item.path,
});
});
}
function formatVideo(res) {
return [
__assign(
__assign(
{},
utils_1.pickExclude(res, [
'tempFilePath',
'thumbTempFilePath',
'errMsg',
])
),
{ type: 'video', url: res.tempFilePath, thumb: res.thumbTempFilePath }
),
];
}
function formatMedia(res) {
return res.tempFiles.map(function (item) {
return __assign(
__assign(
{},
utils_1.pickExclude(item, [
'fileType',
'thumbTempFilePath',
'tempFilePath',
])
),
{
type: res.type,
url: item.tempFilePath,
thumb:
res.type === 'video' ? item.thumbTempFilePath : item.tempFilePath,
}
);
});
}
function formatFile(res) {
return res.tempFiles.map(function (item) {
return __assign(__assign({}, utils_1.pickExclude(item, ['path'])), {
url: item.path,
});
});
}
function chooseFile(_a) {
var accept = _a.accept,
multiple = _a.multiple,
capture = _a.capture,
compressed = _a.compressed,
maxDuration = _a.maxDuration,
sizeType = _a.sizeType,
camera = _a.camera,
maxCount = _a.maxCount;
return new Promise(function (resolve, reject) {
switch (accept) {
case 'image':
wx.chooseImage({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
sizeType: sizeType,
success: function (res) {
return resolve(formatImage(res));
},
fail: reject,
});
break;
case 'media':
wx.chooseMedia({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
maxDuration: maxDuration,
sizeType: sizeType,
camera: camera,
success: function (res) {
return resolve(formatMedia(res));
},
fail: reject,
});
break;
case 'video':
wx.chooseVideo({
sourceType: capture,
compressed: compressed,
maxDuration: maxDuration,
camera: camera,
success: function (res) {
return resolve(formatVideo(res));
},
fail: reject,
});
break;
default:
wx.chooseMessageFile({
count: multiple ? maxCount : 1,
type: accept,
success: function (res) {
return resolve(formatFile(res));
},
fail: reject,
});
break;
}
});
}
exports.chooseFile = chooseFile;