feat: 实现多端飞书登录功能

1. 飞书客户端内：静默自动登录
   - 检测飞书环境 (userAgent + ttjsBridge)
   - 调用 ttjsBridge.getAuthCode() 获取授权码
   - 自动登录到后台

2. 飞书客户端外：扫码登录
   - 后端新增三个接口：
     * POST /api/v1/auth/qrcode-login - 生成登录会话和二维码
     * GET /api/v1/auth/qrcode-login/status - 轮询登录状态
     * GET /login/qrcode/{id} - 飞书授权回调
   - 前端新增 QRCodeLogin 组件：
     * 使用 qrcode.react 生成二维码
     * 每 2 秒轮询登录状态
     * 状态：loading → pending → scanning → success/expired

3. 数据库表：feishu_login_session
   - 存储 session_id, auth_url, status, user_id
   - 状态：pending, scanning, success, expired
   - 2 分钟过期机制

4. 其他优化
   - 移除审批详情页的 header
   - 更新 PROJECT_ISSUES.md 文档

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/pages/login/index.tsx

@@ -1,54 +1,137 @@
-import { useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
 import { Toast } from 'antd-mobile'
 import { useUserStore } from '@/stores/user'
+import QRCodeLogin from './QRCodeLogin'
 import styles from './login.module.css'
 
+// 声明 ttjsBridge 类型
+declare global {
+  interface Window {
+    ttjsBridge?: {
+      getAuthCode: (params: any) => void
+    }
+  }
+}
+
 export default function Login() {
   const navigate = useNavigate()
   const { login } = useUserStore()
+  const [loading, setLoading] = useState(true)
+  const [environment, setEnvironment] = useState<'feishu' | 'external' | null>(null)
+  const [showQRCode, setShowQRCode] = useState(false)
 
   useEffect(() => {
-    // 检查 URL 中是否有 auth_code 参数（飞书授权回调）
-    const urlParams = new URLSearchParams(window.location.search)
-    const authCode = urlParams.get('auth_code')
+    // 监听飞书登录成功事件
+    const handleFeishuLoginSuccess = ((e: any) => {
+      console.log('🎉 收到飞书登录成功事件:', e.detail)
+      const { user, token } = e.detail
+      login(user, token)
+    }) as EventListener
 
-    if (authCode) {
-      // 有授权码，执行登录
-      handleFeishuLogin(authCode)
-    } else {
-      // 没有授权码，跳转到飞书授权页面
-      redirectToFeishu()
+    window.addEventListener('feishu-login-success', handleFeishuLoginSuccess)
+
+    return () => {
+      window.removeEventListener('feishu-login-success', handleFeishuLoginSuccess)
     }
   }, [])
 
-  const redirectToFeishu = () => {
-    // 飞书应用配置
-    const appId = 'cli_a8033d607cba500d'
-    // 重定向URI：前端登录页面（使用https）
-    const redirectUri = encodeURIComponent('https://xsm.dev.hnxinyouhe.com/login')
-    // 租户密钥（新友合公司）
-    const tenantKey = '14e7bc0fe5985740'
+  useEffect(() => {
+    // 1. 检测是否在飞书客户端内
+    const ua = navigator.userAgent.toLowerCase()
+    const isInFeishu = ua.includes('feishu') || ua.includes('lark') || (window as any).ttjsBridge !== undefined
 
-    // 构建飞书授权 URL
-    const authUrl = `https://open.feishu.cn/open-apis/authen/v1/oidc/authorize?app_id=${appId}&redirect_uri=${redirectUri}&state=${tenantKey}`
+    console.log('🔍 Environment check:', { ua, isInFeishu, hasBridge: !!(window as any).ttjsBridge })
 
-    console.log('飞书授权 URL:', authUrl)
+    if (isInFeishu) {
+      // 飞书内：静默授权
+      setEnvironment('feishu')
+      handleFeishuAutoLogin()
+    } else {
+      // 飞书外：检查 URL 中是否有 auth_code 参数（飞书授权回调）
+      const urlParams = new URLSearchParams(window.location.search)
+      const authCode = urlParams.get('auth_code')
+      const qrcodeId = urlParams.get('qrcode_id')
 
-    // 跳转到飞书授权页面
-    window.location.href = authUrl
+      if (qrcodeId) {
+        // 扫码登录回调
+        setEnvironment('external')
+        handleQrcodeCallback(qrcodeId)
+      } else if (authCode) {
+        // 直接访问授权页面（不太可能）
+        setEnvironment('external')
+        handleFeishuCallback(authCode)
+      } else {
+        setEnvironment('external')
+        setLoading(false)
+      }
+    }
+  }, [])
+
+  // 飞书内静默授权
+  const handleFeishuAutoLogin = () => {
+    console.log('🚀 Feishu auto login started')
+
+    if ((window as any).ttjsBridge) {
+      (window as any).ttjsBridge.getAuthCode({
+        success: (authCode: string) => {
+          console.log('✅ Got auth code from ttjsBridge:', authCode)
+          handleFeishuLogin(authCode)
+        },
+        fail: (error: any) => {
+          console.error('❌ Get auth code failed:', error)
+          setLoading(false)
+          Toast.show('获取授权失败，请重试')
+        },
+      })
+    } else {
+      console.warn('⚠️ ttjsBridge not available')
+      setLoading(false)
+    }
   }
 
+  // 跳转到飞书授权页面（飞书外扫码登录）
+  const redirectToFeishu = () => {
+    // 直接打开扫码登录弹窗
+    setShowQRCode(true)
+  }
+
+  // 处理飞书回调（飞书外扫码后回调）
+  const handleFeishuCallback = async (authCode: string) => {
+    try {
+      await handleFeishuLogin(authCode)
+    } catch (error) {
+      console.error('登录失败:', error)
+      setLoading(false)
+    }
+  }
+
+  // 处理扫码登录回调
+  const handleQrcodeCallback = async (qrcodeId: string) => {
+    try {
+      // 飞书扫码后会带着 qrcode_id 参数跳转回来
+      // 这个时候前端需要显示 loading 状态
+      // 后端会处理 qrcodeLoginCallback，更新 session 状态
+      // 前端只需要轮询状态即可
+      setShowQRCode(true)
+      setLoading(false)
+
+      // 设置轮询 session_id
+      // 实际上这个逻辑在 QRCodeLogin 组件中处理
+    } catch (error) {
+      console.error('处理扫码回调失败:', error)
+      setLoading(false)
+    }
+  }
+
+  // 处理飞书登录
   const handleFeishuLogin = async (authCode: string) => {
     try {
       const tenantKey = '14e7bc0fe5985740'
 
-      // 调用后端登录接口
       const response = await fetch('/api/v1/auth/feishu-login', {
         method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
+        headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
           auth_code: authCode,
           tenant_key: tenantKey,
@@ -58,36 +141,70 @@ export default function Login() {
       const result = await response.json()
 
       if (result.code === 0) {
-        // 登录成功，保存到 store
         login(result.data.user, result.data.token)
-
         Toast.show('登录成功')
-        // 跳转到首页
         navigate('/dashboard')
       } else {
         Toast.show(result.message || '登录失败')
-        // 登录失败，重新跳转到飞书授权
-        setTimeout(() => {
-          redirectToFeishu()
-        }, 2000)
+        setLoading(false)
       }
     } catch (error: any) {
       console.error('登录失败:', error)
       Toast.show('登录失败，请重试')
-      setTimeout(() => {
-        redirectToFeishu()
-      }, 2000)
+      setLoading(false)
     }
   }
 
+  // 邮箱密码登录
+  const handlePasswordLogin = () => {
+    navigate('/login-simple')
+  }
+
+  if (loading) {
+    return (
+      <div className={styles.login}>
+        <div className={styles.container}>
+          <h1>企业工具台</h1>
+          <p>正在登录...</p>
+        </div>
+      </div>
+    )
+  }
+
   return (
     <div className={styles.login}>
       <div className={styles.container}>
         <h1>企业工具台</h1>
-        <p>正在跳转到飞书授权...</p>
-        <button className={styles.feishuBtn} onClick={redirectToFeishu}>
-          重新跳转飞书登录
-        </button>
+        <p className={styles.subtitle}>请选择登录方式</p>
+
+        <div className={styles.loginMethods}>
+          <button className={styles.methodBtn} onClick={handlePasswordLogin}>
+            <div className={styles.methodIcon}>📧</div>
+            <div className={styles.methodText}>
+              <div className={styles.methodTitle}>邮箱密码登录</div>
+              <div className={styles.methodDesc}>使用企业邮箱登录</div>
+            </div>
+          </button>
+
+          <button className={styles.methodBtn} onClick={redirectToFeishu}>
+            <div className={styles.methodIcon}>📱</div>
+            <div className={styles.methodText}>
+              <div className={styles.methodTitle}>飞书扫码登录</div>
+              <div className={styles.methodDesc}>使用飞书 APP 扫码登录</div>
+            </div>
+          </button>
+        </div>
+
+        {environment === 'external' && (
+          <p className={styles.tip}>
+            💡 提示：在飞书客户端内打开可自动登录
+          </p>
+        )}
+
+        <QRCodeLogin
+          visible={showQRCode}
+          onClose={() => setShowQRCode(false)}
+        />
       </div>
     </div>
   )