ext3.0 treegrid 部门管理

 

<script type="text/javascript" charset="utf-8">
        jackAccess.Rsb_DepartMents = function() {
            var myPageSize = 20, searchString = "";
            var treeGrid, winFormPanel, formPanel, winExcelForm, excelForm, rootnode;
            var treeloader = new Ext.ux.tree.TreeGridLoader({
                url: "/rsb_departments/treelist?test="
            });
            formPanel = new Ext.FormPanel({ frame: true,
                items: [
                                    { xtype: 'textfield', fieldLabel: "部门名称", name: "DeptName", width: 200, allowBlank: false, blankText: '非空' },
                                    { xtype: 'textfield', fieldLabel: "部门编号", name: "DeptNum", width: 200, allowBlank: false, blankText: '非空' },
                                    { xtype: 'textfield', fieldLabel: "管理者", name: "Managerid", width: 200 }

                                     ]
            });
            excelForm = new Ext.FormPanel({ frame: true, url: "/rsb_departments/excel", method: "post", fileUpload: true,
                items: [
                                    { xtype: 'textfield', fieldLabel: "部门ID", name: "DeptName", width: 200, value: "1" },
                                     { xtype: 'textfield', fieldLabel: "部门编号", name: "DeptNum", width: 200, value: "2" },
                                    { xtype: 'textfield', fieldLabel: "部门名称", name: "DeptName", width: 200, value: "3" },
                                    { xtype: 'textfield', fieldLabel: "上级部门", name: "Managerid", width: 200, value: "4" },
                                    { fieldLabel: "Excel文件", buttonText: 'Excel文件', width: 200, name: "file", xtype: "fileuploadfield" }
                                     ]
            });
            winFormPanel = new Ext.Window({ modal: true, closable: true, resizable: false, bodyStyle: "padding:5px", width: 400, title: item.text, iconCls: 'drives', layout: "form", closeAction: "hide",
                buttons: [{ text: "提交", handler: function() { OnSubmit(); } }, { text: "关闭", handler: function() { winFormPanel.hide(); } }],
                items: formPanel
            });
            winExcelForm = new Ext.Window({ modal: true, closable: true, title: "导入excel", resizable: false, bodyStyle: "padding:5px", width: 400, iconCls: 'drives', layout: "form", closeAction: "hide",
                buttons: [{ text: "提交", handler: function() { ExcelSubmit(); } }, { text: "关闭", handler: function() { winExcelForm.hide(); } }],
                items: excelForm
            });
            function ExcelSubmit() {
                if (excelForm.form.isValid()) {
                    excelForm.getForm().submit({ waitTitle: '请稍候', waitMsg: '正在添加数据......',

                        success: function(form, action) {
                            if (action.result.flag) { Ext.MessageBox.alert("警告", "操作成功"); rootnode.reload(); }
                            else { Ext.MessageBox.alert("警告", "添加失败：" + action.result.error); }
                        }
                    });
                }
            }
            function OnCreate() {
                winFormPanel.show();
                winFormPanel.action = "create";
                winFormPanel.DeptID = "";
                winFormPanel.setTitle("添加新部门");
            }
            function OnUpdate() {
                var selectedNode = treeGrid.getSelectionModel().getSelectedNode();
                if (selectedNode == null) { Ext.MessageBox.alert("警告", "请选择一个部门节点！"); return; }
                winFormPanel.show();
                winFormPanel.DeptID = selectedNode.attributes["DeptID"];
                winFormPanel.action = "update";
                winFormPanel.setTitle("修改[" + selectedNode.attributes["DeptName"] + "]");
                formPanel.getForm().setValues(selectedNode.attributes);
            }
            function OnDelete() {
            }
            function OnSubmit() {
                if (formPanel.form.isValid()) {
                    formPanel.form.submit({ waitTitle: '请稍候', waitMsg: '正在添加数据......', url: "/Rsb_DepartMents/Submit", method: "post",
                        params: { action: winFormPanel.action, deptid: winFormPanel.DeptID },
                        success: function(form, action) {
                            if (action.result.flag) {
                                Ext.MessageBox.alert("警告", "操作成功");
                                var tree = treeGrid.getSelectionModel().getSelectedNode();

                                tree.parentNode.reload();

                                winFormPanel.hide();
                            }
                            else { Ext.MessageBox.alert("警告", "添加失败：" + action.result.error); }
                        }
                    });
                }
            }
            treeGrid = new Ext.ux.tree.TreeGrid({ columnLines: true,
                containerScroll: true, autoScroll: true,
                width: Ext.get("center").getWidth() - 10,
                height: Ext.get("center").getHeight() - 33,
                columns: [
               { header: '部门名称', dataIndex: 'DeptName', width: 350 },
               { header: '部门编号', dataIndex: 'DeptNum', width: 200 },
               { header: '级别', dataIndex: 'Grade', width: 200 },
               { header: '管理人', dataIndex: 'Managerid', width: 200 }

               ],
                loader: treeloader,
                tbar: [{ text: "添加新部门", iconCls: "create", handler: function() { OnCreate(); } }, '-',
              { text: "修改所选", iconCls: "update", handler: function() { OnUpdate(); } }, '-',
              { text: "删除所选", iconCls: "delete", handler: function() { OnDelete(); } }, '-',
              { text: "导入excel数据", iconCls: "excel", handler: function() { winExcelForm.show(); } }, '-',
               { text: "导出excel", iconCls: "excel", handler: function() { window.open("/Excel/DepartMents"); } }]
                //绑定加载器
            });
            rootnode = new Ext.tree.AsyncTreeNode({
                id: '0',
                text: '中华人民共和国行政区划代码',
                draggable: false, // 根节点不容许拖动
                expanded: true
            });
            rootnode.attributes = {
                fatherID: '',
                DeptID: '1'

            };
            treeGrid.setRootNode(rootnode);

            // 响应加载前事件，传递node参数
            treeGrid.on('beforeload', function(node) {

                treeGrid.loader.dataUrl = "/rsb_departments/treelist?fatherID=" + node.attributes["DeptID"];
            }, treeloader);

            return { Init: function() { return treeGrid; } }
        }
        Ext.onReady(function() {
            var grid = new jackAccess.Rsb_DepartMents();
            grid.Init().render("Rsb_DepartMents_TreePanel");

        });

    </script>

    <div id="Rsb_DepartMents_TreePanel">
    </div>