优化购物车数据逻辑

src/components/cate/template/list.vue

@@ -19,7 +19,7 @@
 <script>
 import WidgetCountModify from "@/components/widgets/count-modify";
 import ServicePreviewItem from "@/components/service/preview-item";
-import { mapState } from "vuex";
+import { mapGetters } from "vuex";
 export default {
     name: "component-cate-template-list",
     data() {
@@ -36,8 +36,8 @@ export default {
         },
     },
     computed: {
-        ...mapState({
+        ...mapGetters({
-            briefCart: (state) => state.cart.briefCart,
+            briefCart: "cart/briefCart",
         }),
     },
     components: {

src/pages/service/cart.vue

@@ -58,7 +58,7 @@ import WidgetTips from "@/components/widgets/tips";
 import WidgetCheckBox from "@/components/widgets/checkbox";
 import WidgetCountModify from "@/components/widgets/count-modify";
 import ServicePreviewItem from "@/components/service/preview-item";
-import { mapGetters } from "vuex";
+import { mapGetters, mapState } from "vuex";
 export default {
     name: "order-cart",
     data() {
@@ -75,37 +75,39 @@ export default {
         ServicePreviewItem,
     },
     computed: {
+        ...mapState({
+            cart: (state) => state.cart.cart,
+        }),
         ...mapGetters({
             isLogin: "user/isLogin",
         }),
     },
-    onLoad() {
+    async onLoad() {
         if (!this.isLogin) {
             this.$store.commit("user/showLoginModal", true);
             return;
         }
+        await this.$store.dispatch("cart/update");
         this.list = [];
-        this.$models.cart.list().then((list) => {
+        this.cart.list.forEach((item) => {
-            list.forEach((item) => {
+            let goods = [];
-                let goods = [];
+            item.good.forEach((v) => {
-                item.good.forEach((v) => {
+                goods.push({
-                    goods.push({
+                    id: v.gid,
-                        id: v.gid,
+                    name: v.title,
-                        name: v.title,
+                    times: v.post_hits,
-                        times: v.post_hits,
+                    cover: v.thumbnail,
-                        cover: v.thumbnail,
+                    price: v.money,
-                        price: v.money,
+                    number: v.number,
-                        number: v.number,
-                        checked: false,
-                    });
-                });
-                this.list.push({
-                    name: item.cate,
-                    total: 0,
-                    list: goods,
                     checked: false,
                 });
             });
+            this.list.push({
+                name: item.cate,
+                total: 0,
+                list: goods,
+                checked: false,
+            });
         });
     },
     onShow() {},
@@ -166,7 +168,9 @@ export default {
                     this.updateTotal(idx.parentIndex);
                 });
             } else {
-                this.$utils.toast("亲，不能再" + (e.type == "sub" ? "减少" : "增加") + "了~");
+                if (e.type == "sub") {
+                    this.deleteCart(idx.parentIndex, idx.itemIndex);
+                }
             }
         },
         /**

src/pages/service/cate.vue

@@ -25,7 +25,7 @@
                     <text class="iconfont icon-gouwuche"></text>
                 </view>
                 <view class="cart-number">
-                    <text class="text">{{ cartCount }}</text>
+                    <text class="text">{{ briefCart.count }}</text>
                 </view>
             </movable-view>
         </movable-area>
@@ -58,10 +58,10 @@ export default {
     computed: {
         ...mapState({
             currentCateId: (state) => state.system.currentCateId,
-            cartCount: (state) => state.cart.count,
         }),
         ...mapGetters({
             isLogin: "user/isLogin",
+            briefCart: "cart/briefCart",
         }),
     },
     async onLoad() {

src/pages/service/list.vue

@@ -16,7 +16,7 @@
                     <text class="iconfont icon-gouwuche"></text>
                 </view>
                 <view class="cart-number">
-                    <text class="text">{{ cartCount }}</text>
+                    <text class="text">{{ briefCart.count }}</text>
                 </view>
             </view>
             <view class="order-btn" :class="{ active: canUse }" @click="toCart">
@@ -29,7 +29,7 @@
 <script>
 import AppLayout from "@/components/layout/layout";
 import AppCate from "@/components/cate/cate";
-import { mapGetters, mapState } from "vuex";
+import { mapGetters } from "vuex";
 export default {
     name: "service-list",
     data() {
@@ -46,11 +46,9 @@ export default {
         AppCate,
     },
     computed: {
-        ...mapState({
-            cartCount: (state) => state.cart.count,
-        }),
         ...mapGetters({
             isLogin: "user/isLogin",
+            briefCart: "cart/briefCart",
         }),
     },
     onLoad(e) {
@@ -63,8 +61,8 @@ export default {
     onShareTimeline() {},
     onShareAppMessage() {},
     watch: {
-        cartCount(count) {
+        briefCart(cart) {
-            this.canUse = count > 0;
+            this.canUse = cart.count > 0;
         },
     },
     methods: {
@@ -76,7 +74,7 @@ export default {
             if (this.isLogin) {
                 this.$store.dispatch("cart/update");
             }
-            this.canUse = this.cartCount > 0;
+            this.canUse = this.briefCart.count > 0;
             if (!e.id) {
                 return this.$utils.toast("参数错误");
             }

src/store/modules/cart.js

@@ -3,42 +3,42 @@ import cart from '@/core/models/cart';
 export default {
     namespaced: true,
     state: {
-        count: 0,
+        cart: {
-        briefCart: {
             loaded: false,
-            ids: [],
+            list: [],
-            list: {},
         },
     },
-    getters: {},
+    getters: {
+        briefCart(state) {
+            let data = {
+                count: 0,
+                ids: [],
+                list: {},
+            };
+            state.cart.list.forEach((item) => {
+                item.good.forEach((k) => {
+                    data.count += k.number;
+                    data.list[k.gid] = k.number;
+                });
+            });
+            data.ids = Object.keys(data.list);
+
+            return data;
+        }
+    },
     mutations: {
-        count(state, data) {
+        cart(state, data) {
-            state.count = data;
+            state.cart = data;
-        },
-        briefCart(state, data) {
-            state.briefCart = data;
         }
     },
     actions: {
-        update(context, refresh) {
+        async update(context, refresh) {
-            if (!context.state.briefCart.loaded || refresh) {
+            if (!context.state.cart.loaded || refresh) {
-                cart.list().then((list) => {
+                await cart.list().then((list) => {
-                    let count = 0, data = {
+                    context.commit('cart', {
-                        ids: [],
+                        list: list,
-                        list: {},
-                    };
-                    list.forEach((item) => {
-                        item.good.forEach((k) => {
-                            count += k.number;
-                            data.list[k.gid] = k.number;
-                        });
-                    });
-                    data.ids = Object.keys(data.list);
-                    context.commit('briefCart', {
-                        ...data,
                         loaded: true,
                     });
-                    context.commit('count', count);
                 });
             }
         }