Erupt框架入门案例(一)

什么是 erupt ?

erupt 是一个低代码 全栈类 框架,它使用 Java 注解 来生成页面以及增、删、改、查、权限控制等后台功能,不需要懂前端,也不需要写繁琐的CURD,自动创建表结构,controller / service / sao / mapper 文件都不用创建,极大减少开发工作量,将后台开发速度提升到极致。

取代代码生成器,开发后台管理系统更优解!

开源项目地址:https://gitee.com/erupt/erupt
入门案例地址:https://gitee.com/erupt/erupt-example.git
官网文档:https://www.yuque.com/yuepeng/erupt/foa2bt
在线体验地址:https://www.erupt.xyz/demo/#/passport/login

项目部署

环境要求

• Java 版本 1.8及以上
• Spring Boot 版本 2.0 及其以上
• 浏览器要求 IE11 及以上,或其他现代浏览器

前置知识

• Java、Tomcat、Maven
• Spring Boot、Hibernate
• Database:SQL + MySQL / PostgreSQL / SQL Server / H2 / Oracle

添加依赖

<!--用户权限管理-->
<dependency>
  <groupId>xyz.erupt</groupId>
  <artifactId>erupt-upms</artifactId>
  <version>${erupt.version}</version>
</dependency>
<!--接口数据安全-->
<dependency>
  <groupId>xyz.erupt</groupId>
  <artifactId>erupt-security</artifactId>
  <version>${erupt.version}</version>
</dependency>
<!--后台WEB界面-->
<dependency>
  <groupId>xyz.erupt</groupId>
  <artifactId>erupt-web</artifactId>
  <version>${erupt.version}</version>
</dependency>

erupt版本要和SpringBoot对应一致

部署到本地之后,唯一需要注意的是他用的MySQL版本可能是8,所以如果你本地还是MySQL5.7,需要自己手动锁定版本号!准备工作完成之后,启动主启动类!在这里插入图片描述
这个框架使用的持久层是JPA,所以他会自动的建表(建库还是要自己来的),最新版的示例代码更完善,只要把官网的实例跑一下看一下,应付一般的需求还是OK的!

自定义菜单

启动成功后,前往系统管理 → 菜单维护 → 新增,将已定义好的演示类添加到菜单中,填写数据如下:
菜单名称 菜单类型 类型值(类名) 描述

菜单名称菜单类型类型值(类名)描述
入门示例表格Simple
文章管理表格Article
树示例TreeView
组件示例表格Component各类组件与事件代理使用方法
复杂示例表格Complex动态下拉列表与定义按钮等功能
多行操作功能按钮ComplexBtn控制 Complex 多行操作 按钮的权限,最好隐藏
链接链接https://www.erupt.xyz
新页面新页签https://github.com/erupts/erupt

在这里插入图片描述
在这里插入图片描述
创建完成之后,点击上面的保存!然后刷新浏览器看下效果!
在这里插入图片描述
新增:在这里插入图片描述
修改:在这里插入图片描述
对比若依、jeecg等代码生成框架,erupt最大的优势就在于基于纯注解开发,在开发后台管理系统方面,有着相当强的优越性!并且组件丰富,足以应对一般开发过程中,企业常见需求!

补充上传下载组件

package com.example.demo.model;

import xyz.erupt.annotation.Erupt;
import xyz.erupt.annotation.EruptField;
import xyz.erupt.annotation.sub_erupt.Power;
import xyz.erupt.annotation.sub_field.Edit;
import xyz.erupt.annotation.sub_field.EditType;
import xyz.erupt.annotation.sub_field.View;
import xyz.erupt.annotation.sub_field.sub_edit.Search;
import xyz.erupt.jpa.model.BaseModel;

import javax.persistence.Entity;
import javax.persistence.Table;
import javax.persistence.Transient;
import java.util.Date;

/**
 * @author yuepeng
 * @date 2020/12/28 11:24
 */
@Table(name = "demo_simple")
@Entity
@Erupt(name = "简单示例",
        power = @Power(add = true, delete = true,
                edit = true, query = true,
                importable = true, export = true))
