123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231 |
- <html>
- <head>
- <title>数据选择</title>
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
- <meta charset="utf-8"/>
- <meta name="viewport"
- content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
- <link rel="stylesheet" href="/common-assets/plugins/outdated/bootstrap/css/bootstrap.min.css"/>
- <link rel="stylesheet" href="/common-assets/css/outdated/style.css"/>
- <link rel="stylesheet"
- href="/common-assets/plugins/outdated/metisMenu/2.7/metisMenu.min.css"/>
- <link rel="stylesheet"
- href="/common-assets/plugins/outdated/bootstrap-toastr/2.0.1/toastr.min.css"/>
- <link rel="stylesheet" href="/common-assets/plugins/outdated/icheck/custom.css"/>
- <script src="/common-assets/js/project.config.js"></script>
- <script src="/common-assets/js/direwolf-library.js"></script>
- <script src="/common-assets/js/outdated/common.js"></script>
- <script src="/common-assets/js/outdated/bootstrap.min.js"></script>
- <script src="/common-assets/js/outdated/jquery.form-3.51.0.min.js"></script>
- <script src="/common-assets/plugins/outdated/pace/pace.min.js"></script>
- <script src="/common-assets/plugins/outdated/slimscroll/jquery.slimscroll.min.js"></script>
- <script src="/common-assets/plugins/outdated/bootstrap-toastr/2.0.1/toastr.min.js"></script>
- <script src="/common-assets/plugins/outdated/jquery-validation/jquery.validate-1.11.1.min.js"></script>
- <script src="/common-assets/plugins/outdated/jquery-validation/localization/messages_zh.js"></script>
- <script src="/common-assets/plugins/outdated/icheck/icheck.min.js"></script>
- <script src="/common-assets/plugins/outdated/metisMenu/2.7/metisMenu.js"></script>
- <script src="/common-assets/js/promise-polyfill.min.js"></script>
- <link href="/common-assets/plugins/jquery-ztree/3.5/css/metroStyle/metroStyle.css"
- rel="stylesheet"/>
- <script src="/common-assets/plugins/jquery-ztree/3.5/js/jquery.ztree.all.min.js"
- type="text/javascript"></script>
- <script type="text/javascript">
- var lib = window.getDirewolfLibrary()
- var treeNodes = [] //缓存树的节点
- var leafMapper = {
- id: lib.$$utils.getQueryString('idKeyOfLeaf') || 'id',
- pId: lib.$$utils.getQueryString('pIdKeyOfLeaf') || 'pId',
- name: lib.$$utils.getQueryString('nameKeyOfLeaf') || 'name',
- }
- var tree, setting = {
- view: {
- selectedMulti: lib.$$utils.getQueryString('multiple') === 'T',
- dblClickExpand: false,
- fontCss: function (treeId, treeNode) {
- return (!!treeNode.highlight) ? {
- color: '#A60000',
- 'font-weight': 'bold',
- } : {
- color: '#333',
- 'font-weight': 'normal',
- }
- },
- },
- data: {
- simpleData: {
- enable: true,
- },
- },
- callback: {
- onExpand: function (event, treeId, treeNode) {
- var load = layer.load(3, {
- shade: [0.1, '#fff'],
- //0.1透明度的白色背景
- })
- var url = lib.$$utils.getQueryString('expendURL')
- // hack
- url = url.startsWith(commonConfig.proxyPath) ? url.substring(commonConfig.proxyPath.length) : url
- if (url.indexOf('?') !== -1) {
- url += '&'
- } else {
- url += '?'
- }
- lib.$$utils.axiosRequest(url, '获取节点', 'GET', {
- [lib.$$utils.getQueryString('parentKeyOfLeaf')]: treeNode.id,
- }).then(function (result) {
- var zNodes = listToNodes(
- !!result.list ? result.list
- : (!!result.data ? result.data : result), false, leafMapper)
- treeNodes.addNodes(zNodes)
- addNodesToTree(tree, zNodes)
- layer.close(load)
- })
- },
- },
- }
- $(function () {
- //初始化树
- var url = lib.$$utils.getQueryString('url')
- // hack
- url = url.startsWith(commonConfig.proxyPath) ? url.substring(commonConfig.proxyPath.length) : url
- var searchUrl = lib.$$utils.getQueryString('searchUrl')
- // hack
- searchUrl = searchUrl.startsWith(commonConfig.proxyPath) ? searchUrl.substring(commonConfig.proxyPath.length) : searchUrl
- lib.$$utils.axiosRequest(url, '获取信息')
- .then(function (result) {
- var mapper = {
- id: lib.$$utils.getQueryString('idKeyOfParent') || 'id',
- pId: lib.$$utils.getQueryString('pIdKeyOfParent') || 'pId',
- name: lib.$$utils.getQueryString('nameKeyOfParent') || 'name',
- }
- treeNodes = listToNodes(!!result.list ? result.list
- : (!!result.data ? result.data : result), true, mapper)
- tree = $.fn.zTree.init($('#tree'), setting, treeNodes)
- })
- $('#searchBtn').click(
- function () {
- var keyWord = $('#searchName').val()
- if ($.isEmptyObject(keyWord)) {
- return
- }
- if (searchUrl.indexOf('?') !== -1) {
- searchUrl += '&'
- } else {
- searchUrl += '?'
- }
- lib.$$utils.axiosRequest(searchUrl + '&keyWord=' + keyWord, '查询信息')
- .then(function (result) {
- var zNodes = listToNodes(
- !!result.list ? result.list
- : (!!result.data ? result.data : result),
- false, leafMapper)
- treeNodes.addNodes(zNodes)
- tree = $.fn.zTree.init($('#tree'), setting, treeNodes)
- })
- var nodes = tree.getNodesByParamFuzzy('name', keyWord)
- showHighlight(nodes, tree)
- })
- //设置回车搜索
- $('#searchName').keypress(function (e) {
- detectEnter(e)
- })
- })
- function detectEnter (event) {
- var e = event || window.event
- var o = e.target || e.srcElement
- var keyCode = e.keyCode || e.which // 按键的keyCode
- if (keyCode === 13) {
- e.keyCode = 9
- e.returnValue = false
- $('#searchBtn').click()
- }
- }
- function showHighlight (nodes, tree) {
- if (nodes !== null && nodes.length > 0) {
- for (var i = 0; i < nodes.length; i++) {
- var node = nodes[i]
- node.highlight = true
- tree.updateNode(node)
- tree.expandNode(node.getParentNode(), true)
- if (node.isParent) {
- tree.expandNode(node, true)
- }
- }
- }
- }
- function listToNodes (list, isParent, mapper) {
- mapper = mapper || {}
- var idMapper = mapper.id || 'id'
- var pIdMapper = mapper.pId || 'pId'
- var nameMapper = mapper.name || 'name'
- return list.map(function (item) {
- var node
- node = {
- id: item[idMapper],
- pId: item[pIdMapper],
- name: item[nameMapper],
- isParent: isParent || item.isParent,
- }
- return node
- })
- }
- //给树增加节点
- function addNodesToTree (tree, zNodes) {
- for (var i = 0; i < zNodes.length; i++) {
- var parentNode = tree.getNodeByParam('id', zNodes[i].pId)
- var node = tree.getNodeByParam('id', zNodes[i].id)
- if (node === undefined || node === null)
- tree.addNodes(parentNode, [zNodes[i]])
- }
- }
- //treeNodes增加节点
- Array.prototype.addNodes = function (nodes) {
- for (var i = 0; i < nodes.length; i++) {
- var flag = false
- for (var j = 0; j < this.length; j++) {
- if (this[j].id === nodes[i].id) {
- flag = true
- break
- }
- }
- if (!flag)
- this.push(nodes[i])
- }
- }
- </script>
- </head>
- <body class="pace-done gray-bg">
- <div class="container-fluid">
- <div class="row">
- <div class="col-xs-12">
- <div class="input-group">
- <input id="searchName" name="单位树" type="text"
- class="form-control input-sm"/>
- <div class="input-group-btn">
- <button type="button" id="searchBtn"
- class="btn btn-primary input-sm">
- <i class="fa fa-search"></i>
- </button>
- </div>
- </div>
- </div>
- </div>
- <div class="row">
- <div class="col-xs-12">
- <div id="tree" class="ztree" style="padding: 10px 5px;"></div>
- </div>
- </div>
- </div>
- </body>
- </html>
|