# Monisuo Admin - Vue 3 管理后台

## 项目说明

基于 shadcn-vue-admin 模板的 Monisuo 模拟交易系统管理后台。

### 技术栈

- Vue 3 + TypeScript
- shadcn-vue (Radix UI primitives)
- Tailwind CSS 4
- TanStack Query (vue-query)
- Vue Router
- Pinia

### 后端 API

- Base URL: http://localhost:8080
- 认证方式: JWT Bearer Token
- 接口定义: src/services/api/monisuo-admin.api.ts

### 功能模块

1. 登录认证 (/auth/monisuo-sign-in)
2. 资金总览 (/monisuo/dashboard)
3. 用户管理 (/monisuo/users)
4. 币种管理 (/monisuo/coins)
5. 订单审批 (/monisuo/orders)

## 开发命令

### 安装依赖

```bash
pnpm install
```

### 启动开发服务器

```bash
pnpm dev
```

访问: http://localhost:5173

### 类型检查

```bash
pnpm type-check
```

### 构建生产版本

```bash
pnpm build
```

### 代码格式化

```bash
pnpm lint
```

## 注意事项

### 响应式断点

- sm: 640px
- md: 768px
- lg: 1024px
- xl: 1280px
- 2xl: 1536px

移动端优化重点：

- 表格改为卡片列表
- 隐藏次要信息
- 增大触摸区域
- 简化导航

### 组件规范

1. 使用 Composition API + `<script setup>`
2. TypeScript 类型定义
3. 使用 shadcn-vue 组件
4. Tailwind CSS 样式
5. TanStack Query 管理数据

### Git 提交规范

- feat: 新功能
- fix: 修复
- refactor: 重构
- style: 样式调整
- docs: 文档

## 后端启动

在另一个终端运行：

```bash
cd ~/Desktop/projects/monisuo
mvn spring-boot:run
```

默认管理员账号：

- 用户名: admin
- 密码: admin123

## 当前状态

✅ 已完成：

- 项目初始化
- API 服务层
- 基础页面框架
- 认证逻辑

⏳ 待完成：

- 布局组件封装
- 响应式优化
- 完整功能对接
- 用户体验优化