Ext基本操作的封装

Ext.namespace('Ext.ux');
Ext.QuickTips.init(); // 按钮快捷提示初始化

/**
 * 封装 suggest显示
 */
Msg = Ext.MessageBox;
Ext.ux.suggest = function() {
	var msgCt;

	function createBox(t, s) {
		return [
				'<div class="msg">',
				'<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
				'<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3><font color=#FF0000>',
				t,
				'</font></h3>',
				s,
				'</div></div></div>',
				'<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
				'</div>'].join('');
	}
	return {
		msg : function(title, format) {
			if (!msgCt) {
				msgCt = Ext.DomHelper.insertFirst(document.body, {
					id : 'msg-div'
				}, true);
			}
			var s = String.format.apply(String, Array.prototype.slice.call(
					arguments, 1));
			var m = Ext.DomHelper.append(msgCt, {
				html : createBox(title, s)
			}, true);
			m.slideIn('t').pause(2).ghost("t", {
				remove : true
			});
		},

		init : function() {
			var lb = Ext.get('lib-bar');
			if (lb) {
				lb.show();
			}
		}
	}
}();

Ext.apply(Ext.MessageBox, {
	suggest : Ext.ux.suggest.msg
});

/**
 * 返回一个Viewport
 */
Ext.main = {
	/**
	 * 创建一个ViewPort
	 */
	createViewPort : function(items) {
		var viewport = new Ext.Viewport( {
			layout : "fit",
			border : false,
			items : [items]
		});
		return viewport;
	}
	,

};

/**
 * 封装GridPanel
 */
Ext.dream = {
	
	/**
	 * 创建一个数据存储集
	 * cfg['url'] = 'server.jsp';
	 * cfg['recordName'] = "Menu"; 
	 * cfg['record'] = Menu; 
	 */
	createStore:function(cfg){
		// 定义信息数据集对象
		var dataStore = new Ext.data.Store( {
			autoLoad : false,
			url : cfg.url,
			reader : new Ext.data.XmlReader( {
				totalRecords : "totalNum",
				record : cfg.recordName
			}, cfg.record)
		// XmlReader结束
		});// 数据集对象创建结束
		return dataStore;
	},
	/**
	 * url:请求的地址 record：记录对象 tbar：顶部工具栏 columnModel：需要显示的列 pageSize:每页显示的记录数 
	 * var cfg = {};
	 * cfg['dataStore'] GridPanel的数据集
	 * cfg['tbar'] = topBar;
	 * cfg['columnModel'] = columnModel; 
	 * cfg['pageSize'] = 4; 
	 * cfg['sm'] = sm;配置列选择模式
	 */
	createGridPanel : function(cfg) {

		var pagingBar = new Ext.PagingToolbar( {
			store : cfg.dataStore,
			pageSize : cfg.pageSize,
			displayInfo : true,
			displayMsg : '第{0}条到第{1}条，一共{2}条',
			emptyMsg : "没有信息"
		});

		// 创建Grid表格组件
		var gridPanel = new Ext.grid.GridPanel( {

			border : false,
			width : Ext.get('box').getWidth(),
			frame : true,
			tbar : cfg.tbar,
			bbar : pagingBar,
			store : cfg.dataStore,
			stripeRows : true,
			viewConfig : {
				forceFit : true
			},
			sm : cfg.sm,// 列选择模式
			cm : cfg.columnModel
		});// 创建grid表格结束
		cfg.dataStore.load( {
			params : {
				start : 0,
				limit : cfg.pageSize
			}
		})
		return gridPanel;
	}
};

/**
 * 验证基类
 */
