From adbc42d7a9f176b6ec6370b97d25e837fe8d28b3 Mon Sep 17 00:00:00 2001 From: hongjli <3117313295@qq.com> Date: 星期一, 07 四月 2025 16:12:13 +0800 Subject: [PATCH] 整体优化 --- src/app/ai-scene/page.tsx | 56 +++++----- src/components/layout/ClientLayoutContent.tsx | 218 +++++++++++++++++++++--------------------- 2 files changed, 138 insertions(+), 136 deletions(-) diff --git a/src/app/ai-scene/page.tsx b/src/app/ai-scene/page.tsx index cfb659c..eded6af 100644 --- a/src/app/ai-scene/page.tsx +++ b/src/app/ai-scene/page.tsx @@ -1,9 +1,9 @@ "use client"; import { useState } from 'react'; -import Sidebar from '@/components/layout/Sidebar'; import Card from '@/components/Card'; import ChatDialog from '@/components/ChatDialog'; +import Navbar from '@/components/layout/Navbar'; const services = [ { @@ -44,34 +44,36 @@ }; return ( - <div className="flex"> - <Sidebar /> - <div className="flex-1 p-6 md:p-8 bg-gradient-to-b from-[var(--ai-surface)] to-white"> - <div className="max-w-7xl mx-auto"> - <div className="mb-8"> - <h1 className="text-3xl font-bold text-[var(--ai-primary)] mb-2"> - AI鍦烘櫙妯℃嫙 - <span className="ml-2 inline-block w-2 h-2 rounded-full bg-[var(--ai-secondary)] animate-pulse"></span> - </h1> - <p className="text-gray-600">閫夋嫨浠ヤ笅鍦烘櫙锛屼綋楠屼汉宸ユ櫤鑳藉浣曡В鍐冲疄闄呬笟鍔¢棶棰�</p> - <div className="h-1 w-24 bg-gradient-to-r from-[var(--ai-secondary)] to-[var(--ai-accent)] mt-4"></div> - </div> - <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> - {services.map((service, index) => ( - <Card - key={index} - {...service} - onClick={() => handleCardClick(service.title, service.chatbotId)} - /> - ))} + <> + <Navbar /> + <div className="min-h-screen pt-16"> + <div className="flex-1 p-6 md:p-8 bg-gradient-to-b from-[var(--ai-surface)] to-white"> + <div className="max-w-7xl mx-auto"> + <div className="mb-8"> + <h1 className="text-3xl font-bold text-[var(--ai-primary)] mb-2"> + AI鍦烘櫙妯℃嫙 + <span className="ml-2 inline-block w-2 h-2 rounded-full bg-[var(--ai-secondary)] animate-pulse"></span> + </h1> + <p className="text-gray-600">閫夋嫨浠ヤ笅鍦烘櫙锛屼綋楠屼汉宸ユ櫤鑳藉浣曡В鍐冲疄闄呬笟鍔¢棶棰�</p> + <div className="h-1 w-24 bg-gradient-to-r from-[var(--ai-secondary)] to-[var(--ai-accent)] mt-4"></div> + </div> + <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> + {services.map((service, index) => ( + <Card + key={index} + {...service} + onClick={() => handleCardClick(service.title, service.chatbotId)} + /> + ))} + </div> </div> </div> + <ChatDialog + isOpen={isChatOpen} + onClose={() => setIsChatOpen(false)} + chatbotId={currentChatbot} + /> </div> - <ChatDialog - isOpen={isChatOpen} - onClose={() => setIsChatOpen(false)} - chatbotId={currentChatbot} - /> - </div> + </> ); } \ No newline at end of file diff --git a/src/components/layout/ClientLayoutContent.tsx b/src/components/layout/ClientLayoutContent.tsx index bdfb1d7..03d308b 100644 --- a/src/components/layout/ClientLayoutContent.tsx +++ b/src/components/layout/ClientLayoutContent.tsx @@ -14,6 +14,7 @@ const pathname = usePathname(); const isLoginPage = pathname === '/login'; const isHomePage = pathname === '/'; + const isAIScenePage = pathname.startsWith('/ai-scene'); useEffect(() => { setIsClient(true); @@ -59,132 +60,131 @@ return ( <div className="animate-fadeIn"> <div className="flex flex-col min-h-screen"> - <Navbar /> - <main className={`flex-1 ${isHomePage ? '' : 'bg-gradient-to-b from-[var(--ai-surface)] to-white'} pt-0 mt-0`}> + {!isLoginPage && <Navbar />} + <main className={`flex-1 ${isHomePage || isAIScenePage ? '' : 'bg-gradient-to-b from-[var(--ai-surface)] to-white'} pt-0 mt-0`}> {children} </main> - <footer className="relative z-20 bg-gradient-to-br from-[#0A1033] via-[#1E2B63] to-[#131C41] text-white py-10 overflow-hidden"> - {/* 绉戞妧鎰熷姩鎬佽儗鏅厓绱� */} - <div className="absolute inset-0 overflow-hidden pointer-events-none"> - {/* 缃戞牸搴曠汗 */} - <div className="absolute inset-0 opacity-5" - style={{ - backgroundImage: 'radial-gradient(circle, rgba(106, 219, 255, 0.3) 1px, transparent 1px)', - backgroundSize: '20px 20px' - }}> - </div> - - {/* 姘村钩鍏夌嚎 */} - <div className="absolute top-1/2 left-0 right-0 h-[1px] bg-gradient-to-r from-transparent via-[#6ADBFF]/40 to-transparent transform -translate-y-1/2"></div> - - {/* 鍨傜洿鍏夌嚎 */} - <div className="absolute left-1/4 top-0 bottom-0 w-[1px] bg-gradient-to-b from-transparent via-[#5E72EB]/30 to-transparent"></div> - <div className="absolute left-3/4 top-0 bottom-0 w-[1px] bg-gradient-to-b from-transparent via-[#FF6A88]/30 to-transparent"></div> - - {/* 閲忓瓙绮掑瓙鐐� - 浣跨敤鏉′欢娓叉煋 */} - {isClient && ( - <> - <div className="absolute top-[20%] left-[10%] w-1 h-1 rounded-full bg-[#6ADBFF]/60 animate-pulse"></div> - <div className="absolute top-[70%] left-[90%] w-1.5 h-1.5 rounded-full bg-[#FF6A88]/60 animate-pulse" style={{animationDelay: '1.5s'}}></div> - <div className="absolute top-[40%] left-[60%] w-1 h-1 rounded-full bg-[#5E72EB]/60 animate-pulse" style={{animationDelay: '0.8s'}}></div> - </> - )} - - {/* 搴曢儴娉㈡氮绾� */} - <div className="absolute bottom-0 w-full h-8 opacity-10"> - <svg className="w-full h-full" viewBox="0 0 1200 30" preserveAspectRatio="none"> - <path d="M0,10 Q150,20 300,10 T600,10 T900,10 T1200,10 V30 H0 Z" fill="url(#footerGradient)"></path> - <defs> - <linearGradient id="footerGradient" x1="0%" y1="0%" x2="100%" y2="0%"> - <stop offset="0%" stopColor="#6ADBFF" /> - <stop offset="50%" stopColor="#5E72EB" /> - <stop offset="100%" stopColor="#6ADBFF" /> - </linearGradient> - </defs> - </svg> - </div> - </div> - - <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> - <div className="grid grid-cols-1 md:grid-cols-3 gap-8"> - <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#6ADBFF]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(106,219,255,0.2)]"> - <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#6ADBFF] to-[#F5A800]">鍏充簬鎴戜滑</h3> - <ul className="space-y-3"> - <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> - 鍏徃浠嬬粛 - </li> - <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> - 鑱旂郴鏂瑰紡 - </li> - <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> - 鍔犲叆鎴戜滑 - </li> - </ul> + {!isLoginPage && ( + <footer className="relative z-20 bg-gradient-to-br from-[#0A1033] via-[#1E2B63] to-[#131C41] text-white py-10 overflow-hidden"> + {/* 绉戞妧鎰熷姩鎬佽儗鏅厓绱� */} + <div className="absolute inset-0 overflow-hidden pointer-events-none"> + {/* 缃戞牸搴曠汗 */} + <div className="absolute inset-0 opacity-5" + style={{ + backgroundImage: 'radial-gradient(circle, rgba(106, 219, 255, 0.3) 1px, transparent 1px)', + backgroundSize: '20px 20px' + }}> </div> - <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#5E72EB]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(94,114,235,0.2)]"> - <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#5E72EB] to-[#F5A800]">浜у搧鏈嶅姟</h3> - <ul className="space-y-3"> - <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> - 鏁板瓧鍛樺伐 - </li> - <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> - 鏅鸿兘瀹㈡湇 - </li> - <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> - APS瑙e喅鏂规 - </li> - </ul> - </div> + {/* 姘村钩鍏夌嚎 */} + <div className="absolute top-1/2 left-0 right-0 h-[1px] bg-gradient-to-r from-transparent via-[#6ADBFF]/40 to-transparent transform -translate-y-1/2"></div> - <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#FF6A88]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(255,106,136,0.2)]"> - <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#FF6A88] to-[#F5A800]">甯姪涓績</h3> - <ul className="space-y-3"> - <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> - 浣跨敤鎸囧崡 - </li> - <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> - 甯歌闂 - </li> - <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> - <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> - 鎶�鏈敮鎸� - </li> - </ul> + {/* 鍨傜洿鍏夌嚎 */} + <div className="absolute left-1/4 top-0 bottom-0 w-[1px] bg-gradient-to-b from-transparent via-[#5E72EB]/30 to-transparent"></div> + <div className="absolute left-3/4 top-0 bottom-0 w-[1px] bg-gradient-to-b from-transparent via-[#FF6A88]/30 to-transparent"></div> + + {/* 閲忓瓙绮掑瓙鐐� - 浣跨敤鏉′欢娓叉煋 */} + {isClient && ( + <> + <div className="absolute top-[20%] left-[10%] w-1 h-1 rounded-full bg-[#6ADBFF]/60 animate-pulse"></div> + <div className="absolute top-[70%] left-[90%] w-1.5 h-1.5 rounded-full bg-[#FF6A88]/60 animate-pulse" style={{animationDelay: '1.5s'}}></div> + <div className="absolute top-[40%] left-[60%] w-1 h-1 rounded-full bg-[#5E72EB]/60 animate-pulse" style={{animationDelay: '0.8s'}}></div> + </> + )} + + {/* 搴曢儴娉㈡氮绾� */} + <div className="absolute bottom-0 w-full h-8 opacity-10"> + <svg className="w-full h-full" viewBox="0 0 1200 30" preserveAspectRatio="none"> + <path d="M0,10 Q150,20 300,10 T600,10 T900,10 T1200,10 V30 H0 Z" fill="url(#footerGradient)"></path> + <defs> + <linearGradient id="footerGradient" x1="0%" y1="0%" x2="100%" y2="0%"> + <stop offset="0%" stopColor="#6ADBFF" /> + <stop offset="50%" stopColor="#5E72EB" /> + <stop offset="100%" stopColor="#FF6A88" /> + </linearGradient> + </defs> + </svg> </div> </div> - <div className="mt-10 pt-6 border-t border-[#6ADBFF]/10 text-center relative"> - {/* 閲忓瓙杩炴帴鐗规晥 */} - <div className="absolute top-0 left-1/3 right-1/3 h-[1px]"> - <div className="relative w-full h-full"> - <div className="absolute inset-0 bg-gradient-to-r from-transparent via-[#6ADBFF] to-transparent"></div> - <div className="absolute top-0 left-1/2 h-6 w-[1px] -translate-x-1/2 -translate-y-1/2 bg-gradient-to-b from-[#6ADBFF] to-transparent opacity-70"></div> + <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> + <div className="grid grid-cols-1 md:grid-cols-3 gap-8"> + <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#6ADBFF]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(106,219,255,0.2)]"> + <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#6ADBFF] to-[#F5A800]">鍏充簬鎴戜滑</h3> + <ul className="space-y-3"> + <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> + 鍏徃浠嬬粛 + </li> + <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> + 鑱旂郴鏂瑰紡 + </li> + <li className="hover:text-[#6ADBFF] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#6ADBFF] rounded-full mr-2 opacity-70"></span> + 鍔犲叆鎴戜滑 + </li> + </ul> + </div> + + <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#5E72EB]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(94,114,235,0.2)]"> + <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#5E72EB] to-[#F5A800]">浜у搧鏈嶅姟</h3> + <ul className="space-y-3"> + <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> + 鏁板瓧鍛樺伐 + </li> + <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> + 鏅鸿兘瀹㈡湇 + </li> + <li className="hover:text-[#5E72EB] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#5E72EB] rounded-full mr-2 opacity-70"></span> + APS瑙e喅鏂规 + </li> + </ul> + </div> + + <div className="backdrop-blur-sm bg-white/5 rounded-lg p-6 border border-[#FF6A88]/10 transition-transform hover:scale-[1.02] hover:shadow-[0_0_15px_rgba(255,106,136,0.2)]"> + <h3 className="text-lg font-semibold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-[#FF6A88] to-[#F5A800]">甯姪涓績</h3> + <ul className="space-y-3"> + <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> + 浣跨敤鎸囧崡 + </li> + <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> + 甯歌闂 + </li> + <li className="hover:text-[#FF6A88] transition-colors cursor-pointer flex items-center"> + <span className="inline-block w-1.5 h-1.5 bg-[#FF6A88] rounded-full mr-2 opacity-70"></span> + 鎶�鏈敮鎸� + </li> + </ul> </div> </div> - {/* 搴曢儴鑴夊啿鎸囩ず鍣� - 浣跨敤鏉′欢娓叉煋 */} - {isClient ? ( + <div className="mt-10 pt-6 border-t border-[#6ADBFF]/10 text-center relative"> + {/* 閲忓瓙杩炴帴鐗规晥 */} + <div className="absolute top-0 left-1/3 right-1/3 h-[1px]"> + <div className="relative w-full h-full"> + <div className="absolute inset-0 bg-gradient-to-r from-transparent via-[#6ADBFF] to-transparent"></div> + <div className="absolute top-0 left-1/2 h-6 w-[1px] -translate-x-1/2 -translate-y-1/2 bg-gradient-to-b from-[#6ADBFF] to-transparent opacity-70"></div> + </div> + </div> + + {/* 搴曢儴鑴夊啿鎸囩ず鍣� */} <div className="flex items-center justify-center mb-4"> <span className="inline-block w-2 h-2 bg-[#6ADBFF] rounded-full mr-3 animate-pulse"></span> <span className="inline-block w-2 h-2 bg-[#5E72EB] rounded-full mx-3 animate-pulse" style={{animationDelay: '0.3s'}}></span> <span className="inline-block w-2 h-2 bg-[#FF6A88] rounded-full ml-3 animate-pulse" style={{animationDelay: '0.6s'}}></span> </div> - ) : ( - <div className="h-4 mb-4"></div> - )} - <p className="text-gray-300 text-sm">漏 2024 甯峰箘鍚涙垚. All rights reserved.</p> + + <p className="text-sm text-gray-400">漏 2024 甯峰箘鍚涙垚. All rights reserved.</p> + </div> </div> - </div> - </footer> + </footer> + )} </div> </div> ); -- Gitblit v1.9.3