购物车为空
This commit is contained in:
		
							parent
							
								
									b75ab6fdef
								
							
						
					
					
						commit
						d7edb99ffa
					
				@ -1,26 +1,33 @@
 | 
				
			|||||||
<template>
 | 
					<template>
 | 
				
			||||||
  <view class="cart">
 | 
					  <view class="cart">
 | 
				
			||||||
    <view class="cart_item" v-for="(item, index) in cartList" :key="item.goods_id">
 | 
					      <block v-if="cartList.length !== 0">
 | 
				
			||||||
      <!-- 1. 选择按钮 -->
 | 
					        <view class="cart_item" v-for="(item, index) in cartList" :key="item.goods_id">
 | 
				
			||||||
      <radio class="cart_item_radio" @tap="itemSelectChangeHandle(item.goods_id)" :checked="item.goods_select" color="#e03440" />
 | 
					            <!-- 1. 选择按钮 -->
 | 
				
			||||||
      <!-- 2. 商品组件 -->
 | 
					            <radio class="cart_item_radio" @tap="itemSelectChangeHandle(item.goods_id)" :checked="item.goods_select" color="#e03440" />
 | 
				
			||||||
      <goodsItem :item="item" />
 | 
					            <!-- 2. 商品组件 -->
 | 
				
			||||||
      <!-- 3. 计数器 -->
 | 
					            <goodsItem :item="item" />
 | 
				
			||||||
      <view class="count">
 | 
					            <!-- 3. 计数器 -->
 | 
				
			||||||
        <view @tap="itemChangeCount(index, -1)" class="count_btn iconfont icon-jianshao"></view>
 | 
					            <view class="count">
 | 
				
			||||||
        <text class="count_text">{{ item.goods_count }}</text>
 | 
					                <view @tap="itemChangeCount(index, -1)" class="count_btn iconfont icon-jianshao"></view>
 | 
				
			||||||
        <view @tap="itemChangeCount(index, 1)" class="count_btn iconfont icon-zengjia"></view>
 | 
					                <text class="count_text">{{ item.goods_count }}</text>
 | 
				
			||||||
      </view>
 | 
					                <view @tap="itemChangeCount(index, 1)" class="count_btn iconfont icon-zengjia"></view>
 | 
				
			||||||
    </view>
 | 
					            </view>
 | 
				
			||||||
 | 
					            </view>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    <!-- 底部结算栏 -->
 | 
					            <!-- 底部结算栏 -->
 | 
				
			||||||
    <view class="bottom">
 | 
					            <view class="bottom">
 | 
				
			||||||
      <radio @tap="selectAllChange" :checked="selectAll" color="#E03440" class="select_btn" />
 | 
					            <radio @tap="selectAllChange" :checked="selectAll" color="#E03440" class="select_btn" />
 | 
				
			||||||
      <text class="select_text">全选</text>
 | 
					            <text class="select_text">全选</text>
 | 
				
			||||||
      <text class="total_text">合计:</text>
 | 
					            <text class="total_text">合计:</text>
 | 
				
			||||||
      <text class="price">{{totalPrice}}</text>
 | 
					            <text class="price">{{totalPrice}}</text>
 | 
				
			||||||
      <view @tap="goToPay" class="bottom_btn" :class="{disable: totalCount === 0}">去结算({{totalCount}})</view>
 | 
					            <view @tap="goToPay" class="bottom_btn" :class="{disable: totalCount === 0}">去结算({{totalCount}})</view>
 | 
				
			||||||
    </view>
 | 
					        </view>
 | 
				
			||||||
 | 
					      </block>
 | 
				
			||||||
 | 
					      <!-- 如果购物车为空 -->
 | 
				
			||||||
 | 
					      <view v-else class="cart_empty">
 | 
				
			||||||
 | 
					          <image class="cart_empty_image" mode="widthFix" src="/static/cart_empty_image.gif" />
 | 
				
			||||||
 | 
					          <navigator class="cart_empty_button" url="/pages/index/index" open-type="switchTab">去首页看看</navigator>
 | 
				
			||||||
 | 
					      </view>
 | 
				
			||||||
  </view>
 | 
					  </view>
 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -198,4 +205,28 @@ export default {
 | 
				
			|||||||
    }
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.cart_empty {
 | 
				
			||||||
 | 
					  width: 100vw;
 | 
				
			||||||
 | 
					  height: 100vh;
 | 
				
			||||||
 | 
					  display: flex;
 | 
				
			||||||
 | 
					  justify-content: center;
 | 
				
			||||||
 | 
					  align-items: center;
 | 
				
			||||||
 | 
					  flex-direction: column;
 | 
				
			||||||
 | 
					  .cart_empty_image {
 | 
				
			||||||
 | 
					    width: 400rpx;
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  .cart_empty_button {
 | 
				
			||||||
 | 
					    margin-top: 20rpx;
 | 
				
			||||||
 | 
					    width: 400rpx;
 | 
				
			||||||
 | 
					    height: 60rpx;
 | 
				
			||||||
 | 
					    display: flex;
 | 
				
			||||||
 | 
					    justify-content: center;
 | 
				
			||||||
 | 
					    align-items: center;
 | 
				
			||||||
 | 
					    background-color: #ea4350;
 | 
				
			||||||
 | 
					    color: #fff;
 | 
				
			||||||
 | 
					    border-radius: 30rpx;
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
							
								
								
									
										
											BIN
										
									
								
								src/static/cart_empty_image.gif
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/static/cart_empty_image.gif
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 96 KiB  | 
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user