Ext.validate = {
	/**
	 * 判断是否选中了多条记录
	 * grid:表格对象
	 */
	selectedMore:function(grid){
		// 获取选中的复选框所表示的对象数组
		var records = grid.getSelectionModel().getSelections();
		// 若选中多条进行修改提示错误
		if (records.length != 1) {
			Ext.Msg.alert('提示', '<font color="red">只能选择一条记录</font>');
			return true;
		} else{
			return false;
		}
	},
	
	/**
	 * 判断是否未选中任何记录
	 */
	noSelected:function(grid){
		// 获取选中的复选框所表示的对象数组
		var records = grid.getSelectionModel().getSelections();
		// 若选中多条进行修改提示错误
		if (records.length == 0) {
			Ext.Msg.alert('提示', '<font color="red">请选择一条记录</font>');
			return true;
		} else {
			return false;
		}
	},
	
	/**
	 * 获取所有选中的记录的指定名称的值组成的字符串，以,隔开的
	 * name:列名
	 * grid:GridPanel对象
	 */
	getSelected:function(grid,name){
		// 获取选中的复选框所表示的对象数组
		var records = grid.getSelectionModel().getSelections();
		var res = "";
		for (i = 0;i < records.length; i++) {
			var one = records[i].get(name);//一条记录的列值
			if (i == records.length - 1) {
				res = res + one;
			} else {
				res = res + one + ",";
			}
		}
		return res;
	}
}

/**
 * 封装ComboBox,如 var cfg = {}; cfg['fieldLabel'] = '父菜单'; 标签 cfg['url']
 * ='comboServer.jsp'; 请求的url cfg['recordType'] = 'Menu', 记录类型 cfg['fields'] =
 * ['name','idno']; cfg['name'] = 'parentid';字段名称
 */
Ext.combo = {
	createComboBox : function(cfg) {
		var fields = new Array();
		fields = cfg.fields;
		var record = Ext.data.Record.create([ {
			name : fields[0]
			,
		}, {
			name : fields[1]
		}]);
		var myReader = new Ext.data.XmlReader( {
			totalRecords : "totalNum",
			record : cfg.recordType
			,
		}, record);

		var comboStore = new Ext.data.Store( {
			autoLoad : true,
			url : cfg.url,
			reader : myReader
		});

		var combo = new Ext.form.ComboBox( {
			fieldLabel : cfg.fieldLabel,
			store : comboStore,
			value : '请选择...',
			editable : false,// 不可编辑
			name : cfg.name,
			displayField : fields[0],// 显示的字段
			valueField : fields[1],// 实际值字段
			triggerAction : 'all'
		});
		return combo;
	}
};

/**
 * 数据相关的操作
 * @author 忧里修斯
 */
Ext.dao = {
	
	/**
	 * 前台表单数据的封装，自动将一个表单中的数据封装成一个js对象obj {} 
	 * 说明: 
	 * 1、对单选按钮radio,值为选中的按钮的boxLabel
 	 * 2、对组合框combo,值为选中的值 3、对复选框checkbox,值为选中的框的boxLabel,多项以","分隔组成字符串
	 */
	getObjFromForm : function(form) {
		fields = form.getForm().items;
		var obj = {};
		var flag = true;// 特殊标记
		var checkboxValue = [];// 保存复选框中的值
		var checkBoxName;// 复选框对应字段名称

		for (var i = 0;i < fields.length; i++) {
			// 对应一个表单字段
			var field = fields.itemAt(i);
			var value = field.getValue();// 字段值
			var xtype = field.getXType();// 表单域类型

			if (xtype == 'radio') {// 单选处理
				if (flag) {
					if (value) {
						value = field.boxLabel;
						flag = false;
						obj[field.name] = value;
					}
				}

			} else if (xtype == 'combo') {
				var index = field.store.find(field.valueField, value);// 根据属性名和值查找记录的位置
				if (index != -1) {
					var selItem = field.store.getAt(index);
					value = selItem.get(field.valueField);
					obj[field.name] = value;
				}
			} else if (xtype == 'checkbox') {
				if (value) {// 若选中
					checkBoxName = field.name;
					checkboxValue.push(field.boxLabel)
				}
			} else {// 其他类型
				obj[field.name] = value;
			}
		}
		obj[checkBoxName] = checkboxValue;

		return obj;
	},
	
	/**
	 * 表单数据的加载
	 * cfg.form 要加载的表单对象
	 * cfg.url请求地址
	 */
	loadFormData:function(cfg){
		var formObj = cfg.form;
		formObj.form.load( {
			waitMsg : '加载中...',
			waitTitle : '提示',
			url : cfg.url,
			method : 'POST',
			failure : function(form, action) {
				Ext.Msg.alert('提示', '加载失败，原因为：' + action.failureType);
			}
		});
	}
};