SSH---------------用户管理-用户列表数据显示

前提：

1. 1. 用户列表中生日的显示

默认返回的生日数据格式如图

{

"birthday": {

"date": 1,

"day": 4,

"hours": 0,

"minutes": 0,

"month": 5,

"nanos": 0,

"seconds": 0,

"time": 1496246400000,

"timezoneOffset": -480,

"year": 117

}

解决在办法，在User模型中添加一个方法

SSH---------------用户管理-用户列表数据显示

然后修改界面显示字段为formatBirthday

1. 1. 把界面的电话字段改成显示角色
在User模型中添加一个roleNames方法

SSH---------------用户管理-用户列表数据显示

效果

SSH---------------用户管理-用户列表数据显示

1、jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
       pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   <title>Insert title here</title>
   <!-- 导入jquery核心类库 -->
   <script type="text/javascript"
         src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
   <!-- 导入easyui类库 -->
   <link rel="stylesheet" type="text/css"
        href="${pageContext.request.contextPath }/js/easyui/themes/default/easyui.css">
   <link rel="stylesheet" type="text/css"
        href="${pageContext.request.contextPath }/js/easyui/themes/icon.css">
   <link rel="stylesheet" type="text/css"
        href="${pageContext.request.contextPath }/js/easyui/ext/portal.css">
   <link rel="stylesheet" type="text/css"
        href="${pageContext.request.contextPath }/css/default.css">
   <script type="text/javascript"
         src="${pageContext.request.contextPath }/js/easyui/jquery.easyui.min.js"></script>
   <script type="text/javascript"
         src="${pageContext.request.contextPath }/js/easyui/ext/jquery.portal.js"></script>
   <script type="text/javascript"
         src="${pageContext.request.contextPath }/js/easyui/ext/jquery.cookie.js"></script>
   <script
         src="${pageContext.request.contextPath }/js/easyui/locale/easyui-lang-zh_CN.js"
         type="text/javascript"></script>
   <script type="text/javascript">
      // 工具栏
      var toolbar = [ {
         id : 'button-view',
         text : '查看',
         iconCls : 'icon-search',
         handler : doView
      }, {
         id : 'button-add',
         text : '新增',
         iconCls : 'icon-add',
         handler : doAdd
      }, {
         id : 'button-delete',
         text : '删除',
         iconCls : 'icon-cancel',
         handler : doDelete
      }];
      //定义冻结列
      var frozenColumns = [ [ {
         field : 'id',
         checkbox : true,
         rowspan : 2
      }, {
         field : 'username',
         title : '名称',
         width : 80,
         rowspan : 2
      } ] ];


      // 定义标题栏
      var columns = [ [ {
         field : 'gender',
         title : '性别',
         width : 60,
         rowspan : 2,
         align : 'center'
      }, {
         field : 'birthdayStr',
         title : '生日',
         width : 120,
         rowspan : 2,
         align : 'center'
      }, {
         title : '其他信息',
         colspan : 2
      }, {
         field : 'rolesStr',
         title : '角色',
         width : 800,
         rowspan : 2
      } ], [ {
         field : 'station',
         title : '单位',
         width : 80,
         align : 'center'
      }, {
         field : 'salary',
         title : '工资',
         width : 80,
         align : 'right'
      } ] ];
      $(function(){
         // 初始化 datagrid
         // 创建grid
         $('#grid').datagrid( {
            iconCls : 'icon-forward',
            fit : true,
            border : false,
            rownumbers : true,
            striped : true,
            toolbar : toolbar,
            pageList:[5,10,15],
            pageSize:10,
            pagination:true,
            url : "${pageContext.request.contextPath}/userAction_pageQuery.action",
            idField : 'id',
            frozenColumns : frozenColumns,
            columns : columns,
            onClickRow : onClickRow,
            onDblClickRow : doDblClickRow
         });

         $("body").css({visibility:"visible"});

      });
      // 双击
      function doDblClickRow(rowIndex, rowData) {
         var items = $('#grid').datagrid('selectRow',rowIndex);
         doView();
      }
      // 单击
      function onClickRow(rowIndex){

      }

      function doAdd() {
         alert("添加用户");
         location.href="${pageContext.request.contextPath}/page_admin_userinfo.action";
      }

      function doView() {
         alert("编辑用户");
         var item = $('#grid').datagrid('getSelected');
         console.info(item);
         //window.location.href = "edit.html";
      }

      function doDelete() {
         alert("删除用户");
         var ids = [];
         var items = $('#grid').datagrid('getSelections');
         for(var i=0; i<items.length; i++){
            ids.push(items[i].id);
         }

         console.info(ids.join(","));

         $('#grid').datagrid('reload');
         $('#grid').datagrid('uncheckAll');
      }

   </script>
</head>
<body class="easyui-layout" style="visibility:hidden;">
<div region="center" border="false">
   <table id="grid"></table>
</div>
</body>
</html>

2、User映射类

package com.dong.bos.model;


import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashSet;
import java.util.Objects;
import java.util.Set;

public class User {
    private String id;
    private String username;
    private String password;
    private Double salary;
    private Date birthday;
    private String gender;
    private String station;
    private String telephone;
    private String remark;

    private Set<Role> roles=new HashSet<Role>();

    public Set<Role> getRoles() {
        return roles;
    }

    public void setRoles(Set<Role> roles) {
        this.roles = roles;
    }

    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id = id;
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public Double getSalary() {
        return salary;
    }

    public void setSalary(Double salary) {
        this.salary = salary;
    }
    public String getRolesStr(){
        String str = "";
        for (Role role : roles){
            str += role.getName() + "、";
        }
        return str;
    }
    public String getBirthdayStr() {
        if(birthday!=null){
            SimpleDateFormat simpleDateFormat=new SimpleDateFormat("yyyy-MM-dd");
            return simpleDateFormat.format(birthday);
        }else {
            return "未提交生日";
        }

    }

    public Date getBirthday() {
        return birthday;
    }

    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    public String getStation() {
        return station;
    }

    public void setStation(String station) {
        this.station = station;
    }

    public String getTelephone() {
        return telephone;
    }

    public void setTelephone(String telephone) {
        this.telephone = telephone;
    }

    public String getRemark() {
        return remark;
    }

    public void setRemark(String remark) {
        this.remark = remark;
    }

    @Override
    public String toString() {
        return "User{" +
                "id='" + id + '\'' +
                ", username='" + username + '\'' +
                ", password='" + password + '\'' +
                ", salary=" + salary +
                ", birthday=" + birthday +
                ", gender='" + gender + '\'' +
                ", station='" + station + '\'' +
                ", telephone='" + telephone + '\'' +
                ", remark='" + remark + '\'' +
                '}';
    }
}

3、action

public void pageQuery() throws IOException {

    PageBeanSet();
    iUserService.pageQuery(pb);
    pagequery(new String[]{"currentPage", "pageSize", "detachedCriteria","roles" });

}