springmvc +Extjs+swfUpload上传文件

2 篇文章 0 订阅

首先是java类.的方法

====================================================================================================

public void uploadFiles(HttpServletRequest req,HttpServletResponse res){
   //接收参数 
        String path1 = req.getRequestURI()+"/upload";
        System.out.println("____________req.getRequestURI():"+path1); 
        String path2 = req.getSession().getServletContext().getRealPath("/"); 
        System.out.println("_________path2:"+path2); 
        List<FileEntity> fileList; 
        fileList = (List)req.getAttribute("fileList"); 
        if(fileList==null){
         fileList = new ArrayList<FileEntity>(); 
        }  
      //接收上传文件 
        String uploadSign = req.getParameter("upload"); 
        String rootPath = req.getParameter("rootPath"); 
        String path = req.getParameter("path"); 
        if(rootPath == null){
         rootPath = ""; 
        }
        rootPath = rootPath.trim(); 
        if(rootPath.equals("")){ 
              rootPath = path2+"/upload"; 
        } 
        if(path == null) { 
             path = rootPath; 
        }else{ 
            path = new String(Base64.decodeBase64(path.getBytes())); 
        } 
        System.out.println(path+"...path.getBytes():"+path.getBytes()); 
        uploadSign = "1"; 
        //上传操作 
        if(null != uploadSign && !"".equals(uploadSign)){ 
         FileItemFactory factory = new DiskFileItemFactory(); 
         ServletFileUpload upload = new ServletFileUpload(factory); 
         try{ 
          List items = upload.parseRequest(req); 
          if(null != items){ 
           Iterator itr = items.iterator(); 
           int i = 0; 
           while(itr.hasNext()){ 
            FileItem item = (FileItem)itr.next(); 
            FileEntity file = new FileEntity();//_____________________ 
            if(item.isFormField()){ 
             continue; 
            }else{ 
             //自由修改处三:可修改上传后的文件命名方式 
             SimpleDateFormat sdf=new SimpleDateFormat("yyyyMMddkkmmss");//以当前精确到秒的日期为上传的文件的文件名 
             SimpleDateFormat sdd=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); 
             String[] type1=item.getName().split("\\.");
             String type=null;
             if(type1.length==1){
              type=type1[1];
             }else{
              type=type1[type1.length-1];
             }
             System.out.println("——————————————————文件名称:"+item.getName()); 
             System.out.println("从GBK转到UTF-8输出:"+new String(item.getName().getBytes("GBK"),"UTF-8")); 
             File savedFile = new File(path,sdf.format(new Date())+"."+type); 
             //把文件放到列表中,在前台显示 
             System.out.println("__________________服务器上对应的文件名称:"+sdf.format(new Date())+"."+type); 
             System.out.println("__________________完整路径:"+path1+"/"+sdf.format(new Date())+"."+type); 
             file.setId(sdf.format(new Date())); 
             file.setDate(sdd.format(new Date())); 
             file.setFilename(item.getName()); 
             file.setFilepath(path1+"/"+sdf.format(new Date())+"."+type);
                            file.setFilesize(item.getSize()+""); 
                            file.setFiletype(type); 
                            file.setMark("0"); 
                            fileList.add(file); 
                            item.write(savedFile); 
            } 
           } 
          } 
          CtrlUtils.writeStr5Res("true", res);
         }catch(Exception e){ 
          e.printStackTrace(); 
         } 
        } 
 }

 

 

Extjs代码

====================================================================================================

