index.html 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. {include file='common/_js_css'}
  2. <div class="container-fluid">
  3. <div class="row">
  4. <div class="col-lg-12">
  5. <div class="card">
  6. <div class="card-toolbar clearfix">
  7. <div class="toolbar-btn-action">
  8. <a class="btn btn-primary m-r-5" href="#!" onclick="add('{:url(\'admin/department/add\')}')"><i class="mdi mdi-plus"></i> {:lang('add')}</a>
  9. <a class="btn btn-danger" href="#!" onclick="delete_()"
  10. ><i class="mdi mdi-window-close"></i> {:lang('delete')}</a>
  11. </div>
  12. </div>
  13. <div class="card-body">
  14. <div id="department_tree" class="demo-tree-more"></div>
  15. </div>
  16. </div>
  17. </div>
  18. </div>
  19. </div>
  20. <script>
  21. function delete_() {
  22. layui.use(['tree', 'form'], async () => {
  23. const tree = layui.tree;
  24. const checkedData = deepTraversal(tree.getChecked('department_input')); //获取选中节点的数据
  25. console.log(checkedData);
  26. caviar_checkbox_delete(
  27. '{:url(\'admin/department/delete\')}',
  28. ['{:lang(\'Check at least one box\')}','{:lang(\'Succeed\')}'],
  29. '{:lang(\'Warn\')}',
  30. '{:lang(\'Are you sure you want to delete the selected data\')}',
  31. ['{:lang(\'Confirm\')}'],
  32. checkedData.map(v => v.id)
  33. )
  34. return false;
  35. });
  36. }
  37. layui.use(['tree', 'util'], async() => {
  38. const tree = layui.tree;
  39. let data = [];
  40. const response = await request('{:url("admin/department/fetchAllDepartment")}');
  41. if(response.code === 200) data = response.data;
  42. //基本演示
  43. tree.render({
  44. elem: '#department_tree'
  45. ,data: data
  46. ,showCheckbox: true //是否显示复选框
  47. ,isJump: true //是否允许点击节点时弹出新窗口跳转
  48. ,click: function(obj){
  49. const data = obj.data; //获取当前点击的节点数据
  50. view("{:url('admin/department/edit')}?id=" + data.id.toString(), "{:lang('Update')}")
  51. }
  52. ,id:"department_input"
  53. });
  54. });
  55. </script>