upload.wxml 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <view class="{{classPrefix}} {{prefix}}-class">
  2. <t-grid gutter="{{gutter}}" border="{{false}}" align="center" column="{{column}}">
  3. <!-- 图片/视频 -->
  4. <t-grid-item
  5. wx:for="{{customFiles}}"
  6. wx:key="index"
  7. wx:for-item="file"
  8. t-class="{{classPrefix}}__grid {{classPrefix}}__grid-file"
  9. t-class-content="{{classPrefix}}__grid-content"
  10. >
  11. <view class="{{classPrefix}}__wrapper" style="{{gridItemStyle}}">
  12. <t-image
  13. wx:if="{{file.type !== 'video'}}"
  14. bindtap="onProofTap"
  15. data-index="{{index}}"
  16. t-class="{{classPrefix}}__thumbnail"
  17. src="{{file.url}}"
  18. mode="{{imageProps.mode}}"
  19. error="{{imageProps.error}}"
  20. lazy="{{imageProps.lazy}}"
  21. loading="{{imageProps.loading}}"
  22. shape="{{imageProps.shape}}"
  23. webp="{{imageProps.webp}}"
  24. showMenuByLongpress="{{image.showMenuByLongpress}}"
  25. />
  26. <video
  27. wx:if="{{file.type === 'video'}}"
  28. class="{{classPrefix}}__thumbnail"
  29. src="{{file.url}}"
  30. controls
  31. autoplay="{{false}}"
  32. objectFit="contain"
  33. />
  34. <!-- 失败重试 -->
  35. <view
  36. data-index="{{index}}"
  37. wx:if="{{file.percent !== undefined && file.percent !== 100}}"
  38. class="{{classPrefix}}__progress-mask"
  39. data-file="{{file}}"
  40. bind:tap="onFileClick"
  41. >
  42. <view wx:if="{{file.percent === -1}}" class="{{classPrefix}}__progress-failed">
  43. <t-icon name="refresh" size="45rpx" color="#fff" />
  44. </view>
  45. <view wx:else class="{{classPrefix}}__progress-value">{{file.percent}}%</view>
  46. </view>
  47. <!-- 删除 -->
  48. <view class="{{classPrefix}}__close-btn hotspot-expanded" bindtap="onDelete" data-index="{{index}}">
  49. <slot wx:if="{{deleteBtn === 'slot'}}" name="deleteBtn" />
  50. <t-icon wx:else name="close" size="34rpx" color="#fff" />
  51. </view>
  52. </view>
  53. </t-grid-item>
  54. <!-- 添加 -->
  55. <t-grid-item
  56. wx:if="{{customLimit > 0}}"
  57. t-class="{{classPrefix}}__grid"
  58. t-class-content="{{classPrefix}}__grid-content"
  59. bindclick="onAddTap"
  60. >
  61. <view class="{{classPrefix}}__wrapper" style="{{gridItemStyle}}">
  62. <view class="{{classPrefix}}__add-icon">
  63. <slot wx:if="{{addContent === 'slot'}}" name="add-content" />
  64. <t-icon wx:else name="add" size="40rpx" color="rgba(0,0,0,0.26)" />
  65. </view>
  66. </view>
  67. </t-grid-item>
  68. </t-grid>
  69. </view>