|
@@ -261,6 +261,60 @@ const postDataWithFile = function (url, formData, successCallback, errorCallBack
|
|
|
});
|
|
|
};
|
|
|
|
|
|
+const postDataWithFileProgress = function (url, formData, successCallback, errorCallBack) {
|
|
|
+ showUploadFileProgress();
|
|
|
+ $.ajax({
|
|
|
+ type:"POST",
|
|
|
+ url: url,
|
|
|
+ data: formData,
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ // 告诉jQuery不要去设置Content-Type请求头
|
|
|
+ contentType: false,
|
|
|
+ // 告诉jQuery不要去处理发送的数据
|
|
|
+ processData: false,
|
|
|
+ beforeSend: function(xhr) {
|
|
|
+ let csrfToken = Cookies.get('csrfToken');
|
|
|
+ xhr.setRequestHeader('x-csrf-token', csrfToken);
|
|
|
+ },
|
|
|
+ success: function(result){
|
|
|
+ doneProgress();
|
|
|
+ if (result.err === 0) {
|
|
|
+ if (successCallback) {
|
|
|
+ successCallback(result.data);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ toastr.error('error: ' + result.msg);
|
|
|
+ if (errorCallBack) {
|
|
|
+ errorCallBack();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ closeProgress();
|
|
|
+ },
|
|
|
+ error: function(jqXHR, textStatus, errorThrown){
|
|
|
+ toastr.error('error: ' + textStatus + " " + errorThrown);
|
|
|
+ if (errorCallBack) {
|
|
|
+ errorCallBack();
|
|
|
+ }
|
|
|
+ closeProgress();
|
|
|
+ },
|
|
|
+ xhr: function() {
|
|
|
+ var xhr = new XMLHttpRequest();
|
|
|
+ //使用XMLHttpRequest.upload监听上传过程,注册progress事件,打印回调函数中的event事件
|
|
|
+ xhr.upload.addEventListener('progress', function (e) {
|
|
|
+ console.log(e);
|
|
|
+ //loaded代表上传了多少
|
|
|
+ //total代表总数为多少
|
|
|
+ var progressRate = (e.loaded / e.total) * 95;
|
|
|
+ //通过设置进度条的宽度达到效果
|
|
|
+ setUploadFileProgress(progressRate);
|
|
|
+ })
|
|
|
+
|
|
|
+ return xhr;
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
/**
|
|
|
* 获取url中参数
|
|
|
* @param variable
|
|
@@ -477,6 +531,43 @@ function closeProgress() {
|
|
|
}, 500);
|
|
|
}
|
|
|
|
|
|
+function showUploadFileProgress() {
|
|
|
+ var sWidth, sHeight;
|
|
|
+ sWidth = document.body.clientWidth;
|
|
|
+ sHeight = document.body.clientHeight;
|
|
|
+ //背景遮罩层div
|
|
|
+ var bgObj = document.createElement("div");
|
|
|
+ bgObj.setAttribute('id', 'bgDiv');
|
|
|
+ bgObj.style.zIndex = '9998';
|
|
|
+ bgObj.style.position = "absolute";
|
|
|
+ bgObj.style.top = "0px";
|
|
|
+ bgObj.style.background = "#888";
|
|
|
+ bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
|
|
|
+ bgObj.style.opacity = "0.6";
|
|
|
+ bgObj.style.left = "0px";
|
|
|
+ bgObj.style.width = sWidth + "px";
|
|
|
+ bgObj.style.height = sHeight + "px";
|
|
|
+ document.body.appendChild(bgObj);
|
|
|
+
|
|
|
+ //信息提示层div
|
|
|
+ var msgObj = document.createElement("div");
|
|
|
+ msgObj.classList.add('progress');
|
|
|
+ msgObj.style.zIndex = '9999';
|
|
|
+ msgObj.style.position = "absolute";
|
|
|
+ msgObj.setAttribute("id", "progressDiv");
|
|
|
+ msgObj.style.height = "2px";
|
|
|
+ msgObj.style.width = "600px";
|
|
|
+ msgObj.style.top = (document.documentElement.scrollTop + sHeight / 2) + "px";
|
|
|
+ msgObj.style.left = (sWidth - 600) / 2 + "px";
|
|
|
+ document.body.appendChild(msgObj);
|
|
|
+ msgObj.innerHTML = '<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>';
|
|
|
+}
|
|
|
+function setUploadFileProgress(pos) {
|
|
|
+ const processObj = $('.progress-bar');
|
|
|
+ processObj.attr('aria-valuenow', pos);
|
|
|
+ processObj.width(pos + '%');
|
|
|
+}
|
|
|
+
|
|
|
/**
|
|
|
* 设置本地缓存
|
|
|
*
|