SSM框架项目搭建
一、创建一个web项目

二、在lib文件夹下导入所需要的包

三、配置web.xml文件

1.配置前端控制器-DispatherServlet类
<servlet>
       <servlet-name>springmvc</servlet-name>
       <servlet-class>org.springframework.web.servlet.DispathcherServlet</servlet-class>
       <init-param>
	          <param-name>contextConfigLocation</ param-name>
	          <param-value>classpath:/springmvc.xml<param-value>
       </init-param>
</servlet>
<servlet-mapping>
	  <servlet-name>springmvc</servlet-name>
	  <url-pattern>*.action</url-pattern>
</servlet-mapping>

2.配置监听器，初始化spring容器
<listener>
	<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<context-param>
	<param-name>contextConfigLocation</param-name>
	<param-value>classpath:/applicationContext.xml</param-value>
</context-param>

3.解决乱码文件，设置过滤器
<filter>
	<filter-name>encodingFilter</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>
</filter>
<filter-mapping>
	<filter-name>encodingFilter</filter-name>
	<url-pattern>/*</url-pattern>	
</filter-mapping>

四、在src下创建applicationContext.xml文件进行配置

1.开启包扫描
<context:component-scan base-package="包名全路径 "></context:component-scan>

2.注解方式注入DI
<context:annotation-config></context:annotation-config>

3.配置注解方式AOP
<aop:aspectj-autoproxy></aop:aspectj-autoproxy>

4.整合Mybatis

配置数据源
<bean id="dataSource"class="com.mchange.v2.c3p0.ComboPooledDataSource">
		<property name="driverClass" value="com.mysql.jdbc.Driver"></property>
		<property name="jdbcUrl" value="jdbc:mysql:///easymall"></property>
		<property name="user" value="root"></property>
		<property name="password" value="root"></property>
</bean>

配置Mybatis
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
		<property name="dataSource" ref="dataSource"></property>
		<property name="configLocation" value="classpath:/sqlMapConfig.xml"></property>
		<property name="mapperLocations" value="classpath:/cn/tedu/mapper/*.xml"></property>
</bean>

MapperBean扫描器，负责为MapperBean生成实现类
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
		<property name="basePackage" value="cn.tedu.mapper"></property>
</bean>

五、在src下创建springmvc.xml文件

1.开启包扫描
<context:component-scan base-package="cn.tedu.controller"></context:component-scan>

2.开启注解方式的mvc配置
<mvc:annotation-driven></mvc:annotation-driven>

3.配置视图解析器
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
		<property name="prefix" value="/WEB-INF/jsp/"></property>	
		<property name="suffix" value=".jsp"></property>	
</bean>

4.配置拦截器
<mvc:interceptors>
		<bean class="cn.tedu.interceptor.AutologinInterceptor"></bean>
</mvc:interceptors>

六、在src下创建sqlConfigMap.xml文件
基本配置完成，开始实现逻辑代码

　其中数据库只有如下表与字段

访问效果：

 
 项目下载：
干净的ssm框架项目.rar
转载于:https://www.cnblogs.com/yanan7890/p/9937020.html

SSM框架项目开发过程整理


  
本项目构建自慕课网《Java高并发秒杀API》课程系列 
http://www.imooc.com/course/programdetail/pid/59




开发轨迹

业务分析
DAO层实现 
接口设计 + SQL编写
使用Junit测试功能
Service层实现
Web层实现
高并发优化
业务分析

不多讲，针对业务需求做功能分割分层，抽象出实体和业务逻辑设计数据库



DAO层实现

涉及包：

dao 
Data Access Object 数据访问对象
将非对象数据以对象的形式操纵
entity 
数据库表映射的实体
流程：

使用配置文件整合Spring和MyBatis
设计和建立数据库及表，根据ORM规则创建Entity类
根据业务逻辑（CRUD）创建DAO接口
根据DAO接口创建对应的mapper.xml，手动书写SQL语句 
注意：多参数传递要使用@Param注解
创建Junit4测试用例，并整合Spring
测试MyBatis的DAO层自动实现的功能
优点：

与其他层实现分离（DAO层拼接等逻辑在Service层实现）
DAO层工作演变成：接口设计 + SQL编写
代码与SQL分离，方便Review
Service层实现

涉及包：

service 
具体业务实现接口定义
service.impl 
实现service接口的实现类
dto 
Data Transfer Object 数据传输对象
用于在不同层直接的数据传输（如Service层与Web层）
隔离不同层，降低层间耦合
exception 
自定义的业务exception
enums 
数据字典，存放业务相关的常量数据 
流程：

设计Service接口，dto数据传输对象，自定义Exception和enum
设计Service接口实现类
配置Spring service层的xml配置及注解
创建Junit4测试用例并进行测试
Web层实现

前端交互设计：

根据需求设计前端交互流程
人员 
产品 
解读用户需求，设计满足用户需求的文档
前端 
负责页面展示
后端 
负责存储展示
Restful接口：

一种优雅的URI表述方式
资源的状态和状态转移
示例 
GET /seckill/list 
OK
POST /seckill/execute/{seckillId} 
WRONG
POST /seckill/{seckillId}/execution 
OK(使用名词执行,POST表动作)
GET /seckill/delete/{id} 
WRONG
DELETE /seckill/{id}/delete 
OK
Restful规范 
GET 
查询操作
POST 
添加或修改操作
非幂等
PUT 
修改操作
幂等，可以使用相同参数重复执行，并能获得相同结果的函数，不用担心重复执行会对系统造成改变
对同一URL的多个请求应该返回同样的结果
DELETE 
删除操作
URL设计 
/模块/资源/{标示}/集合1/...
例子 
/user/{uid}/friends 
好友列表
/user/{uid}/followers 
关注者列表
秒杀API的URL设计 
GET /seckill/list  秒杀列表
GET /seckill/{id}/detail  详情页
GET /seckill/time/now  系统时间
POST /seckill/{id}/exposer  暴露秒杀
POST /seckill/{id}/{md5}/execution  执行秒杀
SpringMVC基础：

围绕Handler开发
URL映射 注解@RequestMapping 

    * 支持标准URL 

    * Ant风格URL（？匹配一个字符，匹配任意字符，*匹配任意路径） 

    * 带{xxx}占位符的URL
请求参数绑定 
@PathVariable(“xxx”)  
对应URL中的占位符{xxx}
@RequestParam(“xxx”) 
对应的请求参数
请求方法限制 
@RequestMapping(method=RequestMethod.xxx) 
GET,POST,PUT,DELETE
请求转发和重定向 
转发 
return “redirect:/url”;
重定向 
return “forward:/seckill/list”;
数据模型赋值 
ModelAndView或Model 
调用addAttribute方法
返回json数据 
@RequestMapping(produces=”application/json;charset=UTF-8”)
@ResponseBody
直接返回POJO就能转换成json
cookie访问 
参数注解 @CookieValue(value=”xxx”,require=”false”)
涉及包：

dto 
封装泛型JSON result
web 
实现Controller
流程：

创建Controller及各接口映射的方法
使用注解描述各接口的映射，限制及参数获取
调用Service（由SpringDI注入）完成业务逻辑，封装到Model中返回给相应视图
完成视图设计
部署到服务器上调试

基于SSM校园学术报告管理平台
是一个学习SSM框架的最新项目：基于SSM校园学术报告管理平台
目录：
摘 要	4

Abstract:	5

第一章 绪论	6

1.1开发背景	6

1.2开发意义	6

1.3开发目标	6

第二章 选题方案对比	7

第三章 技术及开发工具简介	7

3.1 Javascript技术简介	7

3.2 JQuery-bootstrapUI技术简介	8

3.3 SSM框架	8

3.4 MySQL简介	10

3.5 POI简介	10

3.6 系统运行环境	10

第四章 系统需求分析	11

4.1 可行性分析	11

4.2 功能需求分析	11

4.3性能需求分析	12

4.3.1 时间特性要求	12

4.3.2 输入输出要求	12

4.4 数据库需求分析	13

第五章 系统概要设计	13

5.1 系统功能模块设计	13

5.2 数据库设计	14

5.2.1 E-R图	15

5.2.2 数据库表设计	15

第六章 系统详细设计	19

6.1 登录/注册实现	20

6.2 管理员功能模块	22

6.2.1 基本信息设置	22

6.2.2 网站信息管理	23

6.3 用户前台模块	26

第七章 系统测试	28

7.1 登录测试	28

第八章 结论	29

致  谢	29

参考文献	29

附  录	30
项目介绍：
项目采用SSM框架+MySQL数据库做后台技术支持，JavaMaile完成邮件发送功能，poi实现批量导入导出，前台页面使用主要用jquery+bootstrap实现,报表统计使用echarts框架，有管理员和普通学生用户两个角色，toastr.js实现弹窗信息。开发环境：windows10+jdk8+tomct8+eclipse4.7

下载地址：https://download.csdn.net/download/qq_40623672/14913491

部分项目部分项目截图：

登录注册页面


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>校园学术报告管理平台--登录页面</title>
<link rel="stylesheet" href="/reportSystem/css/pintuer.css">
<link rel="stylesheet" href="/reportSystem/css/admin.css">
<link rel="stylesheet" href="/reportSystem/plugs/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="/reportSystem/toastr-master/build/toastr.min.css">
<link rel="stylesheet" href="/reportSystem/plugs/bootstrap-table/bootstrap-table.css">
<script src="/reportSystem/js/jquery-3.1.1.min.js"></script>
<script src="/reportSystem/js/pintuer.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/reportSystem/toastr-master/build/toastr.min.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap-table/bootstrap-table.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap-table/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript" src="/reportSystem/js/clipboard.min.js"></script>
<script type="text/javascript">
	//采用改变时间戳，可以防止浏览器从本地缓存中读取图片文件。
	function resh() {
		//获取现在时间的原始值
		var timestamp = (new Date()).valueOf();
		console.log(timestamp)
		//取出原src
		var url = $("#vimg").attr("src");
		//在原src后面拼接时间戳
		url = url + "?timestamp=" + timestamp;
		//将改变的后的url赋值给src
		$("#vimg").attr("src", url);
	}

	//注册
	function regUser() {
			$.ajax({
	             type: "POST",
	             url: "./user/regist.do",
	             dataType: "json",
	             contentType: "application/json;charset=UTF-8",
	             data: JSON.stringify({
	            	 uid : $("#uid").val(), 
	            	 name : $("#name").val(),
	            	 password : $("#pwd").val(),
	            	 email : $("#email").val(),
	            	 unit : $("#unit").val(),
	            	 mysubject : $("#mysubject").val(),
	            	 mycity : $("#mycity").val(),
	            	 mykeyword : $("#mykeyword").val()
	             }),
	             success: function(){
	            		 toastr.success('注册成功，请稍等...');
	            		 setTimeout(function () { 
	            			 window.location.href="login.do"
	            		 }, 1000);
	             },
	             error: function(){
	            	 toastr.error('系统错误！');
	             }
	            
	         });
	}
	
	 //邮箱校验
	function ruleEmail(){
		var email = $("#email").val();
		var myreg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
		if(!myreg.test(email)){
			toastr.error('邮箱格式有误！');
			 return false;
		}
	}
	/* var errorInfo="<%=Session["errorInfo"]%>";
	alert(errorInfo)
	$("#showerror").text(errorInfo); */
	/* function dologin(){
		var username = $("#username").val();
		var password = $("#password").val();
		var valCode = $("#valCode").val();
		var rule = $("#rule").val();
		$.get("doLogin.do?username="+username+"&password="+password+"&valCode="+valCode+"&rule="+rule,function(data){
			alert(data)
		});
	} */
