cate_video_labels.html 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326
  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. background-color: #fff;
  7. }
  8. .layui-table thead tr,
  9. .layui-table-header {
  10. background-color: #D8E6F1 !important;
  11. }
  12. .layui-fluid {
  13. display: block;
  14. border-radius: 5px;
  15. background-color: #ffffff;
  16. padding: 15px 30px;
  17. }
  18. .layui-tab {
  19. padding: 15px;
  20. height: 100%;
  21. }
  22. .layui-form-item {
  23. width: 100%;
  24. }
  25. .layui-form-item .layui-inline {
  26. display: block;
  27. float: left;
  28. width: 145px;
  29. height: 38px;
  30. line-height: 38px;
  31. background: #FFFFFF;
  32. margin-right: 16px;
  33. }
  34. .layui-form-item .layui-input-inline {
  35. width: 145px;
  36. height: 38px;
  37. line-height: 38px;
  38. margin-bottom: 0;
  39. }
  40. .layui-icon {
  41. font-size: 20px !important;
  42. }
  43. .layui-form-item .layui-input-inline .layui-input {
  44. border: 1px solid #9DB6CF;
  45. border-radius: 5px;
  46. }
  47. .layui-form-select dl dd.layui-this {
  48. background-color: #249EFB;
  49. }
  50. .layui-form-item div.searchBox {
  51. width: 320px;
  52. background: #FFFFFF;
  53. border: 1px solid #B6CADE;
  54. border-radius: 24px;
  55. height: 38px;
  56. overflow: hidden;
  57. padding-left: 18px;
  58. position: relative;
  59. margin-bottom: 0px;
  60. float: right;
  61. }
  62. .searchBox .inputBox {
  63. width: 240px;
  64. float: left;
  65. height: 36px;
  66. line-height: 36px;
  67. border-width: 0;
  68. }
  69. .searchBtn {
  70. position: absolute;
  71. top: 0;
  72. right: 0;
  73. width: 51px;
  74. height: 38px;
  75. background-color: #fff;
  76. }
  77. .searchBtn img {
  78. position: absolute;
  79. width: 26px;
  80. top: 6px;
  81. left: 0;
  82. }
  83. .layui-card .layui-tab {
  84. margin: 0;
  85. height: 31%;
  86. width: 80%;
  87. float: right;
  88. padding: 1px;
  89. }
  90. .layui-btn-primary {
  91. color: #249EFB;
  92. border: 1px solid #249EFB;
  93. }
  94. .layui-btn-primary:hover {
  95. background-color: #E3F7FF;
  96. color: #249EFB;
  97. }
  98. .layui-btn-xs,.layui-btn-xs:hover {
  99. border: 1px solid #249EFB;
  100. background-color: #fff;
  101. color: #249EFB;
  102. padding: 0px 10px;
  103. }
  104. .layui-btn-danger,.layui-btn-danger:hover{
  105. color: #FF5722;
  106. background-color: #fff;
  107. border: 1px solid #FF5722;
  108. padding: 0px 10px;
  109. }
  110. .layui-card-header {
  111. background-color: #F6FAFD;
  112. }
  113. .layui-card-body {
  114. padding: 10px 0px 0px;
  115. }
  116. </style>
  117. <body>
  118. <div class="layui-fluid">
  119. <div class="layui-card">
  120. <div class="layui-card-header layuiadmin-card-header-auto">
  121. <a href="#" type="button" class="layui-btn layui-btn-primary" id="cate_add">添加标签</a>
  122. </div>
  123. <div class="layui-card-body">
  124. <table id="evidence-table" lay-filter="evidence-table"></table>
  125. </div>
  126. </div>
  127. </div>
  128. </body>
  129. {/block} {block name="js"}
  130. <script type="text/html" id="show">
  131. <input type="checkbox" name="show" value="{{d.id}}" lay-skin="switch" lay-text="上架|下架" lay-filter="show" {{ d.publish == 1 ? 'checked' : '' }}>
  132. </script>
  133. <script type="text/html" id="table-evidence-action">
  134. {{# if(d.show == 0){ }}
  135. <a class="layui-btn layui-btn-xs" lay-event="evi-details">编辑</a>
  136. <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="evidence-delete">删除</a>
  137. {{# }else{ }}
  138. <a class="layui-btn layui-btn-xs layui-btn-disabled" style="border: 1px solid #ccc;color: #ccc;">编辑</a>
  139. <a class="layui-btn layui-btn-xs layui-btn-disabled" style="border: 1px solid #ccc;color: #ccc;">删除</a>
  140. {{# } }}
  141. </script>
  142. <script type="text/html" id="evidence_num">
  143. <span>{{d.picnum}}</span>
  144. </script>
  145. <script>
  146. layui.config({
  147. base: '__LAYUI__/',
  148. urlbase: '/sys'
  149. }).extend({
  150. index: 'lib/index' //主入口模块
  151. }).use(['index', 'table', 'element'], function () {
  152. var $ = layui.$,
  153. form = layui.form,
  154. element = layui.element,
  155. table = layui.table;
  156. //添加分类
  157. $('#cate_add').click(function(){
  158. layer.open({
  159. type: 2,
  160. title: ['添加标签', 'color:#333333;background-color:#D8E6F1;'],
  161. content:'{:url("video/cate_video_labels_add")}',
  162. resize: false,
  163. area: ['400px', '260px'],
  164. end: function () {
  165. location.reload();
  166. }
  167. });
  168. // layer.prompt({title:'添加',value:''},function(value,index){
  169. // if (value=='') {
  170. // layer.msg('请填写名称', {
  171. // anim: 6
  172. // ,time: 400
  173. // });
  174. // return false;
  175. // }
  176. // if(value.length > 6) {
  177. // layer.msg('分类名称超长', {
  178. // anim: 6
  179. // ,time: 400
  180. // });
  181. // return false;
  182. // }
  183. // $.ajax({
  184. // url: '{:url("article/cate_article_add_label")}',
  185. // type: 'post',
  186. // data: {name:value,pid:pid},
  187. // dataType: 'json',
  188. // success: function(res) {
  189. // console.log(res)
  190. // if(res.code === 0) {
  191. // layer.msg(res.msg, {
  192. // anim: 6
  193. // ,time: 400
  194. // });
  195. // //执行重载
  196. // table.reload('evidence-table', {
  197. // });
  198. // } else {
  199. // layer.msg(res.msg, {
  200. // anim: 6
  201. // ,time: 400
  202. // });
  203. // }
  204. // }
  205. // });
  206. // layer.close(index);
  207. // });
  208. });
  209. //客户见证列表
  210. table.render({
  211. elem: '#evidence-table',
  212. autoSort: false,
  213. url:'{:url("video/cate_video_list_labels")}',
  214. cols: [
  215. [{
  216. type: 'numbers',
  217. field: 'id',
  218. width: 80,
  219. title: '序号',
  220. sort: true
  221. }, {
  222. field: 'pname',
  223. title: '所属分类'
  224. }, {
  225. field: 'name',
  226. title: '名称'
  227. },{
  228. title: '操作',
  229. width: 240,
  230. align: 'center',
  231. fixed: 'right',
  232. toolbar: '#table-evidence-action'
  233. }]
  234. ],
  235. page: true,
  236. limit: 30,
  237. height: 'full-120',
  238. text: '对不起,加载出现异常!'
  239. });
  240. //监听列表
  241. table.on('tool(evidence-table)', function (obj) {
  242. var data = obj.data;
  243. if (obj.event === 'evidence-delete') {
  244. //监听关联的数量
  245. $.ajax({
  246. url: '{:url("video/with_type_count")}',
  247. type: 'post',
  248. data: { id: data.id, type: 'label' },
  249. dataType: 'json',
  250. success: function (msg) {
  251. layer.confirm(msg, { title: ['信息', 'color:#333333;background-color:#D8E6F1;'], }, function () {
  252. $.get("{:url('video/delete_type_or_label')}?id=" + data.id + "&type=label&pid=" + data.pid, function (res) {
  253. if (res.code === 0) {
  254. layer.msg(res.msg, { anim: 0 }, function () {
  255. table.reload('evidence-table');
  256. });
  257. } else {
  258. layer.msg(res.msg, { anim: 6 });
  259. }
  260. });
  261. });
  262. }
  263. });
  264. } else if (obj.event === 'evi-details') {
  265. layer.open({
  266. type: 2,
  267. title: ['编辑标签', 'color:#333333;background-color:#D8E6F1;'],
  268. content:'{:url("video/cate_video_labels_add")}?id=' + data.id + '&pid=' + data.pid + '&name=' + data.name,
  269. resize: false,
  270. area: ['400px', '260px'],
  271. end: function () {
  272. location.reload();
  273. }
  274. });
  275. }
  276. });
  277. //备注
  278. $('body').on('mouseover', '.remarksInfo', function () {
  279. var type = $(this).data('type');
  280. layer.tips(type, this, {
  281. tips: [1, '#3595CC'],
  282. time: 400
  283. });
  284. });
  285. form.on('switch(show)', function (obj) {
  286. var id = obj.value;
  287. $.ajax({
  288. type: "post",
  289. url: '{:url("video/apipublish")}',
  290. data: {
  291. id: id,
  292. cate: 'evidence'
  293. },
  294. success: function (res) {
  295. layer.msg(res.msg);
  296. }
  297. });
  298. });
  299. });
  300. </script>
  301. {/block}