feat:引入 TDesign 以及前端初稿

Prototype/js/ai-float-btn.js

@@ -0,0 +1,119 @@
+/**
+ * AI 浮动对话按钮组件
+ * 统一在所有需要的页面使用
+ */
+(function() {
+    // 创建样式
+    const style = document.createElement('style');
+    style.textContent = `
+        .ai-float-btn-container {
+            position: fixed;
+            right: 16px;
+            bottom: 96px;
+            z-index: 999;
+        }
+        
+        .ai-float-btn {
+            width: 56px;
+            height: 56px;
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            cursor: pointer;
+            transition: transform 0.2s ease;
+            position: relative;
+            overflow: hidden;
+            /* 渐变动画背景 */
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #f5576c 75%, #667eea 100%);
+            background-size: 400% 400%;
+            animation: gradientShift 8s ease infinite;
+            box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4);
+        }
+        
+        .ai-float-btn:active {
+            transform: scale(0.95);
+        }
+        
+        .ai-float-btn::before {
+            content: '';
+            position: absolute;
+            inset: 0;
+            background: linear-gradient(145deg, rgba(255,255,255,0.2) 0%, transparent 50%, rgba(0,0,0,0.1) 100%);
+            border-radius: 50%;
+            pointer-events: none;
+        }
+        
+        /* 背景渐变动画 */
+        @keyframes gradientShift {
+            0% { background-position: 0% 50%; }
+            25% { background-position: 50% 100%; }
+            50% { background-position: 100% 50%; }
+            75% { background-position: 50% 0%; }
+            100% { background-position: 0% 50%; }
+        }
+        
+        .ai-float-btn svg {
+            position: relative;
+            z-index: 1;
+        }
+    `;
+    document.head.appendChild(style);
+
+    // 创建按钮DOM
+    function createAIFloatBtn() {
+        const container = document.createElement('div');
+        container.className = 'ai-float-btn-container';
+        
+        const btn = document.createElement('div');
+        btn.className = 'ai-float-btn';
+        
+        // 可爱风格的AI图标 - 小机器人助手
+        btn.innerHTML = `
+            <svg width="30" height="30" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <!-- 机器人头部 -->
+                <rect x="5" y="7" width="14" height="12" rx="4" fill="white"/>
+                
+                <!-- 天线 -->
+                <path d="M12 7V4" stroke="white" stroke-width="2" stroke-linecap="round"/>
+                <circle cx="12" cy="3" r="1.5" fill="white"/>
+                
+                <!-- 眼睛 - 可爱的大眼睛 -->
+                <circle cx="9" cy="11.5" r="2" fill="#667eea"/>
+                <circle cx="15" cy="11.5" r="2" fill="#667eea"/>
+                
+                <!-- 眼睛高光 -->
+                <circle cx="9.5" cy="11" r="0.7" fill="white"/>
+                <circle cx="15.5" cy="11" r="0.7" fill="white"/>
+                
+                <!-- 微笑嘴巴 -->
+                <path d="M9.5 15C10 16 14 16 14.5 15" stroke="#667eea" stroke-width="1.5" stroke-linecap="round"/>
+                
+                <!-- 腮红 -->
+                <circle cx="7" cy="13.5" r="1" fill="#f5a0c0" opacity="0.6"/>
+                <circle cx="17" cy="13.5" r="1" fill="#f5a0c0" opacity="0.6"/>
+                
+                <!-- 耳朵/装饰 -->
+                <rect x="3" y="10" width="2" height="4" rx="1" fill="white"/>
+                <rect x="19" y="10" width="2" height="4" rx="1" fill="white"/>
+            </svg>
+        `;
+        
+        // 点击跳转到聊天页面
+        btn.addEventListener('click', () => {
+            // 可以根据需要修改跳转逻辑
+            window.location.href = 'chat.html';
+        });
+        
+        container.appendChild(btn);
+        document.body.appendChild(container);
+    }
+
+    // 页面加载完成后创建按钮
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', createAIFloatBtn);
+    } else {
+        createAIFloatBtn();
+    }
+})();
+