| | |
| | | <template> |
| | | <view class="cart"> |
| | | <template v-if="list.length > 0"> |
| | | <u-swipe-action> |
| | | <u-swipe-action-item :options="options" v-for="(item, index) in list" :name="index" :key="item.id" @click="deleRow" ref="item"> |
| | | <view class="cart-item" @click="jumpDetails(item.goodsId, item.status)"> |
| | | <view class="cart-item-check" @click.stop="select(index)"> |
| | | <view class="cart-item" @click="jumpDetails(index)"> |
| | | <view class="cart-item-check" @click.stop="select(index)" v-if="item.status !== 1"> |
| | | <image src="/static/icon/ic_agree@2x.png" mode="widthFix" v-if="!item.active"></image> |
| | | <image src="/static/icon/cart_ic_sel@2x.png" mode="widthFix" v-else></image> |
| | | </view> |
| | | <view class="cart-item-check" v-else> |
| | | <view class="cart-item-check-yuan"></view> |
| | | </view> |
| | | <view class="cart-item-image"> |
| | | <view class="cart-item-image-xj" v-if="item.status === 1">商品下架</view> |
| | | <image :src="item.imgUrl" mode="widthFix"></image> |
| | | </view> |
| | | <view class="cart-item-info"> |
| | | <view class="title">{{item.goodsName}}</view> |
| | | <view class="title" :style="{ color: item.status === 1 ? '#999999' : '' }">{{item.goodsName}}</view> |
| | | <view class="bottom"> |
| | | <view class="bottom-price"> |
| | | <view class="bottom-price" v-if="item.status !== 1"> |
| | | <text>{{item.price[0]}}</text> |
| | | <text>.{{item.price[1]}}</text> |
| | | </view> |
| | | <u-number-box v-model="item.num" @change.stop="changeNum(index)"></u-number-box> |
| | | <view class="bottom-price1" v-else> |
| | | <text>{{item.price[0]}}</text> |
| | | <text>.{{item.price[1]}}</text> |
| | | </view> |
| | | <u-number-box v-model="list[index].num" @change.stop="changeNum(index)" v-if="item.status !== 1"></u-number-box> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </u-swipe-action-item> |
| | | </u-swipe-action> |
| | | </template> |
| | | <template v-else> |
| | | <view class="wushuju"> |
| | | <image src="/static/images/default_nodata_white.png" mode="widthFix"></image> |
| | | </view> |
| | | </template> |
| | | <view style="width: 100%; height: calc(env(safe-area-inset-bottom) + 108rpx);"></view> |
| | | <view class="footer"> |
| | | <view class="edit"> |
| | | <view class="edit-left" @click="quanxuan"> |
| | |
| | | totalPrice() { |
| | | let price = 0 |
| | | this.list.forEach((item, index) => { |
| | | if (item.active) { |
| | | price += Number(item.price[0] + '.' +item.price[1]) |
| | | if (item.active && item.status !== 1) { |
| | | price += Number(item.price[0] + '.' +item.price[1]) * item.num |
| | | } |
| | | }) |
| | | return price.toFixed(2).split('.') |
| | |
| | | onLoad() { |
| | | this.getList() |
| | | uni.$on('shuaxin', () => { |
| | | this.next = true |
| | | this.page = 1 |
| | | this.list = [] |
| | | this.getList() |
| | | }) |
| | | }, |
| | | onReachBottom() { |
| | | this.getList() |
| | | }, |
| | | methods: { |
| | | jumpDetails(id, status) { |
| | | if (status === 1) return uni.showToast({ |
| | | title: '商品已下架', |
| | | icon: 'none' |
| | | }) |
| | | jumpDetails(index) { |
| | | uni.navigateTo({ |
| | | url: '/pages/details/details?id=' + id |
| | | url: '/pages/details/details?id=' + this.list[index].goodsId |
| | | }) |
| | | }, |
| | | jiesuan() { |
| | | let arr = this.list.filter(item => item.active) |
| | | let arr = this.list.filter(item => { |
| | | if (item.active && item.status !== 1) { |
| | | return item |
| | | } |
| | | }) |
| | | if (arr.length === 0) return uni.showToast({ |
| | | title: '至少选择一项商品', |
| | | icon: 'none' |
| | |
| | | }, |
| | | // 全选 |
| | | quanxuan() { |
| | | if (this.selectAll) { |
| | | this.list.forEach((item) => { |
| | | item.active = false |
| | | }) |
| | | } else { |
| | | this.list.forEach((item) => { |
| | | item.active = true |
| | | }) |
| | | } |
| | | }, |
| | | // 单选 |
| | | select(index) { |
| | |
| | | }, |
| | | // 更新商品数量 |
| | | changeNum(index) { |
| | | console.log(index) |
| | | this.$u.api.updateNum({ |
| | | id: this.list[index].shopCartId, |
| | | memberId: this.userInfo.id, |
| | |
| | | .then(res => { |
| | | if (res.code === 200) { |
| | | this.list.splice(e.name, 1) |
| | | that.$refs.item.forEach(item => item.closeHandler(true)) |
| | | this.$refs.item.forEach(item => item.closeHandler(true)) |
| | | } |
| | | }) |
| | | }, |
| | |
| | | padding: 30rpx 0; |
| | | box-sizing: border-box; |
| | | |
| | | .wushuju { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | margin-top: 200rpx; |
| | | image { |
| | | width: 320rpx; |
| | | height: 320rpx; |
| | | } |
| | | } |
| | | |
| | | .footer { |
| | | width: 100%; |
| | | position: fixed; |
| | | bottom: 0; |
| | | left: 0; |
| | | padding: 0 30rpx; |
| | | z-index: 999; |
| | | box-sizing: border-box; |
| | | box-shadow: 0rpx -2rpx 4rpx 0rpx rgba(0,0,0,0.06); |
| | | background-color: #ffffff; |
| | |
| | | height: 40rpx; |
| | | margin-right: 30rpx; |
| | | |
| | | .cart-item-check-yuan { |
| | | width: 40rpx; |
| | | height: 40rpx; |
| | | background: #EEEEEE; |
| | | border-radius: 50%; |
| | | border: 2rpx solid #E5E5E5; |
| | | } |
| | | |
| | | image { |
| | | width: 100%; |
| | | } |
| | |
| | | justify-content: space-between; |
| | | |
| | | .title { |
| | | width: 100%; |
| | | display: -webkit-box; |
| | | -webkit-box-orient: vertical; |
| | | -webkit-line-clamp: 2; |
| | | overflow: hidden; |
| | | font-weight: 400; |
| | | font-size: 28rpx; |
| | | color: #111111; |
| | |
| | | } |
| | | } |
| | | } |
| | | .bottom-price1 { |
| | | display: flex; |
| | | align-items: baseline; |
| | | justify-content: space-between; |
| | | |
| | | text { |
| | | &:nth-child(1) { |
| | | font-weight: 500; |
| | | font-size: 32rpx; |
| | | color: #999999; |
| | | |
| | | &::before { |
| | | content: '¥'; |
| | | font-weight: 500; |
| | | font-size: 24rpx; |
| | | color: #999999; |
| | | } |
| | | } |
| | | |
| | | &:nth-child(2) { |
| | | font-weight: 500; |
| | | font-size: 24rpx; |
| | | color: #999999; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |