数据中心同步

Moncter/TaskShow/README.md

@@ -0,0 +1,127 @@
+# Task Show
+
+基于 Vue3 + Element Plus + Pinia + TypeScript + Axios 的前端基础工程
+
+## 技术栈
+
+- **Vue 3** - 渐进式 JavaScript 框架
+- **TypeScript** - JavaScript 的超集
+- **Vite** - 下一代前端构建工具
+- **Element Plus** - 基于 Vue 3 的组件库
+- **Pinia** - Vue 的状态管理库
+- **Vue Router** - Vue 官方路由管理器
+- **Axios** - 基于 Promise 的 HTTP 客户端
+
+## 项目结构
+
+```
+TaskShow/
+├── src/
+│   ├── assets/          # 静态资源
+│   ├── components/      # 公共组件
+│   ├── router/          # 路由配置
+│   │   └── index.ts
+│   ├── store/           # Pinia 状态管理
+│   │   └── index.ts
+│   ├── types/           # TypeScript 类型定义
+│   │   └── api.ts
+│   ├── utils/           # 工具函数
+│   │   └── request.ts   # Axios 请求封装
+│   ├── views/           # 页面组件
+│   │   └── Home.vue
+│   ├── App.vue          # 根组件
+│   └── main.ts          # 入口文件
+├── index.html           # HTML 模板
+├── package.json         # 项目配置
+├── tsconfig.json        # TypeScript 配置
+├── vite.config.ts       # Vite 配置
+└── README.md           # 项目说明
+```
+
+## 安装依赖
+
+```bash
+npm install
+# 或
+yarn install
+# 或
+pnpm install
+```
+
+## 开发
+
+```bash
+npm run dev
+# 或
+yarn dev
+# 或
+pnpm dev
+```
+
+## 构建
+
+```bash
+npm run build
+# 或
+yarn build
+# 或
+pnpm build
+```
+
+## 预览构建结果
+
+```bash
+npm run preview
+# 或
+yarn preview
+# 或
+pnpm preview
+```
+
+## 请求封装说明
+
+### 使用方式
+
+```typescript
+import { request } from '@/utils/request'
+
+// GET 请求
+const response = await request.get('/api/users', { id: 1 })
+
+// POST 请求
+const response = await request.post('/api/users', { name: 'John' })
+
+// PUT 请求
+const response = await request.put('/api/users/1', { name: 'Jane' })
+
+// DELETE 请求
+const response = await request.delete('/api/users/1')
+
+// 自定义配置
+const response = await request.get('/api/users', {}, {
+  showLoading: false,  // 不显示 loading
+  showError: false,    // 不显示错误提示
+  timeout: 5000        // 自定义超时时间
+})
+```
+
+### 特性
+
+1. **自动添加 Token**：请求时自动从 store 中获取 token 并添加到请求头
+2. **统一错误处理**：自动处理 HTTP 错误和业务错误
+3. **Loading 提示**：请求时自动显示 loading（可配置）
+4. **错误提示**：请求失败时自动显示错误消息（可配置）
+5. **类型支持**：完整的 TypeScript 类型定义
+
+### 环境变量
+
+在 `.env`、`.env.development` 或 `.env.production` 文件中配置 API 基础地址：
+
+```
+VITE_API_BASE_URL=/api
+```
+
+## License
+
+MIT
+