动吧用户行为日志模块的简单实现

一、页面的加载

0.业务分析

　　1.点击日志管理呈现日志列表页面

　　　　1）注册点击事件

　　　　2）定义事件处理函数

　　　　3）在事件处理函数中发送异步请求，加载页面并进行数据呈现

　　2.呈现日志列表页面的位置为mainContentId

　　3.将log_list.html(位置/templates/pages/sys)显示到mainContentId中

　　4.log_list.html页面加载完成后，需加载page.html页面和数据

页面跳转：点击日志管理异步加载log_list.html页面，log_list.html页面异步加载page.html页面

1. 数据库表结构设计

　　日志管理模块业务：需要记录用户在什么时间什么地点做了什么事情

　　所以日志模块的字段需要有：用户的登陆名，用户所做的操作（执行了什么方法，请求了什么参数），所用的时间（什么时间执行的操作，执行操作所用的时长）

CREATE TABLE `sys_logs` (
  `id` bigint(20) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) DEFAULT NULL COMMENT '登陆用户名',
  `operation` varchar(50) DEFAULT NULL COMMENT '用户操作',
  `method` varchar(200) DEFAULT NULL COMMENT '请求方法',
  `params` varchar(5000) DEFAULT NULL COMMENT '请求参数',
  `time` bigint(20) NOT NULL COMMENT '执行时长(毫秒)',
  `ip` varchar(64) DEFAULT NULL COMMENT 'IP地址',
  `createdTime` datetime DEFAULT NULL COMMENT '日志记录时间',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8 COMMENT='系统日志';

2. 页面跳转处理 PageController.java

　　项目中的所有页面处理，都放在PageController中（com.cy.pj.sys.controller）

　　日志模块的页面跳转：1.首先显示首页样式

　　　　　　　　　　　　2.显示日志管理模块的列表页面

　　　　　　　　　　　　3.显示日志模块列表页面下面的分页页面

@Controller
@RequestMapping("/")
public class PageController {
    //localhost:80/doIndexUI
    @RequestMapping("doIndexUI")
    public String doIndexUI() {
        return "starter";//首页页面
    }
    /**基于此方法返回日志列表页面(记住此页面并不是完整页面)*/
    @RequestMapping("log/log_list")
    public String doLogUI() {
        return "sys/log_list";
    }
    /**基于此方法返回分页页面元素
     * @throws InterruptedException */
    @RequestMapping("doPageUI")
    public String doPageUI(){
        //Thread.sleep(5000);
        return "common/page";
    }
}

　　首先访问首页页面starter.html，通过localhost:80/doIndexUI网址访问首页页面

　　然后点击日志管理时，需要显示日志页面，日志页面包括日志列表页面和日志分页页面两部分

　　sys/log_list为日志列表页面，common/page为分页页面

3. starter.html(首页)加载日志列表页面

　　点击日志管理，显示相应的日志列表页面，需要进行局部刷新，所以要是用异步加载

<script type="text/javascript">
   //此函数是在页面加载完成以后执行
   (function(){
     doLoadUI("load-log-id","log/log_list");
   })()
   //基于不同对象的点击事件执行资源加载操作
   function doLoadUI(id,url){
       $("#"+id).click(function(){//click事件处理函数
           //jquery中的load函数为一个异步加载的ajax函数。
           //此函数用于在指定位置异步加载资源(并将返回的资源填充到这个指定位置)
           $("#mainContentId").load(url);
       })
   }
</script>

　　(function(){})()函数是在页面加载完成之后执行和$(function(){})函数功能一致

　　日志管理的id值为load-log-id，对日志管理进行点击事件处理，然后异步加载资源

　　load函数为jQuery中的一个异步加载的ajax函数，此函数用于在制定位置异步加载资源，并将返回的资源填充到指定的位置（mainContentId）中

　　$("#load-log-id").click(function(){

　　　　$("#mainContentId").load("log/log_list");

　　})

　　其中log/log_list为页面跳转中的地址

4. log_list.html加载分页列表页面

$(function(){
    $("#pageId").load("doPageUI");
});

 　　在pageId的位置加载分页列表页面，代码写在日志列表页面中，有首页加载log_list页面，log_list页面加载分页页面。

二、数据的加载

0. 业务分析

　　1.显示日志数据（在数据库中的数据）　　

　　2.显示总记录数，总页数的值，显示当前页显示的数据为第几页

