Initial commit: Telegram Management System

Full-stack web application for Telegram management - Frontend: Vue 3 + Vben Admin - Backend: NestJS - Features: User management, group broadcast, statistics 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-04 15:37:50 +08:00
commit 237c7802e5
3674 changed files with 525172 additions and 0 deletions
--- a/frontend-vben/apps/web-antd/tests/README.md
+++ b/frontend-vben/apps/web-antd/tests/README.md
@@ -0,0 +1,428 @@
+# 端到端测试指南
+
+这是 Telegram 管理系统的完整端到端测试套件，使用 Playwright 进行自动化测试。
+
+## 🚀 快速开始
+
+### 安装依赖
+
+```bash
+# 安装 Playwright 浏览器
+pnpm test:install
+
+# 或手动安装
+npx playwright install
+```
+
+### 运行测试
+
+```bash
+# 运行所有测试
+pnpm test
+
+# 运行特定测试文件
+pnpm test:auth          # 登录认证测试
+pnpm test:account       # 账号管理测试
+pnpm test:message       # 私信群发测试
+pnpm test:marketing     # 营销中心测试
+pnpm test:permission    # 权限控制测试
+pnpm test:websocket     # WebSocket实时通信测试
+pnpm test:responsive    # 响应式布局测试
+
+# 运行特定浏览器测试
+pnpm test:chrome        # Chrome浏览器
+pnpm test:firefox       # Firefox浏览器
+pnpm test:safari        # Safari浏览器
+pnpm test:mobile        # 移动端测试
+
+# 有头模式运行（显示浏览器界面）
+pnpm test:headed
+
+# 使用测试UI界面
+pnpm test:ui
+
+# 查看测试报告
+pnpm test:report
+```
+
+## 📁 测试文件结构
+
+```
+tests/
+├── e2e/                          # 端到端测试
+│   ├── auth.test.ts             # 登录认证流程测试
+│   ├── account-management.test.ts # 账号管理功能测试
+│   ├── private-message.test.ts   # 私信群发功能测试
+│   ├── marketing-center.test.ts  # 营销中心功能测试
+│   ├── permission-control.test.ts # 权限控制功能测试
+│   ├── websocket-realtime.test.ts # WebSocket实时通信测试
+│   └── responsive-layout.test.ts  # 响应式布局测试
+├── global-setup.ts              # 全局测试设置
+├── global-teardown.ts           # 全局测试清理
+└── README.md                    # 测试指南
+```
+
+## 🧪 测试覆盖范围
+
+### 1. 登录认证测试 (`auth.test.ts`)
+
+**测试功能**：
+
+- ✅ 登录页面显示
+- ✅ 表单验证
+- ✅ 登录流程
+- ✅ 记住密码功能
+- ✅ 语言切换
+- ✅ Token过期处理
+- ✅ 退出登录
+- ✅ 页面刷新状态保持
+- ✅ 多标签页同步
+- ✅ 权限角色测试
+- ✅ 国际化功能
+
+**测试账号**：
+
+```javascript
+// 管理员账号
+admin / 111111;
+
+// 超级管理员
+super_admin / super123456;
+
+// 普通用户
+test_user / test123456;
+```
+
+### 2. 账号管理测试 (`account-management.test.ts`)
+
+**测试功能**：
+
+- ✅ 账号列表显示
+- ✅ 搜索筛选功能
+- ✅ 创建新账号
+- ✅ 表单验证
+- ✅ 编辑账号信息
+- ✅ 查看账号详情
+- ✅ 账号状态切换
+- ✅ 批量操作
+- ✅ 导出功能
+- ✅ 分页功能
+- ✅ 表格排序
+- ✅ 删除账号
+- ✅ 账号导入功能
+
+### 3. 私信群发测试 (`private-message.test.ts`)
+
+**测试功能**：
+
+- ✅ 消息模板管理
+- ✅ 创建消息模板
+- ✅ 模板预览功能
+- ✅ 编辑模板
+- ✅ 变量替换功能
+- ✅ 群发任务管理
+- ✅ 创建群发任务
+- ✅ 任务状态管理
+- ✅ 任务详情页面
+- ✅ 任务暂停恢复
+- ✅ 发送记录查看
+- ✅ 记录搜索筛选
+- ✅ 记录详情查看
+- ✅ 记录导出
+- ✅ 统计图表
+- ✅ 实时监控
+
+### 4. 营销中心测试 (`marketing-center.test.ts`)
+
+**测试功能**：
+
+- ✅ 智能活动管理
+- ✅ 创建营销活动
+- ✅ 活动状态管理
+- ✅ 活动详情页面
+- ✅ 智能推荐功能
+- ✅ 活动复制功能
+- ✅ 客户分析
+- ✅ 客户分群功能
+- ✅ 客户行为分析
+- ✅ 客户价值分析
+- ✅ 客户流失分析
+- ✅ 效果统计
+- ✅ 时间范围筛选
+- ✅ 渠道对比分析
+- ✅ 活动效果对比
+- ✅ 转化漏斗分析
+- ✅ ROI分析
+- ✅ 报告导出
+
+### 5. 权限控制测试 (`permission-control.test.ts`)
+
+**测试功能**：
+
+- ✅ 权限管理页面
+- ✅ 创建新权限
+- ✅ 权限树展开折叠
+- ✅ 权限详情查看
+- ✅ 编辑权限信息
+- ✅ 权限搜索功能
+- ✅ 删除权限
+- ✅ 角色管理页面
+- ✅ 创建新角色
+- ✅ 角色权限分配
+- ✅ 角色状态切换
+- ✅ 角色复制功能
+- ✅ 删除角色
+- ✅ 路由权限验证
+- ✅ 菜单权限过滤
+- ✅ 按钮权限控制
+- ✅ API权限验证
+- ✅ 权限缓存更新
+- ✅ v-permission指令
+
+### 6. WebSocket实时通信测试 (`websocket-realtime.test.ts`)
+
+**测试功能**：
+
+- ✅ WebSocket连接建立
+- ✅ 断线重连机制
+- ✅ 手动重连功能
+- ✅ 连接心跳机制
+- ✅ 系统通知接收
+- ✅ 消息状态更新
+- ✅ 用户在线状态
+- ✅ 任务进度更新
+- ✅ 实时性能指标
+- ✅ 实时日志显示
+- ✅ 告警信息推送
+- ✅ 实时图表更新
+- ✅ 多标签页同步
+
+### 7. 响应式布局测试 (`responsive-layout.test.ts`)
+
+**测试功能**：
+
+- ✅ 桌面端布局
+- ✅ 侧边栏折叠展开
+- ✅ 桌面端表格显示
+- ✅ 平板端布局适配
+- ✅ 平板端表格优化
+- ✅ 平板端搜索表单
+- ✅ 手机端移动导航
+- ✅ 手机端侧边栏抽屉
+- ✅ 手机端卡片布局
+- ✅ 手机端搜索折叠
+- ✅ 手机端表单适配
+- ✅ 大屏幕内容显示
+- ✅ 大屏幕表格列数
+- ✅ 大屏幕仪表盘
+- ✅ 响应式断点测试
+- ✅ 触摸设备交互
+- ✅ 触摸滑动功能
+- ✅ 触摸点击区域
+- ✅ 长按菜单功能
+
+## 🔧 测试配置
+
+### Playwright 配置 (`playwright.config.ts`)
+
+```typescript
+export default defineConfig({
+  testDir: './tests/e2e',
+  fullyParallel: true,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+
+  // 测试报告
+  reporter: [
+    ['html', { outputFolder: 'test-results/html-report' }],
+    ['json', { outputFile: 'test-results/results.json' }],
+    ['junit', { outputFile: 'test-results/results.xml' }],
+    ['line'],
+  ],
+
+  // 支持的浏览器
+  projects: [
+    { name: 'chromium', use: { ...devices['Desktop Chrome'] } },
+    { name: 'firefox', use: { ...devices['Desktop Firefox'] } },
+    { name: 'webkit', use: { ...devices['Desktop Safari'] } },
+    { name: 'Mobile Chrome', use: { ...devices['Pixel 5'] } },
+    { name: 'Mobile Safari', use: { ...devices['iPhone 12'] } },
+    { name: 'Microsoft Edge', use: { ...devices['Desktop Edge'] } },
+  ],
+
+  // 本地开发服务器
+  webServer: {
+    command: 'pnpm dev',
+    port: 5173,
+    reuseExistingServer: !process.env.CI,
+  },
+});
+```
+
+### 测试环境变量
+
+```bash
+# .env.test
+NODE_ENV=test
+VITE_API_URL=http://localhost:3001/api
+VITE_WS_URL=ws://localhost:3001/ws
+```
+
+## 📊 测试报告
+
+测试完成后，报告文件位于：
+
+```
+test-results/
+├── html-report/          # HTML格式测试报告
+├── results.json         # JSON格式测试结果
+├── results.xml          # JUnit格式测试结果
+├── test-summary.json    # 测试摘要
+└── artifacts/           # 测试截图和视频
+```
+
+### 查看测试报告
+
+```bash
+# 查看HTML报告
+pnpm test:report
+
+# 或直接打开
+open test-results/html-report/index.html
+```
+
+## 🐛 调试测试
+
+### 调试模式
+
+```bash
+# 有头模式运行（显示浏览器）
+pnpm test:headed
+
+# 使用调试器
+pnpm test --debug
+
+# 运行特定测试并暂停
+npx playwright test --headed --debug tests/e2e/auth.test.ts
+```
+
+### 生成测试代码
+
+```bash
+# 使用录制器生成测试代码
+npx playwright codegen http://localhost:5173
+```
+
+### 查看测试追踪
+
+```bash
+# 生成追踪文件
+pnpm test --trace on
+
+# 查看追踪
+npx playwright show-trace test-results/trace.zip
+```
+
+## 📝 编写测试
+
+### 基本测试结构
+
+```typescript
+import { test, expect, Page } from '@playwright/test';
+
+test.describe('功能模块测试', () => {
+  test.beforeEach(async ({ page }) => {
+    // 测试前置条件
+    await page.goto('http://localhost:5173');
+    await login(page);
+  });
+
+  test('应该正确显示页面', async ({ page }) => {
+    // 测试步骤
+    await page.click('[data-testid="button"]');
+
+    // 断言
+    await expect(page.locator('.result')).toBeVisible();
+  });
+});
+```
+
+### 最佳实践
+
+1. **使用 data-testid 属性**
+
+   ```html
+   <button data-testid="submit-button">提交</button>
+   ```
+
+2. **等待异步操作完成**
+
+   ```typescript
+   await page.waitForLoadState('networkidle');
+   await page.waitForSelector('[data-testid="content"]');
+   ```
+
+3. **使用页面对象模式**
+   ```typescript
+   class LoginPage {
+     constructor(private page: Page) {}
+
+     async login(username: string, password: string) {
+       await this.page.fill('[data-testid="username"]', username);
+       await this.page.fill('[data-testid="password"]', password);
+       await this.page.click('[data-testid="login-button"]');
+     }
+   }
+   ```
+
+## 🔍 CI/CD 集成
+
+### GitHub Actions 示例
+
+```yaml
+name: E2E Tests
+
+on: [push, pull_request]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Install Playwright
+        run: pnpm test:install
+
+      - name: Run tests
+        run: pnpm test
+
+      - name: Upload test results
+        uses: actions/upload-artifact@v3
+        if: always()
+        with:
+          name: test-results
+          path: test-results/
+```
+
+## 📞 支持
+
+如有问题，请：
+
+1. 查看 [Playwright 官方文档](https://playwright.dev/)
+2. 检查测试日志和错误信息
+3. 联系开发团队
+
+## 📄 更新日志
+
+### v1.0.0
+
+- 初始版本发布
+- 支持所有主要功能模块测试
+- 多浏览器和移动端支持
+- 完整的CI/CD集成