YtIoT/WebRoot/opt/inspectors/scripts/inspectors.js

/**
 * inspectors.js 
 * 巡检人管理界面
 * emial: yaoqiang@chinausky.com
 * create: 2018-12-08
 */

Ext.Loader.setConfig({
	enabled: true
});

Ext.Loader.setPath('Ext.ux', '../../res/extjs/examples/ux');

Ext.require([
	'Ext.grid.*',
	'Ext.data.*',
	'Ext.ux.RowExpander',
	'Ext.selection.CheckboxModel'
]);

var sm = Ext.create('Ext.selection.CheckboxModel');

Ext.define('Inspectors', {
	extend: 'Ext.data.Model',
	fields: [
		{ name: 'id', type: 'string' },
		{ name: 'name', type: 'string' },
		{ name: 'phone', type: 'string' },
		{ name: 'Job_duties', type: 'string' },
		{ name: 'company_code', type: 'string' },
	]
});

Ext.onReady(function () {
	var baseUrl = document.getElementById('basePath').value;
	var theme = document.getElementById('theme').value;
	var chkIcon = '<img src="' + baseUrl + 'res/img/common/check.gif"/>'
	var unchkIcon = '<img src="' + baseUrl + 'res/img/common/uncheck.gif"/>'
	var countPerPage = 20;
	var maxHeight = 10000;

	var chkBoolean = function (flag) {
		if (flag)
			return chkIcon;
		return unchkIcon;
	}


	var clear_append_form = function () {
		Ext.getCmp('fa_name').setValue("");
		Ext.getCmp('fa_phone').setValue("");
		Ext.getCmp('fa_Job_duties').setValue("");
		Ext.getCmp('fa_company_code').setValue("");
		Ext.getCmp('InspectorsListPanel').getStore().reload();
	}

	var myStore = Ext.create('Ext.data.Store', {
		model: 'Inspectors',
		pageSize: countPerPage,
		proxy: {
			type: 'ajax',
			url: baseUrl + 'iot/inspectors/getList',
			reader: {
				type: 'json',
				root: 'RESULT',
				totalProperty: 'totalCount'
			}
		},
		remoteSort: true
	});

	function public_phone(e) {
		if (!(/^1(?:3\d|4[4-9]|5[0-35-9]|6[67]|7[013-8]|8\d|9\d)\d{8}$/.test(e))) {
			Ext.Msg.alert('提示', '不是完整的11位手机号或者正确的手机号前七位!', function (btn, txt) {
				Ext.getCmp('fa_phone').setValue('');
				Ext.getCmp('ff_phone').setValue('');
			});
			return false;
		}
	}

	var AppendForm = Ext.create('Ext.form.Panel', {
		id: 'InspectorsAppendForm',
		labelWidth: 55,
		url: baseUrl + 'iot/inspectors/append',
		defaultType: 'textfield',
		bodyPadding: 15,
		items: [{
			fieldLabel: '姓名',
			id: 'fa_name',
			name: 'name',
			maxLength: 20,
			maxLengthText: '长度不得超出{0}',
			anchor: '75%',
			listeners: {
				change: function (o, e) {
					if (e.length > 10) {
						Ext.Msg.alert('提示', '姓名长度不可超过10个字!', function (btn, txt) {
							Ext.getCmp('fa_name').setValue('');
						});
						return false;
					}
				}
			}
		}, {
			fieldLabel: '手机号',
			id: 'fa_phone',
			name: 'phone',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%',
			listeners: {
				change: function (o, e) {
					if (e.length == 11) {
						public_phone(e);
					} else {
						Ext.getCmp('fa_phone').setValue(e.substring(0, 11));
						e.length == 11 ? public_phone(e) : ''
					}
				}
			}
		}, {
			fieldLabel: '职务',
			id: 'fa_Job_duties',
			name: 'Job_duties',
			maxLength: 30,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%'
		}, {
			fieldLabel: '单位编号',
			id: 'fa_company_code',
			name: 'company_code',
			maxLength: 30,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%'
		}, {
			id: 'fa_queryJson',
			name: 'queryJson',
			hidden: true
		}],
		buttons: [{
			text: '提交',
			iconCls: 'ok_btn',
			handler: function () {
				var form = this.up('form').getForm();
				if (form.isValid()) {
					var query = new Object();
					query.name = Ext.getCmp('fa_name').getValue();
					query.phone = Ext.getCmp('fa_phone').getValue();
					query.Job_duties = Ext.getCmp('fa_Job_duties').getValue();
					query.company_code = Ext.getCmp('fa_company_code').getValue();
					var jsonstr = Ext.JSON.encode(query);
					Ext.getCmp('fa_queryJson').setValue(jsonstr);
					form.submit({
						method: 'post',
						success: function (form, action) {
							Ext.Msg.alert('操作成功', '已保存', function (btn, txt) {
								clear_append_form();
							});
						},
						failure: function (form, action) {
							Ext.Msg.alert('操作失败', action.Msg, function (btn, txt) {
								clear_append_form();
							});
						}
					});
				}
			}
		}, {
			text: '关闭',
			iconCls: 'cancel_btn',
			handler: function () {
				this.up('window').hide();
			}
		}]
	});

	var appendwin = function () {
		Ext.create('Ext.window.Window', {
			title: '新增',
			height: 350,
			width: 400,
			layout: 'fit',
			items: AppendForm,
			closeAction: 'hide'
		}).show();
	}

	//筛选
	var clear_filter_form = function () {
		Ext.getCmp('ff_name').setValue("");
		Ext.getCmp('ff_phone').setValue("");
		Ext.getCmp('ff_Job_duties').setValue("");
		Ext.getCmp('ff_company_code').setValue("");
	}

	var FilterWin = Ext.create('Ext.form.Panel', {
		id: 'InspectorsFilterForm',
		labelWidth: 55,
		defaultType: 'textfield',
		bodyPadding: 15,
		items: [{
			fieldLabel: '姓名',
			id: 'ff_name',
			name: 'name',
			maxLength: 20,
			maxLengthText: '长度不得超出{0}',
			value: document.getElementById('name').value,
			anchor: '75%',
			listeners: {
				change: function (o, e) {
					if (e.length > 10) {
						Ext.Msg.alert('提示', '姓名长度不可超过10个字!', function (btn, txt) {
							Ext.getCmp('ff_name').setValue('');
						});
						return false;
					}
				}
			}
		}, {
			fieldLabel: '手机号',
			id: 'ff_phone',
			name: 'phone',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			value: document.getElementById('phone').value,
			editable: false,
			listeners: {
				change: function (o, e) {
					if (e.length == 11) {
						public_phone(e);
					} else {
						Ext.getCmp('ff_phone').setValue(e.substring(0, 11));
						e.length == 11 ? public_phone(e) : ''
					}
				}
			}
		}, {
			fieldLabel: '职务',
			id: 'ff_Job_duties',
			name: 'Job_duties',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			value: document.getElementById('Job_duties').value,
			anchor: '95%'
		}, {
			fieldLabel: '单位编号',
			id: 'ff_company_code',
			name: 'company_code',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			value: document.getElementById('company_code').value,
			anchor: '95%'
		}, {
			id: 'ff_queryJson',
			name: 'queryJson',
			hidden: true
		}],
		buttons: [{
			text: '提交',
			iconCls: 'ok_btn',
			handler: function () {
				var form = this.up('form').getForm();
				if (form.isValid()) {
					var query = new Object();
					if (Ext.getCmp('ff_name').getValue().length > 0)
						query.name = Ext.getCmp('ff_name').getValue();
					if (Ext.getCmp('ff_phone').getValue().length > 0)
						query.phone = Ext.getCmp('ff_phone').getValue();
					if (Ext.getCmp('ff_Job_duties').getValue().length > 0)
						query.Job_duties = Ext.getCmp('ff_Job_duties').getValue();
					if (Ext.getCmp('ff_company_code').getValue().length > 0)
						query.company_code = Ext.getCmp('ff_company_code').getValue();

					var jsonstr = Ext.JSON.encode(query);
					myStore.getProxy().extraParams = {
						queryJson: jsonstr
					};
					Ext.getCmp('InspectorsListPageToolbar').moveFirst();
					Ext.getCmp('name').setValue(query.name);
					Ext.getCmp('phone').setValue(query.phone);
					Ext.getCmp('Job_duties').setValue(query.Job_duties);
					Ext.getCmp('company_code').setValue(query.company_code);
					//		        	myStore.reload();
					clear_filter_form();
					this.up('window').hide();
				}
			}
		}, {
			text: '关闭',
			iconCls: 'cancel_btn',
			handler: function () {
				this.up('window').hide();
			}
		}]
	});




	var filterwin = function () {
		Ext.create('Ext.window.Window', {
			title: '筛选',
			height: 300,
			width: 350,
			layout: 'fit',
			items: FilterWin,
			closeAction: 'hide'
		}).show();
	}

	var clear_modify_form = function () {
		Ext.getCmp('fm_id').setValue("");
		Ext.getCmp('fm_name').setValue("");
		Ext.getCmp('fm_phone').setValue("");
		Ext.getCmp('fm_Job_duties').setValue("");
		Ext.getCmp('fm_company_code').setValue("");
		Ext.getCmp('InspectorsListPanel').getStore().reload();
	}



	var ModifyForm = Ext.create('Ext.form.Panel', {
		id: 'InspectorsEditForm',
		labelWidth: 55,
		url: baseUrl + 'iot/inspectors/update',
		defaultType: 'textfield',
		bodyPadding: 15,
		items: [{
			fieldLabel: '姓名',
			id: 'fm_name',
			name: 'name',
			maxLength: 20,
			maxLengthText: '长度不得超出{0}',
			anchor: '75%'
		}, {
			fieldLabel: '手机号',
			id: 'fm_phone',
			name: 'phone',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%'
		}, {
			fieldLabel: '职务',
			id: 'fm_Job_duties',
			name: 'Job_duties',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%'
		}, {
			fieldLabel: '单位编号',
			id: 'fm_company_code',
			name: 'company_code',
			maxLength: 250,
			maxLengthText: '长度不得超出{0}',
			anchor: '95%'
		}, {
			id: 'fm_id',
			name: 'id',
			hidden: true
		}, {
			id: 'fm_queryJson',
			name: 'queryJson',
			hidden: true
		}],
		buttons: [{
			text: '修改',
			iconCls: 'ok_btn',
			handler: function () {
				var form = this.up('form').getForm();
				if (form.isValid()) {
					var query = new Object();
					query.id = Ext.getCmp('fm_id').getValue();
					query.name = Ext.getCmp('fm_name').getValue();
					query.phone = Ext.getCmp('fm_phone').getValue();
					query.Job_duties = Ext.getCmp('fm_Job_duties').getValue();
					query.company_code = Ext.getCmp('fm_company_code').getValue();
					var jsonstr = Ext.JSON.encode(query);
					Ext.getCmp('fm_queryJson').setValue(jsonstr);
					form.submit({
						method: 'post',
						success: function (form, action) {
							Ext.Msg.alert('操作成功', '已修改', function (btn, txt) {
								clear_modify_form();
							});
						},
						failure: function (form, action) {
							Ext.Msg.alert('操作失败', action.Msg, function (btn, txt) {
								clear_modify_form();
							});
						}
					});
					this.up('window').hide();
				}
			}
		}, {
			text: '关闭',
			iconCls: 'cancel_btn',
			handler: function () {
				this.up('window').hide();
			}
		}]
	});

	var modifywin = function () {
		Ext.create('Ext.window.Window', {
			title: '修改',
			height: 350,
			width: 400,
			layout: 'fit',
			items: ModifyForm,
			closeAction: 'hide'
		}).show();
	}

	var chk_sm = function () {
		if (sm.getCount() == 1) {
			modifywin();
			var selected = sm.getSelection();
			Ext.getCmp('fm_id').setValue(selected[0].raw.id);
			Ext.getCmp('fm_name').setValue(selected[0].raw.name);
			Ext.getCmp('fm_phone').setValue(selected[0].raw.phone);
			Ext.getCmp('fm_Job_duties').setValue(selected[0].raw.Job_duties);
			Ext.getCmp('fm_company_code').setValue(selected[0].raw.company_code);
		} else {
			Ext.Msg.alert('请先选择', '请先选择一条记录，再点击修改');
		}
	}

	//	
	//	var deletewin = function() {
	//		window.alert("无此功能");
	//		
	//	}

	Ext.create('Ext.grid.Panel', {
		title: '巡检人管理',
		id: 'InspectorsListPanel',
		store: myStore,
		selModel: sm,
		columns: [
			//{ header: 'ID',  dataIndex: 'UQ_POINT_ID',hidden:true, menuDisabled:true },
			{ header: 'ID', dataIndex: 'id', width: 40, menuDisabled: true },
			{ header: '姓名', dataIndex: 'name', width: 120, align: 'center', menuDisabled: true },
			{ header: '手机号', dataIndex: 'phone', width: 160, align: 'center', menuDisabled: true },
			{ header: '职务', dataIndex: 'Job_duties', width: 120, align: 'center', menuDisabled: true },
			{ header: '单位编号', dataIndex: 'company_code', width: 120, align: 'center', menuDisabled: true },
			//		     { header: '记录版本', dataIndex: 'I_VERSION', width:120, align:'center', menuDisabled:true },
			//		     { 
			//	        	xtype : 'actioncolumn',
			//	        	width:20,
			//	        	sortable:false,
			//	        	
			//	        	
			//	        	//这里
			//	        	align:'center',
			//	        	menuDisabled:true,
			//	        	items:[{
			//	        		icon: '../../res/img/common/forum.gif',
			//	        		tooltip: '版本记录',
			//	        		handler: function(grid, rowIndex, colIndex) {
			//	                    var rec = grid.getStore().getAt(rowIndex);
			//	        			window.location = 'version.jsp?theme='+theme+'&pointId='+rec.get('UQ_POINT_ID');
			//	                }
			//	        	}]
			//    		}
		],
		columnLines: true,
		tbar: [
			{
				xtype: 'button',
				iconCls: 'filter_btn',
				text: '筛选',
				listeners: {
					click: filterwin
				}
			}, '-',
			{ xtype: 'tbfill' }, '-',
			{
				xtype: 'button',
				iconCls: 'append_btn',
				text: '新增',
				listeners: {
					click: appendwin
				}
			},
			{
				xtype: 'button',
				iconCls: 'modify_btn',
				text: '修改',
				listeners: {
					click: chk_sm
				}
			},
			//			{ 
			//				xtype: 'button',
			//				iconCls:'delete_btn',
			//				text: '注销',
			//				listeners: {
			//					click: deletewin
			//				}
			//			}
			//			,{ 
			//				xtype: 'button',
			//				iconCls:'delete_btn',
			//				text: '导出',
			//				listeners: {
			//					click: export_sj
			//				}
			//			}

		],
		height: maxHeight,
		width: '100%',
		bbar: new Ext.PagingToolbar({
			store: myStore,
			id: 'InspectorsListPageToolbar',
			displayInfo: true,
			pageSize: countPerPage,
			prependButtons: true,
			displayMsg: '显示第 {0}条到 {1}条记录，总共 {2}条',
			emptyMsg: "没有记录",
			firstText: '第一页',
			prevText: '前一页',
			nextText: '后一页',
			lastText: '最后一页',
			refreshText: '刷新',
			//            doRefresh:function(start){  
			//            	alert(start);
			//                relushDataFunction(start); // 调用函数刷新数据  
			//                this.cursor = start; // 更新页签  
			//            }

		}),
		frame: true,
		border: false,
		iconCls: 'icon-grid',
		renderTo: Ext.getBody()
	});
	myStore.reload();
	maxHeight = document.documentElement.clientHeight;
	Ext.getCmp('InspectorsListPanel').setHeight(maxHeight);

});