登录页面-新

src/dashoo.cn/frontend_web/src/pages/login.vue

@@ -17,101 +17,97 @@
       </div>
     </sticky>
 
-    <div style="background-color: #3273FC" v-if="activeIndex==0">
-
-      <div style="background-color: white;">
-        <div class="top-wrapper">
-          <img src="../assets/img/title_login.png" style="height:60px; margin-top: 5px;">
-        </div>
-        <div class="back-width">
-          <div class="login-body">
-            <section class="login">
-              <!--<header class="login-header">
-                <h1 style="text-align:center;margin-top:70px;margin-bottom:40px;"><router-link to="/"><img src="../assets/img/logo.png" style="height:80px;"></router-link></h1>
-                <el-alert v-if="error" :title="error.title" type="warning" :description="error.message" show-icon/>
-              </header>-->
-
-              <el-card class="box-card">
-                <!--<div slot="header" class="clearfix">
-                  <span style="font-weight: bold;">用户登录</span>
-                </div>-->
-                <el-menu :default-active="activeIndex+''" @select="handleSelect" mode="horizontal">
-                  <el-menu-item index="0">
-                    <i class="el-icon-tickets"></i>
-                    <span>登录</span>
-                  </el-menu-item>
-                  <el-menu-item index="1">
-                    <i class="el-icon-bell"></i>
-                    <span>通知中心</span>
-                  </el-menu-item>
-                  <el-menu-item index="2">
-                    <i class="el-icon-document"></i>
-                    <span>文件下载中心</span>
-                  </el-menu-item>
-                </el-menu>
-                <el-row>
-                  <el-col :span="12">
-                    <div class="demo-image__placeholder">
-                      <div class="block">
-                        <img style="width: 280px; height: 280px; margin-top: 15px" src="../assets/img/login_left.png" />
-                      </div>
+    <div v-if="activeIndex==0">
+      <div class="top-wrapper">
+        <img src="../assets/img/title_login.png" style="height:100px; margin-top: 2px;">
+      </div>
+      <div class="back-width">
+        <div class="login-body">
+          <section class="login">
+            <!--<header class="login-header">
+              <h1 style="text-align:center;margin-top:70px;margin-bottom:40px;"><router-link to="/"><img src="../assets/img/logo.png" style="height:80px;"></router-link></h1>
+              <el-alert v-if="error" :title="error.title" type="warning" :description="error.message" show-icon/>
+            </header>-->
+
+            <el-card class="box-card">
+              <!--<div slot="header" class="clearfix">
+                <span style="font-weight: bold;">用户登录</span>
+              </div>-->
+              <el-menu size="small" :default-active="activeIndex+''" @select="handleSelect" mode="horizontal">
+                <el-menu-item index="0">
+                  <i class="el-icon-tickets"></i>
+                  <span>登录</span>
+                </el-menu-item>
+                <el-menu-item index="1">
+                  <i class="el-icon-bell"></i>
+                  <span>通知中心</span>
+                </el-menu-item>
+                <el-menu-item index="2">
+                  <i class="el-icon-document"></i>
+                  <span>文件下载中心</span>
+                </el-menu-item>
+              </el-menu>
+              <el-row>
+                <!--<el-col :span="12">
+                  <div class="demo-image__placeholder">
+                    <div class="block">
+                      <img style="width: 280px; height: 280px; margin-top: 15px" src="../assets/img/login_left.png" />
                     </div>
-                   <!-- -->
-                  </el-col>
-                  <el-col :span="12">
-                    <el-form
-                      class="login-form"
-                      auto-complete="off"
-                      :model="model"
-                      :rules="rules"
-                      ref="user"
-                      label-position="top"
-                    >
-                      <el-form-item label="用户名" prop="username">
-                        <el-input type="text" v-model="model.username" placeholder="请输入用户名">
-                          <el-select
-                            v-model="loginMode"
-                            slot="append"
-                            placeholder="登录类型"
-                            style="width: 110px;"
-                          >
-                            <el-option label="PTR认证" :value="2"></el-option>
-                            <el-option label="普通账户" :value="1"></el-option>
-                          </el-select>
-                        </el-input>
-                      </el-form-item>
-                      <el-form-item label="密码" prop="password">
-                        <el-input
-                          type="password"
-                          v-model="model.password"
-                          placeholder="请输入密码"
-                          @keyup.enter.native="loginall()"
-                        />
-                      </el-form-item>
-                      <el-button
-                        type="primary"
-                        :loading="loading"
-                        @click="loginall()"
-                      >{{ loading ? '登录中...' : '登录' }}</el-button>
-                      <el-row>
-                        <el-col :span="12">
-                          <router-link :to="'/signup'">
-                            <el-button type="text" round>没有账户？请注册</el-button>
-                          </router-link>
-                        </el-col>
-                        <el-col :span="12">
-                          <router-link :to="'/passwordback'">
-                            <el-button type="text" round>忘记密码？</el-button>
-                          </router-link>
-                        </el-col>
-                      </el-row>
-                    </el-form>
-                  </el-col>
-                </el-row>
-
-              </el-card>
-            </section>
-          </div>
+                  </div>
+                </el-col>-->
+                <el-col :span="24">
+                  <el-form
+                    class="login-form"
+                    auto-complete="off"
+                    :model="model"
+                    :rules="rules"
+                    ref="user"
+                    label-position="top"
+                  >
+                    <el-form-item label="用户名" prop="username">
+                      <el-input type="text" v-model="model.username" placeholder="请输入用户名">
+                        <el-select
+                          v-model="loginMode"
+                          slot="append"
+                          placeholder="登录类型"
+                          style="width: 110px;"
+                        >
+                          <el-option label="PTR认证" :value="2"></el-option>
+                          <el-option label="普通账户" :value="1"></el-option>
+                        </el-select>
+                      </el-input>
+                    </el-form-item>
+                    <el-form-item label="密码" prop="password">
+                      <el-input
+                        type="password"
+                        v-model="model.password"
+                        placeholder="请输入密码"
+                        @keyup.enter.native="loginall()"
+                      />
+                    </el-form-item>
+                    <el-button
+                      type="primary"
+                      :loading="loading"
+                      @click="loginall()"
+                    >{{ loading ? '登录中...' : '登录' }}</el-button>
+                    <el-row>
+                      <el-col :span="12">
+                        <router-link :to="'/signup'">
+                          <el-button type="text" round>没有账户？请注册</el-button>
+                        </router-link>
+                      </el-col>
+                      <el-col :span="12">
+                        <router-link :to="'/passwordback'">
+                          <el-button type="text" round>忘记密码？</el-button>
+                        </router-link>
+                      </el-col>
+                    </el-row>
+                  </el-form>
+                </el-col>
+              </el-row>
+
+            </el-card>
+          </section>
         </div>
       </div>
     </div>
