nav_job.js

一个简单ssh+extjs的人力资源管理系统（转载）

Ext.onReady(function() {
	/*---------------------------------部门导航树---------------------------*/
	var jobTree = new Ext.tree.TreePanel({
				id : 'dept_job_tree',
				title : '部门导航',
				renderTo : 'dept_job_tree',
				columnWidth : .15,
				frame : true,
				layout : 'fit',
				height : 300,
				width : 180,
				minSize : 150,
				minSize : 250,
				root : new Ext.tree.AsyncTreeNode({
							id : '0',
							text : '部门'
						}),
				loader : new Ext.tree.TreeLoader({
							dataUrl : 'getNodes.do?type=dept'
						}),
				animate : true,
				border : false,
				autoScroll : true
			});

	/*------------------------------岗位列表--------------------------------*/
	var model = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), {
				header : '岗位编码',
				width : 100,
				dataIndex : 'jobcode',
				sortable : true,
				editor : new Ext.grid.GridEditor(new Ext.form.TextField({
							allowBlank : false
						}))
			}, {
				header : '岗位名称',
				width : 100,
				dataIndex : 'jobname',
				sortable : true,
				editor : new Ext.grid.GridEditor(new Ext.form.TextField({
							allowBlank : false
						}))
			}, {
				header : '所属职务',
				width : 100,
				dataIndex : 'pk_outer_post',
				sortable : false,
				editor : new Ext.grid.GridEditor(new Ext.form.ComboBox({
							hiddenName : 'pk_outer_post',
							allowBlank : false,
							width : 70,
							store : new Ext.data.Store({
										proxy : new Ext.data.HttpProxy({
													url : 'getById.do?type=post',
													disableCaching : false
												}),
										reader : new Ext.data.JsonReader({
													root : 'data'
												}, ['id', 'postname'])
									}),
							displayField : 'postname',
							valueField : 'id',
							typeAhead : true,
							forceSelection : true,
							selectOnFocus : true,
							triggerAction : 'all'
						}))
			}, {
				header : '岗位类别',
				width : 100,
				dataIndex : 'jobtype',
				sortable : true,
				editor : new Ext.grid.GridEditor(new Ext.form.ComboBox({
							allowBlank : false,
							mode : 'local',
							width : 70,
							store : new Ext.data.SimpleStore({
										fields : ['value', 'display'],
										data : [['manager', '管理类'],
												['function', '职能类'],
												['produce', '生产类'],
												['business', '业务类'],
												['guanxi', '公共关系类']]
									}),
							displayField : 'display',
							valueField : 'value',
							typeAhead : true,
							forceSelection : true,
							selectOnFocus : true,
							triggerAction : 'all'
						}))
			}, {
				header : '岗位描述',
				width : 120,
				dataIndex : 'jobdesc',
				sortable : false,
				editor : new Ext.grid.GridEditor(new Ext.form.TextArea({}))
			}]);
	var store = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : 'getById.do?type=job',
							disableCaching : false
						}),
				reader : new Ext.data.JsonReader({
							root : 'data'
						}, ['jobcode', 'jobname', 'pk_outer_post', 'jobtype',
								'jobdesc'])
			});
	store.load();
	var jobGrid = new Ext.grid.EditorGridPanel({
				title : '岗位信息列表',
				frame : true,
				renderTo : 'job_grid',
				width : 600,
				height : 300,
				columnWidth : .85,
				cm : model,
				store : store
			});
	jobGrid.stopEditing();
	/* `````````````````````````````````岗位列表信息结束`````````````````````` */
	// 部门树点击响应事件
	jobTree.on('click', function(node) {
				var nodeid = node.id;
				store.load({
							params : {
								id : nodeid
							}
						});
			});
	/*------------------------------岗位表单--------------------------------*/

	/* `````````````````````````````岗位表单结束`````````````````````````````` */

	/*-----------------------------主面板-----------------------------------*/
	new Ext.Panel({
		renderTo : 'tab_nav_job',
		frame : true,
		closeAction : 'hide',// 保证关闭之后再次点击树节点能够再次显示此界面
		layout : 'column',
		height : 600,
		autoHeight : false,
		items : [jobTree, jobGrid],
		tbar : [{
			text : '新建',
			handler : function() {
				/*-----------------------新建岗位窗口(响应新建按钮事件)-----------------*/
				var jobForm = new Ext.form.FormPanel({
					id : 'json_form',
					title : '岗位信息编辑区',
					frame : true,
					width : 440,
					labelAlign : 'right',
					labelWidth : 60,
					defaultType : 'textfield',
					defaults : {
						labelSeparator : ':'
					},
					items : [{
						xtype : 'panel',
						layout : 'column',
						border : true,
						items : [{
							columnWidth : .5,
							layout : 'form',
							border : true,
							defaultType : 'textfield',
							items : [{
										name : 'jobcode',
										fieldLabel : '岗位编码',
										allowBlank : false,
										vtype : 'alphanum',
										vtypeText : '请您输入A-Z,a-z,0-9的字母数字组合!'
									}, new Ext.form.ComboBox({
										hiddenName : 'pk_outer_dept',
										fieldLabel : '部门选择',
										allowBlank : false,
										width : 100,
										store : new Ext.data.Store({
											proxy : new Ext.data.HttpProxy({
														url : 'getById.do?type=dept',
														disableCaching : false
													}),
											reader : new Ext.data.JsonReader({
														root : 'data'
													}, ['id', 'deptname'])
										}),
										displayField : 'deptname',
										valueField : 'id',
										typeAhead : true,
										forceSelection : true,
										selectOnFocus : true,
										triggerAction : 'all'
									}), {
										xtype : 'combo',
										hiddenName : 'jobtype',
										fieldLabel : '岗位类别',
										allowBlank : false,
										width : 125,
										mode : 'local',
										store : new Ext.data.SimpleStore({
													fields : ['value',
															'display'],
													data : [
															['manager', '管理类'],
															['function', '职能类'],
															['produce', '生产类'],
															['business', '业务类'],
															['guanxi', '公共关系类']]
												}),
										displayField : 'display',
										valueField : 'value',
										typeAhead : true,
										forceSelection : true,
										selectOnFocus : true,
										triggerAction : 'all'
									}]
						}, {
							columnWidth : .5,
							layout : 'form',
							border : true,
							defaultType : 'textfield',
							items : [{
										name : 'jobname',
										fieldLabel : '岗位名称',
										allowBlank : false,
										vtype : 'alphanum',
										vtypeText : '请您输入A-Z,a-z,0-9的字母数字组合!'
									}, new Ext.form.ComboBox({
										xtype : 'combo',
										hiddenName : 'pk_outer_post',
										fieldLabel : '职务选择',
										allowBlank : false,
										width : 125,
										store : new Ext.data.Store({
											proxy : new Ext.data.HttpProxy({
														url : 'getById.do?type=post',
														disableCaching : false
													}),
											reader : new Ext.data.JsonReader({
														root : 'data'
													}, ['id', 'postname'])
										}),
										displayField : 'postname',
										valueField : 'id',
										typeAhead : true,
										forceSelection : true,
										selectOnFocus : true,
										triggerAction : 'all'
									})]
						}]
					}, {
						name : 'jobdesc',
						fieldLabel : '岗位描述',
						xtype : 'textarea',
						anchor : '70%'
					}]
				});
				var jobWindow = new Ext.Window({
							constrain : true,
							frame : true,
							resizable : false,
							width : jobForm.width,
							height : jobForm.height,
							items : [jobForm],
							buttons : [{
										text : '提交',
										handler : function(btn) {
											doSubmit(jobForm,'new.do?type=job');
											jobWindow.close();
											store.load();
										}
									}, {
										text : '重置',
										handler : function() {
											jobForm.getForm().reset();
										}
									}]
						});
				jobWindow.show();
			}
		}, {
			text : '删除',
			handler : function() {
				// TODO
			}
		}, {
			text : '修改',
			handler : function() {
				// TODO
				Ext.Msg.alert('提示', '点击表格字段进行修改');
				jobGrid.startEditing();
			}
		}, {
			text : '保存',
			handler : function() {

			}
		}]
	});

	// 提交表单函数
	function doSubmit(formName, path) {
		if (formName.form.isValid()) {
			formName.form.submit({
						url : path,
						method : 'POST',
						waitText : '正在处理你的请求...',
						success : function(form, action) {
							try {
								var flag = action.result.success;
								if (flag === false)
									Ext.Msg.alert('提示', action.result.message);
								else if (flag === true)
									Ext.Msg.alert('提示', action.result.message);
							} catch (e) {
								e.toString();
							}
						},
						failure : function(form, action) {
							try {
								Ext.MessageBox.alert('提示',
										action.result.message);
							} catch (e) {
								e.toString();
							}
						}
					});
		}
	}
});
// 获得表单的每个字段
function getFields(fPanel) {
	var textArray = fPanel.findByType('textfield');
	var comboArray = fPanel.findByType('combo');
	var comboTreeArray = fPanel.findByType('combotree');
	var areaArray = fPanel.findByType('textarea');
	var fieldsArray = new Array();
	fieldsArray = textArray.concat(comboArray, comboTreeArray, areaArray);
	return fieldsArray;
}