day03

src/api/shopcart.js

@@ -1,3 +1,7 @@
 import { post, get } from "@/utils/request"
 
-export const shopCartInfo = (data) => post("/p/shopCart/info", data)
+export const shopCartInfo = (data) => post("/p/shopCart/info", data)
+
+export const prodCount = () => get("/p/shopCart/prodCount")
+
+export const totalPay = (data) => post("/p/shopCart/totalPay", data)

src/components/Tabber.vue

@@ -1,18 +1,25 @@
 <template>
-    <van-tabbar v-model="active" active-color="#ee0a24" inactive-color="#000">
+    <van-tabbar v-model="active"  @change="onChange" active-color="#ee0a24" inactive-color="#000">
         <van-tabbar-item replace to="/home" icon="wap-home">主页</van-tabbar-item>
         <van-tabbar-item replace to="/cateGory" icon="expand">分类</van-tabbar-item>
-        <van-tabbar-item replace to="/shopCart" icon="shopping-cart">购物车</van-tabbar-item>
+        <van-tabbar-item replace to="/shopCart"  :badge="count" icon="shopping-cart">购物车</van-tabbar-item>
         <van-tabbar-item replace to="/me" icon="manager">我的</van-tabbar-item>
     </van-tabbar>
 </template>
 <script>
+import { prodCount } from '@/api/shopcart'
 export default {
     data() {
         return {
             active: 0,
+            count: 0
         }   
     },
+    methods: {
+        async onChange(){
+            this.count = await prodCount()
+        }
+    },  
     mounted(){
         switch ( this.$route.path ) {
             case "/home": return this.active = 0

src/views/ShopCart.vue

@@ -7,12 +7,12 @@
                 <van-row v-for="items in shop.shopCartItemDiscounts[0].shopCartItems">
                     <van-col span="2">
                         <van-checkbox-group v-model="result" ref="checkboxGroup">
-                            <van-checkbox name="a"></van-checkbox>
+                            <van-checkbox :name="items.basketId"></van-checkbox>
                         </van-checkbox-group>
                     </van-col>
                     <van-col span="22">
                         <span class="shop-name">{{ shop.shopName }}</span>
-                        <van-card :num="value" :price="items.price" 
+                        <van-card :num="items.prodCount" :price="items.price" 
                             :desc="items.skuName" :title="items.prodName"
                             :thumb="items.pic">
                             <template #tags>
@@ -29,7 +29,8 @@
                 <van-divider  />
             </div>
         </div>
-        <van-submit-bar :price="3050" button-text="提交订单" @submit="onSubmit">
+        <div style="height: 7rem;"></div>
+        <van-submit-bar :price="totalMoney" button-text="提交订单" @submit="onSubmit">
             <van-checkbox v-model="checked">全选</van-checkbox>
             <template #tip>
                 你的收货地址不支持同城送, <span @click="onClickEditAddress">修改地址</span>
@@ -45,7 +46,8 @@ export default {
             checked: false,
             shopCartInfo: [],
             value: 0,
-            result: []
+            result: [],
+            totalMoney: 0
         }
     },
     async created() {