public class Simple extends BaseModel
{

    @EruptField(
            views = @View(title = "文本"),
            edit = @Edit(title = "文本", notNull = true, search = @Search)
    )
    private String input;

    @EruptField(
            views = @View(title = "数值", sortable = true),
            edit = @Edit(title = "数值", search = @Search)
    )
    private Float number;

    @EruptField(
            views = @View(title = "布尔"),
            edit = @Edit(title = "布尔")
    )
    private Boolean bool;

    @EruptField(
            views = @View(title = "时间"),
            edit = @Edit(title = "时间", search = @Search(vague = true))
    )
    private Date date;


    @EruptField(
            views = @View(title = "滑动条"),
            edit = @Edit(title = "滑动条", type = EditType.SLIDER, search = @Search(vague = true))
    )
    private Integer slide;

    @EruptField(
            views = @View(title = "地图"),
            edit = @Edit(title = "地图", type = EditType.MAP)
    )
    private String map;
}

官方文档对@Power做了说明

public @interface Power {
    boolean add() default true; //数据新增功能

    boolean delete() default true; //数据删除功能

    boolean edit() default true; //数据修改功能

    boolean query() default true; //输入查询功能

    boolean viewDetails() default true; //数据查看功能

    boolean export() default false; //数据导出功能

    boolean importable() default false; //数据导入功能

    //实现此接口动态控制权限
    Class<? extends PowerHandler> powerHandler() default PowerHandler.class;
}

从源码中我们能看出,数据的导入导出默认都是关闭的,我们只要在注解中显示的定义成true就可以了!
这是官网中最简单的示例了,更多好玩的功能,尽在https://www.erupt.xyz/#!/doc,如果想解锁更多有趣玩法可以加群:821389129。

  • 8
    点赞
  • 30
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Erupt 框架中,可以通过 `@Button` 注解来实现自定义按钮的功能。下面是一个简单的示例,以实现一个“清空数据”按钮为例: 1. 首先,在你要自定义按钮的实体类中,添加一个`@Button`注解,并且指定按钮的名称和图标: ```java @Entity @Table(name = "t_user") @Erupt(name = "用户管理") public class User { // 省略其他字段 @Button("清空数据") @Icon(value = "fa fa-trash", color = Icon.Color.RED) public void clearData() { // 清空数据的具体实现逻辑 } } ``` 2. 在 `EruptConfig` 中,需要添加一个 `EruptButtonModel` 来对按钮进行配置: ```java @Configuration public class EruptConfig { @Bean public EruptButtonModel clearDataButton() { return EruptButtonModel.builder() .setTitle("清空数据") .setFetchMethod("/erupt-api/user/clearData") .setType(EruptButtonModel.Type.TIPS) .setMessage("你确认要清空所有数据吗?此操作不可恢复!") .setIcon(new FontAwesomeIcon("fa fa-trash", Icon.Color.RED)) .build(); } } ``` 注意,这里的 `fetchMethod` 属性是指定了按钮点击后将会触发的请求的路径。在这个路径中,需要定义一个处理请求的控制器方法。 3. 在控制器中,添加一个处理按钮请求的方法: ```java @RestController @RequestMapping("/erupt-api/user") public class UserController { @Autowired private UserService userService; @PostMapping("/clearData") public void clearData() { userService.clearData(); } } ``` 这里的 `UserService` 是你自己定义的服务类,用于处理具体的业务逻辑。 4. 最后,在你的页面中,使用 `erupt-buttons` 标签来渲染按钮: ```html <erupt-buttons :buttons="buttons"></erupt-buttons> ``` 在对应的 Vue 实例中,需要定义一个 `buttons` 对象,来指定要显示的按钮。在这个对象中,可以引用前面在 `EruptConfig` 中定义的 `EruptButtonModel`: ```javascript data() { return { buttons: [ clearDataButton ] } } ``` 至此,一个简单的自定义按钮就实现了。当用户点击按钮时,将会弹出提示框,询问用户是否确认进行清空数据操作。如果用户确认操作,将会触发后台的 `clearData` 方法进行清空数据的操作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值