85 lines
3.2 KiB
Plaintext
85 lines
3.2 KiB
Plaintext
<!--积分商城页面-->
|
|
<view class="container">
|
|
<!-- 积分信息 -->
|
|
<view class="points-header">
|
|
<view class="points-info">
|
|
<text class="label">我的积分</text>
|
|
<text class="value">{{userInfo.totalPoints || 0}}</text>
|
|
</view>
|
|
<view class="points-actions">
|
|
<view class="action-btn" bindtap="goToRecords">
|
|
<image src="/images/icon-records.svg" mode="aspectFit"></image>
|
|
<text>积分记录</text>
|
|
</view>
|
|
<view class="action-btn" bindtap="goToOrders">
|
|
<image src="/images/icon-order.svg" mode="aspectFit"></image>
|
|
<text>我的订单</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 商品列表 -->
|
|
<view class="products-section">
|
|
<view class="section-title">积分好物</view>
|
|
|
|
<view class="products-grid" wx:if="{{products.length > 0}}">
|
|
<view
|
|
class="product-item"
|
|
wx:for="{{products}}"
|
|
wx:key="id"
|
|
bindtap="viewProduct"
|
|
data-product="{{item}}"
|
|
>
|
|
<image class="product-image" src="{{item.image || '/images/product-default.svg'}}" mode="aspectFill"></image>
|
|
<view class="product-info">
|
|
<text class="product-name">{{item.name}}</text>
|
|
<view class="product-meta">
|
|
<view class="points-need">
|
|
<text class="num">{{item.pointsRequired}}</text>
|
|
<text class="unit">积分</text>
|
|
</view>
|
|
<text class="stock">库存 {{item.stock}}</text>
|
|
</view>
|
|
<text class="store-name">{{item.storeName}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="empty-state" wx:else>
|
|
<image src="/images/empty-products.svg" mode="aspectFit"></image>
|
|
<text>暂无可兑换商品</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 加载更多 -->
|
|
<view wx:if="{{loading}}" class="loading-state">
|
|
<text>加载中...</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 商品详情弹窗 -->
|
|
<view class="product-modal" wx:if="{{showProductModal}}" bindtap="closeProductModal">
|
|
<view class="modal-content" catchtap="">
|
|
<image class="modal-image" src="{{currentProduct.image || '/images/product-default.svg'}}" mode="aspectFill"></image>
|
|
<view class="modal-info">
|
|
<text class="modal-name">{{currentProduct.name}}</text>
|
|
<text class="modal-desc">{{currentProduct.description || '暂无描述'}}</text>
|
|
<view class="modal-meta">
|
|
<view class="points-need">
|
|
<text class="num">{{currentProduct.pointsRequired}}</text>
|
|
<text class="unit">积分</text>
|
|
</view>
|
|
<text class="original-price" wx:if="{{currentProduct.originalPrice}}">原价 ¥{{currentProduct.originalPrice}}</text>
|
|
</view>
|
|
<view class="store-info">
|
|
<text class="store-label">兑换门店:</text>
|
|
<text class="store-name">{{currentProduct.storeName}}</text>
|
|
</view>
|
|
<text class="store-address">{{currentProduct.storeAddress}}</text>
|
|
</view>
|
|
<button class="btn-exchange" bindtap="exchangeProduct" disabled="{{userInfo.totalPoints < currentProduct.pointsRequired || currentProduct.stock <= 0}}">
|
|
{{currentProduct.stock <= 0 ? '已售罄' : userInfo.totalPoints < currentProduct.pointsRequired ? '积分不足' : '立即兑换'}}
|
|
</button>
|
|
</view>
|
|
</view>
|