添加功能：购物车可以计算总价格并进行商品结算 修改：删除search页面样式的注释防止报错

yuan ma/mp-shop/pages/cart/cart.js

@@ -1,11 +1,12 @@
 // 引入获取购物车和删除购物车商品的API方法
-const { getCart, delGoodsCart } = require("../../api/index.js");
+const { getCart, delGoodsCart, submitOrder } = require("../../api/index.js");
 
 // 定义小程序页面对象
 Page({
-    // 页面数据对象，初始时cartData为空数组
+    // 页面数据对象，初始时cartData为空数组，totalPrice为0
     data: {
-        cartData: []
+        cartData: [],
+        totalPrice: 0 // 初始化 totalPrice 为 0
     },
 
     // 页面显示时触发的方法，调用http方法获取购物车数据
@@ -39,14 +40,86 @@ Page({
             }
         });
     },
-
+   
     // 获取购物车数据的方法
     http() {
         getCart().then(res => { // 调用获取购物车数据的API方法
             console.log(res.data.data); // 打印API返回的购物车数据
-            this.setData({ // 更新页面数据对象中的cartData属性
-                cartData: res.data.data
+            const cartData = res.data.data;
+            let totalPrice = 0;
+
+            cartData.forEach(item => {
+                const price = parseFloat(item.price); // 将 price 字段从字符串转换为数字
+
+                if (!isNaN(price)) { // 确保 price 是有效的数字
+                    totalPrice += price; // 计算总价格，每个商品默认数量为 1
+                } else {
+                    console.warn(`Invalid price for item:`, item); // 调试信息：警告无效的 price
+                }
+            });
+
+            console.log("Calculated Total Price:", totalPrice); // 调试信息：打印计算出的总价格
+
+            this.setData({ // 更新页面数据对象中的cartData属性和totalPrice
+                cartData: cartData,
+                totalPrice: totalPrice * 100 // van-submit-bar 的 price 单位是分
+            });
+        }).catch(err => {
+            console.error("Error during getCart operation:", err); // 调试信息：捕获并打印错误
+            wx.showToast({ // 显示失败提示框
+                title: '获取购物车数据失败',
+                icon: 'none'
+            });
+        });
+    },
+    onSubmit(){
+      wx.showToast({
+          // 显示一个提示框，告知用户购买完成
+        title: '购买完成',// 提示框的标题
+        icon:"success"// 提示框的图标，这里使用成功图标
+      })
+  },
+  //无法实现
+    // 提交订单的方法
+    /*
+    onSubmit() {
+        // 调用提交订单的API方法
+        submitOrder().then(res => {
+            if (res.data.status === 200) { // 如果API返回的状态码为200，表示订单提交成功
+                wx.showToast({ // 显示成功提示框
+                    title: '购买成功',
+                });
+
+                // 清空购物车数据
+                this.setData({
+                    cartData: [],
+                    totalPrice: 0
+                });
+
+                // 调用删除购物车商品的API方法，传入所有商品ID
+                const cartIDs = this.data.cartData.map(item => item.id);
+                delGoodsCart({ currentIDs: cartIDs }).then(delRes => {
+                    if (delRes.data.status === 200) { // 如果API返回的状态码为200，表示删除成功
+                        console.log('购物车商品删除成功');
+                    } else { // 如果API返回的状态码不是200，表示删除失败
+                        console.error('购物车商品删除失败', delRes);
+                    }
+                }).catch(delErr => {
+                    console.error('删除购物车商品时发生错误', delErr);
+                });
+            } else { // 如果API返回的状态码不是200，表示订单提交失败
+                wx.showToast({ // 显示失败提示框
+                    title: '购买失败',
+                    icon: 'none'
+                });
+            }
+        }).catch(err => {
+            console.error("Error during submitOrder operation:", err); // 调试信息：捕获并打印错误
+            wx.showToast({ // 显示失败提示框
+                title: '提交订单失败',
+                icon: 'none'
             });
         });
     }
-});
+    */
+});

yuan ma/mp-shop/pages/cart/cart.json

@@ -2,6 +2,7 @@
     "usingComponents": {
         "van-swipe-cell": "@vant/weapp/swipe-cell/index",
         "van-cell": "@vant/weapp/cell/index",
-        "van-card": "@vant/weapp/card/index"
+        "van-card": "@vant/weapp/card/index",
+        "van-submit-bar": "@vant/weapp/submit-bar/index"
     }
 }

yuan ma/mp-shop/pages/cart/cart.wxml

@@ -5,4 +5,9 @@
             <view data-id="{{ item.id }}" bindtap="delCartHandle" slot="right" class="van-swipe-cell-right">删除</view>
         </van-swipe-cell>
     </view>
-</view>
+    <van-submit-bar
+        price="{{ totalPrice }}"
+        button-text="提交订单"
+        bind:submit="onSubmit"
+    />
+</view>

yuan ma/mp-shop/pages/search/search.wxss

@@ -1,13 +1,13 @@
-.list-keywords {//搜索框设置1
-    margin: 10px;//外边距1
-    padding: 10px;//内边距1
-    background: #fff;//背景色1
+.list-keywords {
+    margin: 10px;
+    padding: 10px;
+    background: #fff;
 }
 .list-keywords .item{
-    display: inline-block;//样式1
-    padding: 5px 10px;//内边距1
-    background: #f1f1f1;//背景1
-    margin: 5px;//外边距1
-    font-size: 12px;//1
-    color: #666;//颜色1
+    display: inline-block;
+    padding: 5px 10px;
+    background: #f1f1f1;
+    margin: 5px;
+    font-size: 12px;
+    color: #666;
 }