@@ -161,13 +157,18 @@
     </div>
 
     <div>
+      <footer class="login-footer" style="color:#A9A9A9">
+        ©企业法规处 版权所有
+      </footer>
+    </div>
+    <!--<div>
       <footer class="login-footer1">
         <div
           class="foot-wrapper"
           style="height: 30px; background-color: transparent; color:#A9A9A9; padding-top: 10px; text-align: right"
         >©企管法规处 版权所有</div>
       </footer>
-    </div>
+    </div>-->
   </div>
 </template>
 
@@ -465,20 +466,20 @@ export default class Login extends Vue {
 }
 
 .back-width {
-  background-color: #3273FC; /*#2F79F6   #E5E6EB */
+  background-color: white;
   position: fixed;
   margin: auto;
   left: 0;
   right: 0;
-  top: 60px;
+  top: 100px;
   width: 100%;
-  height: calc(100vh - 40px);
+  height: 520px;
 }
 
 .login-body {
-  background: url("../assets/img/gf.png") no-repeat left 50%;
+  background: url("../assets/img/gf.png") no-repeat left;
   font-family: "Open Sans", sans-serif;
-  background-color: #3273FC;
+  background-color: white; /*#3273FC*/
   background-size: cover;
 
   /*background-size: cover;
@@ -489,11 +490,11 @@ export default class Login extends Vue {
 
   position: absolute;
   margin: auto;
-  left: -400px;
+  left: 0px;
   right: 0;
   top: 0;
-  width: 800px;
-  height: 600px;
+  width: 100%;
+  height: 520px;
 
   /*margin: auto;
   left: 0px;
@@ -504,17 +505,31 @@ export default class Login extends Vue {
   height: calc(100vh - 40px);*/
 }
 
+.login-footer {
+  font-size: 10px;
+  clear: both;
+  display: block;
+  text-align: center;
+  margin: 0px auto;
+  position: absolute;
+  bottom: 10px;
+  width: 100%;
+
+  a {
+    color: $brand-color;
+  }
+}
+
 .login {
   /*flex: 1;
-    width: 100%;*/
+  width: 100%;*/
   position: relative;
-  max-width: 40rem;
-  top:50%;
-  left:50%;
+  max-width: 27rem;
+  top: 40px;
+  left: 50%;
+  margin-left: 100px;
   font-size: 0.875rem;
   opacity: 0.9;
-  margin-top: -250px;
-  margin-left: -1rem;
 
   &-header {
     margin-bottom: 1rem;
@@ -539,15 +554,15 @@ export default class Login extends Vue {
 
   &-form {
     /*margin-bottom: 2.5rem;
-      padding: 1.875rem 1.25rem;
-      background: $login-form-background;*/
+    padding: 1.875rem 1.25rem;
+    background: $login-form-background;*/
     color: $login-form-color;
 
     /*.heading {
-        margin: 0 0 1rem;
-        font-weight: 400;
-        font-size: 1.5rem;
-      }*/
+      margin: 0 0 1rem;
+      font-weight: 400;
+      font-size: 1.5rem;
+    }*/
 
     .el-button {
       margin-top: 0.5rem;

src/dashoo.cn/frontend_web/src/pages/passwordback.vue

@@ -68,7 +68,7 @@
     <div>
       <footer class="login-footer1">
         <div class="foot-wrapper" style="height: 30px; background-color: transparent; color:#A9A9A9; padding-top: 10px; text-align: right">
-          ©大港油田信息中心 版权所有
+          ©企业法规处 版权所有
         </div>
       </footer>
     </div>
@@ -179,7 +179,7 @@
               // 将按钮设置为不可点击状态
               this.isVisual = true
               this.isCodePass = false
-            
+
               // 60秒倒计时
               let time = 60
               let timer = setInterval(() => {
@@ -206,7 +206,7 @@
                   time2--
                 }
               }, 1000)
-             
+
             }
           })
           .catch((err) => {
@@ -227,7 +227,7 @@
           })
           return
         }
-        
+
         if (_this.formData.UserName=="") {
           this.$alert('请填写用户名！', '提示', {
             confirmButtonText: '确定',

src/dashoo.cn/frontend_web/src/pages/signup.vue

@@ -166,7 +166,7 @@
     <div>
       <footer class="login-footer1">
         <div class="foot-wrapper" style="height: 30px; background-color: transparent; color:#A9A9A9; padding-top: 10px; text-align: right">
-          ©大港油田信息中心 版权所有
+          ©企业法规处 版权所有
         </div>
       </footer>
     </div>