order_course_pay.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  1. {extend name="public/layout"}
  2. {block name="body"}
  3. <style>
  4. .layui-table thead tr,
  5. .layui-table-header {
  6. background-color: #D8E6F1 !important;
  7. }
  8. .layui-tab-title .layui-this {
  9. background-color: #249EFB;
  10. color: #fff;
  11. }
  12. .layui-tab-title .layui-this:after {
  13. border-bottom: none;
  14. border: none;
  15. }
  16. .layui-tab-title li {
  17. background-color: #F2F2F2;
  18. margin: 0px 5px;
  19. padding: 0px 20px;
  20. }
  21. </style>
  22. <body>
  23. <div class="layui-fluid">
  24. <div class="layui-row layui-col-space15">
  25. <div class="layui-col-md12" style="background-color:#ffffff">
  26. <div class="tplay-body-div">
  27. <div class="layui-tab">
  28. <ul class="layui-tab-title">
  29. <li style="margin-left: 0px;">
  30. <a href="{:url('broad/order')}">已支付订单</a>
  31. </li>
  32. <li>
  33. <a href="{:url('broad/order_no_pay')}">下单未支付</a>
  34. </li>
  35. <li>
  36. <a href="{:url('broad/present_order')}">进店礼订单</a>
  37. </li>
  38. <li>
  39. <a href="{:url('broad/gift')}">打赏订单</a>
  40. </li>
  41. <li class="layui-this">
  42. 课程购买订单
  43. </li>
  44. </ul>
  45. </div>
  46. <!-- <div class="layui-card"> -->
  47. <div class="layui-card-body">
  48. <div class="layui-form">
  49. <div class="layui-inline">
  50. <input class="layui-input" name="orderNo" id="orderNo" autocomplete="off"
  51. placeholder="搜索订单号..">
  52. </div>
  53. <div class="layui-inline">
  54. <input class="layui-input" name="course" id="course" autocomplete="off"
  55. placeholder="搜索活动名..">
  56. </div>
  57. <div class="layui-inline" style="width: 100px;">
  58. <select name="status" id='status'>
  59. <option value="1">已支付</option>
  60. <option value="0">未支付</option>
  61. </select>
  62. </div>
  63. <button class="layui-btn" data-type="reload"><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i></button>
  64. </div>
  65. <table class="layui-hide" id="user" lay-filter="user"></table>
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. </div>
  71. {/block}
  72. {block name="js"}
  73. <script type="text/html" id="state">
  74. {{ d.status == 1 ? '已支付' : '未支付' }}
  75. </script>
  76. <script>
  77. var indexurl = '{:url("broad/order_course_pay")}';
  78. var t;
  79. layui.use(['table', 'form'], function () {
  80. var form = layui.form
  81. , table = layui.table
  82. , $ = layui.jquery
  83. , active = {
  84. reload: function () {
  85. var nickname = $('#nickname');
  86. var mobile = $('#mobile');
  87. var orderNo = $('#orderNo');
  88. var course = $('#course');
  89. var status = $('#status');
  90. //执行重载
  91. table.reload('userTable', {
  92. page: {
  93. curr: 1 //重新从第 1 页开始
  94. }
  95. , where: {
  96. nickname: nickname.val(),
  97. mobile: mobile.val(),
  98. orderNo: orderNo.val(),
  99. course: course.val(),
  100. status: status.val()
  101. }
  102. });
  103. }
  104. };
  105. //展示已知数据
  106. t = table.render({
  107. elem: '#user'
  108. , url: indexurl
  109. , page: true
  110. , autoSort: true
  111. , cols: [[ //标题栏
  112. { type: 'numbers', title: '序号', fixed: 'left' }
  113. , { field: 'nickname', title: '昵称'}
  114. , { field: 'name', title: '姓名'}
  115. , { field: 'mobile', title: '电话'}
  116. , { field: 'course_name', title: '活动名'}
  117. , { field: 'order_no', title: '订单号'}
  118. , { field: 'money', title: '金额'}
  119. , { templet: '#state', title: '状态'}
  120. , { field: 'addtime', title: '购买时间', width: 160, sort: true }
  121. ]]
  122. , id: 'userTable'
  123. });
  124. $('.layui-form>.layui-btn').on('click', function () {
  125. var type = $(this).data('type');
  126. active[type] ? active[type].call(this) : '';
  127. });
  128. table.on('sort(user)', function (obj) {
  129. table.reload('userTable', {
  130. initSort: obj
  131. , where: obj
  132. });
  133. });
  134. });
  135. </script>
  136. {/block}