123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- <view style="background: #f5f5f5; padding: 20rpx 0;">
- <view class="container">
- <!-- 购物车标题 -->
- <view class="cart-header">
- <text style="font-size: 36rpx;">购物车 <text style="font-size: 24rpx;">({{cartItems.length}})</text></text>
- <view class="search-bar">
- <input class="search-input" placeholder="搜索购物车商品" />
- <image class="search-icon" src="{{souimg}}" />
- </view>
- <button class="manage-btn">管理</button>
- </view>
- <!-- 商品列表 -->
- <view class="cart-items">
- <block wx:for="{{cartItems}}" wx:key="index">
- <view class="cart-item">
- <checkbox-group bindchange="handleCheckboxChange">
- <label class="cart-checkbox">
- <checkbox value="{{item.id}}" checked="{{item.checked}}" />
- </label>
- </checkbox-group>
- <image class="cart-image" src="{{item.image}}" mode="aspectFill"></image>
- <view class="cart-info">
- <view class="cart-title">{{item.title}}</view>
- <view class="cart-description">{{item.description}}</view>
- <view class="cart-price">¥{{item.price}}</view>
- <view>
- <van-stepper
- value="{{item.quantity}}"
- data-id="{{item.id}}"
- bind:change="onChange"
- />
- </view>
- </view>
- </view>
- </block>
- </view>
- <!-- 底部工具栏 -->
- <view class="cart-footer">
- <view style="display: flex; align-items: center;">
- <checkbox-group bindchange="handleAllCheckboxChange">
- <label class="all-checkbox">
- <checkbox value="all" checked="{{allChecked}}" />全选
- </label>
- </checkbox-group>
- </view>
- <view style="display: flex; align-items: center;">
- <view class="total-price">合计:¥{{totalPrice}}</view>
- <button class="checkout-btn" bindtap="handleCheckout">结算</button>
- </view>
- </view>
- </view>
- </view>
|