<view class="container">
    <view class="header">
        <text class="title">优惠券中心</text>
    </view>
    
    <!-- VIP Banner -->
    <view class="vip-banner" wx:if="{{!user.phone}}">
        <view class="vip-info">
            <view class="vip-title">VIP会员权益</view>
            <view class="vip-desc">开通会员享受更多优惠</view>
        </view>
        <button class="vip-btn" bindtap="goToProfile">立即开通</button>
    </view>


    <!-- Coupon List -->
    <view class="section-title">{{user.phone ? '可使用的优惠券' : '可领取的优惠券'}}</view>
    <view class="coupon-list" style="{{!user.phone ? 'filter: grayscale(100%); opacity: 0.6;' : ''}}">
        <block wx:for="{{coupons}}" wx:key="id">
            <view class="coupon-card {{item.status === 'used' ? 'used' : ''}}" bindtap="handleCouponClick" data-id="{{item.id}}" data-status="{{item.status}}">
                <view class="limit-tag" wx:if="{{item.is_time_limited}}">限时</view>
                <view class="coupon-left">
                    <view class="amount">
                        <text class="num">{{item.amount}}</text>
                        <text class="unit">{{item.unit}}</text>
                    </view>
                    <view class="info">
                        <view class="coupon-name">{{item.title}}</view>
                        <view class="coupon-desc">{{item.displayDesc}}</view>
                    </view>
                </view>
                <view class="coupon-right">
                    <view class="btn-text" wx:if="{{item.status === 'can_claim'}}">立即领取</view>
                    <view class="btn-text" wx:elif="{{item.status === 'assigned'}}">去使用</view>
                    <view class="btn-text" wx:elif="{{item.status === 'used'}}">已使用</view>
                    <view class="btn-text" wx:elif="{{item.status === 'expired'}}">已过期</view>
                    <view class="btn-text" wx:else>去使用</view>
                    <text class="expiry-date" wx:if="{{item.expiry}}">{{item.expiry}}到期</text>
                </view>
            </view>
        </block>
    </view>
</view>
