qqclient.js

实现了一个OA系统基本的功能

Ext.BLANK_IMAGE_URL = './ext2.2/resources/images/default/s.gif';
Ext.onReady(function() {
	Ext.QuickTips.init();
	var currentUser = document.forms[0].elements[0].value;
	/**
	 * @description 构建一个树形面板，用于显示在线用户等
	 */
	var Tree = Ext.tree;
	// 定义树的Loader,为Loader加上监视器
	// 防止在网络出现异常的时候，从后台提取不到数据
	var nodeLoader = new Tree.TreeLoader({
		listeners : {
			"loadexception" : function(loader, node, response) {
				node.loaded = false;
				node.reload.defer(10, node);
			}
		}
	});
	// 定义（可以异步加载）根节点
	var root = new Tree.AsyncTreeNode({
		id : '0',
		text : '目录根节点'
	});
	// 开始构建树面板
	var treePanel = new Tree.TreePanel({
		root : root,
		loader : nodeLoader,
		deferredRender : false,
		title : '在线用户',
		border : true,
		rootVisible : false,
		lines : false,
		autoScroll : true,
		enableDD : false,
		animate : false
	});
	/**
	 * @method treeClick
	 * @private
	 * @description 添加‘单击事件’处理 当单击节点时，加载该节点的子节点
	 */
	var treeClick = function(node, e) {
		if (!node.isLeaf()) {
			treePanel.loader.dataUrl = 'treeProcess.qq?NodeId='
					+ node.id;
		}
	}
	treePanel.on('beforeload', treeClick);
	/**
	 * @method treeDoubleClick
	 * @private
	 * @description 添加‘双击事件’处理 当双击节点时，弹出聊天对话框
	 */
	var treeDoubleClick = function(node, e) {
		if (node.text == currentUser||node.text=='登录用户') {
			return null;
		}
		new ExtFrame.ui.ChatWin(node.text, currentUser).init();
	}
	treePanel.on('dblclick', treeDoubleClick);
	/**
	 * @method expandAll
	 * @private
	 * @description 展开所有节点
	 */
	var expandAll = function() {
		treePanel.root.expand(true, false);
	}
	/**
	 * @method updateUserList
	 * @private
	 * @description 定时更新在线用户列表，刷新时间为10分钟
	 */
	var updateUserList = function() {
		treePanel.root.reload();
		treePanel.root.expand(true, false);
		setTimeout(updateUserList, 1000 * 60 * 10);
	}
	/**
	 * @method autoShowChatWin
	 * @private
	 * @description 当收到信息时，自动弹出聊天窗口
	 */
	var autoShowChatWin = function(msg) {
		var currentWin = Ext.getCmp(msg.fromUserName);
		if (currentWin != null) {
			return null;
		}
		new ExtFrame.ui.ChatWin(msg.fromUserName, currentUser).init();
	}
	/**
	 * @method loadMsg
	 * @private
	 * @description 定时从服务器端获取消息，刷新时间为3秒钟
	 */
	var loadMsg = function() {
		Ext.Ajax.request({
			url : 'getMsg.qq',
			params : {
				toUserName : currentUser
			},
			success : function(response) {
				if (response.responseText != '') {
					var msg = eval('(' + response.responseText + ')');
					for (var i = 0; i < msg.jsonArr.length; i++) {
						autoShowChatWin(msg.jsonArr[i]);
						addMsg(msg.jsonArr[i]);
					}
				}
			}
		});
		setTimeout(loadMsg, 1000 * 3);
	}
	/**
	 * @method addMsg
	 * @private
	 * @description 把从服务器端获取的消息添加到相应的聊天窗口
	 */
	var addMsg = function(msg) {
		var formatmsg = "<div class='_msgtitle' style='color:blue'>"
				+ msg.fromUserName + "  " + msg.sendDate
				+ "</div><div class='_msg'>" + decodeURIComponent(msg.message)
				+ "</div>";
		Ext.getCmp(msg.fromUserName).findById("showMsg").body.insertHtml(
				"beforeEnd", formatmsg);
		Ext.getCmp(msg.fromUserName).findById("showMsg").body.scroll("bottom",
				9999);
	}
	/**
	 * @description 构建主窗体
	 */
	var topToolBar = new Ext.Toolbar({
		items : [{
					text : '关闭',
					tooltip : "guanbi",
						title : '关闭',
						
						handler:function(){
						qqClientWin.hide();
					}
					}
				, '-', {
					text : '刷新',
					tooltip : '刷新用户列表',
					handler:function(){
						updateUserList();
					}
				}, '-', {
					text : '帮助',
					tooltip : '帮助',
					handler:function(){
						Ext.MessageBox.alert("qq");
					}
				}]
	});
	var qqClientWin = new Ext.Window({
		title : 'WebQQ' + '(' + currentUser + ')',
		collapsible : true,
		width : 220,
		height : 400,
		shim : false,
		animCollapse : false,
		constrainHeader : true,
		tbar : topToolBar,
		layout : 'accordion',
		border : false,
		layoutConfig : {
			animate : false
		},
		items : [treePanel, {
			title : '最近联系人',
			html : '<p>oa</p>',
			autoScroll : true
		}, {
			title : '群',
			html : '<p>oa</p>'
		}]
	});
	expandAll();
	loadMsg();
	updateUserList();
    qqClientWin.show();
});