teacher_index.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. {extend name="public/layout"}
  2. {block name="body"}
  3. <style>
  4. html,body {
  5. background-color: #fff;
  6. }
  7. .layui-table thead tr,
  8. .layui-table-header {
  9. background-color: #D8E6F1 !important;
  10. }
  11. .layui-btn-xs,.layui-btn-xs:hover {
  12. border: 1px solid #249EFB;
  13. background-color: #fff;
  14. color: #249EFB;
  15. padding: 0px 10px;
  16. }
  17. .layui-btn-danger,.layui-btn-danger:hover{
  18. color: #FF5722;
  19. background-color: #fff;
  20. border: 1px solid #FF5722;
  21. padding: 0px 10px;
  22. }
  23. </style>
  24. <body>
  25. <div class="layui-fluid">
  26. <div class="layui-row layui-col-space15">
  27. <div class="layui-col-md12" style="background-color:#ffffff">
  28. <div class="tplay-body-div">
  29. <div class="layui-card-body">
  30. <div class="layui-form">
  31. <div class="layui-inline">
  32. <input class="layui-input" name="name" id="name" autocomplete="off"
  33. placeholder="输入主持人名..">
  34. </div>
  35. <button class="layui-btn" data-type="reload"><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i></button>
  36. <span
  37. style="color: red;margin-left: 15px;">在新建主持人并在活动内选择后,您通过“直播控制台”进行的聊天,将显示主持人专属图标。</span>
  38. </div>
  39. <table class="layui-hide" id="user" lay-filter="user"></table>
  40. </div>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. {/block}
  46. {block name="js"}
  47. <script src="__STATIC__/js/jquery.min.js"></script>
  48. <script id="img" type="text/html">
  49. <img src="{{ d.headimg }}?x-oss-process=image/resize,l_100" style="height: 30px;width: 30px" class="show">
  50. </script>
  51. <script type="text/html" id="result">
  52. <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  53. <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
  54. </script>
  55. <script>
  56. var indexurl = '{:url("broad/teacher_index")}';
  57. var editurl = '{:url("broad/teacher_edit")}';
  58. var delurl = '{:url("broad/teacher_del")}';
  59. var t;
  60. layui.use(['table'], function () {
  61. var form = layui.form
  62. , table = layui.table
  63. , $ = layui.jquery
  64. , active = {
  65. reload: function () {
  66. var name = $('#name');
  67. //执行重载
  68. table.reload('userTable', {
  69. page: {
  70. curr: 1 //重新从第 1 页开始
  71. }
  72. , where: {
  73. name: name.val()
  74. }
  75. });
  76. }
  77. , edit: function () {
  78. var id = this.data.id;
  79. layer.open({
  80. title: ['修改主持人', 'color:#333333;background-color:#D8E6F1;'],
  81. type: 2,
  82. resize: false,
  83. content: editurl + '?id=' + id,
  84. area: ['80%', '80%']
  85. });
  86. }
  87. , del: function () {
  88. var id = this.data.id;
  89. layer.confirm('确定删除该老师么?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function () {
  90. $.post(delurl, { id: id }, function (resp) {
  91. var res = JSON.parse(resp);
  92. if (res.code == 0) {
  93. layer.msg(res.msg, { anim: 0 }, function () {
  94. t.reload();
  95. });
  96. } else {
  97. layer.msg(res.msg, { anim: 6 });
  98. }
  99. });
  100. });
  101. }
  102. };
  103. //展示已知数据
  104. t = table.render({
  105. elem: '#user'
  106. , url: indexurl
  107. , page: true
  108. , autoSort: true
  109. , cols: [[ //标题栏
  110. { type: 'numbers', title: '序号', fixed: 'left', width: 50 }
  111. , { field: 'name', title: '姓名', width: 120 }
  112. , { templet: '#img', title: '图片', width: 120 }
  113. , { field: 'phone', title: '联系方式', width: 150 }
  114. , { field: 'vx', title: '微信', width: 150 }
  115. , { field: 'desc', title: '简介' }
  116. , { field: 'addtime', title: '添加时间', width: 180, sort: true }
  117. , { fixed: 'right', title: '操作', toolbar: '#result', width: 100 }
  118. ]]
  119. , id: 'userTable'
  120. });
  121. $('.layui-form>.layui-btn').on('click', function () {
  122. var type = $(this).data('type');
  123. active[type] ? active[type].call(this) : '';
  124. });
  125. table.on('sort(user)', function (obj) {
  126. table.reload('userTable', {
  127. initSort: obj
  128. , where: obj
  129. });
  130. });
  131. table.on('toolbar(user)', function (obj) {
  132. var type = obj.event;
  133. active[type] ? active[type].call(this) : '';
  134. });
  135. table.on('tool(user)', function (obj) {
  136. var type = obj.event;
  137. active[type] ? active[type].call(obj) : '';
  138. });
  139. });
  140. </script>
  141. {/block}