用户管理 - 普通用户列表

<!-- 用户管理页面 -->
<div class='panel panel-default'>
  <div class='panel-heading'>
    <h3 class='panel-title'>普通用户列表</h3>
  </div>
  <div class='panel-body'>
    <div id='toolbar'>
      <button id='btn_add' class='btn btn-primary' onclick='userNormal_add()'>添加用户</button>
      <button id='btn_edit' class='btn btn-warning' onclick='userNormal_edit()'>修改用户</button>
      <button id='btn_delete' class='btn btn-danger' onclick='userNormal_delete()'>删除用户</button>
    </div>
    <table id='userNormalTable' data-toggle='table'></table>
  </div>
</div>
<!-- 初始化参数 -->
<script>
var id;
var email;
var nickName;
var userState;
var createDate;

// 初始化表格的列
userNormal_initColumn = function () {
  var columns = [
    {field: 'selectItem', radio: true, visible: true},
    {title: 'id', field: 'id', visible: false, align: 'center', valign: 'middle'},
    {title: '邮箱地址', field: 'email', visible: true, align: 'center', valign: 'middle', sortable: true},
    {title: '昵称', field: 'nickName', visible: true, align: 'center', valign: 'middle', sortable: true},
    {title: '用户状态', field: 'userState', align: 'center', valign: 'middle', sortable: true,
      formatter: function (value, row, index) {
        if (value == 0) {
          return '启用';
        } else {
          return '禁用';
        }
      }
    },
    {title: '创建日期', field: 'createDate', align: 'center', valign: 'middle', sortable: true}
  ];
  return columns;
};

/**
 * 检查是否选中
 */
userNormal_check = function () {
  // 获得row数组
  var rows = $('#userNormalTable').bootstrapTable('getSelections');
  if (rows.length == 0) {
    return false;
  } else {
    return true;
  }
};

// 删除
userNormal_delete = function () {
  if (userNormal_check()) {
    // 获得当前选中行对象
    var rows = $('#userNormalTable').bootstrapTable('getSelections');
    // 获得选中id
    var id = rows[0].id;
    // 发送ajax执行删除
    $.ajax({
      url: '/user/remove',
      type: 'POST',
      data: {'id': id},
      success: function (data) {
        // 成功操作
        if (data == true) {
          layer.msg('删除成功');
          $('#userNormalTable').bootstrapTable('refresh');
        }
        // 失败操作
        else {
          layer.msg('删除失败');
        }
      },
      dataType: 'json'
    });
  } else {
    layer.msg('请先选中至少一条记录！');
  }
};

// 添加
userNormal_add = function () {
  var index = layer.open({
    type: 2,
    title: '添加用户',
    area: ['500px', '460px'], // 宽高
    fix: false, // 不固定
    maxmin: true,
    content: '/static/page/main/userMgr/normalUser_add.jsp'
  });
  this.layerIndex = index;
}

// 修改
userNormal_edit = function () {
  if (userNormal_check()) {
    // 获得当前选中行对象
    var rows = $('#userNormalTable').bootstrapTable('getSelections');
    // 获得参数
    var id = rows[0].id;
    var nickName = rows[0].nickName;
    var userState = rows[0].userState;
    var createDate = rows[0].createDate;
    var index = layer.open({
      type: 2,
      title: '修改用户',
      area: ['500px', '490px'], // 宽高
      fix: false, // 不固定
      maxmin: true,
      content: '/static/page/main/userMgr/normalUser_edit.jsp',
      data: {
        id: id,
        nickName: nickName,
        userState: userState,
        createDate: createDate
      }
    });
    this.layerIndex = index;
  } else {
    layer.msg('请先选中至少一条记录！');
  }
}

// 收集参数
function collectParam() {
  email = $('#email').val();
  nickName = $('#nickName').val();
  createDate = $('#createDate').val();
  userState = $('#userState').val();
}

// BootStrap查询
function userNormal_search() {
  // 收集参数
  collectParam();
  var opt = {
    url: '/user/queryCondition',
    silent: true,
    query: {
      email: email,
      nickName: nickName,
      createDate: createDate,
      userState: userState
    }
  };
  $('#userNormalTable').bootstrapTable('refresh', opt);
};

$(function () {
  var column = userNormal_initColumn();
  $('#userNormalTable').bootstrapTable({
    contentType: 'application/x-www-form-urlencoded',
    url: '/user/queryList',
    method: 'post', // ajax方式,post还是get
    //toolbar: '#toolbar', // 顶部工具条
    striped: true, // 是否显示行间隔色
    cache: false, // 是否使用缓存,默认为true
    sortable: true, // 是否启用排序
    sortOrder: 'desc', // 排序方式
    pagination: true, // 启用分页
    pageNumber: 1, // 初始化加载第一页，默认第一页
    pageSize: 5, // 每页的记录行数（*）
    pageList: [5, 10, 15, 'All'], // 可供选择的每页的行数（*）
    queryParamsType: 'limit', // 默认值为 'limit' ,在默认情况下 传给服务端的参数为：offset,limit,sort
    queryParams: {'param': 'testData'}, // 向后台传递的自定义参数
    sidePagination: 'client', // 分页方式：client客户端分页，server服务端分页（*）
    search: false, // 是否显示表格搜索，此搜索是客户端搜索，不会进服务端
    strictSearch: true, // 设置为 true启用 全匹配搜索，否则为模糊搜索
    showColumns: false, // 是否显示所有的列
    showRefresh: false, // 是否显示刷新按钮
    minimumCountColumns: 2, // 最少允许的列数
    clickToSelect: true, // 是否启用点击选中行
    searchOnEnterKey: true, // 设置为 true时，按回车触发搜索方法，否则自动触发搜索方法//pagination: true, // 是否显示分页条
    height: 365, // 底部栏高
    icons: {
      refresh: 'glyphicon-repeat',
      toggle: 'glyphicon-list-alt',
      columns: 'glyphicon-list'
    },
    iconSize: 'outline',
    columns: column // 列数组
  });
});
</script>