index.wxml 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. <view class="swiper_container">
  2. <swiper
  3. wx:if="{{isSwiper}}"
  4. class="video-swiper"
  5. circular="{{circular}}"
  6. next-margin="{{nextMargin}}"
  7. easing-function="{{easingFunction}}"
  8. vertical
  9. current="0"
  10. duration="{{duration}}"
  11. bindanimationfinish="animationfinish">
  12. <!-- curQueue 循环会导致video重新插入,objectFit 不可变更 -->
  13. <swiper-item class="swiper_item" wx:for="{{curQueue}}" data-id="{{item.id}}" wx:key="*this">
  14. <view class="head_box">
  15. <view class="user_box" catchtap="{{ifHeadTap ? 'headTap' : null}}" data-uid="{{item.uid}}">
  16. <image class="avatar" lazy-load="true" src="{{item.avatar}}" />
  17. <view class="user_right">
  18. <view class="nickname">{{item.nickName}}</view>
  19. </view>
  20. </view>
  21. <view wx:if="{{!item.showMyBtn}}" class="time">
  22. <text>发布时间:{{item.time}}</text>
  23. </view>
  24. <view wx:if="{{item.showMyBtn}}" class="my_btn">
  25. <view catchtap="delete" data-id="{{item.id}}">
  26. <image src="../../static/index/delete.png" />
  27. <text >删除</text>
  28. </view>
  29. <view catchtap="hide" data-status="{{item.status}}" data-id="{{item.id}}">
  30. <image src="{{item.status==='NORMAL'? '../../static/index/hide_icon.png': '../../static/index/show_icon.png'}}" />
  31. <text >{{item.status==='NORMAL'? '隐藏': '展示'}}</text>
  32. </view>
  33. </view>
  34. </view>
  35. <video
  36. id="video_{{index}}"
  37. class="video_item"
  38. loop="{{loop}}"
  39. enable-play-gesture
  40. enable-progress-gesture
  41. show-center-play-btn="{{false}}"
  42. controls="{{true}}"
  43. src="{{item.url}}"
  44. object-fit="contain"
  45. data-index="{{index}}"
  46. data-id="{{item.id}}"
  47. bindplay="onPlay"
  48. bindended="onEnded"
  49. >
  50. <!-- bindplay="onPlay"
  51. bindpause="onPause"
  52. bindended="onEnded"
  53. binderror="onError"
  54. bindtimeupdate="onTimeUpdate"
  55. bindwaiting="onWaiting"
  56. bindprogress="onProgress"
  57. bindloadedmetadata="onLoadedMetaData" -->
  58. </video>
  59. <view class="video_title">
  60. <text>
  61. {{item.title}}
  62. </text>
  63. </view>
  64. <view class="foot_box">
  65. <view class="foot_left">
  66. <view class="btn collect_btn" catchtap="collectTap" data-index="{{index}}" data-id="{{item.id}}" data-type="{{item.type}}">
  67. <image class="collect_btn_icon" src="{{item.isFavorite ? '../../static/index/star_colored.png' : '../../static/index/star.png'}}" />
  68. <text>收藏</text>
  69. </view>
  70. <view class="btn share_btn" bindtap="openShare" data-index="{{index}}" data-id="{{item.id}}" data-avatar="{{item.avatar}}" data-author="{{item.nickName}}" data-uid="{{item.uid}}" data-img="{{item.img}}" data-title="{{item.title}}" data-type="{{item.type}}">
  71. <image class="share_btn_icon" src="../../static/index/share.png" lazy-load="true" />
  72. <text>分享</text>
  73. </view>
  74. </view>
  75. <view class="foot_right">
  76. <view class="btn flower_btn" catchtap="{{item.isLike ? null : 'likeTap'}}" data-index="{{index}}" data-id="{{item.id}}" data-islike="{{item.isLike}}">
  77. <image class="flower_btn_icon" src="{{item.isLike ? '../../static/index/heart.png' : '../../static/index/heart.png'}}" />
  78. <text>{{item.likes}}</text>
  79. </view>
  80. <view class="btn comment_btn" catchtap="openComment" data-id="{{item.id}}">
  81. <image class="comment_btn_icon" src="../../static/index/comment.png" lazy-load="true" />
  82. <text>{{item.commentAmount}}</text>
  83. </view>
  84. </view>
  85. </view>
  86. <view class="btn_wrapper" catchtap="goToReading" data-id="{{item.classId}}">
  87. <view class="reading_btn">
  88. <image src="../../static/index/microphone.png" />
  89. <text>我要配音</text>
  90. </view>
  91. </view>
  92. </swiper-item>
  93. </swiper>
  94. <!-- // 非swiper -->
  95. <view wx:if="{{!isSwiper}}" class="swiper_item no_swiper" wx:for="{{videoList}}" data-id="{{item.id}}" wx:key="*this">
  96. <view class="head_box">
  97. <view class="user_box" catchtap="{{ifHeadTap ? 'headTap' : null}}" data-uid="{{item.uid}}">
  98. <image class="avatar" lazy-load="true" src="{{item.avatar}}" />
  99. <view class="user_right">
  100. <view class="nickname">{{item.nickName}}</view>
  101. </view>
  102. </view>
  103. <view wx:if="{{!item.showMyBtn}}" class="time">
  104. <text>发布时间:{{item.time}}</text>
  105. </view>
  106. <view wx:if="{{item.showMyBtn}}" class="my_btn">
  107. <view class="delete" catchtap="delete" data-id="{{item.id}}">
  108. <image class="delete_image" src="../../static/index/delete.png" />
  109. <text class="delete_text" >删除</text>
  110. </view>
  111. <view class="hide" catchtap="hide" data-status="{{item.status}}" data-id="{{item.id}}">
  112. <image class="hide_image" src="{{item.status==='NORMAL'? '../../static/index/hide_icon.png': '../../static/index/show_icon.png'}}" />
  113. <text class="hide_text" >{{item.status==='NORMAL'? '隐藏': '展示'}}</text>
  114. </view>
  115. </view>
  116. </view>
  117. <video
  118. id="video_{{index}}"
  119. class="video_item"
  120. loop="{{loop}}"
  121. enable-play-gesture
  122. enable-progress-gesture
  123. show-center-play-btn="{{false}}"
  124. controls="{{true}}"
  125. src="{{item.url}}"
  126. object-fit="contain"
  127. data-index="{{index}}"
  128. bindplay="onPlayList"
  129. bindended="onEndedList"
  130. >
  131. <!-- bindplay="onPlay"
  132. bindpause="onPause"
  133. bindended="onEnded"
  134. binderror="onError"
  135. bindtimeupdate="onTimeUpdate"
  136. bindwaiting="onWaiting"
  137. bindprogress="onProgress"
  138. bindloadedmetadata="onLoadedMetaData" -->
  139. </video>
  140. <view class="video_title">
  141. <text>
  142. {{item.title}}
  143. </text>
  144. </view>
  145. <view class="foot_box">
  146. <view class="foot_left">
  147. <view class="btn collect_btn" catchtap="collectTap" data-index="{{index}}" data-id="{{item.id}}" data-type="{{item.type}}">
  148. <image class="collect_btn_icon" src="{{item.isFavorite ? '../../static/index/star_colored.png' : '../../static/index/star.png'}}" />
  149. <text>收藏</text>
  150. </view>
  151. <view class="btn share_btn" bindtap="openShare" data-author="{{item.nickName}}" data-index="{{index}}" data-id="{{item.id}}" data-avatar="{{item.avatar}}" data-uid="{{item.uid}}" data-img="{{item.img}}" data-title="{{item.title}}" data-type="{{item.type}}">
  152. <image class="share_btn_icon" src="../../static/index/share.png" />
  153. <text>分享</text>
  154. </view>
  155. </view>
  156. <view class="foot_right">
  157. <view class="btn flower_btn" catchtap="{{item.isLike ? null : 'likeTap'}}" data-index="{{index}}" data-id="{{item.id}}" data-islike="{{item.isLike}}">
  158. <image class="flower_btn_icon" src="{{item.isLike ? '../../static/index/heart.png' : '../../static/index/heart.png'}}" />
  159. <text>{{item.likes}}</text>
  160. </view>
  161. <view class="btn comment_btn" catchtap="openComment" data-id="{{item.id}}">
  162. <image class="comment_btn_icon" src="../../static/index/comment.png" lazy-load="true" />
  163. <text>{{item.commentAmount}}</text>
  164. </view>
  165. </view>
  166. </view>
  167. <view class="btn_wrapper" wx:if="{{!item.noReading}}" catchtap="goToReading" data-id="{{item.classId}}">
  168. <view class="reading_btn">
  169. <image src="../../static/index/microphone.png" />
  170. <text>我要配音</text>
  171. </view>
  172. </view>
  173. </view>
  174. </view>
  175. <shareDialog id="share-dialog" shareType='works' bindShareDialogClose="shareDialogClose" shareId="{{id}}" />