邀请码、端口修改
Change-Id: Idc325c5f970ade6c750cd09d3d3c32b803dd17e3
diff --git a/src/pages/AuthPage/AuthPage.css b/src/pages/AuthPage/AuthPage.css
index 98e5532..6e8b965 100644
--- a/src/pages/AuthPage/AuthPage.css
+++ b/src/pages/AuthPage/AuthPage.css
@@ -1,109 +1,27 @@
-/* .auth-container {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- min-height: 100vh;
- font-family: Arial, sans-serif;
- background: #333;
- padding: 0 2rem;
-}
-
-.auth-container img {
- margin-left: 250px;
-}
-
-.auth-form-section {
- background: #E4D8C9;
- padding: 2rem;
- border-radius: 10px;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
- width: 300px;
- margin: 0 auto;
- max-width: 400px;
-}
-
-.form-group {
- margin-bottom: 1.2rem;
- display: flex;
- flex-direction: column;
-}
-
-label {
- display: block;
- font-size: 0.9rem;
- margin-bottom: 0.5rem;
- color: #4A3B34;
-}
-
-.form-input {
- width: 100%;
- padding: 0.8rem;
- border: 1px solid #ddd;
- border-radius: 5px;
- font-size: 0.9rem;
- box-sizing: border-box;
-}
-
-.auth-button {
- padding: 0.8rem 8.4rem;
- background: #BA929A;
- color: #4A3B34;
- border: none;
- border-radius: 5px;
- cursor: pointer;
- font-size: 0.9rem;
- display: inline-block;
-}
-
-.verify-button {
- padding: 0.5rem 1rem;
- background: #BA929A;
- color: #4A3B34;
- border: none;
- border-radius: 5px;
- cursor: pointer;
- font-size: 0.8rem;
- display: inline-block;
-}
-
-.link-button {
- background: none;
- border: none;
- color: #4A3B34;
- cursor: pointer;
- font-size: 0.8rem;
- padding: 0;
-}
-
-.forgot-password {
- position: absolute;
- right: 10px;
- bottom: 5px;
- font-size: 12px;
- background: none;
- border: none;
- color: #4A3B34;
- cursor: pointer;
- text-decoration: underline;
-}
-
-.register-link, .login-link {
- text-align: center;
- font-size: 0.8rem;
- margin-top: 1rem;
-} */
-
-
.auth-container {
display: flex;
align-items: center;
- justify-content: flex-end; /* 使卡片靠右 */
+ /* justify-content: flex-end; */
+ justify-content: space-between;
min-height: 100vh;
font-family: Arial, sans-serif;
- background: #333;
+ background: #5F4437;
/* background: linear-gradient(180deg, #5F4437, #823c3c) */
padding: 0 2rem; /* 添加左右内边距 */
}
+
+ .logo-container {
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 2rem;
+ }
+
+ .site-logo {
+ width: 300px; /* 设置固定宽度 */
+ height: auto; /* 高度自适应，保持比例 */
+ }
.auth-card {
width: 100%;
diff --git a/src/pages/AuthPage/AuthPage.jsx b/src/pages/AuthPage/AuthPage.jsx
index e7f8f52..fe1b42b 100644
--- a/src/pages/AuthPage/AuthPage.jsx
+++ b/src/pages/AuthPage/AuthPage.jsx
@@ -1,8 +1,7 @@
import { useState } from "react";
import { Link } from "wouter";
import "./AuthPage.css";
-import CryptoJS from "crypto-js";
-
+import logo from '../../assets/logo.png';
function AuthPage() {
const [activeTab, setActiveTab] = useState("login");
@@ -29,17 +28,13 @@
register: {},
});
- const hashPassword = (password) => {
- return CryptoJS.SHA256(password).toString(CryptoJS.enc.Hex);
- };
-
// Handle login form submission
const handleLogin = async (e) => {
e.preventDefault();
const newErrors = {};
if (!loginData.username) {
- newErrors.username = "请输入用户名或邮箱";
+ newErrors.username = "请输入用户名";
}
if (!loginData.password) {
newErrors.password = "请输入密码";
@@ -109,8 +104,6 @@
return;
}
- const hashedPassword = hashPassword(registerData.password);
-
try {
const response = await fetch("/echo/user/register", {
method: 'POST',
@@ -120,8 +113,8 @@
body: JSON.stringify({
username: registerData.username,
email: registerData.email,
- password: hashedPassword,
- role: "user", // 默认角色，可根据实际情况调整
+ password: registerData.password, // 原始密码
+ role: "user",
inviteCode: registerData.inviteCode,
}),
});
@@ -144,6 +137,7 @@
};
+
// Update login form data
const updateLoginData = (field, value) => {
setLoginData({
@@ -162,6 +156,10 @@
return (
<div className="auth-container">
+ <div className="logo-container">
+ <img src={logo} alt="Logo" className="site-logo" />
+ </div>
+
<div className="auth-card">
<div className="auth-header">
<div className={`auth-tab ${activeTab === "login" ? "active" : ""}`} onClick={() => setActiveTab("login")}>
@@ -178,13 +176,13 @@
<form className="auth-form" onSubmit={handleLogin}>
{errors.login.message && <div className="error-message">{errors.login.message}</div>}
<div className="form-group">
- <label htmlFor="login-username">用户名/邮箱</label>
+ <label htmlFor="login-username">用户名</label>
<input
type="text"
id="login-username"
value={loginData.username}
onChange={(e) => updateLoginData("username", e.target.value)}
- placeholder="请输入用户名或邮箱"
+ placeholder="请输入用户名"
required
/>
{errors.login.username && <div className="error-message">{errors.login.username}</div>}
@@ -205,13 +203,13 @@
<div className="form-group-inline">
<div className="checkbox-container">
- <input
+ {/* <input
type="checkbox"
id="remember-me"
checked={loginData.rememberMe}
onChange={(e) => updateLoginData("rememberMe", e.target.checked)}
- />
- <label htmlFor="remember-me">记住我</label>
+ /> */}
+ {/* <label htmlFor="remember-me">记住我</label> */}
</div>
<Link to="/forgot-password" className="forgot-password">
忘记密码?