update 主题色调整，白色头部导航、红色头部导航区分

package-lock.json

@@ -2805,6 +2805,49 @@
         "webpack-merge": "^5.7.3",
         "webpack-virtual-modules": "^0.4.2",
         "whatwg-fetch": "^3.6.2"
+      },
+      "dependencies": {
+        "@vue/vue-loader-v15": {
+          "version": "npm:vue-loader@15.11.1",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.11.1.tgz",
+          "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
+          "dev": true,
+          "requires": {
+            "@vue/component-compiler-utils": "^3.1.0",
+            "hash-sum": "^1.0.2",
+            "loader-utils": "^1.1.0",
+            "vue-hot-reload-api": "^2.3.0",
+            "vue-style-loader": "^4.1.0"
+          },
+          "dependencies": {
+            "hash-sum": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
+              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+              "dev": true
+            }
+          }
+        },
+        "json5": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
+          "dev": true,
+          "requires": {
+            "minimist": "^1.2.0"
+          }
+        },
+        "loader-utils": {
+          "version": "1.4.2",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
+          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^1.0.1"
+          }
+        }
       }
     },
     "@vue/cli-shared-utils": {
@@ -2978,47 +3021,6 @@
         "eslint-config-standard": "^14.1.0"
       }
     },
-    "@vue/vue-loader-v15": {
-      "version": "npm:vue-loader@15.11.1",
-      "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
-      "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
-      "dev": true,
-      "requires": {
-        "@vue/component-compiler-utils": "^3.1.0",
-        "hash-sum": "^1.0.2",
-        "loader-utils": "^1.1.0",
-        "vue-hot-reload-api": "^2.3.0",
-        "vue-style-loader": "^4.1.0"
-      },
-      "dependencies": {
-        "hash-sum": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
-          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
-          "dev": true
-        },
-        "json5": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmmirror.com/json5/-/json5-1.0.2.tgz",
-          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-          "dev": true,
-          "requires": {
-            "minimist": "^1.2.0"
-          }
-        },
-        "loader-utils": {
-          "version": "1.4.2",
-          "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-1.4.2.tgz",
-          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
-          "dev": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^1.0.1"
-          }
-        }
-      }
-    },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
       "resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",

src/App.vue

@@ -2,6 +2,7 @@
   <div id="app">
     <van-nav-bar
       v-if="hasNavBar"
+      :class="{'white-style': isWhiteNavBar}"
       :title="pageTitle"
       :left-text="hasBack ? $t('back') : ''"
       :left-arrow="hasBack"
@@ -55,6 +56,10 @@ export default {
         return ''
       }
       return this.$t('pageTitle.' + this.$route.meta.pageTitle)
+    },
+    // 是否白色头部导航
+    isWhiteNavBar () {
+      return !!this.$route.meta.isWhiteNavBar
     }
   },
   methods: {
@@ -81,34 +86,41 @@ export default {
 </script>
 
 <style scoped lang="less">
+@import '~@assets/less/common.less';
+
 .van-nav-bar__content {
   height: 0.88rem;
 }
 
-/deep/ .van-nav-bar__left, /deep/ .van-nav-bar__right, /deep/ .van-nav-bar__arrow {
+/*头部导航字号处理*/
+/deep/ .van-nav-bar__left, /deep/ .van-nav-bar__right, /deep/ .van-nav-bar__arrow, /deep/ .van-nav-bar__title {
   font-size: 0.36rem;
 }
 
-@font-color: #34383F;
+/*头部导航固定*/
-/deep/ .van-nav-bar {
-  background-color: #FFFFFF;
-
-  .van-nav-bar__title {
-    color: @font-color;
-    font-size: 0.36rem;
-  }
-
-  .van-nav-bar__text {
-    color: @font-color;
-  }
-
-  .van-icon {
-    color: @font-color;
-  }
-}
-
 .scroll-box {
   height: calc(100vh - 0.88rem);
   overflow: auto;
 }
+
+/*处理白色头部导航样式*/
+.white-style {
+  background-color: #FFFFFF !important;
+
+  /deep/ .van-nav-bar__title {
+    color: @font-color !important;
+  }
+
+  /deep/ .van-nav-bar__text {
+    color: @font-color !important;
+  }
+
+  /deep/ .van-icon {
+    color: @font-color !important;
+  }
+}
+
+/deep/ .van-hairline--bottom::after {
+  border: none;
+}
 </style>

src/assets/less/common.less

@@ -1 +1,3 @@
-@primary-color: '#D52C26';
+@primary-color: #E63636;
+@font-color: #1D2129;
+@label-font-color: #767676;

src/router/index.js

@@ -32,7 +32,9 @@ const routes = [
     name: 'NoMobile',
     meta: {
       hasNavBar: true,
-      hasBack: true
+      hasBack: true,
+      // 是否白色头部导航
+      isWhiteNavBar: true
     },
     component: () => import('@/views/exception/NoMobile')
   },

src/views/user/Login.vue

@@ -130,7 +130,7 @@ export default {
     margin: 20px 0;
   }
   .login-btn {
-    background-color: #D52C26;
+    background-color: @primary-color;
   }
 }
 </style>

vant.config.js

@@ -1,4 +1,4 @@
-const primaryColor = '#D52C26'
+const primaryColor = '#E63636'
 const white = '#FFFFFF'
 
 module.exports = {

vue.config.js

@@ -54,8 +54,8 @@ module.exports = {
       less: {
         modifyVars: {
           /* less 变量覆盖，用于自定义 ant design 主题 */
-          'primary-color': '#D52C26',
+          'primary-color': '#E63636',
-          'link-color': '#D52C26',
+          'link-color': '#E63636',
           'border-radius-base': '4px',
           /* vant组件变量覆盖 */
           ...theme