zhangjie 4 жил өмнө
parent
commit
266073b134

+ 0 - 0
src/assets/images/login-back1.jpg → src/assets/images/login-back.jpg


+ 50 - 8
src/assets/styles/login.scss

@@ -6,7 +6,7 @@
   bottom: 0;
   bottom: 0;
   right: 0;
   right: 0;
   z-index: 8;
   z-index: 8;
-  background-image: url(../images/login-back.png);
+  background-image: url(../images/login-back.jpg);
   background-repeat: no-repeat;
   background-repeat: no-repeat;
   background-size: cover;
   background-size: cover;
   overflow: auto;
   overflow: auto;
@@ -19,25 +19,68 @@
   left: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
 }
 }
+.login-shadow-top {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 8;
+  overflow: hidden;
+  &::before {
+    content: "";
+    display: block;
+    position: absolute;
+    width: 100%;
+    height: 200%;
+    background: radial-gradient(
+      circle,
+      rgba(255, 255, 255, 1) 0%,
+      rgba(85, 109, 255, 0) 60%
+    );
+    opacity: 0.6;
+  }
+}
+.login-shadow-bottom {
+  position: absolute;
+  bottom: -300px;
+  left: 0;
+  width: 100%;
+  height: 300px;
+  z-index: 8;
+  overflow: hidden;
+  &::before {
+    content: "";
+    display: block;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    height: 200%;
+    background: radial-gradient(
+      circle,
+      rgba(6, 44, 255, 1) 0%,
+      rgba(85, 109, 255, 0) 60%
+    );
+    opacity: 0.5;
+  }
+}
 .login-body {
 .login-body {
   position: relative;
   position: relative;
   z-index: 9;
   z-index: 9;
   width: 390px;
   width: 390px;
   background-color: #fff;
   background-color: #fff;
-  box-shadow: 0px 0 25px #bbb;
+  box-shadow: 0px 25px 50px 0px rgba(0, 31, 208, 0.3);
   overflow: hidden;
   overflow: hidden;
+  padding: 50px;
   margin: 0 auto;
   margin: 0 auto;
 }
 }
 .login-title {
 .login-title {
   text-align: center;
   text-align: center;
-  padding: 20px 50px;
-  background-color: $--color-blue;
-  color: #fff;
+  margin-bottom: 26px;
   h1 {
   h1 {
     font-size: 23px;
     font-size: 23px;
     font-weight: bold;
     font-weight: bold;
-    height: 40px;
-    line-height: 40px;
   }
   }
 
 
   img {
   img {
@@ -48,7 +91,6 @@
   }
   }
 }
 }
 .login-form {
 .login-form {
-  padding: 50px;
   .el-form-item:last-child {
   .el-form-item:last-child {
     margin-bottom: 0;
     margin-bottom: 0;
   }
   }

+ 3 - 1
src/modules/login/views/Login.vue

@@ -49,7 +49,7 @@
           <el-form-item prop="schoolCode"></el-form-item>
           <el-form-item prop="schoolCode"></el-form-item>
           <el-form-item>
           <el-form-item>
             <el-button
             <el-button
-              style="width:100px;"
+              style="width:100%;"
               type="primary"
               type="primary"
               :disabled="isSubmit"
               :disabled="isSubmit"
               @click="submit('loginForm')"
               @click="submit('loginForm')"
@@ -59,6 +59,8 @@
         </el-form>
         </el-form>
       </div>
       </div>
     </div>
     </div>
+    <div class="login-shadow-top"></div>
+    <div class="login-shadow-bottom"></div>
 
 
     <!-- 修改密码 -->
     <!-- 修改密码 -->
     <reset-pwd :user-password="loginModel.password" ref="ResetPwd"></reset-pwd>
     <reset-pwd :user-password="loginModel.password" ref="ResetPwd"></reset-pwd>