页面修改

src/views/login.vue

@@ -10,9 +10,8 @@
               </div>
               <div class="publisher">徐总</div>
               <div class="job">总经理</div>
-              <div
-                class="content"
-              >職場上成功者與失敗者最大的分別就是，前者找機會，後者找藉口，今日的你痛恨每天上班「度日如年」，將來的你會感激經歷過這一切，你練成了更強大的自己，玻璃心不再怕碎。</div>
+              <div class="content">職場上成功者與失敗者最大的分別就是，前者找機會，後者找藉口，今日的你痛恨每天上班「度日如年」，將來的你會感激經歷過這一切，你練成了更強大的自己，玻璃心不再怕碎。
+              </div>
             </div>
           </el-carousel-item>
         </el-carousel>
@@ -28,13 +27,8 @@
                   <div class="mu-text-field has-label">
                     <div class="mu-text-field-content">
                       <div class="mu-text-field-label">账号</div>
-                      <input
-                        type="text"
-                        v-model="account"
-                        class="mu-text-field-input"
-                        @focus="accountStatus=true"
-                        @blur="accountStatus=false"
-                      />
+                      <input type="text" v-model="account" class="mu-text-field-input" @focus="accountStatus=true"
+                        @blur="accountStatus=false" />
                       <div>
                         <hr class="mu-text-field-line" />
                         <hr class="mu-text-field-focus-line" :class="{'focus':accountStatus}" />
@@ -48,13 +42,8 @@
                   <div class="mu-text-field has-label">
                     <div class="mu-text-field-content">
                       <div class="mu-text-field-label">密码</div>
-                      <input
-                        type="password"
-                        v-model="pwd"
-                        class="mu-text-field-input"
-                        @focus="pwdStatus=true"
-                        @blur="pwdStatus=false"
-                      />
+                      <input type="password" v-model="pwd" class="mu-text-field-input" @focus="pwdStatus=true"
+                        @blur="pwdStatus=false" />
                       <div>
                         <hr class="mu-text-field-line" />
                         <hr class="mu-text-field-focus-line" :class="{'focus':pwdStatus}" />
@@ -64,12 +53,8 @@
                 </div>
               </div>
               <div class="field_wrap" style="margin-top:30px;">
-                <el-button
-                  type="primary"
-                  :loading="isLogining"
-                  @click="goLogin()"
-                  style="width:100%; font-family:perfectFont;font-size: 16px;"
-                >立即登录</el-button>
+                <el-button type="primary" :loading="isLogining" @click="goLogin()"
+                  style="width:100%; font-family:perfectFont;font-size: 16px;">立即登录</el-button>
               </div>
               <div class="field_wrap forget">
                 <div class="item-forget">
@@ -96,7 +81,7 @@
 </template>
 
 <script>
