GululuQ-mp/components/addCartModel/addCartModel.wxml

<!--components/addCartModel/addCartModel.wxml-->
<view class="modal-container {{visible ? 'modal-show' : ''}}">
  <view class="modal-mask" bindtap="handleClose"></view>
  <view class="modal-content">
    <!-- 头部关闭按钮 -->
    <view class="modal-header">
      <text class="title">选择规格</text>
      <text class="close-btn" bindtap="handleClose">×</text>
    </view>
    
    <!-- 商品信息 -->
    <view class="product-info">
      <image class="product-image" src="{{productDetail.prodPicList[0].picUrl}}" mode="aspectFill"></image>
      <view class="product-detail">
        <view class="prodName">{{productDetail.prodName}}</view>
        <view class="product-attr">
            <text class="price">¥{{productDetail.prodAttrList[selectIndex].prodAttrPrice.price}}</text>
            <text class="stock">剩余：{{productDetail.prodAttrList[selectIndex].availQty}}</text>
        </view>
      </view>
    </view>

    <!-- 数量选择 -->
    <view class="quantity-section">
      <view class="quantity-title">购买数量</view>
      <view class="quantity-control">
        <text class="btn-minus" bindtap="decreaseQuantity" disabled="{{quantity <= 1}}">-</text>
        <input class="quantity-input" type="number" value="{{quantity}}" disabled />
        <text class="btn-plus" bindtap="increaseQuantity" disabled="{{quantity >= productDetail.stock}}">+</text>
      </view>
    </view>
    
    <!-- 规格选择 -->
    <view class="spec-section">
      <text class="spec-title">规格</text>
      <view class="spec-option">
        <text class="spec-name {{index === selectIndex?'selected':''}}" data-index="{{index}}" wx:for="{{productDetail.prodAttrList}}" wx:key="name" bindtap="selectSpec">{{item.attrName}}</text>
      </view>
    </view>
    
    
    <!-- 底部按钮 -->
    <view class="footer">
      <button class="add-btn" bindtap="handleAddToCart">{{product.buy?"立即购买":"加入购物车"}}</button>
    </view>
  </view>
</view>