From 3840f6d96dc3e0ddfee98a0b1151bd299d6847d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=A5?= <yan.dia@qq.com>
Date: Thu, 17 Jul 2025 15:20:04 +0800
Subject: [PATCH] update login

---
 en/docs/login/index.md | 218 ++++++++++++++++++++++++++++++++++++++---
 zh/docs/login/index.md | 202 ++++++++++++++++++++++++++++++++++++--
 2 files changed, 396 insertions(+), 24 deletions(-)

diff --git a/en/docs/login/index.md b/en/docs/login/index.md
index f6963a5..f675271 100644
--- a/en/docs/login/index.md
+++ b/en/docs/login/index.md
@@ -138,6 +138,22 @@ title: Login & Register
     background-color: #2980b9;
 }
 
+/* Forgot password link styles */
+.forgot-password-link {
+    display: block;
+    text-align: center;
+    margin-top: 15px;
+    color: #3498db;
+    text-decoration: none;
+    font-size: 14px;
+    transition: color 0.3s ease;
+}
+
+.forgot-password-link:hover {
+    color: #2980b9;
+    text-decoration: underline;
+}
+
 /* Message prompt styles */
 .message-box {
     display: none;
@@ -167,7 +183,7 @@ title: Login & Register
 </style>
 
 <div class="login-page-container">
-    <h2>Phaten Cloud Login/Register</h2>
+    <h2>Phaten Login/Register</h2>
     
     <!-- Message prompt box -->
     <div id="messageBox" class="message-box">
@@ -186,6 +202,7 @@ title: Login & Register
             <input type="email" id="loginEmail" placeholder="Enter your email" required>
             <input type="password" id="loginPassword" placeholder="Enter your password" required>
             <button type="submit">Login</button>
+            <a href="javascript:void(0)" class="forgot-password-link" onclick="switchTab('reset')">Forgot Password?</a>
         </form>
     </div>
     
@@ -202,6 +219,21 @@ title: Login & Register
             <button type="submit">Register</button>
         </form>
     </div>
+    
+    <!-- Forgot password form -->
+    <div id="resetTab" class="tab-content">
+        <form id="resetForm" class="login-form">
+            <input type="email" id="resetEmail" placeholder="Enter your email" required>
+            <div class="code-container">
+                <input type="text" id="resetVerificationCode" class="code-input" placeholder="Enter verification code" required>
+                <button type="button" id="sendResetCodeBtn" class="send-code-btn">Send Code</button>
+            </div>
+            <input type="password" id="resetPassword" placeholder="Enter new password" required>
+            <input type="password" id="resetConfirmPassword" placeholder="Confirm new password" required>
+            <button type="submit">Reset Password</button>
+            <a href="javascript:void(0)" class="forgot-password-link" onclick="switchTab('login')">Back to Login</a>
+        </form>
+    </div>
 </div>
 
 <script>
@@ -216,13 +248,19 @@ title: Login & Register
     // Get form elements
     const loginForm = document.getElementById("loginForm");
     const registerForm = document.getElementById("registerForm");
+    const resetForm = document.getElementById("resetForm");
     const sendCodeBtn = document.getElementById("sendCodeBtn");
+    const sendResetCodeBtn = document.getElementById("sendResetCodeBtn");
     const messageBox = document.getElementById("messageBox");
     const messageText = document.getElementById("messageText");
     let countdownTimer;
+    let resetCountdownTimer;
 
     // Tab switching functionality
     window.switchTab = function(tabName) {
+        // Get tab container
+        const tabContainer = document.querySelector('.tab-container');
+        
         // Hide all tab content
         const tabContents = document.querySelectorAll('.tab-content');
         tabContents.forEach(tab => tab.classList.remove('active'));
@@ -233,11 +271,19 @@ title: Login & Register
         
         // Show corresponding tab content and set button active state
         if (tabName === 'login') {
+            // Show tab container
+            tabContainer.style.display = 'flex';
             document.getElementById('loginTab').classList.add('active');
-            document.querySelector('.tab-button').classList.add('active');
+            document.querySelectorAll('.tab-button')[0].classList.add('active');
         } else if (tabName === 'register') {
+            // Show tab container
+            tabContainer.style.display = 'flex';
             document.getElementById('registerTab').classList.add('active');
             document.querySelectorAll('.tab-button')[1].classList.add('active');
+        } else if (tabName === 'reset') {
+            // Hide tab container when in forgot password panel
+            tabContainer.style.display = 'none';
+            document.getElementById('resetTab').classList.add('active');
         }
         
         // Hide message box
@@ -319,7 +365,13 @@ title: Login & Register
         }
     }
 
