lst.html 8.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. <!--加载公共头部文件-->
  2. {include file='Base/top'}
  3. <!--加载公共左侧文件-->
  4. {include file='Base/left'}
  5. <!--加载公共底部文件-->
  6. {include file='Base/fotter'}
  7. <!-- 内容显示部分 -->
  8. <div class="layui-body">
  9. <!--面包屑导航-->
  10. <blockquote class="layui-elem-quote">
  11. <span class="layui-breadcrumb" style="visibility: visible;">
  12. <a >管理员管理</a>
  13. <span lay-separator="">/</span>
  14. <a href="{:url('index/lst')}">
  15. <cite>管理员信息</cite>
  16. </a>
  17. </span>
  18. </blockquote>
  19. <!--面包屑导航 结束-->
  20. <div class="layui-row layui-col-space10" style="margin:0 10px;">
  21. <div class="search" style="margin:10px 0px 5px -5px;"><!-- 搜索 -->
  22. <div class="layui-inline">
  23. <input type="text" class="layui-input" name="uname" id="users" autocomplete="off" placeholder="请输入账号">
  24. </div>
  25. <button class="layui-btn layui-btn-primary" data-type="reload">
  26. <i class="layui-icon"></i>搜索
  27. </button>
  28. </div>
  29. <table class="layui-hide" id="list" lay-filter="list"></table><!-- 表格数据 -->
  30. </div>
  31. </div>
  32. <!-- 表格操作栏模块 -->
  33. <script type="text/html" id="barDemo"><!-- 表格自定义操作按钮 -->
  34. {{# if(d.id == 1){ }}
  35. <a class="layui-btn layui-btn-xs" lay-event="edit">
  36. <i class="layui-icon">&#xe642;</i>编辑
  37. </a>
  38. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="#">
  39. <i class="layui-icon">&#xe640;</i>禁止删除
  40. </a>
  41. {{# } else{ }}
  42. <a class="layui-btn layui-btn-xs" lay-event="edit">
  43. <i class="layui-icon">&#xe642;</i>编辑
  44. </a>
  45. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">
  46. <i class="layui-icon">&#xe640;</i>删除
  47. </a>
  48. {{# } }}
  49. </script>
  50. <!-- 头部工具栏模块 -->
  51. <script type="text/html" id="toolbarDemo"><!-- 表格自定义操作按钮 -->
  52. <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="add">
  53. <i class="layui-icon">&#xe654;</i>添加
  54. </a>
  55. <div class="layui-btn-group demoTable">
  56. <button class="layui-btn layui-btn-danger layui-btn-xs" data-type="getCheckData">
  57. <i class="layui-icon">&#xe640;</i>批量删除
  58. </button>
  59. </div>
  60. </script>
  61. <script>
  62. layui.use(['table','layer','laypage','jquery'], function(){
  63. var table = layui.table,
  64. layer = layui.layer,
  65. laypage = layui.laypage,
  66. $ = layui.jquery;
  67. //数据表格
  68. table.render({
  69. elem: '#list'
  70. ,id:'idSystem'
  71. ,url:'{:url("lst_data")}'//数据接口(专门处理数据)
  72. ,height:'full'
  73. // ,toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
  74. ,toolbar: '#toolbarDemo'
  75. //分页
  76. ,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
  77. layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
  78. ,curr: 1 //设定初始在第 5 页
  79. ,limit:5 //一页显示多少条
  80. ,limits:[5,15,25]//每页条数的选择项
  81. ,groups: 3 //只显示 2 个连续页码
  82. ,first: "首页" //不显示首页
  83. ,last: "尾页" //不显示尾页
  84. }
  85. ,cols: [[
  86. {type: 'checkbox', fixed: 'left'}
  87. ,{field: 'id', title: 'ID', align:'center',width: 80}
  88. ,{field: 'uname', title: '账号',align:'center', width: 120}
  89. ,{field: 'last_login_time', title: '最后登录时间',align:'center', width: 190}
  90. ,{field:'actions',title: '操作',toolbar: '#barDemo',align:'left',width:300,fixed:'right'}
  91. ]]
  92. });
  93. // 执行搜索,表格重载
  94. $('.search .layui-btn-primary').on('click',function () {
  95. // 搜索条件
  96. var id = $('#users').val();
  97. if(id==''){
  98. layer.msg('搜索条件不能为空');
  99. return false;
  100. }
  101. table.reload('idSystem', {
  102. page: {
  103. curr: 1
  104. }
  105. ,where: {
  106. uname: id
  107. }
  108. });
  109. });
  110. //监听头工具栏事件
  111. table.on('toolbar(list)', function(obj){
  112. var checkStatus = table.checkStatus(obj.config.id)
  113. ,data = checkStatus.data; //获取选中的数据
  114. switch(obj.event){
  115. case 'add'://添加
  116. var index = layer.open({
  117. type:2,
  118. title:"添加管理员",
  119. maxmin:true,
  120. width:'auto',
  121. offset : '100px',
  122. area :['1000px','600px'],
  123. content:"{:url('index/add')}"
  124. });
  125. break;
  126. };
  127. });
  128. //监听行工具事件
  129. table.on('tool(list)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
  130. var data = obj.data; //获得当前行数据
  131. var layEvent = obj.event; //获得 lay-event 对应的值
  132. var tr = obj.tr; //获得当前行 tr 的DOM对象
  133. switch(layEvent){
  134. case 'edit'://编辑
  135. var index = layer.open({
  136. type:2,
  137. title:"编辑信息",
  138. maxmin:true,
  139. width:'auto',
  140. offset : '100px',
  141. area :['1000px','600px'],
  142. content:"{:url('index/edit')}?id="+data.id
  143. });
  144. break;
  145. case 'del'://删除
  146. layer.confirm('确定要删除吗?',{icon: 5},function(index){
  147. $.post("{:url('index/del')}?id="+data.id,function(res){
  148. if(res == 1){
  149. obj.del();
  150. layer.msg('删除成功!');
  151. }else if(res==3){
  152. layer.msg('超级管理员不允许删除!');
  153. }else{
  154. layer.msg('没有删除权限',{icon:5});
  155. }
  156. })
  157. });
  158. break;
  159. };
  160. // if(layEvent=='del'){
  161. // location.href = "{:url('index/del')}?id="+data.id;
  162. // }
  163. });
  164. //批量删除————————————————————————————————————————
  165. var $ = layui.$, active = {
  166. getCheckData: function(){ //获取选中数据
  167. var checkStatus = table.checkStatus('idSystem')
  168. ,data = checkStatus.data;
  169. if(data==""){
  170. layer.msg('请选择需要删除的数据',{icon:2});
  171. return;
  172. }
  173. var ids = [];
  174. if(data.length>0){
  175. for(var i=0;i<data.length;i++){
  176. ids+=data[i].id+",";
  177. }
  178. }
  179. layer.confirm('确定要删除id为'+ids+'的用户信息吗?',function(index){
  180. $.ajax({
  181. type:'POST',
  182. url:'{:url("index/pdel")}',
  183. data:{"ids":ids},
  184. success:function(data){
  185. if(data==1){
  186. // layer.msg('删除成功',{icon:1});
  187. layer.msg('删除成功',{icon:1},function () {
  188. var index = parent.layer.getFrameIndex(window.name);// 获得frame索引
  189. parent.layer.close(index);//关闭当前frame
  190. parent.layui.table.reload('idSystem');//成功刷新父窗口的 table
  191. });
  192. }else{
  193. layer.msg('没有批量删除权限',{icon:5});
  194. }
  195. }
  196. })
  197. })
  198. }
  199. }
  200. $('.demoTable .layui-btn-xs').on('click', function(){
  201. var type = $(this).data('type');
  202. active[type] ? active[type].call(this) : '';
  203. });
  204. //批量删除结束————————————————————————————————————————————————————
  205. });
  206. </script>