</script>
</head>
<body>
	<div class="bg"></div>
	<div class="container">
		<div class="line bouncein">
			<div class="xs6 xm4 xs3-move xm4-move">
				<div style="height: 150px;"></div>
				<div class="media media-y margin-big-bottom"></div>
				<form action="doLogin.do" method="post">
			
					<div class="panel loginbox">
						
							<h2 style="text-align: center;">校园学术报告管理平台</h2>
						
						<div class="panel-body"
							style="padding: 30px; padding-bottom: 10px; padding-top: 10px;">
							<div class="form-group">
								<div class="field field-icon-right">
									<input type="text" class="input input-big" id="username"
										name="username" placeholder="登录账号" data-validate="required:请填写账号" />
									<span class="icon icon-user margin-small"></span>
								</div>
							</div>
							<div class="form-group">
								<div class="field field-icon-right">
									<input type="password" class="input input-big" id="password"
										name="password" placeholder="登录密码"
										data-validate="required:请填写密码" /> <span
										class="icon icon-key margin-small"></span>
								</div>
							</div>
							<div  class="form-group">
								<div class="field field-icon-right">
									<input type="text" class="input input-big" id="valCode"
										name="valCode" placeholder="验证码"
										data-validate="required:请填写验证码" /> <span
										class="icon icon-cogs margin-small"></span>
								</div>

								<img src="valCode.do" alt="验证码" id="vimg" onclick="resh()"
									width="70" height="30">
									</div>
							
							<label style="color: blue">请选择您的身份：</label>&nbsp; <label><input
								name="rule" type="radio" value="admin" checked="checked" />管理员
							</label> &nbsp;&nbsp; <label><input name="rule" type="radio"
								value="user" />用户 </label>
							<div style="padding: 20px;">
								<input type="submit" class="button button-block bg-main"
									value="登&nbsp;&nbsp;录">
							</div>
							<input type="button" class="btn btn-success" data-toggle="modal" data-target="#regModal" value="注册" />
							 <a href="javascript:void(0);" onclick="forgetPwd()">忘记密码？</a>
						</div>
				</form>
			<!-- 	<span style="color: red" id="showerror"></span> -->
			</div>
		</div>
	</div>
	
	<!-- 注册模态框 -->
	<div class="modal fade" id="regModal" tabindex="-1" role="dialog" aria-labelledby="regModalLabel">
  <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"></button>
        <h4 class="modal-title" id="regModalLabel">欢迎注册</h4>
      </div>
      <div class="modal-body">
        <div class="field field-icon-right">
			<input type="text" class="input input-big" id="uid"
				name="uid" placeholder="账号"
				data-validate="required:请填写账号" /> <span
				class="icon icon-user margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="name"
				name="name" placeholder="昵称"/> <span
				class="icon icon-github-square margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="password" class="input input-big" id="pwd"
				name="pwd" placeholder="密码"
				data-validate="required:请填写密码" /> <span
				class="icon icon-key margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="email"
				name="email" placeholder="邮箱" onblur="ruleEmail()"/> <span
				class="icon icon-linkedin margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="unit"
				name="unit" placeholder="学校" /> <span
				class="icon icon-random margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="mysubject"
				name="mysubject" placeholder="课程" /> <span
				class="icon icon-book margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="mycity"
				name="mycity" placeholder="所在城市" /> <span
				class="icon icon-map-marker margin-small"></span>
		</div>
		<div class="field field-icon-right">
			<input type="text" class="input input-big" id="mykeyword"
				name="mykeyword" placeholder="个性签名"/> <span
				class="icon icon-font margin-small"></span>
		</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" onclick="regUser()">提交</button>
      </div>
    </div>
  </div>
