|
|
|
@@ -1,533 +1,10 @@ |
|
|
|
{{template "base/head" .}} |
|
|
|
<div class="repository"> |
|
|
|
<link rel="stylesheet" href="{{StaticUrlPrefix}}/css/vp-modelmanage-common-detail.css?v={{MD5 AppVer}}" /> |
|
|
|
<div class="repository release dataset-list view"> |
|
|
|
{{template "repo/header" .}} |
|
|
|
<style> |
|
|
|
.model_header_text{ |
|
|
|
font-size: 14px; |
|
|
|
color: #101010; |
|
|
|
font-weight: bold; |
|
|
|
} |
|
|
|
.ti_form{ |
|
|
|
text-align: left; |
|
|
|
max-width: 100%; |
|
|
|
vertical-align: middle; |
|
|
|
} |
|
|
|
.ti-text-form-label { |
|
|
|
padding-bottom: 20px; |
|
|
|
padding-right: 20px; |
|
|
|
color: #8a8e99; |
|
|
|
font-size: 14px; |
|
|
|
white-space: nowrap !important; |
|
|
|
width: 80px; |
|
|
|
line-height: 30px; |
|
|
|
} |
|
|
|
.ti-text-form-content { |
|
|
|
line-height: 30px; |
|
|
|
padding-bottom: 20px; |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
.change-version{ |
|
|
|
min-width: auto !important; |
|
|
|
border: 1px solid rgba(187, 187, 187, 100) !important; |
|
|
|
border-radius: .38571429rem !important; |
|
|
|
margin-left: 1.5em; |
|
|
|
} |
|
|
|
.title-word-elipsis{ |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
width: 30%; |
|
|
|
} |
|
|
|
.word-elipsis{ |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
padding-right: 80px; |
|
|
|
} |
|
|
|
.half-table{ |
|
|
|
width: 50%; |
|
|
|
float: left; |
|
|
|
} |
|
|
|
.text-width80 { |
|
|
|
width: 100px; |
|
|
|
line-height: 30px; |
|
|
|
} |
|
|
|
.tableStyle{ |
|
|
|
width:100%; |
|
|
|
table-layout: fixed; |
|
|
|
} |
|
|
|
.iword-elipsis{ |
|
|
|
display: inline-block; |
|
|
|
width: 80%; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
</style> |
|
|
|
<div class="ui container"> |
|
|
|
<h4 class="ui header" id="vertical-segment"> |
|
|
|
<!-- <a href="javascript:window.history.back();"><i class="arrow left icon"></i>返回</a> --> |
|
|
|
<div class="ui breadcrumb"> |
|
|
|
<a class="section" href="{{$.RepoLink}}/modelmanage/show_model"> |
|
|
|
{{$.i18n.Tr "repo.model.manage.model_manage"}} |
|
|
|
</a> |
|
|
|
<div class="divider"> / </div> |
|
|
|
<div class="active section">{{.name}}</div> |
|
|
|
</div> |
|
|
|
<select class="ui dropdown tiny change-version" id="dropdown" onchange="changeInfo(this.value)"> |
|
|
|
</select> |
|
|
|
</h4> |
|
|
|
<div id="showInfo" style="border:1px solid #e2e2e2;padding: 20px 60px;margin-top:24px"> |
|
|
|
<div class="ui pointing secondary menu" style="border-bottom: 1px solid rgba(34,36,38,.15);"> |
|
|
|
|
|
|
|
<a class="active item" data-tab="first">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a> |
|
|
|
|
|
|
|
<a class="item" data-tab="second">{{$.i18n.Tr "repo.model_download"}}</a> |
|
|
|
</div> |
|
|
|
<div class="ui tab active" data-tab="first"> |
|
|
|
<div class="half-table"> |
|
|
|
<span class="model_header_text">{{$.i18n.Tr "repo.model.manage.baseinfo"}}</span> |
|
|
|
<table class="tableStyle" style="margin-top:20px;"> |
|
|
|
<tbody> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.model_name"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="modelName" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.version"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="version" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.migrate_items_labels"}}</td> |
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div id="label" style="overflow: hidden;width: 95%;"> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.model_size"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="size" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.createtime"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="createTime" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.description"}}</td> |
|
|
|
<td class="ti-text-form-content" > |
|
|
|
<div id="edit-td" style="display:flex"> |
|
|
|
<span id="description" title="" class="iword-elipsis"></span> |
|
|
|
<i id="edit-pencil" data-id="" data-desc="" class="pencil alternate icon" style="cursor:pointer;vertical-align: top;" id="editor" onclick="editorFn(this)"></i> |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"> |
|
|
|
<a id="displayJobNameHref" class="title" style="font-size: 14px;" target="_blank"> |
|
|
|
<span id="displayJobName" class="fitted" style="width: 90%;vertical-align: middle;"></span> |
|
|
|
</a> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.code_version"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="codeBranch" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.start_file"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="bootFile" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.train_dataset"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="datasetName" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.run_parameter"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="parameters" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.AI_Engine"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="engineName" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.standard"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="flavorName" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.modelarts.train_job.compute_node"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="workServerNumber" title=""></span></td> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
<div class="half-table"> |
|
|
|
<span class="model_header_text">{{$.i18n.Tr "repo.model.manage.model_accuracy"}}</span> |
|
|
|
<table class="tableStyle" style="margin-top:20px;"> |
|
|
|
<tbody> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.Accuracy"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="Accuracy" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">F1</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="F1" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.Precision"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="Precision" title=""></span></td> |
|
|
|
</tr> |
|
|
|
<tr> |
|
|
|
<td class="ti-text-form-label text-width80">{{$.i18n.Tr "repo.model.manage.Recall"}}</td> |
|
|
|
<td class="ti-text-form-content word-elipsis"><span id="Recall" title=""></span></td> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
<div style="clear: both;"></div> |
|
|
|
</div> |
|
|
|
<div class="ui tab" data-tab="second"> |
|
|
|
<input type="hidden" name="model" value="-1"> |
|
|
|
<input type="hidden" name="modelback" value="-1"> |
|
|
|
<div class='ui breadcrumb model_file_bread' id='file_breadcrumb'> |
|
|
|
<div class="active section"></div> |
|
|
|
<div class="divider"> / </div> |
|
|
|
</div> |
|
|
|
<div id="dir_list"> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div id="__vue-root"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<script src="{{StaticUrlPrefix}}/js/vp-modelmanage-common-detail.js?v={{MD5 AppVer}}"></script> |
|
|
|
{{template "base/footer" .}} |
|
|
|
<script> |
|
|
|
let url = location.href.split('show_model')[0] |
|
|
|
let trainJobUrl =url.split('modelmanage')[0] |
|
|
|
let ID = location.search.split('?name=').pop() |
|
|
|
$(document).ready(function(){ |
|
|
|
$('.secondary.menu .item').tab(); |
|
|
|
}); |
|
|
|
$(document).ready(loadInfo); |
|
|
|
function changeInfo(version){ |
|
|
|
$.get(`${url}show_model_info_api?name=${ID}`,(data)=>{ |
|
|
|
let versionData = data.filter((item)=>{ |
|
|
|
return item.version === version |
|
|
|
}) |
|
|
|
let returnArray = [] |
|
|
|
returnArray = transObj(versionData) |
|
|
|
let [initObj,initModelAcc,id] = returnArray |
|
|
|
editorCancel('','') |
|
|
|
renderInfo(initObj,initModelAcc,id) |
|
|
|
loadModelFile(versionData[0].id,versionData[0].version,'','','init') |
|
|
|
}) |
|
|
|
} |
|
|
|
function loadInfo(){ |
|
|
|
$.get(`${url}show_model_info_api?name=${ID}`,(data)=>{ |
|
|
|
let html = '' |
|
|
|
for (let i=0;i<data.length;i++){ |
|
|
|
if(!data[i].isCanOper){ |
|
|
|
$("#edit-pencil").css("display","none") |
|
|
|
} |
|
|
|
html += `<option value="${data[i].version}">${data[i].version}</option>` |
|
|
|
} |
|
|
|
$('#dropdown').append(html) |
|
|
|
let returnArray = [] |
|
|
|
returnArray = transObj(data) |
|
|
|
let [initObj,initModelAcc,id] = returnArray |
|
|
|
renderInfo(initObj,initModelAcc,id) |
|
|
|
loadModelFile(data[0].id,data[0].version,'','','init') |
|
|
|
}) |
|
|
|
} |
|
|
|
function getEngineName(model){ |
|
|
|
if(model.engine == 0){ |
|
|
|
return "PyTorch"; |
|
|
|
}else if(model.engine == 1 || model.engine == 121 || model.engine == 38){ |
|
|
|
return "TensorFlow"; |
|
|
|
}else if(model.engine == 2 || model.engine == 122 || model.engine == 35 || model.engine == 37){ |
|
|
|
return "MindSpore"; |
|
|
|
}else if(model.engine == 3){ |
|
|
|
return "Other"; |
|
|
|
}else if(model.engine == 4){ |
|
|
|
return "PaddlePaddle"; |
|
|
|
}else if(model.engine == 5){ |
|
|
|
return "OneFlow"; |
|
|
|
}else if(model.engine == 6){ |
|
|
|
return "MXNet"; |
|
|
|
} |
|
|
|
else{ |
|
|
|
return "Other" |
|
|
|
} |
|
|
|
} |
|
|
|
function transObj(data){ |
|
|
|
let {id,name,version,label,size,description,createdUnix,accuracy,codeBranch,codeCommitID,trainTaskInfo} = data[0] |
|
|
|
let modelAcc = JSON.parse(accuracy || '{}') |
|
|
|
trainTaskInfo = JSON.parse(trainTaskInfo || '{}') |
|
|
|
let engineName = getEngineName(data[0]) |
|
|
|
parameters = JSON.parse(trainTaskInfo.Parameters || '{}') |
|
|
|
parameters = parameters.parameter && parameters.parameter.length === 0 ? '--':parameters.parameter |
|
|
|
size = tranSize(size) |
|
|
|
let time = transTime(createdUnix) |
|
|
|
let initObj = { |
|
|
|
modelName:name || '--', |
|
|
|
version:version, |
|
|
|
label:label || '--', |
|
|
|
size:size, |
|
|
|
createTime:time, |
|
|
|
description:description || '--', |
|
|
|
codeBranch:codeBranch || '--', |
|
|
|
codeCommitID:codeCommitID || '--', |
|
|
|
bootFile:trainTaskInfo.BootFile || '--', |
|
|
|
datasetName:trainTaskInfo.DatasetName || '--', |
|
|
|
parameters:trainTaskInfo.Parameters || '--', |
|
|
|
flavorName:trainTaskInfo.FlavorName || '--', |
|
|
|
workServerNumber:trainTaskInfo.WorkServerNumber || '--', |
|
|
|
parameters:parameters, |
|
|
|
engineName:engineName, |
|
|
|
displayJobName:trainTaskInfo.DisplayJobName || '--', |
|
|
|
trainJobVersionName:trainTaskInfo.VersionName || '', |
|
|
|
cloudBrainJobID:trainTaskInfo.JobID|| '', |
|
|
|
cloudBrainType:trainTaskInfo.Type, |
|
|
|
} |
|
|
|
let initModelAcc = { |
|
|
|
Accuracy: modelAcc.Accuracy || '--', |
|
|
|
F1: modelAcc.F1 || '--', |
|
|
|
Precision:modelAcc.Precision || '--', |
|
|
|
Recall: modelAcc.Recall || '--' |
|
|
|
} |
|
|
|
return [initObj,initModelAcc,id] |
|
|
|
|
|
|
|
} |
|
|
|
function transTime(time){ |
|
|
|
let date = new Date(time * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000 |
|
|
|
let Y = date.getFullYear() + '-'; |
|
|
|
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1):date.getMonth()+1) + '-'; |
|
|
|
let D = (date.getDate()< 10 ? '0'+date.getDate():date.getDate())+ ' '; |
|
|
|
let h = (date.getHours() < 10 ? '0'+date.getHours():date.getHours())+ ':'; |
|
|
|
let m = (date.getMinutes() < 10 ? '0'+date.getMinutes():date.getMinutes()) + ':'; |
|
|
|
let s = date.getSeconds() < 10 ? '0'+date.getSeconds():date.getSeconds(); |
|
|
|
return Y+M+D+h+m+s; |
|
|
|
} |
|
|
|
function tranSize(value){ |
|
|
|
if(null==value||value==''){ |
|
|
|
return "0 Bytes"; |
|
|
|
} |
|
|
|
var unitArr = new Array("Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"); |
|
|
|
var index=0; |
|
|
|
var srcsize = parseFloat(value); |
|
|
|
index=Math.floor(Math.log(srcsize)/Math.log(1024)); |
|
|
|
var size =srcsize/Math.pow(1024,index); |
|
|
|
size=size.toFixed(2);//保留的小数位数 |
|
|
|
return size+unitArr[index]; |
|
|
|
} |
|
|
|
function editorFn(context){ |
|
|
|
let id= context.dataset.id |
|
|
|
let text = context.dataset.desc |
|
|
|
let textValue = text.replace(/enter;/g,'\r\n') |
|
|
|
$('#edit-td').replaceWith(`<div id='edit-div' style='width:80%;display: inline-block;'><textarea id='textarea-value' value='' rows='3' maxlength='255' style='width:80%;white-space: nowrap;' id='edit-text'>${textValue}</textarea><i class='check icon' style='color: #50d4ab;' onclick='editorSure("${text}","${id}")'></i><i class='times icon' style='color: #f66f6a;' onclick='editorCancel("${text}","${id}")'></i></div>`); |
|
|
|
} |
|
|
|
function editorCancel(text,id){ |
|
|
|
let objkey = text.replace(/enter;/g,'\r\n') |
|
|
|
$('#edit-div').replaceWith(`<div id="edit-td" style="display:flex;"><span id="Description" title="${objkey}" class="iword-elipsis">${objkey}</span><i id="edit-pencil" data-id="${id}" data-desc="${text}" class="pencil alternate icon" style="cursor:pointer;vertical-align: top;" id="editor" onclick="editorFn(this)"></div>`) |
|
|
|
} |
|
|
|
function editorSure(text,id){ |
|
|
|
let description=$('#textarea-value').val() |
|
|
|
let sourcetext = $('#textarea-value').val().replace(/\n/g,'enter;') |
|
|
|
let data = { |
|
|
|
id:id, |
|
|
|
description:description |
|
|
|
} |
|
|
|
$.ajax({ |
|
|
|
url:`${url}modify_model`, |
|
|
|
type:'PUT', |
|
|
|
data:data |
|
|
|
}).done((res)=>{ |
|
|
|
$('#edit-div').replaceWith(`<div id="edit-td" style="display:flex;"><span id="Description" title="${description}" class="iword-elipsis">${description}</span><i id="edit-pencil" data-id="${id}" data-desc="${sourcetext}" class="pencil alternate icon" style="cursor:pointer;vertical-align: top;" id="editor" onclick="editorFn(this)"></div>`) |
|
|
|
}) |
|
|
|
} |
|
|
|
function renderInfo(obj,accObj,id){ |
|
|
|
for(let key in obj){ |
|
|
|
if(key==="description"){ |
|
|
|
let descriptionText=obj[key].replace(/\r\n|\n/g,'enter;') |
|
|
|
$(`#${key}`).text(obj[key]) |
|
|
|
$(`#${key}`).attr("title",obj[key]) |
|
|
|
$('#edit-pencil').attr("data-id",id) |
|
|
|
$('#edit-pencil').attr("data-desc",descriptionText) |
|
|
|
} |
|
|
|
else if(key==="label"){ |
|
|
|
$('#Label').empty() |
|
|
|
if(obj[key]==='--'){ |
|
|
|
$('#Label').text(obj[key]) |
|
|
|
}else{ |
|
|
|
|
|
|
|
let labelArray = obj[key].trim().replace(/ +/g,' ').split(' ') |
|
|
|
let html='' |
|
|
|
for(let i=0;i<labelArray.length;i++){ |
|
|
|
html += `<a class="ui label" title="${labelArray[i]}">${labelArray[i]}</a>` |
|
|
|
} |
|
|
|
$('#Label').append(html) |
|
|
|
} |
|
|
|
} |
|
|
|
else if(key==="codeCommitID"){ |
|
|
|
let codeCommit = obj[key].slice(0,10) |
|
|
|
let html = `<a style="margin-left:1rem" class="ui label" title="${codeCommit}">${codeCommit}</a>` |
|
|
|
$('#CodeBranch').append(html) |
|
|
|
|
|
|
|
} |
|
|
|
else if(key==="displayJobName"){ |
|
|
|
let type=obj["cloudBrainType"] |
|
|
|
let href="" |
|
|
|
if(type==1){ |
|
|
|
href=trainJobUrl + "modelarts/train-job/" + obj["cloudBrainJobID"] |
|
|
|
}else if(type==0){ |
|
|
|
href=trainJobUrl + "cloudbrain/train-job/" + obj["cloudBrainJobID"] |
|
|
|
}else if(type==2){ |
|
|
|
href=trainJobUrl + "grampus/train-job/" + obj["CloudBrainJobID"] |
|
|
|
} |
|
|
|
$(`#displayJobNameHref`).attr("href",href) |
|
|
|
$(`#displayJobNameHref`).attr("title",obj[key]) |
|
|
|
$(`#${key}`).text(obj[key]) |
|
|
|
|
|
|
|
let versionName = obj["trainJobVersionName"] |
|
|
|
if(versionName!=""){ |
|
|
|
let html = `<span style="margin-left:1rem" class="ui label">${versionName}</span>` |
|
|
|
$('#displayJobName').append(html) |
|
|
|
} |
|
|
|
} |
|
|
|
else if(key==="parameters"){ |
|
|
|
if(obj[key]==='--'){ |
|
|
|
$(`#${key}`).text(obj[key]) |
|
|
|
}else{ |
|
|
|
const parameterArray = (obj[key] || []).map(element => { |
|
|
|
let labelValue = `${element.label}=${element.value}` |
|
|
|
return labelValue |
|
|
|
}); |
|
|
|
const parameter = parameterArray.join('; ') |
|
|
|
$(`#${key}`).text(parameter) |
|
|
|
$(`#${key}`).attr("title",parameter) |
|
|
|
} |
|
|
|
} |
|
|
|
else{ |
|
|
|
$(`#${key}`).text(obj[key]) |
|
|
|
$(`#${key}`).attr("title",obj[key]) |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
for(let key in accObj){ |
|
|
|
$(`#${key}`).text(accObj[key]) |
|
|
|
$(`#${key}`).attr("title",accObj[key]) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function loadModelFile(ID,version_name,parents,filename,init){ |
|
|
|
$.get(`${url}query_onelevel_modelfile?ID=${ID}&parentDir=${parents}`, (data) => { |
|
|
|
$('#dir_list').empty() |
|
|
|
renderDir(data,ID,version_name) |
|
|
|
if(init==="init"){ |
|
|
|
$('input[name=model]').val("") |
|
|
|
$('input[name=modelback]').val(version_name) |
|
|
|
$('#file_breadcrumb').empty() |
|
|
|
let htmlBread = "" |
|
|
|
htmlBread += `<div class='active section'>${version_name}</div>` |
|
|
|
htmlBread += "<div class='divider'> / </div>" |
|
|
|
$('#file_breadcrumb').append(htmlBread) |
|
|
|
}else{ |
|
|
|
renderBrend(ID,version_name,parents,filename,init) |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
function renderSize(value){ |
|
|
|
if(null==value||value==''){ |
|
|
|
return "0 Bytes"; |
|
|
|
} |
|
|
|
var unitArr = new Array("Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"); |
|
|
|
var index=0; |
|
|
|
var srcsize = parseFloat(value); |
|
|
|
index=Math.floor(Math.log(srcsize)/Math.log(1024)); |
|
|
|
var size =srcsize/Math.pow(1024,index); |
|
|
|
size=size.toFixed(2);//保留的小数位数 |
|
|
|
return size+unitArr[index]; |
|
|
|
} |
|
|
|
|
|
|
|
function renderBrend(ID,version_name,parents,filename,init){ |
|
|
|
if(init=="folder"){ |
|
|
|
let htmlBrend = "" |
|
|
|
let sectionName=$('#file_breadcrumb .active.section').text() |
|
|
|
let parents1 = $('input[name=model]').val() |
|
|
|
let filename1 = $('input[name=modelback]').val() |
|
|
|
if(parents1===""){ |
|
|
|
$('#file_breadcrumb .active.section').replaceWith(`<a class='section' onclick="loadModelFile('${ID}','${version_name}','${parents1}','','init')">${sectionName}</a>`) |
|
|
|
}else{ |
|
|
|
$('#file_breadcrumb .active.section').replaceWith(`<a class='section' onclick="loadModelFile('${ID}','${version_name}','${parents1}','${filename1}')">${sectionName}</a>`) |
|
|
|
} |
|
|
|
|
|
|
|
htmlBrend += `<div class='active section'>${filename}</div>` |
|
|
|
htmlBrend += "<div class='divider'> / </div>" |
|
|
|
$('#file_breadcrumb').append(htmlBrend) |
|
|
|
$('input[name=model]').val(parents) |
|
|
|
$('input[name=modelback]').val(filename) |
|
|
|
}else{ |
|
|
|
$('input[name=model]').val(parents) |
|
|
|
$('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>`); |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
function renderDir(data,ID,version_name){ |
|
|
|
let html="" |
|
|
|
html += "<div class='ui grid' style='margin:0;'>" |
|
|
|
html += "<div class='row' style='padding: 0;'>" |
|
|
|
html += "<div class='ui sixteen wide column' style='padding:1rem;'>" |
|
|
|
html += "<div class='dir list'>" |
|
|
|
html += "<table id='repo-files-table' class='ui single line table pad20'>" |
|
|
|
html += '<tbody>' |
|
|
|
for(let i=0;i<data.length;i++){ |
|
|
|
let dirs_size = renderSize(data[i].Size) |
|
|
|
html += "<tr>" |
|
|
|
html += "<td class='name six wid'>" |
|
|
|
html += "<span class='truncate'>" |
|
|
|
html += "<span class='octicon octicon-file-directory'>" |
|
|
|
html += "</span>" |
|
|
|
if(data[i].IsDir){ |
|
|
|
html += `<a onclick="loadModelFile('${ID}','${version_name}','${data[i].ParenDir}','${data[i].FileName}','folder')">` |
|
|
|
html += "<span class='fitted'><i class='folder icon' width='16' height='16' aria-hidden='true'></i>" + data[i].FileName + "</span>" |
|
|
|
}else{ |
|
|
|
html += `<a href="${url}${ID}/downloadsingle?parentDir=${data[i].ParenDir}&fileName=${data[i].FileName}">` |
|
|
|
html += "<span class='fitted'><i class='file icon' width='16' height='16' aria-hidden='true'></i>" + data[i].FileName + "</span>" |
|
|
|
} |
|
|
|
html += '</a>' |
|
|
|
html += "</span>" |
|
|
|
html += "</td>" |
|
|
|
html += "<td class='message seven wide'>" |
|
|
|
if(data[i].IsDir){ |
|
|
|
html += "<span class='truncate has-emoji'></span>" |
|
|
|
}else{ |
|
|
|
html += "<span class='truncate has-emoji'>"+ `${dirs_size}` + "</span>" |
|
|
|
} |
|
|
|
|
|
|
|
html += "</td>" |
|
|
|
|
|
|
|
html += "<td class='text right age three wide'>" |
|
|
|
html += "<span class='truncate has-emoji'>" + data[i].ModTime + "</span>" |
|
|
|
html += "</td>" |
|
|
|
html += "</tr>" |
|
|
|
|
|
|
|
} |
|
|
|
html += "</tbody>" |
|
|
|
html += "</table>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
$('#dir_list').append(html) |
|
|
|
} |
|
|
|
</script> |
chenshihai
2 years ago