1、使用postcss-pxtorem，改用less

2、升级babel

.babelrc

 {
-  "presets": ["env", "es2015", "stage-2"],
+  "presets": [
+    "@babel/preset-env"
+  ],
   "plugins": [
-    "add-module-exports", 
-    "transform-runtime",
+    "add-module-exports",
+    [
+      "@babel/plugin-transform-runtime",
+      {
+        "corejs": 2
+      }
+    ],
+    "@babel/plugin-syntax-dynamic-import",
+    "@babel/plugin-syntax-import-meta",
+    "@babel/plugin-proposal-class-properties",
+    "@babel/plugin-proposal-json-strings",
+    [
+      "@babel/plugin-proposal-decorators",
+      {
+        "legacy": true
+      }
+    ],
+    "@babel/plugin-proposal-function-sent",
+    "@babel/plugin-proposal-export-namespace-from",
+    "@babel/plugin-proposal-numeric-separator",
+    "@babel/plugin-proposal-throw-expressions"
   ],
-  "comments": false,
+  "comments": false
 }

build/webpack.base.conf.js

@@ -4,8 +4,8 @@ var utils = require('./utils')
 var projectRoot = path.resolve(__dirname, '../')
 
 var env = process.env.NODE_ENV
-    // check env & config/index.js to decide weither to enable CSS Sourcemaps for the
-    // various preprocessor loaders added to vue-loader at the end of this file
+// check env & config/index.js to decide weither to enable CSS Sourcemaps for the
+// various preprocessor loaders added to vue-loader at the end of this file
 var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap)
 var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap)
 var useCssSourceMap = cssSourceMapDev || cssSourceMapProd
@@ -69,6 +69,15 @@ module.exports = {
         postcss: [
             require('autoprefixer')({
                 browsers: ['last 10 versions']
+            }),
+            require('postcss-pxtorem')({
+                rootValue: 37.5,
+                unitPrecision: 5,
+                propWhiteList: [],
+                selectorBlackList: [/^html$/],
+                replace: true,
+                mediaQuery: false,
+                minPixelValue: 2
             })
         ]
     }

package.json

