feat(tpl): show upload error on server error

Author: marjune163

src/tpl/frontend/index.js

@@ -824,10 +824,16 @@
 				if (elFailedMessage) {
 					elFailedMessage.textContent = " - " + e.type;
 				}
+				batches.length = 0;
 			}
 
 			function onLoad() {
-				!uploading && location.reload();
+				var status = this.status;
+				if (status >= 200 && status <= 299) {
+					!uploading && location.reload();
+				} else {
+					onFail({type: this.statusText || this.status});
+				}
 			}
 
 			function onProgress(e) {
@@ -846,6 +852,7 @@
 					batches.push(files);
 				} else {
 					uploading = true;
+					removeClass(elUploadStatus, classFailed);
 					addClass(elUploadStatus, classUploading);
 					uploadBatch(files);
 				}
@@ -871,13 +878,13 @@
 				});
 
 				var xhr = new XMLHttpRequest();
-				xhr.upload.addEventListener('error', onComplete);
-				xhr.upload.addEventListener('error', onFail);
-				xhr.upload.addEventListener('abort', onComplete);
-				xhr.upload.addEventListener('abort', onFail);
-				xhr.upload.addEventListener('load', onComplete);
-				xhr.upload.addEventListener('load', onSuccess);
-				xhr.upload.addEventListener('load', onLoad);
+				xhr.addEventListener('error', onComplete);
+				xhr.addEventListener('error', onFail);
+				xhr.addEventListener('abort', onComplete);
+				xhr.addEventListener('abort', onFail);
+				xhr.addEventListener('load', onComplete);
+				xhr.addEventListener('load', onSuccess);
+				xhr.addEventListener('load', onLoad);
 				if (elProgress) {
 					xhr.upload.addEventListener('progress', onProgress);
 				}