-    // Send verification code
+    // Validate email format
+    function validateEmail(email) {
+        const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test(String(email).toLowerCase());
+    }
+
+    // Send register verification code
     sendCodeBtn.onclick = function() {
         const contactValue = document.getElementById('registerEmail').value;
         
@@ -359,13 +411,47 @@ title: Login & Register
         });
     }
 
-    // Validate email format
-    function validateEmail(email) {
-        const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        return re.test(String(email).toLowerCase());
+    // Send reset password verification code
+    sendResetCodeBtn.onclick = function() {
+        const contactValue = document.getElementById('resetEmail').value;
+        
+        if (!validateEmail(contactValue)) {
+            showMessage('Please enter a valid email address!', 'error');
+            return;
+        }
+        
+        // Disable button and start countdown
+        startResetCountdown();
+        
+        // Send AJAX request to get verification code
+        fetch(`${baseUrl}/fty/sendCode`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                type: "1", // Fixed as email type
+                username: contactValue
+            })
+        })
+        .then(response => response.json())
+        .then(data => {
+            console.log("Reset password verification code send response", data);
+            if (data.code==2000) {
+                showMessage('Verification code has been sent to your email!', 'success');
+            } else {
+                showMessage(data.msg || 'Failed to send verification code, please try again later!', 'error');
+                resetResetCountdown();
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            showMessage('Failed to send verification code request, please try again later!', 'error');
+            resetResetCountdown();
+        });
     }
 
-    // Start countdown
+    // Start register verification code countdown
     function startCountdown() {
         let countdown = 60;
         sendCodeBtn.disabled = true;
@@ -381,13 +467,36 @@ title: Login & Register
         }, 1000);
     }
 
-    // Reset countdown
+    // Reset register verification code countdown
     function resetCountdown() {
         clearInterval(countdownTimer);
         sendCodeBtn.disabled = false;
         sendCodeBtn.textContent = 'Send Code';
     }
 
+    // Start reset password verification code countdown
+    function startResetCountdown() {
+        let countdown = 60;
+        sendResetCodeBtn.disabled = true;
+        sendResetCodeBtn.textContent = `Retry after ${countdown}s`;
+        
+        resetCountdownTimer = setInterval(() => {
+            countdown--;
+            sendResetCodeBtn.textContent = `Retry after ${countdown}s`;
+            
+            if (countdown <= 0) {
+                resetResetCountdown();
+            }
+        }, 1000);
+    }
+
+    // Reset reset password verification code countdown
+    function resetResetCountdown() {
+        clearInterval(resetCountdownTimer);
+        sendResetCodeBtn.disabled = false;
+        sendResetCodeBtn.textContent = 'Send Code';
+    }
+
     // Handle login form submission
     loginForm.onsubmit = function(e) {
         console.log("Login form submitted");
@@ -533,15 +642,92 @@ title: Login & Register
         });
     }
 
