cyywl_server/yudao-ui-app/pages/cart/cart.vue

<template>
  <view class="container">
		<view class="navbar">
			<u-navbar title="个人中心">
			</u-navbar>
		</view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      title: '',
      cartList: [],
      checkedNumber: 0,
      totalAmount: 0
    }
  },
  computed: {
    checkedProduct() {
      return this.cartList.filter(item => {
        return item.checked
      })
    },
    isCheckAll() {
      if (this.cartList.length < 1) {
        return false
      }
      return this.cartList.every(item => {
        return item.checked
      })
    },
    hasLogin() {
      return this.$store.getters.hasLogin
    }
  },
  onShow() {
    if (this.hasLogin) {
      this.loadCartDetailData()
    } else {
      this.cartList =[]
    }
  },
  methods: {
    loadCartDetailData() {
      this.$store.dispatch('CartProductDetail').then(res => {
        this.cartList = res.data || []
      })
    },
    /** 商品全选/取消全选 */
    handleCheckAllProduct() {
      if (this.cartList.length < 1) {
        return
      }
      const productIds = this.cartList.map(item => {
        return item.productId
      })
      this.$store.dispatch('CartProductCheckChange', { productIds, checked: !this.isCheckAll }).then(res => {
        this.cartList = res.data || []
      })
    },
    /** 商品单选/取消单选 */
    handleProductCheckedChange(productId, checked) {
      this.$store.dispatch('CartProductCheckChange', { productIds: [productId], checked: checked }).then(res => {
        this.cartList = res.data || []
      })
    },
    /** 修改购物车商品数量 */
    handleProductCountChange(productId, number) {
      this.$store.dispatch('CartProductCountChange', { productIds: [productId], productCount: number }).then(res => {
        this.cartList = res.data || []
      })
    },
    /** 移除购物车商品 */
    handleRemoveProduct() {
      if (this.checkedProduct < 1) {
        return
      }
      const productIds = this.checkedProduct.map(item => {
        return item.productId
      })

      uni.showModal({
        title: '确定要移除选中的商品？',
        cancelText: '取消',
        confirmText: '移除',
        success: res => {
          if (res.confirm) {
            this.$store.dispatch('CartProductCountChange', { productIds: productIds, productCount: 0 }).then(res => {
              this.cartList = res.data || []
            })
          } else if (res.cancel) {
            //console.log('用户点击取消')
          }
        }
      })
    },
    /** 购物车提交结算 */
    handleCheckoutProduct() {
      if (this.checkedProduct < 1) {
        return
      }
      const checkedProduct = this.checkedProduct.map(item => {
        return { productId: item.productId, productCount: item.productCount, sellPrice: item.sellPrice }
      })
      uni.$u.route('/pages/checkout/checkout', {
        checkedProduct: JSON.stringify(checkedProduct)
      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>