+ {/* Floating Button */}
+
+ {!isOpen && (
+ setIsOpen(true)}
+ className={`fixed bottom-6 right-6 p-4 rounded-full shadow-2xl transition-all duration-300 ${
+ effectiveTheme === 'dark'
+ ? 'bg-gradient-to-r from-tech-blue to-tech-green text-black'
+ : 'bg-gradient-to-r from-blue-600 to-emerald-600 text-white'
+ } hover:shadow-tech-blue/30`}
+ >
+
+ )}
+
+
+ {/* Chat Window */}
+
+ {isOpen && (
+
+ {/* Header */}
+
+ )}
+
+
+ );
+};
+
+export default AIAssistant;
\ No newline at end of file
diff --git a/src/components/EnhancedSearchModal.tsx b/src/components/EnhancedSearchModal.tsx
new file mode 100644
index 0000000..6ab51be
--- /dev/null
+++ b/src/components/EnhancedSearchModal.tsx
@@ -0,0 +1,634 @@
+import React, { useState, useEffect, useRef, useCallback } from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+import {
+ Search, X, Clock, FileText, Book,
+ Package, Building, TrendingUp,
+ Command, ArrowRight, Sparkles,
+ Calendar, Tag, User as UserIcon
+} from 'lucide-react';
+import { useTheme } from '../contexts/ThemeContext';
+import { contentLoader } from '../utils/contentLoader';
+
+interface SearchResult {
+ id: string;
+ title: string;
+ content: string;
+ type: 'blog' | 'article' | 'docs' | 'product' | 'company';
+ category?: string;
+ author?: string;
+ date?: string;
+ url: string;
+ highlights?: string[];
+ relevanceScore: number;
+}
+
+interface EnhancedSearchModalProps {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+const EnhancedSearchModal: React.FC
+
+
+
+
+ {/* Messages Area */}
+ {!isMinimized && (
+ <>
+
+
+
+
+
+
+
+
+
+
+ AI助手
+在线
+
+ setIsMinimized(!isMinimized)}
+ className={`p-1 rounded-lg transition-colors ${
+ effectiveTheme === 'dark'
+ ? 'hover:bg-gray-700 text-gray-400'
+ : 'hover:bg-gray-200 text-gray-600'
+ }`}
+ >
+ {isMinimized ?
+ setIsOpen(false)}
+ className={`p-1 rounded-lg transition-colors ${
+ effectiveTheme === 'dark'
+ ? 'hover:bg-gray-700 text-gray-400'
+ : 'hover:bg-gray-200 text-gray-600'
+ }`}
+ >
+
+
+
+ {messages.map((message) => (
+
+
+ ))}
+
+ {/* Typing Indicator */}
+ {isTyping && (
+
+
+ )}
+
+ {/* Suggestions */}
+ {showSuggestions && messages.length === 1 && (
+
+ handleSuggestionClick(suggestion)}
+ className={`w-full text-left p-3 rounded-lg border transition-all duration-200 text-sm ${
+ effectiveTheme === 'dark'
+ ? 'border-gray-700 hover:border-tech-blue hover:bg-tech-blue/10 text-gray-300'
+ : 'border-gray-200 hover:border-blue-500 hover:bg-blue-50 text-gray-700'
+ }`}
+ >
+
+ ))}
+
+ )}
+
+
+
+
+ {/* Input Area */}
+
+
+
+ {message.sender === 'assistant' && (
+
+
+
+ {message.sender === 'user' && (
+ {message.content}
++ {formatTime(message.timestamp)} +
+
+
+
+
+
+ {[0, 1, 2].map((i) => (
+
+
+
+
+ {suggestion.icon}
+
+ {suggestion.text}
+
+
+
+
+ )}
+
+ setInputValue(e.target.value)}
+ onKeyPress={handleKeyPress}
+ placeholder="输入您的问题..."
+ className={`flex-1 px-3 py-2 rounded-lg border transition-colors ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-700 border-gray-600 text-white placeholder-gray-400 focus:border-tech-blue focus:outline-none'
+ : 'bg-white border-gray-300 text-gray-900 placeholder-gray-500 focus:border-blue-500 focus:outline-none'
+ }`}
+ />
+
+
+
+ + 由AI驱动，仅供参考 +
+
+
+ {/* Header */}
+
+
+
+
+
+ {/* Content */}
+
+
+
+ {/* Category Filters */}
+
+
+
+
+
+
+ {categories.map((category) => (
+ setSelectedCategory(category.id)}
+ className={`flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm font-medium transition-colors whitespace-nowrap ${
+ selectedCategory === category.id
+ ? 'bg-gradient-to-r from-tech-blue to-tech-green text-black'
+ : effectiveTheme === 'dark'
+ ? 'bg-gray-700 text-gray-300 hover:bg-gray-600'
+ : 'bg-gray-100 text-gray-700 hover:bg-gray-200'
+ }`}
+ >
+ {category.icon}
+ {category.label}
+
+ ))}
+
+
+ {isLoading ? (
+
+
+
+ ) : query ? (
+ <>
+ {results.length > 0 ? (
+ + 正在搜索... +
+
+
+ ) : (
+ + 找到 {results.length} 个结果 +
+
+ {results.map((result, index) => (
+ handleResultClick(result)}
+ className={`p-4 rounded-lg cursor-pointer transition-all duration-200 ${
+ effectiveTheme === 'dark'
+ ? 'hover:bg-gray-800 border border-gray-700 hover:border-tech-blue'
+ : 'hover:bg-gray-50 border border-gray-200 hover:border-blue-500'
+ }`}
+ >
+
+ ))}
+
+
+
+ {getResultIcon(result.type)}
+
+
+
+
+
+ {result.category && (
+
+
+
+
+ )}
+
+ ) : (
+
+
+ + 没有找到相关内容 +
++ 试试其他关键词或浏览我们的产品页面 +
+
+ {/* Recent Searches */}
+ {recentSearches.length > 0 && (
+
+ )}
+
+
+ )}
+
+ {/* Quick Links */}
+
+
+
+
+ 清除
+
+
+
+
+
+ {recentSearches.map((search, index) => (
+ handleSearch(search)}
+ className={`px-3 py-1.5 text-sm rounded-lg transition-colors ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-800 text-gray-300 hover:bg-gray-700'
+ : 'bg-gray-100 text-gray-700 hover:bg-gray-200'
+ }`}
+ >
+ {search}
+
+ ))}
+
+
+
+
+
+
+
+
+ handleSearch('智能穿戴设备')}
+ className={`p-4 rounded-lg border cursor-pointer transition-all duration-200 ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-800 border-gray-700 hover:border-tech-blue'
+ : 'bg-gray-50 border-gray-200 hover:border-blue-500'
+ }`}
+ >
+
+
+ handleSearch('AI健康科技')}
+ className={`p-4 rounded-lg border cursor-pointer transition-all duration-200 ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-800 border-gray-700 hover:border-tech-blue'
+ : 'bg-gray-50 border-gray-200 hover:border-blue-500'
+ }`}
+ >
+
+
+ handleSearch('技术文档')}
+ className={`p-4 rounded-lg border cursor-pointer transition-all duration-200 ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-800 border-gray-700 hover:border-tech-blue'
+ : 'bg-gray-50 border-gray-200 hover:border-blue-500'
+ }`}
+ >
+
+
+ handleSearch('关于我们')}
+ className={`p-4 rounded-lg border cursor-pointer transition-all duration-200 ${
+ effectiveTheme === 'dark'
+ ? 'bg-gray-800 border-gray-700 hover:border-tech-blue'
+ : 'bg-gray-50 border-gray-200 hover:border-blue-500'
+ }`}
+ >
+
+
+ + 智能穿戴设备 +
++ 24小时健康监测，医疗级精度 +
++ AI健康科技 +
++ 了解最新技术趋势 +
++ 开发者文档 +
++ API参考和集成指南 +
++ 关于OmniVerse +
++ 公司介绍和团队信息 +
+
+ {/* 加载占位符 */}
+ {!isLoaded && (
+
+ {generatePictureSources()}
+ 
+
+ )}
+
+ {/* 加载进度指示器 */}
+ {!isLoaded && isInView && !hasError && (
+
+ );
+};
+
+export default LazyImage;
\ No newline at end of file
diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx
index 4615fe0..624d7ab 100644
--- a/src/components/Navigation.tsx
+++ b/src/components/Navigation.tsx
@@ -43,15 +43,24 @@ const Navigation: React.FC
+ {placeholder && (
+ 
+ )}
+
+
+ )}
+
+ {/* 错误状态 */}
+ {hasError && (
+
+
+ )}
+
+ {/* 实际图片 */}
+ {isInView && !hasError && (
+
+
+ 图片加载失败
+
+
+
+ )}
+
+
+
+
{
{/* Main Title */}
{
{/* Subtitle */}
{
onClick={() => setIsConsultationOpen(true)}
className="group relative px-8 py-4 bg-gradient-to-r from-tech-blue to-tech-green rounded-lg font-semibold text-dark-bg transition-all duration-300 hover:scale-105 overflow-hidden"
>
-
+