| | |
| | | <template> |
| | | <view class="cart"> |
| | | <u-swipe-action> |
| | | <u-swipe-action-item :options="options" v-for="(item, index) in list" :name="index" :key="index"> |
| | | <view class="cart-item"> |
| | | <view class="cart-item-check"> |
| | | <u-swipe-action-item :options="options" v-for="(item, index) in list" :name="index" :key="index" @click="deleRow"> |
| | | <view class="cart-item" @click="jumpDetails(item.goodsId, item.status)"> |
| | | <view class="cart-item-check" @click.stop="select(item)"> |
| | | <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> |
| | |
| | | <text>{{item.price[0]}}</text> |
| | | <text>.{{item.price[1]}}</text> |
| | | </view> |
| | | <u-number-box v-model="item.num"></u-number-box> |
| | | <u-number-box v-model="item.num" @change.stop="changeNum(index)"></u-number-box> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | </u-swipe-action> |
| | | <view class="footer"> |
| | | <view class="edit"> |
| | | <view class="edit-left"> |
| | | <image src="/static/icon/ic_agree@2x.png" mode="widthFix"></image> |
| | | <view class="edit-left" @click="quanxuan"> |
| | | <image src="/static/icon/cart_ic_sel@2x.png" mode="widthFix" v-if="selectAll"></image> |
| | | <image src="/static/icon/ic_agree@2x.png" mode="widthFix" v-else></image> |
| | | <text>全选</text> |
| | | </view> |
| | | <view class="edit-right"> |
| | | <view class="edit-right-label">合计:</view> |
| | | <view class="edit-right-price"> |
| | | <text>499</text> |
| | | <text>.00</text> |
| | | <text>{{totalPrice[0]}}</text> |
| | | <text>.{{totalPrice[1]}}</text> |
| | | </view> |
| | | <view class="edit-right-btn">结算</view> |
| | | <view class="edit-right-btn" @click="jiesuan">结算</view> |
| | | </view> |
| | | </view> |
| | | <view style="width: 100%; height: env(safe-area-inset-bottom);"></view> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapState } from 'vuex' |
| | | export default { |
| | | computed: { |
| | | ...mapState(['userInfo']), |
| | | totalPrice() { |
| | | let price = 0 |
| | | this.list.forEach((item, index) => { |
| | | if (item.active) { |
| | | price += Number(item.price[0] + '.' +item.price[1]) |
| | | } |
| | | }) |
| | | return price.toFixed(2).split('.') |
| | | }, |
| | | // 全选 |
| | | selectAll() { |
| | | let open = true |
| | | if (this.list.length > 0) { |
| | | this.list.forEach(item => { |
| | | if (!item.active) { |
| | | open = false |
| | | } |
| | | }) |
| | | return open; |
| | | } else { |
| | | return false; |
| | | } |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | value: 1, |
| | |
| | | this.getList() |
| | | }, |
| | | methods: { |
| | | jumpDetails(id, status) { |
| | | if (status === 1) return uni.showToast({ |
| | | title: '商品已下架', |
| | | icon: 'none' |
| | | }) |
| | | uni.navigateTo({ |
| | | url: '/pages/details/details?id=' + id |
| | | }) |
| | | }, |
| | | jiesuan() { |
| | | let arr = this.list.filter(item => item.active) |
| | | if (arr.length === 0) return uni.showToast({ |
| | | title: '至少选择一项商品', |
| | | icon: 'none' |
| | | }) |
| | | for (let i = 0; i < arr.length; i++) { |
| | | if (arr[i].status === 1) { |
| | | return uni.showToast({ |
| | | title: '请先删除已下架的商品', |
| | | icon: 'none' |
| | | }) |
| | | } |
| | | } |
| | | let shop = arr.map(item => { |
| | | return { |
| | | goodsNum: item.num, |
| | | goodsSkuId: item.goodsSkuId |
| | | } |
| | | }) |
| | | uni.setStorageSync('shop', shop) |
| | | uni.navigateTo({ |
| | | url: '/pages/confirm-order/confirm-order' |
| | | }) |
| | | }, |
| | | // 全选 |
| | | quanxuan() { |
| | | this.list.forEach((item) => { |
| | | item.active = true |
| | | }) |
| | | }, |
| | | // 单选 |
| | | select(item) { |
| | | item.active = !item.active |
| | | }, |
| | | // 更新商品数量 |
| | | changeNum(index) { |
| | | this.$u.api.updateNum({ |
| | | id: this.list[index].shopCartId, |
| | | memberId: this.userInfo.id, |
| | | num: this.list[index].num |
| | | }) |
| | | }, |
| | | deleRow(e) { |
| | | this.$u.api.deleteBatch({ ids: this.list[e.name].shopCartId }) |
| | | .then(res => { |
| | | if (res.code === 200) { |
| | | this.list.splice(e.name, 1) |
| | | } |
| | | }) |
| | | }, |
| | | getList() { |
| | | if (!this.next) return; |
| | | this.$u.api.shopCartPage({ |
| | |
| | | model: {} |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | console.log(res) |
| | | res.data.records.forEach(item => { |
| | | item.price = item.price.toFixed(2).split('.') |
| | | item.active = false |
| | |
| | | |
| | | .bottom-price { |
| | | display: flex; |
| | | align-items: center; |
| | | align-items: baseline; |
| | | justify-content: space-between; |
| | | |
| | | text { |