businessNumManage.html 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  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 = "addBtn">新增商户号</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="accountName" id ="accountName" value="" placeholder="请输入商户名称" />
  26. </div>
  27. <div class="layui-inline">
  28. <label class="f12-gray4">商户号:</label>
  29. <input onchange = "changeSelectCon(0,this,'inp')" class="search-select" type="tel" name="accountId" id ="accountId" value="" placeholder="请输入商户号" />
  30. </div>
  31. <div class="layui-inline">
  32. <label class="f12-gray4">商户类型:</label>
  33. <div class="" style="display:inline-block" id = 'type' name = 'type'></div>
  34. </div>
  35. </div>
  36. </form>
  37. </div>
  38. <div class="shadow-content" style="margin:1.5rem;">
  39. <table id="tableTest" lay-filter="tableFilter"></table>
  40. </div>
  41. <script type="text/html" id="barDemo">
  42. <!--<a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>-->
  43. <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  44. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  45. <!-- 这里同样支持 laytpl 语法,如: -->
  46. </script>
  47. <script type="text/html" id="checkboxDemo">
  48. <input type="checkbox" {{ d.certtype == '1' ? 'checked' : '' }}>
  49. </script>
  50. <script>
  51. $("#toggle").click(function() {
  52. $(this).html($("#content").is(":hidden") ? "收起" + "<i class='iconfont up iconSelect_drop-down'/></i>" : "展开" +
  53. "<i class='iconfont up iconSelect_drop-down'/></i>");
  54. $("#content").slideToggle();
  55. });
  56. var table;
  57. layui.use('table', function(){
  58. table = layui.table;
  59. // 加载数据
  60. table.render({
  61. //tbname:'roleTable',
  62. id: 'tableTest'
  63. ,elem: '#tableTest'
  64. ,limit:10
  65. ,url: '../../BusinessNumManageAction/businessNumManageQuery' //数据接口
  66. ,method: 'post'
  67. ,where:{MINView:"JSON"}
  68. ,page: true //开启分页
  69. ,cols: [[ //表头
  70. {field:'num', title: '序号',width:'10%', type:'numbers', fixed: true, align: 'center'}
  71. ,{field: 'id', title: '编号', width:'10%'}
  72. ,{field: 'name', title: '商户名称', width:'20%'}
  73. ,{field: 'usrid', title: '商户号', width:'20%'}
  74. ,{field: 'number', title: '终端号', width:'10%'}
  75. ,{field: 'typeDesc', title: '商户类型', width:'10%'}
  76. ,{field: 'createTime', title: '创建时间', width: '20%'}
  77. ,{field: 'operate', title: '操作', width: '20%', toolbar: '#barDemo', fixed: 'right'}
  78. ]]
  79. ,done: function(res, curr, count){
  80. //如果是异步请求数据方式,res即为你接口返回的信息。
  81. //如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度
  82. console.log(res);
  83. //得到当前页码
  84. console.log(curr);
  85. //得到数据总量
  86. console.log(count);
  87. }
  88. ,even: true //开启隔行背景
  89. });
  90. // 监听工具条(操作)
  91. table.on('tool(tableFilter)', function(obj){ //注:tool是工具条事件名,tableFilter是table原始容器的属性 lay-filter="对应的值"
  92. var data = obj.data; //获得当前行数据
  93. var layEvent = obj.event; //获得 lay-event 对应的值(也可以是表头的 event 参数对应的值)
  94. var tr = obj.tr; //获得当前行 tr 的DOM对象
  95. if(layEvent === 'detail'){ //查看
  96. showDetail(data);
  97. //do somehing
  98. } else if(layEvent === 'del'){ //删除
  99. layer.confirm('确认删除此数据?', function(index){
  100. layer.close(index);
  101. //向服务端发送删除指令roleDelete
  102. $.request({
  103. action : "../../BusinessNumManageAction/deleteBusinessNum",
  104. data : {
  105. id : data.id
  106. },
  107. success : function(resData) {
  108. if (resData.MINStatus == 0) {
  109. layer.alert('操作成功!', {icon: 1});
  110. obj.del(); //删除对应行(tr)的DOM结构,并更新缓存
  111. } else {
  112. layer.alert(resData.MINErrorMessage, {
  113. icon: 5,
  114. title: "提示"
  115. });
  116. }
  117. },
  118. error : function(data2){
  119. layer.alert(data2.MINErrorMessage, {
  120. icon: 5,
  121. title: "提示"
  122. });
  123. // layer.alert(resData.MINErrorMessage, {icon: 2});
  124. }
  125. });
  126. })
  127. } else if(layEvent === 'edit'){ //编辑
  128. updateDetail(data);
  129. }
  130. });
  131. var $ = layui.$, active = {
  132. getCheckData: function(){ //获取选中数据
  133. var checkStatus = table.checkStatus('tableTest')
  134. ,data = checkStatus.data;
  135. layer.alert(JSON.stringify(data));
  136. }
  137. ,getCheckLength: function(){ //获取选中数目
  138. var checkStatus = table.checkStatus('tableTest')
  139. ,data = checkStatus.data;
  140. layer.msg('选中了:'+ data.length + ' 个');
  141. }
  142. ,isAll: function(){ //验证是否全选
  143. var checkStatus = table.checkStatus('tableTest');
  144. layer.msg(checkStatus.isAll ? '全选': '未全选')
  145. }
  146. //搜索
  147. ,reload: function(){
  148. reloadRole();
  149. }
  150. //重置
  151. ,reset : function(){
  152. $('#formName')[0].reset();
  153. $("#conditions").html('<div class="fl f12-gray4-op mt4">所选条件:</div>');
  154. }
  155. };
  156. // $('.demoTable .layui-btn').on('click', function(){
  157. // var type = $(this).data('type');
  158. // active[type] ? active[type].call(this) : '';
  159. // });
  160. $('.layui-btn').on('click', function(){
  161. var type = $(this).data('type');
  162. active[type] ? active[type].call(this) : '';
  163. });
  164. });
  165. function reloadRole() {
  166. //角色名称
  167. var accountName = $("#accountName").val();
  168. var accountId = $("#accountId").val();
  169. var type = $('#formName').find("select[name='type']").val();
  170. //执行重载
  171. table.reload('tableTest', {
  172. page: {
  173. curr: 1 //重新从第 1 页开始
  174. }
  175. ,where: {
  176. accountName : accountName,
  177. accountId : accountId,
  178. type : type
  179. }
  180. });
  181. }
  182. initSelect('type', "BUSINESSNUM_TYPE", "type", ' ', true);
  183. function updateDetail(data) {
  184. layui.sessionData("ROW_DATA", {key:"NOW_ROW", value:data});
  185. layer.open({
  186. type: 2,
  187. title: '商户号修改',
  188. shadeClose: true,
  189. shade:0.8,
  190. //maxmin: true, //开启最大化最小化按钮
  191. area: ['75%', '85%'],
  192. content: '../../admin/businessNumManage/businessNumUpdate.html'
  193. });
  194. }
  195. // 新增
  196. $("#addBtn").click(function(){
  197. // 打开新增页面
  198. openMainTabPage('515001-01', ' 新增公众号', 'businessNumManage/businessNumAdd.html', '', '515001', reloadRole);
  199. })
  200. $.request({
  201. action : 'BusinessNumManageAction/queryTencent',
  202. data : { },
  203. success : function(data) {
  204. var selectName ="tencentid";
  205. var html1 = '<select lay-verify="tencentid" name="';
  206. html1 = html1 + selectName;
  207. html1 = html1 + '" lay-filter="';
  208. html1 = html1 + '"';
  209. html1 = html1 + '><option value="">请选择</option>';
  210. $.each(data.MINQueryResult, function(i, j) {
  211. html1 = html1 + '<option ';
  212. html1 = html1 + 'value="';
  213. html1 = html1 + j.id + '">';
  214. html1 = html1 + j.name+ '</option>';
  215. //objSelect.options.add(new Option(j.id,j.name));
  216. // $("#zcySelect").options.add(new Option(j.name,j.name));
  217. // $("#zcySelect").append("<option value="+j.id+">"+j.name+"</option>");
  218. })
  219. html1 = html1 + '</select>';
  220. $("#branchSelect").html(html1);
  221. form.render();
  222. },
  223. });
  224. </script>
  225. </body>
  226. </html>