# Cool Admin Vue

一个基于 Vue 3 + TypeScript + Element Plus 的现代化后台管理系统框架。

## 🚀 技术栈

- **前端框架**: Vue 3.5.13
- **开发语言**: TypeScript 5.5.4
- **UI 组件库**: Element Plus 2.9.3
- **状态管理**: Pinia 2.3.1
- **路由管理**: Vue Router 4.5.0
- **构建工具**: Vite 5.4.14
- **样式框架**: Tailwind CSS 3.4.17
- **国际化**: Vue I18n 11.0.1
- **图表库**: ECharts 5.6.0
- **富文本编辑器**: WangEditor 5.1.23

## 📁 项目结构

```
moshiji_admin/
├── .vscode/                    # VSCode 配置和代码片段
├── public/                     # 静态资源文件
│   ├── favicon.ico
│   ├── logo.png
│   └── 用户导入模版.xlsx
├── packages/                   # 源码包
│   ├── crud/                   # @cool-vue/crud 包
│   │   ├── src/
│   │   │   ├── components/     # CRUD 组件
│   │   │   ├── hooks/          # 组合式函数
│   │   │   ├── locale/         # 国际化文件
│   │   │   ├── utils/          # 工具函数
│   │   │   └── ...
│   │   └── types/              # 类型定义
│   └── vite-plugin/            # @cool-vue/vite-plugin 包
│       ├── src/
│       │   ├── eps/            # EPS 相关功能
│       │   ├── file/           # 文件处理
│       │   ├── plugin/         # 插件功能
│       │   └── ...
│       └── types/              # 类型定义
├── src/                        # 源码目录
│   ├── cool/                   # 核心文件
│   │   ├── bootstrap/          # 启动配置
│   │   ├── hooks/              # 全局钩子
│   │   ├── module/             # 模块管理
│   │   ├── router/             # 路由配置
│   │   ├── service/            # 服务层
│   │   ├── types/              # 类型定义
│   │   └── utils/              # 工具函数
│   ├── modules/                # 项目模块
│   │   ├── base/               # 基础模块
│   │   │   ├── components/     # 全局组件
│   │   │   ├── directives/     # 全局指令
│   │   │   ├── locales/        # 国际化
│   │   │   ├── pages/          # 页面
│   │   │   ├── static/         # 静态资源
│   │   │   ├── store/          # 状态管理
│   │   │   ├── types/          # 类型定义
│   │   │   ├── utils/          # 工具函数
│   │   │   └── views/          # 视图组件
│   │   ├── demo/               # 示例模块
│   │   ├── dict/               # 字典模块
│   │   ├── helper/             # 辅助模块
│   │   ├── recycle/            # 回收站模块
│   │   ├── space/              # 文件空间模块
│   │   ├── task/               # 任务模块
│   │   └── user/               # 用户模块
│   ├── plugins/                # 项目插件
│   │   ├── crud/               # CRUD 插件
│   │   ├── dev-tools/          # 开发工具
│   │   ├── distpicker/         # 省市区选择器
│   │   ├── echarts/            # 图表插件
│   │   ├── editor-preview/     # 编辑器预览
│   │   ├── editor-wang/        # 富文本编辑器
│   │   ├── element-ui/         # Element Plus 组件
│   │   ├── excel/              # Excel 导入导出
│   │   ├── github/             # GitHub 相关
│   │   ├── i18n/               # 国际化插件
│   │   ├── iconfont/           # 图标字体
│   │   ├── tailwind/           # Tailwind CSS
│   │   ├── theme/              # 主题插件
│   │   ├── upload/             # 文件上传
│   │   └── view/               # 视图组件
│   ├── config/                 # 配置文件
│   │   ├── index.ts            # 默认配置
│   │   ├── dev.ts              # 开发环境配置
│   │   └── prod.ts             # 生产环境配置
│   ├── App.vue                 # 根组件
│   └── main.ts                 # 入口文件
├── build/                      # 构建相关
│   └── cool/
│       ├── eps.json            # EPS 配置文件
│       └── eps.d.ts            # EPS 描述文件
├── package.json                # 依赖管理
├── vite.config.ts              # Vite 配置
├── tsconfig.json               # TypeScript 配置
├── tailwind.config.js          # Tailwind 配置
└── README.md                   # 项目说明
```

## 🛠️ 安装和使用

### 环境要求

- Node.js >= 18.0.0
- npm >= 8.0.0 或 yarn >= 1.22.0

### 安装依赖

```bash
npm install
# 或
yarn install
```

### 开发环境

```bash
npm run dev
# 或
yarn dev
```

### 构建生产版本

```bash
npm run build
# 或
yarn build
```

### 构建静态版本

```bash
npm run build-static
# 或
yarn build-static
```

### 代码检查

```bash
npm run lint
# 或
yarn lint
```

### 类型检查

```bash
npm run type-check
# 或
yarn type-check
```

## 📝 开发规范

### 文件命名

- 文件和组件命名使用 `-` 连接，如：`student-info.vue`
- 目录命名使用小写字母和 `-` 连接

### 导入别名

- `"/@"` 对应 `"./src"`
- `"/$"` 对应 `"./src/modules"`
- `"/#"` 对应 `"./src/plugins"`
- `"/~"` 对应 `"./packages"`

### 模块开发

每个模块应包含以下目录结构：

```
modules/模块名/
├── components/     # 全局组件
├── directives/     # 全局指令
├── locales/        # 国际化
├── router/         # 路由
├── store/          # 状态管理
├── utils/          # 工具函数
├── views/          # 视图
├── config.ts       # 模块配置（必须）
└── index.ts        # 模块导出
```

## 🔧 配置说明

### 环境配置

- `src/config/dev.ts` - 开发环境配置
- `src/config/prod.ts` - 生产环境配置
- `src/config/index.ts` - 默认配置

### EPS 配置

- `build/cool/eps.json` - EPS 配置文件
- `build/cool/eps.d.ts` - EPS 描述文件

## 📚 相关文档

- [Vue 3 官方文档](https://vuejs.org/)
- [Element Plus 文档](https://element-plus.org/)
- [Vite 文档](https://vitejs.dev/)
- [TypeScript 文档](https://www.typescriptlang.org/)
- [Tailwind CSS 文档](https://tailwindcss.com/)

## 🤝 贡献指南

1. Fork 本仓库
2. 创建特性分支 (`git checkout -b feature/AmazingFeature`)
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到分支 (`git push origin feature/AmazingFeature`)
5. 打开 Pull Request

## 📄 许可证

本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情。

## 🙏 致谢

感谢所有为这个项目做出贡献的开发者们！