生产管理系统 - 2种角色的登录

crop-x/src/components/auth/AuthContext.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import React, { createContext, useContext, useState, ReactNode } from 'react';
+import { getCurrentUserInfoApiV1AuthMeGet } from '@/lib/api/sdk.gen';
 
 interface User {
   id: string;
@@ -9,6 +10,7 @@ interface User {
   email?: string;
   phone?: string;
   enterpriseId?: string;
+  token?: string;
 }
 
 interface AuthContextType {
@@ -16,6 +18,8 @@ interface AuthContextType {
   login: (user: User) => void;
   logout: () => void;
   isAuthenticated: boolean;
+  loading: boolean;
+  validateUser: () => Promise<void>;
 }
 
 const AuthContext = createContext<AuthContextType | undefined>(undefined);
@@ -26,29 +30,65 @@ interface AuthProviderProps {
 
 export function AuthProvider({ children }: AuthProviderProps) {
   const [user, setUser] = useState<User | null>(null);
+  const [loading, setLoading] = useState(true);
 
   const login = (userData: User) => {
     setUser(userData);
     // 存储到 localStorage
     localStorage.setItem('user', JSON.stringify(userData));
+    setLoading(false);
   };
 
   const logout = () => {
     setUser(null);
     localStorage.removeItem('user');
+    setLoading(false);
   };
 
-  // 初始化时检查 localStorage
-  React.useEffect(() => {
-    const storedUser = localStorage.getItem('user');
-    if (storedUser) {
-      try {
-        setUser(JSON.parse(storedUser));
-      } catch (error) {
-        console.error('Failed to parse stored user data:', error);
-        localStorage.removeItem('user');
+  // 验证当前用户信息
+  const validateUser = async () => {
+    try {
+      const storedUser = localStorage.getItem('user');
+      if (!storedUser) {
+        setLoading(false);
+        return;
       }
+
+      const userData = JSON.parse(storedUser);
+
+      // 使用 SDK 调用 /api/v1/auth/me 验证用户信息
+      const response = await getCurrentUserInfoApiV1AuthMeGet({
+        headers: {
+          'Authorization': `Bearer ${userData.token}`,
+        },
+      });
+
+      if (response.data) {
+        // 更新用户信息（可能包含最新的权限、角色等）
+        setUser({
+          ...userData,
+          ...response.data.data, // 合并最新的用户信息
+        });
+        console.log('✅ 用户验证成功，最新用户信息:', response.data.data);
+      } else {
+        // Token无效，清除用户信息
+        console.warn('⚠️ Token验证失败，清除用户信息');
+        localStorage.removeItem('user');
+        setUser(null);
+      }
+    } catch (error: any) {
+      console.error('❌ 用户验证失败:', error);
+      // 验证失败时也清除用户信息，避免不一致状态
+      localStorage.removeItem('user');
+      setUser(null);
+    } finally {
+      setLoading(false);
     }
+  };
+
+  // 初始化时检查 localStorage并验证用户
+  React.useEffect(() => {
+    validateUser();
   }, []);
 
   const value: AuthContextType = {
@@ -56,6 +96,8 @@ export function AuthProvider({ children }: AuthProviderProps) {
     login,
     logout,
     isAuthenticated: !!user,
+    loading,
+    validateUser, // 暴露验证方法供手动刷新使用
   };
 
   return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;

crop-x/src/components/auth/LoadingScreen.tsx

@@ -0,0 +1,32 @@
+'use client';
+
+import React from 'react';
+import { Loader2 } from 'lucide-react';
+
+interface LoadingScreenProps {
+  message?: string;
+}
+
+export function LoadingScreen({ message = '正在验证用户身份...' }: LoadingScreenProps) {
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-50">
+      <div className="text-center">
+        <div className="inline-flex items-center justify-center w-16 h-16 bg-green-100 rounded-full mb-4">
+          <Loader2 className="w-8 h-8 text-green-600 animate-spin" />
+        </div>
+        <h2 className="text-xl font-semibold text-gray-900 mb-2">智慧农业生产管理系统</h2>
+        <p className="text-gray-600">{message}</p>
+
+        {/* 加载进度条 */}
+        <div className="mt-6 w-64 h-2 bg-gray-200 rounded-full overflow-hidden">
+          <div className="h-full bg-green-600 rounded-full animate-pulse" style={{ width: '60%' }}></div>
+        </div>
+
+        {/* 提示信息 */}
+        <div className="mt-8 text-sm text-gray-500 max-w-md">
+          <p>正在验证您的身份信息，请稍候...</p>
+        </div>
+      </div>
+    </div>
+  );
+}