修改样式

src/components/TabHeader.vue

@@ -2,7 +2,7 @@
   <div id="showheader" class="header">
     <van-nav-bar id="nav" :title="title" left-text left-arrow>
       <template #title>
-        <a class="header-title" :class="isActive?'title-active':''" href="/bill">人事服务</a>
+        <a class="header-title" :class="isActive?'title-active':''" href="/">人事服务</a>
 
         <a class="header-title" :class="isActive?'':'title-active'" href="./more">更多服务</a>
       </template>
@@ -30,10 +30,10 @@ export default {
     var u = navigator.userAgent;
     var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
     this.top = isiOS;
-    if (window.location.href.indexOf("bill")) {
-      this.isActive = true;
-    } else {
+    if (window.location.href.indexOf("more")>0) {
       this.isActive = false;
+    } else {
+      this.isActive = true;
     }
   }
 };
@@ -54,11 +54,7 @@ export default {
   font-size: 16px !important;
 }
 .van-nav-bar {
-  background: linear-gradient(
-    135deg,
-    rgba(37, 141, 244, 1) 0%,
-    rgba(6, 115, 223, 1) 100%
-  );
+  background: #0978e7;
 }
 
 .header-title {
@@ -70,4 +66,7 @@ export default {
   color: #ffffff;
   font-size: 18px;
 }
+.van-hairline--bottom::after{
+  border-bottom-width:0px;
+}
 </style>

src/views/Bill/index.vue

@@ -142,11 +142,10 @@
 </template>
 
 <script>
-import { NavBar, Icon } from "vant";
+import {  Icon } from "vant";
 import {TabHeader} from '@/components'
 export default {
   components: {
-    [NavBar.name]: NavBar,
     [Icon.name]: Icon,
     TabHeader
   },
@@ -168,12 +167,7 @@ export default {
   .header {
     height: 136px;
     padding: 0 16px;
-    border-top: 1px solid rgba(15, 130, 245, 1);
-    background: linear-gradient(
-      135deg,
-      rgba(15, 130, 245, 1) 0%,
-      rgba(6, 115, 223, 1) 100%
-    );
+    background: #0978e7;
     .header_date_time {
       height: 75px;
     }

src/views/More/index.vue

 <template>
   <div>
     <div class="header">
-      <van-nav-bar title="更多服务" left-arrow @click-left="onClickLeft" />
+      <tab-header :title="title" />
     </div>
     <div class="contener">
       <div class="header">
@@ -19,7 +19,7 @@
           </div>
           <div class="header_info">
             <div class="left">
-              <img src="" alt />
+              <img src alt />
               <span>充值</span>
             </div>
             <div class="right">
@@ -50,12 +50,17 @@
 </template>
 
 <script>
-
 import { NavBar, Icon } from "vant";
+import { TabHeader } from "@/components";
 export default {
   components: {
-    [NavBar.name]: NavBar,
-    [Icon.name]: Icon
+    [Icon.name]: Icon,
+    TabHeader
+  },
+  data() {
+    return {
+      title: "人事服务"
+    };
   },
   methods: {
     onClickLeft() {
@@ -70,12 +75,7 @@ export default {
   .header {
     height: 136px;
     padding: 0 16px;
-    border-top: 1px solid rgba(15, 130, 245, 1);
-    background: linear-gradient(
-      135deg,
-      rgba(15, 130, 245, 1) 0%,
-      rgba(6, 115, 223, 1) 100%
-    );
+    background: #0978e7;
     .header_box {
       height: 174px;
       background: rgba(255, 255, 255, 1);
@@ -95,8 +95,8 @@ export default {
         .paid {
           width: 50%;
           float: left;
-          .paid_color{
-            color: #FF9100;
+          .paid_color {
+            color: #ff9100;
           }
         }
         span {