H5-购物车：商品增减、减少、清除购物车

htmldev/dashboard/src/views/sell/cartcontrol/cartcontrol.vue

@@ -29,7 +29,7 @@ export default {
       } else {
         this.food.product_num++
       }
-      this.$emit('add', event.target)
+      this.$emit('add', event.target, this.food)
     },
     decreaseCart (event) {
       if (!event._constructed) {
@@ -38,6 +38,7 @@ export default {
       if (this.food.product_num) {
         this.food.product_num--
       }
+      this.$emit('decrease', event.target, this.food)
     }
   }
 }

htmldev/dashboard/src/views/sell/goods/api/index.js

@@ -54,7 +54,7 @@ export const apiCartClear = (id) => request({
 })
 
 /**
- * 更新购物车
+ * 更新购物车数量
  * @param id 购物车数据ID
  * @param type 类型(0减少1增加)
  */

htmldev/dashboard/src/views/sell/shopcart/shopcart.vue

@@ -75,11 +75,17 @@
                     <span class="now">￥{{ food.product_price * food.product_num | fen2Yuan }}</span>
                   </div>
                   <div class="cartcontrol-wrapper">
-                    <cartcontrol @add="addFood" :food="food"></cartcontrol>
+                    <cartcontrol
+                      :food="food"
+                      @add="addFood"
+                      @decrease="decreaseFood"></cartcontrol>
                   </div>
                 </div>
                 <div class="cartcontrol-wrapper">
-                  <cartcontrol @add="addFood" :food="food"></cartcontrol>
+                  <cartcontrol
+                    :food="food"
+                    @add="addFood"
+                    @decrease="decreaseFood"></cartcontrol>
                 </div>
               </li>
             </ul>
@@ -98,7 +104,7 @@ import BScroll from 'better-scroll'
 import cartcontrol from '../cartcontrol/cartcontrol'
 import { Toast } from 'vant'
 import { mapGetters } from 'vuex'
-import { apiCartList } from '../goods/api'
+import { apiCartList, apiCartClear, apiCartUpdate } from '../goods/api'
 
 export default {
   data () {
@@ -246,10 +252,23 @@ export default {
     hideList () {
       this.fold = true
     },
-    empty () {
+    /*
+    * 清空购物车
+    * */
+    async empty () {
+      const { id } = this.objCurrentBarInfo
+
       this.selectFoods.forEach((food) => {
         food.product_num = 0
       })
+      try {
+        const { status, msg } = await apiCartClear(id)
+        if (status) {
+          this.init()
+        } else {
+          Toast(msg)
+        }
+      } catch (err) {}
     },
     pay () {
       if (this.totalPrice < 1) {
@@ -257,9 +276,29 @@ export default {
       }
       this.$emit('handleJumpPay')
     },
-    addFood (target) {
+    // 单个商品增加
+    addFood (target, food) {
+      this.cartUpdate(food.id, 1)
       this.drop(target)
     },
+    // 单个商品减少
+    decreaseFood (target, food) {
+      this.cartUpdate(food.id, 0)
+    },
+    /**
+     * 更新购物车数量
+     * @param id 购物车数据ID
+     * @param type 类型(0减少1增加)
+     * @returns {Promise<void>}
+     */
+    async cartUpdate (id, type) {
+      try {
+        const { status, msg } = await apiCartUpdate(id, type)
+        if (status) {} else {
+          Toast(msg)
+        }
+      } catch (err) {}
+    },
     beforeDrop (el) {
       let count = this.balls.length
       while (count--) {