Browse Source

fix issue

tags/v1.22.8.1^2
zhoupzh 3 years ago
parent
commit
41d036e38f
4 changed files with 438 additions and 301 deletions
  1. +1
    -0
      templates/repo/cloudbrain/new.tmpl
  2. +10
    -0
      templates/repo/debugjob/index.tmpl
  3. +379
    -261
      web_src/js/components/MinioUploader.vue
  4. +48
    -40
      web_src/js/features/cloudrbanin.js

+ 1
- 0
templates/repo/cloudbrain/new.tmpl View File

@@ -287,6 +287,7 @@
</div>
{{template "base/footer" .}}
<script>
console.log({{index $.QueuesDetail "debugt4"}})
let form = document.getElementById('form_id');
$('#messageInfo').css('display', 'none')
function clearValue() {


+ 10
- 0
templates/repo/debugjob/index.tmpl View File

@@ -502,6 +502,16 @@
</div>
</div>

<div class="ui mini modal debug-again">
<div class="header">{{$.QueuesDetail}}</div>
<div class="content">
<p>1111</p>
</div>
<div class="actions">
<div class="ui mini negative button">Cancel</div>
<div class="ui mini positive button">OK</div>
</div>
</div>
</div>
{{template "base/footer" .}}
<script>


+ 379
- 261
web_src/js/components/MinioUploader.vue View File

@@ -1,81 +1,122 @@
<template>
<div class="dropzone-wrapper dataset-files">
<div id="dataset" class="dropzone">
<div class="maxfilesize ui red message" style="display: none;margin: 2.5rem;"></div>
<div
class="maxfilesize ui red message"
style="display: none; margin: 2.5rem"
></div>
</div>
<el-button style="background-color: #21ba45;margin-top: 2rem;" type="success" :disabled="btnFlag" @click="startUpload">{{upload}}</el-button>
<el-button type="info" @click="cancelDataset">{{cancel}}</el-button>
<div style="margin-top: 2rem;position: relative;">
<label class="el-form-item__label" style="width: 140px;position: absolute;left: -140px;">上传状态:</label>
<div v-for="item in allUploadFiles" style="display:flex;padding: 0.8rem 0;border-bottom: 1px solid #e8e8e8;line-height: 1;" >
<span style="flex:4 1 0%;display: flex;max-width: 80%;"><i :class="[item.status===0?'ri-checkbox-circle-line success':'ri-close-circle-line failed']" style="margin-right: 0.5rem;"></i><span class="nowrap">{{item.name}}</span></span>
<span style="flex:1" v-if="item.status===0"><span style="color: #21ba45;">上传成功</span></span>
<span style="flex:1" v-else-if="item.status===1">
<el-tooltip class="item" effect="dark" placement="top">
<div slot="content">{{item.info}}</div>
<span style="color: red;cursor: pointer;">上传失败<span>(重复上传)</span></span>
<el-button
style="background-color: #21ba45; margin-top: 2rem"
type="success"
:disabled="btnFlag"
@click="startUpload"
>{{ upload }}</el-button
>
<el-button type="info" @click="cancelDataset">{{ cancel }}</el-button>
<div style="margin-top: 2rem; position: relative">
<label
class="el-form-item__label"
style="width: 140px; position: absolute; left: -140px"
>上传状态:</label
>
<div v-for="(item, index) in uploadFiles" class="datast-upload-progress">
<span class="dataset-name nowrap">{{ item.name }}</span>
<div class="dataset-progress">
<el-progress
:text-inside="true"
:stroke-width="14"
:percentage="uploadProgressList[index].progress"
></el-progress>
</div>
<div class="dataset-status nowrap">
<div class="status-flex">
<i
v-if="
uploadProgressList[index].infoCode === 1 ||
uploadProgressList[index].infoCode === 2
"
class="ri-close-circle-line failed"
></i>
<i
v-if="uploadProgressList[index].infoCode === 0"
class="ri-checkbox-circle-line success"
>
</i>
<span>{{ uploadProgressList[index].status }}</span>
<el-tooltip
v-if="uploadProgressList[index].infoCode === 1"
class="item"
effect="dark"
placement="top"
>
<div slot="content">
{{ uploadProgressList[index].failedInfo }}
</div>
<i
style="font-size: 16px; margin-left: 0.5rem; cursor: pointer"
class="ri-question-fill"
></i>
</el-tooltip>
</span>
<span style="flex:1" v-else><span style="color: red;">上传失败</span></span>
</div>
</div>
</div>
</div>
</div>
</template>

<script>
import SparkMD5 from 'spark-md5';
import axios from 'axios';
import qs from 'qs';
import createDropzone from '../features/dropzone.js';
import SparkMD5 from "spark-md5";
import axios from "axios";
import qs from "qs";
import createDropzone from "../features/dropzone.js";

const {_AppSubUrl, _StaticUrlPrefix, csrf} = window.config;
const { _AppSubUrl, _StaticUrlPrefix, csrf } = window.config;
const chunkSize = 1024 * 1024 * 64;
const md5ChunkSize = 1024 * 1024 * 1;

export default {
props:{
uploadtype:{
type:Number,
required:true
props: {
uploadtype: {
type: Number,
required: true,
},
desc: {
type: String,
default: "",
},
desc:{
type:String,
default:''
}
},
data() {
return {
dropzoneUploader: null,
maxFiles: 10,
maxFilesize: 200 ,
acceptedFiles: '*/*',
maxFilesize: 200,
acceptedFiles: "*/*",
progress: 0,
status: '',
status: "",
dropzoneParams: {},
file_status_text: '',
file:{},
repoPath:'',
btnFlag:false,
cancel:'',
upload:'',
uploadFiles:[],
uploadFilesAddId:[],
allUploadFiles:[],
uploadLength:0,
allUploadLength:0,
file_status_text: "",
file: {},
repoPath: "",
btnFlag: false,
cancel: "",
upload: "",
uploadFiles: [],
uploadFilesAddId: [],
// allUploadFiles: [],
uploadLength: 0,
allUploadLength: 0,
uploadProgressList: [],
};
},

async mounted() {
this.dropzoneParams = $('div#minioUploader-params');
this.file_status_text = this.dropzoneParams.data('file-status');
this.status = this.dropzoneParams.data('file-init-status');
this.repoPath = this.dropzoneParams.data('repopath');
this.cancel = this.dropzoneParams.data('cancel');
this.upload = this.dropzoneParams.data('upload');
this.dropzoneParams = $("div#minioUploader-params");
this.file_status_text = this.dropzoneParams.data("file-status");
this.status = this.dropzoneParams.data("file-init-status");
this.repoPath = this.dropzoneParams.data("repopath");
this.cancel = this.dropzoneParams.data("cancel");
this.upload = this.dropzoneParams.data("upload");
let previewTemplate = `
<div class="dz-preview dz-file-preview">
<div class="dz-image">
@@ -86,137 +127,146 @@ export default {
<div class="dz-filename"><span data-dz-name></span></div>
</div>

<div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>
<div style="opacity:0" class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>
<div class="dz-error-message" style="line-height: 1.5;"><span data-dz-errormessage></span></div>
<div class="dz-success-mark"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="54" height="54"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm-.997-4L6.76 11.757l1.414-1.414 2.829 2.829 5.656-5.657 1.415 1.414L11.003 16z" fill="rgba(47,204,113,1)"/></svg></div>
<div class="dz-error-mark"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="54" height="54"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-9.414l2.828-2.829 1.415 1.415L13.414 12l2.829 2.828-1.415 1.415L12 13.414l-2.828 2.829-1.415-1.415L10.586 12 7.757 9.172l1.415-1.415L12 10.586z" fill="rgba(231,76,60,1)"/></svg></div>
</div> `
const $dropzone = $('div#dataset');
</div> `;
const $dropzone = $("div#dataset");
const dropzoneUploader = await createDropzone($dropzone[0], {
url: '/todouploader',
url: "/todouploader",
maxFiles: this.maxFiles,
maxFilesize: 1024*200,
filesizeBase:1024,
maxFilesize: 1024 * 200,
filesizeBase: 1024,
parallelUploads: this.maxFiles,
timeout: 0,
addRemoveLinks:true,
addRemoveLinks: true,
// autoQueue: false,
autoProcessQueue: false, //自动上传
dictDefaultMessage: this.dropzoneParams.data('default-message'),
dictInvalidFileType: this.dropzoneParams.data('invalid-input-type'),
dictFileTooBig: this.dropzoneParams.data('file-too-big'),
dictRemoveFile: this.dropzoneParams.data('remove-file'),
previewTemplate:previewTemplate
dictDefaultMessage: this.dropzoneParams.data("default-message"),
dictInvalidFileType: this.dropzoneParams.data("invalid-input-type"),
dictFileTooBig: this.dropzoneParams.data("file-too-big"),
dictRemoveFile: this.dropzoneParams.data("remove-file"),
previewTemplate: previewTemplate,
});
dropzoneUploader.on('addedfile', (file) => {
if(file.size/(1024*1024)>dropzoneUploader.options.maxFilesize){
dropzoneUploader.removeFile(file)
$('.maxfilesize.ui.red.message').text("单次最多上传10个文件,单个文件不超过200G")
$('.maxfilesize.ui.red.message').css('display','block')
}else{
this.file = file
$('.maxfilesize.ui.red.message').css('display','none')
dropzoneUploader.on("addedfile", (file) => {
if (file.size / (1024 * 1024) > dropzoneUploader.options.maxFilesize) {
dropzoneUploader.removeFile(file);
$(".maxfilesize.ui.red.message").text(
"单次最多上传10个文件,单个文件不超过200G"
);
$(".maxfilesize.ui.red.message").css("display", "block");
} else {
this.file = file;
$(".maxfilesize.ui.red.message").css("display", "none");
}
});
dropzoneUploader.on("removedfile",(file)=>{
$('.maxfilesize.ui.red.message').css('display','none')
})
dropzoneUploader.on('maxfilesexceeded', function (file) {
dropzoneUploader.removeFile(file)
$('.maxfilesize.ui.red.message').text("单次最多上传10个文件,单个文件不超过200G")
$('.maxfilesize.ui.red.message').css('display','block')

dropzoneUploader.on("removedfile", (file) => {
$(".maxfilesize.ui.red.message").css("display", "none");
});
dropzoneUploader.on("maxfilesexceeded", function (file) {
dropzoneUploader.removeFile(file);
$(".maxfilesize.ui.red.message").text(
"单次最多上传10个文件,单个文件不超过200G"
);
$(".maxfilesize.ui.red.message").css("display", "block");
});
this.dropzoneUploader = dropzoneUploader;
},
watch:{
allUploadLength(len){
if(len===this.uploadFiles.length){
setTimeout(() => {
this.dropzoneUploader.removeAllFiles(true)
this.btnFlag = false
this.$emit('setcluster',this.btnFlag)
watch: {
allUploadLength(len) {
if (len === this.uploadFiles.length) {
setTimeout(() => {
this.dropzoneUploader.removeAllFiles(true);
this.btnFlag = false;
this.$emit("setcluster", this.btnFlag);
}, 2000);
}
}
}
},
},
methods: {
startUpload(){
this.uploadFiles = this.dropzoneUploader.getQueuedFiles()
if(this.uploadFiles.length===0){
return
startUpload() {
this.uploadFiles = this.dropzoneUploader.getQueuedFiles();
if (this.uploadFiles.length === 0) {
return;
}
this.resetStatus()
$('.dz-remove').remove()
$('.maxfilesize.ui.red.message').css('display','none')
this.btnFlag = true
this.$emit('setcluster',this.btnFlag)
this.uploadFiles.forEach(element => {
element.datasetId = document.getElementById('datasetId').getAttribute('datasetId')
this.computeMD5(element)
this.resetStatus();
$(".dz-remove").remove();
$(".maxfilesize.ui.red.message").css("display", "none");
this.btnFlag = true;
this.$emit("setcluster", this.btnFlag);
this.uploadFiles.forEach((element) => {
element.datasetId = document
.getElementById("datasetId")
.getAttribute("datasetId");
this.computeMD5(element);
});
},
cancelDataset(){
location.href = this.repoPath
this.dropzoneUploader.removeAllFiles(true)
cancelDataset() {
location.href = this.repoPath;
this.dropzoneUploader.removeAllFiles(true);
},
resetStatus() {
this.uploadLength = 0
this.allUploadLength = 0
this.allUploadFiles = []
this.uploadLength = 0;
this.allUploadLength = 0;
// this.allUploadFiles = [];
this.uploadProgressList = [];
},
updateProgress(file, progress) {
file.previewTemplate.querySelector(
'.dz-upload'
).style.width = `${progress}%`
file.previewTemplate.querySelector(
'.dz-upload'
).style.background = '#409eff';
updateProgress(file, status, progress, infoCode, failedInfo = "") {
console.log("this.uploadProgressList:", this.uploadProgressList);
// file.previewTemplate.querySelector(
// ".dz-upload"
// ).style.width = `${progress}%`;
// file.previewTemplate.querySelector(".dz-upload").style.background =
// "#409eff";
// file.previewTemplate.querySelector(".dz-upload").style.opacity = 0;
this.uploadProgressList.forEach((item, index) => {
if (item.name === file.name) {
this.uploadProgressList[index].status = status;
this.uploadProgressList[index].progress = progress;
this.uploadProgressList[index].infoCode = infoCode;
this.uploadProgressList[index].failedInfo = failedInfo;
}
});
},
uploadError(file,info){
file.previewTemplate.querySelector(
'.dz-error-mark'
).style.opacity = 1
file.previewTemplate.querySelector(
'.dz-progress'
).style.opacity = 0
file.previewTemplate.querySelector(
'.dz-error-message span'
).innerHTML = info
file.previewTemplate.querySelector(
'.dz-error-message'
).style.display = 'block'
file.previewTemplate.querySelector(
'.dz-details'
).onmouseover = function(){file.previewTemplate.querySelector('.dz-error-message').style.opacity = 1 }
file.previewTemplate.querySelector(
'.dz-details'
).onmouseout = function(){file.previewTemplate.querySelector('.dz-error-message').style.opacity = 0 }
uploadError(file, info) {
file.previewTemplate.querySelector(".dz-error-mark").style.opacity = 1;
file.previewTemplate.querySelector(".dz-progress").style.opacity = 0;
file.previewTemplate.querySelector(".dz-error-message span").innerHTML =
info;
file.previewTemplate.querySelector(".dz-error-message").style.display =
"block";
file.previewTemplate.querySelector(".dz-details").onmouseover =
function () {
file.previewTemplate.querySelector(
".dz-error-message"
).style.opacity = 1;
};
file.previewTemplate.querySelector(".dz-details").onmouseout =
function () {
file.previewTemplate.querySelector(
".dz-error-message"
).style.opacity = 0;
};
},
emitDropzoneSuccess(file) {
file.status = 'success';
this.dropzoneUploader.emit('success', file);
this.dropzoneUploader.emit('complete', file);
file.status = "success";
this.dropzoneUploader.emit("success", file);
this.dropzoneUploader.emit("complete", file);
},
emitDropzoneFailed(file) {
this.status = this.dropzoneParams.data('falied');
file.status = 'error';
this.dropzoneUploader.emit('error', file);
this.status = this.dropzoneParams.data("falied");
file.status = "error";
this.dropzoneUploader.emit("error", file);
// this.dropzoneUploader.emit('complete', file);
},
finishUpload(file) {
console.log("finish",file)
file.previewTemplate.querySelector(
'.dz-success-mark'
).style.opacity = 1
file.previewTemplate.querySelector(
'.dz-progress'
).style.opacity = 0
if(this.uploadLength === this.uploadFiles.length){
console.log("finish", file);
file.previewTemplate.querySelector(".dz-success-mark").style.opacity = 1;
file.previewTemplate.querySelector(".dz-progress").style.opacity = 0;
if (this.uploadLength === this.uploadFiles.length) {
setTimeout(() => {
window.location.href = this.repoPath
window.location.href = this.repoPath;
}, 1000);
}
},
@@ -231,10 +281,16 @@ export default {
fileReader = new FileReader();
let currentChunk = 0;
const time = new Date().getTime();
this.status = this.dropzoneParams.data('md5-computing');
this.status = this.dropzoneParams.data("md5-computing");
this.uploadProgressList.push({
name: file.name,
status: this.dropzoneParams.data("md5-computing"),
progress: 0,
infoCode: 3,
});
file.totalChunkCounts = chunks;
if (file.size==0) {
file.totalChunkCounts = 1
if (file.size == 0) {
file.totalChunkCounts = 1;
}
loadMd5Next();

@@ -242,7 +298,7 @@ export default {
fileLoaded.call(this, e);
};
fileReader.onerror = (err) => {
console.warn('oops, something went wrong.', err);
console.warn("oops, something went wrong.", err);
file.cancel();
};

@@ -250,11 +306,16 @@ export default {
spark.append(e.target.result); // Append array buffer
currentChunk++;
if (currentChunk < chunks) {
this.status = `${this.dropzoneParams.data('loading-file')} ${(
this.status = `${this.dropzoneParams.data("loading-file")} ${(
(currentChunk / chunks) *
100
).toFixed(2)}% (${currentChunk}/${chunks})`;
this.updateProgress(file, ((currentChunk / chunks) * 100).toFixed(2));
console.log("-=-=-=-=--=", this.status);
// this.updateProgress(
// file,
// this.dropzoneParams.data("md5-computing"),
// Number(((currentChunk / chunks) * 100).toFixed(1))
// );
loadMd5Next();
return;
}
@@ -265,7 +326,11 @@ export default {
file.size
} 用时:${(new Date().getTime() - time) / 1000} s`
);
this.updateProgress(file,100)
// this.updateProgress(
// file,
// this.dropzoneParams.data("md5-computing"),
// 100
// );
spark.destroy(); // 释放缓存
file.uniqueIdentifier = md5; // 将文件md5赋值给文件唯一标识
file.cmd5 = false; // 取消计算md5状态
@@ -289,46 +354,57 @@ export default {

async computeMD5Success(md5edFile) {
const file = await this.getSuccessChunks(md5edFile);
console.log(file);
try {
if (file.uploadID == '' || file.uuid == '') {
// 未上传过
if (file.uploadID == "" || file.uuid == "") {
// 未上传过
await this.newMultiUpload(file);
if (file.uploadID != '' && file.uuid != '') {
file.chunks = '';
if (file.uploadID != "" && file.uuid != "") {
file.chunks = "";
this.multipartUpload(file);
} else {
// 失败如何处理
let info = "上传失败"
this.allUploadLength++
this.uploadError(file,info)
this.allUploadFiles.push({name:file.name,status:2,info:info})
// 失败如何处理
let info = "上传失败";
this.allUploadLength++;
this.uploadError(file, info);
this.updateProgress(file, "上传失败", 0, 2);
// this.allUploadFiles.push({
// name: file.name,
// status: 2,
// info: info,
// });
return;
}
return;
}

if (file.uploaded == '1') {
// 已上传成功
// 秒传
if (file.attachID == '0') {
// 删除数据集记录,未删除文件
if (file.uploaded == "1") {
// 已上传成功
// 秒传
if (file.attachID == "0") {
// 删除数据集记录,未删除文件
await addAttachment(file);
}
//不同数据集上传同一个文件
if (file.datasetID != '') {
if (file.datasetID != "") {
if (file.datasetName != "" && file.realName != "") {
let info = `该文件已上传在数据集: ${file.datasetName}`
this.uploadError(file,info)
this.allUploadLength++
this.allUploadFiles.push({name:file.name,status:1,info:info})
let info = `该文件已上传在数据集: ${file.datasetName}`;
this.uploadError(file, info);
this.allUploadLength++;
this.updateProgress(file, "上传失败", 0, 1, info);
// this.allUploadFiles.push({
// name: file.name,
// status: 1,
// info: info,
// });
}
}
console.log('文件已上传完成');
console.log("文件已上传完成");
this.progress = 100;
this.status = this.dropzoneParams.data('upload-complete');
this.status = this.dropzoneParams.data("upload-complete");
// this.finishUpload(file);
} else {
// 断点续传
// 断点续传
this.multipartUpload(file);
}
} catch (error) {
@@ -338,14 +414,14 @@ export default {

async function addAttachment(file) {
return await axios.post(
'/attachments/add',
"/attachments/add",
qs.stringify({
uuid: file.uuid,
file_name: file.name,
size: file.size,
dataset_id: file.datasetId,
type: this.uploadtype,
_csrf: csrf
_csrf: csrf,
})
);
}
@@ -357,11 +433,11 @@ export default {
md5: file.uniqueIdentifier,
type: this.uploadtype,
file_name: file.name,
_csrf: csrf
}
_csrf: csrf,
},
};
try {
const response = await axios.get('/attachments/get_chunks', params);
const response = await axios.get("/attachments/get_chunks", params);
file.uploadID = response.data.uploadID;
file.uuid = response.data.uuid;
file.uploaded = response.data.uploaded;
@@ -373,13 +449,13 @@ export default {
return file;
} catch (error) {
this.emitDropzoneFailed(file);
console.log('getSuccessChunks catch: ', error);
console.log("getSuccessChunks catch: ", error);
return null;
}
},

async newMultiUpload(file) {
const res = await axios.get('/attachments/new_multipart', {
const res = await axios.get("/attachments/new_multipart", {
params: {
totalChunkCounts: file.totalChunkCounts,
md5: file.uniqueIdentifier,
@@ -387,8 +463,8 @@ export default {
fileType: file.type,
type: this.uploadtype,
file_name: file.name,
_csrf: csrf
}
_csrf: csrf,
},
});
file.uploadID = res.data.uploadID;
file.uuid = res.data.uuid;
@@ -403,7 +479,7 @@ export default {
fileReader = new FileReader(),
time = new Date().getTime();
let currentChunk = 0;
let _this = this
let _this = this;

function loadNext() {
const start = currentChunk * chunkSize;
@@ -421,7 +497,7 @@ export default {
}

async function getUploadChunkUrl(currentChunk, partSize) {
const res = await axios.get('/attachments/get_multipart_url', {
const res = await axios.get("/attachments/get_multipart_url", {
params: {
uuid: file.uuid,
uploadID: file.uploadID,
@@ -429,50 +505,44 @@ export default {
chunkNumber: currentChunk + 1,
type: _this.uploadtype,
file_name: file.name,
_csrf: csrf
}
_csrf: csrf,
},
});
urls[currentChunk] = res.data.url;
}

async function uploadMinio(url, e) {
const res = await axios.put(url, e.target.result);
delete e.target.result
delete e.target.result;
etags[currentChunk] = res.headers.etag;
}
async function uploadMinioNewMethod(url,e){
var xhr = new XMLHttpRequest();
xhr.open('PUT', url, false);
if(_this.uploadtype===0){
xhr.setRequestHeader('Content-Type', 'text/plain')
xhr.send(e.target.result);
var etagValue = xhr.getResponseHeader('etag');
etags[currentChunk] = etagValue;
}
else if(_this.uploadtype===1){
xhr.setRequestHeader('Content-Type', '')
xhr.send(e.target.result);
var etagValue = xhr.getResponseHeader('ETag');
//console.log(etagValue);
etags[currentChunk] = etagValue;
}

async function uploadMinioNewMethod(url, e) {
var xhr = new XMLHttpRequest();
xhr.open("PUT", url, false);
if (_this.uploadtype === 0) {
xhr.setRequestHeader("Content-Type", "text/plain");
xhr.send(e.target.result);

var etagValue = xhr.getResponseHeader("etag");
etags[currentChunk] = etagValue;
} else if (_this.uploadtype === 1) {
xhr.setRequestHeader("Content-Type", "");
xhr.send(e.target.result);
var etagValue = xhr.getResponseHeader("ETag");
//console.log(etagValue);
etags[currentChunk] = etagValue;
}
}

async function updateChunk(currentChunk) {
await axios.post(
'/attachments/update_chunk',
"/attachments/update_chunk",
qs.stringify({
uuid: file.uuid,
chunkNumber: currentChunk + 1,
etag: etags[currentChunk],
_csrf: csrf
_csrf: csrf,
})
);
}
@@ -481,34 +551,35 @@ export default {
if (!checkSuccessChunks()) {
const start = currentChunk * chunkSize;
const partSize =
start + chunkSize >= file.size ? file.size - start : chunkSize;
start + chunkSize >= file.size ? file.size - start : chunkSize;
// 获取分片上传url
await getUploadChunkUrl(currentChunk, partSize);
if (urls[currentChunk] != '') {
if (urls[currentChunk] != "") {
// 上传到minio
//await uploadMinio(urls[currentChunk], e);
await uploadMinioNewMethod(urls[currentChunk], e);
if (etags[currentChunk] != '') {
// 更新数据库:分片上传结果
if (etags[currentChunk] != "") {
// 更新数据库:分片上传结果
//await updateChunk(currentChunk);
} else {
console.log("上传到minio uploadChunk etags[currentChunk] == ''");// TODO
console.log(
"上传到minio uploadChunk etags[currentChunk] == ''"
); // TODO
}
} else {
console.log("uploadChunk urls[currentChunk] != ''");// TODO
console.log("uploadChunk urls[currentChunk] != ''"); // TODO
}
}
} catch (error) {
// this.emitDropzoneFailed(file);
console.log(error);
//this.emitDropzoneFailed(file);
//console.log(error);
}
}

async function completeUpload() {
return await axios.post(
'/attachments/complete_multipart',
"/attachments/complete_multipart",
qs.stringify({
uuid: file.uuid,
uploadID: file.uploadID,
@@ -517,77 +588,97 @@ export default {
dataset_id: file.datasetId,
type: _this.uploadtype,
_csrf: csrf,
description:_this.desc
description: _this.desc,
})
);
}

const successChunks = [];
let successParts = [];
successParts = file.chunks.split(',');
successParts = file.chunks.split(",");
for (let i = 0; i < successParts.length; i++) {
successChunks[i] = successParts[i].split('-')[0];
successChunks[i] = successParts[i].split("-")[0];
}
const urls = []; // TODO const ?
const etags = [];
console.log('上传分片...');
this.status = this.dropzoneParams.data('uploading');
console.log("上传分片...");
this.status = this.dropzoneParams.data("uploading");
loadNext();
fileReader.onload = async (e) => {
try{
try {
await uploadChunk(e);
}catch(err){
console.log(err)
} catch (err) {
console.log(err);
}
fileReader.abort();
currentChunk++;
if (currentChunk < chunks) {
console.log(
`第${currentChunk}个分片上传完成, 开始第${currentChunk +
1}/${chunks}个分片上传`
`第${currentChunk}个分片上传完成, 开始第${
currentChunk + 1
}/${chunks}个分片上传`
);
this.progress = Math.ceil((currentChunk / chunks) * 100);
this.updateProgress(file, ((currentChunk / chunks) * 100).toFixed(2));
this.status = `${this.dropzoneParams.data('uploading')} ${(
this.updateProgress(
file,
this.dropzoneParams.data("uploading"),
Number(((currentChunk / chunks) * 100).toFixed(2)),
3
);
this.status = `${this.dropzoneParams.data("uploading")} ${(
(currentChunk / chunks) *
100
).toFixed(2)}%`;
await loadNext();
} else {
try{
try {
await completeUpload();
}catch(err){
let info = "上传失败"
this.allUploadLength++
this.uploadError(file,info)
this.allUploadFiles.push({name:file.name,status:2,info:info})
if(err){
return
} catch (err) {
let info = "上传失败";
this.allUploadLength++;
this.uploadError(file, info);
this.updateProgress(
file,
info,
Number(((currentChunk / chunks) * 100).toFixed(2)) - 1,
2
);
// this.allUploadFiles.push({
// name: file.name,
// status: 2,
// info: info,
// });
if (err) {
return;
}
}

console.log(
`文件上传完成:${file.name} \n分片:${chunks} 大小:${
file.size
} 用时:${(new Date().getTime() - time) / 1000} s`
);
this.uploadLength++
this.allUploadLength++
this.allUploadFiles.push({name:file.name,status:0,info:'上传成功'})
this.updateProgress(file, 100);
this.uploadLength++;
this.allUploadLength++;
// this.allUploadFiles.push({
// name: file.name,
// status: 0,
// info: "上传成功",
// });

this.updateProgress(file, "上传成功", 100, 0);
this.progress = 100;
this.status = this.dropzoneParams.data('upload-complete');
this.status = this.dropzoneParams.data("upload-complete");
this.finishUpload(file);
}
};
}
}
},
},
};
</script>

<style>
<style scoped>
.dropzone-wrapper {
margin: 0;
}
@@ -607,14 +698,41 @@ export default {
border-bottom: 1px solid #dadce0;
min-height: 0;
}
.upload-info{
.upload-info {
margin-top: 1em;
margin-bottom: 3em;
}
.success{
.success {
color: #21ba45;
font-size: 16px;
margin-right: 0.5rem;
}
.failed{
.failed {
color: red;
font-size: 16px;
margin-right: 0.5rem;
}
.datast-upload-progress {
display: flex;
align-items: center;
}
.datast-upload-progress .dataset-name {
text-align: right;
width: 120px;
margin-right: 1rem;
}
.datast-upload-progress .dataset-progress {
flex: 1;
}
.datast-upload-progress .dataset-status {
width: 100px;
margin-left: 1rem;
}
.datast-upload-progress .dataset-status .status-flex {
display: flex;
align-items: center;
}
/deep/ .el-progress-bar__inner {
background-color: #21ba45;
}
</style>
</style>

+ 48
- 40
web_src/js/features/cloudrbanin.js View File

@@ -347,7 +347,6 @@ export default async function initCloudrain() {
e.stopPropagation();
});

function refreshStatus(version_name, ID, repoPath) {
const url = `/api/v1/repos/${repoPath}/${ID}/?version_name${version_name}`;
$.get(url, (data) => {
@@ -405,49 +404,58 @@ export default async function initCloudrain() {
const jobName = this.dataset.jobname;
getModelInfo(repoPath, modelName, versionName, jobName);
});
function debugAgainPost(ID, debugUrl, redirect_to) {
$.ajax({
type: "POST",
url: debugUrl + "restart?redirect_to=" + redirect_to,
data: $("#debugAgainForm-" + ID).serialize(),
success: function (res) {
if (res["WechatRedirectUrl"]) {
window.location.href = res["WechatRedirectUrl"];
} else if (res.result_code === "0") {
if (res.id !== ID) {
location.reload();
} else {
$("#" + ID + "-icon")
.removeClass()
.addClass(res.status);
$("#" + ID + "-text").text(res.status);
$("#ai-debug-" + ID)
.removeClass("blue")
.addClass("disabled");
$("#ai-delete-" + ID)
.removeClass("blue")
.addClass("disabled");
$("#ai-debug-" + ID)
.text(debug_button)
.css("margin", "0 1rem");
}
} else {
$(".alert")
.html(res.error_msg)
.removeClass("alert-success")
.addClass("alert-danger")
.show()
.delay(2000)
.fadeOut();
}
},
error: function (res) {
console.log(res);
},
});
}
function debugAgain(ID, debugUrl, redirect_to) {
if ($("#" + ID + "-text").text() === "RUNNING") {
window.open(debugUrl + "debug");
} else {
$.ajax({
type: "POST",
url: debugUrl + "restart?redirect_to=" + redirect_to,
data: $("#debugAgainForm-" + ID).serialize(),
success: function (res) {
if (res["WechatRedirectUrl"]) {
window.location.href = res["WechatRedirectUrl"];
} else if (res.result_code === "0") {
if (res.id !== ID) {
location.reload();
} else {
$("#" + ID + "-icon")
.removeClass()
.addClass(res.status);
$("#" + ID + "-text").text(res.status);
$("#ai-debug-" + ID)
.removeClass("blue")
.addClass("disabled");
$("#ai-delete-" + ID)
.removeClass("blue")
.addClass("disabled");
$("#ai-debug-" + ID)
.text(debug_button)
.css("margin", "0 1rem");
}
} else {
$(".alert")
.html(res.error_msg)
.removeClass("alert-success")
.addClass("alert-danger")
.show()
.delay(2000)
.fadeOut();
}
},
error: function (res) {
console.log(res);
},
});
$(".ui.mini.modal.debug-again")
.modal({
onApprove: function () {
console.log("-----------");
},
})
.modal("show");
}
}
$(".ui.basic.ai_debug").click(function () {


Loading…
Cancel
Save