ext-main.js
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = 'images/s.gif';
Ext.QuickTips.init();
Ext.lib.Ajax.defaultPostHeader += ";charset=utf-8";
// 1、创建head部分
var tb=new Ext.Toolbar({
height: 29,
margins:"0 10 0 10",
items:[
{text:"摘机"},
{xtype:"tbseparator"},
{text:"挂机"},
{xtype:"tbseparator"},
{text:"复位"},
{xtype:"tbseparator"},
{xtype:"tbfill"},//加上这句，后面的就显示到右边去了
{xtype:"tbtext",text:"服务器状态: "},
{xtype:"tbtext",text:"正常"},
{xtype:"tbseparator"},
{xtype:"tbtext",text:"线路状态: "},
{xtype:"tbtext",text:"正常"},
{xtype:"tbseparator"},
{xtype:"tbtext",text:"坐席状态: "},
{xtype:"tbtext",text:"正常"},
{xtype:"tbseparator"},
{xtype:"tbtext",text:"本机号码: "},
{xtype:"tbtext",text:"106"},
{xtype:"tbseparator"},
{xtype:"tbtext",text:"队列等待数:"},
{xtype:"tbtext",text:"10"},
{xtype:"tbseparator"},
{xtype:"tbtext",text:"来电号码: "},
{xtype:"tbtext",text:"83110320",width:100},
{xtype:"tbseparator"}
]
});
var head = new Ext.Panel( {
region : 'north',
border : false,
height : 65,
items :[{
html : '<div style="background:url(images/bg_bar.gif) repeat-x; height:36px;">'
+'<div style="background: url(images/bg_logo.gif) no-repeat 0 0;height:36px;">'
+ '<div style="float:right;margin:10px;font:normal 12px tahoma, arial, sans-serif, 宋体;" >'
+ '<a href="#" onclick="javascript:window.close(); return false;" style="color: white">修改密码</a> '
+ '<a href="#" onclick="javascript:window.close(); return false;" style="color: white">注销</a> '
+ '<a href="#" onclick="javascript:window.close(); return false;" style="color: white">关闭</a> '
+'</div></div></div>'
},
tb
]
});
// 2、创建foot部分
var foot = new Ext.Panel( {
region : 'south',
html : '<div style="height:25px; ">'
+'<div style="float:left;font:normal 12px tahoma, arial, sans-serif, 宋体;margin:6px;">'
+ '上次登录IP: 192.168.18.201 上次登录时间: 2010-05-01 14:32:21</div>'
+ '<div style="float:right;margin:7px;font:normal 12px tahoma, arial, sans-serif, 宋体;" >'
+ '版权所有：南京广建科技有限公司</a></div>'
+ '</div>',
height : 25
});
// 3、创建leftMenu部分
// var leftmenu = new Ext.Panel( {
// region : 'west',
// html : '<div>导航菜单</div>',
// width : 200
// });
// 4、创建主内容部分
// var mainTab = new Ext.Panel( {
// region : 'center',
// html : '<div>主内容部分</div>'
// });
var loader = new Ext.tree.TreeLoader({
url:'treedata.js'
});
var t1 = new Ext.tree.TreePanel( {
border : false,
rootVisible : false,
root : new Ext.tree.AsyncTreeNode( {
text : "我的办公桌",
expanded : true,
loader:loader
})
});
var t2 = new Ext.tree.TreePanel( {
border : false,
rootVisible : false,
root : new Ext.tree.AsyncTreeNode( {
text : "主数据管理",
expanded : true,
children : [ {
id : "department",
text : "部门管理",
leaf : true
}, {
id : "company",
text : "公司管理",
leaf : true
}, {
id : "permissions",
text : "权限管理",
children : [ {
id : "permission",
text : "权限管理",
leaf : true
}, {
id : "permissionType",
text : "权限类别",
leaf : true
}]
}]
})
});
var leftmenu = new Together.Office.LeftMenu( {
title : '功能菜单',
trees : [t1, t2]
});
var mainTab = new Together.Office.MainingPanel( {
style : 'padding:0 6px 0 0',
autoScroll : true,
region : 'center',
deferredRender : false,
activeTab : 0,
resizeTabs : true,
inTabWidth : 100,
tabWidth : 90,
enableTabScroll : true,
items : [{
title : '首页',
iconCls:'index',
html : '<div style="background:url(images/main.gif) no-repeat center middle; height:508px;"></div>'
}]
});
// 5、建立leftmenu和mainTab两者之间的关系
leftmenu.on("nodeClick", function(nodeAttr) {
mainTab.loadTab(nodeAttr);
});
// 6、创建布局
var viewport = new Ext.Viewport( {
layout : 'border',
style : 'border:#024459 2px solid;',
items : [head, foot, leftmenu, mainTab]
});
});