+    // Handle forgot password form submission
+    resetForm.onsubmit = function(e) {
+        console.log("Reset password form submitted");
+        e.preventDefault();
+        const email = document.getElementById("resetEmail").value;
+        const verificationCode = document.getElementById("resetVerificationCode").value;
+        const password = document.getElementById("resetPassword").value;
+        const confirmPassword = document.getElementById("resetConfirmPassword").value;
+        
+        if (!validateEmail(email)) {
+            showMessage('Please enter a valid email address!', 'error');
+            return;
+        }
+        
+        if (!verificationCode) {
+            showMessage('Please enter verification code!', 'error');
+            return;
+        }
+        
+        if (!password) {
+            showMessage('Please enter new password!', 'error');
+            return;
+        }
+        
+        if (password !== confirmPassword) {
+            showMessage('The two passwords entered are inconsistent!', 'error');
+            return;
+        }
+        
+        // Show loading state
+        const submitBtn = resetForm.querySelector('button[type="submit"]');
+        const originalText = submitBtn.textContent;
+        submitBtn.textContent = 'Resetting...';
+        submitBtn.disabled = true;
+        
+        // Send AJAX request
+        fetch(`${baseUrl}/fty/resetpwd`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                type: 1, // Fixed as email type
+                username: email,
+                code: verificationCode,
+                password: password,
+                confirm_password: confirmPassword
+            })
+        })
+        .then(response => response.json())
+        .then(data => {
+            console.log("Reset password response", data);
+            if (data.code==2000) {
+                showMessage('Password reset successful! Please login with your new password', 'success');
+                resetResetCountdown();
+                
+                // Delay switch to login tab
+                setTimeout(() => {
+                    switchTab('login');
+                    // Clear reset form
+                    resetForm.reset();
+                }, 1500);
+            } else {
+                showMessage(data.msg || 'Password reset failed, please check your input!', 'error');
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            showMessage('Password reset request failed, please try again later!', 'error');
+        })
+        .finally(() => {
+            // Restore button state
+            submitBtn.textContent = originalText;
+            submitBtn.disabled = false;
+        });
+    }
+
     // Check login status when page loads
     document.addEventListener('DOMContentLoaded', async function() {
-        // const isLoggedIn = await validateToken();
-        // if (isLoggedIn) {
-        //     showMessage('You are already logged in, redirecting to homepage...', 'info');
-        //     setTimeout(() => {
-        //         window.location.href = '/';
-        //     }, 2000);
-        // }
+        const isLoggedIn = await validateToken();
+        if (isLoggedIn) {
+            showMessage('You are already logged in, redirecting to homepage...', 'info');
+            setTimeout(() => {
+                window.location.href = '/';
+            }, 2000);
+        }
     });
 
 })(); // End of immediately invoked function
diff --git a/zh/docs/login/index.md b/zh/docs/login/index.md
index b2c0e30..b84b4cb 100644
--- a/zh/docs/login/index.md
+++ b/zh/docs/login/index.md
@@ -138,6 +138,22 @@ title: 登录注册
     background-color: #2980b9;
 }
 
