86 lines
2.9 KiB
86 lines
2.9 KiB
9 months ago
|
<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 }}"
|
||
|
|
object-fit="{{videoFit}}"
|
||
|
|
referrer-policy="{{ referrerPolicy }}"
|
||
|
|
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>
|