# 工具管理与数据管理 - 快速上手指南

## 🎉 欢迎使用新功能！

我们刚刚为 MCP 客户端添加了两个重要模块：**工具管理**和**数据管理**。本指南将帮助您快速上手。

---

## 🚀 5 分钟快速开始

### 步骤 1：访问功能
刷新浏览器后，您会在左侧菜单看到：
- 🛠️ **工具管理**
- 📊 **数据管理**

---

## 🛠️ 工具管理 - 快速教程

### 场景 1：添加一个网页搜索工具

1. **点击「添加工具」**

2. **填写基本信息**
   ```
   工具名称: web_search
   显示名称: 网页搜索
   描述: 搜索网页内容并返回相关结果
   ```

3. **配置端点**
   ```
   端点地址: http://localhost:8080/api/search
   ```

4. **设置参数（JSON 格式）**
   ```json
   {
     "query": {
       "type": "string",
       "description": "搜索关键词",
       "required": true
     },
     "limit": {
       "type": "number",
       "description": "返回结果数量",
       "default": 10
     }
   }
   ```

5. **保存并测试**
   - 点击「保存」
   - 点击「测试工具」
   - 输入测试参数：
     ```json
     {
       "query": "Vue 3 教程",
       "limit": 5
     }
     ```
   - 点击「运行测试」

### 场景 2：管理现有工具

**启用/禁用工具**
- 使用卡片右上角的开关

**编辑工具**
- 点击三个点菜单 → 选择「编辑」

**复制配置**
- 点击三个点菜单 → 选择「复制配置」
- 可用于分享或备份

**删除工具**
- 点击三个点菜单 → 选择「删除」

---

## 📊 数据管理 - 快速教程

### 功能 1：查看统计信息
页面顶部显示 4 个关键指标：
- 📝 对话数量
- 💬 消息总数
- 💾 存储使用
- ⏰ 最后活动

### 功能 2：管理对话历史

**查看对话**
1. 在对话列表中找到目标对话
2. 点击眼睛 👁️ 图标
3. 查看完整的消息历史

**搜索对话**
1. 在搜索框输入关键词
2. 系统会搜索：
   - 对话标题
   - 消息内容

**导出单个对话**
1. 点击下载 📥 图标
2. 自动下载 JSON 文件

**删除对话**
1. 点击垃圾桶 🗑️ 图标
2. 确认删除

### 功能 3：数据导出

**导出所有数据**
1. 点击顶部「导出数据」按钮
2. 系统会导出：
   - 所有对话历史
   - 工具配置
   - 模型服务配置
   - 系统设置

### 功能 4：清理数据

**选择性清理**
1. 点击「清理数据」按钮
2. 勾选要清理的类型：
   - ☑️ 对话历史
   - ☑️ 工具配置
   - ☑️ 模型服务
   - ☑️ 系统设置
3. 确认清理

⚠️ **重要提示**：清理操作不可恢复，建议先导出备份！

---

## 💡 实用技巧

### 工具管理技巧

**技巧 1：快速测试**
- 保存工具后立即测试，确保端点可用
- 使用简单的测试参数验证基本功能

**技巧 2：参数模板**
```json
{
  "paramName": {
    "type": "string|number|boolean|object|array",
    "description": "参数说明",
    "required": true,
    "default": "默认值"
  }
}
```

**技巧 3：批量管理**
- 使用「复制配置」功能快速创建相似工具
- 定期导出工具配置作为备份

### 数据管理技巧

**技巧 1：定期备份**
- 每周导出一次数据备份
- 重要对话及时导出

**技巧 2：搜索技巧**
- 搜索关键词会匹配标题和内容
- 使用具体的词语获得更精确的结果

**技巧 3：存储管理**
- 关注存储使用量
- 接近限制时清理旧数据
- LocalStorage 限制约 5-10MB

---

## 🎨 界面说明

### 工具管理界面

```
┌─────────────────────────────────────┐
│  工具管理              [添加工具]  │
├─────────────────────────────────────┤
│  ┌───────────┐  ┌───────────┐      │
│  │ 工具卡片1  │  │ 工具卡片2  │      │
│  │  • 名称    │  │  • 名称    │      │
│  │  • 描述    │  │  • 描述    │      │
│  │  • 状态    │  │  • 状态    │      │
│  │ [测试][编辑]│  │ [测试][编辑]│      │
│  └───────────┘  └───────────┘      │
└─────────────────────────────────────┘
```

### 数据管理界面

```
┌─────────────────────────────────────┐
│  数据管理    [导出数据] [清理数据]  │
├─────────────────────────────────────┤
│  ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐│
│  │对话数 │ │消息数 │ │存储量 │ │活动  ││
│  └──────┘ └──────┘ └──────┘ └──────┘│
├─────────────────────────────────────┤
│  对话历史              [搜索框]     │
│  ┌─────────────────────────────┐   │
│  │ 对话标题                [👁📥🗑]│   │
│  │ 消息预览...                  │   │
│  └─────────────────────────────┘   │
└─────────────────────────────────────┘
```

---

## ❓ 常见问题

### Q1: 工具测试失败怎么办？
**A:** 检查以下几点：
1. 端点地址是否正确
2. 服务器是否正在运行
3. 是否有 CORS 跨域问题
4. 测试参数格式是否正确

### Q2: 对话数据存储在哪里？
**A:** 存储在浏览器的 LocalStorage 中，键名为：
- `mcp-tools` - 工具配置
- `mcp-conversations` - 对话历史
- `model-services` - 模型服务
- `mcp-settings` - 系统设置

### Q3: 数据会丢失吗？
**A:** 
- ✅ 正常使用不会丢失
- ⚠️ 清除浏览器数据会丢失
- ⚠️ 隐私模式关闭后会丢失
- 💡 建议定期导出备份

### Q4: 可以导入数据吗？
**A:** 当前版本暂不支持导入功能，计划在后续版本添加。您可以：
1. 手动复制 JSON 到 LocalStorage
2. 使用浏览器开发工具导入

### Q5: 工具参数配置很复杂怎么办？
**A:** 使用 JSON 编辑器或在线工具验证：
- https://jsonlint.com/
- VS Code 的 JSON 编辑功能

---

## 🔗 相关资源

### 文档
- [完整实现文档](./TOOLS_DATA_IMPLEMENTATION.md)
- [MCP 协议文档](https://modelcontextprotocol.io/)

### 示例工具配置
查看 `TOOLS_DATA_IMPLEMENTATION.md` 中的示例部分

---

## 📞 需要帮助？

如果您遇到问题：
1. 查看浏览器控制台错误信息
2. 导出数据作为问题报告附件
3. 提供详细的操作步骤

---

## 🎯 下一步

现在您已经了解了基本功能，可以：

1. **添加第一个工具** 
   - 从简单的 HTTP 端点开始
   
2. **查看对话历史**
   - 了解您的使用情况

3. **导出备份**
   - 养成定期备份的好习惯

4. **探索更多**
   - 尝试不同的工具配置
   - 测试各种参数组合

---

**祝您使用愉快！** 🎉

如有任何问题或建议，欢迎反馈。

---

*快速指南 v1.0 - 2025-10-14*