src/components/layouts/UserLayout.vue

@@ -2,16 +2,12 @@
   <div id="userLayout" :class="['user-layout-wrapper', device]">
     <div class="container">
       <div class="top">
-        <div class="header">
-          <a >
-            <img src="~@/assets/login/title4.png" class="logo" alt="logo">
-          </a>
-        </div>
-        <!--        <div class="desc">
-                  Jeecg Boot 是中国最具影响力的 企业级 低代码平台
-                </div>-->
+<!--        <div class="header">-->
+<!--          <a >-->
+<!--            <img src="~@/assets/login/title4.png" class="logo" alt="logo">-->
+<!--          </a>-->
+<!--        </div>-->
       </div>
-
       <route-view></route-view>
 
       <div class="footer">
@@ -24,7 +20,7 @@
          <!-- Copyright &copy; 2019 <a href="http://www.sdjintian.com" target="_blank">金田产业发展集团</a> 出品-->
         </div>
       </div>
-      <img src='@/assets/login/left-bg.png' class='left-img' alt=''>
+<!--      <img src='@/assets/login/left-bg.png' class='left-img' alt=''>-->
 
     </div>
   </div>
@@ -53,17 +49,16 @@
 <style lang="less" scoped>
   #userLayout.user-layout-wrapper {
     height: 100%;
-    background: #f0f2f5 url(~@/assets/login/background.jpg) no-repeat 50%;
-    background-size: 100%;
-
+    background: url("~@/assets/login/title4.png") no-repeat 50px 50px ,url("~@/assets/login/left-bg.png") no-repeat 50px center,#0E7CED ;
+    background-size: 700px,auto;
   //overflow: hidden;
   &.mobile {
   .container {
   .main {
-    max-width: 368px;
-    width: 98%;
-    position: relative;
-    z-index: 300;
+    //max-width: 368px;
+    //width: 98%;
+    //position: relative;
+    //z-index: 300;
   }
   }
   }
@@ -71,8 +66,8 @@
   .container {
     width: 100%;
     height: 100%;
-    padding: 6% 0 144px;
-    padding-right: 90px;
+    padding: 0;
+    //padding-right: 90px;
     position: relative;
 
   .left-img{
@@ -86,9 +81,10 @@
   }
 
   .top {
-    text-align: left;
+    //text-align: left;
     position: relative;
     z-index: 300;
+    background: url("~@/assets/login/title4.png") no-repeat 0 0;
   .header {
     height: 44px;
     line-height: 44px;
@@ -131,11 +127,14 @@
   }
 
   .main {
-    min-width: 260px;
-    width: 25%;
-    margin: 0 auto;
-    margin-top:4% ;
-    margin-right: 0px;
+    position: absolute;
+    left:calc(100% - 600px);
+    top:calc(50% - 280px);
+    //min-width: 260px;
+    //width: 25%;
+    //margin: 0 auto;
+    //margin-top:4% ;
+    //margin-right: 0px;
   }
 
   .footer {

src/views/user/Login.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="main" style="margin-top:-70px ">
+  <div class="main">
     <a-form-model class="user-layout-login" @keyup.enter.native="handleSubmit">
       <login-account ref="alogin" @validateFail="validateFail" @success="requestSuccess" @fail="requestFailed"></login-account>
 <!--      <a-form-model-item style='width: 65%;margin: 0 auto'>
@@ -158,9 +158,12 @@ export default {
 </script>
 <style lang="less" scoped>
   .user-layout-login {
-    background: #0f7dee url(~@/assets/login/login-bg.png) no-repeat 50%;
-    height: 610px;
-    background-size: contain;
+    background: url(~@/assets/login/login-bg.png) no-repeat;
+    height: 560px;
+    width: 474px;
+    //right:20%;
+    background-size: cover;
+    background-position: center;
     padding-top: 158px ;
     padding-left: 34px;
     label {