|
|
|
@@ -0,0 +1,866 @@ |
|
|
|
{{template "base/head" .}} |
|
|
|
<style> |
|
|
|
.according-panel-heading{ |
|
|
|
box-sizing: border-box; |
|
|
|
padding: 8px 16px; |
|
|
|
color: #252b3a; |
|
|
|
background-color: #f2f5fc; |
|
|
|
line-height: 1.5; |
|
|
|
cursor: pointer; |
|
|
|
-moz-user-select: none; |
|
|
|
-webkit-user-select: none; |
|
|
|
-ms-user-select: none; |
|
|
|
-khtml-user-select: none; |
|
|
|
user-select: none; |
|
|
|
} |
|
|
|
.accordion-panel-title { |
|
|
|
margin-top: 0; |
|
|
|
margin-bottom: 0; |
|
|
|
color: #252b3a; |
|
|
|
} |
|
|
|
.accordion-panel-title-content{ |
|
|
|
vertical-align: middle; |
|
|
|
display: inline-block; |
|
|
|
width: calc(100% - 32px); |
|
|
|
cursor: default; |
|
|
|
} |
|
|
|
.acc-margin-bottom { |
|
|
|
margin-bottom: 5px; |
|
|
|
} |
|
|
|
.title_text { |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
.ac-display-inblock { |
|
|
|
display: inline-block; |
|
|
|
} |
|
|
|
.cti-mgRight-sm { |
|
|
|
margin-right: 8px; |
|
|
|
} |
|
|
|
.ac-text-normal { |
|
|
|
font-size: 14px; |
|
|
|
color: #575d6c; |
|
|
|
} |
|
|
|
.uc-accordionTitle-black { |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
.accordion-border{ |
|
|
|
border:1px solid #cce2ff; |
|
|
|
} |
|
|
|
.padding0{ |
|
|
|
padding: 0 !important; |
|
|
|
} |
|
|
|
.content-pad{ |
|
|
|
padding: 15px 35px; |
|
|
|
} |
|
|
|
.content-margin{ |
|
|
|
margin:10px 5px ; |
|
|
|
} |
|
|
|
.tab_2_content { |
|
|
|
min-height: 360px; |
|
|
|
margin-left: 10px; |
|
|
|
} |
|
|
|
.ac-grid { |
|
|
|
display: block; |
|
|
|
*zoom: 1; |
|
|
|
} |
|
|
|
.ac-grid-col { |
|
|
|
float: left; |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
.ac-grid-col2 .ac-grid-col { |
|
|
|
width: 50%; |
|
|
|
} |
|
|
|
.ti-form { |
|
|
|
text-align: left; |
|
|
|
max-width: 100%; |
|
|
|
vertical-align: middle; |
|
|
|
} |
|
|
|
.ti-form>tbody { |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
.ti-form>tbody, .ti-form>tbody>tr { |
|
|
|
vertical-align: inherit; |
|
|
|
} |
|
|
|
.ti-text-form-label { |
|
|
|
|
|
|
|
padding-bottom: 20px; |
|
|
|
padding-right: 20px; |
|
|
|
color: #8a8e99; |
|
|
|
font-size: 12px; |
|
|
|
white-space: nowrap !important; |
|
|
|
width: 80px; |
|
|
|
line-height: 30px; |
|
|
|
} |
|
|
|
.ti-text-form-content{ |
|
|
|
line-height: 30px; |
|
|
|
padding-bottom: 20px; |
|
|
|
} |
|
|
|
.ti-form>tbody>tr>td { |
|
|
|
vertical-align: top; |
|
|
|
white-space: normal; |
|
|
|
} |
|
|
|
td, th { |
|
|
|
padding: 0; |
|
|
|
} |
|
|
|
.ac-grid-col .text-span { |
|
|
|
width: 450px; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
.redo-color{ |
|
|
|
color: #3291F8; |
|
|
|
} |
|
|
|
.ti-action-menu-item:not(:last-child){ |
|
|
|
margin-right: 10px; |
|
|
|
padding-right: 11px; |
|
|
|
text-decoration: none!important; |
|
|
|
color: #526ecc; |
|
|
|
cursor: pointer; |
|
|
|
display: inline-block; |
|
|
|
-moz-user-select: none; |
|
|
|
-webkit-user-select: none; |
|
|
|
-ms-user-select: none; |
|
|
|
-khtml-user-select: none; |
|
|
|
user-select: none; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
.ti-action-menu-item:not(:last-child):after { |
|
|
|
content: ""; |
|
|
|
display: inline-block; |
|
|
|
position: absolute; |
|
|
|
height: 12px; |
|
|
|
right: 0; |
|
|
|
top: 50%; |
|
|
|
-webkit-transform: translateY(-6px); |
|
|
|
-ms-transform: translateY(-6px); |
|
|
|
-o-transform: translateY(-6px); |
|
|
|
transform: translateY(-6px); |
|
|
|
border-right: 1px solid #dfe1e6; |
|
|
|
} |
|
|
|
.text-width80{ |
|
|
|
width: 100px; |
|
|
|
line-height: 30px; |
|
|
|
} |
|
|
|
.border-according{ |
|
|
|
border: 1px solid #dfe1e6; |
|
|
|
} |
|
|
|
.disabled { |
|
|
|
cursor: default; |
|
|
|
pointer-events: none; |
|
|
|
color: rgba(0,0,0,.6) !important; |
|
|
|
opacity: .45 !important; |
|
|
|
} |
|
|
|
.pad20{ |
|
|
|
|
|
|
|
border:0px !important; |
|
|
|
} |
|
|
|
.model_file_bread{ |
|
|
|
margin-bottom: -0.5rem !important; |
|
|
|
padding-left: 1rem; |
|
|
|
padding-top: 0.5rem ; |
|
|
|
} |
|
|
|
</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"> |
|
|
|
{{template "repo/header" .}} |
|
|
|
<div class="ui container"> |
|
|
|
<h4 class="ui header" id="vertical-segment"> |
|
|
|
<div class="ui breadcrumb"> |
|
|
|
<a class="section" href="{{.RepoLink}}/cloudbrain"> |
|
|
|
{{.i18n.Tr "repo.cloudbrain"}} |
|
|
|
</a> |
|
|
|
<div class="divider"> / </div> |
|
|
|
<a class="section" href="{{$.RepoLink}}/modelarts/train-job"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job"}} |
|
|
|
</a> |
|
|
|
<div class="divider"> / </div> |
|
|
|
<div class="active section">{{.jobName}}</div> |
|
|
|
</div> |
|
|
|
</h4> |
|
|
|
{{range $k ,$v := .version_list_task}} |
|
|
|
<div class="ui accordion border-according" id="accordion{{.VersionName}}" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.JobID}}" data-version="{{.VersionName}}"> |
|
|
|
<div class="{{if eq $k 0}}active{{end}} title padding0"> |
|
|
|
<div class="according-panel-heading"> |
|
|
|
<div class="accordion-panel-title"> |
|
|
|
<i class="dropdown icon"></i> |
|
|
|
<span class="accordion-panel-title-content"> |
|
|
|
<span> |
|
|
|
<div style="float: right;"> |
|
|
|
{{$.CsrfTokenHtml}} |
|
|
|
{{if and (.CanModify) (eq .Status "COMPLETED")}} |
|
|
|
<a class="ti-action-menu-item" onclick="showcreate({{.}})">{{$.i18n.Tr "repo.modelarts.create_model"}}</a> |
|
|
|
{{else}} |
|
|
|
<a class="ti-action-menu-item disabled">{{$.i18n.Tr "repo.modelarts.create_model"}}</a> |
|
|
|
{{end}} |
|
|
|
{{$.CsrfTokenHtml}} |
|
|
|
{{if .CanModify}} |
|
|
|
<a class="ti-action-menu-item" href="{{$.RepoLink}}/modelarts/train-job/{{.JobID}}/create_version?version_name={{.VersionName}}">{{$.i18n.Tr "repo.modelarts.modify"}}</a> |
|
|
|
{{else}} |
|
|
|
<a class="ti-action-menu-item disabled" href="{{$.RepoLink}}/modelarts/train-job/{{.JobID}}/create_version?version_name={{.VersionName}}">{{$.i18n.Tr "repo.modelarts.modify"}}</a> |
|
|
|
{{end}} |
|
|
|
{{$.CsrfTokenHtml}} |
|
|
|
{{if .CanDel}} |
|
|
|
<a class="ti-action-menu-item {{if eq .Status "KILLED" "FAILED" "START_FAILED" "KILLING" "COMPLETED"}}disabled {{end}}" id="{{.VersionName}}-stop" onclick="stopVersion({{.VersionName}})">{{$.i18n.Tr "repo.stop"}}</a> |
|
|
|
{{else}} |
|
|
|
<a class="ti-action-menu-item disabled" id="{{.VersionName}}-stop" onclick="stopVersion({{.VersionName}})">{{$.i18n.Tr "repo.stop"}}</a> |
|
|
|
{{end}} |
|
|
|
|
|
|
|
{{$.CsrfTokenHtml}} |
|
|
|
{{if .CanDel}} |
|
|
|
<a class="ti-action-menu-item" onclick="deleteVersion({{.VersionName}})" style="color: #FF4D4F;">{{$.i18n.Tr "repo.delete"}}</a> |
|
|
|
{{else}} |
|
|
|
<a class="ti-action-menu-item disabled" onclick="deleteVersion({{.VersionName}})" style="color: #FF4D4F;">{{$.i18n.Tr "repo.delete"}}</a> |
|
|
|
{{end}} |
|
|
|
</div> |
|
|
|
<div class="ac-display-inblock title_text acc-margin-bottom"> |
|
|
|
|
|
|
|
<span class="cti-mgRight-sm">{{TimeSinceUnix1 .Cloudbrain.CreatedUnix}}</span> |
|
|
|
<span class="cti-mgRight-sm"> {{$.i18n.Tr "repo.modelarts.current_version"}}：{{.VersionName}}</span> |
|
|
|
<span class="cti-mgRight-sm"> {{$.i18n.Tr "repo.modelarts.parent_version"}}：{{.PreVersionName}}</span> |
|
|
|
<span class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.status"}}： |
|
|
|
<span id="{{.VersionName}}-status-span"><i id="icon" style="vertical-align: middle;" class="{{.Status}}"></i><span id="text" style="margin-left: 0.4em;font-size: 12px;">{{.Status}}</span></span> |
|
|
|
</span> |
|
|
|
<span class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}：</span> |
|
|
|
<span class="cti-mgRight-sm uc-accordionTitle-black" id="{{.VersionName}}-duration-span">{{.TrainJobDuration}}</span> |
|
|
|
<span data-tooltip="刷新" style="cursor: pointer;" data-inverted="" onclick="refreshStatus({{.VersionName}})"><i class="redo icon redo-color"></i></span> |
|
|
|
|
|
|
|
</div> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="{{if eq $k 0}}active{{end}} content"> |
|
|
|
<div class="content-pad"> |
|
|
|
<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="item" data-tab="third{{$k}}" onclick="loadModelFile({{.VersionName}},'','','init')">{{$.i18n.Tr "repo.model_download"}}</a> |
|
|
|
</div> |
|
|
|
<div class="ui tab active" data-tab="first{{$k}}"> |
|
|
|
<div style="padding-top: 10px;"> |
|
|
|
<div class="tab_2_content"> |
|
|
|
<div class="ac-grid ac-grid-col2"> |
|
|
|
<div class="ac-grid-col"> |
|
|
|
<table class="ti-form"> |
|
|
|
<tbody class="ti-text-form"> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.cloudbrain_task"}} |
|
|
|
</td> |
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.JobName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.status"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w" id="{{.VersionName}}-status"> |
|
|
|
{{.Status}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.run_version"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.VersionName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.start_time"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
<span style="font-size: 12px;" class="">{{TimeSinceUnix1 .Cloudbrain.CreatedUnix}}</span> |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w" id="{{.VersionName}}-duration"> |
|
|
|
{{.TrainJobDuration}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.standard"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.FlavorName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.compute_node"}} |
|
|
|
</td> |
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.WorkServerNumber}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
<div class="ac-grid-col"> |
|
|
|
<table class="ti-form"> |
|
|
|
<tbody class="ti-text-form"> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.AI_driver"}} |
|
|
|
</td> |
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.EngineName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.code_version"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.BranchName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.start_file"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.BootFile}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.train_dataset"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w"> |
|
|
|
{{.DatasetName}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80" > |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.run_parameter"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w" title="{{.Parameters}}"> |
|
|
|
{{.Parameters}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</tr> |
|
|
|
<tr class="ti-no-ng-animate"> |
|
|
|
<td class="ti-no-ng-animate ti-text-form-label text-width80"> |
|
|
|
{{$.i18n.Tr "repo.modelarts.train_job.description"}} |
|
|
|
</td> |
|
|
|
|
|
|
|
<td class="ti-text-form-content"> |
|
|
|
<div class="text-span text-span-w" title="{{.Cloudbrain.Description}}"> |
|
|
|
{{.Cloudbrain.Description}} |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="ui tab" data-tab="second{{$k}}"> |
|
|
|
<div> |
|
|
|
<div class="ui message message{{.VersionName}}" style="display: none;"> |
|
|
|
<div id="header"></div> |
|
|
|
</div> |
|
|
|
<div class="ui attached log" onscroll="logScroll({{.VersionName}})" id="log{{.VersionName}}" style="height: 300px !important; overflow: auto;"> |
|
|
|
<input type="hidden" name="end_line" value> |
|
|
|
<input type="hidden" name="start_line" value> |
|
|
|
<pre id="log_file{{.VersionName}}"></pre> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="ui tab" data-tab="third{{$k}}"> |
|
|
|
<input type="hidden" name="model{{.VersionName}}" value="-1"> |
|
|
|
<input type="hidden" name="modelback{{.VersionName}}" value="-1"> |
|
|
|
<div class='ui breadcrumb model_file_bread' id='file_breadcrumb{{.VersionName}}'> |
|
|
|
<div class="active section">{{.VersionName}}</div> |
|
|
|
<div class="divider"> / </div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div id="dir_list{{.VersionName}}"> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{{end}} {{template "base/paginate" .}} |
|
|
|
</div> |
|
|
|
<!-- 确认模态框 --> |
|
|
|
<div id="deletemodel"> |
|
|
|
<div class="ui basic modal"> |
|
|
|
<div class="ui icon header"> |
|
|
|
<i class="trash icon"></i> 删除任务 |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="content"> |
|
|
|
<p>你确认删除该任务么？此任务一旦删除不可恢复。</p> |
|
|
|
</div> |
|
|
|
<div class="actions"> |
|
|
|
<div class="ui red basic inverted cancel button"> |
|
|
|
<i class="remove icon"></i> 取消操作 |
|
|
|
</div> |
|
|
|
<div class="ui green basic inverted ok button"> |
|
|
|
<i class="checkmark icon"></i> 确定操作 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 创建模型 --> |
|
|
|
<div id="newmodel"> |
|
|
|
<div class="ui modal second"> |
|
|
|
<div class="header" style="padding: 1rem;background-color: rgba(240, 240, 240, 100);"> |
|
|
|
<h4 id="model_header">导入新模型</h4> |
|
|
|
</div> |
|
|
|
<div class="content content-padding"> |
|
|
|
<form id="formId" method="POST" class="ui form"> |
|
|
|
<div class="ui error message"> |
|
|
|
</div> |
|
|
|
{{$.CsrfTokenHtml}} |
|
|
|
<input type="hidden" name="trainTaskCreate" value="true"> |
|
|
|
|
|
|
|
<div class="two inline fields "> |
|
|
|
<div class="required ten wide field"> |
|
|
|
<label style="margin-left: -23px;">选择训练任务</label> |
|
|
|
<input type="hidden" class="width83" id="JobId" name="JobId" readonly required> |
|
|
|
<input class="width83" id="JobName" readonly required> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="required six widde field"> |
|
|
|
<label>版本</label> |
|
|
|
<input class="width70" id="VersionName" name="VersionName" readonly required> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="required inline field" id="modelname"> |
|
|
|
<label>模型名称</label> |
|
|
|
<input style="width: 45%;" id="name" name="Name" required maxlength="25" onkeyup="this.value=this.value.replace(/[, ]/g,'')"> |
|
|
|
</div> |
|
|
|
<div class="required inline field" id="verionname"> |
|
|
|
<label>模型版本</label> |
|
|
|
<input style="width: 45%;" id="version" name="Version" value="" readonly required maxlength="255"> |
|
|
|
</div> |
|
|
|
<div class="inline field"> |
|
|
|
<label>模型标签</label> |
|
|
|
<input style="width: 83%;margin-left: 7px;" id="label" name="Label" maxlength="255" placeholder='{{.i18n.Tr "repo.modelarts.train_job.label_place"}}'> |
|
|
|
</div> |
|
|
|
<div class="inline field"> |
|
|
|
<label for="description">模型描述</label> |
|
|
|
<textarea style="width: 83%;margin-left: 7px;" id="Description" name="Description" rows="3" maxlength="255" placeholder='{{.i18n.Tr "repo.modelarts.train_job.new_place"}}' onchange="this.value=this.value.substring(0, 255)" onkeydown="this.value=this.value.substring(0, 255)" onkeyup="this.value=this.value.substring(0, 256)"></textarea> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="inline field" style="margin-left: 75px;"> |
|
|
|
<button onclick="createModel()" id="submitId" type="button" class="ui create_train_job green button" style="position: absolute;"> |
|
|
|
{{.i18n.Tr "repo.model.manage.sava_model"}} |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</form> |
|
|
|
<div class="actions" style="display: inline-block;margin-left: 180px;"> |
|
|
|
<button class="ui button cancel" >{{.i18n.Tr "repo.cloudbrain.cancel"}}</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{{template "base/footer" .}} |
|
|
|
|
|
|
|
<script> |
|
|
|
$('.menu .item').tab() |
|
|
|
|
|
|
|
$(document).ready(function(){ |
|
|
|
$('.ui.accordion').accordion({selector:{trigger:'.icon'}}); |
|
|
|
}); |
|
|
|
$(document).ready(function(){ |
|
|
|
$('.secondary.menu .item').tab(); |
|
|
|
}); |
|
|
|
|
|
|
|
let userName |
|
|
|
let repoPath |
|
|
|
let jobID |
|
|
|
$(document).ready(function(){ |
|
|
|
let url = window.location.href; |
|
|
|
let urlArr = url.split('/') |
|
|
|
userName = urlArr.slice(-5)[0] |
|
|
|
repoPath = urlArr.slice(-4)[0] |
|
|
|
jobID = urlArr.slice(-1)[0] |
|
|
|
}) |
|
|
|
function stopBubbling(e) { |
|
|
|
e = window.event || e; |
|
|
|
if (e.stopPropagation) { |
|
|
|
e.stopPropagation(); //阻止事件 冒泡传播 |
|
|
|
} else { |
|
|
|
e.cancelBubble = true; //ie兼容 |
|
|
|
} |
|
|
|
} |
|
|
|
let timeid = window.setInterval(loadJobStatus, 30000); |
|
|
|
$(document).ready(loadJobStatus); |
|
|
|
function showcreate(obj){ |
|
|
|
$('.ui.modal.second') |
|
|
|
.modal({ |
|
|
|
centered: false, |
|
|
|
onShow:function(){ |
|
|
|
$('input[name="Version"]').addClass('model_disabled') |
|
|
|
// $('input[name="JobId"]').text(obj.JobName) |
|
|
|
$('#JobName').val(obj.JobName).addClass('model_disabled') |
|
|
|
$('input[name="JobId"]').val(obj.JobID) |
|
|
|
$('input[name="VersionName"]').val(obj.VersionName).addClass('model_disabled') |
|
|
|
$('.ui.dimmer').css({"background-color":"rgb(136, 136, 136,0.7)"}) |
|
|
|
createModelName() |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
onHide:function(){ |
|
|
|
document.getElementById("formId").reset(); |
|
|
|
$('.ui.dimmer').css({"background-color":""}) |
|
|
|
$('.ui.error.message').text() |
|
|
|
$('.ui.error.message').css('display','none') |
|
|
|
|
|
|
|
} |
|
|
|
}) |
|
|
|
.modal('show') |
|
|
|
} |
|
|
|
function createModel(){ |
|
|
|
let url_href = `/${userName}/${repoPath}/modelmanage/create_new_model` |
|
|
|
let data = $("#formId").serialize() |
|
|
|
$("#mask").css({"display":"block","z-index":"9999"}) |
|
|
|
$.ajax({ |
|
|
|
url:url_href, |
|
|
|
type:'POST', |
|
|
|
data:data, |
|
|
|
success:function(res){ |
|
|
|
location.href=`/${userName}/${repoPath}/modelmanage/show_model` |
|
|
|
$('.ui.modal.second').modal('hide') |
|
|
|
}, |
|
|
|
error: function(xhr){ |
|
|
|
// 隐藏 loading |
|
|
|
// 只有请求不正常（状态码不为200）才会执行 |
|
|
|
$('.ui.error.message').text(xhr.responseText) |
|
|
|
$('.ui.error.message').css('display','block') |
|
|
|
}, |
|
|
|
complete:function(xhr){ |
|
|
|
$("#mask").css({"display":"none","z-index":"1"}) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
function createModelName(){ |
|
|
|
let repoName = location.pathname.split('/')[2] |
|
|
|
let modelName = repoName + '_model_' + Math.random().toString(36).substr(2, 4) |
|
|
|
$('#name').val(modelName) |
|
|
|
$('#version').val("0.0.1") |
|
|
|
} |
|
|
|
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 loadJobStatus() { |
|
|
|
$(".ui.accordion.border-according").each((index, job) => { |
|
|
|
const jobID = job.dataset.jobid; |
|
|
|
const repoPath = job.dataset.repopath; |
|
|
|
const versionname = job.dataset.version |
|
|
|
// ['IMAGE_FAILED','SUBMIT_FAILED','DELETE_FAILED','KILLED','COMPLETED','FAILED','CANCELED','LOST','START_FAILED'] |
|
|
|
// if (job.textContent.trim() == 'IMAGE_FAILED' || job.textContent.trim() == 'SUBMIT_FAILED' || job.textContent.trim() == 'DELETE_FAILED' |
|
|
|
// || job.textContent.trim() == 'KILLED' || job.textContent.trim() == 'COMPLETED' || job.textContent.trim() == 'FAILED' |
|
|
|
// || job.textContent.trim() == 'CANCELED' || job.textContent.trim() == 'LOST') { |
|
|
|
// return |
|
|
|
// } |
|
|
|
let status = $(`#${versionname}-status-span`).text() |
|
|
|
|
|
|
|
if(['IMAGE_FAILED','SUBMIT_FAILED','DELETE_FAILED','KILLED','COMPLETED','FAILED','CANCELED','LOST','START_FAILED'].includes(status)){ |
|
|
|
return |
|
|
|
} |
|
|
|
let stopArray=["KILLED","FAILED","START_FAILED","KILLING","COMPLETED"] |
|
|
|
$.get(`/api/v1/repos/${repoPath}/modelarts/train-job/${jobID}?version_name=${versionname}`, (data) => { |
|
|
|
$(`#${versionname}-duration-span`).text(data.JobDuration) |
|
|
|
$(`#${versionname}-status-span span`).text(data.JobStatus) |
|
|
|
$(`#${versionname}-status-span i`).attr("class",data.JobStatus) |
|
|
|
// detail status and duration |
|
|
|
$('#'+versionname+'-duration').text(data.JobDuration) |
|
|
|
$('#'+versionname+'-status').text(data.JobStatus) |
|
|
|
if(stopArray.includes(data.JobStatus)){ |
|
|
|
$('#'+versionname+'-stop').addClass('disabled') |
|
|
|
} |
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err); |
|
|
|
}); |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
function refreshStatus(version_name){ |
|
|
|
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}?version_name=${version_name}`,(data)=>{ |
|
|
|
// header status and duration |
|
|
|
$(`#${version_name}-duration-span`).text(data.JobDuration) |
|
|
|
$(`#${version_name}-status-span span`).text(data.JobStatus) |
|
|
|
$(`#${version_name}-status-span i`).attr("class",data.JobStatus) |
|
|
|
// detail status and duration |
|
|
|
$('#'+version_name+'-duration').text(data.JobDuration) |
|
|
|
$('#'+version_name+'-status').text(data.JobStatus) |
|
|
|
loadLog(version_name) |
|
|
|
|
|
|
|
|
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err); |
|
|
|
}); |
|
|
|
stopBubbling(arguments.callee.caller.arguments[0]) |
|
|
|
} |
|
|
|
function deleteVersion(version_name){ |
|
|
|
stopBubbling(arguments.callee.caller.arguments[0]) |
|
|
|
let flag = 1; |
|
|
|
$('.ui.basic.modal').modal({ |
|
|
|
onDeny: function() { |
|
|
|
flag = false |
|
|
|
}, |
|
|
|
onApprove: function() { |
|
|
|
$.post(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/del_version`,{version_name:version_name},(data)=>{ |
|
|
|
if(data.VersionListCount===0){ |
|
|
|
location.href=`/${userName}/${repoPath}/modelarts/train-job` |
|
|
|
}else{ |
|
|
|
$('#accordion'+version_name).remove() |
|
|
|
} |
|
|
|
|
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err); |
|
|
|
}); |
|
|
|
flag = true |
|
|
|
}, |
|
|
|
onHidden: function() { |
|
|
|
if (flag == false) { |
|
|
|
$('.alert').html('您已取消操作').removeClass('alert-success').addClass('alert-danger').show().delay(1500).fadeOut(); |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
.modal('show') |
|
|
|
|
|
|
|
} |
|
|
|
function stopVersion(version_name){ |
|
|
|
stopBubbling(arguments.callee.caller.arguments[0]) |
|
|
|
$.post(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/stop_version`,{version_name:version_name},(data)=>{ |
|
|
|
if(data.StatusOK===0){ |
|
|
|
$('#'+version_name+'-stop').addClass('disabled') |
|
|
|
refreshStatus(version_name) |
|
|
|
} |
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err); |
|
|
|
}); |
|
|
|
} |
|
|
|
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) |
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err); |
|
|
|
}); |
|
|
|
} |
|
|
|
function loadModelFile(version_name,parents,filename,init){ |
|
|
|
parents = parents || '' |
|
|
|
filename = filename || '' |
|
|
|
init = init || '' |
|
|
|
$.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/model_list?version_name=${version_name}&parentDir=${parents}`, (data) => { |
|
|
|
$(`#dir_list${version_name}`).empty() |
|
|
|
renderDir(data,version_name) |
|
|
|
if(init==="init"){ |
|
|
|
$(`input[name=model${version_name}]`).val("") |
|
|
|
$(`input[name=modelback${version_name}]`).val(version_name) |
|
|
|
$(`#file_breadcrumb${version_name}`).empty() |
|
|
|
let htmlBread = "" |
|
|
|
htmlBread += `<div class='active section'>${version_name}</div>` |
|
|
|
htmlBread += "<div class='divider'> / </div>" |
|
|
|
$(`#file_breadcrumb${version_name}`).append(htmlBread) |
|
|
|
}else{ |
|
|
|
renderBrend(version_name,parents,filename,init) |
|
|
|
} |
|
|
|
}).fail(function(err) { |
|
|
|
console.log(err,version_name); |
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
function renderBrend(version_name,parents,filename,init){ |
|
|
|
if(init=="folder"){ |
|
|
|
let htmlBrend = "" |
|
|
|
let sectionName=$(`#file_breadcrumb${version_name} .active.section`).text() |
|
|
|
let parents1 = $(`input[name=model${version_name}]`).val() |
|
|
|
let filename1 = $(`input[name=modelback${version_name}]`).val() |
|
|
|
if(parents1===""){ |
|
|
|
$(`#file_breadcrumb${version_name} .active.section`).replaceWith(`<a class='section' onclick="loadModelFile('${version_name}','${parents1}','','init')">${sectionName}</a>`) |
|
|
|
}else{ |
|
|
|
$(`#file_breadcrumb${version_name} .active.section`).replaceWith(`<a class='section' onclick="loadModelFile('${version_name}','${parents1}','${filename1}')">${sectionName}</a>`) |
|
|
|
} |
|
|
|
|
|
|
|
htmlBrend += `<div class='active section'>${filename}</div>` |
|
|
|
htmlBrend += "<div class='divider'> / </div>" |
|
|
|
$(`#file_breadcrumb${version_name}`).append(htmlBrend) |
|
|
|
$(`input[name=model${version_name}]`).val(parents) |
|
|
|
$(`input[name=modelback${version_name}]`).val(filename) |
|
|
|
}else{ |
|
|
|
$(`input[name=model${version_name}]`).val(parents) |
|
|
|
$(`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>") |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
function renderDir(data,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>' |
|
|
|
// html += "</tbody>" |
|
|
|
for(let i=0;i<data.Dirs.length;i++){ |
|
|
|
let dirs_size = renderSize(data.Dirs[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.Dirs[i].IsDir){ |
|
|
|
html += `<a onclick="loadModelFile('${version_name}','${data.Dirs[i].ParenDir}','${data.Dirs[i].FileName}','folder')">` |
|
|
|
html += "<span class='fitted'><i class='folder icon' width='16' height='16' aria-hidden='true'></i>" + data.Dirs[i].FileName + "</span>" |
|
|
|
}else{ |
|
|
|
html += `<a href="${location.href}/model_download?version_name=${version_name}&file_name=${data.Dirs[i].FileName}&parent_dir=${data.Dirs[i].ParenDir}">` |
|
|
|
html += "<span class='fitted'><i class='file icon' width='16' height='16' aria-hidden='true'></i>" + data.Dirs[i].FileName + "</span>" |
|
|
|
} |
|
|
|
html += '</a>' |
|
|
|
html += "</span>" |
|
|
|
html += "</td>" |
|
|
|
html += "<td class='message seven wide'>" |
|
|
|
if(data.Dirs[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.Dirs[i].ModTime + "</span>" |
|
|
|
html += "</td>" |
|
|
|
html += "</tr>" |
|
|
|
|
|
|
|
} |
|
|
|
html += "</tbody>" |
|
|
|
html += "</table>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
html += "</div>" |
|
|
|
$(`#dir_list${version_name}`).append(html) |
|
|
|
} |
|
|
|
|
|
|
|
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) && (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(scrollTop == 0 && 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); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
