智能销售系统（二）分页/搭建
2019-09-30 本文已影响0人
磨陀货_
BaseRepository
Jpa要求其主键都必须实现Serializable
/**
* JPA的父类主键必须实现Serializable接口
*
* @NoRepositoryBean ：告诉SpringDataJpa这里是一个父接口，不要实现
*/
@NoRepositoryBean
public interface BaseRepository<T,ID extends Serializable>
extends JpaRepository<T,ID>,JpaSpecificationExecutor<T> {
}
service
IBaseService
public interface IBaseService<T,ID extends Serializable>{
//添加或者修改
void save(ID id);
//删除功能
void delete(ID id);
//查询一条数据
T getOne(ID id);
//查询所有数据
List<T> getAll();
//根据查询条件查询数据
List<T> queryAll(BaseQuery query);
//根据查询 条件查询分页数据
Page<T> queryPage(BaseQuery query);
//支持传JPQL进行查询
List queryByJpql(String jpql,Object... params);
}
BaseServiceImpl（基本CRUD）高级查询
@Transactional(readOnly = true,propagation = Propagation.SUPPORTS)
public abstract class BaseServiceImpl<T,ID extends Serializable>
implements IBaseService<T,ID> {
@Autowired
private BaseRepository<T,ID> baseRepository;
@PersistenceContext
private EntityManager entityManager;
@Override
@Transactional
public void save(T t) {
baseRepository.save(t);
}
@Override
@Transactional
public void delete(ID id) {
baseRepository.delete(id);
}
@Override
public T getOne(ID id) {
return baseRepository.getOne(id);
}
@Override
public List<T> getAll() {
return baseRepository.findAll();
}
//根据查询条件拿到对应的数据
@Override
public List<T> queryAll(BaseQuery query) {
//获取查询规则
Sort sort = query.creadteSort();
//根据规则获取数据并返回
return baseRepository.findAll(sort);
}
//根据查询条件获取分页的数据
@Override
public Page<T> queyPage(BaseQuery query) {
//1.获取查询规则
Sort sort = query.creadteSort();
//2.获取排序对象 creatSpec
Specification spec = query.createSpec();
//3.获取分页对象
Pageable bageable = new PageRequest(query.getJpaPage(), query.getPageSize(), sort);
//4.返回分页对象
return baseRepository.findAll(spec, bageable);
}
//根据JPQL获取数据
@Override
public List queryByJpql(String jpql, Object... params) {
//拿到query独享（JPa的查询对象）
Query query = entityManager.createQuery(jpql);
//把参数传到query中
//判断params参数是否为空，不为空就循环 ，然后拿到对应的值，在放到query中
if (params != null){
for (int i = 0; i < params.length; i++){
Object jar = params[i];
query.setParameter(i+1,jar);
}
}
//返回查询的数据
return query.getResultList();
}
}
IEmployeeService
public interface IEmployeeService extends IBaseService<Employee,Long>{
}
- 里面一句代码都没有【为什么没有代码还要写？--- 因为现在没有不代表以后没有 以后里面会写很多】
EmployyeServiceImpl
@Service
public class EmployeeServiceImpl extends BaseServiceImpl<Employee,Long> implements IEmployeeService{
}
applicationContext-mvc.xml（加上上下文）记住id一定要是这个
<!-- 上传解析器(id必需是：multipartResolver名称) -->
<!-- 错误：提示告诉开发者你没有配置文件上传解析器。 -->
<bean id = "multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!--设置上传文件的最大尺寸为1MB-->
<property name="maxUploadSize">
<value>1048576</value>
</property>
</bean>
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
id="WebApp_ID" version="3.1">
<!-- 读取SpringMVC -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:applicationContext.xml</param-value>
</context-param>
<!-- 启动Spring的监听器 -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<!-- 配置解决中文乱码的问题 -->
<filter>
<filter-name>characterEncodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>characterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!-- 配置核心控制器-->
<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<!-- 告诉SpringMVC到哪里去找配置文件 -->
<param-name>contextConfigLocation</param-name>
<!-- 注意:这里只读取springmvc的xml -->
<param-value>classpath:applicationContext-mvc.xml</param-value>
</init-param>
<!-- Servlet默认在每一次访问的时候创建 -->
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dispatcher</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
</web-app>
BaseController
Controller
@Controller
@RequestMapping("/employee")
public class EmployeeController extends BaseController{
@Autowired
private IEmployeeService employeeService;
@RequestMapping("/index")
public String index(){
return "employee";
}
@RequestMapping("/list")
@ResponseBody
public List<Employee> list(){
return employeeService.getAll();
}
@RequestMapping("/page")
@ResponseBody
public UIPage<Employee> page(EmployeeQuery query){
return new UIPage<>(employeeService.queyPage(query));
}
}
employee.jsp（Easyui）
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
<%--easyui的css样式--%>
<link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css">
<%--easyui的图标支持--%>
<link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css">
<%--jQuery的支持--%>
<script type="text/javascript" src="/easyui/jquery.min.js"></script>
<%--easyui的核心功能--%>
<script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
<%--中文支持--%>
<script src="/easyui/locale/easyui-lang-zh_CN.js"></script>
<%--引入自己的js--%>
<script src="/js/model/employee.js"></script>
<%--<link rel="stylesheet" type="text/css" href="/easyui/themes/demo.css">--%>
</head>
<div>
<form id="searchForm">
用户名: <input name="username" class="easyui-textbox" style="width:80px">
邮件: <input name="email" class="easyui-textbox" style="width:80px">
<a href="javascript:;" data-method="search" class="easyui-linkbutton" iconCls="icon-search">查询</a>
</form>
</div>
<table id="productGrid" class="easyui-datagrid"
data-options="url:'/employee/page',fitColumns:true,singleSelect:true,fit:true,toolbar:'#tb',pagination:true">
<thead>
<tr>
<th data-options="field:'id',width:100">编码</th>
<th data-options="field:'username',width:100">名称</th>
<th data-options="field:'email',width:100">名称</th>
<%--<th data-options="field:'age',width:100">名称</th>--%>
</tr>
</thead>
</table>
<div id="tb">
<a href="#" data-cmd="add" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">添加</a>
<a href="#" data-cmd="edit" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">修改</a>
<a href="#" data-cmd="delete" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true">删除</a>
</div>
<div style="margin:20px 0;"></div>
<div class="easyui-panel">
<div class="easyui-pagination" data-options="total:114"></div>
</div>
</body>
employee.js
//页面读取完毕后执行
$(function(){
//常用的组件先获取到
var productGrid = $("#productGrid");
//所有带来data-cmd属性的元素都加上方法
$("*[data-cmd]").on("click",function(){
//谁点击,this就是谁
var methodName = $(this).data("cmd");
//执行这个方法(动态调用)
zx[methodName]();
})
zx = {
add(){ alert("add")},
edit(){alert("edit")},
delete(){
//1.获取选中的行(第一个参数是方法名)
var row = productGrid.datagrid("getSelected");
//2.如果没有这一行,给出提示
if(!row){
$.messager.alert('提示','请选择后再操作',"info");
return;
}
//3.如果有这一行，给出提示
$.messager.confirm('确认','您真的要狠心删除我嘛？',function(r){
if (r){
//4.如果确定要删除,发送（Ajax）请求进行删除
$.post("/employee/delete",{id:row.id},function(result){
//5.删除完成后，成功就删除,失败就给提示
if(result){
//重新加载页面
productGrid.datagrid("reload");
}else{
$.messager.alert('提示','兄台,以后努力',"error");
}
})
}
});
}
};
})
Tomcat安装启动
安装流程教学网站：
分页
fit="true" --- 沾满整个页面
pagination:true --- 分页栏
-
完成之后后台已经可以分页了
-
但是前台不显示 因为两者格式不对
easyui就要两种 但是我们现在的有很多 所以很多都是不需要的
第一种方案：
第二方案：（优雅版）
-
抽个公共包出来了
js改成6的版本
知识点
1.注解有时候是可以被继承的，但也有的不可以被继承的
2.ZipException：有包损坏
3.toolbar:‘#id’ ---添加工具
注解篇
@NoRepositoryBean --- 告诉SringDataJpa这是个父接口，不要实现
单词篇
total --- 总条数
rows --- 每一页所有数据
