ext.lingo.jsontree.js

anewssystem新闻发布系统集成使用了spring hibernate freemarker EXTJS等开源框架 可以作为学习参考

                    handler : this.collapseAll.createDelegate(this),
                    cls     : 'collapse-all',
                    text    : '合拢'
                },{
                    id      : 'refresh',
                    icon    : '../widgets/lingo/list-items.gif',
                    handler : this.refresh.createDelegate(this),
                    cls     : 'refresh',
                    text    : '刷新'
                },{
                    id      : 'config',
                    icon    : '../widgets/lingo/list-items.gif',
                    handler : this.configInfo.createDelegate(this),
                    text    : '详细配置'
            }]
        });
    }

    // 渲染树形
    , render : function() {
        this.init();

        // 创建根节点，下面比较乱，最好整理一下！你这里用一个右键处理我认为更好些！
        // by 250678089 死胖子 2007-09-16 22:13
        //
        // 不知道具体是哪里乱，另外，这个里边是包含了右键功能的
        var root = new Ext.tree.AsyncTreeNode({
            text      : this.rootName,
            draggable : true,
            id        : '-1'
        });
        this.treePanel.setRootNode(root);
        this.treePanel.render();
        root.expand(false, false);
    }, createChild : function() {
        var sm = this.treePanel.getSelectionModel();
        var n = sm.getSelectedNode();
        if (!n) {
            n = this.treePanel.getRootNode();
        } else {
            n.expand(false, false);
        }
        this.createNode(n);
    }, createBrother : function() {
        var n = this.treePanel.getSelectionModel().getSelectedNode();
        if (!n) {
            Ext.Msg.alert('提示', "请选择一个节点");
        } else if (n == this.treePanel.getRootNode()) {
            Ext.Msg.alert('提示', "不能为根节点增加同级节点");
        } else {
            this.createNode(n.parentNode);
        }
    }, createNode : function(n) {
        var node = n.appendChild(new Ext.tree.TreeNode({
            id            : -1,
            text          : '请输入分类名',
            cls           : 'album-node',
            allowDrag     : true,
            allowDelete   : true,
            allowEdit     : true,
            allowChildren : true
        }));
        this.treePanel.getSelectionModel().select(node);
        setTimeout(function(){
            this.treeEditor.editNode = node;
            this.treeEditor.startEdit(node.ui.textNode);
        }.createDelegate(this), 10);
    }, updateNode : function() {
        var n = this.treePanel.getSelectionModel().getSelectedNode();
        if (!n) {
            Ext.Msg.alert('提示', "请选择一个节点");
        } else if (n == this.treePanel.getRootNode()) {
            Ext.Msg.alert('提示', "不能修改根节点");
        } else {
            setTimeout(function(){
                this.treeEditor.editNode = n;
                this.treeEditor.startEdit(n.ui.textNode);
            }.createDelegate(this), 10);
        }
    }, removeNode : function() {
        var sm = this.treePanel.getSelectionModel();
        var n = sm.getSelectedNode();
        if (n == null) {
            Ext.Msg.alert('提示', "请选择一个节点");
        } else if(n.attributes.allowDelete) {
            Ext.Msg.confirm("提示", "是否确定删除？", function(btn, text) {
                if (btn == 'yes') {
                    this.treePanel.getSelectionModel().selectPrevious();
                    this.treePanel.el.mask('提交数据，请稍候...', 'x-mask-loading');
                    // var hide = this.treePanel.el.unmask.createDelegate(this.treePanel.el);
                    var hide = function() {
                        this.treePanel.el.unmask(this.treePanel.el);
                        n.parentNode.removeChild(n);
                    }.createDelegate(this);
                    Ext.lib.Ajax.request(
                        'POST',
                        this.urlRemoveTree,
                        {success:hide,failure:hide},
                        'id=' + n.id
                    );
                }
            }.createDelegate(this));
        } else {
            Ext.Msg.alert("提示", "这个节点不能删除");
        }
    }, appendNode : function(node, array) {
        if (!node || node.childNodes.length < 1) {
            return;
        }
        for (var i = 0; i < node.childNodes.length; i++) {
            var child = node.childNodes[i];
            array.push({id:child.id,parentId:child.parentNode.id});
            this.appendNode(child, array);
        }
    }, save : function() {
        // 向数据库发送一个json数组，保存排序信息
        this.treePanel.el.mask('提交数据，请稍候...', 'x-mask-loading');
        // var hide = this.treePanel.el.unmask.createDelegate(this.treePanel.el);
        var hide = function() {
            this.treePanel.el.unmask(this.treePanel.el);
            this.refresh();
        }.createDelegate(this);
        var ch = [];
        this.appendNode(this.treePanel.root, ch);

        Ext.lib.Ajax.request(
            'POST',
            this.urlSortTree,
            {success:hide,failure:hide},
            'data=' + encodeURIComponent(Ext.encode(ch))
        );
    }, collapseAll : function() {
        this.contextMenu.hide();
        setTimeout(function() {
            var node = this.getSelectedNode();
            if (node == null) {
                this.treePanel.getRootNode().eachChild(function(n) {
                    n.collapse(true, false);
                });
            } else {
                node.collapse(true, false);
            }
        }.createDelegate(this), 10);
    }, expandAll : function() {
        this.contextMenu.hide();
        setTimeout(function() {
            var node = this.getSelectedNode();
            if (node == null) {
                this.treePanel.getRootNode().eachChild(function(n) {
                    n.expand(false, false);
                });
            } else {
                node.expand(false, false);
            }
        }.createDelegate(this), 10);
    }, prepareContext : function(node, e) {
        node.select();
        this.contextMenu.items.get('remove')[node.attributes.allowDelete ? 'enable' : 'disable']();
        this.contextMenu.showAt(e.getXY());
    }, refresh : function() {
        this.treePanel.root.reload();
        this.treePanel.root.expand(false, false);
    }, configInfo : function() {
        if (!this.dialog) {
            this.createDialog();
        }

        var n = this.getSelectedNode();
        //if (n == null) {
        //    Ext.MessageBox.alert("提示", "需要选中一个节点");
        //}
        this.menuData = new Ext.data.Store({
            proxy      : new Ext.data.HttpProxy({url:this.urlLoadData + "?id=" + n.id}),
            reader     : new Ext.data.JsonReader({},this.headers),
            remoteSort : false
        });

        this.menuData.on('load', function() {
            for (var i = 0; i < this.metaData.length; i++) {
                var meta = this.metaData[i];

                var id = meta.id;
                var value;
                if (meta.mapping) {
                    try {
                        value = eval("this.menuData.getAt(0).data." + meta.mapping);
                    } catch (e) {
                        value = this.menuData.getAt(0).data[meta.mapping];
                    }
                } else {
                    value = this.menuData.getAt(0).data[id];
                }

                if (meta.vType == "radio") {
                    for (var j = 0; j < meta.values.length; j++) {
                        var theId = meta.values[j].id;
                        var theName = meta.values[j].name;

                        if (value == theId) {
                            this.columns[id + theId].checked = true;
                            this.columns[id + theId].el.dom.checked = true;
                        } else {
                            this.columns[id + theId].checked = false;
                            this.columns[id + theId].el.dom.checked = false;
                        }
                    }
                } else if (meta.vType == "date") {
                    if (value == null ) {
                        this.columns[id].setValue(new Date());
                    } else {
                        this.columns[id].setValue(value);
                    }
                } else {
                    this.columns[id].setValue(value);
                }

            }
            this.dialog.show(this.treePanel.getSelectionModel().getSelectedNode().ui.textNode);
        }.createDelegate(this));

        this.menuData.load();
    }

    // 生成对话框
    , createDialog : function() {
        this.dialog = Ext.lingo.FormUtils.createTabedDialog(this.config.dialogContent + "-dialog", ['详细配置','帮助']);

        this.yesBtn = this.dialog.addButton("确定", function() {
            var item = Ext.lingo.FormUtils.serialFields(this.columns);
            if (!item) {
                return;
            }

            this.dialog.el.mask('提交数据，请稍候...', 'x-mask-loading');
            var hide = function() {
                this.dialog.el.unmask();
                this.dialog.hide();
                this.refresh();
            }.createDelegate(this);
            Ext.lib.Ajax.request(
                'POST',
                this.urlUpdateTree,
                {success:hide,failure:hide},
                'data=' + encodeURIComponent(Ext.encode(item))
            );
        }.createDelegate(this), this.dialog);
        this.tabs = this.dialog.getTabs();
        this.tabs.getTab(0).on("activate", function() {
            this.yesBtn.show();
        }, this, true);
        this.tabs.getTab(1).on("activate", function(){
            this.yesBtn.hide();
        }, this, true);

        var dialogContent = Ext.get(this.config.dialogContent);
        this.tabs.getTab(0).setContent(dialogContent.dom.innerHTML);
        document.body.removeChild(document.getElementById(this.config.dialogContent));
        this.applyElements();
        this.noBtn = this.dialog.addButton("取消", this.dialog.hide, this.dialog);
    }

    // 自动生成一切的地方
    , applyElements : function() {
        if (this.columns == null || this.headers == null) {
            this.headers = new Array();
            for (var i = 0; i < this.config.metaData.length; i++) {
                if (this.metaData[i].mapping) {
                    this.headers[this.headers.length] = this.metaData[i].mapping;
                } else {
                    this.headers[this.headers.length] = this.metaData[i].id;
                }
            }

            // 打开验证功能
            //Ext.form.Field.prototype.msgTarget = 'side';
            //Ext.form.Field.prototype.height = 20;
            //Ext.form.Field.prototype.fieldClass = 'text-field-default';
            //Ext.form.Field.prototype.focusClass = 'text-field-focus';
            //Ext.form.Field.prototype.invalidClass = 'text-field-invalid';

            this.columns = Ext.lingo.FormUtils.createAll(this.metaData);
        }
    }

    // 返回当前选中的节点，可能为null
    , getSelectedNode : function() {
        var selectionModel = this.treePanel.getSelectionModel();
        var node = selectionModel.getSelectedNode();
        return node;
    }
});