橙单-本地部署
介绍
橙单是一款代码生成工具,可导入多数据源和复杂的表关系,并生成开箱即用的前后端工程代码。
想要使用橙单生成我们的项目,咱们就从数据库开始。
生成工程项目
准备工作
本地配置好
Java
、Node
、vue@cli
的环境安装
MySQL
数据库和Maven
准备好
redis
服务一个
IDE
比如IntelliJ Idea
创建数据表
数据表创建以**t_**开头,需包含以下字段:
字段名称 | 类型 | 注释 |
---|---|---|
create_user | bigint | 创建人 |
create_time | datetime | 创建时间 |
delete_flag | int | 删除标识 |
update_user | bigint | 更新人 |
update_time | datetime | 更新时间 |
dept_id | bigint | 创建部门 |
数据库连接管理
打开下载好的橙单客户端(这里假设你已经购买了企业版并且已经新建了项目)
点击配置工程->数据库链接管理
![数据库链接管理](https://i.loli.net/2021/11/18/vKJA2McOj9Uwmuk.png)
选择数据库表
![选择数据库表](https://i.loli.net/2021/11/18/WogYVAMQeN7b5mR.png)
导入数据表
![导入数据表](https://i.loli.net/2021/11/18/ShlCmvRyqsa7GIO.png)
添加字段
然后点击编辑->添加字段
![添加字段](https://i.loli.net/2021/11/18/oAlu2Uv76rNLw9k.png)
服务管理
![服务管理](https://i.loli.net/2021/11/18/i6o7EH1DnMuSQTC.png)
添加数据库表
![数据表](https://i.loli.net/2021/11/18/jNbU7ITQvZxMzJG.png)
![数据表](https://i.loli.net/2021/11/18/ezTRY3vow26NLkH.png)
配置表
点击编辑
,配置表信息,可参考如下:
![配置信息](https://i.loli.net/2021/11/18/oOWIndCybre7Aiz.png)
其中:
- 实体对象名称首字母大写;
- 配置部门过滤字段、用户过滤字段、更新人字段、更新时间字段、创建人字段、创建时间字段、逻辑删除字段;
- 如果涉及流程,给主表的支持能力配置支持能力;
- 给每个字段配置查询过滤方式:无过滤、模糊过滤、范围过滤、普通过滤等;
- 主键父字段:设置父字段之后,把这个表作为字典的时候就是树形字典了,树形字典可以用级联组件去选择和显示,后端也会生成根据id获得某一层级数据的方法。
配置表字段规则
![表字段规则](https://i.loli.net/2021/11/18/dvngYS4Mb1zyreV.png)
![配置](https://i.loli.net/2021/11/18/UQxdatojOKYpv34.png)
文件上传字段如下:
![文件字段](https://i.loli.net/2021/11/18/GOnVdyw4pmY7IKQ.png)
至此,数据表的部分配置完毕。然后,我们需要将这张表转化为一个可视化菜单。因此,我们需要创建应用。
应用管理
![应用管理](https://i.loli.net/2021/11/18/pWL8mh9OJRBlM6S.png)
新建应用
![新建应用](https://i.loli.net/2021/11/18/plWQsOaqBEXfDiZ.png)
如果已经新建,忽略这一步,直接看下一步
表单管理
![表单管理](https://i.loli.net/2021/11/18/H9P6Q52YyogXJpv.png)
添加表单
![添加表单](https://i.loli.net/2021/11/18/PxNZgYs3kThuOXm.png)
![添加表单](https://i.loli.net/2021/11/18/gqHS6Pa2sfwuWL7.png)
配置详细表单信息
表单添加完成保存后,点击编辑
表单组件
![表单组件](https://i.loli.net/2021/11/18/ZG6rx4kbnO9DgSm.png)
![表单组件](https://i.loli.net/2021/11/18/AC2ELx3FleTGUuJ.png)
编辑表格
![第一步](https://i.loli.net/2021/11/18/suB5HE7ombdMk19.png)
![第二部](https://i.loli.net/2021/11/18/Sw68WXPEzGJfpDs.png)
![第三步](https://i.loli.net/2021/11/18/5WIPD9suYgXkrVb.png)
表单操作
![表单操作](https://i.loli.net/2021/11/18/d5QLGURXys9heEp.png)
假设这里我们给表单加上一个新建
的按钮,配置如下:
![表单操作](https://i.loli.net/2021/11/18/FTVkvKOScflowdX.png)
至此,我们可以点击表单预览看到我们设计好的界面原型:
![表单预览](https://i.loli.net/2021/11/18/w65JHzbqteNAQrk.png)
![表单预览](https://i.loli.net/2021/11/18/IDtQ3JUzc7nMK14.png)
至此,应用管理部分已完成。接下来我们需要把我们设计好的工程导出至本地。
生成工程
生成工程
点击生成工程
,生成好的工程结构如下:
![工程结构](https://i.loli.net/2021/11/18/Dlh1BfZYyE8dFzL.png)
其中,dist_app
为后端工程目录,web-project
为前端工程目录。
运行SQL
脚本
在工程的admin-project/dist_app/zz-resource/db-scripts
中有4个SQL
脚本,咱们需要运行第1、2、4个。
注意:如果这不是你第一次生成工程,直接运行这三个脚本的话,原本数据库的数据会被清空,因为这三个脚本执行的操作大多都是删除表格重建的过程。因此,如果你不想丢失之前的数据,你可以用官方提供的文本对比工具(下载地址)将最新版和最近一版的SQL
脚本进行对比,然后执行所有的新增
代码既可。
信息配置
dist_app/application-webadmin/src/main/resources/application.yml
配置数据库信息
![数据库信息](https://i.loli.net/2021/11/18/VTP1JjXpOgeuZct.png)
配置redis
信息
![redis](https://i.loli.net/2021/11/18/jYsdvryz4ZVg7GA.png)
后端运行:运行WebAdminApplication
前端运行:(npm install
)npm run dev
效果
接下来,我们继续研究主子表的配置。