index.wxml 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <view class="container">
  2. <!-- 内容区域 -->
  3. <scroll-view class="container--scroll-view" bindscrolltolower="onScrollToLower" scroll-y="{{ true }}"
  4. bindscroll="onScrollEvent" style="height: {{ scrollHeight }}px;">
  5. <!-- 砍价会场 -->
  6. <block wx:if="{{ currentTab == 0 }}">
  7. <!-- banner轮播 -->
  8. <!-- <diy-banner itemStyle="{{ banner.style }}" params="{{ banner.params }}" dataList="{{ banner.data }}"></diy-banner> -->
  9. <!-- 内容区域 -->
  10. <view class="bargain-hall">
  11. <!-- 商品列表 -->
  12. <view class="goods-item" wx:for="{{ activeList.data }}" wx:key="this">
  13. <form bindsubmit="onTargetActive" report-submit="true">
  14. <button formType="submit" class="btn-normal" data-id="{{ item.active_id }}">
  15. <view class="goods-item--container dis-flex">
  16. <!-- 商品图片 -->
  17. <view class="goods-image">
  18. <image src="{{ item.goods.goods_image }}"></image>
  19. </view>
  20. <view class="goods-info">
  21. <!-- 商品名称 -->
  22. <view class="goods-name">
  23. <text class="twolist-hidden">{{ item.goods.goods_name }}</text>
  24. </view>
  25. <!-- 参与的用户头像 -->
  26. <view wx:if="{{ item.helps_count > 0 }}" class="peoples dis-flex">
  27. <view class="user-list dis-flex">
  28. <view wx:for="{{ item.helps }}" wx:for-item="help" wx:key="this" class="user-item-avatar">
  29. <image src="{{ help.avatarUrl }}"></image>
  30. </view>
  31. </view>
  32. <view class="people__text">
  33. <text>{{ item.helps_count }}人正在砍价</text>
  34. </view>
  35. </view>
  36. <!-- 商品原价 -->
  37. <view class="goods-price">
  38. <text>¥{{ item.goods.goods_sku.goods_price }}</text>
  39. </view>
  40. <!-- 砍价低价 -->
  41. <view class="floor-price">
  42. <text class="small">最低¥</text>
  43. <text class="big">{{ item.floor_price }}</text>
  44. </view>
  45. <!-- 操作按钮 -->
  46. <view class="opt-touch">
  47. <view class="touch-btn">
  48. <text>立即参加</text>
  49. </view>
  50. </view>
  51. </view>
  52. </view>
  53. </button>
  54. </form>
  55. </view>
  56. <!-- 无数据提供的页面 -->
  57. <view wx:if="{{ !isLoading && !activeList.data.length }}">
  58. <view class="yoshop-notcont">
  59. <text class="iconfont icon-wushuju"></text>
  60. <text class="cont">亲,暂无砍价活动哦</text>
  61. </view>
  62. </view>
  63. </view>
  64. </block>
  65. <!-- 我的砍价 -->
  66. <block wx:if="{{ currentTab == 1 }}">
  67. <!-- 内容区域 -->
  68. <view class="bargain-hall">
  69. <!-- 商品列表 -->
  70. <view class="goods-item" wx:for="{{ myList.data }}" wx:key="this">
  71. <form bindsubmit="onTargetTask" report-submit="true">
  72. <button formType="submit" class="btn-normal" data-id="{{ item.task_id }}">
  73. <view class="goods-item--container dis-flex">
  74. <!-- 商品图片 -->
  75. <view class="goods-image">
  76. <image src="{{ item.goods.goods_image }}"></image>
  77. </view>
  78. <view class="goods-info">
  79. <!-- 商品名称 -->
  80. <view class="goods-name">
  81. <text class="twolist-hidden">{{ item.goods.goods_name }}</text>
  82. </view>
  83. <!-- 砍价进度 -->
  84. <view class="task-rate">
  85. <block wx:if="{{ item.status }}">
  86. <text>已砍</text>
  87. <text class="col-m">{{ item.cut_money }}</text>
  88. <text>元,</text>
  89. <text>只差</text>
  90. <text class="col-m">{{ item.surplus_money }}</text>
  91. <text>元</text>
  92. </block>
  93. <block wx:if="{{ item.is_floor }}">
  94. <text>已砍至最低</text>
  95. <text class="col-m">{{ item.floor_price }}</text>
  96. <text>元</text>
  97. </block>
  98. </view>
  99. <!-- 任务状态 -->
  100. <view class="task-status dis-flex flex-y-center">
  101. <!-- 倒计时 -->
  102. <view wx:if="{{ item.status }}" class="count-down dis-flex flex-y-center">
  103. <text class="m-r-10">剩余</text>
  104. <countdown date="{{ item.end_time }}" separator="colon" style="custom" />
  105. </view>
  106. <view wx:if="{{ !item.status }}" class="task-status__text">
  107. <text class="col-m">{{ item.is_buy ? '砍价成功' : '已结束' }}</text>
  108. </view>
  109. </view>
  110. <!-- 操作按钮 -->
  111. <view wx:if="{{ item.status }}" class="opt-touch">
  112. <view class="touch-btn">
  113. <text>继续砍价</text>
  114. </view>
  115. </view>
  116. </view>
  117. </view>
  118. </button>
  119. </form>
  120. </view>
  121. <view wx:if="{{ noMore }}" class="no-more f-28">亲, 没有更多了</view>
  122. <!-- 无数据提供的页面 -->
  123. <view wx:if="{{ !isLoading && !myList.data.length }}">
  124. <view class="yoshop-notcont">
  125. <text class="iconfont icon-wushuju"></text>
  126. <text class="cont">亲,暂未参与砍价活动哦</text>
  127. </view>
  128. </view>
  129. </view>
  130. </block>
  131. </scroll-view>
  132. <!-- 底部选项卡 -->
  133. <view class="footer-fixed dis-flex">
  134. <!-- 砍价会场 -->
  135. <view class="tabbar-item flex-box {{ currentTab == 0 ? 'item__active' : '' }}">
  136. <form bindsubmit="onToggleTab" data-index="0" report-submit="true">
  137. <button formType="submit" class="btn-normal">
  138. <view class="tabbar-item-content dis-flex flex-x-center flex-y-center">
  139. <view class="tabbar-item-icon">
  140. <text class="iconfont icon-shangcheng"></text>
  141. </view>
  142. <view class="tabbar-item-name">
  143. <text>砍价会场</text>
  144. </view>
  145. </view>
  146. </button>
  147. </form>
  148. </view>
  149. <!-- 分割线 -->
  150. <view class="tabbar-item__divider">
  151. <view class="divider-line"></view>
  152. </view>
  153. <!-- 我的砍价 -->
  154. <view class="tabbar-item flex-box {{ currentTab == 1 ? 'item__active' : '' }}">
  155. <form bindsubmit="onToggleTab" data-index="1" report-submit="true">
  156. <button formType="submit" class="btn-normal">
  157. <view class="tabbar-item-content dis-flex flex-x-center flex-y-center">
  158. <view class="tabbar-item-icon">
  159. <text class="iconfont icon-sy-yh"></text>
  160. </view>
  161. <view class="tabbar-item-name">
  162. <text>我的砍价</text>
  163. </view>
  164. </view>
  165. </button>
  166. </form>
  167. </view>
  168. </view>
  169. </view>