function func_swfupload(centerTab, obj) {
 var keel={};

keel.UploadPanel = function(cfg){
 this.width = 510;
 this.height = 200;
 Ext.apply(this,cfg); 
 this.gp = new Ext.grid.GridPanel({
  border :false,
  store: new Ext.data.Store({
   fields:['id','name','type','size','state','percent']
  }),
     columns: [
      new Ext.grid.RowNumberer(),
         {header: '文件名', width: 100, sortable: true,dataIndex: 'name', menuDisabled:true},
         {header: '类型', width: 70, sortable: true,dataIndex: 'type', menuDisabled:true},
         {header: '大小', width: 100, sortable: true,dataIndex: 'size', menuDisabled:true,renderer:this.formatFileSize},
         {header: '进度', width: 150, sortable: true,dataIndex: 'percent', menuDisabled:true,renderer:this.formatProgressBar,scope:this},
         {header: '状态', width: 70, sortable: true,dataIndex: 'state', menuDisabled:true,renderer:this.formatFileState,scope:this},
         {header: '&nbsp;',width:40,dataIndex:'id', menuDisabled:true,renderer:this.formatDelBtn}      
     ]   
 });
 this.setting = {
  upload_url : this.uploadUrl,
  flash_url : this.flashUrl,
  file_size_limit : this.fileSize || (1024*50) ,//上传文件体积上限,单位MB
  file_post_name : this.filePostName,
  file_types : this.fileTypes||"*.*",  //允许上传的文件类型
        file_types_description : "All Files",  //文件类型描述
        file_upload_limit : "0",  //限定用户一次性最多上传多少个文件,在上传过程中,该数字会累加,如果设置为“0”,则表示没有限制
        //file_queue_limit : "10",//上传队列数量限制,该项通常不需设置,会根据file_upload_limit自动赋值             
  post_params : this.postParams||{savePath:'upload\\'},
  use_query_string : true,
  debug : false,
  button_cursor : SWFUpload.CURSOR.HAND,
  button_window_mode : SWFUpload.WINDOW_MODE.TRANSPARENT,
  custom_settings : {//自定义参数
   scope_handler : this
  },
  file_queued_handler : this.onFileQueued,
  swfupload_loaded_handler : function(){},// 当Flash控件成功加载后触发的事件处理函数
  file_dialog_start_handler : function(){},// 当文件选取对话框弹出前出发的事件处理函数
  file_dialog_complete_handler : this.onDiaogComplete,//当文件选取对话框关闭后触发的事件处理
  upload_start_handler : this.onUploadStart,// 开始上传文件前触发的事件处理函数
  upload_success_handler : this.onUploadSuccess,// 文件上传成功后触发的事件处理函数
  swfupload_loaded_handler : function(){},// 当Flash控件成功加载后触发的事件处理函数 
  upload_progress_handler : this.uploadProgress,
  upload_complete_handler : this.onUploadComplete,
  upload_error_handler : this.onUploadError,
  file_queue_error_handler : this.onFileError
 };
 keel.UploadPanel.superclass.constructor.call(this,{    
  tbar : [
   {text:'添加文件',iconCls:'border_actioncolumn_add',ref:'../addBtn'},'-',
   {text:'上传',ref:'../uploadBtn',iconCls:'border_actioncolumn_upload',handler:this.startUpload,scope:this},'-',
   {text:'停止上传',ref:'../stopBtn',iconCls:'border_actioncolumn_stop',handler:this.stopUpload,scope:this,disabled:true},'-',
   {text:'删除所有',ref:'../deleteBtn',iconCls:'border_actioncolumn_clear',handler:this.deleteAll,scope:this},'-'
  ],
  layout : 'fit',
  items : [this.gp],
  listeners : {
   'afterrender':function(){
    var em = this.getTopToolbar().get(0).el.child('em');
    var placeHolderId = Ext.id();
    em.setStyle({
     position : 'relative',
     display : 'block'
    });
    em.createChild({
     tag : 'div',
     id : placeHolderId
    });
    this.swfupload = new SWFUpload(Ext.apply(this.setting,{
     button_width : em.getWidth(),
     button_height : em.getHeight(),
     button_placeholder_id :placeHolderId
    }));
    this.swfupload.uploadStopped = false;
    Ext.get(this.swfupload.movieName).setStyle({
     position : 'absolute',
     top : 0,
     left : -2
    });    
   },
   scope : this,
   delay : 100
  }
 });
}
Ext.extend(keel.UploadPanel,Ext.Panel,{
 toggleBtn :function(bl){
  this.addBtn.setDisabled(bl);
  this.uploadBtn.setDisabled(bl);
  this.deleteBtn.setDisabled(bl);
  this.stopBtn.setDisabled(!bl);
  this.gp.getColumnModel().setHidden(6,bl);
 },
  onUploadStart : function(file) { 
    var post_params = this.settings.post_params; 
    Ext.apply(post_params,{//处理中文参数问题
      //fileName : file.name,
         fileName : encodeURIComponent(file.name)
    }); 
    this.setPostParams(post_params); 
 },
 startUpload : function() {
  if (this.swfupload) {
   if (this.swfupload.getStats().files_queued > 0) {
    this.swfupload.uploadStopped = false;
    this.toggleBtn(true);
    this.swfupload.startUpload();
   }
  }
 },
 formatFileSize : function(_v, celmeta, record) {
  return Ext.util.Format.fileSize(_v);
 },
 formatFileState : function(n){//文件状态
  switch(n){
   case -1 : return '未上传';
   break;
   case -2 : return '正在上传';
   break;
   case -3 : return '<div style="color:red;">上传失败</div>';
   break;
   case -4 : return '上传成功';
   break;
   case -5 : return '取消上传';
   break;
   default: return n;
  }
 },
 formatProgressBar : function(v){
  var progressBarTmp = this.getTplStr(v);
  return progressBarTmp;
 },
 getTplStr : function(v){
  var bgColor = "orange";
     var borderColor = "#008000";
  return String.format(
   '<div>'+
    '<div style="border:1px solid {0};height:10px;width:{1}px;margin:4px 0px 1px 0px;float:left;">'+  
     '<div style="float:left;background:{2};width:{3}%;height:10px;"><div></div></div>'+
    '</div>'+
   '<div style="text-align:center;float:right;width:40px;margin:3px 0px 1px 0px;height:10px;font-size:12px;">{3}%</div>'+   
  '</div>', borderColor,(90),bgColor, v);
 },
 onUploadComplete : function(file) {
  if (this.getStats().files_queued > 0 && this.uploadStopped == false) {
   this.startUpload();
  }else{
   var me = this.customSettings.scope_handler;
   me.toggleBtn(false);
   me.linkBtnEvent();
  }  
 },
 onFileQueued : function(file) {
  var me = this.customSettings.scope_handler;
  var rec = new Ext.data.Record({
   id : file.id,
   name : file.name,
   size : file.size,
   type : file.type,
   state : file.filestatus,
   percent : 0
  })
  me.gp.getStore().add(rec);
 },
 onUploadSuccess : function(file, serverData) {
  var me = this.customSettings.scope_handler;
  if (serverData=='true') {
   var ds = me.gp.store;
   for(var i=0;i<ds.getCount();i++){
    var record =ds.getAt(i);
    if(record.get('id')==file.id){
     record.set('state', file.filestatus);
     record.commit();
    }
   }   
  }
  me.linkBtnEvent();
 },
 uploadProgress : function(file, bytesComplete, totalBytes){//处理进度条
  var me = this.customSettings.scope_handler;
  var percent = Math.ceil((bytesComplete / totalBytes) * 100);
        var ds = me.gp.store;
  for(var i=0;i<ds.getCount();i++){
   var record =ds.getAt(i);
   if(record.get('id')==file.id){
    record.set('percent', percent);
    record.set('state', file.filestatus);
    record.commit();
   }
  }
 },
 onUploadError : function(file, errorCode, message) {
  var me = this.customSettings.scope_handler;
  me.linkBtnEvent();
  var ds = me.gp.store;
  for(var i=0;i<ds.getCount();i++){
   var rec =ds.getAt(i);
   if(rec.get('id')==file.id){
    rec.set('percent', 0);
    rec.set('state', file.filestatus);
    rec.commit();
   }
  }
 },
 onFileError : function(file,n){
  switch(n){
   case -100 : tip('待上传文件列表数量超限,不能选择!');
   break;
   case -110 : tip('文件太大,不能选择!');
   break;
   case -120 : tip('该文件大小为0,不能选择!');
   break;
   case -130 : tip('该文件类型不可以上传!');
   break;
  }
  function tip(msg){
   Ext.Msg.show({
    title : '提示',
    msg : msg,
    width : 280,
    icon : Ext.Msg.WARNING,
    buttons :Ext.Msg.OK
   });
  }
 },
 onDiaogComplete : function(){
  var me = this.customSettings.scope_handler;
  me.linkBtnEvent();
 },
 stopUpload : function() {
  if (this.swfupload) {
   this.swfupload.uploadStopped = true;
   this.swfupload.stopUpload();
  }
 },
 deleteAll : function(){
  var ds = this.gp.store;
  for(var i=0;i<ds.getCount();i++){
   var record =ds.getAt(i);
   var file_id = record.get('id');
   this.swfupload.cancelUpload(file_id,false);   
  }
  ds.removeAll();
  this.swfupload.uploadStopped = false;
 },
 formatDelBtn : function(v){
  return "<a href='#' id='"+v+"'  style='color:blue' class='link-btn' ext:qtip='移除该文件'>移除</a>";
 },
 linkBtnEvent : function(){
  Ext.select('a.link-btn',false,this.gp.el.dom).on('click',function(o,e){
   var ds = this.gp.store;
   for(var i=0;i<ds.getCount();i++){
    var rec =ds.getAt(i);
    if(rec.get('id')==e.id){
     ds.remove(rec);
    }
   }   
   this.swfupload.cancelUpload(e.id,false);
  },this);
 }
});
Ext.reg('uploadPanel',keel.UploadPanel);


//-------------------------------------------
 var title = obj.text;
 
 var searchPanel = new Ext.Panel({
  layout : 'fit',
  border : false,
  id : 'tab' + obj.id,
  title : title,
  tabTip : title,
  closable : true,
  tbar : [{
     tooltip : '新建',
     text : '新建',
     iconCls : 'border_actioncolumn_add',
     handler : function() {
      new Ext.Window({
       width : 650,
       title : 'swfUpload demo',
       height : 300,
       layout : 'fit',
       items : [
        {
         xtype:'uploadPanel',
         border : false,
         fileSize : 1024*550,//限制文件大小
         uploadUrl : 'uploadFiles.swfUpload',
         flashUrl :  basePath+'/swfupload.swf',
         fileTypes : '*.*'//可上传文件类型
        }
       ]
      }).show();
     }
    }]
 });
 centerTab.add(searchPanel);
 centerTab.activate(Ext.getCmp('tab' + obj.id));
}

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

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值