Ext Js 开发笔记整理

以前写过的一些通用性东西难免会忘,整理起来,不想每次都调试费时间。


1.ExtJs关于时间的处理:

将gridcolumn里的值转换为Date类型 , 然后与现有时间比对获取小时差 , 在转换时频频报NaN . 多方参考资料及API得到解决.

方法参考:
  1.  Ext.onReady(function() {  
  2.         var date = Ext.util.Format.date(new Date(),'Y-m-d');  
  3.         alert('当前年月日 '+date);  
  4.         alert('当前时间 'new Date().toLocaleString());  
  5.         alert('今年是否是闰年 '+new Date().isLeapYear());  
  6.         alert('今天是今年的第 '+new Date().getDayOfYear()+'天');  
  7.         alert('本月共有 '+new Date().getDaysInMonth()+'天');  
  8.     });  
  1. Ext.onReady(function() {  
  2.         var date = Ext.util.Format.date(new Date(),'Y-m-d');  
  3.         alert('当前年月日 '+date);//打印2012-08-21  
  4.         /* 
  5.             除了Date.DAY之外,我们还可以使用Date.HOUR,Date.MILIT, 
  6.             Date.MINUTE,Date.MONTH,Date.SECOND,Date.YEAR 
  7.         */  
  8.         var dt = Ext.util.Format.date(new Date().add(Date.DAY,5),'Y-m-d');  
  9.         alert('增加5天后 '+dt);//打印2012-08-26  
  10.         /* 
  11.             between(Date start,Date end)可以判断日期变量是否在给定范围之内 
  12.             getElapsed([Date date])获取日期变量与指定日期之间相差的毫秒数,它可以用于计算两个时间点之间的间隔 
  13.             在Ext中,我们可以直接使用 
  14.             format('Y-m-d');获取特定格式的日期 
  15.             parse('2008-07-24','Y-m-d');将字符串解析为对应的日期变量 
  16.         */  
  17.           
  18.     });  


API:

  1. parse( String input, String format, [Boolean strict] ) : Date  
  2.   
  3. Parses the passed string using the specified date format. Note that this function expects normal calendar dates, meaning that months are 1-based (i.e. 1 = January). The defaults hash will be used for any date value (i.e. year, month, day, hour, minute, second or millisecond) which cannot be found in the passed string. If a corresponding default date value has not been specified in the defaults hash, the current date's year, month, day or DST-adjusted zero-hour time value will be used instead. Keep in mind that the input date string must precisely match the specified format string in order for the parse operation to be successful (failed parse operations return a null value).  
  4.   
  5. Example:  
  6.   
  7. //dt = Fri May 25 2007 (current date)  
  8. var dt = new Date();  
  9.   
  10. //dt = Thu May 25 2006 (today's month/day in 2006)  
  11. dt = Ext.Date.parse("2006""Y");  
  12.   
  13. //dt = Sun Jan 15 2006 (all date parts specified)  
  14. dt = Ext.Date.parse("2006-01-15""Y-m-d");  
  15.   
  16. //dt = Sun Jan 15 2006 15:20:01  
  17. dt = Ext.Date.parse("2006-01-15 3:20:01 PM""Y-m-d g:i:s A");  
  18.   
  19. // attempt to parse Sun Feb 29 2006 03:20:01 in strict mode  
  20. dt = Ext.Date.parse("2006-02-29 03:20:01""Y-m-d H:i:s"true); // returns null  

add( Date date, String interval, Number value ) : Date

Provides a convenient method for performing basic date arithmetic. This method does not modify the Date instance being called - it creates and returns a new Date instance containing the resulting date value.

Examples:

// Basic usage:
var dt = Ext.Date.add(new Date('10/29/2006'), Ext.Date.DAY, 5);
console.log(dt); //returns 'Fri Nov 03 2006 00:00:00'

// Negative values will be subtracted:
var dt2 = Ext.Date.add(new Date('10/1/2006'), Ext.Date.DAY, -5);
console.log(dt2); //returns 'Tue Sep 26 2006 00:00:00'

完善后的解决方法:

var receiveDate = Ext.Date.format(Ext.Date.add(Ext.Date.parse('2013-07-29 09:10','Y-m-d H:i'),Ext.Date.HOUR,8),'Y-m-d H:i');
var nowDate = Ext.Date.format(new Date(), 'Y-m-d H:i');
alert(receiveDate + '  ' + nowDate);
alert(nowDate > receiveDate);

