From 30ab4662322b5b89fe27f230154b00c5848da623 Mon Sep 17 00:00:00 2001 From: zhangtao <9480807882@qq.com> Date: Mon, 18 Aug 2025 00:56:10 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9B=B4=E6=96=B0=E5=89=8D=E7=AB=AF?= =?UTF-8?q?=E9=85=8D=E7=BD=AE=E5=92=8C=E6=96=87=E6=A1=A3=EF=BC=8C=E4=BC=98?= =?UTF-8?q?=E5=8C=96=E7=99=BB=E5=BD=95=E9=A1=B5=E9=9D=A2=E5=92=8C=E9=83=A8?= =?UTF-8?q?=E7=BD=B2=E8=84=9A=E6=9C=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 为前端和小程序添加base路径配置 - 更新部署脚本添加pnpm依赖检查 - 优化登录页面表单验证和UI组件 - 统一各环境端口号为5180 - 更新文档中的技术栈和访问地址 - 添加官网和小程序链接到导航栏 --- README.en.md | 65 ++++++++++++---- README.md | 51 +++++++++--- deploy.sh | 2 +- devops/nginx/nginx.conf | 2 - fastapp/.env.development | 4 +- fastapp/components.d.ts | 1 + fastapp/src/pages/login/index.vue | 78 ++++++++++--------- fastapp/src/pages/mine/settings/index.vue | 8 ++ fastapp/src/store/modules/user.store.ts | 2 +- fastapp/vite.config.ts | 1 + fastdocs/.vitepress/config.ts | 5 +- fastdocs/package.json | 4 +- fastdocs/src/guide.md | 46 +++++++++-- .../NavBar/components/NavbarActions.vue | 6 +- frontend/vite.config.ts | 1 + 15 files changed, 196 insertions(+), 80 deletions(-) diff --git a/README.en.md b/README.en.md index 30a72c7c..dc32f478 100644 --- a/README.en.md +++ b/README.en.md @@ -63,7 +63,7 @@ fastapi_vue3_admin | 📊 Permission Management | The RBAC model enables fine-grained permission control at the menu, button, and data levels. | | 🚀 Rapid Deployment | Supports one-click deployment with Docker/Docker Compose/Nginx. | | 📄 Developer-friendly | Provides comprehensive Chinese documentation, a Chinese interface, and a visual toolchain to reduce the learning curve. | -| 🚀 Quick Access | Based on mainstream front-end technology stacks such as Vue3, Vite5, Pinia, and Ant Design Vue, it's ready to use out of the box. | +| 🚀 Quick Access | Based on mainstream front-end technology stacks such as Vue3, Vite5, Pinia, and ElementPlus, it's ready to use out of the box. | --- @@ -76,7 +76,7 @@ fastapi_vue3_admin | Scheduled Tasks | APScheduler | Easily implement scheduled tasks. | | Authentication | PyJWT | Implement JWT authentication. | | Frontend Framework | Vue3 / Vite5 / Pinia / TypeScript | Quickly develop Vue3 applications. | -| UI Library | Ant Design Vue | Quickly develop beautiful UI components. | +| UI Library | ElementPlus | Quickly develop beautiful UI components. | | Database | MySQL / MongoDB | Powerful databases. | | Cache | Redis | A powerful caching database. | | Documentation | Swagger / Redoc | Automatically generate API documentation. | @@ -97,8 +97,10 @@ fastapi_vue3_admin ## 🍪 Demo Environment -- Demo URL: -- Administrator account: `admin` Password: `123456` +- Official website: +- Web address: +- App address: +- Admin account: `admin` Password: `123456` - Demo account: `demo` Password: `123456` --- @@ -130,7 +132,7 @@ git clone https://github.com/1014TaoTao/fastapi_vue3_admin.git --- -### Local Backend Startup +### Local Backend Start ```sh # Enter the backend project directory @@ -138,9 +140,9 @@ cd backend # Install dependencies pip3 install -r requirements.txt # Start the backend service -python3 main.py run -or -python3 main.py run --env=dev +python3 main.py run +or +python3 main.py run --env=dev # Generate migration files python3 main.py revision "Initial migration" --env=dev (default is dev if not specified) # Apply migrations @@ -149,26 +151,57 @@ python3 main.py upgrade --env=dev (default is dev if not specified) --- -### Local Frontend Startup +### Local Frontend Start ```sh # Enter the frontend project directory cd frontend # Install dependencies -npm install +pnpm install # Start the frontend service -npm run dev +pnpm run dev # Build the frontend and generate the `frontend/dist` directory -npm run build +pnpm run build +``` + +--- + +### Local App H5 Start + +```sh +# Enter the fastapp project directory +cd fastapp +# Install dependencies +pnpm install +# Start the fastapp service +pnpm run dev:h5 +# Build the fastapp and generate the `fastapp/dist/build/h5` directory +pnpm run build:h5 +``` + +--- + +### Local Project Website Start + +```sh +# Enter the fastdocs project directory +cd fastdocs +# Install dependencies +pnpm install +# Run the documentation project +pnpm run docs:dev +# Build the documentation project and generate the `fastdocs/dist` directory +pnpm run docs:build ``` --- ### Local Access Address -- Frontend address: -- API address: -- Administrator account: `admin` Password: `123456` +- Project official website address: +- Web frontend address: +- App frontend address: +- Admin account: `admin` Password: `123456` - Demo account: `demo` Password: `123456` --- @@ -179,7 +212,7 @@ npm run build # Copy the script `fastapi_vue3_admin/start.sh` to the server and grant execution permissions chmod +x start.sh # Execute the script -./start.sh +./deploy.sh # View images: docker images -a # View containers: diff --git a/README.md b/README.md index b1eb7bef..fa072a58 100644 --- a/README.md +++ b/README.md @@ -65,7 +65,7 @@ fastapi_vue3_admin | 📊 权限管理 | RBAC 模型实现菜单、按钮、数据级别的细粒度权限控制 | | 🚀 快速部署 | 支持 Docker/Docker Compose/Nginx 一键部署 | | 📄 开发友好 | 提供完善的中文文档 + 中文化界面 + 可视化工具链，降低学习成本 | -| 🚀 快速接入 |基于 Vue3、Vite5、Pinia、Ant Design Vue 等主流前端技术栈，开箱即用。| +| 🚀 快速接入 |基于 Vue3、Vite5、Pinia、ElementPlus 等主流前端技术栈，开箱即用。| --- @@ -78,7 +78,7 @@ fastapi_vue3_admin | 定时任务 | APScheduler | 轻松实现定时任务。 | | 权限认证 | PyJWT | 实现 JWT 认证。 | | 前端框架 | Vue3 / Vite5 / Pinia / TypeScript | 快速开发 Vue3 应用。 | -| UI 库 | Ant Design Vue | 快速开发美观的 UI 组件。 | +| UI 库 | ElementPlus | 快速开发美观的 UI 组件。 | | 数据库 | MySQL / MongoDB | 强大的数据库。 | | 缓存 | Redis | 强大的缓存数据库。 | | 文档 | Swagger / Redoc | 自动生成 API 文档。 | @@ -99,7 +99,9 @@ fastapi_vue3_admin ## 🍪 演示环境 -- 演示地址： +- 官网地址： +- 演示地址： +- 小程序地址： - 管理员账号：`admin` 密码：`123456` - 演示账号：`demo` 密码：`123456` @@ -157,19 +159,50 @@ python3 main.py upgrade --env=dev(不加默认为dev) # 进入前端工程目录 cd frontend # 安装依赖 -npm install +pnpm install # 启动前端服务 -npm run dev +pnpm run dev # 构建前端, 生成 `frontend/dist` 目录 -npm run build +pnpm run build +``` + +--- + +### 本地小程序h5启动 + +```sh +# 进入前端工程目录 +cd fastapp +# 安装依赖 +pnpm install +# 启动前端服务 +pnpm run dev:h5 +# 构建前端, 生成 `frontend/dist/build/h5` 目录 +pnpm run build:h5 +``` + +--- + +### 本地项目官网启动 + +```sh +# 进入前端工程目录 +cd fastdocs +# 安装依赖 +pnpm install +# 运行文档工程 +pnpm run docs:dev +# 构建文档工程, 生成 `fastdocs/dist` 目录 +pnpm run docs:build ``` --- ### 本地访问地址 -- 前端地址: -- 接口地址: +- 项目官网地址: +- web前端地址: +- 小程序h5前端地址: - 管理员账号：`admin` 密码：`123456` - 演示账号：`demo` 密码：`123456` @@ -181,7 +214,7 @@ npm run build # 复制脚本 `fastapi_vue3_amdin/start.sh` 脚本文件到服务器, 并赋予执行权限 chmod +x start.sh # 执行脚本 -./start.sh +./deploy.sh # 查看镜像: docsker images -a # 查看容器: diff --git a/deploy.sh b/deploy.sh index d9ccc3fc..73acd4b9 100644 --- a/deploy.sh +++ b/deploy.sh @@ -41,7 +41,7 @@ check_dependencies() { log "==========🔍 第二步：检查系统依赖...==========" "INFO" local missing_deps=() - for cmd in git docker node npm; do + for cmd in git docker node npm pnpm; do if ! command -v $cmd &> /dev/null; then missing_deps+=($cmd) log "❌ $cmd 未安装" "ERROR" diff --git a/devops/nginx/nginx.conf b/devops/nginx/nginx.conf index 3c5c7df0..d13fe03e 100644 --- a/devops/nginx/nginx.conf +++ b/devops/nginx/nginx.conf @@ -43,14 +43,12 @@ http { # 前端代理 - /web访问前端 location /web { alias /usr/share/nginx/html/frontend/dist; - # index index.html index.htm; try_files $uri $uri/ /web/index.html; #解决页面刷新404问题 } # 小程序代理 - /app访问小程序 location /app { alias /usr/share/nginx/html/fastapp/dist/build/h5; - # index index.html index.htm; try_files $uri $uri/ /app/index.html; #解决页面刷新404问题 } diff --git a/fastapp/.env.development b/fastapp/.env.development index d203c449..095ed0d9 100644 --- a/fastapp/.env.development +++ b/fastapp/.env.development @@ -12,11 +12,11 @@ VITE_API_BASE_URL=http://service.fastapiadmin.com VITE_APP_BASE_API=/api/v1 # 应用端口 -VITE_APP_PORT=4096 +VITE_APP_PORT=5180 # 超时时间 VITE_TIMEOUT=10000 # WebSocket 服务器的 URL，不配置默认关闭 WebSocket -#VITE_APP_WS_ENDPOINT= ws://localhost:4096/ws \ No newline at end of file +#VITE_APP_WS_ENDPOINT= ws://localhost:5180/ws \ No newline at end of file diff --git a/fastapp/components.d.ts b/fastapp/components.d.ts index 8af01919..cbf16f89 100644 --- a/fastapp/components.d.ts +++ b/fastapp/components.d.ts @@ -37,6 +37,7 @@ declare module 'vue' { WdNavbar: typeof import('wot-design-uni/components/wd-navbar/wd-navbar.vue')['default'] WdNoticeBar: typeof import('wot-design-uni/components/wd-notice-bar/wd-notice-bar.vue')['default'] WdNotify: typeof import('wot-design-uni/components/wd-notify/wd-notify.vue')['default'] + WdPasswordInput: typeof import('wot-design-uni/components/wd-password-input/wd-password-input.vue')['default'] WdPopup: typeof import('wot-design-uni/components/wd-popup/wd-popup.vue')['default'] WdProgress: typeof import('wot-design-uni/components/wd-progress/wd-progress.vue')['default'] WdRadio: typeof import('wot-design-uni/components/wd-radio/wd-radio.vue')['default'] diff --git a/fastapp/src/pages/login/index.vue b/fastapp/src/pages/login/index.vue index aa333d33..4e8257bd 100644 --- a/fastapp/src/pages/login/index.vue +++ b/fastapp/src/pages/login/index.vue @@ -22,15 +22,19 @@ :color="isDarkMode ? '#7AC5FF' : '#333'" class="input-icon" /> - - + + @@ -40,40 +44,40 @@ :color="isDarkMode ? '#7AC5FF' : '#333'" class="input-icon" /> - - + + + - + - - 点击加载 - + - + + +