转自:https://blog.csdn.net/cs_hnu_scw/article/details/80718467#commentBox
小白:起床起床,,,快起床!!!
我:怎么怎么了,小白你到底又怎么了。。
小白:我发现在Web系统中,分页是一种很常见的功能,可是,我之前写的方法都比较麻烦,移植性不是很高,有没有什么好办法可以快速实现分页的呢?
我:确实是的,分页功能几乎在每个系统中都是存在的,它的实现也是有很多种方式的。
小白:对呀,有没有什么好方法呢?
我:这个嘛,对于分页来说的话,其实我们在复杂的系统中,有很多特别的处理,这些都是需要我们进行自定义的编写处理的。但是,如果你就想实现一种分页效果的话,我可以给你提提建议。
小白:好哟,赶紧说赶紧说!!
我:害我又没有懒觉睡,真是的。那接下来,我跟你说说用一种分页插件如何进行快速实现分页效果吧。
我们在任何的系统中,分页功能是必不可少的。然而,对于这个功能如果有一种快速开发的实现方式,当然可以节省我们很多的时间了。接下来,我就给大家基于不同的环境来说说如何使用一个分页插件:pagehelper。。不过,大家可要记住了,对于不同的情况,都要认真分析场景,而不是只会套用哦。。当然,如果你想用最原始的方式实现,也是可以的,我也写了两种方法,会在讲解完后,贴到后面,如果有需要的就进行稍微查看即可(但是,不是非常理想,仅供参考)。
使用步骤:
(1)在pom.xml文件中引入依赖库
-
-
-
com.github.pagehelper
-
pagehelper-spring-boot-starter
-
1.2.3
-
(2)在application.properties中添加分页配置
-
# 配置pageHelper分页插件的内容
-
pagehelper.helper-dialect=mysql
-
pagehelper.reasonable=
true
-
pagehelper.support-methods-arguments=
true
-
pagehelper.params=count=countSql
或者在application.yml文件中添加分页配置
-
pagehelper:
-
helperDialect: mysql
-
reasonable:
true
-
supportMethodsArguments:
true
-
params: count=countSql
(3)进行使用。(可以在controller层或者service层使用即可)
-
/**
-
* 查询所有的person内容
-
* @return
-
*/
-
@RequestMapping(value =
"/list")
-
public String jumpJsp(Map
result) {
-
PageHelper.startPage(
3 ,
3);
-
List
personList = personService.findPerson();
-
//得到分页的结果对象
-
PageInfo
personPageInfo =
new PageInfo<>(personList);
-
//得到分页中的person条目对象
-
List
pageList = personPageInfo.getList();
-
//将结果存入map进行传送
-
result.put(
"pageInfo" , pageList);
-
return
"person_list";
-
}
解析:
(1)PageHelper.startPage(pageNum , pageSize),这个方法就是类似我们数据库操作的limit start , count
(2)得到的对象PageInfo里面包含很多的字段信息,这个可以自己看源码,非常详细
(3)如果我们只想得到分页处理之后我们的实体对象的结果,那么就调用PageInfo对象的getList()方法即可。
(4)这种配置使用的方式是最通用的方式,也就是对于环境搭建不同方式都可以利用这种使用方法。
问题:如果运行时出现,org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'com.github.pagehelper.autoconfigure.PageHelperAutoConfiguration': 这个错误。
解决办法:这是由于分页插件pagehelper的版本和mybatis不兼容的原因,修改分页插件的版本即可。
使用步骤:
(1)在pom.xml文件中,添加分页插件的依赖(注意和第一种方法的区别)
-
-
-
com.github.pagehelper
-
pagehelper
-
4.1.6
-
(2)在mybatis的配置文件中添加如下的插件
-
-
-
-
"com.github.pagehelper.PageHelper">
-
-
"dialect" value=
"mysql"/>
-
-
(3)在controller或者service层进行使用插件
-
/**
-
* 查询所有的person内容
-
* @return
-
*/
-
@RequestMapping(value =
"/list")
-
public String jumpJsp(Map
result) {
-
PageHelper.startPage(
1 ,
5);
-
List
personList = personService.findPerson();
-
//得到分页的结果对象
-
PageInfo
personPageInfo =
new PageInfo<>(personList);
-
//得到分页中的person条目对象
-
List
pageList = personPageInfo.getList();
-
//将结果存入map进行传送
-
result.put(
"pageInfo" , pageList);
-
return
"person_list";
-
}
分析:对于这种方法的话,适用于对整合环境还是通过mybatis.xml的形式,所以,这种是具有针对性的一种情况。使用步骤:
(1)在pom.xml文件中添加分页插件的依赖
-
-
-
com.github.pagehelper
-
pagehelper
-
4.1.6
-
(2)添加下面一个类
-
package com.hnu.scw.config;
-
-
import com.github.pagehelper.PageHelper;
-
import org.apache.ibatis.plugin.Interceptor;
-
import org.mybatis.spring.SqlSessionFactoryBean;
-
import org.springframework.context.annotation.Bean;
-
import org.springframework.context.annotation.Configuration;
-
-
import java.util.Properties;
-
-
/**
-
* @ Author :scw
-
* @ Date :Created in 下午 2:48 2018/6/17 0017
-
* @ Description:用于配置分页插件的使用
-
* @ Modified By:
-
* @Version: $version$
-
*/
-
@Configuration
-
public
class PgeHeplerConfig {
-
//将分页插件注入到容器中
-
@Bean
-
public PageHelper pageHelper() {
-
//分页插件
-
PageHelper pageHelper =
new PageHelper();
-
Properties properties =
new Properties();
-
properties.setProperty(
"reasonable",
"true");
-
properties.setProperty(
"supportMethodsArguments",
"true");
-
properties.setProperty(
"returnPageInfo",
"check");
-
properties.setProperty(
"params",
"count=countSql");
-
pageHelper.setProperties(properties);
-
-
//添加插件
-
new SqlSessionFactoryBean().setPlugins(
new Interceptor[]{pageHelper});
-
return pageHelper;
-
}
-
-
}
或者如下的代码:
-
package com.hnu.scw.config;
-
import com.github.pagehelper.PageHelper;
-
import org.springframework.context.annotation.Bean;
-
import org.springframework.context.annotation.Configuration;
-
import java.util.Properties;
-
-
/**
-
* @ Author :scw
-
* @ Date :Created in 下午 2:48 2018/6/17 0017
-
* @ Description:用于配置分页插件的使用
-
* @ Modified By:
-
* @Version: $version$
-
*/
-
@Configuration
-
public
class PgeHeplerConfig {
-
//将分页插件注入到容器中
-
@Bean
-
public PageHelper pageHelper() {
-
//分页插件
-
PageHelper pageHelper =
new PageHelper();
-
Properties properties =
new Properties();
-
properties.setProperty(
"reasonable",
"true");
-
properties.setProperty(
"supportMethodsArguments",
"true");
-
properties.setProperty(
"helperDialect",
"mysql");
-
properties.setProperty(
"params",
"count=countSql");
-
pageHelper.setProperties(properties);
-
return pageHelper;
-
}
-
-
}
还可以直接在springboot的启动类添加下面的代码即可。(其实都一样的道理,因为上面的类都是用了@Configuration注解配置了的,也就是添加到了容器中)
-
//将分页插件注入到容器中
-
@Bean
-
public PageHelper pageHelper() {
-
//分页插件
-
PageHelper pageHelper =
new PageHelper();
-
Properties properties =
new Properties();
-
properties.setProperty(
"reasonable",
"true");
-
properties.setProperty(
"supportMethodsArguments",
"true");
-
properties.setProperty(
"helperDialect",
"mysql");
-
properties.setProperty(
"params",
"count=countSql");
-
pageHelper.setProperties(properties);
-
return pageHelper;
-
}
(3)直接使用
-
/**
-
* 查询所有的person内容
-
* @return
-
*/
-
@RequestMapping(value =
"/list")
-
public String jumpJsp(Map
result) {
-
PageHelper.startPage(
1 ,
5);
-
List
personList = personService.findPerson();
-
//得到分页的结果对象
-
PageInfo
personPageInfo =
new PageInfo<>(personList);
-
//得到分页中的person条目对象
-
List
pageList = personPageInfo.getList();
-
//将结果存入map进行传送
-
result.put(
"pageInfo" , pageList);
-
return
"person_list";
-
}
使用步骤:(其实这个就类似情景一种的方式二,换汤不换药)
(1)在pom.xml中添加分页插件的依赖
-
-
-
com.github.pagehelper
-
pagehelper
-
4.1.6
-
(2)在mybatis中的配置文件SqlMapConfig.xml(这个名字是你自己搭建环境所取的,就是配置一些关于Mybatis的配置文件)添加分页插件。
-
-
-
-
"com.github.pagehelper.PageHelper">
-
-
"dialect" value=
"mysql"/>
-
-
(3)在controller层或者service实现层中使用分页。
-
/**
-
* 查询所有的person内容
-
* @return
-
*/
-
@RequestMapping(value =
"/list")
-
public String jumpJsp(Map
result) {
-
PageHelper.startPage(
1 ,
8);
-
List
personList = personService.findPerson();
-
//得到分页的结果对象
-
PageInfo
personPageInfo =
new PageInfo<>(personList);
-
//得到分页中的person条目对象
-
List
pageList = personPageInfo.getList();
-
//将结果存入map进行传送
-
result.put(
"pageInfo" , pageList);
-
return
"person_list";
-
}
(1)pagehelper插件本身就是基于Mybatis这种框架进行开发的插件。所以,主要都是针对Mybatis数据操作的架构的。
(2)上面描述了多种情况的具体配置方式,都是自身经过实际开发编写的,而且对于不同的情景,各位要理解为什么要这样,这虽然只是讲解了分页插件的使用,当遇到其他插件的时候,都可以类似进行处理。
(3)如果是用到的SSH(Spring+SpringMVC+Hibernate)或者SpringBoot+Hibernate这样的架构的时候,这个插件是无法使用的,就需要自己通过hibernate的形式进行处理,比如可以用HQL语法或者Criteria进行处理即可。毕竟,Hibernate是一种全自动化的数据库操作框架。
下面的内容,是关于原始方式实现分页效果,仅供各位进行参考(其中是通过实例来帮助大家进行分析)
分页,这个功能,我想在很多的系统中,都有用到过吧。这已经是非常非常普通的应用功能了,所以就需要将这个功能能自定义为一个jsp标签的话,那就肯定很方便了。所以下面就说一下,如果实现这个功能。
步骤:
(1)写两个Java类,其中Page,很简单就是一个分页对象,然后NavigationTag这个就是自定义标签的核心映射类了(如果对于这个自定义标签的流程不是很清楚的话,可以看看我之前写的J2EE的知识点中的内容,都很详细介绍了)。
Page:
-
package com.hnuscw.common.utils;
-
import java.util.List;
-
public class Page
<T> {
-
-
private int total;
-
private int page;
-
private int size;
-
private List
<T> rows;
-
public int getTotal() {
-
return total;
-
}
-
public void setTotal(int total) {
-
this.total = total;
-
}
-
public int getPage() {
-
return page;
-
}
-
public void setPage(int page) {
-
this.page = page;
-
}
-
public int getSize() {
-
return size;
-
}
-
public void setSize(int size) {
-
this.size = size;
-
}
-
public List
<T> getRows() {
-
return rows;
-
}
-
public void setRows(List
<T> rows) {
-
this.rows = rows;
-
}
-
-
}
Navigation:
-
package com.hnuscw.common.utils;
-
import java.io.IOException;
-
import java.util.Map;
-
import javax.servlet.http.HttpServletRequest;
-
import javax.servlet.jsp.JspException;
-
import javax.servlet.jsp.JspWriter;
-
import javax.servlet.jsp.tagext.TagSupport;
-
import org.apache.taglibs.standard.tag.common.core.UrlSupport;
-
-
/**
-
* 显示格式 上一页 1 2 3 4 5 下一页
-
*/
-
public class NavigationTag extends TagSupport {
-
static final long serialVersionUID = 2372405317744358833L;
-
-
/**
-
* request 中用于保存Page
<E> 对象的变量名,默认为“page”
-
*/
-
private String bean = "page";
-
-
/**
-
* 分页跳转的url地址,此属性必须
-
*/
-
private String url = null;
-
-
/**
-
* 显示页码数量
-
*/
-
private int number = 5;
-
-
@Override
-
public int doStartTag() throws JspException {
-
JspWriter writer = pageContext.getOut();
-
HttpServletRequest request = (HttpServletRequest) pageContext.getRequest();
-
Page page = (Page)request.getAttribute(bean);
-
if (page == null)
-
return SKIP_BODY;
-
url = resolveUrl(url, pageContext);
-
try {
-
//计算总页数
-
int pageCount = page.getTotal() / page.getSize();
-
if (page.getTotal() % page.getSize() > 0) {
-
pageCount++;
-
}
-
writer.print("
<nav>
<ul class=\"pagination\">");
-
//显示“上一页”按钮
-
if (page.getPage() > 1) {
-
String preUrl = append(url, "page", page.getPage() - 1);
-
preUrl = append(preUrl, "rows", page.getSize());
-
writer.print("
<li>
<a href=\"" + preUrl + "\">上一页
a>
li>");
-
} else {
-
writer.print("
<li class=\"disabled\">
<a href=\"#\">上一页
a>
li>");
-
}
-
//显示当前页码的前2页码和后两页码
-
//若1 则 1 2 3 4 5, 若2 则 1 2 3 4 5, 若3 则1 2 3 4 5,
-
//若4 则 2 3 4 5 6 ,若10 则 8 9 10 11 12
-
int indexPage = (page.getPage() - 2 > 0)? page.getPage() - 2 : 1;
-
for(int i=1; i
<= number && indexPage <= pageCount; indexPage++, i++) {
-
if(
indexPage ==
page.getPage()) {
-
writer.print( "<
li
class=
\"
active\">
<a href=\"#\">"+indexPage+"
<span class=\"sr-only\">(current)
span>
a>
li>");
-
continue;
-
}
-
String pageUrl = append(url, "page", indexPage);
-
pageUrl = append(pageUrl, "rows", page.getSize());
-
writer.print("
<li>
<a href=\"" + pageUrl + "\">"+ indexPage +"
a>
li>");
-
}
-
//显示“下一页”按钮
-
if (page.getPage()
< pageCount) {
-
String
nextUrl =
append(url, "
page",
page.getPage() +
1);
-
nextUrl =
append(nextUrl, "
rows",
page.getSize());
-
writer.print("<
li>
<a href=\"" + nextUrl + "\">下一页
a>
li>");
-
} else {
-
writer.print("
<li class=\"disabled\">
<a href=\"#\">下一页
a>
li>");
-
}
-
writer.print("
nav>");
-
} catch (IOException e) {
-
e.printStackTrace();
-
}
-
return SKIP_BODY;
-
}
-
-
private String append(String url, String key, int value) {
-
-
return append(url, key, String.valueOf(value));
-
}
-
-
/**
-
* 为url 参加参数对儿
-
*
-
* @param url
-
* @param key
-
* @param value
-
* @return
-
*/
-
private String append(String url, String key, String value) {
-
if (url == null || url.trim().length() == 0) {
-
return "";
-
}
-
-
if (url.indexOf("?") == -1) {
-
url = url + "?" + key + "=" + value;
-
} else {
-
if(url.endsWith("?")) {
-
url = url + key + "=" + value;
-
} else {
-
url = url + "&" + key + "=" + value;
-
}
-
}
-
-
return url;
-
}
-
-
/**
-
* 为url 添加翻页请求参数
-
*
-
* @param url
-
* @param pageContext
-
* @return
-
* @throws javax.servlet.jsp.JspException
-
*/
-
private String resolveUrl(String url, javax.servlet.jsp.PageContext pageContext) throws JspException{
-
//UrlSupport.resolveUrl(url, context, pageContext)
-
Map params = pageContext.getRequest().getParameterMap();
-
for (Object key:params.keySet()) {
-
if ("page".equals(key) || "rows".equals(key)) continue;
-
Object value = params.get(key);
-
if (value == null) continue;
-
if (value.getClass().isArray()) {
-
url = append(url, key.toString(), ((String[])value)[0]);
-
} else if (value instanceof String) {
-
url = append(url, key.toString(), value.toString());
-
}
-
}
-
return url;
-
}
-
-
/**
-
* @return the bean
-
*/
-
public String getBean() {
-
return bean;
-
}
-
-
/**
-
* @param bean the bean to set
-
*/
-
public void setBean(String bean) {
-
this.bean = bean;
-
}
-
-
/**
-
* @return the url
-
*/
-
public String getUrl() {
-
return url;
-
}
-
-
/**
-
* @param url the url to set
-
*/
-
public void setUrl(String url) {
-
this.url = url;
-
}
-
-
public void setNumber(int number) {
-
this.number = number;
-
}
-
-
}
(2)编写自定义标签的tld,命令为commons.tld,并且放在WEB-INF下面的tld文件下(这个文件自己创建就是了)
-
xml version="1.0" encoding="UTF-8" ?>
-
-
PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN"
-
"http://java.sun.com/dtd/web-jsptaglibrary_1_2.dtd">
-
<taglib>
-
<tlib-version>2.0
tlib-version>
-
<jsp-version>1.2
jsp-version>
-
<short-name>common
short-name>
-
<uri>http://hnuscw.com/common/
uri>
-
<display-name>Common Tag
display-name>
-
<description>Common Tag library
description>
-
-
<tag>
-
<name>page
name>
-
<tag-class>com.hnuscw.common.utils.NavigationTag
tag-class>
-
<body-content>JSP
body-content>
-
<description>create navigation for paging
description>
-
<attribute>
-
<name>bean
name>
-
<rtexprvalue>true
rtexprvalue>
-
attribute>
-
<attribute>
-
<name>number
name>
-
<rtexprvalue>true
rtexprvalue>
-
attribute>
-
<attribute>
-
<name>url
name>
-
<required>true
required>
-
<rtexprvalue>true
rtexprvalue>
-
attribute>
-
tag>
-
taglib>
(3)在jsp页面中进行使用
引入标签:
<%@ taglib prefix="hnuscw" uri="http://hnuscw.com/common/"%>
使用标签:
-
<div class="col-md-12 text-right">
-
<hnuscw:page url="${pageContext.request.contextPath }/customer/list.action" />
-
div>
测试实例:为了方便很多的使用,我这就还是用一个实际的例子还显示这个效果吧。
jsp页面:命名为:customer.jsp(当然可以不要这么多内容,自行更改即可,只是这个就相当于一个管理系统的了,所以以后只需要稍微修改就可以)
-
<%@ page language="java" contentType="text/html; charset=UTF-8"
-
pageEncoding=
"UTF-8"%>
-
<%@ page trimDirectiveWhitespaces="true"%>
-
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
-
<%@ taglib prefix="itcast" uri="http://itcast.cn/common/"%>
-
<%
-
String path = request.getContextPath();
-
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
-
+ path + "/";
-
%>
-
-
<html xmlns="http://www.w3.org/1999/xhtml">
-
<head>
-
<meta charset="utf-8">
-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
-
<meta name="viewport" content="width=device-width, initial-scale=1">
-
<meta name="description" content="">
-
<meta name="author" content="">
-
-
<title>客户列表-BootCRM
title>
-
-
-
<link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">
-
-
-
<link href="<%=basePath%>css/metisMenu.min.css" rel="stylesheet">
-
-
-
<link href="<%=basePath%>css/dataTables.bootstrap.css" rel="stylesheet">
-
-
-
<link href="<%=basePath%>css/sb-admin-2.css" rel="stylesheet">
-
-
-
<link href="<%=basePath%>css/font-awesome.min.css" rel="stylesheet"
-
type=
"text/css">
-
<link href="<%=basePath%>css/boot-crm.css" rel="stylesheet"
-
type=
"text/css">
-
-
-
-
-
-
head>
-
-
<body>
-
<div id="wrapper">
-
-
-
<nav class="navbar navbar-default navbar-static-top" role="navigation"
-
style=
"margin-bottom: 0">
-
<div class="navbar-header">
-
<button type="button" class="navbar-toggle" data-toggle="collapse"
-
data-target=
".navbar-collapse">
-
<span class="sr-only">Toggle navigation
span>
<span
-
class=
"icon-bar">
span>
<span class="icon-bar">
span>
<span
-
class=
"icon-bar">
span>
-
button>
-
<a class="navbar-brand" href="index.html">BOOT客户管理系统 v2.0
a>
-
div>
-
-
-
<ul class="nav navbar-top-links navbar-right">
-
<li class="dropdown">
<a class="dropdown-toggle"
-
data-toggle=
"dropdown"
href=
"#">
<i class="fa fa-envelope fa-fw">
i>
-
<i class="fa fa-caret-down">
i>
-
a>
-
<ul class="dropdown-menu dropdown-messages">
-
<li>
<a href="#">
-
<div>
-
<strong>令狐冲
strong>
<span class="pull-right text-muted">
-
<em>昨天
em>
-
span>
-
div>
-
<div>今天晚上向大哥找我吃饭,讨论一下去梅庄的事...
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a class="text-center" href="#">
<strong>查看全部消息
strong>
-
<i class="fa fa-angle-right">
i>
-
a>
li>
-
ul>
li>
-
-
<li class="dropdown">
<a class="dropdown-toggle"
-
data-toggle=
"dropdown"
href=
"#">
<i class="fa fa-tasks fa-fw">
i>
-
<i class="fa fa-caret-down">
i>
-
a>
-
<ul class="dropdown-menu dropdown-tasks">
-
<li>
<a href="#">
-
<div>
-
<p>
-
<strong>任务 1
strong>
<span class="pull-right text-muted">完成40%
span>
-
p>
-
<div class="progress progress-striped active">
-
<div class="progress-bar progress-bar-success"
-
role=
"progressbar"
aria-valuenow=
"40"
aria-valuemin=
"0"
-
aria-valuemax=
"100"
style=
"width: 40%">
-
<span class="sr-only">完成40%
span>
-
div>
-
div>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a href="#">
-
<div>
-
<p>
-
<strong>任务 2
strong>
<span class="pull-right text-muted">完成20%
span>
-
p>
-
<div class="progress progress-striped active">
-
<div class="progress-bar progress-bar-info" role="progressbar"
-
aria-valuenow=
"20"
aria-valuemin=
"0"
aria-valuemax=
"100"
-
style=
"width: 20%">
-
<span class="sr-only">完成20%
span>
-
div>
-
div>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a class="text-center" href="#">
<strong>查看所有任务
strong>
-
<i class="fa fa-angle-right">
i>
-
a>
li>
-
ul>
li>
-
-
<li class="dropdown">
<a class="dropdown-toggle"
-
data-toggle=
"dropdown"
href=
"#">
<i class="fa fa-bell fa-fw">
i>
-
<i class="fa fa-caret-down">
i>
-
a>
-
<ul class="dropdown-menu dropdown-alerts">
-
<li>
<a href="#">
-
<div>
-
<i class="fa fa-comment fa-fw">
i> 新回复
<span
-
class=
"pull-right text-muted small">4分钟之前
span>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a href="#">
-
<div>
-
<i class="fa fa-envelope fa-fw">
i> 新消息
<span
-
class=
"pull-right text-muted small">4分钟之前
span>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a href="#">
-
<div>
-
<i class="fa fa-tasks fa-fw">
i> 新任务
<span
-
class=
"pull-right text-muted small">4分钟之前
span>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a href="#">
-
<div>
-
<i class="fa fa-upload fa-fw">
i>
服务器重启
<span
-
class=
"pull-right text-muted small">4分钟之前
span>
-
div>
-
a>
li>
-
<li class="divider">
li>
-
<li>
<a class="text-center" href="#">
<strong>查看所有提醒
strong>
-
<i class="fa fa-angle-right">
i>
-
a>
li>
-
ul>
li>
-
-
<li class="dropdown">
<a class="dropdown-toggle"
-
data-toggle=
"dropdown"
href=
"#">
<i class="fa fa-user fa-fw">
i>
-
<i class="fa fa-caret-down">
i>
-
a>
-
<ul class="dropdown-menu dropdown-user">
-
<li>
<a href="#">
<i class="fa fa-user fa-fw">
i> 用户设置
a>
li>
-
<li>
<a href="#">
<i class="fa fa-gear fa-fw">
i> 系统设置
a>
li>
-
<li class="divider">
li>
-
<li>
<a href="login.html">
<i class="fa fa-sign-out fa-fw">
i>
-
退出登录
a>
li>
-
ul>
li>
-
-
ul>
-
-
-
<div class="navbar-default sidebar" role="navigation">
-
<div class="sidebar-nav navbar-collapse">
-
<ul class="nav" id="side-menu">
-
<li class="sidebar-search">
-
<div class="input-group custom-search-form">
-
<input type="text" class="form-control" placeholder="查询内容...">
-
<span class="input-group-btn">
-
<button class="btn btn-default" type="button">
-
<i class="fa fa-search" style="padding: 3px 0 3px 0;">
i>
-
button>
-
span>
-
div>
-
li>
-
<li>
<a href="customer.action" class="active">
<i
-
class=
"fa fa-edit fa-fw">
i> 客户管理
a>
li>
-
<li>
<a href="salevisit.action">
<i
-
class=
"fa fa-dashboard fa-fw">
i> 客户拜访
a>
li>
-
ul>
-
div>
-
-
div>
-
nav>
-
-
<div id="page-wrapper">
-
<div class="row">
-
<div class="col-lg-12">
-
<h1 class="page-header">客户管理
h1>
-
div>
-
-
div>
-
-
<div class="panel panel-default">
-
<div class="panel-body">
-
<form class="form-inline" action="${pageContext.request.contextPath }/customer/list.action" method="get">
-
<div class="form-group">
-
<label for="customerName">客户名称
label>
-
<input type="text" class="form-control" id="customerName" value="${custName }" name="custName">
-
div>
-
<div class="form-group">
-
<label for="customerFrom">客户来源
label>
-
<select class="form-control" id="customerFrom" placeholder="客户来源" name="custSource">
-
<option value="">--请选择--
option>
-
<c:forEach items="${fromType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custSource}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
<div class="form-group">
-
<label for="custIndustry">所属行业
label>
-
<select class="form-control" id="custIndustry" name="custIndustry">
-
<option value="">--请选择--
option>
-
<c:forEach items="${industryType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custIndustry}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
<div class="form-group">
-
<label for="custLevel">客户级别
label>
-
<select class="form-control" id="custLevel" name="custLevel">
-
<option value="">--请选择--
option>
-
<c:forEach items="${levelType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custLevel}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
<button type="submit" class="btn btn-primary">查询
button>
-
form>
-
div>
-
div>
-
<div class="row">
-
<div class="col-lg-12">
-
<div class="panel panel-default">
-
<div class="panel-heading">客户信息列表
div>
-
-
<table class="table table-bordered table-striped">
-
<thead>
-
<tr>
-
<th>ID
th>
-
<th>客户名称
th>
-
<th>客户来源
th>
-
<th>客户所属行业
th>
-
<th>客户级别
th>
-
<th>固定电话
th>
-
<th>手机
th>
-
<th>操作
th>
-
tr>
-
thead>
-
<tbody>
-
<c:forEach items="${page.rows}" var="row">
-
<tr>
-
<td>${row.cust_id}
td>
-
<td>${row.cust_name}
td>
-
<td>${row.cust_source}
td>
-
<td>${row.cust_industry}
td>
-
<td>${row.cust_level}
td>
-
<td>${row.cust_phone}
td>
-
<td>${row.cust_mobile}
td>
-
<td>
-
<a href="#" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#customerEditDialog" onclick="editCustomer(${row.cust_id})">修改
a>
-
<a href="#" class="btn btn-danger btn-xs" onclick="deleteCustomer(${row.cust_id})">删除
a>
-
td>
-
tr>
-
c:forEach>
-
tbody>
-
table>
-
<div class="col-md-12 text-right">
-
<itcast:page url="${pageContext.request.contextPath }/customer/list.action" />
-
div>
-
-
div>
-
-
div>
-
-
div>
-
div>
-
-
-
div>
-
-
<div class="modal fade" id="customerEditDialog" tabindex="-1" role="dialog"
-
aria-labelledby=
"myModalLabel">
-
<div class="modal-dialog" role="document">
-
<div class="modal-content">
-
<div class="modal-header">
-
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
-
<span aria-hidden="true">×
span>
-
button>
-
<h4 class="modal-title" id="myModalLabel">修改客户信息
h4>
-
div>
-
<div class="modal-body">
-
<form class="form-horizontal" id="edit_customer_form">
-
<input type="hidden" id="edit_cust_id" name="cust_id"/>
-
<div class="form-group">
-
<label for="edit_customerName" class="col-sm-2 control-label">客户名称
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_customerName" placeholder="客户名称" name="cust_name">
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_customerFrom" style="float:left;padding:7px 15px 0 27px;">客户来源
label>
-
<div class="col-sm-10">
-
<select class="form-control" id="edit_customerFrom" placeholder="客户来源" name="cust_source">
-
<option value="">--请选择--
option>
-
<c:forEach items="${fromType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custSource}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_custIndustry" style="float:left;padding:7px 15px 0 27px;">所属行业
label>
-
<div class="col-sm-10">
-
<select class="form-control" id="edit_custIndustry" name="cust_industry">
-
<option value="">--请选择--
option>
-
<c:forEach items="${industryType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custIndustry}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_custLevel" style="float:left;padding:7px 15px 0 27px;">客户级别
label>
-
<div class="col-sm-10">
-
<select class="form-control" id="edit_custLevel" name="cust_level">
-
<option value="">--请选择--
option>
-
<c:forEach items="${levelType}" var="item">
-
<option value="${item.dict_id}"<c:if test="${item.dict_id == custLevel}"> selected
c:if>>${item.dict_item_name }
option>
-
c:forEach>
-
select>
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_linkMan" class="col-sm-2 control-label">联系人
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_linkMan" placeholder="联系人" name="cust_linkman">
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_phone" class="col-sm-2 control-label">固定电话
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_phone" placeholder="固定电话" name="cust_phone">
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_mobile" class="col-sm-2 control-label">移动电话
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_mobile" placeholder="移动电话" name="cust_mobile">
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_zipcode" class="col-sm-2 control-label">邮政编码
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_zipcode" placeholder="邮政编码" name="cust_zipcode">
-
div>
-
div>
-
<div class="form-group">
-
<label for="edit_address" class="col-sm-2 control-label">联系地址
label>
-
<div class="col-sm-10">
-
<input type="text" class="form-control" id="edit_address" placeholder="联系地址" name="cust_address">
-
div>
-
div>
-
form>
-
div>
-
<div class="modal-footer">
-
<button type="button" class="btn btn-default" data-dismiss="modal">关闭
button>
-
<button type="button" class="btn btn-primary" onclick="updateCustomer()">保存修改
button>
-
div>
-
div>
-
div>
-
div>
-
-
-
-
<script src="<%=basePath%>js/jquery.min.js">
script>
-
-
-