Document front workbench setup
This commit is contained in:
王鹏
@@ -12,7 +12,8 @@
|
||||
| 数据访问 | MyBatis、PageHelper、Druid、MySQL |
|
||||
| 缓存与任务 | Redis、Quartz |
|
||||
| 接口与工具 | JWT、Swagger/Springfox 3、Velocity、Fastjson2、Apache POI、OSHI |
|
||||
| 前端 | Vue 2.6.12、Vue CLI 4.4.6、Element UI 2.15.14、Vue Router、Vuex、Axios |
|
||||
| 后台前端 | Vue 2.6.12、Vue CLI 4.4.6、Element UI 2.15.14、Vue Router、Vuex、Axios |
|
||||
| 前台工作台 | Vue 3、Vite、Element Plus、Vue Router、Axios |
|
||||
| 构建 | Maven、npm |
|
||||
|
||||
## 架构概览
|
||||
@@ -41,7 +42,8 @@ flowchart LR
|
||||
| `ruoyi-quartz` | 定时任务模块，封装 Quartz 任务、任务日志和调度管理。 |
|
||||
| `ruoyi-generator` | 代码生成模块；包含若依原生表驱动代码生成，以及本项目扩展的项目、模板、数据源、模块、代码片段、项目结构等功能。 |
|
||||
| `ruoyi-common` | 通用工具、常量、注解、基础实体、响应对象、异常、工具类等公共代码。 |
|
||||
| `ruoyi-ui` | Vue 2 + Element UI 前端工程。 |
|
||||
| `ruoyi-ui` | Vue 2 + Element UI 后台前端工程。 |
|
||||
| `easycode-web` | Vue 3 + Vite 前台生成工作台，提供前台登录、数据库生成、表结构编辑和项目预览。 |
|
||||
| `sql` | 数据库初始化与扩展脚本。 |
|
||||
| `doc` | 代码生成平台规划文档。 |
|
||||
| `docs` | 部分扩展 Controller 的接口说明文档。 |
|
||||
@@ -76,6 +78,15 @@ flowchart LR
|
||||
|
||||
扩展生成链路大致为：维护数据源和数据表，配置项目基本信息、项目关联表、模块、模板和结构树，通过 `GenProjectController` 预览或下载项目结构与生成代码。
|
||||
|
||||
### 前台生成工作台
|
||||
|
||||
- 前台目录：`easycode-web`
|
||||
- 后端接口前缀：`/front/**`
|
||||
- 前台用户与项目草稿使用独立的 `front_*` 表，不复用后台 `sys_user`。
|
||||
- DeepSeek 只在后端 `AiGenerateService` 中调用，前端不会直接访问 AI 服务。
|
||||
- 新增数据库脚本：`sql/front_workbench.sql`，完整初始化脚本已合并到 `sql/db.sql`。
|
||||
- 工作流：前台注册/登录 -> 创建项目草稿 -> 生成 MySQL 表结构 -> 编辑表和字段 -> 预览后端、前台前端、后台前端项目结构和代码。
|
||||
|
||||
## 本地启动
|
||||
|
||||
### 1. 环境准备
|
||||
@@ -113,7 +124,7 @@ CREATE DATABASE ry DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;
|
||||
mysql -uroot -p ry < sql/db.sql
|
||||
```
|
||||
|
||||
`sql/db.sql` 已整合若依基础表、Quartz 调度表、代码生成平台扩展表、初始化数据、代码生成平台菜单和按钮权限。分散脚本仍可作为增量或排查参考：
|
||||
`sql/db.sql` 已整合若依基础表、Quartz 调度表、代码生成平台扩展表、前台工作台表、初始化数据、代码生成平台菜单和按钮权限。分散脚本仍可作为增量或排查参考：
|
||||
|
||||
1. `sql/ry_20240629.sql`：若依基础表与基础数据。
|
||||
2. `sql/quartz.sql`：Quartz 调度表。
|
||||
@@ -123,6 +134,7 @@ mysql -uroot -p ry < sql/db.sql
|
||||
6. `sql/sys_project_structure.sql`：项目结构节点表与初始化结构。
|
||||
7. `sql/add_create_table_sql_field.sql`：给 `gen_table` 增加建表 SQL 字段。
|
||||
8. `ruoyi-generator/sql/template_file_update.sql`：模板文件表增量字段。
|
||||
9. `sql/front_workbench.sql`：前台用户、项目草稿、表结构、生成记录和预览文件表。
|
||||
|
||||
### 3. 配置后端
|
||||
|
||||
@@ -152,6 +164,8 @@ java -jar ruoyi-admin/target/ruoyi-admin.war
|
||||
|
||||
### 4. 启动前端
|
||||
|
||||
后台前端：
|
||||
|
||||
```bash
|
||||
cd ruoyi-ui
|
||||
npm install --registry=https://registry.npmmirror.com
|
||||
@@ -162,6 +176,18 @@ npm run dev
|
||||
|
||||
浏览器访问：`http://localhost:80`
|
||||
|
||||
前台工作台：
|
||||
|
||||
```bash
|
||||
cd easycode-web
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
前台默认端口为 `5174`，开发环境会将 `/front/**` 代理到 `VITE_API_BASE_URL`，默认 `http://localhost:8080`。
|
||||
|
||||
浏览器访问：`http://localhost:5174`
|
||||
|
||||
默认账号：
|
||||
|
||||
```text
|
||||
@@ -203,6 +229,19 @@ npm run build:prod
|
||||
ruoyi-ui/dist
|
||||
```
|
||||
|
||||
前台工作台构建：
|
||||
|
||||
```bash
|
||||
cd easycode-web
|
||||
npm run build
|
||||
```
|
||||
|
||||
产物位于：
|
||||
|
||||
```text
|
||||
easycode-web/dist
|
||||
```
|
||||
|
||||
生产环境需要注意：
|
||||
|
||||
- `ruoyi-ui/vue.config.js` 中生产 `publicPath` 为 `/yidaima`。
|
||||
@@ -214,7 +253,8 @@ ruoyi-ui/dist
|
||||
| 入口 | 地址 |
|
||||
| --- | --- |
|
||||
| 后端服务 | `http://localhost:8080` |
|
||||
| 前端页面 | `http://localhost:80` |
|
||||
| 后台前端页面 | `http://localhost:80` |
|
||||
| 前台生成工作台 | `http://localhost:5174` |
|
||||
| Swagger UI | `http://localhost:8080/swagger-ui/index.html` |
|
||||
| Druid 控制台 | `http://localhost:8080/druid`，默认 `ruoyi / 123456` |
|
||||
|
||||
@@ -223,8 +263,9 @@ ruoyi-ui/dist
|
||||
- 后端扩展 Controller 主要位于 `ruoyi-generator/src/main/java/com/ruoyi/generator/controller`。
|
||||
- 后端扩展实体、Mapper、Service 位于 `ruoyi-generator/src/main/java/com/ruoyi/generator/{domain,mapper,service}`。
|
||||
- MyBatis XML 位于 `ruoyi-generator/src/main/resources/mapper/generator`。
|
||||
- 前端接口封装位于 `ruoyi-ui/src/api/generator`。
|
||||
- 前端扩展页面位于 `ruoyi-ui/src/views/generator`。
|
||||
- 后台前端接口封装位于 `ruoyi-ui/src/api/generator`。
|
||||
- 后台前端扩展页面位于 `ruoyi-ui/src/views/generator`。
|
||||
- 前台工作台接口封装位于 `easycode-web/src/api`，页面位于 `easycode-web/src/views`。
|
||||
- 权限标识沿用若依格式，例如 `generator:project:list`、`generator:template:add`、`tool:gen:preview`。
|
||||
- 代码生成模板分为若依默认模板 `ruoyi-generator/src/main/resources/vm` 与扩展模板目录 `ruoyi-generator/src/main/resources/qing`。
|
||||
|
||||
@@ -233,6 +274,7 @@ ruoyi-ui/dist
|
||||
- `doc/code-generator-platform.md`：代码生成平台功能规划。
|
||||
- `docs/*.md`：扩展 Controller 的接口说明。
|
||||
- `ruoyi-ui/README.md`：前端工程原始启动说明。
|
||||
- `easycode-web/README.md`：前台生成工作台启动说明。
|
||||
- 若依官方文档：`http://doc.ruoyi.vip`
|
||||
|
||||
## 排查提示
|
||||
|
||||
34
RuoYi-Vue/easycode-web/README.md
Normal file
34
RuoYi-Vue/easycode-web/README.md
Normal file
@@ -0,0 +1,34 @@
|
||||
# EasyCode Web
|
||||
|
||||
独立前台生成工作台，面向前台用户完成项目草稿创建、AI 数据库设计、表结构编辑、项目结构预览和代码预览。
|
||||
|
||||
## Start
|
||||
|
||||
```powershell
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Default URL: `http://localhost:5174`
|
||||
|
||||
## Backend
|
||||
|
||||
Set `VITE_API_BASE_URL` in `.env.development`.
|
||||
|
||||
The dev server proxies `/front/**` to the backend. The backend default URL is `http://localhost:8080`.
|
||||
|
||||
## Flow
|
||||
|
||||
1. Register or login front user.
|
||||
2. Enter project name and description.
|
||||
3. Generate MySQL database design through backend DeepSeek service.
|
||||
4. Edit tables and fields.
|
||||
5. Preview backend, frontend, and admin frontend project files.
|
||||
|
||||
## Build
|
||||
|
||||
```powershell
|
||||
npm run build
|
||||
```
|
||||
|
||||
Node.js `>=20` is required by the Vite toolchain.
|
||||
Reference in New Issue
Block a user