+/* 忘记密码链接样式 */
+.forgot-password-link {
+    display: block;
+    text-align: center;
+    margin-top: 15px;
+    color: #3498db;
+    text-decoration: none;
+    font-size: 14px;
+    transition: color 0.3s ease;
+}
+
+.forgot-password-link:hover {
+    color: #2980b9;
+    text-decoration: underline;
+}
+
 /* 消息提示样式 */
 .message-box {
     display: none;
@@ -186,6 +202,7 @@ title: 登录注册
             <input type="email" id="loginEmail" placeholder="请输入邮箱" required>
             <input type="password" id="loginPassword" placeholder="请输入密码" required>
             <button type="submit">登录</button>
+            <a href="javascript:void(0)" class="forgot-password-link" onclick="switchTab('reset')">忘记密码？</a>
         </form>
     </div>
     
@@ -202,6 +219,21 @@ title: 登录注册
             <button type="submit">注册</button>
         </form>
     </div>
+    
+    <!-- 忘记密码表单 -->
+    <div id="resetTab" class="tab-content">
+        <form id="resetForm" class="login-form">
+            <input type="email" id="resetEmail" placeholder="请输入邮箱" required>
+            <div class="code-container">
+                <input type="text" id="resetVerificationCode" class="code-input" placeholder="请输入验证码" required>
+                <button type="button" id="sendResetCodeBtn" class="send-code-btn">发送验证码</button>
+            </div>
+            <input type="password" id="resetPassword" placeholder="请输入新密码" required>
+            <input type="password" id="resetConfirmPassword" placeholder="请确认新密码" required>
+            <button type="submit">重置密码</button>
+            <a href="javascript:void(0)" class="forgot-password-link" onclick="switchTab('login')">返回登录</a>
+        </form>
+    </div>
 </div>
 
 <script>
@@ -216,13 +248,19 @@ title: 登录注册
     // 获取表单元素
     const loginForm = document.getElementById("loginForm");
     const registerForm = document.getElementById("registerForm");
+    const resetForm = document.getElementById("resetForm");
     const sendCodeBtn = document.getElementById("sendCodeBtn");
+    const sendResetCodeBtn = document.getElementById("sendResetCodeBtn");
     const messageBox = document.getElementById("messageBox");
     const messageText = document.getElementById("messageText");
     let countdownTimer;
+    let resetCountdownTimer;
 
     // Tab 切换功能
     window.switchTab = function(tabName) {
+        // 获取tab容器
+        const tabContainer = document.querySelector('.tab-container');
+        
         // 隐藏所有tab内容
         const tabContents = document.querySelectorAll('.tab-content');
         tabContents.forEach(tab => tab.classList.remove('active'));
@@ -233,11 +271,19 @@ title: 登录注册
         
         // 显示对应的tab内容和设置按钮active状态
         if (tabName === 'login') {
+            // 显示tab容器
+            tabContainer.style.display = 'flex';
             document.getElementById('loginTab').classList.add('active');
-            document.querySelector('.tab-button').classList.add('active');
+            document.querySelectorAll('.tab-button')[0].classList.add('active');
         } else if (tabName === 'register') {
+            // 显示tab容器
+            tabContainer.style.display = 'flex';
             document.getElementById('registerTab').classList.add('active');
             document.querySelectorAll('.tab-button')[1].classList.add('active');
+        } else if (tabName === 'reset') {
+            // 忘记密码面板时隐藏tab容器
+            tabContainer.style.display = 'none';
+            document.getElementById('resetTab').classList.add('active');
         }
         
         // 隐藏消息框
@@ -319,7 +365,13 @@ title: 登录注册
         }
     }
 
-    // 发送验证码
+    // 验证邮箱格式
+    function validateEmail(email) {
+        const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test(String(email).toLowerCase());
+    }
+
+    // 发送注册验证码
     sendCodeBtn.onclick = function() {
         const contactValue = document.getElementById('registerEmail').value;
         
@@ -359,13 +411,47 @@ title: 登录注册
         });
     }
 
-    // 验证邮箱格式
-    function validateEmail(email) {
-        const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        return re.test(String(email).toLowerCase());
+    // 发送重置密码验证码
+    sendResetCodeBtn.onclick = function() {
+        const contactValue = document.getElementById('resetEmail').value;
+        
+        if (!validateEmail(contactValue)) {
+            showMessage('请输入有效的邮箱地址！', 'error');
+            return;
+        }
+        
+        // 禁用按钮并开始倒计时
+        startResetCountdown();
+        
+        // 发送AJAX请求获取验证码
+        fetch(`${baseUrl}/fty/sendCode`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                type: "1", // 固定为邮箱类型
+                username: contactValue
+            })
+        })
+        .then(response => response.json())
+        .then(data => {
+            console.log("重置密码验证码发送返回",data);
+            if (data.code==2000) {
+                showMessage('验证码已发送到您的邮箱！', 'success');
+            } else {
+                showMessage(data.msg || '验证码发送失败，请稍后重试！', 'error');
+                resetResetCountdown();
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            showMessage('验证码发送请求失败，请稍后重试！', 'error');
+            resetResetCountdown();
+        });
     }
 
