1.当商品不为空时
<!-- 商品不为空 -->
<block wx:if="{{shoppingCardPrdNum==1}}">
<view class="shopping-card-top">
<view class="product-title">
<text>共{{onSalePrdList.length + saleOutPrdList.length}}个商品</text>
<view @tap="toggleOperation" class="manage">
<text hidden="{{operating}}">管理</text>
<text hidden="{{!operating}}">完成</text>
</view>
</view>
<view wx:if="{{onSalePrdList.length > 0}}" class="list-wraper">
<repeat for="{{onSalePrdList}}" key="index" index="index" item="item">
<view class="slide-item" :class="{'mb-24':(index < onSalePrdList.length-1) || saleOutPrdList.length != 0}">
<view class="delete-btn flex-container horizontal-center vertical-center" @tap="handleDeleteProduct({{item}})">
<text>删除</text>
</view>
<movable-area style="height:231rpx;" :class="{'show-left':edit_flag}">
<movable-view style="height:231rpx;" disabled="{{edit_flag}}" out-of-bounds="true" direction="horizontal" x="{{item.xmove}}"
inertia="true"
damping="40"
friction="5"
data-productIndex="{{index}}"
bind:touchstart = "touchS('onsale')"
bind:touchend = "touchE"
bindchange="handleMovableChange('onsale')">
<view @tap="jumpshoppingdetail({{item.prdId}})" class="padding-ver-30">
<view class="product-item flex-container">
<view @tap.stop="selectOnsalePrd({{item}},{{index}})" class="product-item-left flex-container horizontal-center vertical-center">
<view wx:if="{{item.buy_limit_remain!=0 || operating}}" :class="{'selected':item.selected}" class="common-radio"></view>
</view>
<orderpanel :prdData.sync="item" class="flex-one">
<view slot="prdDesc" @tap.stop="nothing" class="product-counter">
<view class="item-amount flex-container">
<view @tap.stop="reducePrdNum({{item}},{{index}})" class="counter-inner reduce" :class="{'unclickable' : item.buy_num <= 1}">-</view>
<view class="counter-inner text-amount">{{item.buy_num}}</view>
<view @tap.stop="plusPrdNum({{item}},{{index}})" class="counter-inner plus" :class="{'unclickable' : item.buy_num >= item.buy_limit_remain || item.buy_num >= item.buy_limit || item.buy_num >= item.stock_num}">+</view>
</view>
</view>
</orderpanel>
</view>
</view>
</movable-view>
</movable-area>
</view>
</repeat>
</view>
<!-- 已达最大限购数 -->
<view wx:if="{{overlimitPrdList.length > 0}}" class="sale-out-title">
<text>已达最大限购数</text>
<view @tap="clearOverlimitPrd" hidden="{{!operating}}" class="clear-sale-out">清空已购商品</view>
</view>
<view wx:if="{{overlimitPrdList.length > 0}}" class="list-wraper">
<repeat for="{{overlimitPrdList}}" key="index" index="index" item="item">
<view class="slide-item mb-1">
<view class="delete-btn flex-container horizontal-center vertical-center" @tap="handleDeleteProduct({{item}})">
<text>删除</text>
</view>
<movable-area style="height:231rpx;">
<movable-view style="height:231rpx;" out-of-bounds="true" direction="horizontal" x="{{item.xmove}}"
inertia="true"
damping="40"
friction="5"
data-productIndex="{{index}}"
bind:touchstart = "touchS('overlimit')"
bind:touchend = "touchE"
bindchange="handleMovableChange('overlimit')">
<view @tap="jumpshoppingdetail({{item.prdId}})" class="product-item flex-container padding-ver-30">
<view @tap.stop="selectOverlimitPrd({{item}},{{index}})" class="product-item-left flex-container horizontal-center vertical-center">
<view hidden="{{!operating}}" :class="{'selected':item.selected}" class="common-radio"></view>
</view>
<orderpanel :prdData.sync="item" :isSaleOut.sync="true" class="flex-one">
<view slot="prdState" class="sale-out-icon">已购</view>
<view slot="prdDesc" class="sale-out-text">已达最大限购数</view>
</orderpanel>
</view>
</movable-view>
</movable-area>
</view>
</repeat>
</view>
<!-- 已售罄 -->
<view wx:if="{{saleOutPrdList.length > 0}}" class="sale-out-title">
<text>已售罄</text>
<view @tap="clearSaleoutPrd" hidden="{{!operating}}" class="clear-sale-out">清空售罄商品</view>
</view>
<view wx:if="{{saleOutPrdList.length > 0}}" class="list-wraper">
<repeat for="{{saleOutPrdList}}" key="index" index="index" item="item">
<view class="slide-item mb-1">
<view class="delete-btn flex-container horizontal-center vertical-center" @tap="handleDeleteProduct({{item}})">
<text>删除</text>
</view>
<movable-area style="height:231rpx;">
<movable-view style="height:231rpx;" out-of-bounds="true" direction="horizontal" x="{{item.xmove}}"
inertia="true"
damping="40"
friction="5"
data-productIndex="{{index}}"
bind:touchstart = "touchS('saleout')"
bind:touchend = "touchE"
bindchange="handleMovableChange('saleout')">
<view @tap="jumpshoppingdetail({{item.prdId}})" class="product-item flex-container padding-ver-30">
<view @tap.stop="selectSaleoutPrd({{item}},{{index}})" class="product-item-left flex-container horizontal-center vertical-center">
<view hidden="{{!operating}}" :class="{'selected':item.selected}" class="common-radio"></view>
</view>
<orderpanel :prdData.sync="item" :isSaleOut.sync="true" class="flex-one">
<view slot="prdState" class="sale-out-icon">售罄</view>
<view slot="prdDesc" class="sale-out-text">已售罄</view>
</orderpanel>
</view>
</movable-view>
</movable-area>
</view>
</repeat>
</view>
</view>
<view class="shopping-card-bottom">
<view class="left flex-container">
<view @tap="selectAll" class="left-part1 flex-container vertical-center" :class="{'hidden':!operating&&onSalePrdList.length==0}">
<view :class="{'selected':selectAllFlag}" class="radio-all"></view><text class="select-all-text">全选</text>
</view>
<view hidden="{{operating}}" class="left-part2">
<view class="left-part2-top"><text>实付</text><text style="padding-left:18rpx;">¥ {{actuallyPay}}</text></view>
<view class="left-part2-bottom">
<text>原价¥<text style="text-decoration:line-through;">{{originalPrice}}</text></text>
<text style="padding-left:12rpx;">补贴¥{{discount}}</text>
<text wx:if="{{freight>0}}" style="padding-left:12rpx;">邮费¥{{freight}}</text>
<text wx:if="{{freight==0}}" style="padding-left:12rpx;">包邮</text>
</view>
</view>
</view>
<view @tap="handleOperation" class="right" :class="{'delete': operating}">
<text hidden="{{operating}}">结算 ({{userSelectPrdNum}})</text>
<text hidden="{{!operating}}">删除所选</text>
</view>
</view>
</block>
商品为空时
<view wx:if="{{shoppingCardPrdNum == 0}}" class="no-order-wraper">
<image class="no-order-icon" src="https://try.fishqc.com/img/no.png"></image>
<view class="no-order-title">购物车空空如也，去逛逛吧~</view>
<!-- <view class="no-order-desc">可以去看看有哪些想买的</view> -->
<!-- <view class="normal-btn" @tap="toIndex">去逛逛</view> -->
<view wx:if="{{guessdata.length > 0 }}">
<view class="jianxi"></view>
<view class="reporttitle center">猜你喜欢</view>
<view class="navcontain">
<view class="productlist">
<repeat for="{{guessdata}}" key="index" index="index" item="aitem">
<purchaselist :item="aitem" :listtype="1"></purchaselist>
</repeat>
<view wx:if="{{guessmoretap}}" class="center maincolor morebtn" @tap="fetchproductlist(1)"><text>查看更多</text></view>
<!-- <view wx:if="{{!guessmoretap}}" class="center maincolor morebtn"><text>暂无更多数据了</text></view> -->
</view>
</view>
</view>
</view>
2.js部分
shoppingCardPrdNum: 2, //1代表购物车有数据，0代表购物车没有数据
fetchShoppingCardList(){
return new Promise((resolve, reject) => {
this.$parent.getshoppingCardData(true).then((res) => {
// console.log(res)
if(res.data.code == 200){
this.isLogin = true
this.onSalePrdList = res.data.data.onsale.map((elem,index) => {
if(elem.img){
elem.img = JSON.parse(elem.img)
}
elem.buy_limit = Number(elem.buy_limit)
elem.buy_limit_remain = Number(elem.buy_limit_remain)
elem.buy_num = Number(elem.buy_num)
elem.original_price = JSON.parse(elem.original_price)
elem.price = JSON.parse(elem.price)
elem.stock_num = Number(elem.stock_num)
if(elem.freight){
elem.freight = JSON.parse(elem.freight)
}
if(this.selectPrdIdList.has(elem.prdId)){
elem.selected = true
}else{
elem.selected = false
}
return elem
})
if(res.data.data.overlimit && res.data.data.overlimit.length > 0){
this.overlimitPrdList = res.data.data.overlimit.map((elem,index) => {
if(elem.img){
elem.img = JSON.parse(elem.img)
}
if(this.selectPrdIdList.has(elem.prdId)){
elem.selected = true
}else{
elem.selected = false
}
return elem
})
}
this.saleOutPrdList = res.data.data.sellout.map((elem,index) => {
if(elem.img){
elem.img = JSON.parse(elem.img)
}
if(this.selectPrdIdList.has(elem.prdId)){
elem.selected = true
}else{
elem.selected = false
}
return elem
})
// 把售罄的商品从用户选择列表剔除
if(this.selectPrdIdList.size > 0 && this.saleOutPrdList.length > 0){
this.saleOutPrdList.forEach(elem => {
if(this.selectPrdIdList.has(elem.prdId)){
this.selectPrdIdList.delete(elem.prdId)
}
});
}
// 把超出购买限制的商品从用户选择列表剔除
if(this.selectPrdIdList.size > 0 && this.overlimitPrdList.length > 0){
this.overlimitPrdList.forEach(elem => {
if(this.selectPrdIdList.has(elem.prdId)){
this.selectPrdIdList.delete(elem.prdId)
}
});
}
this.$nextTick(() => {
resolve(res)
})
this.shoppingCardPrdNum = 1
}
else if(res.data.code == 204){
//没有数据
this.isLogin = true
this.onSalePrdList = []
this.saleOutPrdList = []
this.overlimitPrdList = []
this.shoppingCardPrdNum = 0
//获取 猜你喜欢数据
this.fetchproductlist(0);
resolve(res)
}
else if(res.data.code == 401){
//需要登录
this.onSalePrdList = []
this.saleOutPrdList = []
this.overlimitPrdList = []
this.isLogin = false
resolve(res)
}
else{
this.$parent.toasttips(res.data.message)
resolve(res)
}
this.$apply()
}).catch((err) => {
reject(err)
});
})
}