子仓库提交

src/components/auth/LoadingScreen.tsx

@@ -0,0 +1,52 @@
+'use client';
+
+import React from 'react';
+import { Loader2 } from 'lucide-react';
+import { SmartFieldBackground } from './SmartFieldBackground';
+
+interface LoadingScreenProps {
+  message?: string;
+  subMessage?: string;
+  variant?: 'default' | 'auth' | 'redirect';
+}
+
+export function LoadingScreen({
+  message,
+  subMessage,
+  variant = 'default'
+}: LoadingScreenProps) {
+  return (
+    <div className="min-h-screen flex items-center justify-center relative overflow-hidden">
+      {/* 智慧大田动态背景 - 使用登录页面相同的背景效果 */}
+      <SmartFieldBackground />
+
+      {/* 主要内容 */}
+      <div className="relative z-10 text-center">
+        {/* 大型加载器 */}
+        <div className="relative inline-block">
+          {/* 外圈 */}
+          <div className="w-32 h-32 border-4 border-green-400/20 rounded-full animate-pulse"></div>
+          {/* 中圈 */}
+          <div className="absolute top-0 left-0 w-32 h-32 border-4 border-green-400/40 rounded-full animate-spin border-t-transparent border-r-transparent"></div>
+          {/* 内圈 */}
+          <div className="absolute top-4 left-4 w-24 h-24 border-4 border-green-400/60 rounded-full animate-spin border-t-transparent border-l-transparent" style={{ animationDirection: 'reverse' }}></div>
+          {/* 中心 */}
+          <div className="absolute top-12 left-12 w-8 h-8 bg-gradient-to-br from-green-400 to-emerald-400 rounded-full animate-pulse shadow-lg shadow-green-500/50">
+            <div className="w-full h-full bg-white rounded-full animate-ping opacity-30"></div>
+          </div>
+          {/* Loader2 */}
+          <div className="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
+            <Loader2 className="w-12 h-12 text-white/80 animate-spin" />
+          </div>
+        </div>
+
+        {/* 加载标题 */}
+        <div className="mt-16">
+          <p className="text-white/90 text-xl font-medium tracking-wide drop-shadow-lg">
+            正在加载智慧农业生产管理系统
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}