登录页样式

src/components/Login/index.js

@@ -2,6 +2,8 @@ import { Form, Input, Button, message } from 'antd';
 import { UserOutlined, LockOutlined } from '@ant-design/icons';
 import apiObj from '@api/index';
 import './index.less'
+import loginBg from '@images/login-bg.png'
+import loginIcon from '@images/logo1.png'
 
 const {post,api,interceptors} = apiObj;
 function Login({history}) {
@@ -26,11 +28,12 @@ function Login({history}) {
         <div className="login-container clearfix">
             <div className="bg-box">
                 <h1>AI病案质控平台</h1>
-                <img src="" alt="背景图片"/>
+                <img src={loginBg} alt="背景图片"/>
             </div>
             <div className="content-box">
                 <div className="logo">
-                    <img src="" alt="logo"/>
+                    <img src={loginIcon} alt="logo"/>
+                    <p className='welcome'>欢迎使用！</p>
                 </div>
                 <Form className='form-box' layout='vertical' onFinish={onLogin}>
                     <Form.Item

src/components/Login/index.less

@@ -1,25 +1,53 @@
 @import "@common/common.less";
 
 .login-container{
+  min-width: 1200px;
   height: 100vh;
   .bg-box{
+    position: relative;
     float: left;
-    width: 65%;
+    width: 63%;
     height: 100%;
-    background: #ccc;
+    background:#fff;
+    /*background: url("../../images/login-bg.png") #ccc no-repeat;
+    background-size: cover;*/
+    h1{
+      position: absolute;
+      font-size: 28px;
+      color: #fff;
+      top:74px;
+      left: 39px;
+    }
+    img{
+      height: 100%;
+    }
   }
   .content-box{
-    width: 35%;
-    background: #fff;
+    width: 37%;
+    height: 100%;
+    background: url("../../images/login-v.png") top right #fff no-repeat;
     float: right;
 
   }
   .form-box{
-    width: 300px;
+    width: 55%;
     margin: auto;
+    .ant-btn-primary{
+      width: 100%;
+    }
   }
   .logo{
-    margin-top: 150px;
+    width: 55%;
+    margin: 150px auto 50px;
     text-align: center;
+    .welcome{
+      font-size: 20px;
+      font-weight: bold;
+      margin-top: 80px;
+      text-align: left;
+    }
+    img{
+      width: 100%;
+    }
   }
 }