</div>
</body>
</html>



用户端前台











管理员端：










<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>校园学术报告管理平台--后台主页</title>
<link rel="stylesheet" href="/reportSystem/css/pintuer.css">
<link rel="stylesheet" href="/reportSystem/css/admin.css">
<link rel="stylesheet" href="/reportSystem/plugs/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="/reportSystem/toastr-master/build/toastr.min.css">
<link rel="stylesheet" href="/reportSystem/plugs/bootstrap-table/bootstrap-table.css">
<script src="/reportSystem/js/jquery-3.1.1.min.js"></script>
<script src="/reportSystem/js/pintuer.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/reportSystem/toastr-master/build/toastr.min.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap-table/bootstrap-table.js"></script>
<script type="text/javascript" src="/reportSystem/plugs/bootstrap-table/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript" src="/reportSystem/js/clipboard.min.js"></script>
</head>
<body style="background-color: #f2f9fd;">
	<div class="header bg-main">
		<div class="logo margin-big-left fadein-top">
			<h1>
				<img src="images/y.jpg" class="radius-circle rotate-hover"
					height="50" alt="" />校园学术报告管理平台
			</h1>
		</div>
		<div class="head-l">
			<a href="./toHome.do" class="button button-little bg-green"
				target="_blank"><span class="icon-home"></span> 前台首页</a>
			&nbsp;&nbsp; <a href="./login.do" class="button button-little bg-blue"><span
				class="icon-wrench"></span> 清除缓存</a> &nbsp;&nbsp;
			<button onclick="exitSystems()" class="button button-little bg-red">
				<span class="icon-power-off"></span> 退出登录
			</button>
			&nbsp;&nbsp;&nbsp;&nbsp;<span>欢迎：admin[管理员]</span>
		</div>
	</div>
	<div class="leftnav">
		<div class="leftnav-title">
			<strong><span class="icon-list"></span>菜单列表</strong>
		</div>
		<h2>
			<span class="icon-user"></span>基本信息设置
		</h2>
		<ul style="display: block">
			<li><a href="toHome.do" target="right"><span class="icon-caret-right"></span>网站主页</a></li>
			<li><a href="tonewreport.do" target="right"><span class="icon-caret-right"></span>最新报告</a></li>
			<li><a href="toAdminModifyPwd.do" target="right"><span class="icon-caret-right"></span>修改密码</a></li>
			<li><a href="tosignpage.do" target="right"><span class="icon-caret-right"></span>报名管理</a></li>
		</ul>
		<h2>
			<span class="icon-pencil-square-o"></span>网站信息管理
		</h2>
		<ul>
			<li><a href="toUserPage.do" target="right"><span class="icon-caret-right"></span>用户信息管理</a></li>
			<li><a href="toreport.do" target="right"><span class="icon-caret-right"></span>报告管理</a></li>
			<li><a href="toinfo.do" target="right"><span class="icon-caret-right"></span>留言管理</a></li>
			<li><a href="tosite.do" target="right"><span class="icon-caret-right"></span>网址管理</a></li>
			<li><a href="tocount.do" target="right"><span class="icon-caret-right"></span>网址活跃度统计</a></li>
		</ul>
		<h2>
			<span class="icon-gamepad"></span>游戏娱乐
		</h2>
		<ul>
			<li><a href="http://www.4399.com/flash/36944.htm" target="right"><span class="icon-caret-right"></span>中国象棋</a></li>
			<li><a href="http://www.4399.com/flash/18012.htm" target="right"><span class="icon-caret-right"></span>植物大战僵尸</a></li>
			<li><a href="http://www.4399.com/flash/203569.htm" target="right"><span class="icon-caret-right"></span>斗罗大陆</a></li>
		</ul>
		<h2>
			<span class="icon-linkedin-square"></span>友情链接
		</h2>
		<ul>
			<li><a href="https://www.easyicon.net/" target="right"><span class="icon-caret-right"></span>小图标下载</a></li>
			<li><a href="http://www.uugai.com/" target="right"><span class="icon-caret-right"></span>免费logo在线制作</a></li>
			<li><a href="https://www.yuanrenxue.com/" target="right"><span class="icon-caret-right"></span>猿人学python</a></li>
		</ul>
	</div>
	<script type="text/javascript">
		$(function() {
			$(".leftnav h2").click(function() {
				$(this).next().slideToggle(200);
				$(this).toggleClass("on");
			})
			$(".leftnav ul li a").click(function() {
				$("#a_leader_txt").text($(this).text());
				$(".leftnav ul li a").removeClass("on");
				$(this).addClass("on");
			})
		});

		//退出系统Ÿ
		function exitSystems() {
			var info = confirm("你确定要退出系统吗？");
			if (info) {
				window.location.href = "login.do";
			}
		}
	</script>
	<ul class="bread">
		<li><a href="toHome.do" target="right" class="icon-home"> 首页</a></li>
		<li><a href="##" id="a_leader_txt">网站信息</a></li>
		<li><b>当前语言：</b><span style="color: red;">中文</php></span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;切换语言：<a href="##">中文</a> &nbsp;&nbsp;<a
			href="##">英文</a></li>
	</ul>
	<div class="admin">
		<iframe scrolling="auto" rameborder="0" src="toHome.do" name="right"
			width="100%" height="100%"></iframe>
	</div>
	<div style="text-align: center;"></div>