-export default {
+  export default {
     data() {
       return {
         accountStatus: false,
@@ -108,9 +93,9 @@ export default {
       };
     },
     created() {
-    let autoLogin = localStorage.autoLogin
-      ? JSON.parse(localStorage.autoLogin)
-      : null;
+      let autoLogin = localStorage.autoLogin ?
+        JSON.parse(localStorage.autoLogin) :
+        null;
       this.account = autoLogin ? autoLogin.acc : "";
       this.pwd = autoLogin ? autoLogin.pwd : "";
       this.isAutoLogin = autoLogin ? true : false;
@@ -132,25 +117,29 @@ export default {
         var msg = {
           EmAccount: this.account,
           EmPassword: this.pwd,
-        // Domain:'testerp.oytour.com'
           Domain: "fcrmyx.oytour.com",
         };
+        if (!this.isOnline()) {
+          msg.Domain = "www.test.com";
+        }
         this.apipost("/api/Login/UserLogin", msg, (res) => {
           var jsonData = res.data;
           if (jsonData.resultCode == 1) {
             //登录成功
-          let autoLogin = this.isAutoLogin
-            ? {
+            let autoLogin = this.isAutoLogin ?
+              {
                 acc: this.account,
                 pwd: this.pwd,
-              }
-            : null;
+              } :
+              null;
             localStorage.autoLogin = JSON.stringify(autoLogin);
             var userData = jsonData.data;
             var userJson = JSON.stringify(userData);
             localStorage.userInfo = userJson;
             this.loginState = 0;
-          this.$router.push({ path: "/Home" });
+            this.$router.push({
+              path: "/Home"
+            });
           } else {
             this.$message({
               message: res.data.message,
@@ -161,11 +150,11 @@ export default {
         });
       },
     },
-};
+  };
 </script>
 
 <style scoped>
-.login {
+  .login {
     background: url("../assets/img/login/bg.jpg") no-repeat 100% 100%;
     width: 100%;
     height: 100%;
@@ -173,8 +162,9 @@ export default {
     display: flex;
     align-items: center;
     justify-content: center;
-}
-.logo-box {
+  }
+
+  .logo-box {
     position: absolute;
     top: 30px;
     left: 30px;
@@ -182,8 +172,9 @@ export default {
     font-size: 48px;
     font-family: perfectFont;
     color: #fff;
-}
-.login .login-box {
+  }
+
+  .login .login-box {
     width: 1000px;
     height: 560px;
     box-shadow: 0 6px 20px 5px rgba(40, 120, 255, 0.1),
@@ -191,12 +182,14 @@ export default {
     border-radius: 8px;
     background: #fff;
     display: flex;
-}
-.login .login-box .left-card {
+  }
+
+  .login .login-box .left-card {
     width: 440px;
     height: 100%;
-}
-.login .login-box .left-card .item-card {
+  }
+
+  .login .login-box .left-card .item-card {
     background: url("../assets/img/login/yinhao.png") right bottom/221px no-repeat,
       linear-gradient(180deg, #2878ff, #409efe);
     width: 100%;
@@ -204,89 +197,101 @@ export default {
     padding-top: 96px;
     color: white;
     box-sizing: border-box;
-}
-.login .login-box .left-card .item-card .head-icon {
+  }
+
+  .login .login-box .left-card .item-card .head-icon {
     width: 104px;
     height: 104px;
     margin: 0 auto;
     border-radius: 100%;
     background: rgba(40, 120, 255, 0.5);
     padding: 5px;
-}
-.login .login-box .left-card .item-card .head-icon img {
+  }
+
+  .login .login-box .left-card .item-card .head-icon img {
     width: 100%;
     height: 100%;
     border-radius: 100%;
-}
-.login .login-box .left-card .item-card .publisher,
-.login .login-box .left-card .item-card .job {
+  }
+
+  .login .login-box .left-card .item-card .publisher,
+  .login .login-box .left-card .item-card .job {
     margin-top: 20px;
     font-size: 24px;
     font-family: perfectFont;
     text-align: center;
-}
-.login .login-box .left-card .item-card .publisher {
+  }
+
+  .login .login-box .left-card .item-card .publisher {
     font-weight: bold;
-}
-.login .login-box .left-card .item-card .job {
+  }
+
+  .login .login-box .left-card .item-card .job {
     font-size: 16px;
     margin-top: 10px;
-}
-.login .login-box .left-card .item-card .content {
+  }
+
+  .login .login-box .left-card .item-card .content {
     font-size: 13px;
     font-family: perfectFont;
     margin-top: 20px;
     margin: 20px;
     line-height: 24px;
     text-indent: 28px;
-}
-.login .login-box .right-card {
+  }
+
+  .login .login-box .right-card {
     flex: 1;
     padding-top: 50px;
     font-family: perfectFont;
-}
-.login .login-box .right-card .company {
+  }
+
+  .login .login-box .right-card .company {
     font-size: 20px;
     text-align: center;
     font-weight: bold;
-}
-.login .login-box .right-card .t {
+  }
+
+  .login .login-box .right-card .t {
     margin-top: 20px;
     font-size: 34px;
     text-align: center;
     font-weight: bold;
     margin-bottom: 30px;
-}
-.field_wrap {
+  }
+
+  .field_wrap {
     width: 330px;
     margin: 0 auto;
     font-family: perfectFont;
-}
-.field_wrap .pwd_box {
+  }
+
+  .field_wrap .pwd_box {
     position: relative;
-}
-.field_wrap .pwd_box .mu-text-field {
+  }
+
+  .field_wrap .pwd_box .mu-text-field {
     width: 100%;
     color: rgba(0, 0, 0, 0.54);
-}
-.field_wrap .pwd_box .mu-text-field.has-label {
+  }
+
+  .field_wrap .pwd_box .mu-text-field.has-label {
     min-height: 72px;
-}
-.field_wrap .pwd_box .mu-text-field .mu-text-field-content {
+  }
+
+  .field_wrap .pwd_box .mu-text-field .mu-text-field-content {
     display: block;
     height: 100%;
     padding-bottom: 12px;
     padding-top: 4px;
-}
-.field_wrap .pwd_box .mu-text-field.has-label .mu-text-field-content {
+  }
+
+  .field_wrap .pwd_box .mu-text-field.has-label .mu-text-field-content {
     padding-top: 28px;
     padding-bottom: 12px;
-}
-.field_wrap
-  .pwd_box
-  .mu-text-field.has-label
-  .mu-text-field-content
-  .mu-text-field-label {
+  }
+
+  .field_wrap .pwd_box .mu-text-field.has-label .mu-text-field-content .mu-text-field-label {
     line-height: 20px;
     transition: all 0.45s cubic-bezier(0.23, 1, 0.32, 1);
     z-index: 1;
@@ -299,21 +304,14 @@ export default {
     font-size: 16px;
     font-family: perfectFont;
     font-weight: bold;
-}
-.field_wrap
-  .pwd_box
-  .mu-text-field.has-label
-  .mu-text-field-content
-  .mu-text-field.has-label
-  .mu-text-field-label {
+  }
+
+  .field_wrap .pwd_box .mu-text-field.has-label .mu-text-field-content .mu-text-field.has-label .mu-text-field-label {
     top: 8px;
     position: absolute;
-}
-.field_wrap
-  .pwd_box
-  .mu-text-field.has-label
-  .mu-text-field-content
-  .mu-text-field-input {
+  }
+
+  .field_wrap .pwd_box .mu-text-field.has-label .mu-text-field-content .mu-text-field-input {
     appearance: none;
     outline: none;
     border: none;
@@ -328,12 +326,14 @@ export default {
     color: rgba(0, 0, 0, 0.87);
     font-family: inherit;
     position: relative;
-}
-.field_wrap .el-button,
-.field_wrap .el-checkbox__inner {
+  }
+
+  .field_wrap .el-button,
+  .field_wrap .el-checkbox__inner {
     border-radius: 0;
-}
-.mu-text-field-line {
+  }
+
+  .mu-text-field-line {
     background-color: rgba(0, 0, 0, 0.4);
     margin: 0;
     height: 1px;
@@ -343,8 +343,9 @@ export default {
     position: absolute;
     box-sizing: content-box;
     overflow: visible;
-}
-.mu-text-field-focus-line {
+  }
+
+  .mu-text-field-focus-line {
     margin: 0;
     height: 2px;
     border: none;
@@ -358,33 +359,40 @@ export default {
     transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1);
     transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1),
       -webkit-transform 0.45s cubic-bezier(0.23, 1, 0.32, 1);
-}
-.mu-text-field-focus-line.focus {
+  }
+
+  .mu-text-field-focus-line.focus {
     transform: scaleX(1);
-}
-.el-button--primary,
-.el-checkbox__input.is-checked .el-checkbox__inner,
-.el-checkbox__input.is-indeterminate .el-checkbox__inner {
+  }
+
+  .el-button--primary,
+  .el-checkbox__input.is-checked .el-checkbox__inner,
+  .el-checkbox__input.is-indeterminate .el-checkbox__inner {
     background-color: #409efe !important;
     border-color: #409efe !important;
-}
-.login .login-box .right-card .forget {
+  }
+
+  .login .login-box .right-card .forget {
     margin-top: 12px;
     display: flex;
-}
-.login .login-box .right-card .forget .item-forget {
+  }
+
+  .login .login-box .right-card .forget .item-forget {
     flex: 1;
     font-size: 14px;
     font-family: perfectFont;
-}
-.login .login-box .right-card .forget .item-forget:last-child {
+  }
+
+  .login .login-box .right-card .forget .item-forget:last-child {
     text-align: right;
-}
-.login .login-box .right-card .forget .item-forget a {
+  }
+
+  .login .login-box .right-card .forget .item-forget a {
     color: #000;
     text-decoration: none;
-}
-.login .login-box .right-card .forget .item-forget a:hover {
+  }
+
+  .login .login-box .right-card .forget .item-forget a:hover {
     color: #409efe;
-}
+  }
 </style>
\ No newline at end of file