mes/WebContent/app/view/core/form/PhotoField.js

Ext.define('erp.view.core.form.PhotoField', {
	extend: 'Ext.form.FieldContainer',
    alias: 'widget.photofield',
    layout: 'column',
    labelAlign:'top',
    defaults:{
    	hideLabel: true
    },
    initComponent : function(){
    	this.callParent(arguments);
    	var basefield=this;
    	var me = this;   
    	me.insert(0,{
    	xtype:'form',
    	layout:'column',
    	id:'baseform',
    	bodyStyle: 'background: transparent no-repeat 0 0;border: none;',	
			items: [{
    	    xtype: 'hidden',
    	    value: '',
    	    name :me.name
			},{
			    columnWidth:0.5,
				xtype: 'htmleditor',
				name:'msg',
				 fieldSubTpl: [
        '<textarea id="{cmpId}-textareaEl" name="{name}" tabIndex="-1" class="{textareaCls}" ',
            'style="{size}" autocomplete="off"></textarea>',
        '<iframe id="{cmpId}-iframeEl" name="{iframeName}" frameBorder="0" style="overflow:auto;{size}" src="{iframeSrc}"></iframe>',
        '<div id="{cmpId}-toolbarWrap" class="{toolbarWrapCls}"></div>',
           {
            compiled: true,
            disableFormats: true
            }
             ],
				createToolbar : function(editor){
				 var me = this,
                items = [],
               
              tipsEnabled = Ext.tip.QuickTipManager && Ext.tip.QuickTipManager.isEnabled(),
               baseCSSPrefix = Ext.baseCSSPrefix,
               fontSelectItem, toolbar, undef;
				toolbar = Ext.widget('toolbar', {
                renderTo: me.toolbarWrap,
                 dock: 'bottom',
                 enableOverflow: true,
                 items:[{
                  xtype:'button',
                  iconCls:'x-form-search-trigger',
                  handler:function(){
                  var img=Ext.getCmp('baseform').ownerCt.ownerCt.down('htmleditor[name=msg]').getEl().dom.getElementsByTagName('iframe')[0].contentWindow.document.body.getElementsByTagName('img')[0];
                   img.style.width='';
                   img.style.height='';
                   var win = new Ext.window.Window({
	    		   id : 'photowin',
	    		   height: '100%',
	    		   width: '100%',
	    		   title:'放大图片',
	    		   maximizable : true,
	    		   items:[{
	    		   html: img.outerHTML,
	    		   autoScroll:true,
	    		   height:'100%'
	    		   }],
	    		   buttonAlign : 'center',
	    		   layout : 'anchor',
	    		   listeners:{
	    		    close:function(){
	    		      img.style.width='100%';
                      img.style.height='100%';
	    		    }
	    		   
	    		   }	    	    		   
	    		   });
	    		    win.show();
                  } 
                 },{
                 id:'fileform',
                 xtype:'form',
    	        layout:'column',
    	        bodyStyle: 'background: transparent no-repeat 0 0;border: none;',
			  items: [{
				xtype: 'filefield',
				name: 'file',
				buttonOnly: true,
		        hideLabel: true,
		        width: 90,
		        height: 17,
				buttonConfig: {
					iconCls: 'x-button-icon-pic',
					text: '设置图像',
					id:'photobutton'
		        },
		        listeners: {
					change: function(field){
						field.ownerCt.getForm().submit({
		            		url: basePath + 'common/uploadPic.action?em_code=' + em_code,
		            		waitMsg: "正在解析图片信息",
		            		success: function(fp, o){
		            			if(o.result.error){
		            				showError(o.result.error);
		            			} else {
		            				var msg = Ext.getCmp('baseform').ownerCt.ownerCt.down('htmleditor[name=msg]');
		            				var imgel=msg.getEl().dom.getElementsByTagName('iframe')[0].contentWindow.document.body;
		            				if(imgel.getElementsByTagName('img').length>0){
		            				  imgel.removeChild(imgel.getElementsByTagName('img')[0]);
		            				}
		            				//Ext.getCmp('baseform').ownerCt.ownerCt.down('hidden').setValue('../../../'+o.result.path);
		            				Ext.getCmp('baseform').ownerCt.ownerCt.down('hidden').setValue(o.result.path);
		            		        var element = document.createElement("img");
		            		        element.src = basePath + 'common/download.action?path=' + o.result.path.replace(/\+/g, '%2B');
		            		        element.style="width:100%;height:100%";            
		            		        element.title = '&img' + o.result.filepath + ";";
		            		        msg.setValue('<img src="'+element.src+'" style=width:100%;height:100%;>');
		            		        Ext.getCmp('photobutton').setText('更改图像');
		            			}
		            		}
		            	});
					}
				}}]
                 }]
                });
                me.toolbar = toolbar;
				},				
				fieldStyle: 'border-bottom: none;',							
			}]
    	});   	
   },
    listeners : {
    	afterrender: function(f){
    		this.getEl().dom.childNodes[1].style.overflow = 'hidden';
			var form = f.ownerCt;
			if(f.value){
			Ext.getCmp('photobutton').setText('更换图片');
			var msg = Ext.getCmp('baseform').ownerCt.ownerCt.down('htmleditor[name=msg]').setValue('<img src="'+basePath+f.value+'" style=width:100%;height:100%;>');			
			}
		},

    }	
    	
});