</body>
</html>




$(function(){
	toDataAnalysis();
	clickData();
	getpiedata();
});
var clickChart = echarts.init($("#clicknum")[0]);
var myChart = echarts.init($("#box")[0]); 
var pieCharts = echarts.init($("#pie")[0]);
//设置属性
pieCharts.setOption({
    title: {
        text: '网站等级',
        subtext: '[YJ：一级][EJ：二级][SJ：三级][SIJ：四级]',
        x: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical',
        x: 'left',
        data: []
    },
    toolbox: {
        show: true,
        feature: {
            mark: {show: true},
            dataView: {show: true, readOnly: false},
            magicType: {
                show: true,
                type: ['pie', 'funnel'],
                option: {
                    funnel: {
                        x: '25%',
                        width: '50%',
                        funnelAlign: 'left',
                        max: 1548
                    }
                }
            },
            restore: {show: true},
            saveAsImage: {show: true}
        }
    },
    calculable: true,
    series: [
        {
            name: '等级',
            type: 'pie',
            radius: '55%',
            center: ['50%', '60%'],
            data: []
        }
    ]
});
//显示一段动画
pieCharts.showLoading();
var totalval=[];
var siteLevel = [];
function getpiedata(){
$.post("getleveldata.do",function(result){
	/* console.log(result); */
	if(result!=null){
		for(var i=0 ; i<result.length ; i++){
			totalval.push(result[i].totalval);		//挨个取出数组
			siteLevel.push(result[i].siteLevel);
           	/* count.push(result[i].count); */
		}
		 pieCharts.hideLoading();//隐藏加载动画
         pieCharts.setOption({
             title: {
                 text: '网站等级',
                 subtext: '[YJ:一级][EJ:二级][SJ:三级][SIJ:四级]',
                 x: 'center'
             },
             tooltip: {
                 trigger: 'item',
                 formatter: "{a} <br/>{b} : {c} ({d}%)"
             },
             legend: {
                 orient: 'vertical',
                 x: 'left',
                 data: []
             },
             toolbox: {
                 show: true,
                 feature: {
                     mark: {show: true},
                     dataView: {show: true, readOnly: false},
                     magicType: {
                         show: true,
                         type: ['pie', 'funnel'],
                         option: {
                             funnel: {
                                 x: '25%',
                                 width: '50%',
                                 funnelAlign: 'left',
                                 max: 1548
                             }
                         }
                     },
                     restore: {show: true},
                     saveAsImage: {show: true}
                 }
             },
             calculable: true,
             series: [
                 {
                     name: '占比',
                     type: 'pie',
                     radius: '55%',
                     center: ['50%', '60%'],
                     data: result
                 }
             ]
         });
	}else {
		 toastr.error("图表请求数据为空，可能服务器暂未录入网站等级数据，您可以稍后再试！");
		 pieCharts.hideLoading();
	}
});
}
// option 里面的内容基本涵盖你要画的图表的所有内容
var option = {
    title : {
        text: '报告浏览数据图',
        left:'center',
        top:'10'
        },
    backgroundColor: '#FBFBFB',
    tooltip: {
        trigger: 'axis'
    },
    legend: { /* 线条提示  */
        orient:'vertical',
        left:'right',
        data: ['浏览数量', '留言数量']
    },
    calculable: true,
    xAxis: [{
        axisLabel: {
            rotate: 30,
            interval: 0
        },
        name:'日期',  /* x轴 */
        axisLine: {
            lineStyle: {
                color: 'black'
            }
        },
        type: 'category',
        boundaryGap: false,
        data: []
    }],
    yAxis: [{
        name:'数量',  /* y轴 */
        type: 'value',
        axisLine: {
            lineStyle: {
                color: 'black'
            }
        }
    }],
    series: [{
        name: '浏览数量',
        type: 'line',
        symbol: 'none',
        smooth: 0.2,
        color: ['#FF6E33'],
        data: []
    }, {
        name: '留言数量',
        type: 'line',
        symbol: 'none',
        smooth: 0.2,
        color: ['#8087CC'],
        data: []
    }],
    dataZoom:[ {
        type: 'slider',	//支持鼠标滚轮缩放
        orient: 'horizontal',
        handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
        handleSize: '80%',
        handleStyle: {
            color: '#fff',
            borderColor: '#0e84de'
        }
    },
    {
        type: 'inside',	//支持单独的滑动条缩放
        start: 0,			//默认数据初始缩放范围为10%到90%
        end: 100
    }
    ],
};

