RuoYi-Vue-Plus/ruoyi-site/ruoyi-h5/doc/需求.md
lizhengwei 0aed7d1295 需求
2026-03-06 18:06:26 +08:00

164 lines
20 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

## 需求总结
根据我们之前的交互,您希望在现有的 Spring Boot 3 项目中实现以下功能:
1. **创建新的 H5 项目管理模块**
- 不修改现有业务代码
- 创建独立的表和相关代码
2. **数据存储架构**
- 使用 MySQL + JSON 存储
- MySQL 存储项目元数据(基本信息)
3. **项目分组功能**
- 支持多级分组结构
- 三个一级分组:物料、用途、行业
- 每个一级分组下有多个二级分组
- 项目与分组为多对多关系
4. **时间字段规范**
- 所有时间字段使用 Unix 时间戳(秒级)存储
- 不使用 datetime 类型
5. **代码规范要求**
- 使用 Lombok 简化代码
- 事务一致性保障(使用 @Transactional 注解)
- Controller 不直接调用 Repository
- Controller 返回值不使用 Map 类型
- ID 字段统一命名为 id
6. **技术实现细节**
- 使用 MyBatis-Plus 作为 ORM 框架
- 提供完整的 CRUD 接口
## 标准化提示词模板
你是一个经验丰富的 Java 开发工程师,熟悉 Spring Boot 3、MyBatis-Plus。我需要在现有的 Spring Boot 3 项目中实现一个新的功能模块,请按照以下要求进行开发:
1. **项目结构要求**
- 不修改现有业务代码,创建全新的独立模块
- 使用标准的分层架构Entity/DAO/Service/Controller/VO等
2. **数据存储架构**
- MySQL 存储元数据,和存储长文本内容
- 所有时间字段使用 Unix 时间戳(秒级)存储,类型为 bigint
3. **功能需求**
- 实现完整的 CRUD 接口
- 支持多级分组管理(一级分组:物料、用途、行业)
- 项目与分组为多对多关系
4. **代码规范**
- 使用 Lombok 简化代码(@Data、@EqualsAndHashCode 等)
- 事务一致性保障(使用 @Transactional 注解)
- Controller 不直接调用 Repository通过 Service 层访问
- Controller 返回值不使用 Map 类型,使用具体 VO 类或基本类型
- ID 字段统一命名为 id不使用冗余前缀
- 所有类和方法需要适当的 Swagger 注解
5. **具体实现要求**
- 创建完整的 Entity、DAO、Service、Controller 和 VO 类
- 提供对应的数据库建表 SQL 脚本
- 确保编译无错误,代码符合规范
dashboard
## 表单需求
帮我理一下这个表单需求然后帮我合理设计一下表结构和技术选型再实现表单提交接口和表单提交过的数据查询接口等等有遗漏的记得帮我补上在h5在线编辑中可以新建个表单表单可以自定义提交项这种自定义表单如何设计表结构是用mongo还是mysql
1、其他平台是这样提交表单内容的
{"templet_form_id":450055,"form_id":"461709","form_data":{"19fef684-b6ef-4bfb-8d68-603c99444ac5":"文本内容","6cbf9138-a20d-428c-b635-291246da3926":"13255556645","14154ccc-c2b3-4d27-8eb2-e3e422af294f":"1713322582323@qq.com"}}
2、表单的结构是保存在 H5ProjectContent 下的 Element(type=form时)->formItems 中的formItems 的结构是如下:
{"formItems": [ { "prop": "cf1d1fd1-9df9-44b4-ba73-3c553784aeab", "widget": "input", "verify": { "enable": false, "hint": "请输入文本内容" } }, { "prop": "56d54498-7d9d-4055-badd-09596fc9a43c", "widget": "input", "verify": { "enable": false, "hint": "请输入文本内容" } }, { "prop": "073f7b1f-afb9-4810-8896-d760197f5d02", "widget": "input", "verify": { "enable": true, "hint": "请输入正确的手机号码" } }, { "prop": "155ed883-93e5-4509-88db-ace73caac0d2", "widget": "input", "verify": { "enable": false, "hint": "请输入文本内容" } } ]}
4、查询提交记录页面urlhttps://www.gaoding.com/odyssey/dashboard#/form/response?mode=company&platform=4&user_id=9021376240556066908&templet_id=34480589722472555
3、查询结构是这样的
https://www.gaoding.com/odyssey/editor/templetformResponses?page=1&page_size=20&order=id:desc&templet_form_id=450055
```json
{
"page": "1",
"page_size": "20",
"total": 2,
"data": [
{
"id": 26964584,
"form_id": 461709,
"data": "{\"19fef684-b6ef-4bfb-8d68-603c99444ac5\":\"1\",\"14154ccc-c2b3-4d27-8eb2-e3e422af294f\":\"1212@134.com\",\"b8256478-4f71-4484-a859-f71628c6107a\":\"5656456456\"}",
"ip": "27.17.43.218, 110.75.191.49",
"deleted_at": null,
"created_at": "2025-11-14 17:25:52",
"updated_at": "2025-11-14 17:25:52",
"platform_user_id": 0
},
{
"id": 26963271,
"form_id": 461709,
"data": "{\"19fef684-b6ef-4bfb-8d68-603c99444ac5\":\"文本内容\",\"6cbf9138-a20d-428c-b635-291246da3926\":\"13255556645\",\"14154ccc-c2b3-4d27-8eb2-e3e422af294f\":\"1713322582323@qq.com\"}",
"ip": "27.17.43.218, 110.75.191.24",
"deleted_at": null,
"created_at": "2025-11-14 14:17:44",
"updated_at": "2025-11-14 14:17:44",
"platform_user_id": 0
}
]
}
```
然后完善一下 H5ProjectContent 中的Element目前有这几种类型对应的内容有image、 text、 svg、 group、 form、 map这几个对应的内容结构如下
image: { "uuid": "0.241109143257637336", "type": "image", "title": "4", "category": "", "opacity": 1, "padding": [ 0, 0, 0, 0 ], "width": 143, "height": 139, "left": 621, "top": -24, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [ { "type": "enter", "order": 0, "keyframes": { "opacity": [ 0, 1 ], "transform": [ "translate(0%, -82.73381294964028%) matrix(1, 0, 0, 1, 0, 0)", "translate(0, 0) scale(1) matrix(1, 0, 0, 1, 0, 0)" ] }, "delay": 0, "duration": 1000, "fill": "both", "name": "渐变和移动", "easing": " cubic-bezier(0.31, 0.21, 0.20, 1)", "customValues": { "direction": 0 }, "groupOrder": 1 } ], "boxShadow": null, "resize": 7, "dragable": true, "rotatable": true, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": { "materials": [ { "id": 48218352, "type": "image" } ] }, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": "blendNormal", "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "url": "https://st-gdx.dancf.com/odyssey/uxms/20211022-190216-5ef3.png", "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "right": 0, "top": 0 }, "imageEffects": [], "aggregatedColors": [], "mainColor": null, "effectScale": 1, "imageTransform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "filterInfo": null, "naturalWidth": 143, "naturalHeight": 139, "resourceType": "image", "naturalDuration": 0, "enableDragToMask": true, "loop": true, "canDownload": false, "version": "7.1.71", "events": [] }
text: { "uuid": "0.291946162773902226", "type": "text", "title": "地址导航", "category": "", "opacity": 1, "padding": [ 0, 0, 0, 0 ], "width": 186.541, "height": 40, "left": 79.72950000000003, "top": 3, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [], "boxShadow": null, "resize": 5, "dragable": false, "rotatable": false, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": null, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "color": "#570002ff", "fontFamily": "SourceHanSansSC-Regular", "fontStyle": "normal", "fontWeight": 400, "fontSize": 33, "lineHeight": 1.2, "letterSpacing": 0, "textDecoration": "none", "writingMode": "horizontal-tb", "textAlign": "center", "verticalAlign": "top", "content": "地址导航", "contents": null, "effectScale": 1, "textShadow": null, "autoScale": true, "textEffects": [], "aggregatedColors": [ "#570002ff" ], "mainColor": null, "listStyle": "", "autoAdaptive": 1, "adjustsFontSize": false, "version": "6.1.71", "bindDataKey": "", "events": [] }
svg { "uuid": "0.970693030997296142", "type": "svg", "title": "形状 2", "category": "", "opacity": 0.0784313725490196, "padding": [ 0, 0, 0, 0 ], "width": 3.000537872314453, "height": 668.0000002384186, "left": 26.999731063842773, "top": 0, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [], "boxShadow": null, "resize": 7, "dragable": false, "rotatable": false, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": { "materials": [] }, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "url": "https://st-gdx.dancf.com/odyssey/uxms/20211022-190216-bb71.svg", "content": "", "colors": [ "#e9d196ff", "#fff1cfff", "#e9d196ff" ], "containerTransform": null, "version": "7.1.71", "events": [] }
group: { "uuid": "0.5223160352186436538", "type": "group", "title": "", "category": "", "opacity": 1, "padding": [ 0, 0, 0, 0 ], "width": 351.43835616438355, "height": 90.86839294433594, "left": 345.2801802125696, "top": 1209.7794354248047, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [ { "type": "enter", "order": 3, "keyframes": { "opacity": [ 0, 1 ], "transform": [ "translate(115.16096996485061%, 0%) matrix(1, 0, 0, 1, 0, 0)", "translate(0, 0) scale(1) matrix(1, 0, 0, 1, 0, 0)" ] }, "delay": 250, "duration": 1000, "fill": "both", "name": "渐变和移动", "easing": " cubic-bezier(0.31, 0.21, 0.20, 1)", "customValues": { "direction": 1 }, "groupOrder": 1 } ], "boxShadow": null, "resize": 1, "dragable": true, "rotatable": true, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": null, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "elements": [ { "uuid": "0.4198633247682788452", "type": "text", "title": "中国·厦门", "category": "", "opacity": 1, "padding": [ 0, 0, 0, 0 ], "width": 252.629, "height": 43, "left": 98.80935616438364, "top": 47.86839294433594, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [], "boxShadow": null, "resize": 5, "dragable": false, "rotatable": false, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": null, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "color": "#fff4d5ff", "fontFamily": "SourceHanSansSC-Regular", "fontStyle": "normal", "fontWeight": 400, "fontSize": 36, "lineHeight": 1.2, "letterSpacing": 0, "textDecoration": "none", "writingMode": "horizontal-tb", "textAlign": "right", "verticalAlign": "top", "content": "中国·厦门", "contents": null, "effectScale": 1, "textShadow": null, "autoScale": true, "textEffects": [], "aggregatedColors": [ "#fff4d5ff" ], "mainColor": null, "listStyle": "", "autoAdaptive": 1, "adjustsFontSize": false, "version": "6.1.71", "events": [], "bindDataKey": "" } ], "splitenable": true, "autoGrow": false, "version": "7.1.71", "events": [] }
form: {"uuid": "0.6779576535240048515", "type": "form", "title": "", "category": "", "opacity": 1, "padding": [0, 0, 0, 0], "width": 510.5, "height": 779, "left": 119.75000000000001, "top": 415.7632093933465, "transform": {"a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0}, "animations": [{"type": "enter", "order": 3, "keyframes": {"opacity": [0, 1], "transform": ["scale(0.7) matrix(1, 0, 0, 1, 0, 0)", "translate(0, 0) scale(1) matrix(1, 0, 0, 1, 0, 0)"]}, "delay": 0, "duration": 1000, "fill": "both", "name": "渐变和缩放", "easing": "ease-in-out", "groupOrder": 3}], "boxShadow": null, "resize": 14, "dragable": true, "rotatable": true, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": {"contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0}, "watermarkEnable": false, "metaInfo": null, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": {"enable": false, "showSelf": false, "imageUrl": "", "effectedResult": {"width": 0, "height": 0, "left": 0, "top": 0}}, "suspension": {"enable": false, "top": null, "left": null, "right": null, "bottom": null}, "formData": {"cf1d1fd1-9df9-44b4-ba73-3c553784aeab": "", "073f7b1f-afb9-4810-8896-d760197f5d02": "", "56d54498-7d9d-4055-badd-09596fc9a43c": "", "155ed883-93e5-4509-88db-ace73caac0d2": ""}, "formOptions": {"id": "ee0c7225-cc60-4a16-9cf3-e2d313dd1309", "started_at": "", "finished_at": "", "auth": {"wechat": false}}, "formSchema": {"type": "object", "required": ["cf1d1fd1-9df9-44b4-ba73-3c553784aeab", "073f7b1f-afb9-4810-8896-d760197f5d02", "155ed883-93e5-4509-88db-ace73caac0d2"], "properties": {"cf1d1fd1-9df9-44b4-ba73-3c553784aeab": {"type": "string", "title": "姓名", "format": "string", "pattern": ".+", "description": ""}, "073f7b1f-afb9-4810-8896-d760197f5d02": {"type": "string", "title": "请输入手机号", "default": "", "format": "string", "pattern": "^([+\\d\\s/-]+)?([1]([3-9])[0-9]{9})$", "description": ""}, "56d54498-7d9d-4055-badd-09596fc9a43c": {"type": "string", "title": "人数", "format": "string", "pattern": ".+", "description": ""}, "155ed883-93e5-4509-88db-ace73caac0d2": {"type": "string", "title": "备注", "format": "string", "pattern": ".+", "description": ""}}}, "formTheme": {"colors": ["#ffe8a3ff", "#ffffffff", "#ffe8a3ff", "#ffe8a3ff", "#ffffff00"], "common": {"verticalPadding": 27}, "question": {"space": 20}, "image": {"column": 2, "width": 285, "height": 285}, "border": {"width": 1, "radius": 40}, "hintColors": ["#de415c", "#de415c", "#fdf7f8"], "text": {"submitText": "提交"}}, "formItems": [{"prop": "cf1d1fd1-9df9-44b4-ba73-3c553784aeab", "widget": "input", "verify": {"enable": false, "hint": "请输入文本内容"}}, {"prop": "56d54498-7d9d-4055-badd-09596fc9a43c", "widget": "input", "verify": {"enable": false, "hint": "请输入文本内容"}}, {"prop": "073f7b1f-afb9-4810-8896-d760197f5d02", "widget": "input", "verify": {"enable": true, "hint": "请输入正确的手机号码"}}, {"prop": "155ed883-93e5-4509-88db-ace73caac0d2", "widget": "input", "verify": {"enable": false, "hint": "请输入文本内容"}}], "fontFamily": "SourceHanSansSC-Regular", "fontStyle": "normal", "fontWeight": 400, "fontSize": 25, "textDecoration": "", "content": "-0123456789:交人入号名备姓年手择提数日月机注请输选", "contents": [{"color": "", "fontFamily": "SourceHanSansSC-Regular", "fontSize": 25, "fontStyle": "normal", "fontWeight": 400, "textDecoration": "", "content": "-0123456789:交人入号名备姓年手择提数日月机注请输选"}], "minWidth": 400, "maxWidth": 750, "minHeight": 509, "maxHeight": 5000, "version": "7.1.71", "events": [], "color": ""}
map: { "uuid": "0.548034526304074540", "type": "map", "title": "", "category": "", "opacity": 1, "padding": [ 0, 0, 0, 0 ], "width": 522.6666666666666, "height": 392, "left": 117, "top": 436, "transform": { "a": 1, "b": 0, "c": 0, "d": 1, "tx": 0, "ty": 0 }, "animations": [ { "type": "enter", "order": 4, "keyframes": { "opacity": [ 0, 1 ], "transform": [ "scale(0.7) matrix(1, 0, 0, 1, 0, 0)", "translate(0, 0) scale(1) matrix(1, 0, 0, 1, 0, 0)" ] }, "delay": 0, "duration": 1000, "fill": "both", "name": "渐变和缩放", "easing": "ease-in-out", "groupOrder": 0 } ], "boxShadow": null, "resize": 7, "dragable": true, "rotatable": true, "editable": true, "frozen": false, "hidden": false, "lock": false, "borderRadius": 0, "filter": { "contrast": 0, "sharpness": 0, "hueRotate": 0, "saturate": 0, "brightness": 0, "gaussianBlur": 0, "temperature": 0, "tint": 0 }, "watermarkEnable": false, "metaInfo": null, "linkId": "", "groupable": true, "flex": null, "backgroundColor": null, "backgroundEffect": null, "border": null, "blendMode": null, "maskInfo": { "enable": false, "showSelf": false, "imageUrl": "", "effectedResult": { "width": 0, "height": 0, "left": 0, "top": 0 } }, "suspension": { "enable": false, "top": null, "left": null, "right": null, "bottom": null }, "longitude": 118.186395, "latitude": 24.50876, "address": "厦门稿定科技", "zoom": 17, "borderWidth": [ 0, 0, 0, 0 ], "fontSize": 32, "borderRadiusX": 0, "borderRadiusY": 0, "borderColor": "#E0E5EA", "color": "#ffffffff", "version": "7.1.71", "imageDataUrl": "https://st-gdx.dancf.com/odyssey/uxms/20211026-111338-d7dd.png" }
## 2026-0315 新需求 - H5 组件库
### 需求概述
构建一个可复用的 H5 组件库系统,支持组件分类管理、标签检索、快速应用等功能。用户点击组件即可自动添加到 H5 编辑画布中,提高页面制作效率。
### 核心功能
**1. 组件管理**
- 组件类型:文字、图片、扩展(表单、定位、微信头像)、背景、音乐
- 每个组件包含完整的样式配置和内容数据JSON 格式)
- 提供组件缩略图预览和使用统计
**2. 分类管理**
- 两级分类结构:
- 一级分类:文字、图片、扩展、背景、音乐(固定 5 大类)
- 二级分类:用户可自定义添加(如标题文字、产品图片等)
- 只允许两层,不支持多级嵌套
**3. 标签系统**
- 每个组件可关联多个关键词标签
- 支持通过标签搜索相似组件
- 统计热门标签并推荐
**4. 前端交互**
- 点击组件卡片 → 自动添加到画布中心位置
- 支持拖拽组件到画布指定位置
- 智能吸附参考线
### 数据库设计
**需要 5 张表:**
1. 组件表:存储组件基本信息和配置数据
2. 分类表:存储两级分类结构
3. 组件分类关联表:组件与分类的多对多关系
4. 标签表:存储标签信息
5. 组件标签关联表:组件与标签的多对多关系
### 技术要点
- 时间字段统一使用 Unix 时间戳(秒级)
- 组件内容使用 JSON 格式存储
- 使用 MyBatis-Plus 作为 ORM 框架
- 标准分层架构Entity/DAO/Service/Controller/VO
### 开发计划
分 4 个阶段:基础 CRUD 功能 → 核心业务逻辑 → 性能优化 → 扩展功能,预计 10 天完成。