- JSp:
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- %>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <base href="<%=basePath%>" rel="external nofollow">
- <meta charset="utf-8">
- <meta name="viewport"
- content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
- <title > 用户信息表</title>
- <meta http-equiv="pragma" content="no-cache">
- <meta http-equiv="cache-control" content="no-cache">
- <meta http-equiv="expires" content="0">
- <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
- <meta http-equiv="description" content="This is my page">
- <!--
- <link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow">
- -->
- <link rel="stylesheet" type="text/css"
- href="js/layui-v2.2.6/layui/css/layui.css" rel="external nofollow" media="all">
- </head>
- <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
- <script type="text/javascript" src="js/layui-v2.2.6/layui/layui.all.js"></script>
- <script type="text/html" id="barDemo">
- <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
- <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
- <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
- </script>
- <script type="text/javascript">
- $(function(){
- layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function(){
- var laydate = layui.laydate // 日期
- ,laypage = layui.laypage // 分页
- ,layer = layui.layer // 弹层
- ,table = layui.table // 表格
- ,carousel = layui.carousel // 轮播
- ,upload = layui.upload // 上传
- ,element = layui.element; // 元素操作
- // 监听 Tab 切换
- element.on('tab(demo)', function(data){
- layer.msg('切换了:'+ this.innerHTML);
- console.log(data);
- });
- // 执行一个 table 实例
- table.render({
- elem: '#userList'
- ,height: 'full'
- ,url: 'user/selectUserList.do' // 数据接口
- ,method: 'POST'
- ,cellMinWidth: 80 // 全局定义常规单元格的最小宽度, layui 2.2.1 新增
- ,page: { // 支持传入 laypage 组件的所有参数(某些参数除外, 如: jump/elem) - 详见文档
- layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] // 自定义分页布局
- //,curr: 5 // 设定初始在第 5 页
- ,groups: 5 // 只显示 5 个连续页码
- ,first: true // 显示首页
- ,last: true // 显示尾页
- }
- ,limits : [2,3]
- ,cols: [[ // 表头
- {checkbox : true}
- ,{field: 'id', title: 'ID', width:50, sort: true, fixed: 'left'}
- ,{field: 'name', title: '用户名', width:200}
- ,{field: 'username', title: '账号', width:200, sort: true}
- ,{field: 'tel', title: '电话', width:200}
- ,{field: 'QQ', title: 'QQ', width: 200}
- ,{field: 'WeChat', title: '微信', width: 200, sort: true}
- ,{field: 'role', title: 'role', width: 80, sort: true}
- ,{field: 'createDate', title: '创建时间', width: 200}
- ,{field: 'isDelete', title: '是否删除', width: 200, sort: true}
- ,{fixed: 'right', title:'操作' , width: 200, align:'center', toolbar: '#barDemo'}
- ]]
- ,where : {
- // 传值 startDate : startDate,
- }
- ,response: {
- statusName: 'code' // 数据状态的字段名称, 默认: code
- ,statusCode: 200 // 成功的状态码, 默认: 0
- ,msgName: 'message' // 状态信息的字段名称, 默认: msg
- ,countName: 'totalCount' // 数据总数的字段名称, 默认: count
- ,dataName: 'data' // 数据列表的字段名称, 默认: data
- }/* ,
- done: function(res, curr, count){
- // 如果是异步请求数据方式, res 即为你接口返回的信息.
- // 如果是直接赋值的方式, res 即为:{data: [], count: 99} data 为当前页数据, count 为数据总长度
- console.log(res.data);
- // 得到当前页码
- console.log(curr);
- // 得到数据总量
- console.log(count);
- } */
- });
- // 监听工具条
- table.on('tool(userList)', function(obj){ // 注: tool 是工具条事件名, test 是 table 原始容器的属性 lay-filter="对应的值"
- console.log(obj)
- var data = obj.data // 获得当前行数据
- ,layEvent = obj.event; // 获得 lay-event 对应的值
- if(layEvent === 'detail'){
- layer.msg('查看操作');
- } else if(layEvent === 'del'){
- layer.confirm('真的删除行么', function(index){
- obj.del(); // 删除对应行 (tr) 的 DOM 结构
- layer.close(index);
- // 向服务端发送删除指令
- });
- } else if(layEvent === 'edit'){
- layer.msg('编辑操作');
- }
- });
- });
- });
- </script>
- <body>
- <fieldset class="layui-elem-field layui-field-title"
- style="margin-top: 20px;">
- <legend > 默认表格</legend>
- </fieldset>
- <div>
- <table class="layui-hide" id="userList" lay-filter="userList"></table>
- </div>
- </body>
- </html>
- Controller
- package com.xiaoye.app.controller;
- import java.sql.SQLException;
- import org.apache.log4j.Logger;
- import org.springframework.beans.factory.annotation.Autowired;
- import org.springframework.stereotype.Controller;
- import org.springframework.web.bind.annotation.RequestMapping;
- import org.springframework.web.bind.annotation.RequestMethod;
- import org.springframework.web.bind.annotation.ResponseBody;
- import com.xiaoye.app.common.MsgReturn;
- import com.xiaoye.app.constant.passWordUtil;
- import com.xiaoye.app.entity.User;
- import com.xiaoye.app.service.UserService;
- import com.xiaoye.app.util.PropertyCodeMsgUtil;
- import com.xiaoye.app.util.StringUtil;
- @Controller(value = "userController")
- /**
- *
- * @author xiaoye
- * @date 2018 年 5 月 3 日
- *
- * 此类的全局访问 "user/xxx.do"
- */
- @RequestMapping(value = "user/")
- public class UserController {
- @Autowired
- // @Qualifier("userService")
- private UserService userService;
- private static final Logger logger = Logger.getLogger(UserController.class);
- @RequestMapping(value = "login", method = RequestMethod.POST)
- @ResponseBody
- public MsgReturn login(User user) {
- if (user == null) {
- return MsgReturn.ERROR_PARAM;
- }
- String password = user.getPassword();
- if (StringUtil.isEmpty(user.getUsername()) || StringUtil.isEmpty(password)) {
- return MsgReturn.ERROR_PARAM;
- }
- user.setPassword(passWordUtil.md5ToRandomMd5(password));
- try {
- return userService.login(user);
- } catch (SQLException e) {
- e.printStackTrace();
- logger.info(PropertyCodeMsgUtil.getPropertyValue(MsgReturn.EXCEPTION_SQL), e);
- }
- return MsgReturn.ERROR_ERROR;
- }
- @RequestMapping(value = "selectUserList", method = RequestMethod.POST)
- @ResponseBody
- public MsgReturn selectUserList(User user) {
- try {
- return userService.selectUserList(user);
- } catch (SQLException e) {
- e.printStackTrace();
- logger.info(PropertyCodeMsgUtil.getPropertyValue(MsgReturn.EXCEPTION_SQL), e);
- }
- return MsgReturn.ERROR_ERROR;
- }
- }
返回类型
- MsgReturn
- package com.xiaoye.app.common;
- import com.xiaoye.app.util.PropertyCodeMsgUtil;
- /**
- * 前后台返回数据用的桥接
- *
- * @author xiaoye
- * @date 2018 年 5 月 3 日
- *
- *
- */
- public class MsgReturn {
- /**
- * 成功 / 错误码
- */
- private String code;
- /**
- * 提示信息
- */
- private Object message;
- /**
- * 返回数据
- */
- private Object data;
- // -------- 系统错误 --------
- /**
- * 系统繁忙
- */
- public static String ERROR = "0";
- /**
- * 参数错误
- */
- public static String ERROR_PARAME = "1";
- /**
- * 登录异常
- */
- public static String LOAD_ERROR = "2";
- /**
- * 登录失败
- */
- public static String LOAD_EXCEPTION = "3";
- /**
- * 無數據
- */
- public static String NODATA = "4";
- // -------- 用户错误 --------
- /**
- * 验证码错误
- */
- public static String VERIFICATION_CODE_ERROR = "10";
- /**
- * 用户名不存在
- */
- public static String USERNAME_NOT_EXIST = "11";
- /**
- * 密码错误
- */
- public static String PASSWOR_ERROR = "12";
- /**
- * 手机号码长度有误
- */
- public static String TEL_LENGTH_ERROR = "13";
- /**
- * 请输入正确的手机号
- */
- public static String TEL_IS_FALSE = "14";
- /**
- * 邮箱格式有误
- */
- public static String EMAIL_FORMAT_ERROR = "15";
- /** ---------------300 异常
- * 数据库异常
- */
- public static String EXCEPTION_SQL = "300";
- /**
- * 成功
- */
- public static String SUCCESS = "200";
- private Integer totalCount;
- /**
- * 系统繁忙
- */
- public static MsgReturn ERROR_ERROR = new MsgReturn(ERROR, PropertyCodeMsgUtil.getPropertyValue(ERROR));
- /**
- * 参数错误
- */
- public static MsgReturn ERROR_PARAM = new MsgReturn(ERROR_PARAME, PropertyCodeMsgUtil.getPropertyValue(ERROR_PARAME));
- /**
- * 操作成功
- */
- public static MsgReturn SuccessMsg = new MsgReturn(SUCCESS, PropertyCodeMsgUtil.getPropertyValue(SUCCESS));
- public MsgReturn(String code, String message) {
- this.code = code;
- this.message = message;
- }
- public MsgReturn(String code, Object message, Object data) {
- super();
- this.code = code;
- this.message = message;
- this.data = data;
- }
- public MsgReturn(String code, Object message, Object data, Integer totalCount) {
- super();
- this.code = code;
- this.message = message;
- this.data = data;
- this.totalCount = totalCount;
- }
- public static MsgReturn success(Object data) {
- return new MsgReturn(SUCCESS, PropertyCodeMsgUtil.getPropertyValue(SUCCESS), data);
- }
- public static MsgReturn success(Object message, Object data) {
- return new MsgReturn(SUCCESS, message, data);
- }
- public static MsgReturn ERROR(Object data) {
- return new MsgReturn(ERROR_PARAME, null, data);
- }
- public static MsgReturn NODATA() {
- return new MsgReturn(NODATA, PropertyCodeMsgUtil.getPropertyValue(NODATA), null);
- }
- /**
- * 参数错误
- *
- * @return
- */
- public static MsgReturn PARAM_ERROR() {
- return new MsgReturn(ERROR_PARAME, PropertyCodeMsgUtil.getPropertyValue(ERROR_PARAME), null);
- }
- public String getCode() {
- return code;
- }
- public void setCode(String code) {
- this.code = code;
- }
- public Object getMessage() {
- return message;
- }
- public void setMessage(String message) {
- this.message = message;
- }
- public Object getdata() {
- return data;
- }
- public void setdata(Object data) {
- this.data = data;
- }
- public Integer getTotalCount() {
- return totalCount;
- }
- public void setTotalCount(Integer totalCount) {
- this.totalCount = totalCount;
- }
- public void setMessage(Object message) {
- this.message = message;
- }
- @Override
- public String toString() {
- return "MsgReturn [code=" + code + ", message=" + message + ", data=" + data + ", totalCount="
- + totalCount + "]";
- }
- }
来源: http://www.jb51.net/article/145631.htm