From 093afd3be27ea5e9692839845b69bd56e2405518 Mon Sep 17 00:00:00 2001
From: Riku <risaku@163.com>
Date: 星期二, 13 八月 2024 23:49:45 +0800
Subject: [PATCH] 204.8.13
---
miniprogram_npm/tdesign-miniprogram/upload/upload.wxml | 285 +++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 206 insertions(+), 79 deletions(-)
diff --git a/miniprogram_npm/tdesign-miniprogram/upload/upload.wxml b/miniprogram_npm/tdesign-miniprogram/upload/upload.wxml
index 0a96c4b..fc721a7 100644
--- a/miniprogram_npm/tdesign-miniprogram/upload/upload.wxml
+++ b/miniprogram_npm/tdesign-miniprogram/upload/upload.wxml
@@ -1,95 +1,222 @@
<wxs src="../common/utils.wxs" module="_" />
<wxs src="./upload.wxs" module="this" />
+<wxs src="./drag.wxs" module="handler" />
<view style="{{_._style([style, customStyle])}}" class="{{classPrefix}} class {{prefix}}-class">
- <t-grid gutter="{{gutter}}" border="{{false}}" align="center" column="{{column}}">
- <!-- 鍥剧墖/瑙嗛 -->
- <t-grid-item
- wx:for="{{customFiles}}"
- wx:key="index"
- wx:for-item="file"
- t-class="{{classPrefix}}__grid {{classPrefix}}__grid-file"
- t-class-content="{{classPrefix}}__grid-content"
- aria-role="presentation"
- >
- <view
- class="{{classPrefix}}__wrapper"
- style="{{gridItemStyle}}"
- aria-role="{{ariaRole || this.getWrapperAriaRole(file)}}"
- aria-label="{{ariaLabel || this.getWrapperAriaLabel(file)}}"
+ <t-grid
+ gutter="{{gutter}}"
+ border="{{false}}"
+ align="center"
+ column="{{column}}"
+ style="{{draggable? 'overflow: visible' : ''}}"
+ >
+ <block wx:if="{{!dragLayout}}">
+ <!-- 鍥剧墖/瑙嗛 -->
+ <t-grid-item
+ wx:for="{{customFiles}}"
+ wx:key="url"
+ wx:for-item="file"
+ t-class="{{classPrefix}}__grid {{classPrefix}}__grid-file"
+ t-class-content="{{classPrefix}}__grid-content"
+ aria-role="presentation"
>
- <t-image
- wx:if="{{file.type !== 'video'}}"
- data-file="{{file}}"
- bind:tap="onProofTap"
- data-index="{{index}}"
- t-class="{{classPrefix}}__thumbnail"
- style="{{imageProps.style || ''}}"
- src="{{file.url}}"
- mode="{{imageProps.mode || 'aspectFill'}}"
- error="{{imageProps.error || 'default'}}"
- lazy="{{imageProps.lazy || false}}"
- loading="{{imageProps.loading || 'default'}}"
- shape="{{imageProps.shape || 'round'}}"
- webp="{{imageProps.webp || false}}"
- showMenuByLongpress="{{imageProps.showMenuByLongpress || false}}"
- />
- <video
- data-file="{{file}}"
- bind:tap="onFileClick"
- wx:if="{{file.type === 'video'}}"
- class="{{classPrefix}}__thumbnail"
- src="{{file.url}}"
- controls
- autoplay="{{false}}"
- objectFit="contain"
- />
- <!-- 澶辫触閲嶈瘯 -->
<view
- data-index="{{index}}"
- wx:if="{{file.status && file.status != 'done'}}"
- class="{{classPrefix}}__progress-mask"
- data-file="{{file}}"
- bind:tap="onFileClick"
+ class="{{classPrefix}}__wrapper {{disabled? classPrefix + '__wrapper--disabled' : '' }}"
+ style="{{gridItemStyle}}"
+ aria-role="{{ariaRole || this.getWrapperAriaRole(file)}}"
+ aria-label="{{ariaLabel || this.getWrapperAriaLabel(file)}}"
>
- <block wx:if="{{file.status == 'loading'}}">
- <t-icon t-class="{{classPrefix}}__progress-loading" name="loading" size="24" aria-hidden />
- <view class="{{classPrefix}}__progress-text">{{file.percent ? file.percent + '%' : '涓婁紶涓�...'}}</view>
- </block>
- <t-icon wx:else name="{{file.status == 'reload' ? 'refresh' : 'close-circle'}}" size="24" aria-hidden />
- <view wx:if="{{file.status == 'reload' || file.status == 'failed'}}" class="{{classPrefix}}__progress-text">
- {{file.status == 'reload' ? '閲嶆柊涓婁紶' : '涓婁紶澶辫触'}}
+ <t-image
+ wx:if="{{file.type !== 'video'}}"
+ data-file="{{file}}"
+ bind:tap="onProofTap"
+ data-index="{{index}}"
+ t-class="{{classPrefix}}__thumbnail"
+ style="{{imageProps && imageProps.style || ''}}"
+ src="{{ file.thumb || file.url }}"
+ mode="{{imageProps && imageProps.mode || 'aspectFill'}}"
+ error="{{imageProps && imageProps.error || 'default'}}"
+ lazy="{{imageProps && imageProps.lazy || false}}"
+ loading="{{imageProps && imageProps.loading || 'default'}}"
+ shape="{{imageProps && imageProps.shape || 'round'}}"
+ webp="{{imageProps && imageProps.webp || false}}"
+ showMenuByLongpress="{{imageProps && imageProps.showMenuByLongpress || false}}"
+ />
+ <video
+ data-file="{{file}}"
+ bind:tap="onFileClick"
+ wx:if="{{file.type === 'video'}}"
+ class="{{classPrefix}}__thumbnail"
+ src="{{file.url}}"
+ poster="{{ file.thumb }}"
+ controls
+ autoplay="{{false}}"
+ objectFit="contain"
+ />
+ <!-- 澶辫触閲嶈瘯 -->
+ <view
+ data-index="{{index}}"
+ wx:if="{{file.status && file.status != 'done'}}"
+ class="{{classPrefix}}__progress-mask"
+ data-file="{{file}}"
+ bind:tap="onFileClick"
+ >
+ <block wx:if="{{file.status == 'loading'}}">
+ <t-icon t-class="{{classPrefix}}__progress-loading" name="loading" size="24" aria-hidden />
+ <view class="{{classPrefix}}__progress-text">{{file.percent ? file.percent + '%' : '涓婁紶涓�...'}}</view>
+ </block>
+ <t-icon wx:else name="{{file.status == 'reload' ? 'refresh' : 'close-circle'}}" size="24" aria-hidden />
+ <view wx:if="{{file.status == 'reload' || file.status == 'failed'}}" class="{{classPrefix}}__progress-text">
+ {{file.status == 'reload' ? '閲嶆柊涓婁紶' : '涓婁紶澶辫触'}}
+ </view>
+ </view>
+
+ <!-- 鍒犻櫎 -->
+ <view
+ class="{{classPrefix}}__close-btn hotspot-expanded"
+ bindtap="onDelete"
+ data-index="{{index}}"
+ aria-role="button"
+ aria-label="鍒犻櫎"
+ >
+ <t-icon name="close" size="16" color="#fff" />
</view>
</view>
- </view>
+ </t-grid-item>
- <!-- 鍒犻櫎 -->
- <view
- class="{{classPrefix}}__close-btn hotspot-expanded"
- bindtap="onDelete"
- data-index="{{index}}"
- aria-role="button"
- aria-label="鍒犻櫎"
+ <!-- 娣诲姞 -->
+ <t-grid-item
+ wx:if="{{customLimit > 0}}"
+ t-class="{{classPrefix}}__grid"
+ t-class-content="{{classPrefix}}__grid-content"
+ bindclick="onAddTap"
+ aria-label="涓婁紶"
>
- <t-icon name="close" size="16" color="#fff" />
- </view>
- </t-grid-item>
+ <view class="{{classPrefix}}__wrapper" style="{{gridItemStyle}}">
+ <slot name="add-content" />
+ <block wx:if="{{addContent}}">{{addContent}}</block>
+ <view wx:else class="{{classPrefix}}__add-icon {{disabled? classPrefix + '__add-icon--disabled' : '' }}">
+ <t-icon name="add" />
+ </view>
+ </view>
+ </t-grid-item>
+ </block>
+ <block wx:else>
+ <view
+ class="{{classPrefix}}__drag"
+ list="{{dragList}}"
+ style="{{dragWrapStyle}};"
+ dragBaseData="{{dragBaseData}}"
+ change:list="{{handler.listObserver}}"
+ change:dragBaseData="{{handler.baseDataObserver}}"
+ >
+ <view
+ class="{{classPrefix}}__drag-item"
+ wx:for="{{customFiles}}"
+ wx:key="url"
+ wx:for-item="file"
+ style="width: {{100 / column}}%; --td-upload-drag-transition-duration: {{transition.duration}}ms; --td-upload-drag-transition-timing-function: {{transition.timingFunction}}"
+ bind:longpress="{{handler.longPress}}"
+ catch:touchmove="{{dragging ? handler.touchMove : ''}}"
+ catch:touchend="{{dragging ? handler.touchEnd : ''}}"
+ data-index="{{index}}"
+ >
+ <!-- 鍥剧墖/瑙嗛 -->
+ <t-grid-item
+ t-class="{{classPrefix}}__grid {{classPrefix}}__grid-file"
+ t-class-content="{{classPrefix}}__grid-content"
+ aria-role="presentation"
+ style="width: 100%"
+ >
+ <view
+ class="{{classPrefix}}__wrapper {{disabled? classPrefix + '__wrapper--disabled' : '' }}"
+ style="{{gridItemStyle}};"
+ aria-role="{{ariaRole || this.getWrapperAriaRole(file)}}"
+ aria-label="{{ariaLabel || this.getWrapperAriaLabel(file)}}"
+ >
+ <t-image
+ wx:if="{{file.type !== 'video'}}"
+ data-file="{{file}}"
+ bind:tap="onProofTap"
+ data-index="{{index}}"
+ t-class="{{classPrefix}}__thumbnail"
+ style="{{imageProps && imageProps.style || ''}}"
+ src="{{ file.thumb || file.url }}"
+ mode="{{imageProps && imageProps.mode || 'aspectFill'}}"
+ error="{{imageProps && imageProps.error || 'default'}}"
+ lazy="{{imageProps && imageProps.lazy || false}}"
+ loading="{{imageProps && imageProps.loading || 'default'}}"
+ shape="{{imageProps && imageProps.shape || 'round'}}"
+ webp="{{imageProps && imageProps.webp || false}}"
+ showMenuByLongpress="{{imageProps && imageProps.showMenuByLongpress || false}}"
+ />
+ <video
+ data-file="{{file}}"
+ bind:tap="onFileClick"
+ wx:if="{{file.type === 'video'}}"
+ class="{{classPrefix}}__thumbnail"
+ src="{{file.url}}"
+ poster="{{ file.thumb }}"
+ controls
+ autoplay="{{false}}"
+ objectFit="contain"
+ />
+ <!-- 澶辫触閲嶈瘯 -->
+ <view
+ data-index="{{index}}"
+ wx:if="{{file.status && file.status != 'done'}}"
+ class="{{classPrefix}}__progress-mask"
+ data-file="{{file}}"
+ bind:tap="onFileClick"
+ >
+ <block wx:if="{{file.status == 'loading'}}">
+ <t-icon t-class="{{classPrefix}}__progress-loading" name="loading" size="24" aria-hidden />
+ <view class="{{classPrefix}}__progress-text"
+ >{{file.percent ? file.percent + '%' : '涓婁紶涓�...'}}</view
+ >
+ </block>
+ <t-icon wx:else name="{{file.status == 'reload' ? 'refresh' : 'close-circle'}}" size="24" aria-hidden />
+ <view
+ wx:if="{{file.status == 'reload' || file.status == 'failed'}}"
+ class="{{classPrefix}}__progress-text"
+ >
+ {{file.status == 'reload' ? '閲嶆柊涓婁紶' : '涓婁紶澶辫触'}}
+ </view>
+ </view>
- <!-- 娣诲姞 -->
- <t-grid-item
- wx:if="{{customLimit > 0}}"
- t-class="{{classPrefix}}__grid"
- t-class-content="{{classPrefix}}__grid-content"
- bindclick="onAddTap"
- aria-label="涓婁紶"
- >
- <view class="{{classPrefix}}__wrapper" style="{{gridItemStyle}}">
- <slot name="add-content" />
- <block wx:if="{{addContent}}">{{addContent}}</block>
- <view wx:else class="{{classPrefix}}__add-icon">
- <t-icon name="add" />
+ <!-- 鍒犻櫎 -->
+ <view
+ class="{{classPrefix}}__close-btn hotspot-expanded"
+ bindtap="onDelete"
+ data-index="{{index}}"
+ data-url="{{file.url}}"
+ aria-role="button"
+ aria-label="鍒犻櫎"
+ >
+ <t-icon name="close" size="16" color="#fff" />
+ </view>
+ </view>
+ </t-grid-item>
+ <!-- 娣诲姞 -->
+ </view>
+ <view class="{{classPrefix}}__drag-item" style="width: {{100 / column}}%" wx:if="{{customLimit > 0}}">
+ <t-grid-item
+ t-class="{{classPrefix}}__grid"
+ t-class-content="{{classPrefix}}__grid-content"
+ bindclick="onAddTap"
+ aria-label="涓婁紶"
+ style="width: 100%"
+ >
+ <view class="{{classPrefix}}__wrapper" style="{{gridItemStyle}}">
+ <slot name="add-content" />
+ <block wx:if="{{addContent}}">{{addContent}}</block>
+ <view wx:else class="{{classPrefix}}__add-icon {{disabled? classPrefix + '__add-icon--disabled' : '' }}">
+ <t-icon name="add" />
+ </view>
+ </view>
+ </t-grid-item>
</view>
</view>
- </t-grid-item>
+ </block>
</t-grid>
</view>
--
Gitblit v1.9.3