　　3.点击首页进入第一页，点击尾页进入最后一页，点击上一页查看当前页的上一页数据，点击下一页查看当前页的下一页数据

　　4.点击全选按钮后，下面的复选框也全被选中。当所有的复选框都被选中后，取消其中一个复选框的选中效果，全选的复选框被取消

1. 日志列表数据呈现

1.1 构建实体对象   Sys_Log

/**
  * 此对象主要用于封装数据库提取的数据或者向数据库写入的数据
 *  此对象中的属性建议和表中字段有对应的映射关系(名字，类型)
 *  建议：所有用于封装数据的对象都建议实现序列化接口(Serializable)
 * 1)序列化：将对象转换为字节的过程称之为对象序列化
 * 2)反序列化：将字节转换为对象的过程称之为反序列化
 * 3)应用场景：对对象进行缓存，将对象进行钝化(写入文件)，将对象通过网络进行传输
 */
@Data
public class SysLog implements Serializable{
    //对象在序列化和反序列化时会基于此id进行数据处理。
    //将对象序列化时会将这个id作为版本写入到字节中。
    //将字节反序列化会从字节中提取这个版本id然后和类中的版本id进行比对，一致则进行反序列化。
    private static final long serialVersionUID = -1592163223057343412L;
    private Integer id;
    //用户名
    private String username;
    //用户操作
    private String operation;
    //请求方法
    private String method;
    //请求参数
    private String params;
    //执行时长(毫秒)
    private Long time;
    //IP地址
    private String ip;
    //创建时间
    private Date createdTime;

}

 

　　pojo类用于封装数据库提取的数据或者向数据库中写入数据

　　pojo类与数据库中的字段名，类型都一一对应

　　所有用于封装的对象都建议使用实现序列化接口（Serializable）

1.2  分页字段的封装 　PageObject

/**
 *     基于此对象封装业务执行结果
 *     在Java语言，可以简单将内存中的对象分为两大类：
 *  1)存储数据的对象(设计的关键在属性上)-典型的POJO对象(VO,BO,DO)
 *  2)执行业务的对象(设计的关键在方法上)-典型的controller,service,dao
 */
@Data
@NoArgsConstructor
@AllArgsConstructor
public class PageObject<T> implements Serializable{//pojo中的bo对象,new PageObject<SysLog>
     private static final long serialVersionUID = -3130527491950235344L;
     /**总记录数(从数据库查询出来的)*/
     private Integer rowCount;
     /**总页数(基于rowCount和页面大小计算出来的)*/
     private Integer pageCount;
     /**页面大小(每页最多可以呈现的记录总数)*/
     private Integer pageSize;
     /**当前页码值(客户端传递)*/
     private Integer pageCurrent;
     /**当前页记录,list集合中的T由PageObject类上定义的泛型决定*/
     private List<T> records;
     public PageObject(Integer rowCount, Integer pageSize, Integer pageCurrent, List<T> records) {
        super();
        this.rowCount = rowCount;
        this.pageSize = pageSize;
        this.pageCurrent = pageCurrent;
        this.records = records;
        //计算总页数的方法一:
        //this.pageCount=this.rowCount/this.pageSize;
        //if(this.rowCount%this.pageSize!=0)pageCount++;
        //计算总页数的方法二：
        this.pageCount=(rowCount-1)/pageSize+1;
     }
}

 

　　PageObject用于封装分页操作，因为不光是日志管理模块要用上分页操作，所有的模块都要用，所以要使分页集合要具有通用性，PageObject,records要使用

　　注意区分存储数据的对象（pojo），执行业务的对象（service,controller,dao）

1.3 数据层接口对象 Dao   SysLogDao

 /**
       *     基于条件查询用户行为日志记录总数
       * @param username 查询条件
       * @return 查询到的记录总数
       */
      int getRowCount(String username);
      /**
       *     基于条件查询当前页记录
       * @param username 查询条件
       * @param startIndex 当前页数据的起始位置(用于limit 子句)
       * @param pageSize 当前页面大小(每页最多显示多少条记录)
       * @return 查询到的记录
       */
      List<SysLog> findPageObjects(String username,
              Integer startIndex,Integer pageSize);
}

 

　　日志管理模块查询日志记录总数时需要判断输入框中是否有

　　查询当前页面数据的功能，查询当前页面数据需要使用几个条件：1.输入框中是否填写了用户名

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　2.从那一页开始展示数据

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　3.当前页显示多少条数据

1.4 基于Dao接口创建映射文件

1.5

1.6

1.7