2.Combo 自动提示 模糊 查询(非extjs前台缓存store)

主要就是SQL的模糊查询,前台combo的动态数据。 

前期由于总想把‘change’事件的监听和 记忆关键字 一起处理导致不同步而不能实现即时记忆查询。其实一分开就很简单了。

 {
	xtype : 'tbtext',
	text : '单号:'
}, {
	xtype : 'combo',
	name : 'singleWorkNum',
	id : 'singleWorkNum',
	displayField: 'singleWorkNum',
	valueField: 'workNum',
	store : Ext.create('app.store.weld.getWorkNum', {
		listeners : {
			'beforeload' : function(store){
				Ext.apply(store.proxy.extraParams, {
					par : Ext.getCmp('singleWorkNum').getValue()
				})
			}
		}
	}),
	listeners : {
		change : function(){
			Ext.getCmp('singleWorkNum').getStore().load();
		}
	}
}
--------------------------------------------------------------------------- 外部ajaxStore
Ext.define('app.store.weld.getWorkNum',{   
	extend : 'Ext.data.Store',
	autoLoad : false,
	remoteStort : true,
	fields : ['singleWorkNum','workNum'],
	proxy : {
		type : 'ajax',
		url : 'weld/weldWeldingManage_getWorkNum.action',
		reader : {
			type : 'json',
			root : 'results',
			messageProperty : 'failedMessage',
			totalProperty : 'totalCount',
			successProperty : 'success'
		}
	}
});

3.Form动态添加

{
	xtype : 'fieldset',
	id : 'detecId',
	layout : 'column',
	border : 1,
	collapsible : false,
	collapsed : false,
	title : '<font style=" font-weight:bolder">探伤信息</font>',
	defaults : {
		style : 'margin-top:2px;marginBottom: 3px',
		height : 25
	},items : [{
				xtype : 'combobox',
				name : 'testingRequirements',
				fieldLabel : '探伤要求',
				labelWidth : 80,
				width : 260,
				displayField: 'detecMethod',
				valueField: 'detecMethod',
				store : Ext.create('app.store.weld.detecMethod',{autoLoad : true})
			},{
				xtype : 'combobox',
				name : 'detectionOpportunity',
				fieldLabel : '探伤时机',
				labelWidth : 80,
				width : 260,
				displayField: 'constantName',
				valueField: 'constantName',
				store : Ext.create('app.store.weld.detecOpportunity',{autoLoad : true})
			},  {
				xtype : 'combobox',
				name : 'detecType',
				fieldLabel : '探伤类型',
				store : [['','  '],
							['最终探伤', '最终探伤'],
							['中间探伤','中间探伤']],
				labelWidth : 80,
				width : 260
			},  {
				xtype : 'hidden',
				name : 'count',
				id : 'count',
				value :'0'
			},{
				xtype : 'button',
				name : 'detecType',
				text : '添加',
				width : 40,
				handler : function(){
						var testFieldSet = Ext.getCmp('detecId');
						var count = me.down('[name=count]');
						var i = parseInt(count.getValue()); 
						testFieldSet.add({items: [{
									xtype : 'combobox',
									name : 'testingRequirements'+i,
									fieldLabel : '探伤要求',
									labelWidth : 80,
									width : 260,
									displayField: 'detecMethod',
									valueField: 'detecMethod',
									store : Ext.create('app.store.weld.detecMethod',{autoLoad : true})
							}]},{items: [{
									xtype : 'combobox',
									name : 'detectionOpportunity'+i,
									fieldLabel : '探伤时机',
									labelWidth : 80,
									width : 260,
									displayField: 'constantName',
									valueField: 'constantName',
									store : Ext.create('app.store.weld.detecOpportunity',{autoLoad : true})
							}]},{items: [{
									xtype : 'combobox',
									name : 'detecType'+i,
									fieldLabel : '探伤类型',
									store : [['','  '],
												['最终探伤', '最终探伤'],
												['中间探伤','中间探伤']],
									labelWidth : 80,
									width : 260
							}]},{items: [{
									xtype : 'button',
									name : 'delete'+i,
									text : '删除',
									onClick : function(){
										i = i-1;
										testFieldSet.down('[name=testingRequirements'+i+']').destroy();
										testFieldSet.down('[name=detectionOpportunity'+i+']').destroy();
										testFieldSet.down('[name=detecType'+i+']').destroy();
										testFieldSet.down('[name=delete'+i+']').destroy();
									}
							}]});
						  testFieldSet.doLayout();
						  i += 1;
						  count.setValue(i);
        		}
			}]
}


