From 45a6e76d4a2a88b2cc97bbbcf23d10c0f9916e1c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?lemon=E6=A9=AA?= <17633066053@163.com>
Date: Tue, 15 Feb 2022 16:54:36 +0800
Subject: [PATCH] =?UTF-8?q?=E9=9C=80=E6=94=B9pc=E6=A0=B7=E5=BC=8F=E4=B8=8A?=
 =?UTF-8?q?=E7=9A=84bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 buyer/src/components/header/hoverSearch.vue | 156 +++++++++++---------
 1 file changed, 86 insertions(+), 70 deletions(-)

diff --git a/buyer/src/components/header/hoverSearch.vue b/buyer/src/components/header/hoverSearch.vue
index a18ba978..a24be859 100644
--- a/buyer/src/components/header/hoverSearch.vue
+++ b/buyer/src/components/header/hoverSearch.vue
@@ -2,92 +2,108 @@
   <div class="scroll-show">
     <div class="content clearfix">
       <cateNav class="cate" :hover="true" :showNavBar="false"></cateNav>
-      <Search class="search-con" :hover="true" :showLogo="false" :showTag="false"></Search>
-      <Icon type="ios-cart-outline" @click="goCartList" class="cart-icon"  @mouseenter.native="getCartList" />
-      <i class="cart-badge">{{cartNum < 100 ? cartNum : '99'}}</i>
+      <Search
+        class="search-con"
+        :hover="true"
+        :showLogo="false"
+        :showTag="false"
+      ></Search>
+      <Icon
+        type="ios-cart-outline"
+        @click="goCartList"
+        class="cart-icon"
+        @mouseenter.native="getCartList"
+      />
+      <i class="cart-badge">{{ cartNum < 100 ? cartNum : "99" }}</i>
     </div>
   </div>
 </template>
 <script>
-import {cartCount} from '@/api/cart.js'
-import storage from '@/plugins/storage.js';
+import { cartCount } from "@/api/cart.js";
+import storage from "@/plugins/storage.js";
 export default {
-  data () {
+  data() {
     return {
-      userInfo: {} // 用户信息
-    }
+      userInfo: {}, // 用户信息
+    };
   },
   computed: {
-    cartNum () { // 购物车商品数量
-      return this.$store.state.cartNum
-    }
+    cartNum() {
+      // 购物车商品数量
+      return this.$store.state.cartNum;
+    },
   },
   methods: {
-    goCartList () { // 跳转购物车页面
+    goCartList() {
+      // 跳转购物车页面
       let routerUrl = this.$router.resolve({
-        path: '/cart'
-      })
-      window.open(routerUrl.href, '_blank')
+        path: "/cart",
+      });
+      window.open(routerUrl.href, "_blank");
     },
-    getCartList () { // 获取购物车列表
-      if (storage.getItem('userInfo')) {
-        cartCount().then(res => {
-          this.$store.commit('SET_CARTNUM', res.result)
-          this.Cookies.setItem('cartNum', res.result)
-        })
+    getCartList() {
+      // 获取购物车列表
+      if (storage.getItem("userInfo")) {
+        cartCount().then((res) => {
+          this.$store.commit("SET_CARTNUM", res.result);
+          this.Cookies.setItem("cartNum", res.result);
+        });
       }
+    },
+  },
+  mounted() {
+    if (storage.getItem("userInfo")) {
+      this.userInfo = JSON.parse(storage.getItem("userInfo"));
     }
   },
-  mounted () {
-    if (storage.getItem('userInfo')) {
-      this.userInfo = JSON.parse(storage.getItem('userInfo'));
-    }
-  }
-}
+};
 </script>
 <style lang="scss" scoped>
-  .content{
-    width: 1200px;
-    height: 40px;
-    margin: 10px auto;
-    position: relative;
-  }
-  .cate {
-    float: left;
-    width: 200px!important;
-  }
-  .search-con{
-    float: left;
-    width: 800px;
-    overflow: hidden;
-    margin-top: -27px;
-  }
-  .cart-icon {
-    width: 30px;
-    float: left;
-    font-size: 25px;
-    margin-top: 8px;
-    color: $theme_color;
-    z-index: 1;
-    position: relative;
-    &:hover{
-      cursor: pointer;
-    }
-  }
-  .cart-badge {
-    position: absolute;
-    font-style: normal;
-    right: 165px;
-    display: block;
-    background-color: $theme_color;
-    color: #fff;
-    font-size: 12px;
-    width: 17px;
-    height: 17px;
-    border-radius: 10px;
-    line-height: 17px;
-    text-align: center;
-    z-index: 5;
-    top: 3px;
+.content {
+  width: 1200px;
+  height: 100%;
+  margin: auto;
+  position: fixed;
+  top: 0;
+  left: 50%;
+  margin-left: -600px;
+}
+.cate {
+  float: left;
+  width: 200px !important;
+}
+.search-con {
+  float: left;
+  width: 800px;
+  overflow: hidden;
+  margin-top: -27px;
+}
+.cart-icon {
+  width: 30px;
+  float: left;
+  font-size: 25px;
+  margin-top: 8px;
+  color: $theme_color;
+  z-index: 1;
+  position: relative;
+  &:hover {
+    cursor: pointer;
   }
+}
+.cart-badge {
+  position: absolute;
+  font-style: normal;
+  right: 165px;
+  display: block;
+  background-color: $theme_color;
+  color: #fff;
+  font-size: 12px;
+  width: 17px;
+  height: 17px;
+  border-radius: 10px;
+  line-height: 17px;
+  text-align: center;
+  z-index: 5;
+  top: 3px;
+}
 </style>