批量导出为Excel


package com.hqyj.mana.controller;

import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.text.DateFormat;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Date;
import java.util.HashMap;
import java.util.LinkedHashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

import org.apache.poi.hssf.usermodel.HSSFSheet;
import org.apache.poi.hssf.usermodel.HSSFWorkbook;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import com.hqyj.mana.pojo.ReportInfo;
import com.hqyj.mana.service.ReportService;
import com.hqyj.mana.util.ExcelUtil;
import com.hqyj.mana.vo.ClickNumVO;
import com.hqyj.mana.vo.ReportVO;

@Controller
public class ReportController {

	private static Logger log = LoggerFactory.getLogger(ReportController.class);

	@Autowired
	private ReportService reportService;

	/**
	 * 前往报告页面
	 * 
	 * @return
	 */
	@RequestMapping("/toreport.do")
	public String toReport() {
		return "report";
	}

	/**
	 * 查询
	 * 
	 * @param pageSize
	 * @param pageNumber
	 * @param reportInfo
	 * @return
	 */
	@RequestMapping(value = "/report/getAllReport.do", method = RequestMethod.POST)
	@ResponseBody
	public Map<String, Object> getAllReportInfo(int pageSize, int pageNumber, ReportInfo reportInfo) {
		Map<String, Object> param = new HashMap<String, Object>();
		// System.out.println(reportInfo.getReporttitle());
		String reporttitle = reportInfo.getReporttitle();
		String reporttime = reportInfo.getReporttime();
		String reporter = reportInfo.getReporter();
		String sitecode = reportInfo.getSitecode();
		int a = (pageNumber - 1) * pageSize;
		int b = pageSize;
		param.put("a", a);
		param.put("b", b);
		if (reporttitle != null && reporttitle != "") {
			reporttitle = '%' + reporttitle + '%';
		}
		if (reporttime != null && reporttime != "") {
			reporttime = '%' + reporttime + '%';
		}
		if (reporter != null && reporter != "") {
			reporter = '%' + reporter + '%';
		}
		if (sitecode != null && sitecode != "") {
			sitecode = '%' + sitecode + '%';
		}
		param.put("reporttitle", reporttitle);
		param.put("reporttime", reporttime);
		param.put("reporter", reporter);
		param.put("sitecode", sitecode);
		return reportService.getAllReport(param);
	}

