实现截图
技术栈
后端框架SpringBoot
采用springboot作为后台的框架,java框架具有简化配置和开发的效率。Spring框架目前是很多java开发者的首选框架,Spring主要有两大功能,控制反转和面向切面的编程。控制反转(IOC)可以实现代码的依赖注入,减少代码的耦合性,大大提高了软件质量,面向切面编程(AOP)主要是应用动态代理的技术对代码逻辑进行分离,可以实现对代码的重用,适合于很多中大型项目应用场景。基于Spring框架非常流行,spring可以与很多优秀的框架进行整合,比如ssh、ssm等框架,Spring的开发会带来一个严重的后果就时配置文件非常多,往往一个多框架开发的项目会有好几个配置文件,这些配置文件又具有关联性,往往一个错误会导致程序崩溃,很难快速的对错误的定位,因此采用框架开发带来的问题也需要用框架解决。Springboot是基于spring的,springboot框架实现了内部的整合,不需要开发人员配置大量的配置文件,springboot也集成了springmvc框架,它是基于MVC思想的一个框架,它在传统的servlet基础上进行了封装,前台通过View视图进行页面展示,后台入口通过Controller来控制请求接受、返回,通过设计Model层来进行数据的封装和各个逻辑层之间传递。SpringMVC框架实现了对代码的分层,提高了协同开发的效率。Mybatics是一个数据库ORM框架,通过各项配置实现数据库的增删改查等操作,是一个开源的基于java的持久层框架。Mybatics它是一个半自动化的框架,可以执行自定义SQL语言、存储过程等, Mybatics在jdbc的基础上实现了动态语句的功能,通过mapper接口和动态的配置完成高效的数据库操作。 运用springboot框架开发效率不仅利用了框架的强大的功能,同时也规避了框架所带来了繁琐的配置和框架的整合,springboot是一整套的项目开发技术方案,实现了快速开发。
前端框架Vue
关于Vue简介,百度百科给出的解释是:Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 是一个提供了 MVVM 风格双向数据绑定的 Javascript 库(无依赖别的js库,直接引入一个js文件就可以使用,跟jquery差不多),专注于View 层。它的核心是 MVVM 中的 VM,也就是 ViewModel。 ViewModel负责连接 View 和 Model,保证视图和数据的一致性,这种轻量级的架构让前端开发更加高效、便捷。
MySQL数据库
信息技术的快速发展使得传统的文件管理方法便显出它的不足。文件管理模式数据通用性差、不便于移植、在不同文件中存储大量重复信息、浪费存储空间、更新不便等。因此采用数据库管理技术符合信息时代的发展要求。关系型数据库是常见的、应用最广泛的数据库,关系型数据库代表有oracle、sql server和Mysql。这些流行的数据库都各自有各自的优势,有各自的应用场景。城市学院宿舍管理系统采用java进行开发,而java开发于mysql属于黄金搭档,java语言关于Mysql的研究非常的多,java与Mysql的组合性能强,开发技术全部免费。Mysql数据库相比较于传统的数据管理模式,Mysql数据库可以实现对数据的结构化分析与存储,可以利用编程语言进行数据库的操作。正常的Mysql安装包只有100多M,而且安装速度也快,对服务器的要求比较低,特别适合小型管理系统或网站。
核心代码
package com.sdms.controller;
import com.sdms.bean.system.Role;
import com.sdms.bean.system.User;
import com.sdms.service.RoleService;
import com.sdms.service.UserService;
import com.sdms.util.MyStringUtils;
import com.sdms.util.QueryResult;
import com.sdms.util.ResultUtils;
import com.sdms.vo.UserVO;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.annotation.Resource;
import javax.servlet.http.HttpSession;
import java.util.ArrayList;
import java.util.List;
@Controller
public class UserController {
@Resource
private UserService userService;
@Resource
private RoleService roleService;
//使用thymeleaf模板渲染,这里的字符串指的是URL
@RequestMapping("/admin/user-list")
public String toUserList(Model model) {
List<Role> roleList = roleService.findAll();
model.addAttribute("roleList", roleList);
return "admin/user-list";//这里的字符串指的是模板 /admin/user-list.html
}
//使用ajax在前端渲染
/**
* @param pageFromLayUI 计数方式是 1,2,3,4...,n 默认为 1 ;
* 但是 Pageable.page 的计数方式是 0,1,2,3,...,n-1 默认为 0
* @param limitFromLayUI 等于 Pageable.size
* @return 能被 layUI 接受的 JSON, 格式为 { "code": 0, "msg": "OK", count": 14, "data":[{},{},{}] }
*/
@RequestMapping("/admin/users")
@ResponseBody
public ResultUtils<UserVO> findAll(@RequestParam(value = "page", defaultValue = "1") Integer pageFromLayUI,
@RequestParam(value = "limit", defaultValue = "10") Integer limitFromLayUI,
@RequestParam(value = "queryParam[userId]", defaultValue = "") String userId,
@RequestParam(value = "queryParam[keyWord]", defaultValue = "") String keyWord,
@RequestParam(value = "queryParam[roleId]", defaultValue = "-1") String roleId,
@RequestParam(value = "queryParam[queryType]", defaultValue = "1") String queryType) {
//0精确搜索
if ("0".equals(queryType)) {
//精确查询
if (MyStringUtils.isNumeric(userId)) {
//传入的用户编号是数字
User user = userService.findUserById(Long.parseLong(userId));
if (null != user) {
UserVO userVO = UserVO.convert(user);
List<UserVO> userVOList = new ArrayList<>();
userVOList.add(userVO);
return ResultUtils.layUITable(1L, userVOList);
}
}
//传入的用户编号不是数字 或者 null==user
return ResultUtils.layUITable(0L, new ArrayList<>());
} else {
//模糊查询
User param = new User();
if (null == keyWord) {
keyWord = "";
}
String s = StringUtils.trimAllWhitespace(keyWord);
param.setUsername(s);
QueryResult<UserVO> queryResult;
if ("-1".equals(roleId) || !MyStringUtils.isNumeric(roleId)) {
//不限用户角色
queryResult = userService.queryByKeyWordLikeNoRole(pageFromLayUI - 1, limitFromLayUI, param);
} else {
//限制用户角色
queryResult = userService.queryByKeyWordLikeWithRole(pageFromLayUI - 1, limitFromLayUI, param, Long.parseLong(roleId));
}
//返回JSON结果
return ResultUtils.layUITable(queryResult.getTotalCount(), queryResult.getData());
}
}
//使用thymeleaf模板渲染
@RequestMapping("/admin/user-input")
//@RequiresPermissions(value = {"user-update", "user-add"}, logical = Logical.OR)
public String toUserInput(Long userId, Model model) {
if (-1 == userId) {
model.addAttribute("operation", "添加用户");
model.addAttribute("user", new User());
} else {
model.addAttribute("operation", "更新用户");
User user = userService.findUserById(userId);
model.addAttribute("user", user);
}
List<Role> roles = roleService.findAll();
model.addAttribute("roles", roles);
return "admin/user-input";//这里的字符串指的是 /admin/user-input.html
}
@RequestMapping("/admin/user-save")
//@RequiresPermissions(value = {"user-update", "user-add"}, logical = Logical.OR)
public String save(User user) {
userService.save(user);
return "redirect:/admin/user-list";
}
@RequestMapping("/admin/user-delete")
//@RequiresRoles(value = "admin")
//@RequiresPermissions({"user-delete"})
public String deleteById(Long userId) {
userService.deleteById(userId);
return "redirect:/admin/user-list";
}
@RequestMapping("/admin/user-deleteAll")
//@RequiresPermissions({"user-delete"})
//@RequiresRoles(value = "admin")
public String deleteById(String ids) {
userService.deleteAll(ids);
return "redirect:/admin/user-list";
}
@RequestMapping("/changeUserInfo")
public String changeUserInfo(User user, HttpSession session){
userService.changeUserInfo(user);
session.setAttribute("user",userService.findUserById(user.getId()));
return "redirect:/login";
}
}
源码获取
点击下面的链接获取源码