From f922218389bf0ec93d0b56776dec6ee257ad0c49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com>
Date: Fri, 3 Mar 2023 14:37:17 +0800
Subject: [PATCH] =?UTF-8?q?=E7=99=BB=E5=BD=95=E9=A1=B5=E9=9D=A2=E5=A4=AE?=
 =?UTF-8?q?=E8=A7=86=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/login/index.module.less | 30 ++++++++++++++++++++++++------
 src/pages/login/index.tsx         | 29 ++++++++++++++++-------------
 src/utils/index.less              | 10 +++++++++-
 3 files changed, 49 insertions(+), 20 deletions(-)

diff --git a/src/pages/login/index.module.less b/src/pages/login/index.module.less
index 3d22836..c56b537 100644
--- a/src/pages/login/index.module.less
+++ b/src/pages/login/index.module.less
@@ -28,18 +28,36 @@
     .left-box {
       width: 440px;
       height: 100%;
-      .icon{
-        
+      box-sizing: border-box;
+      padding: 80px 10px 80px 30px;
+      .icon {
+        width: 400px;
+        height: 400px;
       }
     }
     .right-box {
       width: 440px;
       height: 100%;
-      .captcha {
+      box-sizing: border-box;
+      padding: 50px 30px;
+      display: flex;
+      flex-direction: column;
+      .title {
         width: 120px;
-        height: 48px;
-        margin-left: 10px;
-        cursor: pointer;
+        height: auto;
+        font-size: 30px;
+        font-weight: 600;
+        color: #333333;
+        line-height: 30px;
+        border-bottom: 4px solid #ff4d4f;
+        box-sizing: border-box;
+        padding-bottom: 10px;
+      }
+      .captcha {
+        width: 125px;
+        height: 54px;
+        margin-left: 15px;
+        border: none;
         cursor: pointer;
       }
     }
diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx
index 9d36d08..63fd591 100644
--- a/src/pages/login/index.tsx
+++ b/src/pages/login/index.tsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from "react";
 import styles from "./index.module.less";
-import { Typography, Spin, Input, Button, message } from "antd";
+import { Spin, Input, Button, message } from "antd";
 import { login, system } from "../../api/index";
 import { setToken } from "../../utils/index";
 import { useDispatch } from "react-redux";
@@ -91,33 +91,31 @@ export const Login: React.FC = () => {
           <img className={styles["icon"]} src={icon} alt="" />
         </div>
         <div className={styles["right-box"]}>
-          <div className="d-flex mr-24">
-            <Typography.Title>登录后台</Typography.Title>
-          </div>
-          <div className="d-flex mb-24">
+          <div className={styles["title"]}>后台登录</div>
+          <div className="d-flex mt-50">
             <Input
               value={email}
               onChange={(e) => {
                 setEmail(e.target.value);
               }}
-              style={{ width: 300 }}
+              style={{ width: 400, height: 54 }}
               placeholder="请输入账号"
             />
           </div>
-          <div className="d-flex mb-24">
+          <div className="d-flex mt-50">
             <Input.Password
               value={password}
               onChange={(e) => {
                 setPassword(e.target.value);
               }}
-              style={{ width: 300 }}
+              style={{ width: 400, height: 54 }}
               placeholder="请输入密码"
             />
           </div>
-          <div className="d-flex mb-24">
+          <div className="d-flex mt-50">
             <Input
               value={captcha_val}
-              style={{ width: 160 }}
+              style={{ width: 260, height: 54 }}
               placeholder="请输入验证码"
               onChange={(e) => {
                 setCaptcha_val(e.target.value);
@@ -130,9 +128,14 @@ export const Login: React.FC = () => {
               alt=""
             />
           </div>
-          <div className="d-flex">
-            <Button type="primary" danger onClick={loginSubmit}>
-              登录
+          <div className="d-flex mt-50">
+            <Button
+              style={{ width: 400, height: 54 }}
+              type="primary"
+              danger
+              onClick={loginSubmit}
+            >
+              立即登录
             </Button>
           </div>
         </div>
diff --git a/src/utils/index.less b/src/utils/index.less
index bb4c22e..3872d05 100644
--- a/src/utils/index.less
+++ b/src/utils/index.less
@@ -46,6 +46,14 @@
   margin-right: 24px;
 }
 
+.mt-50 {
+  margin-top: 50px;
+}
+
+.mb-50 {
+  margin-bottom: 50px;
+}
+
 .float-left {
   width: 100%;
   height: auto;
@@ -82,7 +90,7 @@
 .c-flex {
   display: flex;
   flex-direction: column;
- align-items: center;
+  align-items: center;
 }
 
 .primary {