docs: 重构文档结构和组织

- 重新组织docs目录结构，按功能模块分类 - 新增deployment和development目录 - 更新API文档结构 - 添加客户端README文档 - 移除过时的文档文件
2025-12-24 18:04:14 +08:00
parent 032c97a1fc
commit 85d488a508
20 changed files with 2416 additions and 1763 deletions
--- a/client/README.md
+++ b/client/README.md
@@ -0,0 +1,222 @@
+# 🎛️ Whale Town 管理员前端界面
+
+基于 React + Vite + Ant Design 构建的现代化管理员后台界面。
+
+## 🚀 快速开始
+
+### 📋 环境要求
+- Node.js >= 18.0.0
+- pnpm >= 8.0.0
+
+### 🛠️ 安装与运行
+
+```bash
+# 1. 确保后端服务已启动
+cd ..
+pnpm run dev
+
+# 2. 安装前端依赖
+cd client
+pnpm install
+
+# 3. 启动开发服务器
+pnpm run dev
+
+# 4. 访问管理界面
+# 浏览器打开: http://localhost:5173
+```
+
+### 🔑 默认登录信息
+- **用户名**: admin
+- **密码**: Admin123456
+
+## 🎯 核心功能
+
+### 🔐 管理员认证
+- 独立的Token认证系统
+- 安全的登录验证
+- 自动Token刷新
+
+### 👥 用户管理
+- 用户列表查看和搜索
+- 用户状态管理
+- 用户密码重置
+- 分页和排序功能
+
+### 📊 系统监控
+- 实时日志查看
+- 日志文件下载
+- 系统状态监控
+
+### 🎨 界面特性
+- 响应式设计，支持移动端
+- 现代化UI组件
+- 暗色/亮色主题切换
+- 国际化支持
+
+## 🏗️ 技术栈
+
+### 🚀 核心框架
+- **React** `^18.0.0` - 前端UI框架
+- **Vite** `^5.0.0` - 现代化构建工具
+- **TypeScript** `^5.0.0` - 类型安全的JavaScript
+
+### 🎨 UI组件
+- **Ant Design** `^5.0.0` - 企业级UI组件库
+- **Ant Design Icons** - 图标库
+- **CSS Modules** - 样式模块化
+
+### 🔧 开发工具
+- **ESLint** - 代码质量检查
+- **Prettier** - 代码格式化
+- **Husky** - Git钩子管理
+
+### 🌐 HTTP客户端
+- **Axios** - HTTP请求库
+- **React Query** - 数据获取和缓存
+
+## 📁 项目结构
+
+```
+client/
+├── src/
+│   ├── components/          # 通用组件
+│   ├── pages/              # 页面组件
+│   ├── services/           # API服务
+│   ├── utils/              # 工具函数
+│   ├── types/              # TypeScript类型定义
+│   ├── styles/             # 全局样式
+│   ├── App.tsx             # 应用主组件
+│   └── main.tsx            # 应用入口
+├── public/                 # 静态资源
+├── index.html              # HTML模板
+├── vite.config.ts          # Vite配置
+├── tsconfig.json           # TypeScript配置
+└── package.json            # 项目配置
+```
+
+## 🔧 开发命令
+
+```bash
+# 启动开发服务器
+pnpm run dev
+
+# 构建生产版本
+pnpm run build
+
+# 预览生产构建
+pnpm run preview
+
+# 代码检查
+pnpm run lint
+
+# 代码格式化
+pnpm run format
+
+# 类型检查
+pnpm run type-check
+```
+
+## 🌍 环境配置
+
+### 开发环境 (.env.local)
+```bash
+VITE_API_BASE_URL=http://localhost:3000
+VITE_APP_TITLE=Whale Town 管理后台
+```
+
+### 生产环境 (.env.production)
+```bash
+VITE_API_BASE_URL=https://your-api-domain.com
+VITE_APP_TITLE=Whale Town 管理后台
+```
+
+## 🔗 API集成
+
+### 认证接口
+- `POST /admin/auth/login` - 管理员登录
+- 自动Token管理和刷新
+
+### 用户管理接口
+- `GET /admin/users` - 获取用户列表
+- `GET /admin/users/:id` - 获取用户详情
+- `POST /admin/users/:id/reset-password` - 重置用户密码
+- `PUT /admin/users/:id/status` - 修改用户状态
+
+### 系统接口
+- `GET /admin/logs/runtime` - 获取运行日志
+- `GET /admin/logs/archive` - 下载日志归档
+
+## 🎨 界面预览
+
+### 登录页面
+- 简洁的登录表单
+- 输入验证和错误提示
+- 记住登录状态
+
+### 用户管理页面
+- 用户列表表格
+- 搜索和筛选功能
+- 用户状态管理
+- 密码重置操作
+
+### 日志管理页面
+- 实时日志显示
+- 日志级别筛选
+- 日志文件下载
+
+## 🚀 部署指南
+
+### 构建生产版本
+```bash
+# 构建
+pnpm run build
+
+# 构建产物在 dist/ 目录
+```
+
+### 部署到Nginx
+```nginx
+server {
+    listen 80;
+    server_name your-domain.com;
+    
+    location / {
+        root /path/to/client/dist;
+        try_files $uri $uri/ /index.html;
+    }
+    
+    location /api {
+        proxy_pass http://localhost:3000;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+    }
+}
+```
+
+## 🤝 开发规范
+
+### 代码风格
+- 使用TypeScript进行类型检查
+- 遵循ESLint和Prettier规范
+- 组件使用函数式组件和Hooks
+
+### 文件命名
+- 组件文件使用PascalCase：`UserList.tsx`
+- 工具文件使用camelCase：`apiClient.ts`
+- 样式文件使用kebab-case：`user-list.module.css`
+
+### 提交规范
+- 遵循项目Git提交规范
+- 提交前自动运行代码检查
+
+## 📞 技术支持
+
+如有问题，请查看：
+1. [后端API文档](../docs/api/README.md)
+2. [项目架构文档](../docs/ARCHITECTURE.md)
+3. [开发规范指南](../docs/development/)
+
+---
+
+**🎛️ 现代化管理界面，让后台管理更高效！**