diff --git a/frontend/README.md b/frontend/README.md index 779b2ae52b7352ffec8537d6a54de51eb1083110..e4bdcbbbb12ac66de3b53e4775b4d06680ed15d4 100644 --- a/frontend/README.md +++ b/frontend/README.md @@ -1,41 +1,165 @@ -# frontend - -## 项目结构 - -```sh -fastapi_project/frontend -├─ public # 静态资源文件 -│ └─ site # 帮助文档模块 -├─ src # 源代码 -│ ├─ api # 接口文件 -│ ├─ components # 组件模块 -│ ├─ layouts # 布局模块 -│ ├─ router # 路由模块 -│ ├─ store # 状态管理模块 -│ ├─ utils # 工具模块 -│ ├─ view # 视图模块 -│ ├─ App.vue # 根组件 -│ ├─ main.js # 入口文件 -│ └─ styles.css # 全局样式文件 -├─ .env.development # 项目开发环境配置 -├─ .env.production # 项目生产环境配置 -├─ index.html # 模板文件 -├─ package.json # 项目依赖文件 -├─ tsconfig.json # ts配置文件 -├─ vite.config.js # vite服务配置文件 -└─ README.md # 项目说明文档 - -``` - -## 快速开始 - -```sh -# 进入前端工程目录 -cd frontend +📘 项目介绍(作者:@1014TaoTao) +FastAPI-Vue3-Admin 是一个基于 FastAPI 和 Vue3 的全栈开源管理系统,提供了一套完整的后台管理解决方案。该项目适用于企业级应用开发,集成了用户权限管理、系统配置、定时任务、日志管理等常用模块,支持 Docker 快速部署。 + +✨ 核心亮点 +- **现代化技术栈**:使用 FastAPI(Python)作为后端框架,Vue3 + TypeScript 作为前端框架,保证高性能与可维护性。 +- **模块化设计**:系统模块清晰划分,便于扩展与二次开发。 +- **权限控制**:基于角色的访问控制(RBAC),支持细粒度权限分配。 +- **多环境支持**:支持开发、生产环境配置切换,集成 Docker 部署脚本。 +- **丰富的内置功能**:包括用户管理、角色权限、菜单管理、定时任务、操作日志、缓存监控等。 +- **响应式界面**:前端采用响应式设计,适配不同设备访问。 + +🛠️ 技术栈概览 +**后端** +- FastAPI:高性能的异步 Web 框架 +- SQLAlchemy + Alembic:数据库 ORM 与迁移工具 +- Redis + JWT:用户认证与会话管理 +- AP Scheduler:定时任务调度 +- Python 3.10+:语言版本要求 + +**前端** +- Vue3 + TypeScript:现代前端框架与类型安全 +- Vite:前端构建工具 +- Element Plus:UI 组件库 +- Axios:HTTP 请求库 +- Vue Router:前端路由管理 + +**部署** +- Docker:容器化部署 +- Nginx:反向代理与静态资源服务 +- Redis:缓存服务 + +📌 内置模块 +- 用户管理:支持注册、登录、角色分配、权限控制 +- 角色权限:基于 RBAC 的权限体系 +- 菜单管理:动态菜单配置 +- 部门与岗位:组织架构管理 +- 字典管理:系统参数配置 +- 定时任务:任务调度与日志查看 +- 操作日志:记录用户行为 +- 缓存监控:查看与清理缓存 +- 服务器监控:实时查看 CPU、内存、磁盘等信息 + +🍪 演示环境 +- 前端访问地址:`http://公网地址:80` +- 接口文档地址:`http://公网地址:8001/api/v1/docs` +- 登录账号: + - 管理员:`admin/123456` + - 演示账号:`demo/123456` + +👷 安装和使用 + +### 获取代码 +```bash +git clone https://gitee.com/1014TaoTao/fastapi-vue3-admin.git +``` + +### 本地后端启动 +```bash +# 进入后端目录 +cd fastapi-vue3-admin/backend + +# 安装依赖(建议使用虚拟环境) +pip install -r requirements.txt + +# 启动服务 +python main.py run +``` + +### 生成迁移文件 +```bash +python main.py revision --message "init" +``` + +### 应用迁移 +```bash +python main.py upgrade +``` + +### 本地前端启动 +```bash +# 进入前端目录 +cd fastapi-vue3-admin/frontend + # 安装依赖 npm install -# 启动前端服务 + +# 启动开发服务器 npm run dev -# 构建前端, 生成 `frontend/dist` 目录 +``` + +### 构建前端 +```bash npm run build +# 构建后的文件位于 frontend/dist ``` + +### 本地访问地址 +- 前端:`http://localhost:3000` +- 接口文档:`http://localhost:8001/api/v1/docs` + +### Docker 部署 +```bash +# 复制部署脚本到服务器 +cp fastapi-vue3-admin/devops/start.sh /path/to/server/ + +# 赋予执行权限 +chmod +x /path/to/server/start.sh + +# 执行脚本 +/path/to/server/start.sh +``` + +#### 查看镜像 +```bash +docker images +``` + +#### 查看容器 +```bash +docker ps +``` + +#### 查看日志 +```bash +docker logs +``` + +#### 停止服务 +```bash +docker-compose down +``` + +#### 删除镜像 +```bash +docker rmi +``` + +#### 删除容器 +```bash +docker rm +``` + +🔧 模块展示 +- 用户管理 +- 角色权限 +- 菜单管理 +- 部门管理 +- 岗位管理 +- 字典管理 +- 定时任务 +- 操作日志 +- 缓存监控 +- 服务器监控 + +🙏 特别鸣谢 +感谢 FastAPI、Vue3、Element Plus、Docker 等开源项目的支持。 + +🎨 社区 +欢迎加入社区交流与反馈问题。 + +❤️ Star 支持我 +如果你喜欢这个项目,请给它一个 Star,这将是我持续更新的动力! + +👀 访问统计 +项目已获得大量访问与关注,感谢每一位开发者! \ No newline at end of file