@@ -214,47 +214,6 @@ func GetOneLevelAllObjectUnderDirMinio(bucket string, prefixRootPath string, rel | |||||
ParenDir: ParenDir, | ParenDir: ParenDir, | ||||
} | } | ||||
fileInfos = append(fileInfos, fileInfo) | fileInfos = append(fileInfos, fileInfo) | ||||
// log.Info("val key=" + val.Key) | |||||
// var isDir bool | |||||
// var fileName string | |||||
// if val.Key == Prefix { | |||||
// continue | |||||
// } | |||||
// fileName = val.Key[prefixLen:] | |||||
// log.Info("fileName =" + fileName) | |||||
// files := strings.Split(fileName, "/") | |||||
// if fileMap[files[0]] { | |||||
// continue | |||||
// } else { | |||||
// fileMap[files[0]] = true | |||||
// } | |||||
// ParenDir := relativePath | |||||
// fileName = files[0] | |||||
// if len(files) > 1 { | |||||
// isDir = true | |||||
// ParenDir += fileName + "/" | |||||
// } else { | |||||
// isDir = false | |||||
// } | |||||
// // if strings.HasSuffix(val.Key, "/") { | |||||
// // isDir = true | |||||
// // fileName = val.Key[prefixLen : len(val.Key)-1] | |||||
// // relativePath += val.Key[prefixLen:] | |||||
// // } else { | |||||
// // isDir = false | |||||
// // fileName = val.Key[prefixLen:] | |||||
// // } | |||||
// fileInfo := FileInfo{ | |||||
// ModTime: val.LastModified.Local().Format("2006-01-02 15:04:05"), | |||||
// FileName: fileName, | |||||
// Size: val.Size, | |||||
// IsDir: isDir, | |||||
// ParenDir: relativePath, | |||||
// } | |||||
// fileInfos = append(fileInfos, fileInfo) | |||||
} | } | ||||
return fileInfos, err | return fileInfos, err | ||||
} else { | } else { | ||||
@@ -3117,7 +3117,8 @@ dataset_path_rule = The dataset location is stored in the environment variable d | |||||
view_sample = View sample | view_sample = View sample | ||||
inference_output_path_rule = The inference output path is stored in the environment variable result_url. | inference_output_path_rule = The inference output path is stored in the environment variable result_url. | ||||
model_file_path_rule=The model file location is stored in the environment variable ckpt_url | model_file_path_rule=The model file location is stored in the environment variable ckpt_url | ||||
model_file_postfix_rule = The supported format of the model file is [ckpt, pb, h5, json, pkl, pth, t7, pdparams, onnx, pbtxt, keras, mlmodel, cfg, pt] | |||||
model_convert_postfix_rule = The supported format of the model file is [.pth, .pkl, .onnx, .mindir, .ckpt, .pb] | |||||
delete_task = Delete task | delete_task = Delete task | ||||
task_delete_confirm = Are you sure you want to delete this task? Once this task is deleted, it cannot be recovered. | task_delete_confirm = Are you sure you want to delete this task? Once this task is deleted, it cannot be recovered. | ||||
operate_confirm = confirm | operate_confirm = confirm | ||||
@@ -3132,7 +3132,8 @@ dataset_path_rule = 数据集位置存储在环境变量data_url中,训练输 | |||||
view_sample = 查看样例 | view_sample = 查看样例 | ||||
inference_output_path_rule = 推理输出路径存储在环境变量result_url中。 | inference_output_path_rule = 推理输出路径存储在环境变量result_url中。 | ||||
model_file_path_rule = 模型文件位置存储在环境变量ckpt_url中。 | model_file_path_rule = 模型文件位置存储在环境变量ckpt_url中。 | ||||
model_file_postfix_rule = 模型文件支持的格式为 [ckpt, pb, h5, json, pkl, pth, t7, pdparams, onnx, pbtxt, keras, mlmodel, cfg, pt] | |||||
model_convert_postfix_rule = 模型文件支持的格式为 [.pth, .pkl, .onnx, .mindir, .ckpt, .pb] | |||||
delete_task = 删除任务 | delete_task = 删除任务 | ||||
task_delete_confirm = 你确认删除该任务么?此任务一旦删除不可恢复。 | task_delete_confirm = 你确认删除该任务么?此任务一旦删除不可恢复。 | ||||
operate_confirm = 确定操作 | operate_confirm = 确定操作 | ||||
@@ -805,7 +805,13 @@ func generateCommand(repoName, processorType, codeRemotePath, dataRemotePath, bo | |||||
} | } | ||||
} | } | ||||
commandCode := "cd " + workDir + "code/" + strings.ToLower(repoName) + ";python " + bootFile + paramCode + ";" | |||||
var commandCode string | |||||
if processorType == grampus.ProcessorTypeNPU { | |||||
commandCode = "/bin/bash /home/work/run_train_for_openi.sh " + workDir + "code/" + strings.ToLower(repoName) + "/" + bootFile + " /tmp/log/train.log" + paramCode + ";" | |||||
} else if processorType == grampus.ProcessorTypeGPU { | |||||
commandCode = "cd " + workDir + "code/" + strings.ToLower(repoName) + ";python " + bootFile + paramCode + ";" | |||||
} | |||||
command += commandCode | command += commandCode | ||||
//get exec result | //get exec result | ||||
@@ -0,0 +1,21 @@ | |||||
<div id="mask"> | |||||
<div class="loadingWrap"> | |||||
<div id="loading-page"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
<div | |||||
style=" | |||||
margin-top: 10%; | |||||
font-size: 14px; | |||||
color: #101010; | |||||
font-family: SourceHanSansSC-regular; | |||||
" | |||||
> | |||||
任务正在准备中,喝杯水回来再看看~ | |||||
</div> | |||||
</div> | |||||
</div> |
@@ -3,7 +3,7 @@ | |||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
<input type="hidden" id="postPath" value="{{.Link}}"> | <input type="hidden" id="postPath" value="{{.Link}}"> | ||||
<div style="width: 80%;margin: auto;"> | |||||
<div> | |||||
<h4 class="ui top attached header"> | <h4 class="ui top attached header"> | ||||
{{$.i18n.Tr "dataset.upload_dataset_file"}} | {{$.i18n.Tr "dataset.upload_dataset_file"}} | ||||
</h4> | </h4> | ||||
@@ -54,7 +54,7 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div style="width: 80%;margin: auto;padding-top: 2em;"> | |||||
<div style="padding-top: 2em;"> | |||||
<!-- <p>说明:<br> | <!-- <p>说明:<br> | ||||
- 只有<span class="text blue">zip格式</span>zip格式的数据集才能发起云脑任务;<br> | - 只有<span class="text blue">zip格式</span>zip格式的数据集才能发起云脑任务;<br> | ||||
- 云脑1提供 <span class="text blue">CPU / GPU</span> 资源,云脑2提供 <span class="text blue">Ascend NPU</span> 资源;调试使用的数据集也需要上传到对应的环境。 | - 云脑1提供 <span class="text blue">CPU / GPU</span> 资源,云脑2提供 <span class="text blue">Ascend NPU</span> 资源;调试使用的数据集也需要上传到对应的环境。 | ||||
@@ -28,18 +28,7 @@ | |||||
white-space: nowrap !important; | white-space: nowrap !important; | ||||
} | } | ||||
</style> | </style> | ||||
<!-- <div class="ui page dimmer"> | |||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | |||||
</div> --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -36,15 +36,7 @@ | |||||
white-space: nowrap !important; | white-space: nowrap !important; | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -141,6 +133,9 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<span > | |||||
<i class="question circle icon" data-content="{{.i18n.Tr "cloudbrain.model_file_postfix_rule"}}" data-position="top center" data-variation="inverted mini"></i> | |||||
</span> | |||||
</div> | </div> | ||||
<!-- AI引擎 --> | <!-- AI引擎 --> | ||||
@@ -1,91 +1,7 @@ | |||||
{{template "base/head" .}} | {{template "base/head" .}} | ||||
<style> | <style> | ||||
/* 遮罩层css效果图 */ | /* 遮罩层css效果图 */ | ||||
#mask { | |||||
position: fixed; | |||||
top: 0px; | |||||
left: 0px; | |||||
right: 0px; | |||||
bottom: 0px; | |||||
filter: alpha(opacity=60); | |||||
background-color: #777; | |||||
z-index: 1000; | |||||
display: none; | |||||
opacity: 0.8; | |||||
-moz-opacity: 0.5; | |||||
padding-top: 100px; | |||||
color: #000000 | |||||
} | |||||
/* 加载圈css效果图 */ | |||||
#loadingPage { | |||||
margin: 200px auto; | |||||
width: 50px; | |||||
height: 40px; | |||||
text-align: center; | |||||
font-size: 10px; | |||||
display: block; | |||||
} | |||||
#loadingPage>div { | |||||
background-color: green; | |||||
height: 100%; | |||||
width: 6px; | |||||
display: inline-block; | |||||
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
} | |||||
#loadingPage .rect2 { | |||||
-webkit-animation-delay: -1.1s; | |||||
animation-delay: -1.1s; | |||||
} | |||||
#loadingPage .rect3 { | |||||
-webkit-animation-delay: -1.0s; | |||||
animation-delay: -1.0s; | |||||
} | |||||
#loadingPage .rect4 { | |||||
-webkit-animation-delay: -0.9s; | |||||
animation-delay: -0.9s; | |||||
} | |||||
#loadingPage .rect5 { | |||||
-webkit-animation-delay: -0.8s; | |||||
animation-delay: -0.8s; | |||||
} | |||||
@-webkit-keyframes sk-stretchdelay { | |||||
0%, | |||||
40%, | |||||
100% { | |||||
-webkit-transform: scaleY(0.4) | |||||
} | |||||
20% { | |||||
-webkit-transform: scaleY(1.0) | |||||
} | |||||
} | |||||
@keyframes sk-stretchdelay { | |||||
0%, | |||||
40%, | |||||
100% { | |||||
transform: scaleY(0.4); | |||||
-webkit-transform: scaleY(0.4); | |||||
} | |||||
20% { | |||||
transform: scaleY(1.0); | |||||
-webkit-transform: scaleY(1.0); | |||||
} | |||||
} | |||||
.inline.required.field.cloudbrain_benchmark { | .inline.required.field.cloudbrain_benchmark { | ||||
display: none; | display: none; | ||||
} | } | ||||
@@ -97,25 +13,11 @@ | |||||
.inline.required.field.cloudbrain_brainscore { | .inline.required.field.cloudbrain_brainscore { | ||||
display: none; | display: none; | ||||
} | } | ||||
.icons { | |||||
/* position: absolute !important; | |||||
right: 150px; | |||||
top: 14px; | |||||
z-index: 2; */ | |||||
} | |||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
@@ -330,7 +232,6 @@ | |||||
let min_value_task = value_task.toLowerCase() | let min_value_task = value_task.toLowerCase() | ||||
$("input[name='display_job_name']").attr("value", min_value_task) | $("input[name='display_job_name']").attr("value", min_value_task) | ||||
document.getElementById("mask").style.display = "block" | document.getElementById("mask").style.display = "block" | ||||
} | } | ||||
// 页面加载完毕后遮罩层隐藏 | // 页面加载完毕后遮罩层隐藏 | ||||
@@ -345,44 +246,11 @@ | |||||
.dropdown({ | .dropdown({ | ||||
placeholder: "选择数据集类别", | placeholder: "选择数据集类别", | ||||
}) | }) | ||||
console.log("=======================") | |||||
// $(document).ready(function(){ | |||||
// let waitNums = $('.cloudbrain-type').data('queue').split('map')[1] | |||||
// let test = new Map() | |||||
// let waitNumsArray = waitNums.split(' ') | |||||
// waitNumsArray.forEach((element,index) => { | |||||
// if(index===0){ | |||||
// test.set(element.slice(1,-2),parseInt(element.slice(-1))) | |||||
// }else if(index===waitNumsArray.length-1){ | |||||
// test.set(element.slice(0,-3),parseInt(element.slice(-2,-1))) | |||||
// }else{ | |||||
// test.set(element.slice(0,-2),parseInt(element.slice(-1))) | |||||
// } | |||||
// }); | |||||
// console.log(test) | |||||
// $('.ui.search.dropdown.gpu-type').dropdown({ | |||||
// onChange: function(value, text, $selectedItem) { | |||||
// console.log("=-------------",value) | |||||
// console.log("=-------------",test.get(value)) | |||||
// let gpuTypeNums= test.get(value) | |||||
// $('#gpu-nums').text("{{.i18n.Tr "repo.wait_count_start"}}"+gpuTypeNums+"{{.i18n.Tr "repo.wait_count_end"}}") | |||||
// } | |||||
// }); | |||||
// }) | |||||
// $('#cloudbrain_image').select2({ | |||||
// placeholder: "选择镜像" | |||||
// }); | |||||
$(".ui.button.reset").click(function (e) { | $(".ui.button.reset").click(function (e) { | ||||
e.preventDefault() | e.preventDefault() | ||||
$('#cloudbrain_benchmark_category') | $('#cloudbrain_benchmark_category') | ||||
.dropdown("clear", true) | .dropdown("clear", true) | ||||
}) | }) | ||||
$(".ui.positive.button.active.all_selected").click(function (e) { | $(".ui.positive.button.active.all_selected").click(function (e) { | ||||
e.preventDefault() | e.preventDefault() | ||||
var selected_value = new Array() | var selected_value = new Array() | ||||
@@ -64,18 +64,7 @@ | |||||
} | } | ||||
</style> | </style> | ||||
<!-- <div class="ui page dimmer"> | |||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | |||||
</div> --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -272,6 +272,8 @@ | |||||
class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}:</span> | class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}:</span> | ||||
<span class="cti-mgRight-sm uc-accordionTitle-black" | <span class="cti-mgRight-sm uc-accordionTitle-black" | ||||
id="{{.VersionName}}-duration-span">{{$.duration}}</span> | id="{{.VersionName}}-duration-span">{{$.duration}}</span> | ||||
<span id="refresh-status" data-tooltip="刷新" style="cursor: pointer;" data-inverted="" data-version="{{.VersionName}}"><i | |||||
class="redo icon redo-color"></i></span> | |||||
</div> | </div> | ||||
</span> | </span> | ||||
@@ -19,90 +19,6 @@ | |||||
height: 100%; | height: 100%; | ||||
} | } | ||||
/* 弹窗 */ | |||||
#mask { | |||||
position: fixed; | |||||
top: 0px; | |||||
left: 0px; | |||||
right: 0px; | |||||
bottom: 0px; | |||||
filter: alpha(opacity=60); | |||||
background-color: #777; | |||||
z-index: 1000; | |||||
display: none; | |||||
opacity: 0.8; | |||||
-moz-opacity: 0.5; | |||||
padding-top: 100px; | |||||
color: #000000 | |||||
} | |||||
#loadingPage { | |||||
margin: 200px auto; | |||||
width: 50px; | |||||
height: 40px; | |||||
text-align: center; | |||||
font-size: 10px; | |||||
display: block; | |||||
} | |||||
#loadingPage>div { | |||||
background-color: green; | |||||
height: 100%; | |||||
width: 6px; | |||||
display: inline-block; | |||||
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
} | |||||
#loadingPage .rect2 { | |||||
-webkit-animation-delay: -1.1s; | |||||
animation-delay: -1.1s; | |||||
} | |||||
#loadingPage .rect3 { | |||||
-webkit-animation-delay: -1.0s; | |||||
animation-delay: -1.0s; | |||||
} | |||||
#loadingPage .rect4 { | |||||
-webkit-animation-delay: -0.9s; | |||||
animation-delay: -0.9s; | |||||
} | |||||
#loadingPage .rect5 { | |||||
-webkit-animation-delay: -0.8s; | |||||
animation-delay: -0.8s; | |||||
} | |||||
@-webkit-keyframes sk-stretchdelay { | |||||
0%, | |||||
40%, | |||||
100% { | |||||
-webkit-transform: scaleY(0.4) | |||||
} | |||||
20% { | |||||
-webkit-transform: scaleY(1.0) | |||||
} | |||||
} | |||||
@keyframes sk-stretchdelay { | |||||
0%, | |||||
40%, | |||||
100% { | |||||
transform: scaleY(0.4); | |||||
-webkit-transform: scaleY(0.4); | |||||
} | |||||
20% { | |||||
transform: scaleY(1.0); | |||||
-webkit-transform: scaleY(1.0); | |||||
} | |||||
} | |||||
/* 消息框 */ | /* 消息框 */ | ||||
.alert { | .alert { | ||||
@@ -203,17 +119,6 @@ | |||||
} | } | ||||
</style> | </style> | ||||
<!-- 弹窗 --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
<div class="alert"></div> | <div class="alert"></div> | ||||
<div class="repository release dataset-list view"> | <div class="repository release dataset-list view"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
@@ -502,6 +407,16 @@ | |||||
</div> | </div> | ||||
</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> | </div> | ||||
{{template "base/footer" .}} | {{template "base/footer" .}} | ||||
<script> | <script> | ||||
@@ -56,18 +56,7 @@ | |||||
font-size: 14px !important; | font-size: 14px !important; | ||||
} | } | ||||
</style> | </style> | ||||
<!-- <div class="ui page dimmer"> | |||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | |||||
</div> --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -51,18 +51,7 @@ | |||||
font-size: 14px !important; | font-size: 14px !important; | ||||
} | } | ||||
</style> | </style> | ||||
<!-- <div class="ui page dimmer"> | |||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | |||||
</div> --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -209,15 +209,7 @@ | |||||
box-shadow: 0 2px 3px 0 rgb(34 36 38 / 15%); | box-shadow: 0 2px 3px 0 rgb(34 36 38 / 15%); | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -289,10 +281,8 @@ | |||||
<div class="content-pad"> | <div class="content-pad"> | ||||
<div class="ui pointing secondary menu" style="border-bottom: 1px solid rgba(34,36,38,.15);"> | <div class="ui pointing secondary menu" style="border-bottom: 1px solid rgba(34,36,38,.15);"> | ||||
<a class="active item" | |||||
data-tab="first{{$k}}">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a> | |||||
<a class="item" data-tab="second{{$k}}" | |||||
onclick="loadLog({{.VersionName}})">{{$.i18n.Tr "repo.modelarts.log"}}</a> | |||||
<a class="active item" data-tab="first{{$k}}">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a> | |||||
<a class="item log_bottom" data-tab="second{{$k}}" data-version="{{.VersionName}}">{{$.i18n.Tr "repo.modelarts.log"}}</a> | |||||
<a class="item load-model-file" data-tab="third{{$k}}" data-download-flag="{{$.canDownload}}" data-path="{{$.RepoLink}}/modelarts/train-job/{{.JobID}}/model_list" data-version="{{.VersionName}}" data-parents="" data-filename="" data-init="init" >{{$.i18n.Tr "repo.model_download"}}</a> | <a class="item load-model-file" data-tab="third{{$k}}" data-download-flag="{{$.canDownload}}" data-path="{{$.RepoLink}}/modelarts/train-job/{{.JobID}}/model_list" data-version="{{.VersionName}}" data-parents="" data-filename="" data-init="init" >{{$.i18n.Tr "repo.model_download"}}</a> | ||||
</div> | </div> | ||||
<div class="ui tab active" data-tab="first{{$k}}"> | <div class="ui tab active" data-tab="first{{$k}}"> | ||||
@@ -479,11 +469,23 @@ | |||||
</div> | </div> | ||||
<div class="ui tab" data-tab="second{{$k}}"> | <div class="ui tab" data-tab="second{{$k}}"> | ||||
<div style="position: relative;"> | <div style="position: relative;"> | ||||
<span> | |||||
<a title="滚动到顶部" style="position: absolute; right: -32px;cursor: pointer;" | |||||
class="log_top" data-version="{{.VersionName}}"><i class="icon-to-top"></i></a> | |||||
</span> | |||||
<span class="log-info"> | |||||
<a title="滚动到底部" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" | |||||
class="log_bottom" data-version="{{.VersionName}}"><i | |||||
class="icon-to-bottom"></i></a> | |||||
</span> | |||||
<div class="ui message message{{.VersionName}}" style="display: none;"> | <div class="ui message message{{.VersionName}}" style="display: none;"> | ||||
<div id="header"></div> | <div id="header"></div> | ||||
</div> | </div> | ||||
<div class="ui attached log" id="log{{.VersionName}}" | |||||
<div class="ui attached log" id="log{{.VersionName}}" | |||||
style="height: 300px !important; overflow: auto;"> | style="height: 300px !important; overflow: auto;"> | ||||
<div class="ui inverted active dimmer"> | |||||
<div class="ui loader"></div> | |||||
</div> | |||||
<input type="hidden" name="end_line" value> | <input type="hidden" name="end_line" value> | ||||
<input type="hidden" name="start_line" value> | <input type="hidden" name="start_line" value> | ||||
<pre id="log_file{{.VersionName}}"></pre> | <pre id="log_file{{.VersionName}}"></pre> | ||||
@@ -771,7 +773,7 @@ | |||||
} | } | ||||
if (srcEngine == 'mindspore') { | if (srcEngine == 'mindspore') { | ||||
$('#choice_Engine .default.text').text("MindSpore"); | $('#choice_Engine .default.text').text("MindSpore"); | ||||
$('#choice_Engine input[name="Engine"]').val(1) | |||||
$('#choice_Engine input[name="Engine"]').val(2) | |||||
} | } | ||||
} | } | ||||
}else{ | }else{ | ||||
@@ -868,17 +870,4 @@ | |||||
size = size.toFixed(0);//保留的小数位数 | size = size.toFixed(0);//保留的小数位数 | ||||
return size + unitArr[index]; | return size + unitArr[index]; | ||||
} | } | ||||
function loadLog(version_name) { | |||||
document.getElementById("mask").style.display = "block" | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/grampus/train-job/${jobID}/log?version_name=${version_name}&lines=50&order=asc`, (data) => { | |||||
$('input[name=end_line]').val(data.EndLine) | |||||
$('input[name=start_line]').val(data.StartLine) | |||||
$(`#log_file${version_name}`).text(data.Content) | |||||
document.getElementById("mask").style.display = "none" | |||||
}).fail(function (err) { | |||||
document.getElementById("mask").style.display = "none" | |||||
console.log(err); | |||||
}); | |||||
} | |||||
</script> | </script> |
@@ -10,16 +10,6 @@ | |||||
} | } | ||||
</style> | </style> | ||||
<!-- 弹窗 --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
<!-- 提示框 --> | <!-- 提示框 --> | ||||
<div class="alert"></div> | <div class="alert"></div> | ||||
@@ -35,15 +35,7 @@ | |||||
white-space: nowrap !important; | white-space: nowrap !important; | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -141,7 +133,7 @@ | |||||
</div> | </div> | ||||
<span > | <span > | ||||
<i class="question circle icon" data-content="{{.i18n.Tr "cloudbrain.model_file_path_rule"}}" data-position="top center" data-variation="inverted mini"></i> | |||||
<i class="question circle icon" data-content="{{.i18n.Tr "cloudbrain.model_file_path_rule"}} {{.i18n.Tr "cloudbrain.model_file_postfix_rule"}}" data-position="top center" data-variation="inverted mini"></i> | |||||
</span> | </span> | ||||
</div> | </div> | ||||
<!-- AI引擎 --> | <!-- AI引擎 --> | ||||
@@ -465,7 +465,7 @@ td, th { | |||||
<a title="滚动到顶部" style="position: absolute; right: -32px;cursor: pointer;" | <a title="滚动到顶部" style="position: absolute; right: -32px;cursor: pointer;" | ||||
class="log_top" data-version="{{.VersionName}}"><i class="icon-to-top"></i></a> | class="log_top" data-version="{{.VersionName}}"><i class="icon-to-top"></i></a> | ||||
</span> | </span> | ||||
<span> | |||||
<span class="log-info"> | |||||
<a title="滚动到底部" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" | <a title="滚动到底部" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" | ||||
class="log_bottom" data-version="{{.VersionName}}"><i | class="log_bottom" data-version="{{.VersionName}}"><i | ||||
class="icon-to-bottom"></i></a> | class="icon-to-bottom"></i></a> | ||||
@@ -474,6 +474,9 @@ td, th { | |||||
<div id="header"></div> | <div id="header"></div> | ||||
</div> | </div> | ||||
<div class="ui attached log log-scroll" data-version="{{.VersionName}}" id="log{{.VersionName}}" style="height: 300px !important; overflow: auto;"> | <div class="ui attached log log-scroll" data-version="{{.VersionName}}" id="log{{.VersionName}}" style="height: 300px !important; overflow: auto;"> | ||||
<div class="ui inverted active dimmer"> | |||||
<div class="ui loader"></div> | |||||
</div> | |||||
<input type="hidden" name="end_line" value> | <input type="hidden" name="end_line" value> | ||||
<input type="hidden" name="start_line" value> | <input type="hidden" name="start_line" value> | ||||
<pre id="log_file{{.VersionName}}"></pre> | <pre id="log_file{{.VersionName}}"></pre> | ||||
@@ -5,15 +5,7 @@ | |||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="repository new repo ui middle very relaxed page grid"> | <div class="repository new repo ui middle very relaxed page grid"> | ||||
@@ -208,15 +208,6 @@ | |||||
padding-top: 0.5rem; | padding-top: 0.5rem; | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -58,15 +58,7 @@ | |||||
<!-- <div class="ui page dimmer"> | <!-- <div class="ui page dimmer"> | ||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | <div class="ui text loader">{{.i18n.Tr "loading"}}</div> | ||||
</div> --> | </div> --> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -215,15 +215,7 @@ | |||||
box-shadow: 0 2px 3px 0 rgb(34 36 38 / 15%); | box-shadow: 0 2px 3px 0 rgb(34 36 38 / 15%); | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -518,7 +510,7 @@ | |||||
<a title="滚动到顶部" style="position: absolute; right: -32px;cursor: pointer;" | <a title="滚动到顶部" style="position: absolute; right: -32px;cursor: pointer;" | ||||
class="log_top" data-version="{{.VersionName}}"><i class="icon-to-top"></i></a> | class="log_top" data-version="{{.VersionName}}"><i class="icon-to-top"></i></a> | ||||
</span> | </span> | ||||
<span> | |||||
<span class="log-info"> | |||||
<a title="滚动到底部" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" | <a title="滚动到底部" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" | ||||
class="log_bottom" data-version="{{.VersionName}}"><i | class="log_bottom" data-version="{{.VersionName}}"><i | ||||
class="icon-to-bottom"></i></a> | class="icon-to-bottom"></i></a> | ||||
@@ -528,6 +520,9 @@ | |||||
</div> | </div> | ||||
<div class="ui attached log log-scroll" id="log{{.VersionName}}" data-version="{{.VersionName}}" | <div class="ui attached log log-scroll" id="log{{.VersionName}}" data-version="{{.VersionName}}" | ||||
style="height: 300px !important; overflow: auto;"> | style="height: 300px !important; overflow: auto;"> | ||||
<div class="ui inverted active dimmer"> | |||||
<div class="ui loader"></div> | |||||
</div> | |||||
<input type="hidden" name="end_line" value> | <input type="hidden" name="end_line" value> | ||||
<input type="hidden" name="start_line" value> | <input type="hidden" name="start_line" value> | ||||
<pre id="log_file{{.VersionName}}"></pre> | <pre id="log_file{{.VersionName}}"></pre> | ||||
@@ -911,154 +906,7 @@ | |||||
} | } | ||||
function loadLog(version_name) { | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&lines=50&order=asc`, (data) => { | |||||
$('input[name=end_line]').val(data.EndLine) | |||||
$('input[name=start_line]').val(data.StartLine) | |||||
$(`#log_file${version_name}`).text(data.Content) | |||||
if(!data.CanLogDownload){ | |||||
$(`#${version_name}-log-down`).removeClass('ti-download-file').addClass('disabled') | |||||
} | |||||
}).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
} | |||||
function debounce(fn, delay) { | |||||
let timer; | |||||
return (...args) => { | |||||
// 判断定时器是否存在,清除定时器 | |||||
if (timer) { | |||||
clearTimeout(timer); | |||||
} | |||||
// 重新调用setTimeout | |||||
timer = setTimeout(() => { | |||||
fn.apply(this, args); | |||||
}, delay); | |||||
}; | |||||
} | |||||
const fn = debounce(logScroll, 500) | |||||
function logScroll(version_name) { | |||||
let container = document.querySelector(`#log${version_name}`) | |||||
let scrollTop = container.scrollTop | |||||
let scrollHeight = container.scrollHeight | |||||
let clientHeight = container.clientHeight | |||||
let scrollLeft = container.scrollLeft | |||||
if (((parseInt(scrollTop) + clientHeight == scrollHeight || parseInt(scrollTop) + clientHeight + 1 == scrollHeight || parseInt(scrollTop) + clientHeight - 1 == scrollHeight)) && parseInt(scrollTop) !== 0 && scrollLeft == 0) { | |||||
let end_line = $(`#log${version_name} input[name=end_line]`).val() | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=${end_line}&lines=50&order=desc`, (data) => { | |||||
if (data.Lines == 0) { | |||||
$(`.message${version_name} #header`).text('您已翻阅至日志底部') | |||||
$(`.message${version_name}`).css('display', 'block') | |||||
setTimeout(function () { | |||||
$(`.message${version_name}`).css('display', 'none') | |||||
}, 1000) | |||||
} else { | |||||
if (end_line === data.EndLine) { | |||||
return | |||||
} | |||||
else { | |||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine) | |||||
$(`#log${version_name}`).append('<pre>' + data.Content) | |||||
} | |||||
} | |||||
}).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
} | |||||
if ([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].includes(scrollTop) && scrollLeft == 0) { | |||||
let start_line = $(`#log${version_name} input[name=start_line]`).val() | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=${start_line}&lines=50&order=asc`, (data) => { | |||||
if (data.Lines == 0) { | |||||
$(`.message${version_name} #header`).text('您已翻阅至日志顶部') | |||||
$(`.message${version_name}`).css('display', 'block') | |||||
setTimeout(function () { | |||||
$(`.message${version_name}`).css('display', 'none') | |||||
}, 1000) | |||||
} else { | |||||
$(`#log${version_name} input[name=start_line]`).val(data.StartLine) //如果变动就改变所对应的值 | |||||
$(`#log${version_name}`).prepend('<pre>' + data.Content) | |||||
} | |||||
}).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
} | |||||
} | |||||
function scrollAnimation(dom, currentY, targetY, currentX) { | |||||
let needScrollTop = targetY - currentY; | |||||
let _currentY = currentY; | |||||
setTimeout(() => { | |||||
// 一次调用滑动帧数,每次调用会不一样 | |||||
//取总距离的十分之一 | |||||
const dist = Math.ceil(needScrollTop / 10); | |||||
_currentY += dist; | |||||
//移动一个十分之一 | |||||
dom.scrollTo(currentX || 0, _currentY, 'smooth'); | |||||
// 如果移动幅度小于十个像素,直接移动,否则递归调用,实现动画效果 | |||||
if (needScrollTop > 10 || needScrollTop < -10) { | |||||
scrollAnimation(dom, _currentY, targetY) | |||||
} else { | |||||
dom.scrollTo(0, targetY, 'smooth') | |||||
} | |||||
}, 1) | |||||
} | |||||
$('.log_top').click(function () { | |||||
// let logContentDom = document.querySelector('.log') | |||||
// if(!logContentDom) | |||||
// return | |||||
// let version_name = $('.log_top').data('version') | |||||
let version_name = $(this).data('version') | |||||
let logContentDom = document.querySelector(`#log${version_name}`) | |||||
$(`#log_file${version_name}`).siblings('pre').remove() | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=&lines=50&order=asc`, (data) => { | |||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine) //如果变动就改变所对应的值 | |||||
$(`#log${version_name} input[name=start_line]`).val(data.StartLine) | |||||
$(`#log${version_name}`).prepend('<pre>' + data.Content) | |||||
$(`.message${version_name} #header`).text('您已翻阅至日志顶部') | |||||
$(`.message${version_name}`).css('display', 'block') | |||||
setTimeout(function () { | |||||
$(`.message${version_name}`).css('display', 'none') | |||||
}, 1000) | |||||
scrollAnimation(logContentDom, logContentDom.scrollTop, 0); | |||||
}) | |||||
}) | |||||
$('.log_bottom').click(function (e) { | |||||
let version_name = $(this).data('version') | |||||
let logContentDom = document.querySelector(`#log${version_name}`) | |||||
$(`#log_file${version_name}`).siblings('pre').remove() | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=&lines=50&order=desc`, (data) => { | |||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine) //如果变动就改变所对应的值 | |||||
$(`#log${version_name} input[name=start_line]`).val(data.StartLine) | |||||
$(`#log${version_name}`).append('<pre>' + data.Content) | |||||
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=${data.EndLine}&lines=50&order=desc`, (data) => { | |||||
if (data.Lines == 0) { | |||||
$(`.message${version_name} #header`).text('您已翻阅至日志底部') | |||||
$(`.message${version_name}`).css('display', 'block') | |||||
setTimeout(function () { | |||||
$(`.message${version_name}`).css('display', 'none') | |||||
}, 1000) | |||||
} else { | |||||
if (end_line === data.EndLine) { | |||||
return | |||||
} | |||||
else { | |||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine) | |||||
$(`#log${version_name}`).append('<pre>' + data.Content) | |||||
} | |||||
} | |||||
}).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
scrollAnimation(logContentDom, logContentDom.scrollTop + 1, logContentDom.scrollHeight - logContentDom.clientHeight); | |||||
}) | |||||
}) | |||||
@@ -51,18 +51,7 @@ | |||||
} | } | ||||
</style> | </style> | ||||
<!-- <div class="ui page dimmer"> | |||||
<div class="ui text loader">{{.i18n.Tr "loading"}}</div> | |||||
</div> --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -254,6 +254,10 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div data-tooltip="{{.i18n.Tr "cloudbrain.model_convert_postfix_rule"}}" data-inverted="" data-variation="mini"> | |||||
<i class="question circle icon"></i> | |||||
</div> | |||||
</div> | </div> | ||||
<div class="unite min_title inline fields required"> | <div class="unite min_title inline fields required"> | ||||
<div class="three wide field right aligned"> | <div class="three wide field right aligned"> | ||||
@@ -347,7 +351,6 @@ | |||||
return true; | return true; | ||||
} | } | ||||
} | } | ||||
$('#submitId').click(function(){ | $('#submitId').click(function(){ | ||||
let data={}; | let data={}; | ||||
data['_csrf']=csrf | data['_csrf']=csrf | ||||
@@ -166,15 +166,7 @@ td, th { | |||||
padding-top: 0.5rem ; | padding-top: 0.5rem ; | ||||
} | } | ||||
</style> | </style> | ||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
{{template "custom/global_mask" .}} | |||||
<div class="repository"> | <div class="repository"> | ||||
{{template "repo/header" .}} | {{template "repo/header" .}} | ||||
<div class="ui container"> | <div class="ui container"> | ||||
@@ -325,6 +325,7 @@ | |||||
$('#name').val(modelName) | $('#name').val(modelName) | ||||
$('#version').val("0.0.1") | $('#version').val("0.0.1") | ||||
} | } | ||||
let dirKey="isOnlyDir--:&"; | |||||
function showcreate(obj) { | function showcreate(obj) { | ||||
$('.ui.modal.second') | $('.ui.modal.second') | ||||
.modal({ | .modal({ | ||||
@@ -460,7 +461,7 @@ | |||||
var zNodes=[]; | var zNodes=[]; | ||||
var nodesMap={}; | var nodesMap={}; | ||||
for (let i=0;i<n_length;i++){ | for (let i=0;i<n_length;i++){ | ||||
parentNodeMap = nodesMap; | |||||
var parentNodeMap = nodesMap; | |||||
var fileSplits = data[i].FileName.split("/"); | var fileSplits = data[i].FileName.split("/"); | ||||
for(let j=0;j < fileSplits.length;j++){ | for(let j=0;j < fileSplits.length;j++){ | ||||
if(fileSplits[j] == ""){ | if(fileSplits[j] == ""){ | ||||
@@ -469,7 +470,22 @@ | |||||
if(parentNodeMap[fileSplits[j]] == null){ | if(parentNodeMap[fileSplits[j]] == null){ | ||||
parentNodeMap[fileSplits[j]] = {}; | parentNodeMap[fileSplits[j]] = {}; | ||||
} | } | ||||
parentNodeMap = parentNodeMap[fileSplits[j]] | |||||
parentNodeMap = parentNodeMap[fileSplits[j]]; | |||||
} | |||||
} | |||||
for (let i=0;i<n_length;i++){ | |||||
var parentNodeMap = nodesMap; | |||||
var fileSplits = data[i].FileName.split("/"); | |||||
for(let j=0;j < fileSplits.length;j++){ | |||||
if(fileSplits[j] == ""){ | |||||
if(data[i].FileName[data[i].FileName.length -1] =="/"){ | |||||
if(Object.keys(parentNodeMap).length ==0){ | |||||
parentNodeMap[dirKey]="true"; | |||||
} | |||||
} | |||||
break; | |||||
} | |||||
parentNodeMap = parentNodeMap[fileSplits[j]]; | |||||
} | } | ||||
} | } | ||||
convertToNode(zNodes,nodesMap); | convertToNode(zNodes,nodesMap); | ||||
@@ -488,12 +504,18 @@ | |||||
node["name"] = keyList[i]; | node["name"] = keyList[i]; | ||||
nodeList.push(node); | nodeList.push(node); | ||||
if(nodesMap[keyList[i]] != null && Object.keys(nodesMap[keyList[i]]).length >0){ | if(nodesMap[keyList[i]] != null && Object.keys(nodesMap[keyList[i]]).length >0){ | ||||
node["children"]=[]; | |||||
if(isFirst){ | |||||
node["open"] = true; | |||||
isFirst= false; | |||||
if(nodesMap[keyList[i]][dirKey] != null){ | |||||
node["open"] = false; | |||||
node["isParent"] = true; | |||||
}else{ | |||||
node["children"]=[]; | |||||
if(isFirst){ | |||||
node["open"] = true; | |||||
isFirst= false; | |||||
} | |||||
convertToNode(node["children"],nodesMap[keyList[i]]); | |||||
} | } | ||||
convertToNode(node["children"],nodesMap[keyList[i]]); | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -472,10 +472,15 @@ function renderBrend(ID,version_name,parents,filename,init){ | |||||
$('input[name=modelback]').val(filename) | $('input[name=modelback]').val(filename) | ||||
}else{ | }else{ | ||||
$('input[name=model]').val(parents) | $('input[name=model]').val(parents) | ||||
$('input[name=modelbac]').val(filename) | |||||
$('#file_breadcrumb a.section:contains(${filename})').nextAll().remove() | |||||
$('#file_breadcrumb a.section:contains(${filename})').replaceWith(`<div class='active section'>${filename}</div>`) | |||||
$('#file_breadcrumb div.section:contains(${filename})').append("<div class='divider'> / </div>") | |||||
$('input[name=modelback]').val(filename) | |||||
let selectEle = $('#file_breadcrumb a.section').filter( | |||||
(index, item) => { | |||||
return item.text == filename; | |||||
} | |||||
); | |||||
selectEle.nextAll().remove(); | |||||
selectEle.after("<div class='divider'> / </div>"); | |||||
selectEle.replaceWith(`<div class='active section'>${filename}</div>`); | |||||
} | } | ||||
} | } | ||||
@@ -1,14 +1,4 @@ | |||||
{{template "base/head" .}} | {{template "base/head" .}} | ||||
<!-- 弹窗 --> | |||||
<div id="mask"> | |||||
<div id="loadingPage"> | |||||
<div class="rect1"></div> | |||||
<div class="rect2"></div> | |||||
<div class="rect3"></div> | |||||
<div class="rect4"></div> | |||||
<div class="rect5"></div> | |||||
</div> | |||||
</div> | |||||
<!-- 提示框 --> | <!-- 提示框 --> | ||||
<div class="alert"></div> | <div class="alert"></div> | ||||
<div class="explore users"> | <div class="explore users"> | ||||
@@ -1,81 +1,122 @@ | |||||
<template> | <template> | ||||
<div class="dropzone-wrapper dataset-files"> | <div class="dropzone-wrapper dataset-files"> | ||||
<div id="dataset" class="dropzone"> | <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> | </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> | </el-tooltip> | ||||
</span> | |||||
<span style="flex:1" v-else><span style="color: red;">上传失败</span></span> | |||||
</div> | |||||
</div> | </div> | ||||
</div> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <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 chunkSize = 1024 * 1024 * 64; | ||||
const md5ChunkSize = 1024 * 1024 * 1; | const md5ChunkSize = 1024 * 1024 * 1; | ||||
export default { | export default { | ||||
props:{ | |||||
uploadtype:{ | |||||
type:Number, | |||||
required:true | |||||
props: { | |||||
uploadtype: { | |||||
type: Number, | |||||
required: true, | |||||
}, | |||||
desc: { | |||||
type: String, | |||||
default: "", | |||||
}, | }, | ||||
desc:{ | |||||
type:String, | |||||
default:'' | |||||
} | |||||
}, | }, | ||||
data() { | data() { | ||||
return { | return { | ||||
dropzoneUploader: null, | dropzoneUploader: null, | ||||
maxFiles: 10, | maxFiles: 10, | ||||
maxFilesize: 200 , | |||||
acceptedFiles: '*/*', | |||||
maxFilesize: 200, | |||||
acceptedFiles: "*/*", | |||||
progress: 0, | progress: 0, | ||||
status: '', | |||||
status: "", | |||||
dropzoneParams: {}, | 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() { | 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 = ` | let previewTemplate = ` | ||||
<div class="dz-preview dz-file-preview"> | <div class="dz-preview dz-file-preview"> | ||||
<div class="dz-image"> | <div class="dz-image"> | ||||
@@ -86,137 +127,146 @@ export default { | |||||
<div class="dz-filename"><span data-dz-name></span></div> | <div class="dz-filename"><span data-dz-name></span></div> | ||||
</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-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-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 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], { | const dropzoneUploader = await createDropzone($dropzone[0], { | ||||
url: '/todouploader', | |||||
url: "/todouploader", | |||||
maxFiles: this.maxFiles, | maxFiles: this.maxFiles, | ||||
maxFilesize: 1024*200, | |||||
filesizeBase:1024, | |||||
maxFilesize: 1024 * 200, | |||||
filesizeBase: 1024, | |||||
parallelUploads: this.maxFiles, | parallelUploads: this.maxFiles, | ||||
timeout: 0, | timeout: 0, | ||||
addRemoveLinks:true, | |||||
addRemoveLinks: true, | |||||
// autoQueue: false, | // autoQueue: false, | ||||
autoProcessQueue: 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; | 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); | }, 2000); | ||||
} | |||||
} | |||||
} | |||||
}, | |||||
}, | }, | ||||
methods: { | 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() { | 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) { | 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) { | 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); | // this.dropzoneUploader.emit('complete', file); | ||||
}, | }, | ||||
finishUpload(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(() => { | setTimeout(() => { | ||||
window.location.href = this.repoPath | |||||
window.location.href = this.repoPath; | |||||
}, 1000); | }, 1000); | ||||
} | } | ||||
}, | }, | ||||
@@ -231,10 +281,16 @@ export default { | |||||
fileReader = new FileReader(); | fileReader = new FileReader(); | ||||
let currentChunk = 0; | let currentChunk = 0; | ||||
const time = new Date().getTime(); | 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; | file.totalChunkCounts = chunks; | ||||
if (file.size==0) { | |||||
file.totalChunkCounts = 1 | |||||
if (file.size == 0) { | |||||
file.totalChunkCounts = 1; | |||||
} | } | ||||
loadMd5Next(); | loadMd5Next(); | ||||
@@ -242,7 +298,7 @@ export default { | |||||
fileLoaded.call(this, e); | fileLoaded.call(this, e); | ||||
}; | }; | ||||
fileReader.onerror = (err) => { | fileReader.onerror = (err) => { | ||||
console.warn('oops, something went wrong.', err); | |||||
console.warn("oops, something went wrong.", err); | |||||
file.cancel(); | file.cancel(); | ||||
}; | }; | ||||
@@ -250,11 +306,16 @@ export default { | |||||
spark.append(e.target.result); // Append array buffer | spark.append(e.target.result); // Append array buffer | ||||
currentChunk++; | currentChunk++; | ||||
if (currentChunk < chunks) { | if (currentChunk < chunks) { | ||||
this.status = `${this.dropzoneParams.data('loading-file')} ${( | |||||
this.status = `${this.dropzoneParams.data("loading-file")} ${( | |||||
(currentChunk / chunks) * | (currentChunk / chunks) * | ||||
100 | 100 | ||||
).toFixed(2)}% (${currentChunk}/${chunks})`; | ).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(); | loadMd5Next(); | ||||
return; | return; | ||||
} | } | ||||
@@ -265,7 +326,11 @@ export default { | |||||
file.size | file.size | ||||
} 用时:${(new Date().getTime() - time) / 1000} s` | } 用时:${(new Date().getTime() - time) / 1000} s` | ||||
); | ); | ||||
this.updateProgress(file,100) | |||||
// this.updateProgress( | |||||
// file, | |||||
// this.dropzoneParams.data("md5-computing"), | |||||
// 100 | |||||
// ); | |||||
spark.destroy(); // 释放缓存 | spark.destroy(); // 释放缓存 | ||||
file.uniqueIdentifier = md5; // 将文件md5赋值给文件唯一标识 | file.uniqueIdentifier = md5; // 将文件md5赋值给文件唯一标识 | ||||
file.cmd5 = false; // 取消计算md5状态 | file.cmd5 = false; // 取消计算md5状态 | ||||
@@ -289,46 +354,57 @@ export default { | |||||
async computeMD5Success(md5edFile) { | async computeMD5Success(md5edFile) { | ||||
const file = await this.getSuccessChunks(md5edFile); | const file = await this.getSuccessChunks(md5edFile); | ||||
console.log(file); | |||||
try { | try { | ||||
if (file.uploadID == '' || file.uuid == '') { | |||||
// 未上传过 | |||||
if (file.uploadID == "" || file.uuid == "") { | |||||
// 未上传过 | |||||
await this.newMultiUpload(file); | await this.newMultiUpload(file); | ||||
if (file.uploadID != '' && file.uuid != '') { | |||||
file.chunks = ''; | |||||
if (file.uploadID != "" && file.uuid != "") { | |||||
file.chunks = ""; | |||||
this.multipartUpload(file); | this.multipartUpload(file); | ||||
} else { | } 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; | ||||
} | } | ||||
return; | return; | ||||
} | } | ||||
if (file.uploaded == '1') { | |||||
// 已上传成功 | |||||
// 秒传 | |||||
if (file.attachID == '0') { | |||||
// 删除数据集记录,未删除文件 | |||||
if (file.uploaded == "1") { | |||||
// 已上传成功 | |||||
// 秒传 | |||||
if (file.attachID == "0") { | |||||
// 删除数据集记录,未删除文件 | |||||
await addAttachment(file); | await addAttachment(file); | ||||
} | } | ||||
//不同数据集上传同一个文件 | //不同数据集上传同一个文件 | ||||
if (file.datasetID != '') { | |||||
if (file.datasetID != "") { | |||||
if (file.datasetName != "" && file.realName != "") { | 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.progress = 100; | ||||
this.status = this.dropzoneParams.data('upload-complete'); | |||||
this.status = this.dropzoneParams.data("upload-complete"); | |||||
// this.finishUpload(file); | // this.finishUpload(file); | ||||
} else { | } else { | ||||
// 断点续传 | |||||
// 断点续传 | |||||
this.multipartUpload(file); | this.multipartUpload(file); | ||||
} | } | ||||
} catch (error) { | } catch (error) { | ||||
@@ -338,14 +414,14 @@ export default { | |||||
async function addAttachment(file) { | async function addAttachment(file) { | ||||
return await axios.post( | return await axios.post( | ||||
'/attachments/add', | |||||
"/attachments/add", | |||||
qs.stringify({ | qs.stringify({ | ||||
uuid: file.uuid, | uuid: file.uuid, | ||||
file_name: file.name, | file_name: file.name, | ||||
size: file.size, | size: file.size, | ||||
dataset_id: file.datasetId, | dataset_id: file.datasetId, | ||||
type: this.uploadtype, | type: this.uploadtype, | ||||
_csrf: csrf | |||||
_csrf: csrf, | |||||
}) | }) | ||||
); | ); | ||||
} | } | ||||
@@ -357,11 +433,11 @@ export default { | |||||
md5: file.uniqueIdentifier, | md5: file.uniqueIdentifier, | ||||
type: this.uploadtype, | type: this.uploadtype, | ||||
file_name: file.name, | file_name: file.name, | ||||
_csrf: csrf | |||||
} | |||||
_csrf: csrf, | |||||
}, | |||||
}; | }; | ||||
try { | 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.uploadID = response.data.uploadID; | ||||
file.uuid = response.data.uuid; | file.uuid = response.data.uuid; | ||||
file.uploaded = response.data.uploaded; | file.uploaded = response.data.uploaded; | ||||
@@ -373,13 +449,13 @@ export default { | |||||
return file; | return file; | ||||
} catch (error) { | } catch (error) { | ||||
this.emitDropzoneFailed(file); | this.emitDropzoneFailed(file); | ||||
console.log('getSuccessChunks catch: ', error); | |||||
console.log("getSuccessChunks catch: ", error); | |||||
return null; | return null; | ||||
} | } | ||||
}, | }, | ||||
async newMultiUpload(file) { | async newMultiUpload(file) { | ||||
const res = await axios.get('/attachments/new_multipart', { | |||||
const res = await axios.get("/attachments/new_multipart", { | |||||
params: { | params: { | ||||
totalChunkCounts: file.totalChunkCounts, | totalChunkCounts: file.totalChunkCounts, | ||||
md5: file.uniqueIdentifier, | md5: file.uniqueIdentifier, | ||||
@@ -387,8 +463,8 @@ export default { | |||||
fileType: file.type, | fileType: file.type, | ||||
type: this.uploadtype, | type: this.uploadtype, | ||||
file_name: file.name, | file_name: file.name, | ||||
_csrf: csrf | |||||
} | |||||
_csrf: csrf, | |||||
}, | |||||
}); | }); | ||||
file.uploadID = res.data.uploadID; | file.uploadID = res.data.uploadID; | ||||
file.uuid = res.data.uuid; | file.uuid = res.data.uuid; | ||||
@@ -403,7 +479,7 @@ export default { | |||||
fileReader = new FileReader(), | fileReader = new FileReader(), | ||||
time = new Date().getTime(); | time = new Date().getTime(); | ||||
let currentChunk = 0; | let currentChunk = 0; | ||||
let _this = this | |||||
let _this = this; | |||||
function loadNext() { | function loadNext() { | ||||
const start = currentChunk * chunkSize; | const start = currentChunk * chunkSize; | ||||
@@ -421,7 +497,7 @@ export default { | |||||
} | } | ||||
async function getUploadChunkUrl(currentChunk, partSize) { | async function getUploadChunkUrl(currentChunk, partSize) { | ||||
const res = await axios.get('/attachments/get_multipart_url', { | |||||
const res = await axios.get("/attachments/get_multipart_url", { | |||||
params: { | params: { | ||||
uuid: file.uuid, | uuid: file.uuid, | ||||
uploadID: file.uploadID, | uploadID: file.uploadID, | ||||
@@ -429,50 +505,44 @@ export default { | |||||
chunkNumber: currentChunk + 1, | chunkNumber: currentChunk + 1, | ||||
type: _this.uploadtype, | type: _this.uploadtype, | ||||
file_name: file.name, | file_name: file.name, | ||||
_csrf: csrf | |||||
} | |||||
_csrf: csrf, | |||||
}, | |||||
}); | }); | ||||
urls[currentChunk] = res.data.url; | urls[currentChunk] = res.data.url; | ||||
} | } | ||||
async function uploadMinio(url, e) { | async function uploadMinio(url, e) { | ||||
const res = await axios.put(url, e.target.result); | const res = await axios.put(url, e.target.result); | ||||
delete e.target.result | |||||
delete e.target.result; | |||||
etags[currentChunk] = res.headers.etag; | 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) { | async function updateChunk(currentChunk) { | ||||
await axios.post( | await axios.post( | ||||
'/attachments/update_chunk', | |||||
"/attachments/update_chunk", | |||||
qs.stringify({ | qs.stringify({ | ||||
uuid: file.uuid, | uuid: file.uuid, | ||||
chunkNumber: currentChunk + 1, | chunkNumber: currentChunk + 1, | ||||
etag: etags[currentChunk], | etag: etags[currentChunk], | ||||
_csrf: csrf | |||||
_csrf: csrf, | |||||
}) | }) | ||||
); | ); | ||||
} | } | ||||
@@ -481,34 +551,35 @@ export default { | |||||
if (!checkSuccessChunks()) { | if (!checkSuccessChunks()) { | ||||
const start = currentChunk * chunkSize; | const start = currentChunk * chunkSize; | ||||
const partSize = | const partSize = | ||||
start + chunkSize >= file.size ? file.size - start : chunkSize; | |||||
start + chunkSize >= file.size ? file.size - start : chunkSize; | |||||
// 获取分片上传url | // 获取分片上传url | ||||
await getUploadChunkUrl(currentChunk, partSize); | await getUploadChunkUrl(currentChunk, partSize); | ||||
if (urls[currentChunk] != '') { | |||||
if (urls[currentChunk] != "") { | |||||
// 上传到minio | // 上传到minio | ||||
//await uploadMinio(urls[currentChunk], e); | //await uploadMinio(urls[currentChunk], e); | ||||
await uploadMinioNewMethod(urls[currentChunk], e); | await uploadMinioNewMethod(urls[currentChunk], e); | ||||
if (etags[currentChunk] != '') { | |||||
// 更新数据库:分片上传结果 | |||||
if (etags[currentChunk] != "") { | |||||
// 更新数据库:分片上传结果 | |||||
//await updateChunk(currentChunk); | //await updateChunk(currentChunk); | ||||
} else { | } else { | ||||
console.log("上传到minio uploadChunk etags[currentChunk] == ''");// TODO | |||||
console.log( | |||||
"上传到minio uploadChunk etags[currentChunk] == ''" | |||||
); // TODO | |||||
} | } | ||||
} else { | } else { | ||||
console.log("uploadChunk urls[currentChunk] != ''");// TODO | |||||
console.log("uploadChunk urls[currentChunk] != ''"); // TODO | |||||
} | } | ||||
} | } | ||||
} catch (error) { | } catch (error) { | ||||
// this.emitDropzoneFailed(file); | |||||
console.log(error); | console.log(error); | ||||
//this.emitDropzoneFailed(file); | |||||
//console.log(error); | |||||
} | } | ||||
} | } | ||||
async function completeUpload() { | async function completeUpload() { | ||||
return await axios.post( | return await axios.post( | ||||
'/attachments/complete_multipart', | |||||
"/attachments/complete_multipart", | |||||
qs.stringify({ | qs.stringify({ | ||||
uuid: file.uuid, | uuid: file.uuid, | ||||
uploadID: file.uploadID, | uploadID: file.uploadID, | ||||
@@ -517,77 +588,97 @@ export default { | |||||
dataset_id: file.datasetId, | dataset_id: file.datasetId, | ||||
type: _this.uploadtype, | type: _this.uploadtype, | ||||
_csrf: csrf, | _csrf: csrf, | ||||
description:_this.desc | |||||
description: _this.desc, | |||||
}) | }) | ||||
); | ); | ||||
} | } | ||||
const successChunks = []; | const successChunks = []; | ||||
let successParts = []; | let successParts = []; | ||||
successParts = file.chunks.split(','); | |||||
successParts = file.chunks.split(","); | |||||
for (let i = 0; i < successParts.length; i++) { | 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 urls = []; // TODO const ? | ||||
const etags = []; | const etags = []; | ||||
console.log('上传分片...'); | |||||
this.status = this.dropzoneParams.data('uploading'); | |||||
console.log("上传分片..."); | |||||
this.status = this.dropzoneParams.data("uploading"); | |||||
loadNext(); | loadNext(); | ||||
fileReader.onload = async (e) => { | fileReader.onload = async (e) => { | ||||
try{ | |||||
try { | |||||
await uploadChunk(e); | await uploadChunk(e); | ||||
}catch(err){ | |||||
console.log(err) | |||||
} catch (err) { | |||||
console.log(err); | |||||
} | } | ||||
fileReader.abort(); | fileReader.abort(); | ||||
currentChunk++; | currentChunk++; | ||||
if (currentChunk < chunks) { | if (currentChunk < chunks) { | ||||
console.log( | console.log( | ||||
`第${currentChunk}个分片上传完成, 开始第${currentChunk + | |||||
1}/${chunks}个分片上传` | |||||
`第${currentChunk}个分片上传完成, 开始第${ | |||||
currentChunk + 1 | |||||
}/${chunks}个分片上传` | |||||
); | ); | ||||
this.progress = Math.ceil((currentChunk / chunks) * 100); | 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) * | (currentChunk / chunks) * | ||||
100 | 100 | ||||
).toFixed(2)}%`; | ).toFixed(2)}%`; | ||||
await loadNext(); | await loadNext(); | ||||
} else { | } else { | ||||
try{ | |||||
try { | |||||
await completeUpload(); | 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( | console.log( | ||||
`文件上传完成:${file.name} \n分片:${chunks} 大小:${ | `文件上传完成:${file.name} \n分片:${chunks} 大小:${ | ||||
file.size | file.size | ||||
} 用时:${(new Date().getTime() - time) / 1000} s` | } 用时:${(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.progress = 100; | ||||
this.status = this.dropzoneParams.data('upload-complete'); | |||||
this.status = this.dropzoneParams.data("upload-complete"); | |||||
this.finishUpload(file); | this.finishUpload(file); | ||||
} | } | ||||
}; | }; | ||||
} | |||||
} | |||||
}, | |||||
}, | |||||
}; | }; | ||||
</script> | </script> | ||||
<style> | |||||
<style scoped> | |||||
.dropzone-wrapper { | .dropzone-wrapper { | ||||
margin: 0; | margin: 0; | ||||
} | } | ||||
@@ -607,14 +698,41 @@ export default { | |||||
border-bottom: 1px solid #dadce0; | border-bottom: 1px solid #dadce0; | ||||
min-height: 0; | min-height: 0; | ||||
} | } | ||||
.upload-info{ | |||||
.upload-info { | |||||
margin-top: 1em; | margin-top: 1em; | ||||
margin-bottom: 3em; | margin-bottom: 3em; | ||||
} | } | ||||
.success{ | |||||
.success { | |||||
color: #21ba45; | color: #21ba45; | ||||
font-size: 16px; | |||||
margin-right: 0.5rem; | |||||
} | } | ||||
.failed{ | |||||
.failed { | |||||
color: red; | 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> |
@@ -14,7 +14,7 @@ export default async function initCloudrainSow() { | |||||
}; | }; | ||||
} | } | ||||
function logScroll(version_name) { | |||||
function logScroll(version_name, repoPath, ID) { | |||||
let container = document.querySelector(`#log${version_name}`); | let container = document.querySelector(`#log${version_name}`); | ||||
let scrollTop = container.scrollTop; | let scrollTop = container.scrollTop; | ||||
let scrollHeight = container.scrollHeight; | let scrollHeight = container.scrollHeight; | ||||
@@ -28,7 +28,7 @@ export default async function initCloudrainSow() { | |||||
) { | ) { | ||||
let end_line = $(`#log${version_name} input[name=end_line]`).val(); | let end_line = $(`#log${version_name} input[name=end_line]`).val(); | ||||
$.get( | $.get( | ||||
`/api/v1/repos/${userName}/${repoPath}/modelarts/inference-job/${jobID}/log?version_name=${version_name}&base_line=${end_line}&lines=50&order=desc`, | |||||
`/api/v1/repos/${repoPath}/${ID}/log?version_name=${version_name}&base_line=${end_line}&lines=50&order=desc`, | |||||
(data) => { | (data) => { | ||||
if (data.Lines == 0) { | if (data.Lines == 0) { | ||||
$(`.message${version_name} #header`).text("您已翻阅至日志底部"); | $(`.message${version_name} #header`).text("您已翻阅至日志底部"); | ||||
@@ -52,7 +52,7 @@ export default async function initCloudrainSow() { | |||||
if (scrollTop == 0 && scrollLeft == 0) { | if (scrollTop == 0 && scrollLeft == 0) { | ||||
let start_line = $(`#log${version_name} input[name=start_line]`).val(); | let start_line = $(`#log${version_name} input[name=start_line]`).val(); | ||||
$.get( | $.get( | ||||
`/api/v1/repos/${userName}/${repoPath}/modelarts/inference-job/${jobID}/log?version_name=${version_name}&base_line=${start_line}&lines=50&order=asc`, | |||||
`/api/v1/repos/${repoPath}/${ID}/log?version_name=${version_name}&base_line=${start_line}&lines=50&order=asc`, | |||||
(data) => { | (data) => { | ||||
if (data.Lines == 0) { | if (data.Lines == 0) { | ||||
$(`.message${version_name} #header`).text("您已翻阅至日志顶部"); | $(`.message${version_name} #header`).text("您已翻阅至日志顶部"); | ||||
@@ -73,7 +73,9 @@ export default async function initCloudrainSow() { | |||||
const fn = debounce(logScroll, 500); | const fn = debounce(logScroll, 500); | ||||
$(".log-scroll").scroll(function () { | $(".log-scroll").scroll(function () { | ||||
let version_name = $(this).data("version"); | let version_name = $(this).data("version"); | ||||
fn(version_name); | |||||
let ID = $(`#accordion${version_name}`).data("jobid"); | |||||
let repoPath = $(`#accordion${version_name}`).data("repopath"); | |||||
fn(version_name, repoPath, ID); | |||||
}); | }); | ||||
function scrollAnimation(dom, currentY, targetY, currentX) { | function scrollAnimation(dom, currentY, targetY, currentX) { | ||||
let needScrollTop = targetY - currentY; | let needScrollTop = targetY - currentY; | ||||
@@ -101,11 +103,14 @@ export default async function initCloudrainSow() { | |||||
// let version_name = $('.log_top').data('version') | // let version_name = $('.log_top').data('version') | ||||
let version_name = $(this).data("version"); | let version_name = $(this).data("version"); | ||||
let logContentDom = document.querySelector(`#log${version_name}`); | let logContentDom = document.querySelector(`#log${version_name}`); | ||||
let ID = $(`#accordion${version_name}`).data("jobid"); | |||||
let repoPath = $(`#accordion${version_name}`).data("repopath"); | |||||
$(`#log_file${version_name}`).siblings("pre").remove(); | $(`#log_file${version_name}`).siblings("pre").remove(); | ||||
$(".ui.inverted.active.dimmer").css("display", "block"); | |||||
$.get( | $.get( | ||||
`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=&lines=50&order=asc`, | |||||
`/api/v1/repos/${repoPath}/${ID}/log?version_name=${version_name}&base_line=&lines=50&order=asc`, | |||||
(data) => { | (data) => { | ||||
$(".ui.inverted.active.dimmer").css("display", "none"); | |||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine); //如果变动就改变所对应的值 | $(`#log${version_name} input[name=end_line]`).val(data.EndLine); //如果变动就改变所对应的值 | ||||
$(`#log${version_name} input[name=start_line]`).val(data.StartLine); | $(`#log${version_name} input[name=start_line]`).val(data.StartLine); | ||||
$(`#log${version_name}`).prepend("<pre>" + data.Content); | $(`#log${version_name}`).prepend("<pre>" + data.Content); | ||||
@@ -121,10 +126,15 @@ export default async function initCloudrainSow() { | |||||
$(".log_bottom").click(function (e) { | $(".log_bottom").click(function (e) { | ||||
let version_name = $(this).data("version"); | let version_name = $(this).data("version"); | ||||
let logContentDom = document.querySelector(`#log${version_name}`); | let logContentDom = document.querySelector(`#log${version_name}`); | ||||
let ID = $(`#accordion${version_name}`).data("jobid"); | |||||
let repoPath = $(`#accordion${version_name}`).data("repopath"); | |||||
$(`#log_file${version_name}`).siblings("pre").remove(); | $(`#log_file${version_name}`).siblings("pre").remove(); | ||||
let end_line = $(`#log${version_name} input[name=end_line]`).val(); | |||||
$(".ui.inverted.active.dimmer").css("display", "block"); | |||||
$.get( | $.get( | ||||
`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=&lines=50&order=desc`, | |||||
`/api/v1/repos/${repoPath}/${ID}/log?version_name=${version_name}&base_line=&lines=50&order=desc`, | |||||
(data) => { | (data) => { | ||||
$(".ui.inverted.active.dimmer").css("display", "none"); | |||||
if (!data.CanLogDownload) { | if (!data.CanLogDownload) { | ||||
$(`#${version_name}-log-down`) | $(`#${version_name}-log-down`) | ||||
.removeClass("ti-download-file") | .removeClass("ti-download-file") | ||||
@@ -134,8 +144,9 @@ export default async function initCloudrainSow() { | |||||
$(`#log${version_name} input[name=start_line]`).val(data.StartLine); | $(`#log${version_name} input[name=start_line]`).val(data.StartLine); | ||||
$(`#log${version_name}`).append("<pre>" + data.Content); | $(`#log${version_name}`).append("<pre>" + data.Content); | ||||
$.get( | $.get( | ||||
`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&base_line=${data.EndLine}&lines=50&order=desc`, | |||||
`/api/v1/repos/${repoPath}/${ID}/log?version_name=${version_name}&base_line=${data.EndLine}&lines=50&order=desc`, | |||||
(data) => { | (data) => { | ||||
$(".ui.inverted.active.dimmer").css("display", "none"); | |||||
if (data.Lines == 0) { | if (data.Lines == 0) { | ||||
$(`.message${version_name} #header`).text("您已翻阅至日志底部"); | $(`.message${version_name} #header`).text("您已翻阅至日志底部"); | ||||
$(`.message${version_name}`).css("display", "block"); | $(`.message${version_name}`).css("display", "block"); | ||||
@@ -143,7 +154,7 @@ export default async function initCloudrainSow() { | |||||
$(`.message${version_name}`).css("display", "none"); | $(`.message${version_name}`).css("display", "none"); | ||||
}, 1000); | }, 1000); | ||||
} else { | } else { | ||||
if (end_line === data.EndLine) { | |||||
if (end_line === data.EndLine || end_line === "") { | |||||
return; | return; | ||||
} else { | } else { | ||||
$(`#log${version_name} input[name=end_line]`).val(data.EndLine); | $(`#log${version_name} input[name=end_line]`).val(data.EndLine); | ||||
@@ -163,6 +174,49 @@ export default async function initCloudrainSow() { | |||||
); | ); | ||||
}); | }); | ||||
function loadLog(version_name) { | |||||
document.getElementById("mask").style.display = "block"; | |||||
$.get( | |||||
`/api/v1/repos/${userName}/${repoPath}/grampus/train-job/${jobID}/log?version_name=${version_name}&lines=50&order=asc`, | |||||
(data) => { | |||||
$("input[name=end_line]").val(data.EndLine); | |||||
$("input[name=start_line]").val(data.StartLine); | |||||
$(`#log_file${version_name}`).text(data.Content); | |||||
document.getElementById("mask").style.display = "none"; | |||||
} | |||||
).fail(function (err) { | |||||
document.getElementById("mask").style.display = "none"; | |||||
console.log(err); | |||||
}); | |||||
} | |||||
$("#refresh-status").click(function (e) { | |||||
let version_name = $(this).data("version"); | |||||
let ID = $(`#accordion${version_name}`).data("jobid"); | |||||
let repoPath = $(`#accordion${version_name}`).data("repopath"); | |||||
refreshStatusShow(version_name, ID, repoPath); | |||||
$(".log-info .log_bottom").trigger("click"); | |||||
e.stopPropagation(); | |||||
}); | |||||
function refreshStatusShow(version_name, ID, repoPath) { | |||||
$.get( | |||||
`/api/v1/repos/${repoPath}/${ID}?version_name=${version_name}`, | |||||
(data) => { | |||||
//accroding下的状态 | |||||
$(`#${version_name}-status-span span`).text(data.JobStatus); | |||||
//accroding下的状态图标 | |||||
$(`#${version_name}-status-span i`).attr("class", data.JobStatus); | |||||
//accroding下的运行时长 | |||||
$(`#${version_name}-duration-span`).text(data.JobDuration); | |||||
//配置信息详情页的状态 | |||||
$(`#${version_name}-status`).text(data.JobStatus); | |||||
//配置信息详情页的状态 | |||||
$(`#${version_name}-duration`).text(data.JobDuration); | |||||
} | |||||
).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
} | |||||
// | // | ||||
$(".content-pad").on("click", ".load-model-file", function () { | $(".content-pad").on("click", ".load-model-file", function () { | ||||
let downloadFlag = $(this).data("download-flag") || ""; | let downloadFlag = $(this).data("download-flag") || ""; | ||||
@@ -175,8 +229,8 @@ export default async function initCloudrainSow() { | |||||
let url = `/api/v1/repos${path}?version_name=${version_name}&parentDir=${parents}`; | let url = `/api/v1/repos${path}?version_name=${version_name}&parentDir=${parents}`; | ||||
$.get(url, (data) => { | $.get(url, (data) => { | ||||
$(`#dir_list${version_name}`).empty(); | $(`#dir_list${version_name}`).empty(); | ||||
if(data.Dirs){ | |||||
renderDir(path, data, version_name, downloadFlag, gpuFlag); | |||||
if (data.Dirs) { | |||||
renderDir(path, data, version_name, downloadFlag, gpuFlag); | |||||
} | } | ||||
if (init === "init") { | if (init === "init") { | ||||
$(`input[name=model${version_name}]`).val(""); | $(`input[name=model${version_name}]`).val(""); | ||||
@@ -191,7 +245,15 @@ export default async function initCloudrainSow() { | |||||
htmlBread += "<div class='divider'> / </div>"; | htmlBread += "<div class='divider'> / </div>"; | ||||
$(`#file_breadcrumb${version_name}`).append(htmlBread); | $(`#file_breadcrumb${version_name}`).append(htmlBread); | ||||
} else { | } else { | ||||
renderBrend(path, version_name, parents, filename, init, downloadFlag,gpuFlag); | |||||
renderBrend( | |||||
path, | |||||
version_name, | |||||
parents, | |||||
filename, | |||||
init, | |||||
downloadFlag, | |||||
gpuFlag | |||||
); | |||||
} | } | ||||
}).fail(function (err) { | }).fail(function (err) { | ||||
console.log(err, version_name); | console.log(err, version_name); | ||||
@@ -253,15 +315,15 @@ export default async function initCloudrainSow() { | |||||
} else { | } else { | ||||
$(`input[name=model${version_name}]`).val(parents); | $(`input[name=model${version_name}]`).val(parents); | ||||
$(`input[name=modelback${version_name}]`).val(filename); | $(`input[name=modelback${version_name}]`).val(filename); | ||||
$(`#file_breadcrumb${version_name} a.section:contains(${filename})`) | |||||
.nextAll() | |||||
.remove(); | |||||
$( | |||||
`#file_breadcrumb${version_name} a.section:contains(${filename})` | |||||
).replaceWith(`<div class='active section'>${filename}</div>`); | |||||
$( | |||||
`#file_breadcrumb${version_name} div.section:contains(${filename})` | |||||
).append("<div class='divider'> / </div>"); | |||||
let selectEle = $(`#file_breadcrumb${version_name} a.section`).filter( | |||||
(index, item) => { | |||||
return item.text == filename; | |||||
} | |||||
); | |||||
selectEle.nextAll().remove(); | |||||
selectEle.after("<div class='divider'> / </div>"); | |||||
selectEle.replaceWith(`<div class='active section'>${filename}</div>`); | |||||
} | } | ||||
} | } | ||||
@@ -347,33 +347,6 @@ export default async function initCloudrain() { | |||||
e.stopPropagation(); | e.stopPropagation(); | ||||
}); | }); | ||||
$("#refresh-status").click(function (e) { | |||||
let version_name = $(this).data("version"); | |||||
let ID = $(`#accordion${version_name}`).data("jobid"); | |||||
let repoPath = $(`#accordion${version_name}`).data("repopath"); | |||||
refreshStatusShow(version_name, ID, repoPath); | |||||
e.stopPropagation(); | |||||
}); | |||||
function refreshStatusShow(version_name, ID, repoPath) { | |||||
$.get( | |||||
`/api/v1/repos/${repoPath}/${ID}?version_name=${version_name}`, | |||||
(data) => { | |||||
//accroding下的状态 | |||||
$(`#${version_name}-status-span span`).text(data.JobStatus); | |||||
//accroding下的状态图标 | |||||
$(`#${version_name}-status-span i`).attr("class", data.JobStatus); | |||||
//accroding下的运行时长 | |||||
$(`#${version_name}-duration-span`).text(data.JobDuration); | |||||
//配置信息详情页的状态 | |||||
$(`#${version_name}-status`).text(data.JobStatus); | |||||
//配置信息详情页的状态 | |||||
$(`#${version_name}-duration`).text(data.JobDuration); | |||||
} | |||||
).fail(function (err) { | |||||
console.log(err); | |||||
}); | |||||
} | |||||
function refreshStatus(version_name, ID, repoPath) { | function refreshStatus(version_name, ID, repoPath) { | ||||
const url = `/api/v1/repos/${repoPath}/${ID}/?version_name${version_name}`; | const url = `/api/v1/repos/${repoPath}/${ID}/?version_name${version_name}`; | ||||
$.get(url, (data) => { | $.get(url, (data) => { | ||||
@@ -522,6 +522,60 @@ i.SUCCEEDED { | |||||
// } | // } | ||||
/* 弹窗 */ | /* 弹窗 */ | ||||
// #mask { | |||||
// position: fixed; | |||||
// top: 0px; | |||||
// left: 0px; | |||||
// right: 0px; | |||||
// bottom: 0px; | |||||
// filter: alpha(opacity=60); | |||||
// background-color: #777; | |||||
// z-index: 1000; | |||||
// display: none; | |||||
// opacity: 0.8; | |||||
// -moz-opacity: 0.5; | |||||
// padding-top: 100px; | |||||
// color: #000000; | |||||
// } | |||||
#loadingPage { | |||||
margin: 300px auto; | |||||
width: 50px; | |||||
height: 40px; | |||||
text-align: center; | |||||
font-size: 10px; | |||||
display: block; | |||||
} | |||||
#loadingPage > div { | |||||
background-color: green; | |||||
height: 100%; | |||||
width: 6px; | |||||
display: inline-block; | |||||
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
animation: sk-stretchdelay 1.2s infinite ease-in-out; | |||||
} | |||||
#loadingPage .rect2 { | |||||
-webkit-animation-delay: -1.1s; | |||||
animation-delay: -1.1s; | |||||
} | |||||
#loadingPage .rect3 { | |||||
-webkit-animation-delay: -1s; | |||||
animation-delay: -1s; | |||||
} | |||||
#loadingPage .rect4 { | |||||
-webkit-animation-delay: -0.9s; | |||||
animation-delay: -0.9s; | |||||
} | |||||
#loadingPage .rect5 { | |||||
-webkit-animation-delay: -0.8s; | |||||
animation-delay: -0.8s; | |||||
} | |||||
#mask { | #mask { | ||||
position: fixed; | position: fixed; | ||||
top: 0px; | top: 0px; | ||||
@@ -529,17 +583,29 @@ i.SUCCEEDED { | |||||
right: 0px; | right: 0px; | ||||
bottom: 0px; | bottom: 0px; | ||||
filter: alpha(opacity=60); | filter: alpha(opacity=60); | ||||
background-color: #777; | |||||
background-color: rgba(119, 119, 119, 0.8); | |||||
z-index: 1000; | z-index: 1000; | ||||
display: none; | display: none; | ||||
opacity: 0.8; | |||||
-moz-opacity: 0.5; | |||||
padding-top: 100px; | |||||
color: #000000; | color: #000000; | ||||
} | } | ||||
#loadingPage { | |||||
margin: 200px auto; | |||||
.loadingWrap { | |||||
width: 20%; | |||||
height: 25%; | |||||
border: 1px solid #bbb; | |||||
background-color: #fff; | |||||
margin: auto; | |||||
position: absolute; | |||||
left: 0; | |||||
right: 0; | |||||
top: 0; | |||||
bottom: 0; | |||||
display: flex; | |||||
justify-content: center; | |||||
align-items: center; | |||||
flex-direction: column; | |||||
border-radius: 20px; | |||||
} | |||||
#loading-page { | |||||
width: 50px; | width: 50px; | ||||
height: 40px; | height: 40px; | ||||
text-align: center; | text-align: center; | ||||
@@ -547,7 +613,7 @@ i.SUCCEEDED { | |||||
display: block; | display: block; | ||||
} | } | ||||
#loadingPage > div { | |||||
#loading-page > div { | |||||
background-color: green; | background-color: green; | ||||
height: 100%; | height: 100%; | ||||
width: 6px; | width: 6px; | ||||
@@ -556,26 +622,25 @@ i.SUCCEEDED { | |||||
animation: sk-stretchdelay 1.2s infinite ease-in-out; | animation: sk-stretchdelay 1.2s infinite ease-in-out; | ||||
} | } | ||||
#loadingPage .rect2 { | |||||
#loading-page .rect2 { | |||||
-webkit-animation-delay: -1.1s; | -webkit-animation-delay: -1.1s; | ||||
animation-delay: -1.1s; | animation-delay: -1.1s; | ||||
} | } | ||||
#loadingPage .rect3 { | |||||
#loadin-page .rect3 { | |||||
-webkit-animation-delay: -1s; | -webkit-animation-delay: -1s; | ||||
animation-delay: -1s; | animation-delay: -1s; | ||||
} | } | ||||
#loadingPage .rect4 { | |||||
#loading-page .rect4 { | |||||
-webkit-animation-delay: -0.9s; | -webkit-animation-delay: -0.9s; | ||||
animation-delay: -0.9s; | animation-delay: -0.9s; | ||||
} | } | ||||
#loadingPage .rect5 { | |||||
#loading-page .rect5 { | |||||
-webkit-animation-delay: -0.8s; | -webkit-animation-delay: -0.8s; | ||||
animation-delay: -0.8s; | animation-delay: -0.8s; | ||||
} | } | ||||
@-webkit-keyframes sk-stretchdelay { | @-webkit-keyframes sk-stretchdelay { | ||||
0%, | 0%, | ||||
40%, | 40%, | ||||