// http://www.faceye.com/blogs/category/ext?startIndex=40
Ext.onReady(function() {
// layout
Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
// create some portlet tools using built in Ext tool ids
// var tools = [
// // {
// // id:'gear',
// // handler: function(){
// // Ext.Msg.alert('Message', 'The Settings tool was clicked.');
// // }
// // },
// {
// id:'close',
// handler: function(e, target, panel){
// panel.ownerCt.remove(panel, true);
// }
// }];
var viewport = new Ext.Viewport({
layout : 'border',
items : [new Ext.BoxComponent({
region : 'north',
el : 'north',
height : 50
}), new Ext.BoxComponent({
region : 'south',
el : 'south',
height : 25
}), {
region : 'west',
id : 'west-panel',
// autoHeight : true,
split : true,
width : 200,
minSize : 175,
maxSize : 200,
margins : '10 0 0 0',
layout : 'accordion',
title : '导航',
collapsible : true,
layoutConfig : {
animate : true
},
items : [{
title : '公告信息',
border : false,
html : '<div id="tree-div" style="overflow:auto;width:100%;height:100px"></div>'
// iconCls:'nav'
}, {
title : '项目管理',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '考勤管理',
border : false,
// iconCls:'settings',
html : '<div id="tree3" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '设备管理',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '资料借阅',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '座位管理',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '门区管理',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '帐号管理',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '维基百科',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}, {
title : '公司规定',
border : false,
// iconCls:'settings',
html : '<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
}]
}, {
xtype : 'portal',
region : 'center',
margins : '10 5 5 0',
items : [{
columnWidth : .68,
style : 'padding:10px 0 10px 10px',
items : [{
height : 200,
title : '新闻',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '代办事宜',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '投票',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '今日日程',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '内部讨论区',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}]
}, {
columnWidth : .32,
style : 'padding:10px',
items : [{
height : 200,
title : '公告通知',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '内部邮件',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p><p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '近日日程(10日内)',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p><p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '外出人员',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p><p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}, {
height : 200,
title : '本月日程',
// tools: tools,
html : "<p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p><p>jkjkhjkhnjgddgdgddghdghdhdhdghd</p>"
}]
}]
}]
});
/**
* ---------------------------------------------------------- Start Tree
* Define Define tree Struct Tree Define By Bai Lian Dong
* ----------------------------------------------------------
*/
var Tree = Ext.tree;
var treepanel = new Tree.TreePanel({
id : 'default-manager-tree',
el : 'tree-div', // 填充区域
rootVisible : false, // 隐藏根节点
border : false, // 边框
animate : true, // 动画效果
autoScroll : true, // 自动滚动
enableDD : false, // 拖拽节点
containerScroll : true,
lines : false,
loader : new Tree.TreeLoader({
// dataUrl : BP + 'treeAction.do?method=tree'
})
});
// 异步加载根节点
var rootnode = new Tree.AsyncTreeNode({
id : 'source',
draggable : false,
text : '目录树根节点'
});
// 设置根节点
treepanel.setRootNode(rootnode);
treepanel.on('click', function(node) {
if (node.isLeaf()) {
var centerContainer = Ext.getCmp('center-container');
var container = Ext.getCmp('manager-center-container');
if (container) {
container = new Ext.Panel({
autoScroll : false,
id : 'manager-center-container',
border : false,
html : '<iframe id="content-iframe" frameborder="no" style="width:100%;height:99.9%"></iframe>'
});
centerContainer.add(container);
centerContainer.doLayout();
}
if (node.attributes.url.indexOf('.js') != -1) {
var url = node.attributes.url;
Ext.Ajax.request({
url : url,
params : {
id : node.id,
name : node.text
},
success : function(response, options) {
var source = response.responseText;
var headerDom = document.getElementsByTagName('head').item(0);
var jsDom = document.createElement('script');
jsDom.type = 'text/javascript';
jsDom.language = 'javascript';
jsDom.defer = true;
jsDom.text = source;
headerDom.appendChild(jsDom);
var portlet;
portlet = com.easou.portal.portlet.SinglePortlet.init(
options.params.id, options.params.name);
if (portlet.draggable) {
portlet.draggable = false;
}
if (portlet.tools) {
portlet.tools = null;
}
if (portlet.collapsible) {
portlet.collapsible = false;
}
var vH = document.body.clientHeight;
portlet.setHeight(vH - 30);
// portlet.doLayout();
container.add(portlet);
centerContainer.doLayout();
}
});
} else {
Ext.get('content-iframe').dom.src = node.attributes.link
+ '&node=' + node.id;
}
return true;
} else {
// open node by single click,not double click.
node.toggle();
}
});
// render the tree
treepanel.render();
rootnode.expand();
// tree2
var root2 = new Ext.tree.TreeNode({
id : "root2",
text : "树的根"
});
var c1 = new Ext.tree.TreeNode({
id : 'c1',
icon : 'images/im2.gif',
text : '信息征集'
});
var c2 = new Ext.tree.TreeNode({
id : 'c2',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : 'bug征集'
});
var c22 = new Ext.tree.TreeNode({
id : 'c22',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : '实例征集'
});
var c3 = new Ext.tree.TreeNode({
id : 'c3',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : '给我留言'
});
var c4 = new Ext.tree.TreeNode({
id : 'c4',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : '项目主页'
});
c1.appendChild(c2);// 为c1增加子结点
c1.appendChild(c22);
root2.appendChild(c1);// 为根节点增加子结点c1
root2.appendChild(c3);
root2.appendChild(c4);
// 生成树形面板
var tree2 = new Ext.tree.TreePanel({
renderTo : "tree",
root : root2,
animate : true,
enableDD : false,
border : false,
rootVisible : false,
containerScroll : true
});
// tree3
var root3 = new Ext.tree.TreeNode({
id : "root3",
text : "树的根"
});
var c1 = new Ext.tree.TreeNode({
id : 'c1',
icon : 'images/im2.gif',
text : '信息征集'
});
var c2 = new Ext.tree.TreeNode({
id : 'c2',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : 'bug征集'
});
var c3 = new Ext.tree.TreeNode({
id : 'c3',
icon : 'images/im2.gif',
href : 'http://www.163.com/',
target : '_blank',
text : '给我留言'
});
c1.appendChild(c2);// 为c1增加子结点
root3.appendChild(c1);// 为根节点增加子结点c1
root3.appendChild(c3);
// 生成树形面板
var tree2 = new Ext.tree.TreePanel({
renderTo : "tree3",
root : root3,
animate : true,
enableDD : false,
border : false,
rootVisible : false,
containerScroll : true
});
// end loding
setTimeout(function() {
Ext.get('loading').remove();
Ext.get('loading-mask').fadeOut({
remove : true
});
}, 250);
});