select-goods.wxml 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <!--module/order/pages/select-goods/select-goods.wxml-->
  2. <t-navbar title="选择商品" left-arrow />
  3. <scroll-view class="page-scroll__container" type="list" scroll-y style="{{containerStyle}}">
  4. <view class="info-box"></view>
  5. <!-- 商品列表 -->
  6. <view class="goods-list" wx:for="{{goodsList}}" wx:key="category">
  7. <!-- 分类标题 -->
  8. <view class="category-title">{{item.category}}</view>
  9. <!-- 商品项 -->
  10. <view class="goods-item" wx:for="{{item.goods}}" wx:for-item="goods" wx:for-index="goodsIndex" wx:key="id">
  11. <!-- 复选框 -->
  12. <view class="goods-checkbox">
  13. <t-checkbox checked="{{goods.checked}}" bind:change="onGoodsCheckChange" data-category-index="{{index}}" data-goods-index="{{goodsIndex}}" style="padding:0" />
  14. </view>
  15. <!-- 商品图片 -->
  16. <image class="goods-image" src="{{goods.image}}" mode="aspectFill" />
  17. <!-- 商品信息 -->
  18. <view class="goods-info">
  19. <view class="goods-name-row">
  20. <text class="goods-name">{{goods.name}}</text>
  21. </view>
  22. <view class="goods-desc" wx:if="{{goods.description}}">{{goods.description}}</view>
  23. <view class="goods-price-row">
  24. <text class="goods-price">¥{{goods.price}}</text>
  25. <!-- 0元商品只显示数量1,非0元商品显示数量选择器 -->
  26. <view wx:if="{{goods.price === 0}}" class="quantity-text">x1</view>
  27. <view wx:else class="quantity-selector">
  28. <view class="quantity-btn minus {{goods.quantity <= 1 ? 'disabled' : ''}}" bind:tap="onQuantityChange" data-category-index="{{index}}" data-goods-index="{{goodsIndex}}" data-type="minus">-</view>
  29. <input class="quantity-input" type="number" value="{{goods.quantity}}" bind:input="onQuantityInput" bind:blur="onQuantityBlur" data-category-index="{{index}}" data-goods-index="{{goodsIndex}}" />
  30. <view class="quantity-btn plus" bind:tap="onQuantityChange" data-category-index="{{index}}" data-goods-index="{{goodsIndex}}" data-type="plus">+</view>
  31. </view>
  32. </view>
  33. </view>
  34. </view>
  35. </view>
  36. <!-- 底部占位 -->
  37. <view class="footer-placeholder"></view>
  38. </scroll-view>
  39. <!-- 底部固定栏 -->
  40. <view class="footer-bar" style="padding-bottom: {{container.safeBottomOffset}}px;">
  41. <view class="footer-left">
  42. <t-checkbox checked="{{selectAll}}" bind:change="onSelectAllChange" label="全选" />
  43. </view>
  44. <view class="footer-center">
  45. <text class="footer-text">已选{{selectedCount}}件 合计: </text>
  46. <text class="footer-price">¥{{totalPrice}}</text>
  47. </view>
  48. <view class="footer-right">
  49. <view class="checkout-btn" bind:tap="onCheckout">结算</view>
  50. </view>
  51. </view>