# 账户管理系统 - 更新说明 ## 🚀 新增功能 ### 1. 账户上传功能 📤 #### ---- 分割格式(推荐) ``` user1@gmail.com----password123----cookie=abc123----token=xyz789 user2@gmail.com----{"password":"456789","token":"fb_token"} user3@twitter.com----oauth_token----oauth_secret----user_data ``` #### 默认格式(一行一个) ``` user1@gmail.com user2@facebook.com simple_username my_account_id ``` **格式说明:** - **---- 分割格式**: `customId----纯数据内容` - customId: 唯一标识符(第一个----之前) - 数据内容: 后面所有内容都作为纯数据(可包含多个----) - **默认格式**: 整行既作为customId也作为data - **平台和状态**: 在界面上方外部设置,应用到所有上传的账户 **特点:** - 支持 `----` 分割格式:只在第一个 `----` 处分割,后面的所有内容都作为数据 - 支持默认格式:一行一个ID,整行既作为customId也作为data - 第一个字段为唯一ID(customId) - 数据部分可以包含任意格式和多个 `----` 分隔符 - 平台和状态统一在外部设置 #### 其他支持格式 - **制表符分隔**:`platform customId data status` - **逗号分隔**:`platform,customId,data,status` - **JSON格式**:`{"platform":"google","customId":"user@gmail.com","data":"..."}` ### 2. 智能数据源集成 🧠 - **所有者ID**:从后端数据自动获取现有所有者列表,支持下拉选择或手动输入 - **平台选择**:从后端数据自动获取现有平台列表,支持下拉选择或手动输入 ✨ - **状态选择**:从后端数据自动获取现有状态类型,支持下拉选择或手动输入 - **外部统一设置**:平台和状态在界面外部统一设置,应用到所有账户 ✨ - **灵活输入**:所有选择器都支持手动输入自定义值 ### 3. 界面优化 ✨ - **三列布局**:所有者ID、平台、状态并排显示 - **响应式布局**:修复超出背景框问题,使用更大的对话框 - **滚动支持**:内容区域支持滚动,避免内容被截断 - **纯数据输入**:输入框内只需要填写纯粹的账户数据 ### 4. 组件架构 🏗️ ``` components/accounts/ ├── stats-cards.tsx # 统计卡片 ├── account-filters.tsx # 筛选器 ├── batch-operations.tsx # 批量操作 ├── account-upload.tsx # 账户上传 ✨ ├── account-table.tsx # 账户表格 ├── account-details.tsx # 账户详情/编辑 └── index.ts # 导出文件 ``` ## 🎯 使用方法 ### 上传账户 1. 点击页面右上角的"上传账户"按钮 2. 选择或输入所有者ID 3. 设置平台(应用到所有账户) 4. 设置默认状态(应用到所有账户) 5. 选择上传方式: - **批量上传**:粘贴格式化的账户数据 - **单个添加**:手动填写单个账户信息 ### ---- 分割格式示例 ``` john@gmail.com----password123----cookie_data----session_token jane.doe@facebook.com----{"token":"fb_token_12345","user_id":"987654321","refresh_token":"refresh123"} @twitter_user----oauth_token_value----oauth_secret_value----additional_data----more_info simple@example.com----plaintext_password_data complex@example.com----key1=value1----key2=value2----key3=value3----extra_field=data ``` ### 默认格式示例 ``` john@gmail.com jane.doe@facebook.com @twitter_user simple@example.com my_username_123 account_id_456 ``` **解析规则:** - **---- 分割格式**:只在第一个 `----` 处分割 - 第一部分:唯一ID - 第二部分:所有剩余内容作为纯数据(保持原格式) - **默认格式**:整行作为唯一ID,同时也作为data - 平台和状态从外部设置应用 ## 🔧 技术特性 - **类型安全**:完整的TypeScript类型定义 - **组件分离**:每个功能独立组件,易于维护 - **状态管理**:使用自定义Hook管理状态 - **数据验证**:完善的数据格式验证和错误处理 - **用户体验**:加载状态、错误提示、确认对话框 ## 📱 界面特色 - **简洁大气**:使用shadcn/ui组件库,现代化设计 - **单页面操作**:所有功能集中在一个页面,无需跳转 - **批量操作**:支持批量选择、删除、更新 - **智能筛选**:多维度筛选条件 - **详细信息**:完整的账户详情查看和编辑功能