|
|
# 项目：vue-mgt-template - 个人项目代码记录系统，博客系统
|
|
|
|
|
|
## 项目概述
|
|
|
该项目作为我的个人代码记录总结实践系统，整体是以一种后台管理系统的模式集成开发的，项目框架依赖vue-pure-admin精简版，该项目框架文档地址为https://pure-admin.cn/pages/introduction/#%E5%9C%A8%E7%BA%BF%E9%A2%84%E8%A7%88，其中整个项目不包含后端代码，接口为mock数据或本地文件数据等
|
|
|
|
|
|
## 技术栈规范
|
|
|
- **语言**: Vue3（setup语法模式），TypeScript
|
|
|
- **UI库**: element plus
|
|
|
- **css组件**: tailwindcss，scss
|
|
|
|
|
|
## 项目文档
|
|
|
文档地址为: /README.md
|
|
|
|
|
|
## 项目结构
|
|
|
```
|
|
|
vue3-mgt-template/
|
|
|
├───.env # 环境变量文件
|
|
|
├───index.html # 应用入口HTML文件
|
|
|
├───package.json # 定义项目依赖和脚本
|
|
|
├───vite.config.ts # Vite 构建配置文件
|
|
|
├───tailwind.config.ts # Tailwind CSS 配置文件
|
|
|
├───tsconfig.json # TypeScript 编译器配置
|
|
|
├───mock/ # 本地Mock数据接口
|
|
|
├───public/ # 公共静态资源目录
|
|
|
├───src/ # 主要源代码目录
|
|
|
│ ├───App.vue # 根 Vue 组件
|
|
|
│ ├───main.ts # 应用入口，初始化Vue实例
|
|
|
│ ├───api/ # API 请求模块
|
|
|
│ ├───assets/ # 静态资源（图片、字体、样式）
|
|
|
│ ├───components/ # 可复用的全局组件
|
|
|
│ ├───directives/ # Vue 自定义指令
|
|
|
│ ├───hooks/ # 可复用的 Composition API (Hooks)
|
|
|
│ ├───layout/ # 后台管理系统整体布局组件
|
|
|
│ ├───plugins/ # 插件（如 ECharts, Element Plus）
|
|
|
│ ├───router/ # Vue Router 路由配置
|
|
|
│ ├───store/ # Pinia 全局状态管理
|
|
|
│ ├───style/ # 全局样式和 SCSS 变量
|
|
|
│ ├───utils/ # 工具函数模块
|
|
|
│ └───views/ # 页面级组件
|
|
|
└───types/ # 全局 TypeScript 类型定义
|
|
|
```
|
|
|
|
|
|
## 开发规范
|
|
|
|
|
|
### **对Gemini的特别指令**
|
|
|
- **严格遵守规范**：当Gemini为本项目生成或修改任何代码时，**必须** 严格遵守本文件中定义的所有开发规范。
|
|
|
- **中文优先**：所有代码注释、日志输出（例如 `console.log`）、以及提交信息（Commit Message）**必须** 使用中文。
|
|
|
- **多平台兼容**：所有代码需要兼容mac,windows,linux平台。
|
|
|
- **文档和注释**：该项目是一个个人学习记录项目，请尽可能多提供文档和注释。
|
|
|
|
|
|
|
|
|
### 代码风格
|
|
|
- 使用 TypeScript 严格模式
|
|
|
- 组件命名采用 PascalCase (如 `TaskCard.vue`)
|
|
|
- 函数和变量使用 camelCase（驼峰命名）
|
|
|
- 常量使用 UPPER_SNAKE_CASE
|
|
|
|
|
|
### 项目启动
|
|
|
- 请参考package.json中dev命令，可以直接启动项目
|
|
|
|
|
|
### 注释和日志
|
|
|
- 注释请使用中文
|
|
|
- 日志输出请使用中文
|
|
|
|
|
|
## 对话记录
|
|
|
- **会话结束指令**：當我表示準備結束會話時，你**必須**先將本次對話的重點，以“本次会话总结”的格式更新到 `README.md` 的“对话记录”部分，然後才能結束對話。
|
|
|
|
|
|
## 开发任务
|
|
|
### 规范
|
|
|
使用了删除线的就代表已执行完成
|
|
|
|
|
|
### 任务列表
|
|
|
* 请关注以下两个文件夹
|
|
|
- /src/views/demo/computedWithEnumList
|
|
|
- /mock (mock接口，返回computedWithEnumList组件内所需接口getPageInfo, getEnumList, getEnumList是一个通用接口，每次根据传入的类型返回对应的枚举值，比如传入性别， 只返回性别的枚举值，因此getEnumList需要循环多次执行获取所有枚举列表)
|
|
|
**要求**：
|
|
|
- computedWithEnumList组件内需要的接口，在mock内新建文件创建接口
|
|
|
- mock接口需要模拟延迟返回， getPageInfo随机200~500ms，getEnumList接口随机1～5s |