购物车

src/layout-shop/index.vue

@@ -2,25 +2,22 @@
   <el-container>
     <el-header>
       <el-menu
-        default-active="1"
+        default-active="2"
         class="el-menu-demo"
         mode="horizontal"
         background-color="#545c64"
         text-color="#fff"
         active-text-color="#ffd04b">
-        <el-menu-item index="1">处理中心</el-menu-item>
+        <el-menu-item index="1">
-        <el-submenu index="2">
+          <router-link :to="'/index'" class="link-type">
-          <template slot="title">我的工作台</template>
+            <span>返回首页</span>
-          <el-menu-item index="2-1">选项1</el-menu-item>
+          </router-link>
-          <el-menu-item index="2-2">选项2</el-menu-item>
+        </el-menu-item>
-          <el-menu-item index="2-3">选项3</el-menu-item>
+        <el-menu-item index="2">
-          <el-submenu index="2-4">
+          <router-link :to="'/cart/detail'" class="link-type">
-            <template slot="title">选项4</template>
+            <span>我的购物车</span>
-            <el-menu-item index="2-4-1">选项1</el-menu-item>
+          </router-link>
-            <el-menu-item index="2-4-2">选项2</el-menu-item>
+        </el-menu-item>
-            <el-menu-item index="2-4-3">选项3</el-menu-item>
-          </el-submenu>
-        </el-submenu>
         <el-menu-item index="3" disabled>消息中心</el-menu-item>
         <el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
       </el-menu>

src/views/shopCart/detail/index.vue

@@ -82,9 +82,12 @@
         <el-row>
           <el-col :span="6">
             <el-checkbox v-model="isAllCheck" @change="changeIsAllCheck">全选</el-checkbox>
-            <el-button type="text" style="margin-left: 10px">删除选中商品</el-button>
+            <el-button type="text" style="margin-left: 10px" @click="removeCartProject(undefined)">删除选中商品</el-button>
           </el-col>
-          <el-col :span="14">
+          <el-col v-if="statisticsCart == null" :span="16">
+            <span style="font-size: 24px; font-weight: bolder;">购物车内无购物商品，请先去加入购物车</span>
+          </el-col>
+          <el-col v-if="statisticsCart != null" :span="14">
             <div>
               <span>共 <span style="color: red">{{ statisticsCart.total }}</span> 件商品，已选择 <span
                 style="color:red;">{{ statisticsCart.selectTotal }}</span> 件</span>
@@ -94,7 +97,7 @@
               <span>应付总额：<span style="color:red; font-size: 24px;">¥{{ statisticsCart.actualTotal }}</span></span>
             </div>
           </el-col>
-          <el-col :span="4">
+          <el-col v-if="statisticsCart != null" :span="4">
             <el-button style="float: right;" type="success">下单</el-button>
           </el-col>
         </el-row>
@@ -137,12 +140,26 @@ export default {
   },
   methods: {
     removeCartProject(row){
-      let removeCartProjectParam = {
+
-        "projectId": row.projectId,
+      let removeCartProjectParams = [];
-        "projectSku": row.projectSku,
+      if (row){
-        "cartInfoId": row.cartInfoId
+        removeCartProjectParams.push({
-      };
+          "projectId": row.projectId,
-      let removeCartProjectParams = [removeCartProjectParam];
+          "projectSku": row.projectSku,
+          "cartInfoId": row.cartInfoId
+        });
+      }else {
+        debugger
+        if (this.cartProjectSelected.length === 0){
+          this.$message.warning("请先选择购物车内商品")
+          return;
+        }
+        this.cartProjectSelected.forEach(cartInfoIsSelect => removeCartProjectParams.push({
+          "projectId": cartInfoIsSelect.projectId,
+          "projectSku": cartInfoIsSelect.projectSku,
+          "cartInfoId": cartInfoIsSelect.cartInfoId
+        }))
+      }
       removeCartInfo(removeCartProjectParams).then(response => {
         this.init();
       })
@@ -164,8 +181,10 @@ export default {
       this.cartProjectList = [];
       this.cartProjectSelected = []
       getDetailInfo().then(response => {
-        this.statisticsCart = response.data.statisticsCart;
+        const {data} = response;
-        this.cartProjectList = response.data.cartSkuList;
+
+        this.statisticsCart = data == null ? null : data.statisticsCart;
+        this.cartProjectList = data == null ? [] : data.cartSkuList;
         this.loading = true;
         setTimeout(this.initCartSelected, 200);
       })