couponList.wxml 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <view class="container">
  2. <!-- <view class="h">
  3. <view class="item {{ status == 0 ? 'active' : ''}}" bindtap="switchTab" data-index="0">
  4. <view class="txt">未使用</view>
  5. </view>
  6. <view class="item {{ status == 1 ? 'active' : ''}}" bindtap="switchTab" data-index="1">
  7. <view class="txt">已使用</view>
  8. </view>
  9. <view class="item {{ status == 2 ? 'active' : ''}}" bindtap="switchTab" data-index="2">
  10. <view class="txt">已过期</view>
  11. </view>
  12. </view> -->
  13. <van-tabs active="{{status}}" color="#09afff" bind:change="onTabChange">
  14. <van-tab title="未使用" name="0"></van-tab>
  15. <van-tab title="已使用" name="1"></van-tab>
  16. <van-tab title="已过期" name="2"></van-tab>
  17. </van-tabs>
  18. <view class="b">
  19. <view class="coupon-form" wx:if="{{status == 0}}">
  20. <view class="input-box">
  21. <input class="coupon-sn" placeholder="请输入优惠码" value="{{code}}" bindinput="bindExchange" />
  22. <van-icon name="close" class="clear-icon" wx:if="{{ code.length > 0 }}" catchtap="clearExchange" />
  23. </view>
  24. <view class="add-btn" bindtap='goExchange'>兑换</view>
  25. </view>
  26. <!-- <view class="help" wx:if="{{status == 0}}">
  27. <van-icon name="question-o" />
  28. 使用说明
  29. </view> -->
  30. <view wx:if="{{status == 0}}" class="coupon-switch-block">
  31. <view wx:for="{{typeList}}" wx:for-index="index" wx:for-item="item" wx:key="index" data-type="{{item.type}}"
  32. class="type-switch {{item.type===currentType?'active-switch':''}}" bindtap="switchType">
  33. {{item.name}}
  34. </view>
  35. </view>
  36. <scroll-view scroll-y="true" scroll-top="{{scrollTop}}" class="my-coupon-list">
  37. <!-- 未使用 -->
  38. <view wx:for="{{couponList}}" wx:for-index="index" wx:for-item="item" wx:key="id" class="my-coupon-item-valid"
  39. wx:if="{{status == 0}}">
  40. <view wx:if="{{item.type==4}}" class="marker">会员专享</view>
  41. <view class="coupon-top">
  42. <view class="coupon-top-left">
  43. <view class="coupon-value">
  44. <text wx:if="{{item.voucherType==1}}" class="{{item.type==4?'coupon-flag-member':'coupon-flag'}}">¥</text>
  45. <text class="{{item.type==4?'coupon-value-member':'coupon-value-num'}}" wx:if="{{item.voucherType==1}}">{{item.discount}}</text>
  46. <text class="{{item.type==4?'coupon-value-member':'coupon-value-num'}}" wx:if="{{item.voucherType==2}}">{{item.discount/10}}</text>
  47. <text wx:if="{{item.voucherType==2}}" class="{{item.type==4?'coupon-unit-member':'coupon-unit'}}">折</text>
  48. </view>
  49. <view class="coupon-type">
  50. <text wx:if="{{item.voucherType==1}}" style="color:#555555">满{{item.min}}可用</text>
  51. <text wx:if="{{item.voucherType==2}}" style="color:#555555">满{{item.min}}可用</text>
  52. </view>
  53. </view>
  54. <view class="coupon-top-content">
  55. <view class="coupon-valid-name">{{item.name}}</view>
  56. <view>有效期至:{{item.endTime}}</view>
  57. </view>
  58. </view>
  59. <view class="coupon-bottom">
  60. <text wx:if="{{item.desc&&item.name!=item.desc}}">{{item.desc}}</text>
  61. <text wx:else=""></text>
  62. <view class="{{item.type==4?'coupon-top-member':'coupon-top-right'}}" data-id="{{item.couponId}}" data-goodsvalue="{{item.goodsValue}}" bindtap="goService">
  63. 立即使用
  64. </view>
  65. </view>
  66. </view>
  67. <!-- 已使用 已过期 -->
  68. <view wx:for="{{couponList}}" wx:for-index="index" wx:for-item="item" wx:key="id" class="my-coupon-item"
  69. wx:if="{{status != 0}}">
  70. <view class="coupon-left">
  71. <view wx:if="{{item.voucherType==1}}">¥<text class="coupon-amount">{{item.discount}}</text></view>
  72. <view wx:if="{{item.voucherType==2}}"><text class="coupon-amount">{{item.discount/10}}</text>折</view>
  73. <view class="coupon-type">
  74. <!-- {{item.name}} -->
  75. <span wx:if="{{item.voucherType==1}}">立减券</span>
  76. <span wx:if="{{item.voucherType==2}}">折扣券</span>
  77. </view>
  78. <view wx:if="{{status==0}}" class="coupon-btn {{item.status===0?'active-btn':''}}" data-id="{{item.couponId}}"
  79. data-goodsvalue="{{item.goodsValue}}" bindtap="goService">立即使用</view>
  80. </view>
  81. <view class="coupon-content">
  82. <view class="coupon-name">{{item.name}}</view>
  83. <view class="coupon-date">有效期开始:{{item.startTime}}</view>
  84. <view class="coupon-date">有效期结束:{{item.endTime}}</view>
  85. </view>
  86. <view class="coupon-right">
  87. <image class="coupon-status" mode="aspectFit" wx:if="{{item.status==1}}" src="/static/images/coupon-used.png">
  88. </image>
  89. <image class="coupon-status" mode="aspectFit" wx:if="{{item.status==2}}"
  90. src="/static/images/coupon-invalid.png"></image>
  91. </view>
  92. </view>
  93. <view class="page" wx:if="{{showPage}}">
  94. <view class="prev {{ page <= 1 ? 'disabled' : ''}}" bindtap="prevPage">上一页</view>
  95. <view class="next {{ (count / size) < page ? 'disabled' : ''}}" bindtap="nextPage">下一页</view>
  96. </view>
  97. </scroll-view>
  98. <!-- <scroll-view class="coupon-list" scroll-y="true" scroll-top="{{scrollTop}}">
  99. <view class="item {{ status == 0 ? 'active' : ''}}" wx:for="{{couponList}}" wx:for-index="index" wx:for-item="item" wx:key="id">
  100. <view class="tag">{{item.tag}}</view>
  101. <view class="content">
  102. <view class="left">
  103. <view class="discount">{{item.discount}}元</view>
  104. <view class="min"> 满{{item.min}}元使用</view>
  105. </view>
  106. <view class="right">
  107. <view class="name">{{item.name}}</view>
  108. <view class="time"> 有效期:{{item.startTime}} - {{item.endTime}}</view>
  109. </view>
  110. </view>
  111. <view class="condition">
  112. <text class="txt">{{item.desc}}</text>
  113. <image src="{{item.pic}}" class="icon"></image>
  114. </view>
  115. </view>
  116. <view class="page" wx:if="{{showPage}}">
  117. <view class="prev {{ page <= 1 ? 'disabled' : ''}}" bindtap="prevPage">上一页</view>
  118. <view class="next {{ (count / size) < page ? 'disabled' : ''}}" bindtap="nextPage">下一页</view>
  119. </view>
  120. </scroll-view> -->
  121. <view class="no-list" wx:if="{{couponList==0}}">没有更多了</view>
  122. </view>
  123. </view>