	/**
	 * 批量删除
	 * 
	 * @param id
	 * @return
	 */
	@RequestMapping(value = "delReports.do", method = RequestMethod.POST)
	@ResponseBody
	public boolean delReports(String id) {
		System.err.println(id);
		// 对接收的id字符串切片
		String arr[];// 定义数组，存放切片后的id
		List<String> list = new ArrayList<String>();// 定义集合，将切片后的id数组转换为集合
		if (id != null && !"".equals(id)) { // 判断接收的id字符串是否为空
			arr = id.split(","); // 根据","切片
			list = Arrays.asList(arr); // 将数组转换为集合
		}
		if (reportService.delReports(list)) {
			return true;
		} else {
			return true;
		}
	}

	/**
	 * 导出
	 * 
	 * @param reportInfo
	 * @return
	 */
	@RequestMapping(value = "exportreport.do", method = RequestMethod.POST)
	@ResponseBody
	public boolean exportReport(ReportInfo reportInfo) {
		List<Map<String, String>> result = new ArrayList<>();// 最终返回结果集合
		List<ReportInfo> reportInfos = reportService.exportAllRepoet(reportInfo);
		int i = 1;// 定义表序号
		for (ReportInfo reInfo : reportInfos) {
			Map<String, String> rmap = new LinkedHashMap<>();
			rmap.put("序号", "" + i);
			// 1
			if (reInfo.getId() == null) {
				rmap.put("报告编号", "无数据");
			} else {
				String id = reInfo.getId();
				rmap.put("报告编号", id);
			}
			// 2
			if (reInfo.getReporter() == null) {
				rmap.put("报告人", "无数据");
			} else {
				String reporter = reInfo.getReporter();
				rmap.put("报告人", reporter);
			}
			// 3
			if (reInfo.getReporttitle() == null) {
				rmap.put("标题", "无数据");
			} else {
				String reporttitle = reInfo.getReporttitle();
				rmap.put("标题", reporttitle);
			}
			// 4
			if (reInfo.getPageurl() == null) {
				rmap.put("报告网址", "无数据");
			} else {
				String pageurl = reInfo.getPageurl();
				rmap.put("报告网址", pageurl);
			}
			// 5
			if (reInfo.getSitecode() == null) {
				rmap.put("地址代码", "无数据");
			} else {
				String sitecode = reInfo.getSitecode();
				rmap.put("地址代码", sitecode);
			}
			// 6
			if (reInfo.getReporterbrief() == null) {
				rmap.put("报告人简介", "无数据");
			} else {
				String reporterbrief = reInfo.getReporterbrief();
				rmap.put("报告人简介", reporterbrief);
			}
			// 7
			if (reInfo.getSubjectid() == null) {
				rmap.put("课程编号", "无数据");
			} else {
				String subjectid = reInfo.getSubjectid();
				rmap.put("课程编号", subjectid);
			}
			// 8
			if (reInfo.getClicknum() == null) {
				rmap.put("查看次数", "无数据");
			} else {
				String clicknum = reInfo.getClicknum() + "";
				rmap.put("查看次数", clicknum);
			}
			// 9
			if (reInfo.getEvaluatescore() == null) {
				rmap.put("评分", "无数据");
			} else {
				String evaluatescore = reInfo.getEvaluatescore() + "";
				rmap.put("评分", evaluatescore);
			}
			// 10
			if (reInfo.getRemark() == null) {
				rmap.put("摘要", "无数据");
			} else {
				String remark = reInfo.getRemark();
				rmap.put("摘要", remark);
			}
			// 11
			if (reInfo.getReporttime() == null) {
				rmap.put("报告时间", "无数据");
			} else {
				String reporttime = reInfo.getReporttime();
				rmap.put("报告时间", reporttime);
			}
			// 12
			if (reInfo.getReportcategory() == null) {
				rmap.put("科目码", "无数据");
			} else {
				String reportcategory = reInfo.getReportcategory() + "";
				rmap.put("科目码", reportcategory);
			}
			// 13
			if (reInfo.getReportlocation() == null) {
				rmap.put("详细地点", "无数据");
			} else {
				String reportlocation = reInfo.getReportlocation();
				rmap.put("详细地点", reportlocation);
			}
			// 14
			if (reInfo.getReportformattime() == null) {
				rmap.put("时间戳", "无数据");
			} else {
				String reportformattime = reInfo.getReportformattime();
				rmap.put("时间戳", reportformattime);
			}
			i++;// 表序号增加
			result.add(rmap);
		}
		Date d = new Date();
		DateFormat fm = new SimpleDateFormat("yyyyMMddHHmmss");
		String time = fm.format(d);
		DateFormat fm2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
		String time2 = fm2.format(d);
		// 设置excel表属性
		String fileName = "报告信息表(" + time + ").xls"; // 定义文件名
		String headString = "报告信息表(创建时间" + time2 + ")"; // 定义表格标题
		String sheetName = "报告信息表一"; // 定义工作表表名
		String filePath = "D:\\"; // 文件本地保存路径
		String[] thead = { "序号", "报告编号", "报告人", "标题", "报告网址", "地址代码", "报告人简介", "课程编号", "查看次数", "评分", "摘要", "报告时间",
				"科目码", "详细地点", "时间戳" };// 定义表头内容
		int[] sheetWidth = { 2800, 5000, 3200, 4000, 5000, 5000, 4000, 4000, 4000, 5000, 5000, 4000, 4000, 5000, 5000 }; // 定义每一列宽度
		// 创建工作簿
		HSSFWorkbook wb = new HSSFWorkbook();
		// 创建sheet页,并命名
		HSSFSheet sheet = wb.createSheet(sheetName);
		// 创建表格的标题
		ExcelUtil.createHeadTittle(wb, sheet, headString, result.get(0).size() - 1);// （result.get(0).size() -
																					// 1）为表格占用列数，从0开始
		// 创建表头
		ExcelUtil.createThead(wb, sheet, thead, sheetWidth);
		// 填入数据
		ExcelUtil.createTable(wb, sheet, result);

		try {
			// 创建输出流，将数据输出到文件
			FileOutputStream fos = new FileOutputStream(new File(filePath + fileName));// filePath,fileName是如上定义的文件保存路径及文件名
			wb.write(fos);// 写入数据
			fos.close();// 关闭输出流
		} catch (IOException e) {
			e.printStackTrace();
		}
		return true;
	}

