'处理头部高亮'

components/home/header.vue

@@ -18,8 +18,8 @@
 						<li class="h-nav-li">
 							<nuxt-link to="/">首页</nuxt-link>
 						</li>
-						<li>
-              <a href="javascript:void(0)">产品与服务</a>
+						<li :class="{'h-nav-li-more': productActive}">
+              <a class="h-nav-list-parent" href="javascript:void(0)">产品与服务</a>
 							<!-- <nuxt-link to="">产品与服务</nuxt-link> -->
 							<ul class="h-nav-list-child">
 								<li>
@@ -46,8 +46,8 @@
 						<li class="h-nav-li">
 							<nuxt-link to="/cooperate">加盟合作</nuxt-link>
 						</li>
-						<li>
-              <a href="javascript:void(0)">关于我们</a>
+						<li :class="{'h-nav-li-more': aboutActive}">
+              <a class="h-nav-list-parent" href="javascript:void(0)">关于我们</a>
 							<!-- <nuxt-link to="">关于我们</nuxt-link> -->
 							<ul class="h-nav-list-child">
 								<li>
@@ -77,6 +77,7 @@
 
 <script>
 import { mapState } from "vuex";
+import { turquoise } from 'color-name';
 
 export default {
   name: "VHeader",
@@ -84,17 +85,23 @@ export default {
     return {
       headFixed: true,
       maxClientWidth: 980,
-      isShowCode: false,
+      productActive: false,
+      aboutActive: false,
     };
   },
+  watch: {
+    $route () {
+      this.handleRouterActive();
+      console.log('route changed', this.$route.fullPath)
+    }
+  },
   computed: {
     ...mapState(["headProdNav", "headNewsNav", "headJobNav"]),
   },
   mounted() {
     //监听滚动条
     window.addEventListener("scroll", this.handleScroll);
-    console.log(this.$route.parmas);
-    console.log(this.$route.fullPath);
+    this.handleRouterActive();
   },
   methods: {
     handleScroll() {
@@ -106,9 +113,18 @@ export default {
       // 	this.headFixed = false;
       // }
     },
-    showCode() {
-      this.isShowCode = !this.isShowCode;
-    },
+    handleRouterActive() {
+      if(this.$route.fullPath && this.$route.fullPath.includes('/about')) {
+        this.aboutActive = true;
+      } else {
+        this.aboutActive = false;
+      }
+      if(this.$route.fullPath && this.$route.fullPath.includes('/product')) {
+        this.productActive = true;
+      } else {
+        this.productActive = false;
+      }
+    }
   },
   destroyed() {
     window.removeEventListener("scroll", this.handleScroll);
@@ -118,6 +134,16 @@ export default {
 
 <style lang="scss" scoped>
 @import '~static/common/style.sass';
+.h-nav-list {
+  .h-nav-li-more {
+    .h-nav-list-parent {
+      color: $theme_color;
+    }
+    .expand {
+      color: $theme_color;
+    }
+  }
+}
 
 .nav-space {
   height: 72px;

pages/about/brand.vue

@@ -542,6 +542,8 @@ export default {
 };
 </script>
 <style scoped lang="scss">
+@import '~static/common/style.sass';
+
 .Brand-container {
   .label {
     .label-en {
@@ -928,12 +930,12 @@ export default {
         background: rgba(255, 255, 255, 1);
         box-shadow: 0px 2px 14px 0px rgba(201, 199, 195, 0.25);
         border-radius: 6px;
-        padding: 38px 32px 51px 42px;
+        padding: 22px 63px 51px 36px;
         box-sizing: border-box;
         .top {
           img {
-            width: 68px;
-            height: 53px;
+            width: 77px;
+            height: 79px;
             object-fit: cover;
           }
         }

pages/cooperate/index.vue

@@ -1025,7 +1025,7 @@ export default {
         // margin-bottom: 32px;
         .el-input__inner {
           height: 70px;
-          line-height: 70px;
+          padding: 0 26px;
           color: #666666;
           font-size: 18px;
           border-radius: 10px;

pages/index.vue

@@ -1826,6 +1826,7 @@ ul.cate-nav {
   background-position: 0px 158px, 260px 550px;
   background-color: #f7fbff;
   .founder_img {
+    margin-top: 86px;
     img {
       vertical-align: middle;
       width: 337px;
@@ -1863,6 +1864,7 @@ ul.cate-nav {
     display: flex;
     .founder_content {
       width: 863px;
+      height: 439px;
       background: #FFFFFF;
       box-shadow: 0px 2px 17px 0px #D0E7FD;
       border-radius: 30px 12px 86px 12px;

pages/product/list.vue

@@ -625,14 +625,6 @@ export default {
   }
  
 }
- .selectTabs {
-    color: #0D5CFA !important;
-    // font-size: 42px !important;
-    font-family:PingFangSC-Semibold, sans-serif;
-    font-weight:600
-  }
-
-
 
 .cp {
   cursor: pointer;
@@ -654,6 +646,14 @@ export default {
     justify-content: space-between;
     margin: 0 auto;
     .tabs-item {
+      &.selectTabs {
+        a {
+          color: #0D5CFA;
+          // font-size: 42px !important;
+          font-family: PingFangSC-Semibold, sans-serif;
+          font-weight: 600;
+        }
+      }
       a {
         font-size: 24px;
         font-family: PingFangSC-Regular, sans-serif;