class_choice_course.html 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. {extend name="public/layout"/} {block name="title"}课件筛选列表{/block} {block name="body"}
  2. <style type="text/css">
  3. html,
  4. body {
  5. display: block;
  6. }
  7. .layui-table thead tr,
  8. .layui-table-header {
  9. background-color: #D8E6F1 !important;
  10. }
  11. .layui-fluid {
  12. display: block;
  13. box-shadow: 0 0 4px 0 #B6CADE;
  14. border-radius: 5px;
  15. margin: 15px;
  16. background-color: #ffffff;
  17. }
  18. .layui-tab {
  19. padding: 15px;
  20. height: 100%;
  21. }
  22. .layui-form-item {
  23. width: 100%;
  24. }
  25. </style>
  26. <div class="layui-fluid">
  27. <div class="layui-card">
  28. <div class="layui-form layui-card-header layuiadmin-card-header-auto">
  29. <div class="layui-form-item">
  30. <div>
  31. <div class="layui-inline">
  32. <div class="layui-input-inline">
  33. <select name="type_id" lay-filter="slt" class="type_id" lay-search>
  34. <option value="">场景筛选</option>
  35. {volist name="type" id="i"}
  36. <option value="{$i.id}">{$i.type}</option>
  37. {/volist}
  38. </select>
  39. </div>
  40. </div>
  41. <div class="layui-inline">
  42. <div class="layui-input-inline">
  43. <input type="text" name="keyword" placeholder="请输入关键字搜索" autocomplete="off" class="layui-input keyword">
  44. </div>
  45. </div>
  46. <div class="layui-inline">
  47. <button class="layui-btn layuiadmin-btn" lay-submit lay-filter="LAY-app-contlist-search">
  48. <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
  49. </button>
  50. </div>
  51. </div>
  52. </div>
  53. </div>
  54. <div class="layui-card-body">
  55. <table lay-filter="checkCourseList" id="checkCourseList"></table>
  56. <input type="hidden" name="course_id" id="course_id" value="" />
  57. </div>
  58. <input type="hidden" id="hiddentext" />
  59. </div>
  60. </div>
  61. {/block} {block name="js"}
  62. <script>
  63. layui.config({
  64. base: '__LAYUI__/',
  65. urlbase: '/sys'
  66. }).extend({
  67. index: 'lib/index'
  68. }).use(['index', 'table', 'layedit', 'element'], function() {
  69. var $ = layui.$,
  70. table = layui.table,
  71. element = layui.element,
  72. form = layui.form;
  73. var field = {};
  74. var course_id = '{:$course_id}';
  75. form.on('submit(LAY-app-contlist-search)', function(data) {
  76. var type_id = $('.type_id').val();
  77. var keyword = $('.keyword').val();
  78. field['type_id'] = type_id;
  79. field['keyword'] = keyword;
  80. //执行重载
  81. table.reload('checkCourseList', {
  82. where: field,
  83. page: {
  84. curr: 1
  85. }
  86. });
  87. });
  88. table.on('checkbox(checkCourseList)', function(obj){
  89. // if(obj.type=="all"){
  90. // layer.msg('不支持全选', {time: 1000},function(){
  91. // table.reload('checkCourseList');
  92. // return false;
  93. // });
  94. // }
  95. var text=$('#hiddentext').val()?JSON.parse($('#hiddentext').val()):{};
  96. var checkStatus = table.checkStatus('checkCourseList');
  97. var checkboxlist = checkStatus.data;
  98. checkboxlist.forEach(function(item,index){
  99. text[item.id]=item.title;
  100. })
  101. // if(obj.checked){
  102. // text[obj.data.id]=obj.data.title;
  103. // }else if(!obj.checked){
  104. // delete text[obj.data.id]
  105. // }
  106. $('#hiddentext').val(JSON.stringify(text));
  107. });
  108. table.render({
  109. elem: '#checkCourseList',
  110. url: "{:url('train/class_choice_course')}?course_id=" + course_id,
  111. cols: [
  112. [{
  113. checkbox: true,
  114. fixed: true
  115. },
  116. {
  117. type: 'numbers',
  118. field: 'id',
  119. title: '序号'
  120. },
  121. {
  122. field: 'title',
  123. title: '课件标题'
  124. },
  125. {
  126. field: 'type_id',
  127. title: '场景'
  128. }
  129. ]
  130. ],
  131. page: true
  132. });
  133. });
  134. </script>
  135. {/block}