个人信息上传图片增加进度条显示

src/main/webapp/WEB-INF/view/system/user/user_view.html

@@ -49,6 +49,11 @@
                                     </div>
                                 </div>
 
+                                <div class="progress progress-striped" id="progressTipArea" style="margin-top: 20px;">
+                                    <div id="progressBar" style="width: 0%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="0" role="progressbar" class="progress-bar progress-bar-warning">
+                                    </div>
+                                </div>
+
                                 <div class="row btn-group-m-t">
                                     <div class="col-sm-10">
                                         <#button btnCss="info" name="提交" id="ensure" icon="fa-check" clickFun="UserInfoDlg.editSubmit()"/>

src/main/webapp/static/js/common/web-upload-object.js

@@ -14,9 +14,10 @@
 		this.uploadBtnId = pictureId + "BtnId";
 		this.uploadPreId = pictureId + "PreId";
 		this.uploadUrl = Feng.ctxPath + '/mgr/upload';
-		this.fileSizeLimit = 10 * 1024 * 1024;
+		this.fileSizeLimit = 100 * 1024 * 1024;
 		this.picWidth = 800;
 		this.picHeight = 800;
+        this.uploadBarId = null;
 	};
 
 	$WebUpload.prototype = {
@@ -42,7 +43,7 @@
 				accept : {
 					title : 'Images',
 					extensions : 'gif,jpg,jpeg,bmp,png',
-					mimeTypes : 'image/*'
+                    mimeTypes : 'image/gif,image/jpg,image/jpeg,image/bmp,image/png'
 				},
 				swf : Feng.ctxPath
 						+ '/static/css/plugins/webuploader/Uploader.swf',
@@ -78,6 +79,7 @@
 
 			// 文件上传过程中创建进度条实时显示。
 			bindedObj.on('uploadProgress', function(file, percentage) {
+                $("#"+me.uploadBarId).css("width",percentage * 100 + "%");
 			});
 
 			// 文件上传成功，给item添加成功class, 用样式标记上传成功。
@@ -109,7 +111,14 @@
 			// 完成上传完了，成功或者失败
 			bindedObj.on('uploadComplete', function(file) {
 			});
-		}
+		},
+
+        /**
+         * 设置图片上传的进度条的id
+         */
+        setUploadBarId: function (id) {
+            this.uploadBarId = id;
+        }
 	};
 
 	window.$WebUpload = $WebUpload;

src/main/webapp/static/modular/system/user/user_info.js

@@ -259,5 +259,8 @@ $(function () {
 
     // 初始化头像上传
     var avatarUp = new $WebUpload("avatar");
+    avatarUp.setUploadBarId("progressBar");
     avatarUp.init();
+
+
 });