feat: 智能体发现和收藏功能

- 智能体界面顶部右侧添加搜索按钮（发现智能体）
- 点击进入发现页面，显示所有系统智能体
- 每个智能体显示简介、热度、类别
- 支持添加和收藏按钮
- 添加的智能体自动归类到对应类别
- 智能体界面顶部右侧添加收藏按钮（☆）
- 点击进入收藏夹页面，点击智能体进入对话
- 智能体长按弹出操作菜单（置顶、收藏、删除）
- 置顶、收藏、用户智能体配置持久化存储

www/app.js

@@ -19,30 +19,52 @@ let isLoading = false;
 // 当前页面状态
 let currentPage = 'chats';  // chats | agents | profile
 
-// 智能体数据
+// 系统智能体数据（完整列表）
-let agents = [
+let systemAgents = [
   // 热门智能体
-  { id: 'assistant', name: '通用助手', avatar: '🤖', category: 'hot', desc: '能回答各类问题，帮助写作、分析、解答疑惑', systemPrompt: '你是一个智能助手，能够回答各类问题，帮助用户解决问题。' },
+  { id: 'assistant', name: '通用助手', avatar: '🤖', category: 'hot', desc: '能回答各类问题，帮助写作、分析、解答疑惑', systemPrompt: '你是一个智能助手，能够回答各类问题，帮助用户解决问题。', heat: 9500 },
-  { id: 'writer', name: '写作助手', avatar: '✍️', category: 'hot', desc: '专注于文章写作、文案创作、内容润色', systemPrompt: '你是一个专业的写作助手，擅长各类文章写作、文案创作和内容润色。' },
+  { id: 'writer', name: '写作助手', avatar: '✍️', category: 'hot', desc: '专注于文章写作、文案创作、内容润色', systemPrompt: '你是一个专业的写作助手，擅长各类文章写作、文案创作和内容润色。', heat: 8800 },
-  { id: 'coder', name: '编程助手', avatar: '👨‍💻', category: 'hot', desc: '精通编程语言，解答技术问题，生成代码', systemPrompt: '你是一个专业的编程助手，精通各类编程语言，能够解答技术问题并生成高质量代码。' },
+  { id: 'coder', name: '编程助手', avatar: '👨‍💻', category: 'hot', desc: '精通编程语言，解答技术问题，生成代码', systemPrompt: '你是一个专业的编程助手，精通各类编程语言，能够解答技术问题并生成高质量代码。', heat: 8500 },
-  { id: 'translator', name: '翻译助手', avatar: '🌐', category: 'hot', desc: '多语言翻译，精准表达，文化适配', systemPrompt: '你是一个专业的翻译助手，精通多语言翻译，能够精准表达并适配文化差异。' },
+  { id: 'translator', name: '翻译助手', avatar: '🌐', category: 'hot', desc: '多语言翻译，精准表达，文化适配', systemPrompt: '你是一个专业的翻译助手，精通多语言翻译，能够精准表达并适配文化差异。', heat: 7200 },
   
   // 工作助手
-  { id: 'assistant-work', name: '工作助手', avatar: '💼', category: 'work', desc: '职场问题解答，工作效率提升', systemPrompt: '你是一个工作助手，帮助解决职场问题，提升工作效率。' },
+  { id: 'assistant-work', name: '工作助手', avatar: '💼', category: 'work', desc: '职场问题解答，工作效率提升', systemPrompt: '你是一个工作助手，帮助解决职场问题，提升工作效率。', heat: 5000 },
-  { id: 'ppt', name: 'PPT助手', avatar: '📊', category: 'work', desc: 'PPT内容生成，结构优化，设计建议', systemPrompt: '你是一个PPT助手，擅长PPT内容生成、结构优化和设计建议。' },
+  { id: 'ppt', name: 'PPT助手', avatar: '📊', category: 'work', desc: 'PPT内容生成，结构优化，设计建议', systemPrompt: '你是一个PPT助手，擅长PPT内容生成、结构优化和设计建议。', heat: 4500 },
-  { id: 'excel', name: 'Excel助手', avatar: '📈', category: 'work', desc: 'Excel公式、数据分析、表格优化', systemPrompt: '你是一个Excel助手，精通Excel公式、数据分析和表格优化。' },
+  { id: 'excel', name: 'Excel助手', avatar: '📈', category: 'work', desc: 'Excel公式、数据分析、表格优化', systemPrompt: '你是一个Excel助手，精通Excel公式、数据分析和表格优化。', heat: 4000 },
   
   // 学习助手
-  { id: 'teacher', name: '学习助手', avatar: '📚', category: 'study', desc: '知识讲解，学习方法，考试辅导', systemPrompt: '你是一个学习助手，擅长知识讲解、学习方法指导和考试辅导。' },
+  { id: 'teacher', name: '学习助手', avatar: '📚', category: 'study', desc: '知识讲解，学习方法，考试辅导', systemPrompt: '你是一个学习助手，擅长知识讲解、学习方法指导和考试辅导。', heat: 5500 },
-  { id: 'english', name: '英语助手', avatar: '🔤', category: 'study', desc: '英语学习，语法纠正，口语练习', systemPrompt: '你是一个英语助手，帮助英语学习、语法纠正和口语练习。' },
+  { id: 'english', name: '英语助手', avatar: '🔤', category: 'study', desc: '英语学习，语法纠正，口语练习', systemPrompt: '你是一个英语助手，帮助英语学习、语法纠正和口语练习。', heat: 5000 },
-  { id: 'math', name: '数学助手', avatar: '🔢', category: 'study', desc: '数学解题，公式推导，概念讲解', systemPrompt: '你是一个数学助手，擅长数学解题、公式推导和概念讲解。' },
+  { id: 'math', name: '数学助手', avatar: '🔢', category: 'study', desc: '数学解题，公式推导，概念讲解', systemPrompt: '你是一个数学助手，擅长数学解题、公式推导和概念讲解。', heat: 4500 },
   
   // 生活助手
-  { id: 'health', name: '健康助手', avatar: '🏥', category: 'life', desc: '健康咨询，养生建议，运动指导', systemPrompt: '你是一个健康助手，提供健康咨询、养生建议和运动指导。' },
+  { id: 'health', name: '健康助手', avatar: '🏥', category: 'life', desc: '健康咨询，养生建议，运动指导', systemPrompt: '你是一个健康助手，提供健康咨询、养生建议和运动指导。', heat: 3500 },
-  { id: 'travel', name: '旅行助手', avatar: '✈️', category: 'life', desc: '旅行规划，景点推荐，美食指南', systemPrompt: '你是一个旅行助手，擅长旅行规划、景点推荐和美食指南。' },
+  { id: 'travel', name: '旅行助手', avatar: '✈️', category: 'life', desc: '旅行规划，景点推荐，美食指南', systemPrompt: '你是一个旅行助手，擅长旅行规划、景点推荐和美食指南。', heat: 3200 },
-  { id: 'food', name: '美食助手', avatar: '🍳', category: 'life', desc: '菜谱推荐，烹饪技巧，营养搭配', systemPrompt: '你是一个美食助手，提供菜谱推荐、烹饪技巧和营养搭配建议。' },
+  { id: 'food', name: '美食助手', avatar: '🍳', category: 'life', desc: '菜谱推荐，烹饪技巧，营养搭配', systemPrompt: '你是一个美食助手，提供菜谱推荐、烹饪技巧和营养搭配建议。', heat: 3000 },
 ];
 
+// 用户智能体界面显示的智能体（默认显示热门智能体）
+let agents = [];
+
+// 用户添加的智能体（按类别分组）
+let myAgents = {
+  hot: ['assistant', 'writer', 'coder', 'translator'],
+  work: ['assistant-work', 'ppt', 'excel'],
+  study: ['teacher', 'english', 'math'],
+  life: ['health', 'travel', 'food']
+};
+
+// 收藏的智能体列表
+let favoriteAgents = [];
+
+// 置顶的智能体列表（按类别）
+let pinnedAgents = {
+  hot: [],
+  work: [],
+  study: [],
+  life: []
+};
+
 let currentAgent = null;  // 当前选中的智能体
 
 // 获取使用智能体的对话列表（按时间倒序）
@@ -52,7 +74,7 @@ function getAgentConversationHistory(limit = 5) {
     .sort((a, b) => b.updatedAt - a.updatedAt)  // 按更新时间倒序
     .slice(0, limit)
     .map(conv => {
-      const agent = agents.find(a => a.id === conv.agentId);
+      const agent = systemAgents.find(a => a.id === conv.agentId);
       return {
         ...conv,
         agent: agent
@@ -105,6 +127,27 @@ document.addEventListener('DOMContentLoaded', () => {
     }
   }
   
+  // 加载用户智能体数据
+  const savedMyAgents = localStorage.getItem('myAgents');
+  if (savedMyAgents) {
+    myAgents = JSON.parse(savedMyAgents);
+  }
+  
+  // 加载收藏的智能体
+  const savedFavoriteAgents = localStorage.getItem('favoriteAgents');
+  if (savedFavoriteAgents) {
+    favoriteAgents = JSON.parse(savedFavoriteAgents);
+  }
+  
+  // 加载置顶的智能体
+  const savedPinnedAgents = localStorage.getItem('pinnedAgents');
+  if (savedPinnedAgents) {
+    pinnedAgents = JSON.parse(savedPinnedAgents);
+  }
+  
+  // 根据用户配置更新显示的智能体
+  updateAgentsDisplay();
+  
   // 加载当前页面状态
   const savedPage = localStorage.getItem('currentPage');
   if (savedPage) {
@@ -115,6 +158,39 @@ document.addEventListener('DOMContentLoaded', () => {
   showMainPage();
 });
 
+// 根据用户配置更新显示的智能体
+function updateAgentsDisplay() {
+  agents = [];
+  Object.keys(myAgents).forEach(category => {
+    myAgents[category].forEach(agentId => {
+      const agent = systemAgents.find(a => a.id === agentId);
+      if (agent) {
+        agents.push({
+          ...agent,
+          is_pinned: pinnedAgents[category]?.includes(agentId) || false,
+          is_favorite: favoriteAgents.includes(agentId)
+        });
+      }
+    });
+  });
+}
+
+// 保存用户智能体配置
+function saveMyAgents() {
+  localStorage.setItem('myAgents', JSON.stringify(myAgents));
+  updateAgentsDisplay();
+}
+
+// 保存收藏的智能体
+function saveFavoriteAgents() {
+  localStorage.setItem('favoriteAgents', JSON.stringify(favoriteAgents));
+}
+
+// 保存置顶的智能体
+function savePinnedAgents() {
+  localStorage.setItem('pinnedAgents', JSON.stringify(pinnedAgents));
+}
+
 // ==================== 主页（底部导航栏） ====================
 
 function showMainPage() {
@@ -343,6 +419,7 @@ function bindChatsPageEvents() {
 // ==================== 智能体页面 ====================
 
 function renderAgentsPage() {
+  // 根据用户配置筛选智能体
   const hotAgents = agents.filter(a => a.category === 'hot');
   const workAgents = agents.filter(a => a.category === 'work');
   const studyAgents = agents.filter(a => a.category === 'study');
@@ -352,10 +429,21 @@ function renderAgentsPage() {
   const recentAgentConvos = getAgentConversationHistory(5);
   const totalAgentConvos = conversations.filter(c => c.agentId).length;
   
+  // 是否有收藏的智能体
+  const hasFavorites = favoriteAgents.length > 0;
+  
   return `
     <div class="agents-page">
-      <header class="page-header">
+      <header class="agents-header">
         <h1>智能体</h1>
+        <div class="agents-header-actions">
+          <button class="agents-header-btn" id="agentDiscoverBtn" title="发现智能体">
+            <svg viewBox="0 0 24 24" width="20" height="20"><path fill="currentColor" d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 7 9.5 7 14 9.01 14 9.5 11.99 14 9.5 14z"/></svg>
+          </button>
+          <button class="agents-header-btn favorite-btn ${hasFavorites ? 'has-favorites' : ''}" id="agentFavoriteBtn" title="收藏夹">
+            ${hasFavorites ? '★' : '☆'}
+          </button>
+        </div>
       </header>
       
       <div class="agents-content">
@@ -386,58 +474,60 @@ function renderAgentsPage() {
         ` : ''}
         
         <!-- 热门智能体 -->
+        ${hotAgents.length > 0 ? `
         <div class="agents-section">
           <div class="section-title">🔥 热门智能体</div>
           <div class="agents-grid">
-            ${hotAgents.map(agent => `
+            ${hotAgents.map(agent => renderAgentCard(agent)).join('')}
-              <div class="agent-card" data-id="${agent.id}">
-                <div class="agent-avatar">${agent.avatar}</div>
-                <div class="agent-name">${agent.name}</div>
-                <div class="agent-desc">${agent.desc}</div>
-              </div>
-            `).join('')}
           </div>
         </div>
+        ` : ''}
         
         <!-- 工作助手 -->
+        ${workAgents.length > 0 ? `
         <div class="agents-section">
           <div class="section-title">💼 工作助手</div>
           <div class="agents-grid">
-            ${workAgents.map(agent => `
+            ${workAgents.map(agent => renderAgentCard(agent)).join('')}
-              <div class="agent-card" data-id="${agent.id}">
-                <div class="agent-avatar">${agent.avatar}</div>
-                <div class="agent-name">${agent.name}</div>
-                <div class="agent-desc">${agent.desc}</div>
-              </div>
-            `).join('')}
           </div>
         </div>
+        ` : ''}
         
         <!-- 学习助手 -->
+        ${studyAgents.length > 0 ? `
         <div class="agents-section">
           <div class="section-title">📚 学习助手</div>
           <div class="agents-grid">
-            ${studyAgents.map(agent => `
+            ${studyAgents.map(agent => renderAgentCard(agent)).join('')}
-              <div class="agent-card" data-id="${agent.id}">
-                <div class="agent-avatar">${agent.avatar}</div>
-                <div class="agent-name">${agent.name}</div>
-                <div class="agent-desc">${agent.desc}</div>
-              </div>
-            `).join('')}
           </div>
         </div>
+        ` : ''}
         
         <!-- 生活助手 -->
+        ${lifeAgents.length > 0 ? `
         <div class="agents-section">
           <div class="section-title">🏠 生活助手</div>
           <div class="agents-grid">
-            ${lifeAgents.map(agent => `
+            ${lifeAgents.map(agent => renderAgentCard(agent)).join('')}
-              <div class="agent-card" data-id="${agent.id}">
+          </div>
-                <div class="agent-avatar">${agent.avatar}</div>
+        </div>
-                <div class="agent-name">${agent.name}</div>
+        ` : ''}
-                <div class="agent-desc">${agent.desc}</div>
+      </div>
-              </div>
+      
-            `).join('')}
+      <!-- 智能体操作菜单 -->
+      <div class="agent-action-menu" id="agentActionMenu">
+        <div class="agent-action-menu-content">
+          <div class="agent-action-item" data-action="pin">
+            <svg viewBox="0 0 24 24" width="18" height="18"><path fill="currentColor" d="M16 12V4h1V2H7v2h1v8l-2 2v2h5.2v6h1.6v-6H18v-2l-2-2z"/></svg>
+            <span id="agentPinText">置顶</span>
+          </div>
+          <div class="agent-action-item" data-action="favorite">
+            <svg viewBox="0 0 24 24" width="18" height="18"><path fill="currentColor" d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>
+            <span id="agentFavoriteText">收藏</span>
+          </div>
+          <div class="agent-action-item delete-action" data-action="remove">
+            <svg viewBox="0 0 24 24" width="18" height="18"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>
+            <span>移除</span>
           </div>
         </div>
       </div>
@@ -445,13 +535,52 @@ function renderAgentsPage() {
   `;
 }
 
+// 渲染智能体卡片
+function renderAgentCard(agent) {
+  const pinnedClass = agent.is_pinned ? 'pinned' : '';
+  const favoriteClass = agent.is_favorite ? 'favorite' : '';
+  return `
+    <div class="agent-card ${pinnedClass} ${favoriteClass}" data-id="${agent.id}">
+      ${agent.is_pinned ? '<span class="agent-pin-icon">📌</span>' : ''}
+      ${agent.is_favorite ? '<span class="agent-fav-icon">⭐</span>' : ''}
+      <div class="agent-avatar">${agent.avatar}</div>
+      <div class="agent-name">${agent.name}</div>
+      <div class="agent-desc">${agent.desc}</div>
+    </div>
+  `;
+}
+
 function bindAgentsPageEvents() {
+  // 发现智能体按钮
+  const agentDiscoverBtn = document.getElementById('agentDiscoverBtn');
+  if (agentDiscoverBtn) {
+    agentDiscoverBtn.addEventListener('click', () => {
+      showAgentDiscoverPage();
+    });
+  }
+  
+  // 收藏夹按钮
+  const agentFavoriteBtn = document.getElementById('agentFavoriteBtn');
+  if (agentFavoriteBtn) {
+    agentFavoriteBtn.addEventListener('click', () => {
+      showAgentFavoritePage();
+    });
+  }
+  
   // 智能体卡片点击（新建对话）
   document.querySelectorAll('.agent-card').forEach(card => {
-    card.addEventListener('click', () => {
+    card.addEventListener('click', (e) => {
+      // 如果是长按后的点击，不触发
+      if (card.classList.contains('long-pressed')) {
+        card.classList.remove('long-pressed');
+        return;
+      }
       const id = card.getAttribute('data-id');
       openAgent(id);
     });
+    
+    // 长按事件
+    setupAgentLongPress(card);
   });
   
   // 最近使用对话点击（打开已有对话）
@@ -471,6 +600,511 @@ function bindAgentsPageEvents() {
       showAgentHistoryPage();
     });
   }
+  
+  // 智能体操作菜单事件
+  const agentActionMenu = document.getElementById('agentActionMenu');
+  if (agentActionMenu) {
+    agentActionMenu.addEventListener('click', (e) => {
+      const item = e.target.closest('.agent-action-item');
+      if (item && currentActionAgentId) {
+        const action = item.getAttribute('data-action');
+        handleAgentAction(action, currentActionAgentId);
+        hideAgentActionMenu();
+      }
+    });
+    
+    // 点击其他地方关闭菜单
+    document.addEventListener('click', (e) => {
+      if (agentActionMenu.classList.contains('show') && !agentActionMenu.contains(e.target)) {
+        hideAgentActionMenu();
+      }
+    });
+  }
+}
+
+// 当前操作的智能体ID
+let currentActionAgentId = null;
+
+// 智能体长按事件
+function setupAgentLongPress(card) {
+  let longPressTimer = null;
+  
+  card.addEventListener('touchstart', (e) => {
+    longPressTimer = setTimeout(() => {
+      currentActionAgentId = card.getAttribute('data-id');
+      card.classList.add('long-pressed');
+      showAgentActionMenu(currentActionAgentId);
+    }, 500);
+  });
+  
+  card.addEventListener('touchend', () => {
+    if (longPressTimer) {
+      clearTimeout(longPressTimer);
+      longPressTimer = null;
+    }
+  });
+  
+  card.addEventListener('touchmove', () => {
+    if (longPressTimer) {
+      clearTimeout(longPressTimer);
+      longPressTimer = null;
+    }
+  });
+  
+  // 鼠标长按（PC端）
+  card.addEventListener('mousedown', (e) => {
+    longPressTimer = setTimeout(() => {
+      currentActionAgentId = card.getAttribute('data-id');
+      card.classList.add('long-pressed');
+      showAgentActionMenu(currentActionAgentId);
+    }, 500);
+  });
+  
+  card.addEventListener('mouseup', () => {
+    if (longPressTimer) {
+      clearTimeout(longPressTimer);
+      longPressTimer = null;
+    }
+  });
+  
+  card.addEventListener('mouseleave', () => {
+    if (longPressTimer) {
+      clearTimeout(longPressTimer);
+      longPressTimer = null;
+    }
+  });
+}
+
+// 显示智能体操作菜单
+function showAgentActionMenu(agentId) {
+  const agentActionMenu = document.getElementById('agentActionMenu');
+  const agent = systemAgents.find(a => a.id === agentId);
+  const displayAgent = agents.find(a => a.id === agentId);
+  if (!agentActionMenu || !displayAgent) return;
+  
+  // 更新按钮文字
+  const pinText = document.getElementById('agentPinText');
+  const favoriteText = document.getElementById('agentFavoriteText');
+  if (pinText) {
+    pinText.textContent = displayAgent.is_pinned ? '取消置顶' : '置顶';
+  }
+  if (favoriteText) {
+    favoriteText.textContent = displayAgent.is_favorite ? '取消收藏' : '收藏';
+  }
+  
+  agentActionMenu.classList.add('show');
+}
+
+// 隐藏智能体操作菜单
+function hideAgentActionMenu() {
+  const agentActionMenu = document.getElementById('agentActionMenu');
+  if (agentActionMenu) {
+    agentActionMenu.classList.remove('show');
+  }
+  currentActionAgentId = null;
+}
+
+// 处理智能体操作
+function handleAgentAction(action, agentId) {
+  const agent = systemAgents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  switch (action) {
+    case 'pin':
+      toggleAgentPin(agentId);
+      break;
+    case 'favorite':
+      toggleAgentFavorite(agentId);
+      break;
+    case 'remove':
+      removeAgentFromMyAgents(agentId);
+      break;
+  }
+  
+  // 刷新页面
+  switchPage('agents');
+}
+
+// 置顶/取消置顶智能体
+function toggleAgentPin(agentId) {
+  const agent = agents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  const category = agent.category;
+  
+  if (pinnedAgents[category]?.includes(agentId)) {
+    // 取消置顶
+    pinnedAgents[category] = pinnedAgents[category].filter(id => id !== agentId);
+    agent.is_pinned = false;
+    showToast('已取消置顶');
+  } else {
+    // 置顶
+    if (!pinnedAgents[category]) {
+      pinnedAgents[category] = [];
+    }
+    pinnedAgents[category].push(agentId);
+    agent.is_pinned = true;
+    showToast('已置顶');
+  }
+  
+  savePinnedAgents();
+  saveMyAgents();  // 更新显示
+}
+
+// 收藏/取消收藏智能体
+function toggleAgentFavorite(agentId) {
+  const agent = agents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  if (favoriteAgents.includes(agentId)) {
+    // 取消收藏
+    favoriteAgents = favoriteAgents.filter(id => id !== agentId);
+    agent.is_favorite = false;
+    showToast('已取消收藏');
+  } else {
+    // 收藏
+    favoriteAgents.push(agentId);
+    agent.is_favorite = true;
+    showToast('已收藏');
+  }
+  
+  saveFavoriteAgents();
+  saveMyAgents();  // 更新显示
+}
+
+// 从用户智能体列表移除
+function removeAgentFromMyAgents(agentId) {
+  const agent = systemAgents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  const category = agent.category;
+  
+  // 从对应类别移除
+  if (myAgents[category]) {
+    myAgents[category] = myAgents[category].filter(id => id !== agentId);
+  }
+  
+  // 同时取消置顶
+  if (pinnedAgents[category]) {
+    pinnedAgents[category] = pinnedAgents[category].filter(id => id !== agentId);
+  }
+  
+  // 同时取消收藏
+  if (favoriteAgents.includes(agentId)) {
+    favoriteAgents = favoriteAgents.filter(id => id !== agentId);
+  }
+  
+  saveMyAgents();
+  savePinnedAgents();
+  saveFavoriteAgents();
+  showToast('已移除');
+}
+
+// ==================== 智能体发现页面 ====================
+
+function showAgentDiscoverPage() {
+  // 按热度排序所有系统智能体
+  const sortedAgents = [...systemAgents].sort((a, b) => b.heat - a.heat);
+  
+  // 分类显示
+  const hotAgents = systemAgents.filter(a => a.category === 'hot');
+  const workAgents = systemAgents.filter(a => a.category === 'work');
+  const studyAgents = systemAgents.filter(a => a.category === 'study');
+  const lifeAgents = systemAgents.filter(a => a.category === 'life');
+  
+  const discoverHtml = `
+    <div class="agent-discover-page">
+      <header class="discover-header">
+        <button class="back-btn-white" id="discoverBackBtn">
+          <svg viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
+        </button>
+        <h1>发现智能体</h1>
+      </header>
+      
+      <div class="discover-content">
+        <!-- 搜索栏 -->
+        <div class="discover-search">
+          <svg viewBox="0 0 24 24" width="20" height="20"><path fill="currentColor" d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 7 9.5 7 14 9.01 14 9.5 11.99 14 9.5 14z"/></svg>
+          <input type="text" id="discoverSearchInput" placeholder="搜索智能体名称或描述...">
+        </div>
+        
+        <!-- 热门智能体 -->
+        <div class="discover-section">
+          <div class="discover-section-title">🔥 热门智能体</div>
+          <div class="discover-grid" id="discoverHotGrid">
+            ${hotAgents.map(agent => renderDiscoverCard(agent)).join('')}
+          </div>
+        </div>
+        
+        <!-- 工作助手 -->
+        <div class="discover-section">
+          <div class="discover-section-title">💼 工作助手</div>
+          <div class="discover-grid" id="discoverWorkGrid">
+            ${workAgents.map(agent => renderDiscoverCard(agent)).join('')}
+          </div>
+        </div>
+        
+        <!-- 学习助手 -->
+        <div class="discover-section">
+          <div class="discover-section-title">📚 学习助手</div>
+          <div class="discover-grid" id="discoverStudyGrid">
+            ${studyAgents.map(agent => renderDiscoverCard(agent)).join('')}
+          </div>
+        </div>
+        
+        <!-- 生活助手 -->
+        <div class="discover-section">
+          <div class="discover-section-title">🏠 生活助手</div>
+          <div class="discover-grid" id="discoverLifeGrid">
+            ${lifeAgents.map(agent => renderDiscoverCard(agent)).join('')}
+          </div>
+        </div>
+      </div>
+    </div>
+  `;
+  
+  appContainer.innerHTML = discoverHtml;
+  
+  // 绑定返回按钮
+  const backBtn = document.getElementById('discoverBackBtn');
+  if (backBtn) {
+    backBtn.addEventListener('click', () => {
+      showMainPage();
+    });
+  }
+  
+  // 绑定搜索
+  const searchInput = document.getElementById('discoverSearchInput');
+  if (searchInput) {
+    searchInput.addEventListener('input', (e) => {
+      const keyword = e.target.value.trim().toLowerCase();
+      filterDiscoverAgents(keyword);
+    });
+  }
+  
+  // 绑定添加/收藏按钮
+  bindDiscoverCardEvents();
+}
+
+// 渲染发现页面智能体卡片
+function renderDiscoverCard(agent) {
+  const isAdded = myAgents[agent.category]?.includes(agent.id);
+  const isFavorite = favoriteAgents.includes(agent.id);
+  
+  // 格式化热度显示
+  let heatDisplay = '';
+  if (agent.heat >= 9000) {
+    heatDisplay = '🔥🔥🔥';
+  } else if (agent.heat >= 6000) {
+    heatDisplay = '🔥🔥';
+  } else if (agent.heat >= 3000) {
+    heatDisplay = '🔥';
+  } else {
+    heatDisplay = `${Math.floor(agent.heat / 1000)}k`;
+  }
+  
+  return `
+    <div class="discover-card" data-id="${agent.id}">
+      <div class="discover-card-header">
+        <div class="discover-avatar">${agent.avatar}</div>
+        <div class="discover-card-info">
+          <div class="discover-name">${agent.name}</div>
+          <div class="discover-meta">
+            <span class="discover-category">${getCategoryLabel(agent.category)}</span>
+            <span class="discover-heat">${heatDisplay}</span>
+          </div>
+        </div>
+      </div>
+      <div class="discover-desc">${agent.desc}</div>
+      <div class="discover-actions">
+        <button class="discover-action-btn add-btn ${isAdded ? 'added' : ''}" data-id="${agent.id}" data-action="add">
+          ${isAdded ? '已添加' : '+ 添加'}
+        </button>
+        <button class="discover-action-btn favorite-btn ${isFavorite ? 'favorited' : ''}" data-id="${agent.id}" data-action="favorite">
+          ${isFavorite ? '★ 已收藏' : '☆ 收藏'}
+        </button>
+      </div>
+    </div>
+  `;
+}
+
+// 获取类别标签
+function getCategoryLabel(category) {
+  const labels = {
+    hot: '热门',
+    work: '工作',
+    study: '学习',
+    life: '生活'
+  };
+  return labels[category] || category;
+}
+
+// 搜索过滤发现页面智能体
+function filterDiscoverAgents(keyword) {
+  if (!keyword) {
+    // 显示所有
+    showDiscoverSection('hot', systemAgents.filter(a => a.category === 'hot'));
+    showDiscoverSection('work', systemAgents.filter(a => a.category === 'work'));
+    showDiscoverSection('study', systemAgents.filter(a => a.category === 'study'));
+    showDiscoverSection('life', systemAgents.filter(a => a.category === 'life'));
+    return;
+  }
+  
+  // 搜索所有智能体
+  const filtered = systemAgents.filter(agent => 
+    agent.name.toLowerCase().includes(keyword) ||
+    agent.desc.toLowerCase().includes(keyword)
+  );
+  
+  // 显示搜索结果
+  showDiscoverSection('hot', filtered.filter(a => a.category === 'hot'));
+  showDiscoverSection('work', filtered.filter(a => a.category === 'work'));
+  showDiscoverSection('study', filtered.filter(a => a.category === 'study'));
+  showDiscoverSection('life', filtered.filter(a => a.category === 'life'));
+}
+
+// 显示发现页面某个类别的智能体
+function showDiscoverSection(category, agents) {
+  const gridId = `discover${category.charAt(0).toUpperCase() + category.slice(1)}Grid`;
+  const grid = document.getElementById(gridId);
+  if (grid) {
+    grid.innerHTML = agents.map(agent => renderDiscoverCard(agent)).join('');
+    bindDiscoverCardEvents();
+  }
+}
+
+// 绑定发现页面卡片按钮事件
+function bindDiscoverCardEvents() {
+  document.querySelectorAll('.discover-action-btn').forEach(btn => {
+    btn.addEventListener('click', (e) => {
+      e.stopPropagation();
+      const agentId = btn.getAttribute('data-id');
+      const action = btn.getAttribute('data-action');
+      
+      if (action === 'add') {
+        addAgentToMyAgents(agentId);
+        btn.classList.toggle('added');
+        btn.textContent = btn.classList.contains('added') ? '已添加' : '+ 添加';
+      } else if (action === 'favorite') {
+        toggleAgentFavoriteFromDiscover(agentId);
+        btn.classList.toggle('favorited');
+        btn.textContent = btn.classList.contains('favorited') ? '★ 已收藏' : '☆ 收藏';
+      }
+    });
+  });
+}
+
+// 添加智能体到用户列表
+function addAgentToMyAgents(agentId) {
+  const agent = systemAgents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  // 检查是否已添加
+  if (myAgents[agent.category]?.includes(agentId)) {
+    showToast('已添加过该智能体');
+    return;
+  }
+  
+  // 添加到对应类别
+  if (!myAgents[agent.category]) {
+    myAgents[agent.category] = [];
+  }
+  myAgents[agent.category].push(agentId);
+  
+  saveMyAgents();
+  showToast(`已添加 ${agent.name}`);
+}
+
+// 从发现页面收藏智能体
+function toggleAgentFavoriteFromDiscover(agentId) {
+  const agent = systemAgents.find(a => a.id === agentId);
+  if (!agent) return;
+  
+  if (favoriteAgents.includes(agentId)) {
+    favoriteAgents = favoriteAgents.filter(id => id !== agentId);
+    showToast('已取消收藏');
+  } else {
+    favoriteAgents.push(agentId);
+    showToast('已收藏');
+    
+    // 如果没有添加到用户列表，自动添加
+    if (!myAgents[agent.category]?.includes(agentId)) {
+      addAgentToMyAgents(agentId);
+    }
+  }
+  
+  saveFavoriteAgents();
+}
+
+// ==================== 智能体收藏夹页面 ====================
+
+function showAgentFavoritePage() {
+  // 获取收藏的智能体详情
+  const favoriteAgentsList = favoriteAgents.map(id => {
+    const agent = systemAgents.find(a => a.id === id);
+    return agent ? { ...agent, is_favorite: true } : null;
+  }).filter(a => a);
+  
+  const favoriteHtml = `
+    <div class="agent-favorite-page">
+      <header class="favorite-header">
+        <button class="back-btn-white" id="favoriteBackBtn">
+          <svg viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
+        </button>
+        <h1>收藏夹</h1>
+      </header>
+      
+      <div class="favorite-content">
+        ${favoriteAgentsList.length === 0 
+          ? '<div class="empty-favorites"><div class="empty-icon">⭐</div><p>暂无收藏的智能体</p><p class="empty-tip">点击右上角搜索按钮发现更多智能体</p></div>'
+          : `
+            <div class="favorite-grid">
+              ${favoriteAgentsList.map(agent => `
+                <div class="favorite-agent-card" data-id="${agent.id}">
+                  <div class="favorite-agent-avatar">${agent.avatar}</div>
+                  <div class="favorite-agent-name">${agent.name}</div>
+                  <div class="favorite-agent-desc">${agent.desc}</div>
+                  <button class="favorite-agent-unfav" data-id="${agent.id}" title="取消收藏">☆</button>
+                </div>
+              `).join('')}
+            </div>
+          `}
+      </div>
+    </div>
+  `;
+  
+  appContainer.innerHTML = favoriteHtml;
+  
+  // 绑定返回按钮
+  const backBtn = document.getElementById('favoriteBackBtn');
+  if (backBtn) {
+    backBtn.addEventListener('click', () => {
+      showMainPage();
+    });
+  }
+  
+  // 绑定智能体卡片点击（进入对话）
+  document.querySelectorAll('.favorite-agent-card').forEach(card => {
+    card.addEventListener('click', (e) => {
+      // 如果点击的是取消收藏按钮，不进入对话
+      if (e.target.classList.contains('favorite-agent-unfav')) {
+        return;
+      }
+      const agentId = card.getAttribute('data-id');
+      openAgent(agentId);
+    });
+  });
+  
+  // 绑定取消收藏按钮
+  document.querySelectorAll('.favorite-agent-unfav').forEach(btn => {
+    btn.addEventListener('click', (e) => {
+      e.stopPropagation();
+      const agentId = btn.getAttribute('data-id');
+      toggleAgentFavorite(agentId);
+      // 刷新收藏夹页面
+      showAgentFavoritePage();
+    });
+  });
 }
 
 // ==================== 我的页面 ====================
@@ -504,7 +1138,7 @@ function renderProfilePage() {
         </div>
         
         <div class="profile-footer">
-          <p>AI助手 v2.8.0</p>
+          <p>AI助手 v3.0.0</p>
           <p>基于智谱 GLM-4.5-Air</p>
         </div>
       </div>
@@ -582,7 +1216,7 @@ function showAgentHistoryPage() {
 
 // 打开智能体对话
 function openAgent(agentId) {
-  currentAgent = agents.find(a => a.id === agentId);
+  currentAgent = systemAgents.find(a => a.id === agentId);
   if (!currentAgent) return;
   
   // 创建新对话并设置智能体

www/index.html

@@ -8,12 +8,12 @@
   <meta http-equiv="Pragma" content="no-cache">
   <meta http-equiv="Expires" content="0">
   <title>AI助手</title>
-  <link rel="stylesheet" href="style.css?v=3.1.3">
+  <link rel="stylesheet" href="style.css?v=3.0.0">
   <link rel="manifest" href="manifest.json">
 </head>
 <body>
   <div id="app"></div>
-  <script src="marked.min.js?v=3.1.3"></script>
+  <script src="marked.min.js?v=3.0.0"></script>
-  <script src="app.js?v=3.1.3"></script>
+  <script src="app.js?v=3.0.0"></script>
 </body>
 </html>

www/style.css

@@ -167,6 +167,57 @@ body {
   height: 100%;
 }
 
+.agents-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, var(--primary) 0%, #764ba2 100%);
+  color: white;
+}
+
+.agents-header h1 {
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.agents-header-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.agents-header-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: rgba(255,255,255,0.95);
+  border: none;
+  border-radius: 50%;
+  color: var(--primary);
+  cursor: pointer;
+  transition: all 0.25s ease;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+  font-size: 18px;
+}
+
+.agents-header-btn:hover {
+  transform: scale(1.08);
+  box-shadow: 0 4px 16px rgba(102,126,234,0.4);
+  color: #5a67d8;
+}
+
+.agents-header-btn.favorite-btn {
+  font-size: 20px;
+  font-weight: bold;
+}
+
+.agents-header-btn.favorite-btn.has-favorites {
+  color: #f59e0b;
+}
+
 .agents-content {
   flex: 1;
   padding: 16px;
@@ -223,6 +274,7 @@ body {
   border-radius: 12px;
   cursor: pointer;
   transition: all 0.2s;
+  position: relative;
 }
 
 .agent-card:hover {
@@ -231,6 +283,31 @@ body {
   transform: translateY(-2px);
 }
 
+.agent-card.pinned {
+  border-color: var(--primary);
+  background: rgba(102, 126, 234, 0.08);
+  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
+}
+
+.agent-card.favorite {
+  border-color: #f59e0b;
+  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.2);
+}
+
+.agent-pin-icon {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  font-size: 14px;
+}
+
+.agent-fav-icon {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  font-size: 14px;
+}
+
 .agent-avatar {
   font-size: 32px;
   margin-bottom: 8px;
@@ -249,6 +326,369 @@ body {
   text-align: center;
 }
 
+/* 智能体操作菜单 */
+.agent-action-menu {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: transparent;
+  display: none;
+  z-index: 1000;
+}
+
+.agent-action-menu.show {
+  display: block;
+}
+
+.agent-action-menu-content {
+  background: white;
+  border-radius: 16px 16px 0 0;
+  padding: 16px;
+  box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
+  animation: slideUp 0.2s ease;
+}
+
+.agent-action-item {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 14px 16px;
+  border-radius: 10px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.agent-action-item:hover {
+  background: rgba(102, 126, 234, 0.1);
+}
+
+.agent-action-item svg {
+  color: var(--primary);
+}
+
+.agent-action-item span {
+  font-size: 16px;
+  color: var(--text-color);
+}
+
+.agent-action-item.delete-action svg,
+.agent-action-item.delete-action span {
+  color: #e53e3e;
+}
+
+.agent-action-item.delete-action:hover {
+  background: rgba(229, 62, 62, 0.1);
+}
+
+/* ==================== 智能体发现页面 ==================== */
+
+.agent-discover-page {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  height: 100dvh;
+  background: #f5f5f5;
+}
+
+.discover-header {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, var(--primary) 0%, #764ba2 100%);
+  color: white;
+}
+
+.discover-header h1 {
+  font-size: 18px;
+  font-weight: 600;
+  margin-left: 12px;
+}
+
+.back-btn-white {
+  background: transparent;
+  border: none;
+  color: white;
+  padding: 8px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+}
+
+.discover-content {
+  flex: 1;
+  padding: 16px;
+  overflow-y: auto;
+}
+
+.discover-search {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px 16px;
+  background: white;
+  border: 1px solid var(--border-color);
+  border-radius: 12px;
+  margin-bottom: 16px;
+}
+
+.discover-search svg {
+  color: var(--text-light);
+}
+
+.discover-search input {
+  flex: 1;
+  font-size: 16px;
+  border: none;
+  outline: none;
+  background: transparent;
+}
+
+.discover-section {
+  margin-bottom: 24px;
+}
+
+.discover-section-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text-color);
+  margin-bottom: 12px;
+}
+
+.discover-grid {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.discover-card {
+  display: flex;
+  flex-direction: column;
+  padding: 16px;
+  background: white;
+  border: 1px solid var(--border-color);
+  border-radius: 12px;
+  transition: all 0.2s;
+}
+
+.discover-card:hover {
+  border-color: var(--primary);
+  background: rgba(102, 126, 234, 0.05);
+}
+
+.discover-card-header {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 8px;
+}
+
+.discover-avatar {
+  font-size: 32px;
+}
+
+.discover-card-info {
+  flex: 1;
+}
+
+.discover-name {
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text-color);
+}
+
+.discover-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-top: 4px;
+}
+
+.discover-category {
+  font-size: 12px;
+  color: var(--primary);
+  background: rgba(102, 126, 234, 0.1);
+  padding: 2px 8px;
+  border-radius: 4px;
+}
+
+.discover-heat {
+  font-size: 12px;
+  color: #f59e0b;
+}
+
+.discover-desc {
+  font-size: 14px;
+  color: var(--text-light);
+  margin-bottom: 12px;
+}
+
+.discover-actions {
+  display: flex;
+  gap: 8px;
+}
+
+.discover-action-btn {
+  flex: 1;
+  padding: 8px 12px;
+  border: 1px solid var(--border-color);
+  border-radius: 8px;
+  font-size: 14px;
+  color: var(--text-light);
+  background: white;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.discover-action-btn:hover {
+  border-color: var(--primary);
+  color: var(--primary);
+}
+
+.discover-action-btn.add-btn {
+  border-color: var(--primary);
+  color: var(--primary);
+}
+
+.discover-action-btn.add-btn:hover {
+  background: var(--primary);
+  color: white;
+}
+
+.discover-action-btn.add-btn.added {
+  background: rgba(102, 126, 234, 0.1);
+  color: var(--primary);
+  border-color: var(--primary);
+}
+
+.discover-action-btn.favorite-btn {
+  border-color: #f59e0b;
+  color: #f59e0b;
+}
+
+.discover-action-btn.favorite-btn:hover {
+  background: #f59e0b;
+  color: white;
+}
+
+.discover-action-btn.favorite-btn.favorited {
+  background: #f59e0b;
+  color: white;
+}
+
+/* ==================== 智能体收藏夹页面 ==================== */
+
+.agent-favorite-page {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  height: 100dvh;
+  background: #f5f5f5;
+}
+
+.favorite-header {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  background: linear-gradient(135deg, var(--primary) 0%, #764ba2 100%);
+  color: white;
+}
+
+.favorite-header h1 {
+  font-size: 18px;
+  font-weight: 600;
+  margin-left: 12px;
+}
+
+.favorite-content {
+  flex: 1;
+  padding: 16px;
+  overflow-y: auto;
+}
+
+.empty-favorites {
+  text-align: center;
+  padding: 60px 20px;
+}
+
+.empty-icon {
+  font-size: 48px;
+  margin-bottom: 16px;
+  color: #f59e0b;
+}
+
+.empty-favorites p {
+  color: var(--text-light);
+  margin: 8px 0;
+}
+
+.empty-favorites .empty-tip {
+  font-size: 14px;
+  color: var(--primary);
+}
+
+.favorite-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 12px;
+}
+
+.favorite-agent-card {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 16px;
+  background: white;
+  border: 1px solid #f59e0b;
+  border-radius: 12px;
+  cursor: pointer;
+  transition: all 0.2s;
+  position: relative;
+  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.15);
+}
+
+.favorite-agent-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 16px rgba(245, 158, 11, 0.25);
+}
+
+.favorite-agent-avatar {
+  font-size: 32px;
+  margin-bottom: 8px;
+}
+
+.favorite-agent-name {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text-color);
+  margin-bottom: 4px;
+}
+
+.favorite-agent-desc {
+  font-size: 12px;
+  color: var(--text-light);
+  text-align: center;
+}
+
+.favorite-agent-unfav {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  width: 24px;
+  height: 24px;
+  background: transparent;
+  border: none;
+  color: #f59e0b;
+  font-size: 16px;
+  cursor: pointer;
+  opacity: 0.6;
+  transition: opacity 0.2s;
+}
+
+.favorite-agent-unfav:hover {
+  opacity: 1;
+}
+
 /* 最近使用的智能体列表 */
 .recent-agents-list {
   display: flex;