Eladmin介绍及使用教程

Eladmin是一套基于Spring Boot 2.5.2 和 Vue 3.1.3及Element-Plus 开发的开源、易用的后台管理系统，可以帮助开发者们快速构建后端数据服务，前端模型展示。

一、Eladmin侧边栏添加

Eladmin侧边栏是前端页面左侧固定区域，默认支持多级菜单的形式展示，可以通过简单的配置，方便地添加左侧菜单。 使用方法： 在ElAdmin后端管理系统的src/main/mate-inf/resources/static/下找到menu.json文件。 按照以下JSON格式添加菜单：

{
  "name": "menu-name", // 菜单名字
  "icon": "icon-name", // 菜单图标
  "url": "url-name"  // 菜单指向页面的路径
}

完整示例代码如下：

{
  "name":"仪表盘",
  "icon":"dashboard",
  "url":"/dashboard"
},
{
  "name":"系统管理",
  "icon":"setting",
  "children":[
    {
      "name": "角色管理",
      "icon": "",
      "url": "/system/role"
    },
    {
      "name": "用户管理",
      "icon": "",
      "url": "/system/user"
    }
  ]
}

二、Eladmin学习视频

请移步官网el-admin涵盖ElAdmin详细教程视频。

三、Eladmin 主题切换

在Eladmin后台管理系统的头部右侧，提供了主题切换功能，可以在线切换主题，不影响后端逻辑的同时，使前端展示更加美观。 使用方法： 在Eladmin 后台管理系统，打开网页，在右上角选择框内选择不同的主题即可快速切换。

四、Eladmin 注解风格

Eladmin 提供了基于注解风格的访问权限控制，可以更好地实现接口级别的权限控制，提高代码运行效率。 使用方法： 可以通过使用@PreAuthorize或@Secured注解来标注一个接口需要哪些角色的访问权限：

@PreAuthorize("hasAnyAuthority('ROLE_ADMIN')")
@PostMapping
public ApiResponse addUser(@RequestBody UserDto userDto){}

完整示例代码如下：

@Api(tags = "系统：用户管理")
@RestController
@RequestMapping("/system/user")
public class UserController {

    @Autowired
    private UserService userService;

    @RequiresPermissions("system:user:view")
    @GetMapping
    public ApiResponse userList(UserQueryCriteria criteria, Pageable pageable){
        return ApiResponse.success(userService.queryAll(criteria,pageable));
    }

    // 省略其他接口...

}

五、Eladmin 日志记录

Eladmin 提供了基于AOP拦截的日志记录功能，可以实时地记录接口访问情况，便于开发者们进行后续问题定位和解决。 使用方法： 可以通过使用@Log注解来标注一个接口需要记录日志：

@Log("删除字典")
@ApiOperation("删除字典")
@DeleteMapping(value = "/{id}")
public ApiResponse delete(@PathVariable Long id){
    dictService.delete(id);
    return ApiResponse.success(null);
}

完整示例代码如下：

@Aspect
@Component
public class ApiLogAspect {

    @Autowired
    private LogRepository logRepository;

    @Autowired
    private HttpServletRequest request;

    private ThreadLocal startTime = new ThreadLocal<>();

    /**
     * 自定义注解拦截
     * @param log
     */
    @Around("@annotation(log)")
    public Object around(ProceedingJoinPoint joinPoint, Log log) throws Throwable {
        String username = SecurityUtils.getUsername();
        if (log != null) {
            // 执行方法所花费的时间
            long duration = System.currentTimeMillis() - startTime.get();
            // 保存日志信息
            SysLog sysLog = new SysLog(log.value(), joinPoint.getSignature().getDeclaringTypeName() + "." + joinPoint.getSignature().getName());
            sysLog.setUsername(username);
            sysLog.setTime(duration);
            sysLog.setCreateTime(new Date());
            sysLog.setIp(IpUtils.getIpAddr(request));
            logRepository.save(sysLog);
        }
        return joinPoint.proceed();
    }

    // @Before,@After,@AfterReturning与上述带注解拦截注解类似，这里不再赘述，可进行class的拦截

}

  

以上便是Eladmin的介绍及使用教程，希望对于开发者们进行后端数据服务和前端模型展示，提供一些有价值的参考。