	/**
	 * 导入
	 * 
	 * @param file
	 * @param request
	 * @return
	 */
	@RequestMapping("/importReport.do")
	@ResponseBody
	public String importExcel(@RequestParam("file") MultipartFile file, HttpServletRequest request) {
		String flag = "02";// 上传标志
		if (!file.isEmpty()) {
			try {
				String originalFilename = file.getOriginalFilename();// 原文件名字
				log.info("文件名：" + originalFilename);
				InputStream is = file.getInputStream();// 获取输入流
				flag = reportService.importReport(is, originalFilename);
			} catch (Exception e) {
				flag = "03";// 上传出错
				e.printStackTrace();
			}
		}
		return flag;
	}

	/**
	 * 添加
	 */
	@RequestMapping(value = "/addReport.do", method = RequestMethod.POST)
	@ResponseBody
	public boolean addReport(ReportVO reportVO) {
		String time = getCurrDate();
		reportVO.setCrawltime(time);
		return reportService.addReport(reportVO);
	}

	/**
	 * 获取当前日期
	 *
	 * @return
	 */
	public static String getCurrDate() {
		Calendar calendar = Calendar.getInstance();
		SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
		return format.format(calendar.getTime());
	}

	/**
	 * 单项删除
	 * 
	 * @param id
	 * @return
	 */
	@RequestMapping(value = "/delreport.do", method = RequestMethod.POST)
	@ResponseBody
	public boolean delreport(String id) {
		return reportService.delreport(id);
	}

