datalist.html 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. {extend name="../../base/view/common/base" /}
  2. <!-- 主体 -->
  3. {block name="body"}
  4. <div class="p-page">
  5. <table class="layui-hide" id="table_services" lay-filter="table_services"></table>
  6. </div>
  7. <script type="text/html" id="toolbarDemo">
  8. <div class="layui-btn-container">
  9. <button class="layui-btn layui-btn-sm add-new" type="button">+ 添加服务内容</button>
  10. </div>
  11. </script>
  12. {/block}
  13. <!-- /主体 -->
  14. <!-- 脚本 -->
  15. {block name="script"}
  16. <script>
  17. const moduleInit = ['tool'];
  18. function gouguInit() {
  19. var table = layui.table, tool = layui.tool;
  20. layui.pageTable = table.render({
  21. elem: "#table_services"
  22. ,toolbar: '#toolbarDemo'
  23. ,url: "/contract/services/datalist"
  24. ,page: false
  25. ,limit: 999
  26. ,cellMinWidth: 80
  27. ,cols: [[
  28. {field:'id',width:80, title: 'ID号', align:'center'}
  29. ,{field:'title',title: '服务内容'}
  30. ,{field:'price',title: '费用(元)',width:100, align:'right'}
  31. ,{field:'status', title: '状态',width:80,align:'center',templet: function(d){
  32. var html1='<span class="green">正常</span>';
  33. var html2='<span class="yellow">禁用</span>';
  34. if(d.status==1){
  35. return html1;
  36. }
  37. else{
  38. return html2;
  39. }
  40. }}
  41. ,{width:100,title: '操作', align:'center',ignoreExport:true,templet: function(d){
  42. var html='';
  43. var btn='<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">编辑</a>';
  44. var btn1='<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="disable">禁用</a>';
  45. var btn2='<a class="layui-btn layui-btn-xs" lay-event="open">启用</a>';
  46. if(d.status==1){
  47. html = '<div class="layui-btn-group">'+btn+btn1+'</div>';
  48. }
  49. else{
  50. html = '<div class="layui-btn-group">'+btn+btn2+'</div>';
  51. }
  52. return html;
  53. }}
  54. ]]
  55. });
  56. table.on('tool(table_services)',function (obj) {
  57. if(obj.event === 'edit'){
  58. tool.side("/contract/services/add?id="+obj.data.id);
  59. }
  60. if(obj.event === 'disable'){
  61. layer.confirm('确定要禁用该记录吗?', {icon: 3, title:'提示'}, function(index){
  62. let callback = function (e) {
  63. layer.msg(e.msg);
  64. if (e.code == 0) {
  65. layui.pageTable.reload();
  66. }
  67. }
  68. tool.post("/contract/services/set", {id:obj.data.id,status: 0}, callback);
  69. layer.close(index);
  70. });
  71. }
  72. if(obj.event === 'open'){
  73. layer.confirm('确定要启用该记录吗?', {icon: 3, title:'提示'}, function(index){
  74. let callback = function (e) {
  75. layer.msg(e.msg);
  76. if (e.code == 0) {
  77. layui.pageTable.reload();
  78. }
  79. }
  80. tool.post("/contract/services/set", {id:obj.data.id,status:1}, callback);
  81. layer.close(index);
  82. });
  83. }
  84. });
  85. $('body').on('click','.add-new',function(){
  86. tool.side("/contract/services/add");
  87. });
  88. }
  89. </script>
  90. {/block}
  91. <!-- /脚本 -->