treeSelect.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <html>
  2. <head>
  3. <title>数据选择</title>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  5. <meta charset="utf-8"/>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  7. <link rel="stylesheet" href="/common-assets/plugins/font-awesome/css/font-awesome.min.css"/>
  8. <link rel="stylesheet" href="/common-assets/plugins/outdated/bootstrap/css/bootstrap.min.css"/>
  9. <link rel="stylesheet" href="/common-assets/css/outdated/style.css"/>
  10. <link rel="stylesheet" href="/common-assets/plugins/outdated/metisMenu/2.7/metisMenu.min.css"/>
  11. <link rel="stylesheet" href="/common-assets/plugins/outdated/bootstrap-toastr/2.0.1/toastr.min.css"/>
  12. <link rel="stylesheet" href="/common-assets/plugins/outdated/icheck/custom.css"/>
  13. <script src='/common-assets/js/jquery-2.1.1.js'></script>
  14. <script src="/common-assets/js/outdated/bootstrap.min.js"></script>
  15. <script src="/common-assets/js/outdated/jquery.form-3.51.0.min.js"></script>
  16. <script src="/common-assets/plugins/layer/3.0.3/layer.js"></script>
  17. <script src="/common-assets/plugins/outdated/pace/pace.min.js"></script>
  18. <script src="/common-assets/plugins/outdated/slimscroll/jquery.slimscroll.min.js"></script>
  19. <script src="/common-assets/plugins/outdated/bootstrap-toastr/2.0.1/toastr.min.js"></script>
  20. <script src="/common-assets/plugins/outdated/jquery-validation/jquery.validate-1.11.1.min.js"></script>
  21. <script src="/common-assets/plugins/outdated/jquery-validation/localization/messages_zh.js"></script>
  22. <script src="/common-assets/plugins/outdated/icheck/icheck.min.js"></script>
  23. <script src="/common-assets/plugins/outdated/metisMenu/2.7/metisMenu.js"></script>
  24. <script src="/common-assets/plugins/dotize/dotize.js"></script>
  25. <script src="/common-assets/js/promise-polyfill.min.js"></script>
  26. <!-- 开发阶段使用vue.js以获取编译信息 -->
  27. <script src="/common-assets/plugins/vue/2.5.17/vue.min.js"></script>
  28. <script src="/common-assets/plugins/axios/0.18.0/axios.min.js"></script>
  29. <!-- 引入组件库 -->
  30. <script src="/common-assets/plugins/element-ui/lib/index.js"></script>
  31. <link rel="stylesheet" href="/common-assets/plugins/outdated/bootstrap-table/1.11.1/css/bootstrap-table.min.css">
  32. <link rel="stylesheet" href="/common-assets/plugins/jquery-ztree/3.5/css/metroStyle/metroStyle.css">
  33. <link rel="stylesheet" href="/common-assets/css/outdated/page.css">
  34. <script src="/common-assets/plugins/outdated/bootstrap-table/1.11.1/js/bootstrap-table.min.js"></script>
  35. <script src="/common-assets/plugins/outdated/bootstrap-table/1.11.1/js/bootstrap-table-zh-CN.min.js"></script>
  36. <script src="/common-assets/plugins/jquery-ztree/3.5/js/jquery.ztree.all.min.js"></script>
  37. <script src="/common-assets/js/project.config.js"></script>
  38. <script src="/common-assets/js/outdated/common.js"></script>
  39. <script type="text/javascript">
  40. var tree = new Vue({
  41. el: "#tree",
  42. data: function () {
  43. return {
  44. url: GetQueryString('url'),
  45. selectId: GetQueryString('selectId') ? GetQueryString('selectId') : "",
  46. extIds: GetQueryString('extIds') ? GetQueryString('extIds') : "",
  47. }
  48. }
  49. });
  50. $(document).ajaxError(function (e, jqXHR, ajaxSettings, thrownError) {
  51. if (jqXHR.status == '302') {
  52. window.location = "${ctx}";
  53. } else if (jqXHR.status == '500') {
  54. try {
  55. var msg = $.parseJSON(jqXHR.responseText);
  56. toastr.error(msg.message, '错误', {
  57. preventDuplicates: true
  58. });
  59. } catch (e) {
  60. toastr.error('服务器内部错误', '错误', {
  61. preventDuplicates: true
  62. });
  63. }
  64. }
  65. });
  66. var selectId = tree.selectId;
  67. var extIds = tree.extIds.split(",");
  68. var tree, setting = {
  69. view: {
  70. selectedMulti: false,
  71. dblClickExpand: false
  72. },
  73. check: {
  74. enable: false
  75. },
  76. data: {
  77. simpleData: {
  78. enable: true,
  79. idKey: "id",
  80. pIdKey: "pId",
  81. rootPId: "0"
  82. },
  83. key: {
  84. name: "name"
  85. }
  86. },
  87. callback: {
  88. onDblClick: function (evt, tid, node) {
  89. if ($.inArray(node.id, extIds) != -1) {
  90. return;
  91. }
  92. top.$("#layui-layer" + top.layer.index).find(".layui-layer-btn0").click();
  93. }
  94. }
  95. };
  96. $(function () {
  97. $.get(tree.url, function (result) {
  98. var zNodes = !!result.list ? result.list : (!!result.data ? result.data : result);
  99. tree = $.fn.zTree.init($("#tree"), setting, zNodes);
  100. $('#wrapper').slimScroll({
  101. height: '100%',
  102. railOpacity: 0.9
  103. });
  104. var node = tree.getNodeByParam("id", selectId, null);
  105. if (!!node) {
  106. tree.selectNode(node);
  107. tree.expandNode(node, true, false, true);
  108. }
  109. })
  110. });
  111. </script>
  112. </head>
  113. <body>
  114. <div id="wrapper">
  115. <div id="tree" class="ztree" style="padding: 15px 20px;"></div>
  116. </div>
  117. </body>