	/**
	 * 修改
	 * 
	 * @return
	 */
	@RequestMapping(value = "/updateReportInfo.do", method = RequestMethod.POST)
	@ResponseBody
	public boolean updateReportInfo(@RequestBody(required = false) ReportVO reportVO) {
		System.out.println(reportVO.getUid());
		return reportService.updateByPrimaryKeySelective(reportVO);
	}
	
	/**
	 * 修改点击次数
	 * @param title
	 */
	@RequestMapping("/deal.do")
	@ResponseBody
	public String clickNum(String title) {
		int clicknum = reportService.getClickNum(title);
		log.info("原始的点击数"+clicknum);
		ClickNumVO clickNumVO = new ClickNumVO();
		clicknum += 1;
		clickNumVO.setClicknum(clicknum);
		clickNumVO.setReporttitle(title);
		reportService.updateClickNum(clickNumVO);
		log.info("点击次数："+clicknum);
		return "reports";
	}
	
	/**
	 * 修改点击次数
	 * @param title
	 */
	@RequestMapping("/deal1.do")
	@ResponseBody
	public String clickNum1(String title1) {
		int clicknum = reportService.getClickNum(title1);
		ClickNumVO clickNumVO = new ClickNumVO();
		clicknum += 1;
		clickNumVO.setClicknum(clicknum);
		clickNumVO.setReporttitle(title1);
		reportService.updateClickNum(clickNumVO);
		log.info("点击次数："+clicknum);
		return "reports";
	}
	
	/**
	 * 修改点击次数
	 * @param title
	 */
	@RequestMapping("/deal2.do")
	@ResponseBody
	public String clickNum2(String title2) {
		int clicknum = reportService.getClickNum(title2);
		ClickNumVO clickNumVO = new ClickNumVO();
		clicknum += 1;
		clickNumVO.setClicknum(clicknum);
		clickNumVO.setReporttitle(title2);
		reportService.updateClickNum(clickNumVO);
		log.info("点击次数："+clicknum);
		return "reports";
	}
	
	/**
	 * 修改点击次数
	 * @param title
	 */
	@RequestMapping("/deal3.do")
	@ResponseBody
	public String clickNum3(String title3) {
		int clicknum = reportService.getClickNum(title3);
		ClickNumVO clickNumVO = new ClickNumVO();
		clicknum += 1;
		clickNumVO.setClicknum(clicknum);
		clickNumVO.setReporttitle(title3);
		reportService.updateClickNum(clickNumVO);
		log.info("点击次数："+clicknum);
		return "reports";
	}
}


整个项目完全符合MVC思想，纯原创项目，项目结构~：