gameSetupManage.html 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>充值规则管理</title>
  6. <script src="../../js/min-loader-next.js"></script>
  7. </head>
  8. <body class="content">
  9. <div class="order-body">
  10. <div class="order-tiaojian back-gray">
  11. <div class="tiaojian-part1" id = "conditions">
  12. <div class="fl f12-gray4-op mt4">所选条件:</div>
  13. </div>
  14. <div class="tiaojian-part2 fr demoTable">
  15. <button class="layui-btn order-bnt1" data-type="reload" >搜索</button>
  16. <button class="layui-btn order-bnt2" data-type="reset">重置</button>
  17. <button class="layui-btn order-bnt2" id = "addGameSetup">添加</button>
  18. <a href="#" id="toggle" class="top">收起</a>
  19. </div>
  20. </div>
  21. <form class="layui-form" action="javascript:void(0)" id = "formName">
  22. <div class="order-select back-border" id="content">
  23. <div class="layui-inline">
  24. <label class="f12-gray4">游戏名称:</label>
  25. <input onchange = "changeSelectCon(0,this,'inp')" class="search-select" type="tel" name="name" id ="name" value="" placeholder="游戏名称" />
  26. </div>
  27. </div>
  28. </form>
  29. </div>
  30. <div class="shadow-content" style="margin:1.5rem;">
  31. <table id="gameSetupManage" lay-filter="tableFilter"></table>
  32. </div>
  33. <!--操作功能-->
  34. <script type="text/html" id="barDemo">
  35. <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
  36. <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  37. {{# if(d.state == '0'){ }}
  38. <a class="layui-btn layui-btn-xs" lay-event="stop">停用</a>
  39. {{# } }}
  40. {{# if(d.state == '1'){ }}
  41. <a class="layui-btn layui-btn-xs" lay-event="enable">启用</a>
  42. {{# } }}
  43. <a class="layui-btn layui-btn-xs" lay-event="del">删除</a>
  44. </script>
  45. <script>
  46. $("#toggle").click(function() {
  47. $(this).html($("#content").is(":hidden") ? "收起" + "<i class='iconfont up iconSelect_drop-down'/></i>" : "展开" +
  48. "<i class='iconfont up iconSelect_drop-down'/></i>");
  49. $("#content").slideToggle();
  50. });
  51. layui.use(['table','laydate','form'], function(){
  52. var laydate = layui.laydate;
  53. form = layui.form;
  54. form.render();
  55. })
  56. var table;
  57. layui.use('table', function(){
  58. table = layui.table;
  59. table.render({
  60. //tbname:'gameSetupManage',
  61. id : 'gameSetupManage'
  62. ,elem: '#gameSetupManage'
  63. ,limit:10
  64. ,url: 'GameSetupManageAction/queryGameSetup' //数据接口
  65. ,method: 'post'
  66. ,where:{MINView:"JSON"}
  67. ,page: true //开启分页
  68. ,cols: [[ //表头
  69. {type:'numbers',title: '序号',width:'5%'}
  70. ,{field: 'id', title: '编号', width:'10%', sort: true}
  71. ,{field: 'name', title: '游戏名称', width:'12%'}
  72. ,{field: 'typeDesc', title: '游戏类型', width:'12%'}
  73. ,{field: 'desc', title: '游戏规则', width:'15%'}
  74. ,{field: 'stateDesc', title: '状态',width:'15%'}
  75. ,{field: 'rewardGrade', title: '彩蛋等级',width:'8%'}
  76. ,{field: 'operate', title: '操作', width: '22%', toolbar: '#barDemo',fixed: 'right'}
  77. ]]
  78. ,done: function(res, curr, count){
  79. //如果是异步请求数据方式,res即为你接口返回的信息。
  80. console.log(res);
  81. //得到当前页码
  82. console.log(curr);
  83. //得到数据总量
  84. console.log(count);
  85. }
  86. ,even: true //开启隔行背景
  87. });
  88. // 监听工具条(操作)
  89. table.on('tool(tableFilter)', function(obj){ //注:tool是工具条事件名,tableFilter是table原始容器的属性 lay-filter="对应的值"
  90. var data = obj.data; //获得当前行数据
  91. var layEvent = obj.event; //获得 lay-event 对应的值(也可以是表头的 event 参数对应的值)
  92. var tr = obj.tr; //获得当前行 tr 的DOM对象
  93. var id = data.id;
  94. if(layEvent == 'detail'){ //查看
  95. showDetail(data);
  96. } else if(layEvent == 'del'){ //删除
  97. layer.confirm('真的要删除吗', function(index){
  98. $.request({
  99. action : 'GameSetupManageAction/deleteGameSetup',
  100. data : {
  101. id : id,//用户名
  102. state : '2'
  103. },
  104. success : function(data) {
  105. //成功后刷新
  106. var btn=$(".layui-laypage-btn")[0];
  107. btn.click();
  108. layer.alert('操作成功!', {
  109. icon: 6,
  110. title: "提示"
  111. });
  112. },
  113. error : function(data) {
  114. layer.alert('操作失败!', {
  115. icon: 5,
  116. title: "提示"
  117. });
  118. }
  119. });
  120. });
  121. } else if(layEvent == 'edit'){ //编辑
  122. editDetail(data);
  123. } else if(layEvent =='enable'){
  124. layer.confirm('真的要启用吗', function(index){
  125. $.request({
  126. action : 'GameSetupManageAction/deleteGameSetup',
  127. data : {
  128. id : id,//用户名
  129. state : '0'
  130. },
  131. success : function(data) {
  132. //成功后刷新
  133. var btn=$(".layui-laypage-btn")[0];
  134. btn.click();
  135. layer.alert('操作成功!', {
  136. icon: 6,
  137. title: "提示"
  138. });
  139. },
  140. error : function(data) {
  141. layer.alert('操作失败!', {
  142. icon: 5,
  143. title: "提示"
  144. });
  145. }
  146. });
  147. });
  148. }else if(layEvent =='stop'){
  149. layer.confirm('真的要停用吗', function(index){
  150. $.request({
  151. action : 'GameSetupManageAction/deleteGameSetup',
  152. data : {
  153. id : id,//用户名
  154. state : '1'
  155. },
  156. success : function(data) {
  157. //成功后刷新
  158. var btn=$(".layui-laypage-btn")[0];
  159. btn.click();
  160. layer.alert('操作成功!', {
  161. icon: 6,
  162. title: "提示"
  163. });
  164. },
  165. error : function(data) {
  166. layer.alert('操作失败!', {
  167. icon: 5,
  168. title: "提示"
  169. });
  170. }
  171. });
  172. });
  173. }
  174. });
  175. var $ = layui.$, active = {
  176. reload: function(){
  177. reLoadFun();
  178. }
  179. ,reset: function(){
  180. $('#formName')[0].reset();
  181. $("#conditions").html('<div class="fl f12-gray4-op mt4">所选条件:</div>');
  182. }
  183. };
  184. $('.layui-btn').on('click', function(){
  185. var type = $(this).data('type');
  186. active[type] ? active[type].call(this) : '';
  187. });
  188. });
  189. function reLoadFun() {
  190. var name = $('#name').val();
  191. //执行重载
  192. table.reload('gameSetupManage', {
  193. page: {
  194. curr: 1 //重新从第 1 页开始
  195. }
  196. ,where: {
  197. name : name,
  198. }
  199. });
  200. }
  201. function showDetail(data) {
  202. // 寄存当前数据
  203. layui.sessionData("ROW_DATA", {key:"NOW_ROW", value:data});
  204. openMainTabPage('101006-06', ' 查看', 'gameSetupManage/gameSetupDetail.html', '', '101006', reLoadFun);
  205. }
  206. //添加游戏规则
  207. $(document).on('click','#addGameSetup',function(){
  208. openMainTabPage('101006-01', ' 增加', 'gameSetupManage/addGameSetup.html', '', '101006', reLoadFun);
  209. });
  210. //编辑
  211. function editDetail(data) {
  212. // 寄存当前数据
  213. layui.sessionData("ROW_DATA", {key:"NOW_ROW", value:data});
  214. openMainTabPage('101006-03', ' 编辑', 'gameSetupManage/editSetupDetail.html', '', '101006', reLoadFun);
  215. }
  216. function changeSelectCon(index, t, type, dateValue){
  217. if (type == "date") {
  218. if (isEmpty(dateValue)) {
  219. $("#search" + index).remove();
  220. } else {
  221. $("#search" + index).remove();
  222. if (isEmpty($("#search" + index).attr("name"))) {
  223. $("#conditions").append(getSelectConHtml(index, t, type,dateValue));
  224. }
  225. }
  226. } else if (type == 'inp') {
  227. if (isEmpty($(t).val())) {
  228. $("#search" + index).remove();
  229. } else {
  230. $("#search" + index).remove();
  231. if (isEmpty($("#search" + index).attr("name"))) {
  232. $("#conditions").append(getSelectConHtml(index, t, type));
  233. }
  234. }
  235. } else {
  236. if (isEmpty($(t).val())) {
  237. $("#search" + index).remove();
  238. } else {
  239. $("#search" + index).remove();
  240. if (isEmpty($("#search" + index).attr("name"))) {
  241. $(t).attr("id",dateValue);
  242. $("#conditions").append(getSelectConHtml(index, t, type,dateValue));
  243. }
  244. }
  245. }
  246. }
  247. var array = new Array('游戏名称');
  248. function getSelectConHtml(index, t, type,dateValue){
  249. var name;
  250. var value;
  251. if(type == "inp"){
  252. value = t.value.substr(0,5)+"..";
  253. }
  254. var html = '<div class="fl xuanzhong-active" id = "search' + index + '" name = "' + name + '" onclick = "removeSearch(this)">' +
  255. '<div class="fl">' + array[index] + '</div>' +
  256. ':<i class="iconfont">'+value+'</i>' +
  257. '<svg class="icon" aria-hidden="true">' +
  258. '<use xlink:href="#iconicon_close1"></use>' +
  259. '</svg>' +
  260. '</div>';
  261. return html;
  262. }
  263. function removeSearch(t) {
  264. $("#"+$(t).attr("name")).val('');
  265. $(t).remove();
  266. }
  267. </script>
  268. </body>
  269. </html>