@@ -15,19 +15,11 @@
     "build:pro": "cross-env BUILD_ENV=pro node build/build.js"
   },
   "dependencies": {
-    "@babel/polyfill": "^7.2.5",
+    "@babel/polyfill": "^7.10.4",
     "axios": "0.16.2",
-    "better-scroll": "^0.1.15",
     "clipboard": "^2.0.6",
-    "echarts": "^4.2.0-rc.2",
-    "fastclick": "^1.0.6",
-    "img-vuer": "^0.17.2",
-    "install": "^0.13.0",
-    "iscroll": "^5.2.0",
-    "js-cookie": "^2.2.0",
-    "npm": "^6.14.6",
+    "pdfjs-dist": "^2.4.456",
     "pica-topic-stencil": "^1.0.8",
-    "showdown": "^1.6.4",
     "vant": "^2.2.15",
     "vconsole": "^3.3.4",
     "vue": "^2.1.0",
@@ -37,19 +29,27 @@
     "weixin-js-sdk": "^1.4.0-test"
   },
   "devDependencies": {
+    "@babel/core": "^7.0.0",
+    "@babel/plugin-proposal-class-properties": "^7.0.0",
+    "@babel/plugin-proposal-decorators": "^7.0.0",
+    "@babel/plugin-proposal-export-namespace-from": "^7.0.0",
+    "@babel/plugin-proposal-function-sent": "^7.0.0",
+    "@babel/plugin-proposal-json-strings": "^7.0.0",
+    "@babel/plugin-proposal-numeric-separator": "^7.0.0",
+    "@babel/plugin-proposal-throw-expressions": "^7.0.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+    "@babel/plugin-syntax-import-meta": "^7.0.0",
+    "@babel/plugin-transform-runtime": "^7.0.0",
+    "@babel/preset-env": "^7.0.0",
+    "@babel/register": "^7.0.0",
+    "@babel/runtime-corejs2": "^7.0.0",
     "autoprefixer": "^6.4.0",
     "autoprefixer-loader": "^3.2.0",
-    "babel-core": "^6.0.0",
-    "babel-loader": "^6.0.0",
+    "babel-core": "^7.0.0-bridge.0",
+    "babel-loader": "7.1.1",
     "babel-plugin-add-module-exports": "^1.0.0",
     "babel-plugin-component": "^1.1.1",
     "babel-plugin-import": "^1.11.0",
-    "babel-plugin-transform-runtime": "^6.0.0",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-es2015": "^6.0.0",
-    "babel-preset-stage-2": "^6.0.0",
-    "babel-register": "^6.0.0",
-    "babel-runtime": "^6.23.0",
     "chalk": "^1.1.3",
     "connect-history-api-fallback": "^1.1.0",
     "cross-env": "^5.0.0",
@@ -65,13 +65,9 @@
     "less": "^2.7.1",
     "less-loader": "^2.2.3",
     "node-gyp": "^3.4.0",
-    "node-sass": "^4.9.2",
     "opn": "^4.0.2",
     "ora": "^0.3.0",
-    "sass": "^0.5.0",
-    "sass-loader": "^4.1.1",
-    "scss": "^0.2.4",
-    "scss-loader": "0.0.1",
+    "postcss-pxtorem": "^5.1.1",
     "semver": "^5.3.0",
     "shelljs": "^0.7.4",
     "style-loader": "^0.13.1",

src/App.vue

@@ -22,7 +22,7 @@
 
 </script>
 
-<style lang="scss">
+<style lang="less">
   	@import './style/mixin';
   	@import './style/common';
   	@import './style/global';

src/components/business/back-top.vue

@@ -44,15 +44,14 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .back-btn {
   position: fixed;
-  width: px2rem(35px);
-  height: px2rem(35px);
-  right: px2rem(15px);
+  width: 35px;
+  height: 35px;
+  right: 15px;
   z-index: 100;
-  bottom: px2rem(80px);
+  bottom: 80px;
   img {
     width: 100%;
     height: 100%;

src/components/business/cell-list-item.vue

@@ -179,70 +179,69 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .cell-container {
   display: flex;
   flex-direction: column;
-  margin: 0 px2rem(15px);
+  margin: 0 15px;
   &-item {
     position: relative;
     display: flex;
     flex-direction: row;
-    // margin: px2rem(6px) px2rem(0px);
-    // height: px2rem(51px);
-    margin-bottom: px2rem(32px);
-    line-height: px2rem(51px);
-    font-size: px2rem(15px);
-    // padding: px2rem(0px) px2rem(15px);
+    // margin: 6px 0px;
+    // height: 51px;
+    margin-bottom: 32px;
+    line-height: 51px;
+    font-size: 15px;
+    // padding: 0px 15px;
     // background: rgba(248, 249, 250, 1);
     // border-bottom: 1px solid #f0f0f0;
-    // border-radius: px2rem(6px);
+    // border-radius: 6px;
     justify-content: space-between;
     align-items: center;
     .name {
       &-logo {
         position: relative;
         z-index: 9;
-        margin-right: px2rem(6px);
-        width: px2rem(20px);
-        height: px2rem(20px);
+        margin-right: 6px;
+        width: 20px;
+        height: 20px;
         text-align: center;
         background:rgba(68,146,132,1);
-        font-size: px2rem(12px);
+        font-size: 12px;
         font-weight: 700;
         color: #FFFFFF;
         border-radius: 50%;
         float: left;
-        line-height: px2rem(22px);
+        line-height: 22px;
         // display:table;
         // overflow:hidden;
         // span {
         //   color: #FFFFFF;
-        //   font-size: px2rem(12px);
+        //   font-size: 12px;
         //   font-weight: 700;
         //   display: table-cell;
         //   text-align: center;
         //   vertical-align: middle;
-        //   line-height: px2rem(20px);
+        //   line-height: 20px;
         // }
         &::before {
           position: absolute;
-          top: px2rem(-6px);
-          left: px2rem(8px);
+          top: -6px;
+          left: 8px;
           display: inline-block;
-          height: px2rem(6px);
-          width: px2rem(4px);
+          height: 6px;
+          width: 4px;
           background: #FFFFFF;
           content: "";
         }
         &::after {
           position: absolute;
-          top: px2rem(20px);
-          left: px2rem(8px);
+          top: 20px;
+          left: 8px;
           display: inline-block;
-          height: px2rem(6px);
-          width: px2rem(4px);
+          height: 6px;
+          width: 4px;
           background: #FFFFFF;
           content: "";
         }
@@ -255,10 +254,10 @@ export default {
       }
       &-title {
         // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
-        width: px2rem(231px);
-        font-size: px2rem(15px);
+        width: 231px;
+        font-size: 15px;
         font-weight: 700;
-        line-height: px2rem(21px);
+        line-height: 21px;
         color: #373839;
         float: left;
       }
@@ -267,44 +266,44 @@ export default {
       }
       // &::before {
       //   position: relative;
-      //   top: px2rem(3px);
+      //   top: 3px;
       //   display: inline-block;
-      //   width: px2rem(4px);
+      //   width: 4px;
       //   content: "";
-      //   margin-right: px2rem(5px);
-      //   height: px2rem(16px);
+      //   margin-right: 5px;
+      //   height: 16px;
       //   background: #449284;
-      //   border-radius: px2rem(3px);
+      //   border-radius: 3px;
       // }
 
       // span {
       //   img {
-      //     margin-top: px2rem(4px);
+      //     margin-top: 4px;
       //     position: relative;
-      //     top: px2rem(2px);
-      //     width: px2rem(70px);
-      //     height: px2rem(20px);
+      //     top: 2px;
+      //     width: 70px;
+      //     height: 20px;
       //   }
       // }
     }
     .text-action {
-      width: px2rem(68px);
-      height: px2rem(25px);
-      line-height: px2rem(25px);
+      width: 68px;
+      height: 25px;
+      line-height: 25px;
       text-align: center;
-      font-size: px2rem(12px);
+      font-size: 12px;
       font-weight: 700;
-      border-radius: px2rem(15px);
+      border-radius: 15px;
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
       // opacity: 0.45;
       border: 0.5px solid rgba(68, 146, 132, 0.6);
       color: rgba(68, 146, 132, 1);
       img {
         position: relative;
-        left: px2rem(2px);
-        top: px2rem(3px);
-        width: px2rem(8px);
-        height: px2rem(12px);
+        left: 2px;
+        top: 3px;
+        width: 8px;
+        height: 12px;
       }
       &-no {
         border: 0.5px solid #c7c8c9;
@@ -317,40 +316,40 @@ export default {
   }
   span {
     img {
-      margin-left: px2rem(26px);
+      margin-left: 26px;
       position: relative;
-      top: px2rem(-28px);
-      width: px2rem(70px);
-      height: px2rem(20px);
+      top: -28px;
+      width: 70px;
+      height: 20px;
     }
     .space2 {
-      top: px2rem(-26px);
+      top: -26px;
     }
   }
   .connect-line {
     position: absolute;
-    // top: px2rem(32px);
-    top: px2rem(3px);
-    left: px2rem(9.5px);
-    height: px2rem(42px);
+    // top: 32px;
+    top: 3px;
+    left: 9.5px;
+    height: 42px;
     width: 0.5px;
     border: 0.5px dashed rgba(240, 241, 244, 1);
   }
   .len4 {
-    height: px2rem(100px);
+    height: 100px;
   }
   .len3 {
-    height: px2rem(82px);
+    height: 82px;
   }
   .len2 {
-    height: px2rem(82px);
+    height: 82px;
   }
   .len1 {
-    height: px2rem(62px);
+    height: 62px;
   }
   .bottom-line {
     position: relative;
-    margin: px2rem(6px) 0 px2rem(28px) 0;
+    margin: 6px 0 28px 0;
     bottom: 0px;
     width: 100%;
     border-bottom: 0.5px solid #F0F1F2;

src/components/business/cert-show.vue

@@ -33,14 +33,13 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .cert-show-container {
   display: flex;
-  margin: px2rem(10px) px2rem(15px) 0 px2rem(15px);
+  margin: 10px 15px 0 15px;
   img {
-    width: px2rem(345px);
-    height: px2rem(70px);
+    width: 345px;
+    height: 70px;
   }
 }
 </style>

src/components/business/comp-list-item.vue

@@ -94,51 +94,50 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-container {
   display: flex;
   flex-direction: column;
-  margin: 0 px2rem(15px);
+  margin: 0 15px;
   &-item {
     display: flex;
     flex-direction: row;
-    margin: px2rem(6px) px2rem(0px);
-    height: px2rem(51px);
-    // line-height: px2rem(51px);
-    font-size: px2rem(15px);
-    padding: px2rem(0px) px2rem(15px);
+    margin: 6px 0px;
+    height: 51px;
+    // line-height: 51px;
+    font-size: 15px;
+    padding: 0px 15px;
     background: rgba(248, 249, 250, 1);
-    border-radius: px2rem(6px);
+    border-radius: 6px;
     justify-content: space-between;
     align-items: center;
     .name {
-      max-width: px2rem(240px);
-      font-size: px2rem(15px);
-      line-height: px2rem(25px) !important;
+      max-width: 240px;
+      font-size: 15px;
+      line-height: 25px !important;
       color: #676869;
     }
     .action {
-      width: px2rem(60px);
-      height: px2rem(25px);
-      line-height: px2rem(25px);
+      width: 60px;
+      height: 25px;
+      line-height: 25px;
       text-align: center;
-      font-size: px2rem(12px);
+      font-size: 12px;
       font-weight: 700;
-      border-radius: px2rem(15px);
+      border-radius: 15px;
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
       // opacity: 0.45;
       border: 1px solid rgba(68, 146, 132, 0.6);
       color: rgba(68, 146, 132, 1);
     }
     .action-no {
-      width: px2rem(60px);
-      height: px2rem(25px);
-      line-height: px2rem(25px);
+      width: 60px;
+      height: 25px;
+      line-height: 25px;
       text-align: center;
-      font-size: px2rem(12px);
+      font-size: 12px;
       font-weight: 700;
-      border-radius: px2rem(15px);
+      border-radius: 15px;
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
       // opacity: 0.45;
       border: 1px solid #E7E8E9;
@@ -150,7 +149,7 @@ export default {
   }
 }
 .ht-for-m16 {
-  height: px2rem(66px);
+  height: 66px;
 }
 </style>
 

src/components/business/coop-list-item.vue

@@ -233,41 +233,40 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .coop-container {
   position: relative;
-  margin: px2rem(0px) px2rem(15px);
+  margin: 0px 15px;
   &-status {
     position: absolute;
-    top: px2rem(6px);
+    top: 6px;
     left: 0;
     // display: block;
-    width: px2rem(44px);
-    height: px2rem(18px);
-    line-height: px2rem(18px);
-    padding: px2rem(0px) 0 0 px2rem(4px);
+    width: 44px;
+    height: 18px;
+    line-height: 18px;
+    padding: 0px 0 0 4px;
     background: rgba(88, 144, 221, 1);
     color: #fff;
-    font-size: px2rem(11px);
-    border-top-right-radius: px2rem(3px);
-    border-bottom-right-radius: px2rem(3px);
+    font-size: 11px;
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
   }
 }
 .coop-item {
   display: flex;
   width: 100%;
-  height: px2rem(128px);
+  height: 128px;
   border-bottom: 1px solid #f0f0f0;
   background: #fff;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   img {
-    width: px2rem(115px);
-    height: px2rem(86px);
-    margin-right: px2rem(15px);
-    border-radius: px2rem(3px);
+    width: 115px;
+    height: 86px;
+    margin-right: 15px;
+    border-radius: 3px;
   }
   &-left {
     display: flex;
@@ -276,23 +275,23 @@ export default {
   }
   &-right {
     display: flex;
-    width: px2rem(215px);
+    width: 215px;
     flex-direction: column;
-    padding-top: px2rem(4px);
+    padding-top: 4px;
     &-title {
-      height: px2rem(50px);
-      line-height: px2rem(20px);
-      font-size: px2rem(16px);
+      height: 50px;
+      line-height: 20px;
+      font-size: 16px;
       font-weight: 700;
       color: rgba(55, 56, 57, 1);
     }
     &-other {
-      height: px2rem(21px);
-      line-height: px2rem(20px);
-      font-size: px2rem(13px);
+      height: 21px;
+      line-height: 20px;
+      font-size: 13px;
       font-weight: 400;
       color: rgba(151, 152, 153, 1);
-      width: px2rem(210px);
+      width: 210px;
       overflow : hidden;
       text-overflow: ellipsis;
       white-space:nowrap;
@@ -300,40 +299,40 @@ export default {
         position: absolute;
         z-index: 1;
         right: 0;
-        height: px2rem(18px);
-        line-height: px2rem(18px);
+        height: 18px;
+        line-height: 18px;
         color: #CAA861;
-        border-radius: px2rem(3px);
+        border-radius: 3px;
         // border: 1px solid rgba(202,168,97,1);
         &.sk {
           color: rgba(68, 146, 132, 1);
         }
         span {
           position: relative;
-          top: px2rem(-0.5px);
+          top: -0.5px;
           z-index: 2;
-          font-size: px2rem(11px);
-          padding: 0 px2rem(4px);
+          font-size: 11px;
+          padding: 0 4px;
         }
       }  
     }
   }
 }
 .update-dialog-content {
-  padding: 0 px2rem(15px);
+  padding: 0 15px;
   box-sizing: border-box;
   .title {
     text-align: center;
     color: #373839;
-    font-size: px2rem(18px);
-    padding: px2rem(15px) 0;
-    line-height: px2rem(25px);
+    font-size: 18px;
+    padding: 15px 0;
+    line-height: 25px;
   }
   .update-btn {
     text-align: center;
-    height: px2rem(55px);
-    line-height: px2rem(55px);
-    font-size: px2rem(16px);
+    height: 55px;
+    line-height: 55px;
+    font-size: 16px;
     color: #979899;
     &.confirm-btn {
       color: #449284;

src/components/business/material-list-item.vue

@@ -174,26 +174,25 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .mater-container {
   position: relative;
-  margin: px2rem(0px) px2rem(15px);
+  margin: 0px 15px;
 }
 .mater-item {
   display: flex;
   // width: 100%;
-  height: px2rem(80px);
+  height: 80px;
   border-bottom: 1px solid #f0f0f0;
   background: #fff;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   img {
-    width: px2rem(35px);
-    height: px2rem(37px);
-    margin-right: px2rem(10px);
-    border-radius: px2rem(3px) px2rem(2px) px2rem(2px) px2rem(3px);
+    width: 35px;
+    height: 37px;
+    margin-right: 10px;
+    border-radius: 3px 2px 2px 3px;
   }
   &-left {
     display: flex;
@@ -202,40 +201,40 @@ export default {
   }
   &-right {
     display: flex;
-    // width: px2rem(215px);
+    // width: 215px;
     flex: 1;
     flex-direction: column;
-    padding-top: px2rem(4px);
+    padding-top: 4px;
     &-title {
-      // height: px2rem(50px);
-      line-height: px2rem(23px);
-      font-size: px2rem(15px);
+      // height: 50px;
+      line-height: 23px;
+      font-size: 15px;
       font-weight: 700;
       color: rgba(55, 56, 57, 1);
     }
     &-other {
-      height: px2rem(22px);
-      line-height: px2rem(20px);
-      font-size: px2rem(13px);
+      height: 22px;
+      line-height: 20px;
+      font-size: 13px;
       font-weight: 400;
       color: rgba(151, 152, 153, 1);
     }
   }
   .mater-details {
     position: relative;
-    right: px2rem(-10px);
+    right: -10px;
     display: flex;
     flex-direction: row;
     align-items: center;
     span {
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 700;
       color: #666;
     }
     img {
-      width: px2rem(15px);
-      height: px2rem(16px);
+      width: 15px;
+      height: 16px;
     }
   }
 }

src/components/business/merge-title.vue

@@ -97,52 +97,51 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-title-container {
-  margin-top: px2rem(17px);
-  padding-left: px2rem(15px);
+  margin-top: 17px;
+  padding-left: 15px;
   // display: flex;
   // flex-direction: row;
   // justify-content: space-between;
   .comp-text {
     position: relative;
-    width: px2rem(345px);
+    width: 345px;
     overflow: hidden;
   }
 }
 .comp-title {
   position: relative;
-  width: px2rem(238px);
+  width: 238px;
   float: left;
-  line-height: px2rem(30px);
+  line-height: 30px;
 }
 .comp-title-explain {
   position: relative;
   float: right;
-  // margin-right: px2rem(15px);
-  margin-top: px2rem(3px);
+  // margin-right: 15px;
+  margin-top: 3px;
   span {
-    font-size: px2rem(14px);
+    font-size: 14px;
     font-weight: 400;
     color: rgba(12, 21, 39, 0.4);
-    // margin-right: px2rem(3px);
-    line-height: px2rem(18px);
-    height: px2rem(18px);
+    // margin-right: 3px;
+    line-height: 18px;
+    height: 18px;
     vertical-align: middle;
   }
   img {
-    width: px2rem(8px);
-    height: px2rem(12px);
+    width: 8px;
+    height: 12px;
     vertical-align: middle;
   }
 }
 .cert-img {
-  margin-top: px2rem(1px);
+  margin-top: 1px;
   .banner-img {
-    width: px2rem(70px);
-    height: px2rem(20px);
-    padding-top: px2rem(2px);
+    width: 70px;
+    height: 20px;
+    padding-top: 2px;
   }
 }
 </style>
\ No newline at end of file

src/components/business/no-content.vue

@@ -24,27 +24,26 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .nc-container {
   display: flex;
   width: 100%;
   flex-direction: column;
   justify-content: center;
   align-content: center;
-  margin-top: px2rem(100px);
-  margin-bottom: px2rem(20px);
+  margin-top: 100px;
+  margin-bottom: 20px;
   text-align: center;
   // margin: 0 auto;
   &-img {
-    margin-left: px2rem(100px);
-    width: px2rem(150px);
-    height: px2rem(150px);
+    margin-left: 100px;
+    width: 150px;
+    height: 150px;
   }
   &-text {
-    height: px2rem(21px);
-    line-height: px2rem(21px);
-    font-size: px2rem(15px);
+    height: 21px;
+    line-height: 21px;
+    font-size: 15px;
     font-weight: 400;
     color: rgba(153, 153, 153, 1);
   }

src/components/business/no-more-content.vue

@@ -17,13 +17,12 @@
   }
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .nc-container {
   display: flex;
   &-content {
     width: 100%;
-    height: px2rem(62px);
+    height: 62px;
   }
 }
 </style>

src/components/business/no-perm-content.vue

@@ -19,35 +19,34 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .nc-container {
   display: flex;
   width: 100%;
   flex-direction: column;
   justify-content: center;
   align-content: center;
-  margin-top: px2rem(70px);
+  margin-top: 70px;
   text-align: center;
   // margin: 0 auto;
   &-img {
-    width: px2rem(60px);
-    height: px2rem(72px);
-    margin-left: px2rem(157px);
-    margin-bottom: px2rem(15px);
+    width: 60px;
+    height: 72px;
+    margin-left: 157px;
+    margin-bottom: 15px;
   }
   &-text1 {
-    height: px2rem(15px);
-    line-height: px2rem(15px);
-    font-size: px2rem(15px);
+    height: 15px;
+    line-height: 15px;
+    font-size: 15px;
     font-weight: 500;
     color:rgba(103, 104, 105, 1);
   }
   &-text2 {
-    height: px2rem(16px);
-    line-height: px2rem(16px);
-    margin-top: px2rem(6px);
-    font-size: px2rem(13px);
+    height: 16px;
+    line-height: 16px;
+    margin-top: 6px;
+    font-size: 13px;
     font-weight: 400;
     color: rgba(151, 152, 153, 1);
   }

src/components/business/notice-item.vue

@@ -48,49 +48,48 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .item-notice-wrapper {
   .content {
     display: flex;
     flex-direction: row;
-    height: px2rem(32px);
-    line-height: px2rem(32px);
-    padding: 0 px2rem(15px);
+    height: 32px;
+    line-height: 32px;
+    padding: 0 15px;
     text-align: left;
     align-items: center;
     background: #FEFAF5;
     img {
-      width: px2rem(12px);
-      height: px2rem(12px);
-      line-height: px2rem(32px);
+      width: 12px;
+      height: 12px;
+      line-height: 32px;
     }
     span {
-      font-size: px2rem(13px);
+      font-size: 13px;
       text-align: left;
       &.gg {
-        // width: px2rem(30px);
-        padding: px2rem(1px) px2rem(5px) 0;
-        font-size: px2rem(13px);
+        // width: 30px;
+        padding: 1px 5px 0;
+        font-size: 13px;
         font-weight: 700;
         color: #835800;
       }
       &.vtc-line {
-        margin-top: px2rem(0px);
-        width: px2rem(1px);
-        height: px2rem(15px);
+        margin-top: 0px;
+        width: 1px;
+        height: 15px;
         background: #835800;
       }
       &.content {
         display: block;
         flex: 1;
-        padding-top: px2rem(1px);
-        // padding-left: px2rem(5px) !important;
-        padding: 0 px2rem(10px) 0 px2rem(5px);
-        height: px2rem(32px);
-        line-height: px2rem(32px);
+        padding-top: 1px;
+        // padding-left: 5px !important;
+        padding: 0 10px 0 5px;
+        height: 32px;
+        line-height: 32px;
         text-align: left;
-        font-size: px2rem(13px);
+        font-size: 13px;
         font-weight: 700;
         color: #E6A23C;
         white-space: nowrap;

src/components/business/pop-cert.vue

@@ -150,8 +150,7 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .pop-sign-box {
   position: fixed;
   width: 100%;
@@ -162,67 +161,67 @@ export default {
   .pop-box {
     background: #fff;
     // background: #00FF00 url(../../images/tankuang.png) no-repeat center center ;
-    width: px2rem(280px);
-    height: px2rem(312px);
-    border-radius: px2rem(7px);
+    width: 280px;
+    height: 312px;
+    border-radius: 7px;
     position: absolute;
     z-index: 112;
     text-align: center;
     left: 50%;
     top: 50%;
-    margin: px2rem(-180px) 0 0 px2rem(-140px);
+    margin: -180px 0 0 -140px;
     img {
-      width: px2rem(280px);
-      height: px2rem(312px);
+      width: 280px;
+      height: 312px;
       vertical-align: middle;
     }
     &-btn {
       position: relative;
-      top: px2rem(-62px);
+      top: -62px;
       display: inline-block;
-      width: px2rem(215px);
-      height: px2rem(44px);
-      line-height: px2rem(44px);
+      width: 215px;
+      height: 44px;
+      line-height: 44px;
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
-      font-size: px2rem(16px);
+      font-size: 16px;
       background: linear-gradient(
         360deg,
         rgba(255, 227, 97, 1) 0%,
         rgba(255, 217, 121, 1) 100%
       );
-      box-shadow: 0px px2rem(4px) px2rem(4px) 0px rgba(0, 0, 0, 0.09);
-      border-radius: px2rem(22px);
+      box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.09);
+      border-radius: 22px;
       color: #a78400;
       font-weight: 700;
     }
   }
   .pop-text {
     position: absolute;
-    top: px2rem(160px);
+    top: 160px;
     width: 100%;
     text-align: center;
     &-joy {
       color: #ff9a4b;
-      font-size: px2rem(24px);
+      font-size: 24px;
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
       font-weight: 700;
     }
     &-tips {
       // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
       color: #ff9a4b;
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 400;
-      padding: px2rem(8px) px2rem(10px) px2rem(24px) px2rem(10px);
+      padding: 8px 10px 24px 10px;
     }
   }
   // .si-joy {
   //   color: #ff7c26;
-  //   font-size: px2rem(18px);
+  //   font-size: 18px;
   // }
   // .si-tips {
   //   color: #666;
-  //   font-size: px2rem(14px);
-  //   padding: px2rem(8px) px2rem(10px) px2rem(24px) px2rem(10px);
+  //   font-size: 14px;
+  //   padding: 8px 10px 24px 10px;
   // }
   .pop-mask {
     position: absolute;
@@ -233,18 +232,18 @@ export default {
   }
   .sin-close {
     position: absolute;
-    width: px2rem(30px);
-    height: px2rem(30px);
-    bottom: px2rem(-50px);
-    margin-left: px2rem(-15px);
+    width: 30px;
+    height: 30px;
+    bottom: -50px;
+    margin-left: -15px;
     left: 50%;
     img {
-      width: px2rem(30px);
-      height: px2rem(30px);
+      width: 30px;
+      height: 30px;
       display: block;
     }
   }
-  // font-size:px2rem(12px) ;
+  // font-size:12px ;
 }
 </style>
 

src/components/business/pop-notice.vue

@@ -60,8 +60,7 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .pop-notice-wrapper {
   position: fixed;
   width: 100%;
@@ -69,7 +68,7 @@ export default {
   left: 0;
   top: 0;
   z-index: 110;
-  font-size: px2rem(20px);
+  font-size: 20px;
   .mask {
     position: absolute;
     background: rgba(0, 0, 0, 0.5);
@@ -82,19 +81,19 @@ export default {
     left: 50%;
     top: 50%;
     z-index: 112;
-    width: px2rem(300px);
-    // height: px2rem(185px);
-    margin: px2rem(-150px) 0 0 px2rem(-150px);
-    border-radius: px2rem(3px);
+    width: 300px;
+    // height: 185px;
+    margin: -150px 0 0 -150px;
+    border-radius: 3px;
 
     text-align: center;
     background: #fff;
     .top {
-      padding: px2rem(30px);
+      padding: 30px;
       .title {
         display: inline-block;
-        font-size: px2rem(18px);
-        line-height: px2rem(28px);
+        font-size: 18px;
+        line-height: 28px;
         word-break: break-all;
         font-weight: 400;
         color: #333333;
@@ -103,10 +102,10 @@ export default {
         text-align: left;
         word-break: break-all;
         display: inline-block;
-        margin: px2rem(14px) 0;
-        font-size: px2rem(14px);
-        height: px2rem(21px);
-        line-height: px2rem(21px);
+        margin: 14px 0;
+        font-size: 14px;
+        height: 21px;
+        line-height: 21px;
         font-weight: 400;
         color: #676869;
         .b {
@@ -115,18 +114,18 @@ export default {
       }
     }
     .line {
-      width: px2rem(300px);
-      height: px2rem(1px);
+      width: 300px;
+      height: 1px;
       background: rgba(240, 241, 242, 1);
     }
     .bottom {
       text-align: center;
-      font-size: px2rem(17px);
-      height: px2rem(50px);
-      line-height: px2rem(50px);
+      font-size: 17px;
+      height: 50px;
+      line-height: 50px;
       font-weight: 400;
       span {
-        font-size: px2rem(17px);
+        font-size: 17px;
         color: #449284;
       }
     }

src/components/business/update-dialog.vue

@@ -31,8 +31,7 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
-  @import "../../style/mixin";
+<style lang="less" scoped>
   .dialog-mask-container{
     position: fixed;
     top: 0;
@@ -54,24 +53,24 @@ export default {
       top: 50%;
       left: 50%;
       overflow: hidden;
-      width: px2rem(300px);
-      font-size: px2rem(18px);
+      width: 300px;
+      font-size: 18px;
       -webkit-transition: .3s;
       transition: .3s;
-      border-radius: px2rem(4px);
+      border-radius: 4px;
       background-color: #fff;
       -webkit-transform: translate3d(-50%,-50%,0);
       transform: translate3d(-50%,-50%,0);
       -webkit-backface-visibility: hidden;
       backface-visibility: hidden;
       .dialog-content{
-        padding: px2rem(30px) px2rem(22px);
+        padding: 30px 22px;
         text-align: center;
-        font-size: px2rem(18px);
+        font-size: 18px;
         color: #373839;
       }
       .dialog-footer{
-        height: px2rem(50px);
+        height: 50px;
         display: flex;
         align-items: center;
         &.v-hairline-top::after{
@@ -80,9 +79,9 @@ export default {
         span{
           display: inline-block;
           width: 50%;
-          height: px2rem(50px);
-          line-height: px2rem(50px);
-          font-size: px2rem(17px);
+          height: 50px;
+          line-height: 50px;
+          font-size: 17px;
           text-align: center;
           color: #979899;
           &.v-hairline-left::after{

src/components/cme/I-card-item.vue

@@ -78,26 +78,25 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .I-card-item-wrapper {
   // width: 100%;
-  margin: 0 px2rem(15px);
+  margin: 0 15px;
   .item {
     // width: 100%;
     display: flex;
-    height: px2rem(72px);
+    height: 72px;
     flex-direction: row;
     align-content: space-between;
     align-items: center;
     // box-sizing: border-box;
-    padding: 0 px2rem(15px);
+    padding: 0 15px;
     background: #f8f9fa;
-    border-radius: px2rem(6px);
+    border-radius: 6px;
     .left-icon {
-      width: px2rem(40px);
-      height: px2rem(40px);
-      margin-right: px2rem(15px);
+      width: 40px;
+      height: 40px;
+      margin-right: 15px;
     }
     .center {
       position: relative;
@@ -106,25 +105,25 @@ export default {
       display: flex;
       flex-direction: column;
       flex: 1;
-      height: px2rem(40px);
+      height: 40px;
       align-content: flex-start;
       text-align: left;
       .top {
-        height: px2rem(26px);
-        line-height: px2rem(26px);
-        font-size: px2rem(16px);
+        height: 26px;
+        line-height: 26px;
+        font-size: 16px;
         font-weight: 700;
         color: rgba(55, 56, 57, 1);
       }
       .bottom {
-        font-size: px2rem(14px);
+        font-size: 14px;
         font-weight: 400;
         color: rgba(151, 152, 153, 1);
       }
     }
     .right-icon {
-      width: px2rem(15px);
-      height: px2rem(15px);
+      width: 15px;
+      height: 15px;
     }
   }
 }

src/components/cme/basic-info.vue

@@ -89,32 +89,31 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .basic-container {
-  padding-bottom: px2rem(20px);
-  margin: px2rem(30px) px2rem(15px) 0px;
-  border-bottom: px2rem(1px) solid #e7e8e9;
+  padding-bottom: 20px;
+  margin: 30px 15px 0px;
+  border-bottom: 1px solid #e7e8e9;
   .basic-title {
-    font-size: px2rem(18px);
-    line-height: px2rem(18px);
+    font-size: 18px;
+    line-height: 18px;
     color: #373839;
     font-weight: 700;
   }
   .pro-name {
     display: flex;
     flex-direction: row;
-    margin-top: px2rem(16px);
-    font-size: px2rem(14px);
+    margin-top: 16px;
+    font-size: 14px;
     span {
       display: flex;
-      font-size: px2rem(14px);
+      font-size: 14px;
       align-items: center;
-      line-height: px2rem(22px);
+      line-height: 22px;
       align-content: flex-start;
       text-align: justify;
       &.title {
-        width: px2rem(84px);
+        width: 84px;
         color: #979899;
       }
       &.name {
@@ -124,20 +123,20 @@ export default {
     }
   }
   .content {
-    margin-top: px2rem(16px);
-    height: px2rem(16px);
-    line-height: px2rem(0px);
+    margin-top: 16px;
+    height: 16px;
+    line-height: 0px;
     span {
       display: inline-block;
-      font-size: px2rem(14px);
+      font-size: 14px;
       .split {
         display: inline-block;
         position: relative;
-        top: px2rem(2px);
+        top: 2px;
         left: 0;
-        width: px2rem(1px);
-        height: px2rem(13px);
-        margin: 0 px2rem(2px);
+        width: 1px;
+        height: 13px;
+        margin: 0 2px;
         background: #676869;
       }
     }
@@ -145,33 +144,33 @@ export default {
       color: #979899;
     }
     span:last-child {
-      margin-left: px2rem(15px);
+      margin-left: 15px;
       color: #676869;
     }
 
 
   }
   .remind {
-    line-height: px2rem(14px);
-    margin-top: px2rem(10px);
+    line-height: 14px;
+    margin-top: 10px;
     span {
       position: relative;
       display: inline-block;
-      padding: px2rem(5px) px2rem(10px);
-      margin-left: px2rem(78px);
-      font-size: px2rem(14px);
+      padding: 5px 10px;
+      margin-left: 78px;
+      font-size: 14px;
       color: #fb5b52;
       background: #fceeed;
-      border-radius: px2rem(4px);
+      border-radius: 4px;
     }
     span:after {
       content: "";
       position: absolute;
-      left: px2rem(10px);
-      bottom: px2rem(20px);
+      left: 10px;
+      bottom: 20px;
       width: 0;
       height: 0;
-      border-width: 0 px2rem(8px) px2rem(8px);
+      border-width: 0 8px 8px;
       border-style: solid;
       border-color: transparent transparent #fceeed;
     }

src/components/cme/bind-card-button.vue

@@ -39,8 +39,7 @@ export default {
   }
 };
 </script>
-<style  lang="scss" scoped>
-@import "../../style/mixin";
+<style  lang="less" scoped>
 .bind-cart-wrapper {
   position: fixed;
   left: 0;
@@ -49,28 +48,28 @@ export default {
   width: 100%;
   display: flex;
   flex-direction: row;
-  height: px2rem(60px);
+  height: 60px;
   line-height: 1;
   justify-content: space-between;
-  padding: px2rem(10px) px2rem(15px);
-  font-size: px2rem(14px);
+  padding: 10px 15px;
+  font-size: 14px;
   background: rgba(255, 255, 255, 1);
   box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.1);
   .left {
     display: flex;
     flex-direction: column;
-    height: px2rem(40px);
+    height: 40px;
     line-height: 1;
     font-size: 12px;
     // align-items: ;
     .top {
-      margin-top: px2rem(3px);
-      height: px2rem(24px);
+      margin-top: 3px;
+      height: 24px;
       .discount {
         color: #fb5b52;
-        font-size: px2rem(18px);
+        font-size: 18px;
         font-weight: 700;
-        margin-right: px2rem(4px);
+        margin-right: 4px;
       }
       .price {
         color: #979899;
@@ -80,10 +79,10 @@ export default {
       display: flex;
       flex-direction: row;
       img {
-        width: px2rem(12px);
-        height: px2rem(12px);
+        width: 12px;
+        height: 12px;
         margin-left: 1px;
-        margin-right: px2rem(4px);
+        margin-right: 4px;
       }
       color: #979899;
     }
@@ -96,14 +95,14 @@ export default {
       flex-direction: row;
       align-items: center;
       justify-content: center;
-      width: px2rem(80px);
-      font-size: px2rem(14px);
+      width: 80px;
+      font-size: 14px;
       font-weight: 400;
       text-align: center;
       color: #7f7f7f;
       border: 1px solid #d2b573;
       &.left {
-        border-radius: px2rem(20px) 0px 0px px2rem(20px);
+        border-radius: 20px 0px 0px 20px;
         border-right-style: none;
         // color: #ff7a4b;
       }
@@ -113,7 +112,7 @@ export default {
         //   rgba(255, 166, 95, 1) 0%,
         //   rgba(255, 122, 75, 1) 100%
         // );
-        border-radius: 0px px2rem(20px) px2rem(20px) 0px;
+        border-radius: 0px 20px 20px 0px;
         // color: #fff;
       }
     }

src/components/cme/card-banner.vue

@@ -67,45 +67,44 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .card-banner-wrapper {
   width: 100%;
-  height: px2rem(40px);
+  height: 40px;
   display: flex;
   flex-direction: row;
-  padding: 0 px2rem(15px);
+  padding: 0 15px;
   justify-content: space-between;
   align-items: center;
   background: #fefaf5;
   .left {
     display: flex;
-    height: px2rem(40px);
+    height: 40px;
     flex-direction: row;
     align-items: center;
     img {
-      width: px2rem(13px);
-      height: px2rem(13px);
-      margin-right: px2rem(4px);
+      width: 13px;
+      height: 13px;
+      margin-right: 4px;
       &.is-android {
-        width: px2rem(12px);
-        height: px2rem(13px);
-        margin-bottom: px2rem(2px);
+        width: 12px;
+        height: 13px;
+        margin-bottom: 2px;
       }
     }
     span {
-      font-size: px2rem(13px);
+      font-size: 13px;
       color: #e6a23c;
     }
   }
   .right {
-    height: px2rem(25px);
-    line-height: px2rem(25px);
-    font-size: px2rem(12px);
-    padding: 0 px2rem(10px);
+    height: 25px;
+    line-height: 25px;
+    font-size: 12px;
+    padding: 0 10px;
     background: rgba(230, 162, 60, 1);
-    border-radius: px2rem(25px);
-    border: px2rem(1px) solid rgba(230, 162, 60, 1);
+    border-radius: 25px;
+    border: 1px solid rgba(230, 162, 60, 1);
     color: #ffffff;
   }
 }

src/components/cme/card-popup.vue

@@ -72,33 +72,32 @@ export default {
   },
 }
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .card-popup-wrapper {
   .content {
-    font-size: px2rem(14px);
-    width: px2rem(300px);
-    // height: px2rem(245px);
-    padding-top: px2rem(30px);
+    font-size: 14px;
+    width: 300px;
+    // height: 245px;
+    padding-top: 30px;
     .title {
       text-align: center;
-      font-size: px2rem(18px);
+      font-size: 18px;
       font-weight: 700;
     }
     .card-info {
       display: flex;
       flex-direction: row;
       align-items: center;
-      height: px2rem(76px);
-      margin: px2rem(15px);
-      padding: 0 px2rem(8px);
+      height: 76px;
+      margin: 15px;
+      padding: 0 8px;
       background: #F8F9FA;
-      border-radius: px2rem(6px);
-      font-size: px2rem(14px);
+      border-radius: 6px;
+      font-size: 14px;
       .icon {
-        width: px2rem(60px);
-        height: px2rem(60px);
-        margin-right: px2rem(8px);
+        width: 60px;
+        height: 60px;
+        margin-right: 8px;
       }
       .info {
         width: 100%;
@@ -107,20 +106,20 @@ export default {
         left: 0;
         .name {
           position: absolute;
-          top: px2rem(-30px);
-          left: px2rem(4px);
+          top: -30px;
+          left: 4px;
         }
         p {
           position: absolute;
-          bottom: px2rem(-34px);
+          bottom: -34px;
           left: 0px;
           display: flex;
           align-items: center;          
           .price {
             color: #FB5B52;
-            font-size: px2rem(18px);
+            font-size: 18px;
             font-weight: 700;
-            margin-right: px2rem(8px);
+            margin-right: 8px;
           }
           .discount {
             color: #979899;
@@ -130,21 +129,21 @@ export default {
       .info2 {
        display: flex;
        flex-direction: column;
-        .name {
-          // position: absolute;
-          // top: px2rem(-30px);
-          // left: px2rem(4px);
-        }
+        // .name {
+        //   position: absolute;
+        //   top: -30px;
+        //   left: 4px;
+        // }
         p {
           display: flex;
           align-items: center;
-          height: px2rem(24px);
-          line-height: px2rem(24px);
+          height: 24px;
+          line-height: 24px;
           .price {
             color: #FB5B52;
-            font-size: px2rem(18px);
+            font-size: 18px;
             font-weight: 700;
-            margin-right: px2rem(8px);
+            margin-right: 8px;
           }
           .discount {
             color: #979899;
@@ -153,8 +152,8 @@ export default {
       }
     }
     .line {
-      margin-top: px2rem(30px);
-      height: px2rem(1px);
+      margin-top: 30px;
+      height: 1px;
       background: #F0F1F2;
     }
     .btn {
@@ -163,9 +162,9 @@ export default {
       flex-direction: row;
       // justify-content: space-between;
       align-items: center;
-      height: px2rem(50px);
-      // margin-top: px2rem(15px);
-      font-size: px2rem(17px);
+      height: 50px;
+      // margin-top: 15px;
+      font-size: 17px;
       .left {
         flex: 1;
         text-align: center;
@@ -174,7 +173,7 @@ export default {
       }
       .vert-line {
         border-right: 1px solid #F0F1F2;
-        // width: px2rem(1px);
+        // width: 1px;
         height: 100%;
       }
       .right {
@@ -185,7 +184,7 @@ export default {
     }
   }
   .van-popup.van-popup--center {
-    border-radius: px2rem(4px);
+    border-radius: 4px;
   }
 }
 

src/components/cme/change-card.vue

@@ -104,13 +104,12 @@ export default {
   }
 };
 </script>
-<style  lang="scss" scoped>
-@import "../../style/mixin";
+<style  lang="less" scoped>
 .bind-cart-wrapper {
   width: 100%;
   display: flex;
   line-height: 1;
-  padding: px2rem(10px) px2rem(15px);
+  padding: 10px 15px;
   display: flex;
   flex-direction: column;
   background: rgba(255, 255, 255, 1);
@@ -123,40 +122,40 @@ export default {
     align-items: center;
     justify-content: center;
     width: 100%;
-    margin-top: px2rem(20px);
+    margin-top: 20px;
     img {
       position: relative;
       top: 0;
-      right: px2rem(-120px);
-      width: px2rem(12px);
-      height: px2rem(12px);
+      right: -120px;
+      width: 12px;
+      height: 12px;
     }
   }
   .tip {
     display: flex;
-    margin-top: px2rem(40px);
+    margin-top: 40px;
     .left {
       display: flex;
       line-height: 1.2;
-      font-size: px2rem(12px);
+      font-size: 12px;
       .img-wrapper {
-        width: px2rem(20px);
-        // margin-right: px2rem(4px);
+        width: 20px;
+        // margin-right: 4px;
         img {
           position: relative;
-          top: px2rem(1px);
-          width: px2rem(12px);
-          height: px2rem(12px);
+          top: 1px;
+          width: 12px;
+          height: 12px;
         }
         img.android {
-          top: px2rem(1.5px);
-          width: px2rem(11.5px);
+          top: 1.5px;
+          width: 11.5px;
         }
       }
 
       span {
         display: inline-block;
-        margin-left: px2rem(4px);
+        margin-left: 4px;
       }
       color: #979899;
     }
@@ -167,40 +166,40 @@ export default {
       position: relative;
       display: flex;
       flex-direction: column;
-      padding: px2rem(20px) 0;
+      padding: 20px 0;
       padding-top: 0;
       .cover {
-        width: px2rem(286px);
+        width: 286px;
         position: absolute;
-        top: px2rem(21.5px);
+        top: 21.5px;
         z-index: 1000;
-        border-top: px2rem(4px) solid #fff;
-        margin-left: px2rem(57px);
-        margin-right: px2rem(1px);
-        border-radius: px2rem(4px);
+        border-top: 4px solid #fff;
+        margin-left: 57px;
+        margin-right: 1px;
+        border-radius: 4px;
       }
     }
     .error {
       position: absolute;
-      top: px2rem(66px);
-      left: px2rem(56px);
+      top: 66px;
+      left: 56px;
       display: inline-block;
       color: red;
-      font-size: px2rem(12px);
+      font-size: 12px;
     }
 
     img {
       position: absolute;
-      top: px2rem(33px);
-      right: px2rem(12px);
-      width: px2rem(15px);
-      height: px2rem(15px);
+      top: 33px;
+      right: 12px;
+      width: 15px;
+      height: 15px;
     }
   }
 
   .bottom {
     display: flex;
-    margin-bottom: px2rem(40px);
+    margin-bottom: 40px;
   }
 }
 </style>
\ No newline at end of file

src/components/cme/cme-step.vue

@@ -208,11 +208,10 @@ export default {
   }
 };
 </script>
-<style  lang="scss" scoped>
-@import "../../style/mixin";
+<style  lang="less" scoped>
 .step-content {
   position: relative;
-  height: px2rem(110px);
+  height: 110px;
   background: rgba(248, 249, 250, 1);
   display: flex;
   flex-direction: row;
@@ -221,25 +220,25 @@ export default {
   .step-item {
     flex-grow: 1;
     text-align: center;
-    padding-top: px2rem(20px);
-    line-height: px2rem(20px);
+    padding-top: 20px;
+    line-height: 20px;
     span {
       display: inline-block;
-      width: px2rem(20px);
-      height: px2rem(20px);
-      line-height: px2rem(17px);
+      width: 20px;
+      height: 20px;
+      line-height: 17px;
       border-radius: 50%;
       background: #676869;
       border: 2px solid rgba(255, 255, 255, 1);
       color: #fff;
-      font-size: px2rem(12px);
+      font-size: 12px;
       font-weight: 700;
     }
     span.actived {
       background: #449284;
     }
     p {
-      font-size: px2rem(13px);
+      font-size: 13px;
       color: #373839;
     }
     p.actived {
@@ -248,19 +247,19 @@ export default {
   }
   .step-line {
     position: absolute;
-    top: px2rem(58px);
-    width: px2rem(75px);
-    height: px2rem(3px);
+    top: 58px;
+    width: 75px;
+    height: 3px;
     background: #dadde1;
   }
   .step-one-line {
-    left: px2rem(56px);
+    left: 56px;
   }
   .step-two-line {
-    left: px2rem(150px);
+    left: 150px;
   }
   .step-three-line {
-    right: px2rem(56px);
+    right: 56px;
   }
   .step-one-line.actived,
   .step-two-line.actived,
@@ -269,113 +268,113 @@ export default {
   }
   .step-text {
     position: absolute;
-    top: px2rem(25px);
-    padding: px2rem(4px) px2rem(6px);
+    top: 25px;
+    padding: 4px 6px;
     background: #449284;
-    border-radius: px2rem(10px);
-    font-size: px2rem(12px);
-    line-height: px2rem(12px);
+    border-radius: 10px;
+    font-size: 12px;
+    line-height: 12px;
     color: #fff;
     img {
         display: inline-block;
-        width: px2rem(6px);
-        height: px2rem(9px);
-        padding-left: px2rem(4px);
+        width: 6px;
+        height: 9px;
+        padding-left: 4px;
     }
   }
   .step1-text {
-    left: px2rem(20px);
+    left: 20px;
   }
   .step1-text:after {
     content: "";
-    width: px2rem(0px);
-    height: px2rem(0px);
-    border-top: px2rem(7px) solid #449284;
-    border-left: px2rem(7px) solid transparent;
-    border-right: px2rem(7px) solid transparent;
+    width: 0px;
+    height: 0px;
+    border-top: 7px solid #449284;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
     position: absolute;
-    top: px2rem(18px);
-    left: px2rem(21px);
+    top: 18px;
+    left: 21px;
   }
   .step2-text {
-    left: px2rem(106px);
+    left: 106px;
   }
   .step2-text:after,
   .step3-text:after {
     content: "";
-    width: px2rem(0px);
-    height: px2rem(0px);
-    border-top: px2rem(7px) solid #449284;
-    border-left: px2rem(7px) solid transparent;
-    border-right: px2rem(7px) solid transparent;
+    width: 0px;
+    height: 0px;
+    border-top: 7px solid #449284;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
     position: absolute;
-    top: px2rem(18px);
-    left: px2rem(29px);
+    top: 18px;
+    left: 29px;
   }
   .step3-text {
-    left: px2rem(207px);
+    left: 207px;
   }
   .step3-text:after {
     content: "";
-    width: px2rem(0px);
-    height: px2rem(0px);
-    border-top: px2rem(7px) solid #449284;
-    border-left: px2rem(7px) solid transparent;
-    border-right: px2rem(7px) solid transparent;
+    width: 0px;
+    height: 0px;
+    border-top: 7px solid #449284;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
     position: absolute;
-    top: px2rem(18px);
-    left: px2rem(21px);
+    top: 18px;
+    left: 21px;
   }
   .step4-text {
-    right: px2rem(20px);
+    right: 20px;
   }
   .step4-text:after {
     content: "";
-    width: px2rem(0px);
-    height: px2rem(0px);
-    border-top: px2rem(7px) solid #449284;
-    border-left: px2rem(7px) solid transparent;
-    border-right: px2rem(7px) solid transparent;
+    width: 0px;
+    height: 0px;
+    border-top: 7px solid #449284;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
     position: absolute;
-    top: px2rem(18px);
-    right: px2rem(20px);
+    top: 18px;
+    right: 20px;
   }
   .apply-score-content {
     display: flex;
     position: absolute;
-    left: px2rem(105px);
-    top: px2rem(-42px);
+    left: 105px;
+    top: -42px;
     background: #000;
     opacity: 0.6;
-    width: px2rem(236px);
-    height: px2rem(51px);
-    border-radius: px2rem(6px);
+    width: 236px;
+    height: 51px;
+    border-radius: 6px;
     .title {
-      font-size: px2rem(12px);
+      font-size: 12px;
       color: rgba(255, 255, 255, 1);
-      margin: px2rem(7px) px2rem(11px) 0 px2rem(0px);
-      width: px2rem(133px);
+      margin: 7px 11px 0 0px;
+      width: 133px;
     }
     .lm {
-      width: px2rem(41px);
+      width: 41px;
       img {
         display: inline-block;
-        width: px2rem(20px);
-        padding: 0 0 px2rem(7px) px2rem(15px);
+        width: 20px;
+        padding: 0 0 7px 15px;
       }
     }
     .line {
-      width: px2rem(1px);
-      height: px2rem(51px);
+      width: 1px;
+      height: 51px;
       background: #fff;
       opacity: 0.18;
     }
     .rm {
-      width: px2rem(41px);
+      width: 41px;
       img {
         display: inline-block;
-        width: px2rem(15px);
-        padding: 0 px2rem(15px) px2rem(7px);
+        width: 15px;
+        padding: 0 15px 7px;
       }
     }
   }

src/components/cme/common-bottom-info.vue

@@ -7,8 +7,7 @@
     </div>
   </div>
 </template>
-<style  lang="scss" scoped>
-@import "../../style/mixin";
+<style  lang="less" scoped>
 .common-bottom-info-wrapper {
   position: fixed;
   width: 100%;

src/components/cme/common-button.vue

@@ -27,20 +27,19 @@ export default {
   },
 }
 </script>
-<style  lang="scss" scoped>
-  @import "../../style/mixin";
+<style  lang="less" scoped>
   .common-button-wrapper {
-    font-size: px2rem(14px);
-    margin: px2rem(20px) px2rem(15px);
+    font-size: 14px;
+    margin: 20px 15px;
     text-align: center;
     &.button-default {
       span {
         display: block;
-        height: px2rem(50px);
-        line-height: px2rem(50px);
+        height: 50px;
+        line-height: 50px;
         width: 100%;
-        border-radius: px2rem(25px);
-        font-size: px2rem(17px);
+        border-radius: 25px;
+        font-size: 17px;
         font-weight: 700;
         color: #FFFFFF;
         background: #449284;

src/components/cme/common-dialog.vue

@@ -56,8 +56,7 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .common-dialog-wrraper {
   position: fixed;
   top: 0;
@@ -79,35 +78,35 @@ export default {
     top: 50%;
     left: 50%;
     overflow: hidden;
-    width: px2rem(300px);
-    font-size: px2rem(18px);
+    width: 300px;
+    font-size: 18px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
-    border-radius: px2rem(4px);
+    border-radius: 4px;
     background-color: #fff;
     -webkit-transform: translate3d(-50%, -50%, 0);
     transform: translate3d(-50%, -50%, 0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     .dialog-content {
-      // margin: px2rem(30px) px2rem(22px);
-      margin: px2rem(30px);
+      // margin: 30px 22px;
+      margin: 30px;
       text-align: center;
-      font-size: px2rem(18px);
+      font-size: 18px;
       font-weight: 400;
       color: #373839;
     }
     .dialog-sub-content {
-      margin: px2rem(-16px) px2rem(30px) px2rem(30px);
-      // margin: px2rem(-16px) px2rem(22px) px2rem(30px);
+      margin: -16px 30px 30px;
+      // margin: -16px 22px 30px;
       text-align: left;
-      font-size: px2rem(14px);
-      line-height: px2rem(24px);
+      font-size: 14px;
+      line-height: 24px;
       font-weight: 400;
       color: #676869;
     }
     .dialog-footer {
-      height: px2rem(50px);
+      height: 50px;
       display: flex;
       align-items: center;
       &.v-hairline-top::after {
@@ -117,9 +116,9 @@ export default {
         display: inline-block;
         // width: 50%;
         flex: 1;
-        height: px2rem(50px);
-        line-height: px2rem(50px);
-        font-size: px2rem(17px);
+        height: 50px;
+        line-height: 50px;
+        font-size: 17px;
         text-align: center;
         color: #979899;
         &.v-hairline-left::after {
@@ -154,7 +153,7 @@ export default {
   &.shikan {
     .dialog-sub-content {
       text-align: center;
-      font-size: px2rem(16px);
+      font-size: 16px;
     }
   }
 }

src/components/cme/exjumper-button.vue

@@ -27,26 +27,25 @@ export default {
   },
 }
 </script>
-<style  lang="scss" scoped>
-  @import "../../style/mixin";
+<style  lang="less" scoped>
   .exjumper-button-wrapper {
     position: fixed;
     left: 0;
     bottom: 0;
     right: 0;
     z-index: 1000;
-    font-size: px2rem(14px);
-    padding: px2rem(20px) px2rem(15px);
+    font-size: 14px;
+    padding: 20px 15px;
     background: linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
     text-align: center;
     &.button-default {
       span {
         display: block;
-        height: px2rem(50px);
-        line-height: px2rem(50px);
+        height: 50px;
+        line-height: 50px;
         width: 100%;
-        border-radius: px2rem(25px);
-        font-size: px2rem(17px);
+        border-radius: 25px;
+        font-size: 17px;
         font-weight: 700;
         color: #FFFFFF;
         background: #449284;

src/components/cme/exjumper-dialog.vue

@@ -66,8 +66,7 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .exjumper-dialog-wrraper {
   position: fixed;
   top: 0;
@@ -89,54 +88,54 @@ export default {
     top: 50%;
     left: 50%;
     overflow: hidden;
-    width: px2rem(300px);
-    font-size: px2rem(18px);
+    width: 300px;
+    font-size: 18px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
-    border-radius: px2rem(4px);
+    border-radius: 4px;
     background-color: #fff;
     -webkit-transform: translate3d(-50%, -50%, 0);
     transform: translate3d(-50%, -50%, 0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     .title {
-      margin: px2rem(30px) 0 px2rem(20px);
+      margin: 30px 0 20px;
       text-align: center;
-      font-size: px2rem(18px);
+      font-size: 18px;
       font-weight: 700;
       color: #373839;
     }
     .dialog-content {
-      // margin: px2rem(30px) px2rem(22px);
-      margin: px2rem(20px) px2rem(16px) px2rem(30px);
+      // margin: 30px 22px;
+      margin: 20px 16px 30px;
       text-align: left;
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 400;
       color: #373839;
     }
     .sub-wrapper {
-      margin-right: px2rem(5px);
-      max-height: px2rem(300px);
+      margin-right: 5px;
+      max-height: 300px;
       overflow: auto;
       .dialog-sub-content {
-        margin: 0 px2rem(8px) px2rem(20px) px2rem(16px);
+        margin: 0 8px 20px 16px;
         text-align: left;
-        font-size: px2rem(14px);
-        line-height: px2rem(24px);
+        font-size: 14px;
+        line-height: 24px;
         font-weight: 400;
         color: #979899;
       }
       .dialog-img-1 {
-        width: px2rem(268px);
-        height: px2rem(165px);
-        margin-left: px2rem(16px);
-        margin-bottom: px2rem(20px);
+        width: 268px;
+        height: 165px;
+        margin-left: 16px;
+        margin-bottom: 20px;
       }
       .dialog-img-2 {
-        width: px2rem(268px);
-        height: px2rem(145px);
-        margin-left: px2rem(16px);
-        margin-bottom: px2rem(20px);
+        width: 268px;
+        height: 145px;
+        margin-left: 16px;
+        margin-bottom: 20px;
       }
 
       &::-webkit-scrollbar-track-piece {
@@ -144,30 +143,30 @@ export default {
         border-left: 1px solid rgba(0, 0, 0, 0);
       }
       &::-webkit-scrollbar {
-        width: px2rem(5px);
-        height: px2rem(13px);
-        -webkit-border-radius: px2rem(3px);
-        -moz-border-radius: px2rem(3px);
-        border-radius: px2rem(3px);
+        width: 5px;
+        height: 13px;
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        border-radius: 3px;
       }
       &::-webkit-scrollbar-thumb {
         background-color: #C7C8C9;
         background-clip: padding-box;
-        -webkit-border-radius: px2rem(3px);
-        -moz-border-radius: px2rem(3px);
-        border-radius: px2rem(3px);
-        min-height: px2rem(28px);
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        border-radius: 3px;
+        min-height: 28px;
       }
       &::-webkit-scrollbar-thumb:hover {
         background-color: #C7C8C9;
-        -webkit-border-radius: px2rem(3px);
-        -moz-border-radius: px2rem(3px);
-        border-radius: px2rem(3px);
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        border-radius: 3px;
       }
     }
 
     .dialog-footer {
-      height: px2rem(50px);
+      height: 50px;
       display: flex;
       align-items: center;
       &.v-hairline-top::after {
@@ -177,9 +176,9 @@ export default {
         display: inline-block;
         // width: 50%;
         flex: 1;
-        height: px2rem(50px);
-        line-height: px2rem(50px);
-        font-size: px2rem(17px);
+        height: 50px;
+        line-height: 50px;
+        font-size: 17px;
         text-align: center;
         color: #979899;
         &.v-hairline-left::after {

src/components/cme/item-intro.vue

@@ -40,41 +40,40 @@ export default {
     }
 }
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .item-intro-container {
-    padding-bottom: px2rem(20px);
-    margin: px2rem(30px) px2rem(15px) 0px;
-    border-bottom: px2rem(1px) solid #E7E8E9;
+    padding-bottom: 20px;
+    margin: 30px 15px 0px;
+    border-bottom: 1px solid #E7E8E9;
     .basic-title {
-        font-size: px2rem(18px);
-        line-height: px2rem(18px);
+        font-size: 18px;
+        line-height: 18px;
         color: #373839;
         font-weight: 700;
     }
     .content {
         position: relative;
-        margin-top:  px2rem(16px);
+        margin-top:  16px;
         .text {
-            font-size: px2rem(14px);
-            line-height: px2rem(21px);
+            font-size: 14px;
+            line-height: 21px;
             color: #676869;
         }
         .desc {
             // position: absolute;
             // right: 0;
-            // bottom: px2rem(1px);
+            // bottom: 1px;
             text-align: right;
             background: #fff;
-            line-height: px2rem(14px);
+            line-height: 14px;
             z-index: 99;
             span {
-                font-size: px2rem(14px);
-                line-height: px2rem(14px);
+                font-size: 14px;
+                line-height: 14px;
                 color: #449284;
             }
             img {
-                width: px2rem(12px);
+                width: 12px;
             }
         }
     }

src/components/cme/item-leader.vue

@@ -53,58 +53,57 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .item-leader-container {
-  padding-bottom: px2rem(20px);
-  margin: px2rem(30px) px2rem(15px) 0px;
-  border-bottom: px2rem(1px) solid #e7e8e9;
+  padding-bottom: 20px;
+  margin: 30px 15px 0px;
+  border-bottom: 1px solid #e7e8e9;
   .basic-title {
-    font-size: px2rem(18px);
-    line-height: px2rem(18px);
+    font-size: 18px;
+    line-height: 18px;
     color: #373839;
     font-weight: 700;
   }
   .leader-info {
     display: flex;
     flex-direction: row;
-    margin-top: px2rem(16px);
+    margin-top: 16px;
     img {
       display: inline-block;
-      width: px2rem(44px);
-      height: px2rem(44px);
+      width: 44px;
+      height: 44px;
       border-radius: 50%;
     }
     .leader-text {
-      margin-left: px2rem(16px);
-      margin-top: px2rem(6px);
+      margin-left: 16px;
+      margin-top: 6px;
       .leader-con {
-        line-height: px2rem(14px);
+        line-height: 14px;
         display: flex;
         flex-direction: row;
         span {
-          font-size: px2rem(16px);
+          font-size: 16px;
           color: #676869;
         }
         span:first-child {
-          font-size: px2rem(16px);
+          font-size: 16px;
           color: #373839;
           font-weight: 700;
         }
         .leader-title {
-          width: px2rem(220px);
+          width: 220px;
           overflow : hidden;
           text-overflow: ellipsis;
           white-space:nowrap;
-          line-height: px2rem(16px);
-          margin-left: px2rem(10px);
+          line-height: 16px;
+          margin-left: 10px;
         }
       }
       .address {
-        margin-top: px2rem(5px);
-        font-size: px2rem(13px);
+        margin-top: 5px;
+        font-size: 13px;
         color: #979899;
-        width: px2rem(240px);
+        width: 240px;
         overflow : hidden;
         text-overflow: ellipsis;
         white-space:nowrap;
@@ -113,26 +112,26 @@ export default {
   }
   .content {
     position: relative;
-    margin-top: px2rem(16px);
+    margin-top: 16px;
     .text {
-      font-size: px2rem(14px);
-      line-height: px2rem(21px);
+      font-size: 14px;
+      line-height: 21px;
       color: #676869;
     }
     .desc {
       // position: absolute;
       // right: 0;
-      // bottom: px2rem(1px);
+      // bottom: 1px;
       text-align: right;
       background: #fff;
-      line-height: px2rem(14px);
+      line-height: 14px;
       z-index: 99;
       span {
-        font-size: px2rem(14px);
+        font-size: 14px;
         color: #449284;
       }
       img {
-        width: px2rem(12px);
+        width: 12px;
       }
     }
   }

src/components/cme/learn-know.vue

@@ -16,23 +16,22 @@ export default {
     }
 }
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .learn-know-container {
-    margin: px2rem(30px) px2rem(15px) px2rem(20px);
+    margin: 30px 15px 20px;
     .basic-title {
-        font-size: px2rem(18px);
-        line-height: px2rem(18px);
+        font-size: 18px;
+        line-height: 18px;
         color: #373839;
         font-weight: 700;
     }
     .content {
-        margin-top:  px2rem(16px);
-        line-height: px2rem(21px);
+        margin-top:  16px;
+        line-height: 21px;
         span {
             display: inline-block;
             text-align: justify;
-            font-size: px2rem(14px);
+            font-size: 14px;
             color: #676869;
         }
     }

src/components/cme/teacter-intro.vue

@@ -37,58 +37,57 @@ export default {
     }
 }
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .teacter-intro-container {
-    margin: px2rem(30px) px2rem(15px) 0px;
+    margin: 30px 15px 0px;
     .basic-title {
-        font-size: px2rem(18px);
-        line-height: px2rem(18px);
+        font-size: 18px;
+        line-height: 18px;
         color: #373839;
         font-weight: 700;
     }
     .leader-info {
         display: flex;
         flex-direction: row;
-        margin-top: px2rem(16px);
-        padding-bottom: px2rem(16px);
+        margin-top: 16px;
+        padding-bottom: 16px;
         img {
             display: inline-block;
-            width: px2rem(44px);
-            height: px2rem(44px);
+            width: 44px;
+            height: 44px;
             border-radius: 50%;
         }
         .leader-text {
-            margin-left: px2rem(16px);
-            margin-top: px2rem(6px);
+            margin-left: 16px;
+            margin-top: 6px;
             .leader-con {
-                line-height: px2rem(14px);
+                line-height: 14px;
                 display: flex;
                 flex-direction: row;
                 span {
-                    font-size: px2rem(16px);
+                    font-size: 16px;
                     color: #676869;
                 }
                 span:first-child {
-                    font-size: px2rem(16px);
+                    font-size: 16px;
                     color: #373839;
                     font-weight: 700;
                     line-height: 1.1;
                 }
                 .leader-title {
-                    width: px2rem(220px);
+                    width: 220px;
                     overflow : hidden;
                     text-overflow: ellipsis;
                     white-space:nowrap;
-                    line-height: px2rem(16px);
-                    margin-left: px2rem(10px);
+                    line-height: 16px;
+                    margin-left: 10px;
                 }
             }
             .address {
-                margin-top: px2rem(5px);
-                font-size: px2rem(13px);
+                margin-top: 5px;
+                font-size: 13px;
                 color: #979899;
-                width: px2rem(240px);
+                width: 240px;
                 overflow : hidden;
                 text-overflow: ellipsis;
                 white-space:nowrap;

src/components/common/common-advert-img.vue

@@ -68,16 +68,15 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .common-adert-wrapper {
   img {
     width: 100%;
-    // padding: px2rem(10px) 0;
-    // height: px2rem(60px);
+    // padding: 10px 0;
+    // height: 60px;
   }
   .margin-top-20 {
-    margin-top: px2rem(20px);
+    margin-top: 20px;
   }
 }
 </style>

src/components/common/common-banner-img.vue

@@ -65,10 +65,9 @@ export default {
   methods: {}
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-title {
   display: flex;
-  padding-left: px2rem(15px);
+  padding-left: 15px;
 }
 </style>

src/components/common/common-banner-video.vue

@@ -84,10 +84,9 @@ export default {
   methods: {}
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-title {
   display: flex;
-  padding-left: px2rem(15px);
+  padding-left: 15px;
 }
 </style>

src/components/common/common-description.vue

@@ -51,18 +51,17 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .desc-container {
-  padding: px2rem(20px) px2rem(15px);
+  padding: 20px 15px;
   .desc-title {
     display: flex;
     padding-bottom: 0px;
-    line-height: px2rem(22px);
+    line-height: 22px;
     font-weight: 700;
     span {
       font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
-      font-size: px2rem(18px);
+      font-size: 18px;
       font-weight: 700;
       color: #333333;
     }
@@ -71,13 +70,13 @@ export default {
     display: flex;
     position: relative;
     word-break: normal;
-    // margin-bottom: px2rem(40px);
-    // height: px2rem(60px);
+    // margin-bottom: 40px;
+    // height: 60px;
     .desc_text {
-      padding-top: px2rem(6px);
-      font-size: px2rem(13px);
+      padding-top: 6px;
+      font-size: 13px;
       color: #676869;
-      line-height: px2rem(25px);
+      line-height: 25px;
       letter-spacing: 1px;
       word-wrap: break-word;
       word-break: break-all;

src/components/common/common-loading.vue

@@ -17,8 +17,7 @@
 
 </template>
 
-<style lang="scss" scoped>
-    @import '../../style/mixin';
+<style lang="less" scoped>
     .loader {
         &-mask {
             position: fixed;
@@ -31,8 +30,8 @@
         }
         svg {
             position: fixed;
-            top: px2rem(280px);
-            left: px2rem(166px);
+            top: 280px;
+            left: 166px;
             z-index: 9999;
         }
     }

src/components/common/common-navbar-old.vue

@@ -124,23 +124,22 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .back {
   position: absolute;
-  left: px2rem(8px);
-  top: px2rem(15px);
+  left: 8px;
+  top: 15px;
   display: inline-block;
-  width: px2rem(50px);
-  height: px2rem(50px);
+  width: 50px;
+  height: 50px;
   img {
-    padding: px2rem(10px);
-    width: px2rem(25px);
-    height: px2rem(25px);
+    padding: 10px;
+    width: 25px;
+    height: 25px;
   }
 }
 .nav-top {
-  // height: px2rem(65px);
+  // height: 65px;
   background: #fff;
   color: #333;
   position: relative;
@@ -148,10 +147,10 @@ export default {
   .nav-back {
     display: inline-block;
     position: absolute;
-    left: px2rem(16px);
+    left: 16px;
     top: 0;
-    height: px2rem(25px);
-    width: px2rem(25px);
+    height: 25px;
+    width: 25px;
     // -ms-transform: translate(180deg);
     // -webkit-transform: (180deg);
     // transform: rotate(180deg);
@@ -172,33 +171,33 @@ export default {
   }
   .nav-share {
     position: absolute;
-    right: px2rem(16px);
+    right: 16px;
     top: 0;
-    height: px2rem(25px);
-    width: px2rem(25px);
+    height: 25px;
+    width: 25px;
   }
   .nav-title {
     position: relative;
-    top: px2rem(10px);
+    top: 10px;
     left: 0;
     display: inline-block;
     width: 100%;
-    /* padding:0 px2rem(33px);*/
-    height: px2rem(36px);
+    /* padding:0 33px;*/
+    height: 36px;
     &-title {
-      height: px2rem(18px);
-      font-size: px2rem(18px);
+      height: 18px;
+      font-size: 18px;
       font-weight: 500;
       color: rgba(51, 51, 51, 1);
-      line-height: px2rem(26px);
+      line-height: 26px;
     }
   }
   .nav-part {
     width: 100%;
-    font-size: px2rem(18px);
+    font-size: 18px;
     text-align: center;
-    padding: 0 0 px2rem(10px) 0;
-    /* height: px2rem(25px);*/
+    padding: 0 0 10px 0;
+    /* height: 25px;*/
   }
 }
 
@@ -207,6 +206,6 @@ export default {
   top: 0;
   left: 0;
   border-bottom: 1px solid #e7e7e7;
-  /* height: px2rem(25px);*/
+  /* height: 25px;*/
 }
 </style>
\ No newline at end of file

src/components/common/common-navbar.vue

@@ -122,23 +122,22 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .back {
   position: absolute;
-  left: px2rem(px);
-  top: px2rem(15px);
+  left: px;
+  top: 15px;
   display: inline-block;
-  width: px2rem(50px);
-  height: px2rem(50px);
+  width: 50px;
+  height: 50px;
   img {
-    padding: px2rem(10px);
-    width: px2rem(25px);
-    height: px2rem(25px);
+    padding: 10px;
+    width: 25px;
+    height: 25px;
   }
 }
 .nav-top {
-  // height: px2rem(65px);
+  // height: 65px;
   background: #fff;
   color: #333;
   position: relative;
@@ -146,12 +145,12 @@ export default {
   .nav-back {
     display: inline-block;
     position: absolute;
-    left: px2rem(0px);
+    left: 0px;
     top: 0;
-    height: px2rem(25px);
-    width: px2rem(55px);
-    padding-left: px2rem(15px);
-    padding-right: px2rem(15px);
+    height: 25px;
+    width: 55px;
+    padding-left: 15px;
+    padding-right: 15px;
     // -ms-transform: translate(180deg);
     // -webkit-transform: (180deg);
     // transform: rotate(180deg);
@@ -172,33 +171,33 @@ export default {
   }
   .nav-share {
     position: absolute;
-    right: px2rem(16px);
+    right: 16px;
     top: 0;
-    height: px2rem(25px);
-    width: px2rem(25px);
+    height: 25px;
+    width: 25px;
   }
   .nav-title {
     position: relative;
-    top: px2rem(10px);
+    top: 10px;
     left: 0;
     display: inline-block;
     width: 100%;
-    /* padding:0 px2rem(33px);*/
-    height: px2rem(36px);
+    /* padding:0 33px;*/
+    height: 36px;
     &-title {
-      height: px2rem(18px);
-      font-size: px2rem(18px);
+      height: 18px;
+      font-size: 18px;
       font-weight: 700;
       color: rgba(51, 51, 51, 1);
-      line-height: px2rem(26px);
+      line-height: 26px;
     }
   }
   .nav-part {
     width: 100%;
-    font-size: px2rem(18px);
+    font-size: 18px;
     text-align: center;
-    padding: 0 0 px2rem(10px) 0;
-    /* height: px2rem(25px);*/
+    padding: 0 0 10px 0;
+    /* height: 25px;*/
   }
 }
 
@@ -207,6 +206,6 @@ export default {
   top: 0;
   left: 0;
   border-bottom: 1px solid #e7e7e7;
-  /* height: px2rem(25px);*/
+  /* height: 25px;*/
 }
 </style>
\ No newline at end of file

src/components/common/common-splite-line.vue

@@ -23,8 +23,7 @@ export default {
   methods: {}
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .split-line {
   display: flex;
 }

src/components/common/common-tcplayer.vue

@@ -135,11 +135,10 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .banner-img {
   // display: inherit;
-  width: px2rem(375px);
-  height: px2rem(210px);
+  width: 375px;
+  height: 210px;
 }
 </style>
\ No newline at end of file

src/components/common/common-title.vue

@@ -109,10 +109,9 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-title-container {
-  padding-left: px2rem(15px);
+  padding-left: 15px;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
@@ -127,39 +126,39 @@ export default {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-right: px2rem(15px);
+    margin-right: 15px;
     span {
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 400;
       color: rgba(40, 52, 76, 0.4);
     }
     img {
-      width: px2rem(15px);
-      height: px2rem(16px);
+      width: 15px;
+      height: 16px;
     }
   }
   &-explain {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-right: px2rem(15px);
+    margin-right: 15px;
     span {
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 400;
       color: rgba(40, 52, 76, 0.4);
-      margin-right: px2rem(3px);
-      line-height: px2rem(14px);
+      margin-right: 3px;
+      line-height: 14px;
     }
     img {
-      width: px2rem(8px);
-      height: px2rem(14px);
+      width: 8px;
+      height: 14px;
     }
   }
 }
 
 .banner-img {
-  width: px2rem(70px);
-  height: px2rem(20px);
-  padding-top: px2rem(2px);
+  width: 70px;
+  height: 20px;
+  padding-top: 2px;
 }
 </style>

src/components/common/common-toast.vue

@@ -26,8 +26,7 @@ export default {
   },
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .loader {
   &-mask {
     position: fixed;
@@ -43,10 +42,10 @@ export default {
     width: 100%;
     left: 0;
     z-index: 301;
-    bottom: px2rem(30px);     
+    bottom: 30px;     
     text-align: center;
     span {
-        padding: px2rem(2px) px2rem(10px);
+        padding: 2px 10px;
         background: #eee;
     }
   }

src/components/common/cooperation-tab.vue

@@ -67,10 +67,9 @@ export default {
   methods: {}
 };
 </script>
-<style lang="scss" scoped>
-@import "../../style/mixin";
+<style lang="less" scoped>
 .comp-title {
   display: flex;
-  padding-left: px2rem(15px);
+  padding-left: 15px;
 }
 </style>

src/main.js

@@ -26,18 +26,11 @@ if(!(process.env.BUILD_ENV === 'uat' || process.env.BUILD_ENV === 'pro')) {
 // Vue.config.devtools = true;
 
 
-
 // 注册所有公用过滤器
 for(let key in vueFilters) {
 	Vue.filter(key, vueFilters[key])
 }
 
-// if ('addEventListener' in document) {
-//     document.addEventListener('DOMContentLoaded', function() {
-//         FastClick.attach(document.body);
-//     }, false);
-// }
-// Vue.use(DiscussTopicStencil)
 Vue.use(VueRouter)
 const router = new VueRouter({
 	routes,
@@ -55,6 +48,18 @@ const router = new VueRouter({
 	}
 })
 
+router.beforeEach((to, from, next) => {
+  let query = { ...to.query };
+  // 登录token保存并替换路径
+  if (query.token && query.token != 'undefined') {
+    store.dispatch('setToken', query.token);
+    delete query.token;
+    next({ path: to.path, query: query, replace: true });
+    return;
+  }
+  next();
+})
+
 // 加入混合
 Vue.mixin({
 	...mixins

src/store/getters.js

@@ -6,5 +6,6 @@ const getters = {
   jumpURLForII: state => state.coop.jumpURLForII,
   positionInfo: state => state.coop.positionInfo,
   organizationInfo: state => state.coop.organizationInfo,
+  logged: state => !!(state.user.token && state.user.info.id),
 }
 export default getters

src/store/index.js

 import Vue from 'vue'
 import Vuex from 'vuex'
 import coop from './modules/coop'
+import user from './modules/user'
 import getters from './getters'  
 
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
   modules: {
-    coop
+    coop,
+    user
   },
   getters
 })

src/views/I-credit-detail.vue

@@ -218,8 +218,7 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 .cd-wrapper {
   background: #f8f9fa;
   padding-bottom: 80px;

src/views/cell-list-page.vue

@@ -59,12 +59,11 @@ export default {
   methods: {}
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 .banner-img {
   display: inherit;
-  width: px2rem(375px);
-  height: px2rem(243px);
+  width: 375px;
+  height: 243px;
 }
 </style>
 

src/views/component-details.vue

@@ -237,41 +237,40 @@ export default {
   }
 };
 </script>
-<style lang="scss" >
-@import "../style/mixin";
+<style lang="less" >
 .page-container-comp {
 .nav-top .nav-title {
-  height: px2rem(0px);
-  padding: px2rem(18px);
+  height: 0px;
+  padding: 18px;
 }
 .banner-img {
   display: inherit;
-  width: px2rem(375px);
-  height: px2rem(210px);
+  width: 375px;
+  height: 210px;
   &-1 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-5 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-10 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(148px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 148px;
+    height: 30px;
   }
 }
 .list-container {
-  margin-bottom: px2rem(40px);
+  margin-bottom: 40px;
 }
 }
 </style>

src/views/cooperation-details.vue

@@ -265,36 +265,35 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 .banner-img {
   display: inherit;
-  width: px2rem(375px);
-  height: px2rem(210px);
+  width: 375px;
+  height: 210px;
   &-1 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-5 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-10 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(148px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 148px;
+    height: 30px;
   }
 }
 .list-container {
-  margin-bottom: px2rem(40px);
+  margin-bottom: 40px;
 }
 </style>
 

src/views/credit-detail.vue

@@ -301,47 +301,45 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-@import "../style/mixin";
-
+<style lang="less" scoped>
 .credit-detail {
   &-wrapper {
     .tips {
       position: relative;
       top: 0;
       left: 0;
-      margin: px2rem(10px) 0 px2rem(10px);
-      border-radius: px2rem(4px);
-      padding: px2rem(10px);
+      margin: 10px 0 10px;
+      border-radius: 4px;
+      padding: 10px;
       font-weight: 400;
-      font-size: px2rem(12px);
-      // height: px2rem(32px);
-      line-height: px2rem(12px);
+      font-size: 12px;
+      // height: 32px;
+      line-height: 12px;
       color: #979899;
       background: #f8f9fa;
 
       .triangle {
         position: absolute;
-        top: px2rem(-5px);
+        top: -5px;
         transform: rotateZ(45deg);
-        right: px2rem(10px);
-        width: px2rem(10px);
-        height: px2rem(10px);
+        right: 10px;
+        width: 10px;
+        height: 10px;
         background: #f8f9fa;
       }
     }
 
     .info {
-      font-size: px2rem(14px);
+      font-size: 14px;
       font-weight: 400;
-      margin-bottom: px2rem(50px);
+      margin-bottom: 50px;
 
       .credit-basic {
-        margin: px2rem(20px) px2rem(15px);
+        margin: 20px 15px;
       }
 
       .credit-user {
-        margin: px2rem(20px) px2rem(15px);
+        margin: 20px 15px;
       }
 
       ul {
@@ -349,8 +347,8 @@ export default {
           display: flex;
           flex-direction: row;
           justify-content: space-between;
-          height: px2rem(30px);
-          line-height: px2rem(30px);
+          height: 30px;
+          line-height: 30px;
 
           span {
             &:nth-child(1) {

src/views/credit-edit.vue

@@ -159,39 +159,38 @@ export default {
 
 };
 </script>
-<style lang="scss">
-@import "../style/mixin";
+<style lang="less">
 .credit-edit-wrapper {
   .group {
     margin: 10px 15px;      
   }
   .tips {
-    margin: px2rem(10px) px2rem(15px) px2rem(50px);
+    margin: 10px 15px 50px;
     font-weight: 400;
-    font-size: px2rem(14px);
-    line-height: px2rem(21px);
+    font-size: 14px;
+    line-height: 21px;
     color: #979899;
   }
   .van-cell__title .van-field__label {
-    line-height: px2rem(30px) !important;
-    height: px2rem(20px) !important;
+    line-height: 30px !important;
+    height: 20px !important;
   }
   .van-cell {
-    padding: px2rem(20px) 0 !important;
-    font-size: px2rem(15px) !important;
+    padding: 20px 0 !important;
+    font-size: 15px !important;
     color: #373839 !important;
   }
   .van-cell__title span {
     font-weight: 400 !important;
   }
   .van-field__body {
-    line-height: px2rem(30px) !important;
-    height: px2rem(20px) !important;
+    line-height: 30px !important;
+    height: 20px !important;
   }
   .van-field__control {
-    padding-top: px2rem(8px) !important;
-    line-height: px2rem(20px) !important;
-    font-size: px2rem(15px);
+    padding-top: 8px !important;
+    line-height: 20px !important;
+    font-size: 15px;
   }
 }
 

src/views/exchange-tips.vue

@@ -20,36 +20,35 @@
     </div>
   </div>
 </template>
-<style lang="scss" scoped>
-  @import "../style/mixin";
+<style lang="less" scoped>
   .header {
     width: 100%;
     position: fixed;
     top: 0;
     left: 0;
     text-align: center;
-    padding: px2rem(26px) 0 px2rem(20px);
-    font-size: px2rem(18px);
-    line-height: px2rem(18px);
+    padding: 26px 0 20px;
+    font-size: 18px;
+    line-height: 18px;
     color: #333333;
     background: #fff;
     // img {
     //   position: absolute;
-    //   right: px2rem(20px);
-    //   width: px2rem(13px);
-    //   height: px2rem(13px);
+    //   right: 20px;
+    //   width: 13px;
+    //   height: 13px;
     // }
   }
   .exchange-tips-wrapper {
-    padding-top: px2rem(40px);
-    margin: px2rem(20px);
-    font-size: px2rem(16px);
+    padding-top: 40px;
+    margin: 20px;
+    font-size: 16px;
     .content {
       .title {
-        line-height: px2rem(18px);
+        line-height: 18px;
         font-weight: 700;
         color: #373839;
-        margin: px2rem(12px) 0;
+        margin: 12px 0;
       }
       .text {
         color: #676869;

src/views/index.vue

@@ -247,9 +247,7 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
-
+<style lang="less" scoped>
 .page-content {
   &-table {
     position: fixed;
@@ -259,12 +257,12 @@ export default {
     border-bottom: 1px solid #e7e7e7;
     background: #fff;
     tr {
-      font-size: px2rem(15px);
+      font-size: 15px;
       font-weight: 700;
-      height: px2rem(44px);
+      height: 44px;
       td {
         width: 50%;
-        padding-top: px2rem(6px);
+        padding-top: 6px;
         .tap-title {
           display: flex;
           flex-direction: column;
@@ -273,12 +271,12 @@ export default {
           span:nth-child(2) {
             position: relative;
             left: 0;
-            bottom: px2rem(-8px);
+            bottom: -8px;
             z-index: 2;
-            width: px2rem(10px);
-            height: px2rem(3px);
+            width: 10px;
+            height: 3px;
             background: rgba(255, 255, 255, 1);
-            border-radius: px2rem(3px);
+            border-radius: 3px;
           }
         }
         &.active {
@@ -286,10 +284,10 @@ export default {
             background: rgba(68, 146, 132, 1);
           }
           span.android:nth-child(2) {
-            bottom: px2rem(-12px);
+            bottom: -12px;
           }
           span.ios:nth-child(2) {
-            bottom: px2rem(-10px);
+            bottom: -10px;
           }
         }
       }
@@ -298,29 +296,29 @@ export default {
   .cb-wrapper {
     width: 100%;
     position: fixed;
-    top: px2rem(49px);
+    top: 49px;
     left: 0;
     z-index: 90;
     // margin-bottom: 30px;
     &.padding-top-111 {
-      top: px2rem(111px);
+      top: 111px;
     }
   }
   &-list {
-    padding-top: px2rem(50px);
+    padding-top: 50px;
     .mt-10 {
-      margin-bottom: px2rem(-10px);
+      margin-bottom: -10px;
     }
   }
 }
 .back-up-icon {
   position: fixed;
   z-index: 110;
-  bottom: px2rem(50px);
-  right: px2rem(15px);
+  bottom: 50px;
+  right: 15px;
   img {
-    width: px2rem(35px);
-    height: px2rem(35px);
+    width: 35px;
+    height: 35px;
   }
 }
 .fade-enter-active,

src/views/merge-detail.vue

@@ -1256,53 +1256,52 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 .page-container-merge {
   .nav-top .nav-title {
-    height: px2rem(0px);
-    // padding: px2rem(18px);
+    height: 0px;
+    // padding: 18px;
   }
   .banner-img {
     display: inherit;
-    width: px2rem(375px);
-    height: px2rem(210px);
+    width: 375px;
+    height: 210px;
     &-1 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
     &-5 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
     &-10 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
   }
   .list-container {
-    // margin-bottom: px2rem(40px);
+    // margin-bottom: 40px;
     .sk-btn-cover {
       position: absolute;
-      top: px2rem(82px);
-      left: px2rem(163px);
+      top: 82px;
+      left: 163px;
       z-index: 100;
-      width: px2rem(50px);
-      height: px2rem(50px);
-      line-height: px2rem(50px);
+      width: 50px;
+      height: 50px;
+      line-height: 50px;
       text-align: center;
       background: #fff;
       color: rgba(68, 146, 132, 1);
-      font-size: px2rem(13px);
+      font-size: 13px;
       border-radius: 50%;
     }
     .sk-btn-cover-new {
@@ -1310,42 +1309,42 @@ export default {
       top: 0;
       left: 0;
       right: 0;
-      height: px2rem(210px);
+      height: 210px;
       z-index: 100;
       text-align: center;
       // background: #fff;
-      font-size: px2rem(13px);
+      font-size: 13px;
       // border-radius: 50%;
       background: rgba(51, 51, 51, 0.8);
       span {
         display: inline-block;
-        margin-top: px2rem(82px);
-        width: px2rem(100px);
-        height: px2rem(36px);
-        line-height: px2rem(36px);
-        font-size: px2rem(15px);
+        margin-top: 82px;
+        width: 100px;
+        height: 36px;
+        line-height: 36px;
+        font-size: 15px;
         font-weight: 700;
-        border-radius: px2rem(20px);
+        border-radius: 20px;
         color: #fff;
         background: #449284;        
         &.android {
-          padding-top: px2rem(2px);
+          padding-top: 2px;
         }      }
       // opacity: ;
     }
   }
   .intro-catalogue-container {
     .title {
-      height: px2rem(50px);
-      line-height: px2rem(30px);
-      padding: 0 px2rem(15px);
+      height: 50px;
+      line-height: 30px;
+      padding: 0 15px;
       border-bottom: 1px solid #f0f1f2;
       span {
         display: inline-block;
-        line-height: px2rem(15px);
-        font-size: px2rem(15px);
+        line-height: 15px;
+        font-size: 15px;
         color: #979899;
-        padding-right: px2rem(35px);
+        padding-right: 35px;
       }
       span.focus {
         position: relative;
@@ -1354,19 +1353,19 @@ export default {
       span.focus:after {
         content: "";
         position: absolute;
-        left: px2rem(9px);
-        bottom: px2rem(-14px);
+        left: 9px;
+        bottom: -14px;
         background: #449284;
-        // border-bottom: px2rem(1px) solid #449284;
-        width: px2rem(10px);
-        height: px2rem(3px);
-        border-radius: px2rem(3px);
+        // border-bottom: 1px solid #449284;
+        width: 10px;
+        height: 3px;
+        border-radius: 3px;
       }
     }
     .title.fixed-title-1 {
       position: fixed;
       left: 0;
-      top: px2rem(60px);
+      top: 60px;
       background: #fff;
       width: 100%;
       z-index: 999;
@@ -1374,28 +1373,28 @@ export default {
     .title.fixed-title-2 {
       position: fixed;
       left: 0;
-      top: px2rem(0px);
+      top: 0px;
       background: #fff;
       width: 100%;
       z-index: 999;
     }
     .catalogue-content {
-      padding: px2rem(30px) px2rem(15px) 0;
+      padding: 30px 15px 0;
       .catalogue-title {
-        font-size: px2rem(18px);
+        font-size: 18px;
         color: #373839;
         font-weight: 700;
-        margin-bottom: px2rem(16px);
+        margin-bottom: 16px;
       }
     }
     .fixed-flag-height {
-      height: px2rem(50px);
+      height: 50px;
     }
   }
 }
 .no-more-bottom {
   position: relative;
   width: 100%;
-  height: px2rem(40px);
+  height: 40px;
 }
 </style>

src/views/parent-page.vue

@@ -197,49 +197,46 @@ export default {
   }
 };
 </script>
-<style lang="scss" >
-@import "../style/mixin";
+<style lang="less" >
 .page-container-parent {
 .nav-top .nav-title {
-  height: px2rem(0px);
-  padding: px2rem(18px);
+  height: 0px;
+  padding: 18px;
 }
 .banner-img {
   display: inherit;
-  width: px2rem(375px);
-  height: px2rem(210px);
+  width: 375px;
+  height: 210px;
   &-1 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-5 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(76px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 76px;
+    height: 30px;
   }
   &-10 {
     position: absolute;
     left: 0;
-    top: px2rem(180px);
-    width: px2rem(148px);
-    height: px2rem(30px);
+    top: 180px;
+    width: 148px;
+    height: 30px;
   }
 }
-.list-container {
-  // margin-bottom: px2rem(40px);
-}
+
 .project-num {
   position: relative;
-  height: px2rem(18px);
-  margin: px2rem(20px) 0 px2rem(15px) px2rem(15px);
+  height: 18px;
+  margin: 20px 0 15px 15px;
   font-weight: 500;
-  font-size: px2rem(18px);
-  line-height: px2rem(18px);
+  font-size: 18px;
+  line-height: 18px;
 }
 }
 </style>
\ No newline at end of file

src/views/share-merge-detail.vue

@@ -959,53 +959,52 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 .page-container-merge {
   .nav-top .nav-title {
-    height: px2rem(0px);
-    // padding: px2rem(18px);
+    height: 0px;
+    // padding: 18px;
   }
   .banner-img {
     display: inherit;
-    width: px2rem(375px);
-    height: px2rem(210px);
+    width: 375px;
+    height: 210px;
     &-1 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
     &-5 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
     &-10 {
       position: absolute;
       left: 0;
-      top: px2rem(180px);
-      width: px2rem(76px);
-      height: px2rem(30px);
+      top: 180px;
+      width: 76px;
+      height: 30px;
     }
   }
   .list-container {
-    // margin-bottom: px2rem(40px);
+    // margin-bottom: 40px;
     .sk-btn-cover {
       position: absolute;
-      top: px2rem(82px);
-      left: px2rem(163px);
+      top: 82px;
+      left: 163px;
       z-index: 100;
-      width: px2rem(50px);
-      height: px2rem(50px);
-      line-height: px2rem(50px);
+      width: 50px;
+      height: 50px;
+      line-height: 50px;
       text-align: center;
       background: #fff;
       color: rgba(68, 146, 132, 1);
-      font-size: px2rem(13px);
+      font-size: 13px;
       border-radius: 50%;
     }
     .sk-btn-cover-new {
@@ -1013,42 +1012,42 @@ export default {
       top: 0;
       left: 0;
       right: 0;
-      height: px2rem(210px);
+      height: 210px;
       z-index: 100;
       text-align: center;
       // background: #fff;
-      font-size: px2rem(13px);
+      font-size: 13px;
       // border-radius: 50%;
       background: rgba(51, 51, 51, 0.8);
       span {
         display: inline-block;
-        margin-top: px2rem(82px);
-        width: px2rem(100px);
-        height: px2rem(36px);
-        line-height: px2rem(36px);
-        font-size: px2rem(15px);
+        margin-top: 82px;
+        width: 100px;
+        height: 36px;
+        line-height: 36px;
+        font-size: 15px;
         font-weight: 700;
-        border-radius: px2rem(20px);
+        border-radius: 20px;
         color: #fff;
         background: #449284;        
         &.android {
-          padding-top: px2rem(2px);
+          padding-top: 2px;
         }      }
       // opacity: ;
     }
   }
   .intro-catalogue-container {
     .title {
-      height: px2rem(50px);
-      line-height: px2rem(30px);
-      padding: 0 px2rem(15px);
+      height: 50px;
+      line-height: 30px;
+      padding: 0 15px;
       border-bottom: 1px solid #f0f1f2;
       span {
         display: inline-block;
-        line-height: px2rem(15px);
-        font-size: px2rem(15px);
+        line-height: 15px;
+        font-size: 15px;
         color: #979899;
-        padding-right: px2rem(35px);
+        padding-right: 35px;
       }
       span.focus {
         position: relative;
@@ -1057,19 +1056,19 @@ export default {
       span.focus:after {
         content: "";
         position: absolute;
-        left: px2rem(9px);
-        bottom: px2rem(-14px);
+        left: 9px;
+        bottom: -14px;
         background: #449284;
-        // border-bottom: px2rem(1px) solid #449284;
-        width: px2rem(10px);
-        height: px2rem(3px);
-        border-radius: px2rem(3px);
+        // border-bottom: 1px solid #449284;
+        width: 10px;
+        height: 3px;
+        border-radius: 3px;
       }
     }
     .title.fixed-title-1 {
       position: fixed;
       left: 0;
-      top: px2rem(60px);
+      top: 60px;
       background: #fff;
       width: 100%;
       z-index: 999;
@@ -1077,28 +1076,28 @@ export default {
     .title.fixed-title-2 {
       position: fixed;
       left: 0;
-      top: px2rem(0px);
+      top: 0px;
       background: #fff;
       width: 100%;
       z-index: 999;
     }
     .catalogue-content {
-      padding: px2rem(30px) px2rem(15px) 0;
+      padding: 30px 15px 0;
       .catalogue-title {
-        font-size: px2rem(18px);
+        font-size: 18px;
         color: #373839;
         font-weight: 700;
-        margin-bottom: px2rem(16px);
+        margin-bottom: 16px;
       }
     }
     .fixed-flag-height {
-      height: px2rem(50px);
+      height: 50px;
     }
   }
 }
 .no-more-bottom {
   position: relative;
   width: 100%;
-  height: px2rem(40px);
+  height: 40px;
 }
 </style>

src/views/test-components.vue

@@ -38,7 +38,6 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-@import "../style/mixin";
+<style lang="less" scoped>
 </style>