OMS/app/desktop/view/common/treeSelect.html

<!--
  Copyright © ShopeX （http://www.shopex.cn）. All rights reserved.
  See LICENSE file for license details.
-->

<{capture name="header"}>
    <{script src="treelist.js" app="eccommon"}>
<{/capture}>
<input type='hidden' id='sequence-<{$sid}>'/>
<div id='region-treelist-<{$sid}>-loading'></div>
<div id='region-treelist-<{$sid}>' class='x-tree-list'></div>
<{capture name="headbar"}>
    <{if $multi}> <{input type="checkbox" name="checkAll" id="checkAll"}>全选<{/if}>
<{/capture}>
<{capture name="footbar"}>
    <div class="table-action">
        <{button id="dlg_ok-{$sid}" class="btn btn-primary" label=$___ectools="确定"|t:'eccommon'}>
        <{button id="dlg_cancel-{$sid}" class="btn btn-secondary" label=$___ectools="取消"|t:'eccommon' onclick="window.close();"}>
    </div>
<{/capture}>
   
<script>
  void function(){
    if(window.modedialogInstance)
    {
        var modedialog=window.modedialogInstance.options.params;
        var sequence=$('sequence-<{$sid}>');
        var sequence_dialog=sequence.getParent('div');
        var _inputText=modedialog.iptText;
        var _inputHidden=modedialog.iptHidden;
        var _inputHiddenValue=_inputHidden.value.split(',');
        var multi='<{$multi}>';
        var RegionList=TreeList;

    }else{

        var sequence=$('sequence-<{$sid}>');
        var sequence_dialog=sequence.getParent('div');
        var _inputText=window.opener.document.getElementById("set_p_region_name");
        var _inputHidden=window.opener.document.getElementById("set_p_region_id");
        var _inputHiddenValue=_inputHidden.value.split(',');
        var multi='<{$multi}>';
        var RegionList=TreeList;
    }

    $('dlg_ok-<{$sid}>').addEvent('click',function(){
        var nodes=sequence_dialog.getElements('.node').filter(function(n){
            return n.getElement('input[type=checkbox]').checked;
        });

        var IDdatas=[];
        var Namedatas=[];
        nodes.each(function(node){
            var v = node.getElement('input[type=checkbox]').getValue();
            IDdatas.push(v);
            var text = node.getElement('.node-name').get('text');
            var text_d = v.contains('close')?'(<{$closeText|default:"全部"}>)':'';
            Namedatas.push(text+text_d);
        });

        _inputText.set('value',Namedatas.join(','));
        if(_inputText.type=='hidden'){
            _inputText.getPrevious().set('text',_inputText.value);
        }
        _inputHidden.set('value',IDdatas.join(','));
        window.close();
    });

    RegionList=new Class({
        Extends:TreeList,
        createNode:function(data,ext){
            var options=this.options;
            var nc=options.nodeClass;
            nc.icon = '';
            var node_handle=new Element('span',{'class':nc.handle})
            .set({
              'pid':data['PID'],
              'nid':data['NID'],
              'hasc':data['HASC']
            })
            .setHTML('&nbsp;');
            var node_line=new Element('span',{'class':nc.nl}).setHTML('&nbsp;');

            var node_checkbox=new Element('input',{
              type:'checkbox',
              name:options.checkboxName,
              value:data['NID'],
              pid:data['PID']

            });

            var node_icon=new Element('span',{'class':nc.icon}).setHTML('&nbsp;');
            var node_name=new Element('span',{'class':nc.name}).setText(data['CNAME']);
            var node=new Element('span',{'class':nc.clazz})
            .adopt([node_handle,node_line,node_checkbox,node_icon,node_name]);

            if(!!data['HASC'].toInt()){
                var _this=this;
                node_handle.addClass(nc.close);
                node_checkbox.set('value',node_checkbox.get('value')+'|close');

                node_handle.addEvent('click',function(e){
                    var node=this.getParent('.'+nc.clazz);
                    if(this.hasClass(nc.close)){
                        // 点击后第一次展开获取接口数据
                        if(!node.getNext()||node.getNext().getTag()!=='div'){
                            var ncontainer=new Element('div',{'class':nc.cbox}).injectAfter(node);
                            _this.loadNodes(this.get('nid'),ncontainer);
                            this.addClass(nc.loading);
                            node_checkbox.set('value',node_checkbox.get('value').toInt());
                        }else{
                            // 点击后第再次展开展示缓存数据
                            if(node.getNext()&&node.getNext().getTag()=='div'){
                              node.getNext().show();   
                            }
                        }
                        this.removeClass(nc.close);  
                    }else{
                        // 点击后收起
                        if(node.getNext()&&node.getNext().getTag()=='div'){
                            node.getNext().hide(); 
                            this.addClass(nc.close);                    
                        }
                    }
                });
            }
            var checkPNode=function(cnode,checked){
                var pnode=cnode.getParent().getPrevious();
                while(pnode.hasClass(nc.hasc)){
                    pnode.getElement('input[type=checkbox]').set('checked',checked);
                    pnode=pnode.getParent().getPrevious();
                }
            };

            $('checkAll').addEvent('click',function(){
                return node_checkbox.set('checked',this.checked?true:false);
            });
        
            node_checkbox.addEvent('click',function(rc){

                var node=this.getParent('.'+nc.clazz);
                var nodeNext=node.getNext();
                if(nodeNext&&nodeNext.getTag()=='div'){
                    $ES('input[type=checkbox]',nodeNext).set('checked',this.checked==true?true:false);
                }
                var nodebox=node.getParent();
                if(nodebox.hasClass(nc.cbox)&&nodebox.getFormElementsPlus().length>0){
                    checkPNode(node,false);
                }else if(nodebox.hasClass(nc.cbox)){
                    checkPNode(node,false);
                }
            });

            var pcheckbox=$E('input[value='+node_checkbox.get('pid')+']',this.container);
            if(pcheckbox&&pcheckbox.checked){
                if(!pcheckbox.retrieve('edit')){
                    node_checkbox.store('check',true);
                }
            }

            if(_inputHiddenValue.indexOf(data['NID'])>-1){
                node_checkbox.store('edit',true).addEvent('change',function(){
                    this.store('edit',false);
                    this.removeEvent('change',arguments.callee);
                });
                node_checkbox.store('check',true);
                node_checkbox.store('open',node_handle);
            }else if(_inputHiddenValue.indexOf(data['NID']+"|close")>-1){
                node_checkbox.store('check',true);
            }

            return node;
        },addNode:function(node,container){
            if(!container)
                $(node).inject(this.container);
            else
                $(node).inject(container);

            var ckbox=node.getElement('input[type=checkbox]');
            if(ckbox&&ckbox.retrieve('check')){
                ckbox.set('checked',true);
                ckbox.retrieve('open',{fireEvent:function(){}}).fireEvent('click',200);
            }

            // ======自动逐层的加载======
            if ($defined(node.getElements('.'+this.options.nodeClass.close))){
                node.getElements('.'+this.options.nodeClass.close).fireEvent('click', 100);
            }
        }
    });

    new RegionList({
        remoteURL:'<{$remoteURL}>',
        remoteParamKey:'p[0]',
        container:'region-treelist-<{$sid}>',
        checkboxName:'<{$checkboxName}>',
        showStep:1,
        dataMap:{
            PID:'<{$dataMap.PID}>',
            NID:'<{$dataMap.NID}>',
            CNAME:'<{$dataMap.CNAME}>',
            HASC:'<{$dataMap.HASC}>'
        }
    });
  }();

</script>