<!--pages/userCenter.wxml-->
<view class='page-coupons'>
	<view class="swiper-tab">
		<view class="swiper-tab-item {{currentTab==0?'active':''}}" data-current="0" bindtap="clickTab">可使用 ({{totalElements}})</view>
		<view class="swiper-tab-item {{currentTab==1?'active':''}}" data-current="1" bindtap="clickTab">已失效 ({{invalidTotalElements}})</view>
	</view>
	<!--bindchange="swiperTab"-->
	<swiper current="{{currentTab}}" duration="300" bindchange="swiperTab">
			<swiper-item>
					<scroll-view scroll-y wx:if="{{couponList.length}}" bindscrolltolower="onBottom">
						<view class='coupon-wrap'>
							<view
							class='coupon-list'
							wx:for="{{couponList}}"
							wx:for-item="item"
							wx:for-index="k"
							wx:key="{{k}}">
								<view data-title="{{item.title}}" 
                data-cardNo="{{item.cardNo}}" data-id="{{item.couponId}}" bindtap="handelPresentCouponDetail">
									<image class='coupon-bg' src='/assets/imgs/coupon-bg.png'/>
                    <view class='coupon-img' >
                      <image wx:if="{{item.takeCouponBgimg}}" class='coupon-bg' src='{{item.takeCouponBgimg}}' />
                      <image wx:else src='/assets/imgs/qr-code.png' />
                    </view>
                    <view class='coupon-info'>
                      <view class='coupon-name fs-28'>{{item.title}}</view>
                      <view class='coupon-time fs-24'>{{item.startTime}} 至 {{item.endTime}}</view>
                      <!-- <view class='coupon-desc fs-24'>{{item.notice}}</view> -->
                    </view>
									<view class='coupon-code fs-24' data-cardNo="{{item.cardNo}}" catchtap="handelPresentCouponCode">出示劵码</view>
								</view>
							</view>
						</view>
						<no-more wx:if="{{noMoreCoupon}}" />
					</scroll-view>
					<view class='empty-wrap' wx:if="{{!couponList.length}}">
						<view class='empty-info'>
							<image class='empty-img' src='/assets/imgs/empty-coupon.png' />
							<view class='empty-text'>没有任何卡劵</view>
						</view>
					</view>
			</swiper-item>
			<swiper-item>
					<scroll-view scroll-y wx:if="{{invalidCouponList.length}}">
            <view class='invalid-coupon-tips'>只显示最近20张已失效优惠券</view>
            <view class='coupon-wrap'>
              <view
                class='coupon-list'
                wx:for="{{invalidCouponList}}"
                wx:for-item="item"
                wx:for-index="k"
                wx:key="{{k}}">
                  <view class='invalid-coupon' />
                  <!--5 已使用  !5 过期-->
                  <image wx:if="{{item.status == 5}}" src='/assets/imgs/invalid.png' class='invalid-img' />
                  <image wx:else src='/assets/imgs/expired.png' class='invalid-img' />
                    <image class='coupon-bg' src='/assets/imgs/coupon-bg.png' />
                    <view class='coupon-img'>
                      <image wx:if="{{item.takeCouponBgimg}}" class='coupon-bg' src='{{item.takeCouponBgimg}}' />
                      <image wx:else src='/assets/imgs/qr-code.png' />
                    </view>
                    <view class='coupon-info'>
                      <view class='coupon-name fs-28'>{{item.title}}</view>
                      <view class='coupon-time fs-24'>{{item.startTime}} 至 {{item.endTime}}</view>
                      <!-- <view class='coupon-desc fs-24'>{{item.notice}}</view> -->
                    </view>
                    <view class='coupon-code fs-24'>出示劵码</view>
                </view>
            </view>
            <no-more wx:if="{{noMoreCouponInvalid}}" />
					</scroll-view>
	
					<view class='empty-wrap' wx:if="{{!invalidCouponList.length}}">
						<view class='empty-info'>
							<image class='empty-img' src='/assets/imgs/empty-coupon.png' />
							<view class='empty-text'>没有任何卡劵</view>
						</view>
					</view>
			</swiper-item>
	</swiper>
</view>

