Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';
Ext.onReady( function() {
Ext.QuickTips.init();
//页面的上部分
var northPanel = new Ext.Panel( {
title : "百通天下中小企业信息化管理平台",//实际应用中,通常去掉该属性。
region : 'north',//北部,即顶部,上面
contentEl : 'north-div',//面板包含的内容
split : false,
border : false,//当面板内容超出面板大小时,是否显示边框
collapsible : false,//是否可以收缩,默认不可以收缩,即不显示收缩箭头
//collapsed:true,//初始化是否显示, 默认是显示
height : 60
});
//左边菜单
var westPanel = new Ext.Panel( {
title : '左边菜单',//面板名称
region : 'west',//该面板的位置,此处是西部 也就是左边
split : true,//为true时,布局边框变粗 ,默认为false
border : false,
collapsible : true,
collapsed : false,//初始化是否显示, 默认是显示
width : 150,
minSize : 10,//最小宽度
maxSize : 300,
layout : 'accordion',
layoutConfig : { //布局
titleCollapse : true,
animate : true,
activeOnTop : false
},
items : [ {
title : '模块管理',
contentEl : 'moduleTree'//子面板包含的内容,contentEl 的值日通常是一个div ID
},{
title : '数据字典',
contentEl : 'dictTypeTree'//子面板包含的内容,contentEl 的值日通常是一个div ID
}
]
});
//页面的右边
var eastPanel = new Ext.Panel( {
region : "east",
title : "右边",
collapsible : true,
collapsed : false,
//collapsed:true,//是否显示
split : true,
width : 225,
minSize : 175,
maxSize : 400,
layout : "fit",
margins : "0 5 0 0",
layout : "accordion",
iconCls : "my-toolPanelIcon",
layoutConfig : {
animate : true
}
});
//页面的底部
var southPanel = new Ext.Panel( {
title : '底部面板',
region : "south",
split : true,
height : 80,
minSize : 60,
maxSize : 150,
collapsible : true,
collapsed : false,
contentEl : "footer",
title : "底栏",
margins : "0 0 0 0"
});
//页面的中间面板
var centerPanel = new Ext.Panel( {
region : 'center',//中间 主显示面板
activeTab : 0,
enableTabScroll : true,
border : false,
items : [ {
id : 'HomePage',
title : '首页',
iconCls : 'home',
contentEl : 'hp',//显示的内容,hp 是div ID
closable : false,
layout : 'fit',
resizeEl: 'center-iframe'
} ]
});
var viewport = new Ext.Viewport( {
layout : 'border',//布局,必须是border
loadMask : true,
items : [ northPanel, //上
westPanel,//左
centerPanel,//中
eastPanel,//右
southPanel //下
]
});
var Tree = Ext.tree;
var tree = new Tree.TreePanel( {
el : 'moduleTree',
autoScroll : true,
animate : true,
enableDD : true,
containerScroll : true,
loader : new Tree.TreeLoader( {
dataUrl : './module/getTreeListData.html'
})
});
var root = new Tree.AsyncTreeNode( {
text : 'Module Ext Tree',
draggable : false,
id : 'source'
});
tree.setRootNode(root);
tree.render();
root.expand();
var n;
tree.on('click', function(node, event) {
//Ext.get('center-iframe').dom.src = node.attributes.href;
//Ext.get('center-iframe').load({url:node.attributes.href});
centerPanel.load({url:node.attributes.href,title:'text'});
});
});
4545
Copyright © 2007-2008 ® 版权所有