-    // 开始倒计时
+    // 开始注册验证码倒计时
     function startCountdown() {
         let countdown = 60;
         sendCodeBtn.disabled = true;
@@ -381,13 +467,36 @@ title: 登录注册
         }, 1000);
     }
 
-    // 重置倒计时
+    // 重置注册验证码倒计时
     function resetCountdown() {
         clearInterval(countdownTimer);
         sendCodeBtn.disabled = false;
         sendCodeBtn.textContent = '发送验证码';
     }
 
+    // 开始重置密码验证码倒计时
+    function startResetCountdown() {
+        let countdown = 60;
+        sendResetCodeBtn.disabled = true;
+        sendResetCodeBtn.textContent = `${countdown}秒后重试`;
+        
+        resetCountdownTimer = setInterval(() => {
+            countdown--;
+            sendResetCodeBtn.textContent = `${countdown}秒后重试`;
+            
+            if (countdown <= 0) {
+                resetResetCountdown();
+            }
+        }, 1000);
+    }
+
+    // 重置重置密码验证码倒计时
+    function resetResetCountdown() {
+        clearInterval(resetCountdownTimer);
+        sendResetCodeBtn.disabled = false;
+        sendResetCodeBtn.textContent = '发送验证码';
+    }
+
     // 处理登录表单提交
     loginForm.onsubmit = function(e) {
         console.log("Login form submitted");
@@ -533,6 +642,83 @@ title: 登录注册
         });
     }
 
+    // 处理忘记密码表单提交
+    resetForm.onsubmit = function(e) {
+        console.log("Reset password form submitted");
+        e.preventDefault();
+        const email = document.getElementById("resetEmail").value;
+        const verificationCode = document.getElementById("resetVerificationCode").value;
+        const password = document.getElementById("resetPassword").value;
+        const confirmPassword = document.getElementById("resetConfirmPassword").value;
+        
+        if (!validateEmail(email)) {
+            showMessage('请输入有效的邮箱地址！', 'error');
+            return;
+        }
+        
+        if (!verificationCode) {
+            showMessage('请输入验证码！', 'error');
+            return;
+        }
+        
+        if (!password) {
+            showMessage('请输入新密码！', 'error');
+            return;
+        }
+        
+        if (password !== confirmPassword) {
+            showMessage('两次输入的密码不一致！', 'error');
+            return;
+        }
+        
+        // 显示加载状态
+        const submitBtn = resetForm.querySelector('button[type="submit"]');
+        const originalText = submitBtn.textContent;
+        submitBtn.textContent = '重置中...';
+        submitBtn.disabled = true;
+        
+        // 发送AJAX请求
+        fetch(`${baseUrl}/fty/resetpwd`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                type: 1, // 固定为邮箱类型
+                username: email,
+                code: verificationCode,
+                password: password,
+                confirm_password: confirmPassword
+            })
+        })
+        .then(response => response.json())
+        .then(data => {
+            console.log("重置密码返回",data);
+            if (data.code==2000) {
+                showMessage('密码重置成功！请使用新密码登录', 'success');
+                resetResetCountdown();
+                
+                // 延迟切换到登录标签
+                setTimeout(() => {
+                    switchTab('login');
+                    // 清空重置表单
+                    resetForm.reset();
+                }, 1500);
+            } else {
+                showMessage(data.msg || '密码重置失败，请检查输入信息！', 'error');
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            showMessage('密码重置请求失败，请稍后重试！', 'error');
+        })
+        .finally(() => {
+            // 恢复按钮状态
+            submitBtn.textContent = originalText;
+            submitBtn.disabled = false;
+        });
+    }
+
     // 页面加载时检查登录状态
     document.addEventListener('DOMContentLoaded', async function() {
         const isLoggedIn = await validateToken();