| <!DOCTYPE HTML> | 
| <html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> | 
| <head> | 
|     <meta charset="utf-8"> | 
|     <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> | 
|     <meta name="renderer" content="webkit|ie-comp|ie-stand"> | 
|     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | 
|     <meta name="viewport" | 
|           content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> | 
|     <meta http-equiv="Cache-Control" content="no-siteapp"/> | 
|     <!-- 本框架基本脚本和样式 --> | 
|     <script type="text/javascript" | 
|             th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
|     <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> | 
|   | 
| </head> | 
| <body class=" container-fluid"> | 
|   | 
| <div class="pd-10"> | 
|   | 
|     <!-- 搜索框部分start --> | 
|     <div class="row form-head"> | 
|         <div class="col-md-4 col-xs-12"> | 
|             <!-- 功能按钮部分 --> | 
|             <button matrix:btn="user-dels" onclick="myGrid.delItems('suId')" type="button" | 
|                     class="btn btn-danger btn-sm" > | 
|                 <i class="fa fa-trash"></i>批量删除R | 
|             </button> | 
|             <button matrix:btn="user-add" onclick="openAdd()" type="button" | 
|                     class="btn btn-success btn-sm"> | 
|                 <i class="fa fa-plus"></i> 新增 | 
|             </button> | 
|         </div> | 
|         <div class="col-md-8 col-xs-12"> | 
|             <div class="row"> | 
|                 <div class="col-md-11 col-xs-12" style="text-align: right"> | 
|                     <form class="form-inline" id="serchform"> | 
|                         <div class="input-group"> | 
|                             <div class="btn-group search-list " data-for="search-text"> | 
|                                 <button type="button" | 
|                                         class="btn btn-default dropdown-toggle searchlist" | 
|                                         data-toggle="dropdown"> | 
|                                     用户姓名 <span class="caret "></span> | 
|                                 </button> | 
|                                 <ul class="dropdown-menu" role="menu"> | 
|                                     <li data-field="suName"><a>用户姓名</a></li> | 
|                                     <li data-field="suAccount"><a>账号 </a></li> | 
|                                 </ul> | 
|                             </div> | 
|                             <div class="form-group mr-20 ml-20"> | 
|                                 <input autocomplete="off"   onenter id="search-text" name="suName" placeholder="输入查询关键词" | 
|                                        type="text" class="form-control"> | 
|                             </div> | 
|                             <div class="form-group"> | 
|                                 <button onclick="myGrid.serchData(1)" type="button" | 
|                                         class="btn btn-sm btn-info"> | 
|                                     <i class="fa fa-search "></i> 搜索 | 
|                                 </button> | 
|                                 <button type="reset" class="btn btn-sm btn-info "> | 
|                                     <i class="fa fa-refresh "></i> 重置 | 
|                                 </button> | 
|                             </div> | 
|                         </div> | 
|                     </form> | 
|                 </div> | 
|             </div> | 
|         </div> | 
|     </div> | 
|     <div class="row"> | 
|         <!-- 数据表格部分 --> | 
|         <table id="mgrid"> | 
|             <thead> | 
|             <tr> | 
|                 <th data-checkbox="true"></th> | 
|                 <th data-formatter="MGrid.indexfn" data-align="center" | 
|                     data-width="43px">序号 | 
|                 </th> | 
|                 <th data-field="suName" data-sortable="true">姓名</th> | 
|                 <th data-field="suAccount">账号</th> | 
|                 <th data-field="suTel">电话</th> | 
|                 <th data-field="suRegisterTime" data-formatter="MGrid.getTime" | 
|                     data-sortable="true">注册时间 | 
|                 </th> | 
|                 <th data-field="roleName">角色</th> | 
|                 <th data-align="center" data-field="suId" | 
|                     data-formatter="buidOperate">操作 | 
|                 </th> | 
|             </tr> | 
|             </thead> | 
|         </table> | 
|         <!-- 数据表格部分end --> | 
|     </div> | 
| </div> | 
|   | 
| <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> | 
| <script type="text/javascript"  > | 
|   | 
|   | 
|   | 
|   | 
|     //定义表格对象 | 
|     var myGrid; | 
|   | 
|     $(function () { | 
|         //定义删除数据的路径 | 
|         var delPath = ""; | 
|         //使用权限标签控制路径是否显示在界面上 | 
|         delPath = basePath + "/admin/del"; | 
|         //初始化表格对象 | 
|         myGrid = MGrid.initGrid({ | 
|             //fixedColumns: true, | 
|             //    fixedNumber: 1, | 
|             url: basePath + "/admin/showList",//url数据加载地址,表格初始化后会自动去后台加载数据。 | 
|             delUrl: delPath | 
|         }); | 
|   | 
|         // 实现显示 隐藏列 | 
|         $(".bootstrap-table ul.dropdown-menu").find('input[data-field=' + 'suName' | 
|             + ']').trigger("click"); | 
|   | 
|     }); | 
|   | 
|   | 
|   | 
|     var btns=[]; | 
|     btns[0] = "", btns[1] = "",btns[2] = "",btns[3] = "",btns[4] = ""; | 
|     //构建操作栏的按钮 | 
|     function buidOperate(value, row, index) { | 
|         var html = ""; | 
|         html +=  btns[0].replace('VALUE',value) | 
|             + btns[1].replace('VALUE',value) | 
|             + btns[2].replace('VALUE',value) | 
|             + btns[3].replace('VALUE',value) | 
|             + btns[4].replace('VALUE',value) | 
|         return html; | 
|     } | 
|   | 
|     //打开添加界面 | 
|     function openAdd() { | 
|         layer.open({ | 
|             type: 2, | 
|             title: "添加管理员", | 
|             maxmin: true, | 
|             area: MUI.SIZE_M, | 
|             content: [basePath + '/admin/editForm'] | 
|         }); | 
|     } | 
|   | 
|     //打开编辑界面 | 
|     function openEdit(id) { | 
|         layer.open({ | 
|             type: 2, | 
|             title: "编辑管理员", | 
|             area:MUI.SIZE_M, | 
|             maxmin: true, | 
|             content: [basePath + '/admin/editForm?id=' + id] | 
|         }); | 
|     } | 
|   | 
|     function resetPassword(id) { | 
|         MTools.handleItem(basePath + '/admin/resetPassword?id=' + id, | 
|             "确认要重置密码吗?"); | 
|     } | 
|   | 
|     function unlock(id) { | 
|         MTools.handleItem(basePath + '/admin/accountLock/unlock/?id=' | 
|             + id, "确认要解锁账号吗?", function () { | 
|             myGrid.serchData(); | 
|         }); | 
|   | 
|     } | 
|   | 
|     function lock(id) { | 
|         MTools.handleItem( | 
|             basePath + '/admin/accountLock/lock/?id=' + id, | 
|             "确认要锁定账号吗?", function () { | 
|                 myGrid.serchData(); | 
|             }); | 
|     } | 
| </script> | 
|   | 
| <!-- 权限按钮 --> | 
| <script matrix:btn="user-edit"  > | 
|     btns[0]='<a class="text-primary " href="javascript:void(0)" onClick="openEdit(\'VALUE\')" title="编辑">编辑</a>  ' | 
| </script> | 
| <script matrix:btn="user-resetPassword"  > | 
|     btns[1]='<a class="text-primary "  href="javascript:void(0)" onClick="resetPassword(\'VALUE\')" title="密码重置">密码重置</a>  ' | 
| </script> | 
| <script matrix:btn="user-accountLock"  > | 
|     btns[2]='<a class="text-primary "  href="javascript:void(0)" onClick="unlock(\'VALUE\')" title="解锁">解锁</a>  ' | 
| </script> | 
| <script matrix:btn="user-accountLock"  > | 
|     btns[3]='<a class="text-primary "  href="javascript:void(0)" onClick="lock(\'VALUE\')"  title="锁定">锁定</a>  ' | 
| </script> | 
| <script matrix:btn="user-del"  > | 
|     btns[4]='<a class="text-danger "  href="javascript:void(0)" onClick="myGrid.delItem(\'VALUE\')" title="删除">删除</a> ' | 
| </script> | 
|   | 
| </body> | 
| </html> |