4.Grid附件下载

{
		xtype : 'gridcolumn',
		name : 'colWpsId',
		text : 'WPS编码',
		dataIndex : 'wpsCode',
		viewConfig : 'x-grid-record-red',
		renderer : function(val,metaData){
			metaData.style='color:#FF0033;font-weight:bold;font-style:italic';
			return val;
		},
		listeners : { 'click' : function(view, cell, row, col, evt, record){
			var wpsCodeN = record.get('wpsCode');
			var varsionN = record.get('version');
			Ext.MessageBox.confirm('下载确认', '从FTP上下载该WPS文件吗?', function(btn){
			if (btn == 'yes'){
				try {
				  document.getElementById('frm_fileDownload').src ='we8a/gaqp_readFile.action?wpsCodeN='  + wpsCodeN+'&varsionN='+varsionN;
				} catch (e) {
				  Ext.MessageBox.alert(message.error, '下载失败!');
				  return;
				}
			}
		})
		}
		},
		width : 100
	}

后台方法:

/**
	 * @Title: readFile
	 * @Description TODO(读取FTP文件)
	 * @author Travis.tang
	 * @date Dec 4, 2013 20:15:34 PM
	 */
	public void readFile() {
		//wpsCode
		String wpsCode = request.getParameter("wpsCodeN");
		//版本号
		String bomCodeDesc = request.getParameter("varsionN");
		//拼接文件名
		String fileName = wpsCode + "#" + bomCodeDesc + ".pdf";
		//下载到服务器路劲
		String filePath = "/upfiles/weldFile/WPS/";
		String savePath = Constants.FCKEDITOR_UPLOAD_FILE_DIR;
		if(savePath.endsWith("\\upfiles\\")){
			savePath = savePath.substring(0, savePath.lastIndexOf("\\upfiles\\"));
		}
//		String localFile = "D:\\XX系统文件\\WPS";
		
		File file = new File(savePath + filePath);
		if(!file.exists()) {
			file.mkdir();
		}
		try {
			Ftp ftp = new Ftp();
			//FTP根路劲
			String rootPath = ftp.getRootPath();
			//根据wpsCode查找子目录
			String path = ftp.checkPath(wpsCode);
			//拼接FTP路劲
			String ftpFilePath = rootPath + path + "/" + fileName;
			//拼接本地路劲
			filePath += fileName;
			savePath += filePath;
			//连接FTP
			boolean bool = ftp.connectFtp("192.168.0.1", 21, "uisapig", "3qd83qu");
			if(bool) {
				logger.info("连接FTP成功!");
				//下载文件
				boolean flag = ftp.downloadFtpFile(ftpFilePath, savePath);
				if(flag) {
					//执行命令,打开已下载的文件(本地必须有支持PDF打开的程序,否则会报错)
//					Runtime.getRuntime().exec("cmd /c start " + savePath);
					FileUtil.download("3",filePath);
					logger.info("文件下载成功!");
					String delMsg = FileUtil.deleteFile(new File(savePath));
					System.out.println("下载后清除原文件---------->"+delMsg);
				}
			}
		} catch (Exception e) {
			e.printStackTrace();
		}
	}



5.全局色彩显示

Ext.define('app.**lStorehouseList', {
	extend : 'Ext.grid.Panel',
	alias : 'widget.we**list',
	name : 'Weld**List',
	requires : ['Ext.ux.form.DateField'], 
	frame : true,
	plugins: [
		        Ext.create('Ext.grid.plugin.CellEditing', {
		            clicksToEdit: 1
		        })
		    ],
//	sortableColumns : false,
	viewConfig : {
    			stripeRows : false,
				getRowClass : function(record) {
				 	if(record.get('receiveState') == '已接收未退库'){
						return "back-green";
					}
				 	if(record.get('receiveState') == '待接收'){
						return "back-red";
					}
					if(record.get('receiveState') == '已退库'){
						return "back-blue";
					}
				}
    		},
	columns : [{


~~~~~~~~~~~~~·未完待续,整理中~~~~~~~~~~~



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值